perf: select perform

src/components/Apps/AssetTreeTable/index.vue

@@ -159,7 +159,6 @@ export default {
     },
     getAssetsUrl(treeNode) {
       let url = this.treeSetting?.url || this.url
-      console.log(treeNode, url)
       if (treeNode.meta.type === 'node') {
         const nodeId = treeNode.meta.data.id
         url = setUrlParam(url, 'node_id', nodeId)

src/components/Cards/RelationCard/index.vue

@@ -17,7 +17,13 @@
       <template v-if="showHasObjects">
         <tr v-for="obj of iHasObjects" :key="obj.value" class="item">
           <td style="width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;">
-            <el-tooltip :content="obj.label" :open-delay="500" effect="dark" placement="left" style="margin: 4px;">
+            <el-tooltip
+              :content="obj.label.toString()"
+              :open-delay="500"
+              effect="dark"
+              placement="left"
+              style="margin: 4px;"
+            >
               <b>{{ obj.label }}</b>
             </el-tooltip>
           </td>
@@ -101,7 +107,8 @@ export default {
     },
     performDelete: {
       type: Function,
-      default: (obj, that) => {}
+      default: (obj, that) => {
+      }
     },
     allowCreate: {
       type: Boolean,
@@ -109,7 +116,8 @@ export default {
     },
     select2Config: {
       type: Object,
-      default: () => {}
+      default: () => {
+      }
     },
     onDeleteSuccess: {
       type: Function,
@@ -146,7 +154,8 @@ export default {
     },
     performAdd: {
       type: Function,
-      default: (objects, that) => {}
+      default: (objects, that) => {
+      }
     },
     showAddAll: {
       type: Boolean,
@@ -156,7 +165,8 @@ export default {
       type: Function,
       default(objects, that) {
         that.$log.debug('Select value', that.select2.value)
-        that.iHasObjects = [...that.iHasObjects, ...objects]
+        const oldValues = that.iHasObjects.map(item => item.value)
+        that.iHasObjects = [...that.iHasObjects, ...objects.filter(item => !oldValues.includes(item.value))]
         that.$refs.select2.clearSelected()
         that.$message.success(that.$t('AddSuccessMsg'))
         this.$refs.select2.refresh()
@@ -324,25 +334,26 @@ export default {
 </script>
 
 <style lang='scss' scoped>
-  b, strong {
+b, strong {
   font-weight: 700;
   font-size: 13px;
-  }
+}
 
-  tr td {
+tr td {
   line-height: 1.42857;
   padding: 8px;
   vertical-align: top;
-  }
+}
 
-  tr.item td {
+tr.item td {
   border-top: 1px solid #e7eaec;
-  }
-  .box-margin {
-    margin-bottom: 20px;
-  }
+}
 
-  .the-box ::v-deep .el-card__body {
+.box-margin {
+  margin-bottom: 20px;
+}
+
+.the-box ::v-deep .el-card__body {
   padding: 20px;
-  }
+}
 </style>

src/components/Form/FormFields/CodeEditor.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="code-editor" style="font-size: 12px">
-    <el-form ref="form" label-position="top" label-width="80px" :rules="rules" :model="formModel">
+    <el-form ref="form" :model="formModel" :rules="rules" label-position="top" label-width="80px">
       <div class="form-content">
         <el-form-item
           v-for="(item, index) in iActions"
@@ -11,8 +11,8 @@
           <template v-if="item.type === 'button' && !item.isVisible">
             <el-button
               :type="item.el && item.el.type"
-              size="mini"
               class="start-stop-btn"
+              size="mini"
               @click="item.callback()"
             >
               <i :class="item.icon" />{{ item.name }}
@@ -32,9 +32,9 @@
           <template v-else-if="item.type === 'input'">
             <el-input
               v-model="formModel[item.name]"
+              :class="!isFold ? 'special-style' : ''"
               :placeholder="item.placeholder"
               class="inline-input"
-              :class="!isFold ? 'special-style' : ''"
               size="mini"
               @change="item.callback(item.value)"
             />
@@ -68,8 +68,8 @@
 
           <template v-if="item.type === 'select' && (!item.el || !item.el.create)">
             <el-dropdown
-              trigger="click"
               class="select-dropdown"
+              trigger="click"
               @command="(command) => {
                 item.value = command
                 item.callback(command)
@@ -105,8 +105,8 @@
         </el-form-item>
         <div
           v-if="toolbar.hasOwnProperty('fold')"
-          class="fold"
           :class="!isFold ? 'sepcial-icon' : ''"
+          class="fold"
         >
           <el-tooltip :content="$tc('MoreActions')" :open-delay="500" placement="top">
             <i
@@ -237,7 +237,6 @@ export default {
   },
   methods: {
     onChangeFold() {
-      console.log(1)
       this.isFold = !this.isFold
     },
     getLabel(value, items) {
@@ -323,7 +322,8 @@ $input-border-color: #C0C4CC;
             .content {
               display: flex;
               justify-content: space-between;
-            };
+            }
+          ;
           }
         }
 

src/components/Form/FormFields/Select2.vue

@@ -22,7 +22,9 @@
     @visible-change="onVisibleChange"
   >
     <div v-if="showSelectAll" class="el-select-dropdown__header">
-      <el-checkbox v-model="allSelected" @change="handleSelectAllChange">{{ $t('SelectAll') }}</el-checkbox>
+      <el-checkbox v-model="allSelected" :disabled="selectAllDisabled" @change="handleSelectAllChange">
+        {{ $t('SelectAll') }}
+      </el-checkbox>
       <div v-if="quickAddCallback" style="float: right">
         <el-link :underline="false" @click="quickAddCallback">{{ $t('QuickAdd') }}</el-link>
         <el-link :underline="false" icon="el-icon-refresh" style="margin-left: 5px;" @click="refresh" />
@@ -156,7 +158,7 @@ export default {
       initialOptions: [],
       remote: true,
       allSelected: false,
-      transformed: true
+      transformed: false // 这里改回来是因为，acl 中资产选择，category 选择后，再编辑，就看不到了
     }
   },
   computed: {
@@ -169,6 +171,10 @@ export default {
     optionsValues() {
       return this.iOptions.map((v) => v.value)
     },
+    selectAllDisabled() {
+      const validOptions = this.iOptions.filter(item => this.disabledValues.indexOf(item.value) === -1)
+      return validOptions.length === 0
+    },
     iValue: {
       set(val) {
         const noValue = !this.value || this.value.length === 0

src/views/assets/Asset/AssetDetail/Detail.vue

@@ -17,7 +17,7 @@
       />
       <RelationCard
         ref="LabelRelation"
-        v-perms="'assets.view_label'"
+        v-perms="'assets.change_asset'"
         style="margin-top: 15px"
         type="warning"
         v-bind="labelConfig"
@@ -157,11 +157,11 @@ export default {
         objectsAjax: {
           url: '/api/v1/labels/labels/',
           transformOption: (item) => {
-            const label = String(item.name) + ':' + String(item.value)
-            return { label: label, value: label }
+            const label = `${item.name}: ${item.value}`
+            return { label: label, value: item.id }
           }
         },
-        hasObjectsId: this.object.labels,
+        hasObjectsId: this.object.labels.map(item => item.id),
         performAdd: (items) => {
           const newData = []
           const value = this.$refs.LabelRelation.iHasObjects
@@ -170,11 +170,6 @@ export default {
           items.map(v => newData.push(v.label))
           return this.$axios.patch(relationUrl, { labels: newData })
         },
-        getHasObjects: (ids) => {
-          return new Promise((resolve) => {
-            return resolve(ids.map(id => ({ value: id, label: id })))
-          })
-        },
         performDelete: (item) => {
           const itemId = item.value
           const value = this.$refs.LabelRelation.iHasObjects