refactor(字典管理): 重构字典模块代码结构并优化API调用

- 将字典API从视图层移动到api目录统一管理
- 简化字典和字典项的表单配置和列定义
- 修改API请求方法从post改为get
- 新增字典项详情接口
- 统一删除方法命名为delete
- 优化代码格式和样式

src/api/dict.api.ts

@@ -19,7 +19,7 @@ export interface DictList extends Dict {
 /** 字典查询 */
 export class DictService {
   /** 获取所有字典 */
-  static dictList = async () => request.post<DictList[]>('/system/dict/all')
+  static dictList = async () => request.get<DictList[]>('/system/dict/all')
   // 分页查询
   static page = (params: any) => request.post('/system/dict/page', params)
   // 详情
@@ -34,9 +34,11 @@ export class DictService {
 /** 字典项查询 */
 export class DictItemService {
   // 获取字典项列表
-  static dictItemList = async (dictCode: string) => request.post<DictItem[]>('/system/dict/item/list', { dictCode })
+  static dictItemList = async (dictCode: string) => request.get<DictItem[]>('/system/dict/item/list', { dictCode })
   // 分页查询
   static page = (params: any) => request.postPage<DictItem[]>('/system/dict/item/page', params)
+  // 详情
+  static detail = (code: string) => request.post<DictItem>('/system/dict/item/detail', { code })
   // 添加
   static save = (params: any) => request.post('/system/dict/item/save', params)
   // 修改

src/views/examples/forms/index.vue

@@ -402,8 +402,7 @@
         h(
           'div',
           {
-            style:
-              'color: var(--art-gray-600); border: 1px solid var(--art-border-dashed-color); padding: 0px 15px; border-radius: 6px'
+            style: 'color: var(--art-gray-600); border: 1px solid var(--art-border-dashed-color); padding: 0px 15px; border-radius: 6px'
           },
           '我是一个自定义组件'
         ),
@@ -557,9 +556,7 @@
               formData.value.multipleFiles = fileList as UploadUserFile[]
             },
             onExceed: (files: File[], fileList: UploadUserFile[]) => {
-              ElMessage.warning(
-                `最多只能上传 5 个文件，当前选择了 ${files.length + fileList.length} 个文件`
-              )
+              ElMessage.warning(`最多只能上传 5 个文件，当前选择了 ${files.length + fileList.length} 个文件`)
             }
           },
           {
@@ -627,21 +624,7 @@
             formData.value.richTextContent = value
             console.log('富文本内容变化:', value)
           },
-          toolbarKeys: [
-            'headerSelect',
-            'bold',
-            'italic',
-            'underline',
-            '|',
-            'bulletedList',
-            'numberedList',
-            '|',
-            'insertLink',
-            'insertImage',
-            '|',
-            'undo',
-            'redo'
-          ]
+          toolbarKeys: ['headerSelect', 'bold', 'italic', 'underline', '|', 'bulletedList', 'numberedList', '|', 'insertLink', 'insertImage', '|', 'undo', 'redo']
         })
     }
   ])

src/views/train/system/dictionary/dict.api.ts

@@ -1,79 +0,0 @@
-import request from '@/utils/http'
-
-export interface Dict {
-  /** 唯一编码 */
-  code: string
-  /** 字典名称 */
-  name: string
-  /** 备注 */
-  remark: string
-  /** 排序 */
-  sort: number
-}
-
-export interface DictItem {
-  /** 字典ID */
-  dictId: string
-  /** 唯一编码，唯一编码或值 */
-  code: string
-  /** 字典项名称 */
-  name: string
-  /** 备注 */
-  remark: string
-  /** 排序 */
-  sort: number
-}
-
-export class DictService {
-  // 分页查询
-  static page(params: any) {
-    return request.post({ url: '/sys/dict/page', params })
-  }
-
-  // 添加
-  static save(params: any) {
-    return request.post({ url: '/sys/dict/save', params })
-  }
-
-  // 修改
-  static update(params: any) {
-    return request.post({ url: '/sys/dict/update', params })
-  }
-
-  // 删除
-  static remove(params: any) {
-    return request.post({ url: '/sys/dict/remove', params })
-  }
-
-  // 详情
-  static detail(params: any) {
-    return request.post({ url: '/sys/dict/detail', params })
-  }
-}
-
-export class DictItemService {
-  // 分页查询
-  static page(params: any) {
-    return request.post({ url: '/sys/dictItem/page', params })
-  }
-
-  // 添加
-  static save(params: any) {
-    return request.post({ url: '/sys/dictItem/save', params })
-  }
-
-  // 修改
-  static update(params: any) {
-    return request.post({ url: '/sys/dictItem/update', params })
-  }
-
-  // 删除
-  static remove(params: any) {
-    return request.post({ url: '/sys/dictItem/remove', params })
-  }
-
-  // 详情
-  static detail(params: any) {
-    return request.post({ url: '/sys/dictItem/detail', params })
-  }
-}

src/views/train/system/dictionary/dict.schemas.tsx

@@ -1,5 +1,5 @@
 import { CrudSchema } from '@/components/crud'
-import { DictService, DictItemService } from './dict.api'
+import { DictService, DictItemService } from '@/api/dict.api'
 
 // 字典配置
 export const dictSchema: CrudSchema = {
@@ -12,7 +12,7 @@ export const dictSchema: CrudSchema = {
     // 修改接口
     edit: DictService.update,
     // 删除接口
-    remove: DictService.remove,
+    remove: DictService.delete,
     // 详情接口
     view: DictService.detail
   },
@@ -36,67 +36,15 @@ export const dictSchema: CrudSchema = {
   viewAuth: 'sys:dict:detail',
   // 表格列定义
   columns: [
-    {
-      type: 'selection'
-    },
-    {
-      prop: 'groupCode',
-      label: '分组编码',
-      component: 'ApiDict',
-      minWidth: 200,
-      componentProps: {
-        code: 'sys_dict_group_code'
-      }
-    },
-    {
-      prop: 'name',
-      label: '字典名称',
-      minWidth: 200
-    },
-    {
-      prop: 'code',
-      label: '唯一编码',
-      minWidth: 200
-    },
-    {
-      prop: 'dataType',
-      label: '数据类型',
-      component: 'ApiDict',
-      componentProps: {
-        code: 'sys_dict_data_type'
-      },
-      minWidth: 100
-    },
-    {
-      prop: 'sort',
-      label: '排序',
-      minWidth: 100
-    },
-    {
-      prop: 'enabled',
-      label: '是否启用',
-      component: 'ApiDict',
-      componentProps: {
-        code: 'yes_no'
-      },
-      minWidth: 100
-    }
+    // 选择列
+    { type: 'selection' },
+    { prop: 'name', label: '字典名称', minWidth: 200 },
+    { prop: 'code', label: '字典编码', minWidth: 200 },
+    { prop: 'sort', label: '排序', minWidth: 100 }
   ],
   // 搜索表单定义
   searchFormSchema: {
     schema: [
-      {
-        label: '所属分组',
-        prop: 'm_IN_groupCode',
-        component: 'ApiDict',
-        componentProps: {
-          code: 'sys_dict_group_code',
-          clearable: true,
-          placeholder: '请选择所属分组',
-          multiple: true
-        },
-        colSpan: 6
-      },
       {
         prop: 'm_LIKE_name',
         label: '字典名称',
@@ -116,17 +64,6 @@ export const dictSchema: CrudSchema = {
           placeholder: '请输入唯一编码'
         },
         colSpan: 6
-      },
-      {
-        label: '是否启用',
-        prop: 'm_IN_enabled',
-        component: 'ApiDict',
-        componentProps: {
-          code: 'yes_no',
-          clearable: true,
-          placeholder: '请选择是否启用'
-        },
-        colSpan: 6
       }
     ]
   },
@@ -139,95 +76,20 @@ export const dictSchema: CrudSchema = {
     showDefaultActions: false,
     labelWidth: '100px',
     schema: [
-      {
-        label: '字典ID',
-        prop: 'id',
-        component: 'Input',
-        colSpan: 24,
-        show: false,
-        ifDetail: false
-      },
-      {
-        label: '所属分组',
-        prop: 'groupCode',
-        component: 'ApiDict',
-        componentProps: {
-          code: 'sys_dict_group_code'
-        },
-        rules: [
-          {
-            required: true,
-            message: '请选择所属分组'
-          }
-        ],
-        colSpan: 24
-      },
       {
         label: '字典名称',
         prop: 'name',
         component: 'Input',
-        rules: [
-          {
-            required: true,
-            message: '请输入字典名称'
-          }
-        ],
-        componentProps: {
-          placeholder: '请输入字典名称'
-        },
+        rules: [{ required: true, message: '请输入字典名称' }],
+        componentProps: { placeholder: '请输入字典名称' },
         colSpan: 24
       },
       {
         label: '唯一编码',
         prop: 'code',
         component: 'Input',
-        rules: [
-          {
-            required: true,
-            message: '请输入唯一编码'
-          }
-        ],
-        componentProps: {
-          placeholder: '请输入唯一编码'
-        },
-        colSpan: 24
-      },
-
-      {
-        label: '数据类型',
-        prop: 'dataType',
-        component: 'ApiDict',
-        defaultValue: 1,
-        componentProps: {
-          code: 'sys_dict_data_type',
-          renderType: 'RadioGroup',
-          isBtn: true,
-          placeholder: '请选择数据类型'
-        },
-        rules: [
-          {
-            required: true,
-            message: '请选择数据类型'
-          }
-        ],
-        colSpan: 24
-      },
-      {
-        label: '是否启用',
-        prop: 'enabled',
-        component: 'ApiDict',
-        defaultValue: 1,
-        componentProps: {
-          code: 'yes_no',
-          renderType: 'RadioGroup',
-          isBtn: true
-        },
-        rules: [
-          {
-            required: true,
-            message: '请选择是否启用'
-          }
-        ],
+        rules: [{ required: true, message: '请输入唯一编码' }],
+        componentProps: { placeholder: '请输入唯一编码' },
         colSpan: 24
       },
       {
@@ -241,11 +103,7 @@ export const dictSchema: CrudSchema = {
         label: '备注',
         prop: 'remark',
         component: 'Input',
-        componentProps: {
-          type: 'textarea',
-          rows: 4,
-          placeholder: '请输入备注'
-        },
+        componentProps: { type: 'textarea', rows: 4, placeholder: '请输入备注' },
         colSpan: 24
       }
     ]
@@ -259,7 +117,7 @@ export const dictItemSchema: CrudSchema = {
   crudApi: {
     add: DictItemService.save,
     edit: DictItemService.update,
-    remove: DictItemService.remove,
+    remove: DictItemService.delete,
     view: DictItemService.detail
   },
   useCrud: true,
@@ -272,30 +130,10 @@ export const dictItemSchema: CrudSchema = {
   editAuth: 'sys:dict-item:update',
   viewAuth: 'sys:dict-item:detail',
   columns: [
-    {
-      type: 'selection'
-    },
-    {
-      prop: 'name',
-      label: '字典项名称'
-    },
-    {
-      prop: 'code',
-      label: '字典值'
-    },
-    {
-      prop: 'sort',
-      label: '排序'
-    },
-    {
-      prop: 'enabled',
-      label: '是否启用',
-      component: 'ApiDict',
-      componentProps: {
-        code: 'yes_no',
-        renderType: 'RadioGroup'
-      }
-    }
+    // 选择列
+    { prop: 'name', label: '字典项名称' },
+    { prop: 'code', label: '字典值' },
+    { prop: 'sort', label: '排序' }
   ],
   searchFormSchema: {
     schema: [
@@ -304,20 +142,14 @@ export const dictItemSchema: CrudSchema = {
         labelWidth: '90px',
         label: '字典项名称',
         component: 'Input',
-        componentProps: {
-          clearable: true,
-          placeholder: '请输入字典项名称'
-        },
+        componentProps: { clearable: true, placeholder: '请输入字典项名称' },
         colSpan: 8
       },
       {
         prop: 'm_LIKE_code',
-        label: '字典值',
+        label: '字典项数值',
         component: 'Input',
-        componentProps: {
-          clearable: true,
-          placeholder: '请输入字典值'
-        },
+        componentProps: { clearable: true, placeholder: '请输入字典值' },
         colSpan: 8
       }
     ]
@@ -329,73 +161,32 @@ export const dictItemSchema: CrudSchema = {
     showDefaultActions: false,
     labelWidth: '100px',
     schema: [
-      {
-        label: '字典项ID',
-        prop: 'id',
-        component: 'Input',
-        colSpan: 24,
-        show: false,
-        ifDetail: false
-      },
       {
         label: '字典项名称',
         prop: 'name',
         component: 'Input',
-        rules: [
-          {
-            required: true,
-            message: '请输入字典项名称'
-          }
-        ],
+        rules: [{ required: true, message: '请输入字典项名称' }],
         colSpan: 24
       },
       {
         label: '字典值',
         prop: 'code',
         component: 'Input',
-        rules: [
-          {
-            required: true,
-            message: '请输入唯一编码'
-          }
-        ],
-        colSpan: 24
-      },
-      {
-        label: '是否启用',
-        prop: 'enabled',
-        component: 'ApiDict',
-        defaultValue: 1,
-        componentProps: {
-          code: 'yes_no',
-          renderType: 'RadioGroup',
-          isBtn: true
-        },
-        rules: [
-          {
-            required: true,
-            message: '请选择是否启用'
-          }
-        ],
+        rules: [{ required: true, message: '请输入唯一编码' }],
         colSpan: 24
       },
       {
         label: '排序',
         prop: 'sort',
         component: 'InputNumber',
-        componentProps: {
-          min: 0
-        },
+        componentProps: { min: 0 },
         colSpan: 24
       },
       {
         label: '备注',
         prop: 'remark',
         component: 'Input',
-        componentProps: {
-          type: 'textarea',
-          rows: 3
-        },
+        componentProps: { type: 'textarea', rows: 3 },
         colSpan: 24
       }
     ]

src/views/train/system/dictionary/index.vue

@@ -7,7 +7,7 @@
 <script setup lang="tsx">
   import { useCrud } from '@/components/crud'
   import { dictSchema } from './dict.schemas'
-  import DictItemWrap from './dict-item-wrap.vue'
+  import DictItemWrap from './dict-item.vue'
   const dictItemWrapRef = ref()
   const [BasicCrud, crudApi] = useCrud({
     ...dictSchema,

vite.config.ts

@@ -47,7 +47,7 @@ export default ({ mode }: { mode: string }) => {
     },
     build: {
       target: 'es2015',
-      outDir: 'dist',
+      outDir: 'dist/course',
       chunkSizeWarningLimit: 2000,
       minify: 'terser',
       terserOptions: {