实现数据字典查询联动

更新element-plus到2.2.27

package-lock.json

@@ -5,6 +5,7 @@
   "requires": true,
   "packages": {
     "": {
+      "name": "admin.ui.plus",
       "version": "1.0.0",
       "license": "MIT",
       "dependencies": {
@@ -17,7 +18,7 @@
         "echarts": "^5.4.1",
         "echarts-gl": "^2.0.9",
         "echarts-wordcloud": "^2.1.0",
-        "element-plus": "^2.2.26",
+        "element-plus": "^2.2.27",
         "js-cookie": "^3.0.1",
         "js-table2excel": "^1.0.3",
         "jsplumb": "^2.15.6",
@@ -1580,8 +1581,9 @@
       }
     },
     "node_modules/element-plus": {
-      "version": "2.2.26",
-      "license": "MIT",
+      "version": "2.2.27",
+      "resolved": "https://registry.npmmirror.com/element-plus/-/element-plus-2.2.27.tgz",
+      "integrity": "sha512-P04HDOZBYDdvlYuleuCZRULzAc5xJVOBfLDK9xWxVo0vyo8ntdaXS5sTU+/76vrNzuO3FhLn9kvrsbiJEVa1jg==",
       "dependencies": {
         "@ctrl/tinycolor": "^3.4.1",
         "@element-plus/icons-vue": "^2.0.6",
@@ -5035,7 +5037,9 @@
       "requires": {}
     },
     "element-plus": {
-      "version": "2.2.26",
+      "version": "2.2.27",
+      "resolved": "https://registry.npmmirror.com/element-plus/-/element-plus-2.2.27.tgz",
+      "integrity": "sha512-P04HDOZBYDdvlYuleuCZRULzAc5xJVOBfLDK9xWxVo0vyo8ntdaXS5sTU+/76vrNzuO3FhLn9kvrsbiJEVa1jg==",
       "requires": {
         "@ctrl/tinycolor": "^3.4.1",
         "@element-plus/icons-vue": "^2.0.6",

package.json

@@ -22,7 +22,7 @@
     "echarts": "^5.4.1",
     "echarts-gl": "^2.0.9",
     "echarts-wordcloud": "^2.1.0",
-    "element-plus": "^2.2.26",
+    "element-plus": "^2.2.27",
     "js-cookie": "^3.0.1",
     "js-table2excel": "^1.0.3",
     "jsplumb": "^2.15.6",

src/types/mitt.d.ts

@@ -11,7 +11,7 @@
  * @method openShareTagsView 布局设置弹窗，开启 TagsView 共用
  * @method onTagsViewRefreshRouterView tagsview 刷新界面
  * @method onCurrentContextmenuClick tagsview 右键菜单每项点击时
- 
+
  * @method refreshDictType 刷新字典类型
  * @method refreshDict 刷新字典
  * @method refreshOrg 刷新部门
@@ -34,15 +34,15 @@ declare type MittType<T = any> = {
   onTagsViewRefreshRouterView?: T
   onCurrentContextmenuClick?: T
 
-  refreshDictType?: string
-  refreshDict?: string
-  refreshOrg?: string
-  refreshApi?: string
-  refreshPermission?: string
-  refreshRole?: string
-  refreshTenant?: string
-  refreshUser?: string
-  refreshView?: string
+  refreshDictType?: T
+  refreshDict?: T
+  refreshOrg?: T
+  refreshApi?: T
+  refreshPermission?: T
+  refreshRole?: T
+  refreshTenant?: T
+  refreshUser?: T
+  refreshView?: T
 }
 
 // mitt 参数类型定义

src/views/admin/dictionary/dictionary-type.vue

@@ -12,16 +12,24 @@
   </el-card>
 
   <el-card shadow="never" style="margin-top: 8px">
-    <el-table ref="tableRef" v-loading="state.loading" :data="state.dictionaryTypeListData" row-key="id" highlight-current-row style="width: 100%">
+    <el-table
+      ref="tableRef"
+      v-loading="state.loading"
+      :data="state.dictionaryTypeListData"
+      row-key="id"
+      highlight-current-row
+      style="width: 100%"
+      @current-change="onTableCurrentChange"
+    >
       <el-table-column prop="name" label="名称" min-width="120" show-overflow-tooltip />
-      <el-table-column prop="code" label="编码" width="120" show-overflow-tooltip />
+      <el-table-column prop="code" label="编码" width="80" show-overflow-tooltip />
       <el-table-column label="状态" width="80" align="center" show-overflow-tooltip>
         <template #default="{ row }">
           <el-tag type="success" v-if="row.enabled">启用</el-tag>
           <el-tag type="danger" v-else>禁用</el-tag>
         </template>
       </el-table-column>
-      <el-table-column label="操作" width="160" fixed="right" header-align="center" align="center">
+      <el-table-column label="操作" width="140" fixed="right" header-align="center" align="center">
         <template #default="{ row }">
           <el-button icon="ele-EditPen" size="small" text type="primary" @click="onEdit(row)">编辑</el-button>
           <el-button icon="ele-Delete" size="small" text type="danger" @click="onDelete(row)">删除</el-button>
@@ -68,26 +76,25 @@ const state = reactive({
   pageInput: {
     currentPage: 1,
     pageSize: 20,
-    filter: {
-      name: null,
-    },
   } as PageInputDictionaryTypeGetPageDto,
   dictionaryTypeListData: [] as Array<DictionaryTypeListOutput>,
 })
 
 onMounted(() => {
   onQuery()
-  eventBus.on('refreshDictType', onQuery)
+  eventBus.on('refreshDictType', () => {
+    onQuery()
+  })
 })
 
 onUnmounted(() => {
-  eventBus.off('refreshDictType', onQuery)
+  eventBus.off('refreshDictType')
 })
 
 const onQuery = async () => {
   state.loading = true
+  state.pageInput.filter = state.filterModel
   const res = await new DictionaryTypeApi().getPage(state.pageInput)
-
   state.dictionaryTypeListData = res?.data?.list ?? []
   state.total = res.data?.total ?? 0
   if (state.dictionaryTypeListData.length > 0) {
@@ -127,6 +134,10 @@ const onCurrentChange = (val: number) => {
   state.pageInput.currentPage = val
   onQuery()
 }
+
+const onTableCurrentChange = (currentRow: DictionaryTypeListOutput) => {
+  eventBus.emit('refreshDict', currentRow)
+}
 </script>
 
 <script lang="ts">

src/views/admin/dictionary/dictionary.vue

@@ -16,13 +16,13 @@
       <el-table-column prop="name" label="名称" min-width="120" show-overflow-tooltip />
       <el-table-column prop="code" label="编码" width="80" show-overflow-tooltip />
       <el-table-column prop="value" label="值" width="80" show-overflow-tooltip />
-      <el-table-column label="状态" width="80" align="center" show-overflow-tooltip>
+      <el-table-column label="状态" width="70" align="center" show-overflow-tooltip>
         <template #default="{ row }">
           <el-tag type="success" v-if="row.enabled">启用</el-tag>
           <el-tag type="danger" v-else>禁用</el-tag>
         </template>
       </el-table-column>
-      <el-table-column label="操作" width="160" fixed="right" header-align="center" align="center">
+      <el-table-column label="操作" width="140" fixed="right" header-align="center" align="center">
         <template #default="{ row }">
           <el-button icon="ele-EditPen" size="small" text type="primary" @click="onEdit(row)">编辑</el-button>
           <el-button icon="ele-Delete" size="small" text type="danger" @click="onDelete(row)">删除</el-button>
@@ -49,7 +49,7 @@
 
 <script lang="ts" setup>
 import { ref, reactive, onMounted, getCurrentInstance, onUnmounted } from 'vue'
-import { DictionaryListOutput, PageInputDictionaryGetPageDto } from '/@/api/admin/data-contracts'
+import { DictionaryListOutput, PageInputDictionaryGetPageDto, DictionaryTypeListOutput } from '/@/api/admin/data-contracts'
 import { Dictionary as DictionaryApi } from '/@/api/admin/Dictionary'
 import DictionaryForm from './components/dictionary-form.vue'
 import eventBus from '/@/utils/mitt'
@@ -63,31 +63,31 @@ const state = reactive({
   dictionaryFormTitle: '',
   filterModel: {
     name: '',
+    dictionaryTypeId: 0,
   },
   total: 0,
   pageInput: {
     currentPage: 1,
     pageSize: 20,
-    filter: {
-      name: null,
-    },
   } as PageInputDictionaryGetPageDto,
   dictionaryListData: [] as Array<DictionaryListOutput>,
 })
 
 onMounted(() => {
-  onQuery()
-  eventBus.on('refreshDict', onQuery)
+  eventBus.on('refreshDict', (data: DictionaryTypeListOutput) => {
+    state.filterModel.dictionaryTypeId = data.id as number
+    onQuery()
+  })
 })
 
 onUnmounted(() => {
-  eventBus.off('refreshDict', onQuery)
+  eventBus.off('refreshDict')
 })
 
 const onQuery = async () => {
   state.loading = true
+  state.pageInput.filter = state.filterModel
   const res = await new DictionaryApi().getPage(state.pageInput)
-
   state.dictionaryListData = res?.data?.list ?? []
   state.total = res.data?.total ?? 0
   state.loading = false