feat: create tag function

ui/src/locales/lang/zh-CN/views/application-workflow.ts

@@ -450,18 +450,18 @@ export default {
         placeholder: '请输入表达式',
       },
     },
-    parameterExtractionNode: {
-      label: '参数提取',
-      text: '利用 AI 模型提取结构化参数',
-      result: '结果',
+   parameterExtractionNode: {
+      label: '參數提取',
+      text: '利用 AI 模型提取結構化參數',
+      result: '結果',
       selectVariables: {
-        label: '选择变量',
-        placeholder: '请选择变量',
+        label: '選擇變量',
+        placeholder: '請選擇變量',
       },
       extractParameters: {
-        label: '提取参数',
+        label: '提取參數',
         desc: '描述',
-        parameterType: '参数类型',
+        parameterType: '參數類型',
       },
     },
   },

ui/src/locales/lang/zh-Hant/views/application-workflow.ts

@@ -424,16 +424,16 @@ export default {
       },
     },
     parameterExtractionNode: {
-      label: 'Parameter Extraction',
-      text: 'Extract structured parameters using AI model',
-      result: 'Result',
+      label: '參數提取',
+      text: ' ',
+      result: '結果',
       selectVariables: {
-        label: 'Select Variables',
-        placeholder: 'Please select variables',
+        label: ' ',
+        placeholder: '請選擇要提取的參數',
       },
       extractParameters: {
-        label: 'Extract Parameters',
-        desc: 'Description',
+        label: '提取參數',
+        desc: '從文本中提取參數',
         parameterType: 'Parameter Type',
       },
     },

ui/src/views/document/component/AddTagDialog.vue

@@ -1,9 +1,5 @@
 <template>
-  <el-dialog
-    v-model="dialogVisible"
-    :title="$t('views.document.tag.add')"
-    :before-close="close"
-  >
+  <el-dialog v-model="dialogVisible" :title="$t('views.document.tag.add')" :before-close="close">
     <el-form
       ref="FormRef"
       :model="{ tags }"
@@ -12,34 +8,52 @@
       @submit.prevent
     >
       <div class="flex-between flex" v-for="(tag, index) in tags" :key="tag">
-        <el-form-item :label="index === 0? $t('views.document.tag.key') : ''"
-                      :prop="`tags.${index}.key`"
-                      style="width: 50%"
-                      :rules="{ required: true, message: $t('views.document.tag.requiredMessage1'), trigger: 'blur' }">
+        <el-form-item
+          :label="index === 0 ? $t('views.document.tag.key') : ''"
+          :prop="`tags.${index}.key`"
+          style="width: 50%"
+          :rules="{
+            required: true,
+            message: $t('views.document.tag.requiredMessage1'),
+            trigger: 'blur',
+          }"
+        >
           <el-select v-model="tag.key" @change="tagKeyChange(tag)" filterable>
-            <el-option v-for="op in keyOptions" :key="op" :value="op.key"
-                       :label="op.key"></el-option>
+            <el-option
+              v-for="op in keyOptions"
+              :key="op"
+              :value="op.key"
+              :label="op.key"
+            ></el-option>
           </el-select>
         </el-form-item>
-        <el-form-item :label="index === 0? $t('views.document.tag.value') : ''"
-                      :prop="`tags.${index}.value`"
-                      style="width: 50%"
-                      :rules="{ required: true, message: $t('views.document.tag.requiredMessage2'), trigger: 'blur' }">
+        <el-form-item
+          :label="index === 0 ? $t('views.document.tag.value') : ''"
+          :prop="`tags.${index}.value`"
+          style="width: 50%"
+          :rules="{
+            required: true,
+            message: $t('views.document.tag.requiredMessage2'),
+            trigger: 'blur',
+          }"
+        >
           <el-select v-model="tag.value" filterable>
-            <el-option v-for="op in tag.valueOptions" :key="op" :value="op.id"
-                       :label="op.value"></el-option>
+            <el-option
+              v-for="op in tag.valueOptions"
+              :key="op"
+              :value="op.id"
+              :label="op.value"
+            ></el-option>
           </el-select>
         </el-form-item>
       </div>
     </el-form>
 
+    <el-button link type="primary" @click="add">
+      <AppIcon iconName="app-add-outlined" class="mr-4" />
+      {{ $t('common.add') }}
+    </el-button>
 
-    <div class="mt-20">
-      <el-button link type="primary" @click="add">
-        <AppIcon iconName="app-add-outlined" class="mr-4"/>
-        {{ $t('common.add') }}
-      </el-button>
-    </div>
     <template #footer>
       <div class="dialog-footer">
         <el-button @click="close">{{ $t('common.cancel') }}</el-button>
@@ -50,14 +64,14 @@
 </template>
 <script setup lang="ts">
 import { ref } from 'vue'
-import AppIcon from "@/components/app-icon/AppIcon.vue";
+import AppIcon from '@/components/app-icon/AppIcon.vue'
 
 const emit = defineEmits(['addTags'])
 const props = defineProps({
   knowledgeTags: {
     type: Array,
-    default: () => []
-  }
+    default: () => [],
+  },
 })
 
 const FormRef = ref()
@@ -78,7 +92,10 @@ function tagKeyChange(tag: any) {
 const submit = () => {
   FormRef.value.validate((valid: boolean) => {
     if (!valid) return
-    emit('addTags', tags.value.map(tag => tag.value))
+    emit(
+      'addTags',
+      tags.value.map((tag) => tag.value),
+    )
   })
 }
 
@@ -92,6 +109,6 @@ const close = () => {
   dialogVisible.value = false
 }
 
-defineExpose({open, close})
+defineExpose({ open, close })
 </script>
 <style lang="scss" scoped></style>

ui/src/views/document/component/CreateTagDialog.vue

@@ -1,107 +0,0 @@
-<template>
-  <el-dialog
-    v-model="dialogVisible"
-    :title="$t('views.document.tag.create')"
-    :before-close="close"
-  >
-    <el-form
-      ref="FormRef"
-      :model="{ tags }"
-      label-position="top"
-      require-asterisk-position="right"
-      @submit.prevent
-    >
-      <div class="flex-between" v-for="(tag, index) in tags" :key="tag">
-        <el-form-item :label="index === 0? $t('views.document.tag.key') : ''"
-                      :prop="`tags.${index}.key`"
-                      style="width: 50%"
-                      :rules="{ required: true, message: $t('views.document.tag.requiredMessage1'), trigger: 'blur' }">
-          <el-input v-model="tag.key" :disabled="currentTagKey"></el-input>
-        </el-form-item>
-        <el-form-item :label="index === 0? $t('views.document.tag.value') : ''"
-                      :prop="`tags.${index}.value`"
-                      style="width: 50%"
-                      :rules="{ required: true, message: $t('views.document.tag.requiredMessage2'), trigger: 'blur' }">
-          <el-input v-model="tag.value"></el-input>
-        </el-form-item>
-      </div>
-    </el-form>
-
-
-    <div class="mt-20">
-      <el-button link type="primary" @click="add">
-        <AppIcon iconName="app-add-outlined" class="mr-4"/>
-        {{ $t('common.add') }}
-      </el-button>
-    </div>
-    <template #footer>
-      <div class="dialog-footer">
-        <el-button @click="close">{{ $t('common.cancel') }}</el-button>
-        <el-button type="primary" @click="submit">{{ $t('common.confirm') }}</el-button>
-      </div>
-    </template>
-  </el-dialog>
-</template>
-<script setup lang="ts">
-import { computed, ref } from 'vue'
-import AppIcon from "@/components/app-icon/AppIcon.vue";
-import { useRoute } from "vue-router";
-import { loadSharedApi } from "@/utils/dynamics-api/shared-api.ts";
-import { cloneDeep } from "lodash";
-
-const route = useRoute()
-const {
-  params: {id}, // id为knowledgeID
-} = route as any
-const emit = defineEmits(['refresh'])
-
-const apiType = computed(() => {
-  if (route.path.includes('shared')) {
-    return 'systemShare'
-  } else if (route.path.includes('resource-management')) {
-    return 'systemManage'
-  } else {
-    return 'workspace'
-  }
-})
-
-const FormRef = ref()
-const loading = ref(false)
-const dialogVisible = ref<boolean>(false)
-const currentTagKey = ref(null)
-const tags = ref<Array<any>>([])
-
-const add = () => {
-  if (currentTagKey.value) {
-    tags.value.push({key: currentTagKey.value})
-  } else {
-    tags.value.push({})
-  }
-}
-
-const submit = () => {
-  FormRef.value.validate((valid: boolean) => {
-    if (!valid) return
-    loadSharedApi({type: 'knowledge', systemType: apiType.value})
-      .postTags(id, tags.value, loading)
-      .then((res: any) => {
-        close()
-        emit('refresh')
-      })
-  })
-}
-
-const open = (row?: any) => {
-  const currentRow = cloneDeep(row)
-  dialogVisible.value = true
-  currentTagKey.value = currentRow ? currentRow.key : null
-  tags.value = currentRow ? [{...{key: currentRow.key}}] : [{}]
-}
-
-const close = () => {
-  dialogVisible.value = false
-}
-
-defineExpose({open, close})
-</script>
-<style lang="scss" scoped></style>

ui/src/views/document/index.vue

@@ -685,8 +685,8 @@ import { TaskType, State } from '@/utils/status'
 import { t } from '@/locales'
 import permissionMap from '@/permission'
 import { loadSharedApi } from '@/utils/dynamics-api/shared-api'
-import TagDrawer from "./component/TagDrawer.vue";
-import TagSettingDrawer from "./component/TagSettingDrawer.vue";
+import TagDrawer from "./tag/TagDrawer.vue";
+import TagSettingDrawer from "./tag/TagSettingDrawer.vue";
 import AddTagDialog from "@/views/document/component/AddTagDialog.vue";
 
 const route = useRoute()

ui/src/views/document/tag/CreateTagDialog.vue

@@ -0,0 +1,146 @@
+<template>
+  <el-dialog v-model="dialogVisible" :title="$t('views.document.tag.create')" :before-close="close">
+    <el-form
+      ref="FormRef"
+      :model="{ tags }"
+      label-position="top"
+      require-asterisk-position="right"
+      @submit.prevent
+    >
+      <el-scrollbar>
+        <el-row :gutter="8" align="bottom" style="margin-right: 10px" class="tag-list-max-list">
+          <template v-for="(tag, index) in tags" :key="tag">
+            <el-col :span="12">
+              <el-form-item
+                :label="index === 0 ? $t('views.document.tag.key') : ''"
+                :prop="`tags.${index}.key`"
+                :rules="{
+                  required: true,
+                  message: $t('views.document.tag.requiredMessage1'),
+                  trigger: 'blur',
+                }"
+              >
+                <el-input
+                  v-model="tag.key"
+                  :disabled="currentTagKey"
+                  class="w-full"
+                  :placeholder="$t('views.document.tag.requiredMessage1')"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="11">
+              <el-form-item
+                :label="index === 0 ? $t('views.document.tag.value') : ''"
+                :prop="`tags.${index}.value`"
+                :rules="{
+                  required: true,
+                  message: $t('views.document.tag.requiredMessage2'),
+                  trigger: 'blur',
+                }"
+                class="w-full"
+              >
+                <el-input
+                  v-model="tag.value"
+                  :placeholder="$t('views.document.tag.requiredMessage2')"
+                ></el-input>
+              </el-form-item>
+            </el-col>
+            <el-col :span="1">
+              <el-button
+                :disabled="index === 0"
+                link
+                type="info"
+                @click="deleteTag(index)"
+                class="mb-24"
+              >
+                <AppIcon iconName="app-delete"></AppIcon>
+              </el-button>
+            </el-col>
+          </template>
+        </el-row>
+      </el-scrollbar>
+    </el-form>
+
+    <el-button link type="primary" @click="add">
+      <AppIcon iconName="app-add-outlined" class="mr-4" />
+      {{ $t('common.add') }}
+    </el-button>
+
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="close">{{ $t('common.cancel') }}</el-button>
+        <el-button type="primary" @click="submit">{{ $t('common.confirm') }}</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+<script setup lang="ts">
+import { computed, ref } from 'vue'
+import AppIcon from '@/components/app-icon/AppIcon.vue'
+import { useRoute } from 'vue-router'
+import { loadSharedApi } from '@/utils/dynamics-api/shared-api.ts'
+import { cloneDeep } from 'lodash'
+
+const route = useRoute()
+const {
+  params: { id }, // id为knowledgeID
+} = route as any
+const emit = defineEmits(['refresh'])
+
+const apiType = computed(() => {
+  if (route.path.includes('shared')) {
+    return 'systemShare'
+  } else if (route.path.includes('resource-management')) {
+    return 'systemManage'
+  } else {
+    return 'workspace'
+  }
+})
+
+const FormRef = ref()
+const loading = ref(false)
+const dialogVisible = ref<boolean>(false)
+const currentTagKey = ref(null)
+const tags = ref<Array<any>>([])
+
+const add = () => {
+  if (currentTagKey.value) {
+    tags.value.push({ key: currentTagKey.value })
+  } else {
+    tags.value.push({})
+  }
+}
+const deleteTag = (index: number) => {
+  tags.value.splice(index, 1)
+}
+
+const submit = () => {
+  FormRef.value.validate((valid: boolean) => {
+    if (!valid) return
+    loadSharedApi({ type: 'knowledge', systemType: apiType.value })
+      .postTags(id, tags.value, loading)
+      .then((res: any) => {
+        close()
+        emit('refresh')
+      })
+  })
+}
+
+const open = (row?: any) => {
+  const currentRow = cloneDeep(row)
+  dialogVisible.value = true
+  currentTagKey.value = currentRow ? currentRow.key : null
+  tags.value = currentRow ? [{ ...{ key: currentRow.key } }] : [{}]
+}
+
+const close = () => {
+  dialogVisible.value = false
+}
+
+defineExpose({ open, close })
+</script>
+<style lang="scss" scoped>
+.tag-list-max-list {
+  max-height: calc(100vh - 260px);
+}
+</style>

ui/src/views/document/tag/TagDrawer.vue

@@ -3,11 +3,10 @@
     <template #header>
       <h4>{{ $t('views.document.tag.label') }}</h4>
     </template>
-    <div class="flex-between">
+    <div class="flex-between mb-16">
       <div>
-        <el-button type="primary" @click="openCreateTagDialog()">{{
-            $t('views.document.tag.create')
-          }}
+        <el-button type="primary" @click="openCreateTagDialog()"
+          >{{ $t('views.document.tag.create') }}
         </el-button>
         <el-button :disabled="multipleSelection.length === 0" @click="batchDelete">
           {{ $t('common.delete') }}
@@ -19,6 +18,7 @@
         class="w-240"
         @change="getList"
         clearable
+        :placeholder="$t('common.search')"
       />
     </div>
     <el-table
@@ -27,21 +27,24 @@
       v-loading="loading"
       @selection-change="handleSelectionChange"
     >
-      <el-table-column type="selection" width="55"/>
+      <el-table-column type="selection" width="55" />
       <el-table-column :label="$t('views.document.tag.key')">
         <template #default="{ row }">
           <div class="flex-between">
             {{ row.key }}
             <div>
               <el-button link>
-                <AppIcon iconName="app-add-outlined" class="mr-4"
-                         @click="openCreateTagDialog(row)"/>
+                <AppIcon
+                  iconName="app-add-outlined"
+                  class="mr-4"
+                  @click="openCreateTagDialog(row)"
+                />
               </el-button>
               <el-button link>
-                <AppIcon iconName="app-edit" class="mr-4" @click="editTagKey(row)"/>
+                <AppIcon iconName="app-edit" class="mr-4" @click="editTagKey(row)" />
               </el-button>
               <el-button link>
-                <AppIcon iconName="app-delete" class="mr-4" @click="delTag(row)"/>
+                <AppIcon iconName="app-delete" class="mr-4" @click="delTag(row)" />
               </el-button>
             </div>
           </div>
@@ -53,10 +56,10 @@
             {{ row.value }}
             <div>
               <el-button link>
-                <AppIcon iconName="app-edit" class="mr-4" @click="editTagValue(row)"/>
+                <AppIcon iconName="app-edit" class="mr-4" @click="editTagValue(row)" />
               </el-button>
               <el-button link>
-                <AppIcon iconName="app-delete" class="mr-4" @click="delTagValue(row)"/>
+                <AppIcon iconName="app-delete" class="mr-4" @click="delTagValue(row)" />
               </el-button>
             </div>
           </div>
@@ -64,24 +67,24 @@
       </el-table-column>
     </el-table>
   </el-drawer>
-  <CreateTagDialog ref="createTagDialogRef" @refresh="getList"/>
-  <EditTagDialog ref="editTagDialogRef" @refresh="getList"/>
+  <CreateTagDialog ref="createTagDialogRef" @refresh="getList" />
+  <EditTagDialog ref="editTagDialogRef" @refresh="getList" />
 </template>
 
 <script setup lang="ts">
 import { computed, ref } from 'vue'
 import { useRoute } from 'vue-router'
-import { loadSharedApi } from "@/utils/dynamics-api/shared-api.ts"
-import CreateTagDialog from "./CreateTagDialog.vue"
-import { MsgConfirm } from "@/utils/message.ts";
-import { t } from "@/locales";
-import EditTagDialog from "@/views/document/component/EditTagDialog.vue";
+import { loadSharedApi } from '@/utils/dynamics-api/shared-api.ts'
+import CreateTagDialog from './CreateTagDialog.vue'
+import { MsgConfirm } from '@/utils/message.ts'
+import { t } from '@/locales'
+import EditTagDialog from '@/views/document/tag/EditTagDialog.vue'
 
 const emit = defineEmits(['refresh'])
 
 const route = useRoute()
 const {
-  params: {id}, // id为knowledgeID
+  params: { id }, // id为knowledgeID
 } = route as any
 
 const apiType = computed(() => {
@@ -109,7 +112,7 @@ const tableData = computed(() => {
           id: value.id,
           key: tag.key,
           value: value.value,
-          keyIndex: index // 用于判断是否为第一行
+          keyIndex: index, // 用于判断是否为第一行
         })
       })
     }
@@ -117,33 +120,31 @@ const tableData = computed(() => {
   return result
 })
 
-
 // 合并单元格方法
-const spanMethod = ({row, column, rowIndex, columnIndex}: any) => {
-  if (columnIndex === 0 || columnIndex === 1) { // key列 (由于添加了选择列，索引变为1)
+const spanMethod = ({ row, column, rowIndex, columnIndex }: any) => {
+  if (columnIndex === 0 || columnIndex === 1) {
+    // key列 (由于添加了选择列，索引变为1)
     if (row.keyIndex === 0) {
       // 计算当前key有多少个值
-      const sameKeyCount = tableData.value.filter(item => item.key === row.key).length
+      const sameKeyCount = tableData.value.filter((item) => item.key === row.key).length
       return {
         rowspan: sameKeyCount,
-        colspan: 1
+        colspan: 1,
       }
     } else {
       return {
         rowspan: 0,
-        colspan: 0
+        colspan: 0,
       }
     }
   }
 }
 
-
 const multipleSelection = ref<any[]>([])
 const handleSelectionChange = (val: any[]) => {
   multipleSelection.value = val
 }
 
-
 const createTagDialogRef = ref()
 
 function openCreateTagDialog(row?: any) {
@@ -156,15 +157,14 @@ function batchDelete() {
     confirmButtonClass: 'danger',
   })
     .then(() => {
-      const tagsToDelete = multipleSelection.value.map(item => item.id)
-      loadSharedApi({type: 'knowledge', systemType: apiType.value})
+      const tagsToDelete = multipleSelection.value.map((item) => item.id)
+      loadSharedApi({ type: 'knowledge', systemType: apiType.value })
         .delMulTag(id, tagsToDelete)
         .then(() => {
           getList()
         })
     })
-    .catch(() => {
-    })
+    .catch(() => {})
 }
 
 const editTagDialogRef = ref()
@@ -179,14 +179,13 @@ function delTag(row: any) {
     confirmButtonClass: 'danger',
   })
     .then(() => {
-      loadSharedApi({type: 'knowledge', systemType: apiType.value})
+      loadSharedApi({ type: 'knowledge', systemType: apiType.value })
         .delTag(id, row.id, 'key')
         .then(() => {
           getList()
         })
     })
-    .catch(() => {
-    })
+    .catch(() => {})
 }
 
 function editTagValue(row: any) {
@@ -194,26 +193,29 @@ function editTagValue(row: any) {
 }
 
 function delTagValue(row: any) {
-  MsgConfirm(t('views.document.tag.deleteConfirm') + row.key + '-' + row.value, t('views.document.tag.deleteTip'), {
-    confirmButtonText: t('common.delete'),
-    confirmButtonClass: 'danger',
-  })
+  MsgConfirm(
+    t('views.document.tag.deleteConfirm') + row.key + '-' + row.value,
+    t('views.document.tag.deleteTip'),
+    {
+      confirmButtonText: t('common.delete'),
+      confirmButtonClass: 'danger',
+    },
+  )
     .then(() => {
-      loadSharedApi({type: 'knowledge', systemType: apiType.value})
+      loadSharedApi({ type: 'knowledge', systemType: apiType.value })
         .delTag(id, row.id, 'one')
         .then(() => {
           getList()
         })
     })
-    .catch(() => {
-    })
+    .catch(() => {})
 }
 
 function getList() {
   const params = {
-    ...(filterText.value && {name: filterText.value}),
+    ...(filterText.value && { name: filterText.value }),
   }
-  loadSharedApi({type: 'knowledge', systemType: apiType.value})
+  loadSharedApi({ type: 'knowledge', systemType: apiType.value })
     .getTags(id, params, loading)
     .then((res: any) => {
       tags.value = res.data

ui/src/workflow/nodes/loop-break-node/index.vue

@@ -94,8 +94,9 @@
                 <AppIcon iconName="app-delete"></AppIcon>
               </el-button>
             </el-col>
-          </el-row> </template
-      ></el-form>
+          </el-row>
+        </template>
+      </el-form>
 
       <el-button link type="primary" @click="addCondition()">
         <AppIcon iconName="app-add-outlined" class="mr-4"></AppIcon>

ui/src/workflow/nodes/loop-continue-node/index.vue

@@ -94,8 +94,9 @@
                 <AppIcon iconName="app-delete"></AppIcon>
               </el-button>
             </el-col>
-          </el-row> </template
-      ></el-form>
+          </el-row>
+        </template>
+      </el-form>
 
       <el-button link type="primary" @click="addCondition()">
         <AppIcon iconName="app-add-outlined" class="mr-4"></AppIcon>