perf: Optimize some front-end pages

Author: wangdan-fit2cloud

ui/src/views/application/component/AddKnowledgeDialog.vue

@@ -80,7 +80,7 @@
     <template #footer>
       <div class="flex-between">
         <div class="flex">
-          <el-text type="info" class="color-secondary mr-8" v-if="checkList.length > 0">
+          <el-text class="color-secondary mr-8" v-if="checkList.length > 0">
             {{ $t('common.selected') }} {{ checkList.length }}
           </el-text>
           <el-button link type="primary" v-if="checkList.length > 0" @click="clearCheck">

ui/src/views/paragraph/component/ParagraphCard.vue

@@ -128,7 +128,7 @@
   </el-card>
 </template>
 <script setup lang="ts">
-import {ref, computed, watch, onMounted} from 'vue'
+import { ref, computed, watch, onMounted } from 'vue'
 import { useRoute } from 'vue-router'
 import GenerateRelatedDialog from '@/components/generate-related-dialog/index.vue'
 import ParagraphDialog from '@/views/paragraph/component/ParagraphDialog.vue'
@@ -208,7 +208,6 @@ function getDetail() {
     })
 }
 
-
 const GenerateRelatedDialogRef = ref<InstanceType<typeof GenerateRelatedDialog>>()
 function openGenerateDialog(row: any) {
   if (GenerateRelatedDialogRef.value) {
@@ -239,8 +238,8 @@ const ParagraphDialogRef = ref()
 const title = ref('')
 function editParagraph(row: any) {
   if (!props.disabled) {
-    title.value = t('views.paragraph.paragraphDetail')
-    ParagraphDialogRef.value.open(row)
+    title.value = t('views.paragraph.editParagraph')
+    ParagraphDialogRef.value.open(row, 'edit')
   }
 }
 
@@ -251,7 +250,8 @@ function handleClickCard(row: any) {
     return
   }
   if (!props.disabled) {
-    editParagraph(row)
+    title.value = t('views.paragraph.paragraphDetail')
+    ParagraphDialogRef.value.open(row)
   } else {
     emit('clickCard')
   }

ui/src/views/paragraph/component/ParagraphDialog.vue

@@ -112,18 +112,23 @@ const cancelEdit = () => {
 }
 
 const open = (data: any, str: any) => {
-  if (data && !str) {
+  if (data && str === 'add') {
+    isEdit.value = true
+    position.value = data.position
+  } else if (data) {
     detail.value.title = data.title
     detail.value.content = data.content
     cloneData.value = cloneDeep(detail.value)
     paragraphId.value = data.id
     document_id.value = data.document_id
     dataset_id.value = data.dataset_id || id
+    if (str === 'edit') {
+      isEdit.value = true
+    } else {
+      isEdit.value = false
+    }
   } else {
     isEdit.value = true
-    if (str === 'add') {
-      position.value = data.position
-    }
   }
   dialogVisible.value = true
 }

ui/src/views/paragraph/index.vue

@@ -62,7 +62,7 @@
                 container=".paragraph-scollbar"
                 @click="handleClick"
               >
-                <template v-for="(item) in paragraphDetail" :key="item.id">
+                <template v-for="item in paragraphDetail" :key="item.id">
                   <el-anchor-link :href="`#m${item.id}`" :title="item.title" v-if="item.title">
                     <span :title="item.title">
                       {{ item.title }}
@@ -171,10 +171,13 @@
         <el-button :disabled="multipleSelection.length === 0" @click="deleteMulParagraph">
           {{ $t('common.delete') }}
         </el-button>
-        <span class="ml-24">
+        <span class="color-secondary ml-24 mr-16">
           {{ $t('common.selected') }} {{ multipleSelection.length }}
           {{ $t('views.document.items') }}
         </span>
+        <el-button link type="primary" v-if="multipleSelection.length > 0" @click="multipleSelection = []">
+          {{ $t('common.clear') }}
+        </el-button>
       </div>
     </el-card>
     <ParagraphDialog
@@ -236,7 +239,6 @@ const searchTypeChange = () => {
   search.value = ''
 }
 
-
 const dialogVisible = ref(false)
 watch(
   () => ParagraphDialogRef.value?.dialogVisible,

ui/src/views/problem/component/DetailProblemDrawer.vue

@@ -160,7 +160,7 @@ function relateProblem() {
 }
 
 function editParagraph(row: any) {
-  ParagraphDialogRef.value.open(row)
+  ParagraphDialogRef.value.open(row, 'edit')
 }
 
 function editName(val: string) {

ui/src/views/system/role/component/MemberFormContent.vue

@@ -32,7 +32,7 @@
               :key="opt.value"
               :label="opt.label"
               :value="opt.value"
-              :disabled="opt.disabledFunction?.(element)"
+              :disabled="selectedRoles.includes(opt.value)"
             >
               <el-tooltip effect="dark" :content="opt.label" placement="top" :show-after="500">
                 <div class="ellipsis" style="max-width: 190px">{{ opt.label }}</div>
@@ -55,7 +55,6 @@
         </el-button>
       </div>
     </el-scrollbar>
-
     <!-- 添加按钮 -->
     <el-button type="primary" text class="mt-2" @click="handleAdd">
       <el-icon class="mr-4">
@@ -67,7 +66,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref, watch } from 'vue'
+import { ref, watch, computed } from 'vue'
 import type { FormItemModel } from '@/api/type/role'
 
 const props = defineProps<{
@@ -83,6 +82,10 @@ const form = defineModel<Record<string, any>[]>('form', {
   default: [],
 })
 
+const selectedRoles = computed(() => {
+  return form.value.map((item) => item.role_id)
+})
+
 function handleAdd() {
   form.value.push({ ...formItem })
 }