feat(system): 添加字典和菜单缓存清除功能

- 在字典管理页面添加清除缓存按钮，用于清除单个字典的缓存
- 在菜单管理页面添加清除缓存按钮，用于清除全部菜单缓存
- 新增清除字典缓存和菜单缓存的 API 接口
- 优化字典树组件，增加选中字典的信息传递

src/apis/system/dict.ts

@@ -30,6 +30,11 @@ export function deleteDict(id: string) {
   return http.del(`${BASE_URL}/${id}`)
 }
 
+/** @desc 清除字典缓存 */
+export function clearDictCache(code: string) {
+  return http.del(`${BASE_URL}/cache/${code}`)
+}
+
 /** @desc 查询字典项列表 */
 export function listDictItem(query: T.DictItemPageQuery) {
   return http.get<PageRes<T.DictItemResp[]>>(`${BASE_URL}/item`, query)

src/apis/system/menu.ts

@@ -29,3 +29,8 @@ export function updateMenu(data: any, id: string) {
 export function deleteMenu(id: string) {
   return http.del(`${BASE_URL}/${id}`)
 }
+
+/** @desc 清除菜单缓存 */
+export function clearMenuCache() {
+  return http.del(`${BASE_URL}/cache`)
+}

src/views/system/dict/index.vue

@@ -1,10 +1,5 @@
 <template>
   <div class="gi_page">
-    <!-- <a-row justify="space-between" align="center" class="header page_header">
-      <a-space wrap>
-        <div class="title">字典管理</div>
-      </a-space>
-    </a-row> -->
     <SplitPanel>
       <template #left>
         <DictTree @node-click="handleSelectDict" />
@@ -35,6 +30,10 @@
                   <template #icon><icon-plus /></template>
                   <template #default>新增</template>
                 </a-button>
+                <a-button v-permission="['system:dict:item:clearCache']" type="outline" status="warning" @click="onClearCache">
+                  <template #icon><icon-delete /></template>
+                  <template #default>清除缓存</template>
+                </a-button>
               </template>
               <template #label="{ record }">
                 <a-tag :color="record.color">{{ record.label }}</a-tag>
@@ -66,9 +65,10 @@
 </template>
 
 <script setup lang="ts">
+import { Message, Modal } from '@arco-design/web-vue'
 import DictTree from './tree/index.vue'
 import DictItemAddModal from './DictItemAddModal.vue'
-import { type DictItemQuery, type DictItemResp, deleteDictItem, listDictItem } from '@/apis/system/dict'
+import { type DictItemQuery, type DictItemResp, clearDictCache, deleteDictItem, listDictItem } from '@/apis/system/dict'
 import type { TableInstanceColumns } from '@/components/GiTable/type'
 import { useTable } from '@/hooks'
 import { isMobile } from '@/utils'
@@ -137,9 +137,30 @@ const onDelete = (record: DictItemResp) => {
   })
 }
 
+const dictName = ref()
+const dictCode = ref()
+// 清除缓存
+const onClearCache = () => {
+  if (!dictCode.value) {
+    return Message.warning('请先选择字典')
+  }
+  Modal.warning({
+    title: '提示',
+    content: `是否确定清除字典「${dictName.value}(${dictCode.value})」缓存？`,
+    hideCancel: false,
+    maskClosable: false,
+    onOk: async () => {
+      await clearDictCache(dictCode.value)
+      Message.success('清除成功')
+    },
+  })
+}
+
 // 根据选中字典查询
-const handleSelectDict = (keys: Array<any>) => {
-  queryForm.dictId = keys.length === 1 ? keys[0] : undefined
+const handleSelectDict = (dict: { dictId: string, dictName: string, dictCode: string }) => {
+  queryForm.dictId = dict.dictId
+  dictName.value = dict.dictName
+  dictCode.value = dict.dictCode
   search()
 }
 

src/views/system/dict/tree/index.vue

@@ -54,9 +54,14 @@ import { type DictResp, deleteDict, listDict } from '@/apis/system/dict'
 import has from '@/utils/has'
 
 const emit = defineEmits<{
-  (e: 'node-click', keys: Array<any>): void
+  (e: 'node-click', dict: { dictId: string, dictName?: string, dictCode?: string }): void
 }>()
 
+interface TreeItem extends DictResp {
+  popupVisible: boolean
+}
+const dataList = ref<TreeItem[]>([])
+
 const selectedKeys = ref()
 // 选中节点
 const select = (keys: Array<any>) => {
@@ -64,13 +69,14 @@ const select = (keys: Array<any>) => {
     return
   }
   selectedKeys.value = keys
-  emit('node-click', keys)
+  const selectedDict = dataList.value.find((item) => item.id === keys[0])
+  emit('node-click', {
+    dictId: keys[0],
+    dictName: selectedDict?.name,
+    dictCode: selectedDict?.code,
+  })
 }
 
-interface TreeItem extends DictResp {
-  popupVisible: boolean
-}
-const dataList = ref<TreeItem[]>([])
 const loading = ref(false)
 // 查询树列表
 const getTreeData = async () => {

src/views/system/menu/index.vue

@@ -30,14 +30,20 @@
           <template #icon><icon-plus /></template>
           <template #default>新增</template>
         </a-button>
-        <a-tooltip content="展开/折叠">
-          <a-button @click="onExpanded">
-            <template #icon>
-              <icon-list v-if="!isExpanded" />
-              <icon-mind-mapping v-else />
-            </template>
-          </a-button>
-        </a-tooltip>
+        <a-button v-permission="['system:menu:clearCache']" type="outline" status="warning" @click="onClearCache">
+          <template #icon><icon-delete /></template>
+          <template #default>清除缓存</template>
+        </a-button>
+        <a-button @click="onExpanded">
+          <template #icon>
+            <icon-list v-if="isExpanded" />
+            <icon-mind-mapping v-else />
+          </template>
+          <template #default>
+            <span v-if="!isExpanded">展开</span>
+            <span v-else>折叠</span>
+          </template>
+        </a-button>
       </template>
       <template #title="{ record }">
         <GiSvgIcon :name="record.icon" :size="15" />
@@ -84,8 +90,9 @@
 </template>
 
 <script setup lang="ts">
+import { Message, Modal } from '@arco-design/web-vue'
 import MenuAddModal from './MenuAddModal.vue'
-import { type MenuQuery, type MenuResp, deleteMenu, listMenu } from '@/apis/system/menu'
+import { type MenuQuery, type MenuResp, clearMenuCache, deleteMenu, listMenu } from '@/apis/system/menu'
 import type { TableInstanceColumns } from '@/components/GiTable/type'
 import type GiTable from '@/components/GiTable/index.vue'
 import { useTable } from '@/hooks'
@@ -171,6 +178,20 @@ const onDelete = (record: MenuResp) => {
   })
 }
 
+// 清除缓存
+const onClearCache = () => {
+  Modal.warning({
+    title: '提示',
+    content: `是否确定清除全部菜单缓存？`,
+    hideCancel: false,
+    maskClosable: false,
+    onOk: async () => {
+      await clearMenuCache()
+      Message.success('清除成功')
+    },
+  })
+}
+
 const isExpanded = ref(false)
 const tableRef = ref<InstanceType<typeof GiTable>>()
 // 展开/折叠