【update】标签管理、数据字典样式的修改

src/views/system/DictItemList.vue

@@ -35,41 +35,42 @@
                 </a-form-item>
               </a-col>
               <a-col :md="7" :sm="24">
-              <span style="float: left;" class="table-page-search-submitButtons">
-                <a-button type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
-                <a-button type="primary" @click="searchReset" style="margin-left: 8px">{{ $t('reset') }}</a-button>
+              <span style="float: right;" class="table-page-search-submitButtons">
+                <a-button icon="search" type="primary" @click="searchQuery">{{ $t('query') }}</a-button>
+                <a-button icon="reload" type="primary" ghost @click="searchReset" style="margin-left: 8px">{{ $t('reset') }}</a-button>
               </span>
               </a-col>
             </a-row>
             <a-row>
               <a-col :md="2" :sm="24">
-                <a-button style="margin-bottom: 10px" type="primary" @click="handleAdd" v-if="model.isReadOnly === IsReadOnlyEnums.configurable.value || model.isReadOnly === IsReadOnlyEnums.subConfigurable.value">{{ $t('newlyAdded') }}</a-button>
+                <a-button style="margin-bottom: 10px" icon="plus" type="primary" @click="handleAdd" v-if="model.isReadOnly === IsReadOnlyEnums.configurable.value || model.isReadOnly === IsReadOnlyEnums.subConfigurable.value">{{ $t('newlyAdded') }}</a-button>
               </a-col>
             </a-row>
           </a-form>
         </div>
         <div>
-          <a-table
+          <j-table
             ref="table"
-            rowKey="id"
+            can-drag
+            :class="{'tree-table': attributeType === TagsAttributeTypeEnums.TREE.value}"
+            :bordered="true"
             size="middle"
+            rowKey="id"
             :columns="columns"
             :dataSource="dataSource"
             :pagination="ipagination"
             :loading="loading"
+            :scroll="{x: '100%', y: yScrollHeight}"
+            :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
             @change="handleTableChange"
             :rowClassName="getRowClassname"
           >
-
-          <span slot="action" slot-scope="text, record">
-            <a @click="handleEdit(record)" v-if="record.isReadOnly === IsReadOnlyEnums.subConfigurable.value || record.isReadOnly === IsReadOnlyEnums.configurable.value">{{ $t('edit') }}</a>
-            <a-divider type="vertical"/>
-            <a-popconfirm :title="$t('areYouSure')" @confirm="() => handleDelete(record.id)" v-if="record.isReadOnly === IsReadOnlyEnums.subConfigurable.value || record.isReadOnly === IsReadOnlyEnums.configurable.value">
-              <a>{{ $t('delete') }}</a>
-            </a-popconfirm>
-          </span>
-
-          </a-table>
+            <div slot="action" class="table-action" slot-scope="{text, record}">
+              <a class="action-edit" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleEdit(record)" v-has="'sys:dict:operation'">{{ $t('edit') }}</a>
+              <a-divider type="vertical" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleDelete(record.id)" v-has="'sys:dict:operation'"/>
+              <a class="table-del" v-if="record.isReadOnly === IsReadOnlyEnums.configurable.value || record.isReadOnly === IsReadOnlyEnums.subConfigurable.value" @click="handleDelete(record.id)" v-has="'sys:dict:operation'">{{ $t('delete') }}</a>
+            </div>
+          </j-table>
         </div>
       </div>
     </a-drawer>
@@ -83,15 +84,17 @@ import { filterObj } from '@/utils/util'
 import DictItemModal from './modules/DictItemModal'
 import { JeroListMixin } from '@/mixins/JeroListMixin'
 import JInput from '@/components/jero/JInput'
-import { IsReadOnlyEnums } from '../../enums/commonEnums'
+import { IsReadOnlyEnums, TagsAttributeTypeEnums } from '../../enums/commonEnums'
+import JTable from '../../components/jero/JTable'
 
 export default {
   name: 'DictItemList',
   mixins: [JeroListMixin],
-  components: { DictItemModal, JInput },
+  components: { DictItemModal, JInput, JTable },
   data () {
     return {
       IsReadOnlyEnums,
+      TagsAttributeTypeEnums,
       columns: [
         {
           title: this.$t('name'),
@@ -129,7 +132,7 @@ export default {
       isReadOnly: IsReadOnlyEnums.configurable.value,
       title: this.$t('operation'),
       visible: false,
-      screenWidth: 1000,
+      screenWidth: 1200,
       model: {},
       dictId: '',
       status: 1,
@@ -150,7 +153,9 @@ export default {
         list: '/sys/dictItem/page',
         delete: '/sys/dictItem/delete',
         deleteBatch: '/sys/dictItem/deleteBatch'
-      }
+      },
+      // 标签类型
+      attributeType: undefined
     }
   },
   created () {
@@ -170,6 +175,7 @@ export default {
       this.queryParam = {}
       this.form.resetFields()
       this.model = Object.assign({}, record)
+      this.attributeType = Number(this.model.attributeType) // 标签类型，用于辨别是下拉框还是树形结构
       this.model.dictId = this.dictId
       this.model.status = this.status
       this.visible = true