-前端提交：字典管理提交

kicc-ui/src/api/system/dict.ts

@@ -1,22 +1,54 @@
-import { DictVO, DictDTO, Dict } from './model/dictModel';
+import { DictParams, DictResult, Dict } from './model/dictModel';
 import { defHttp } from '/@/utils/http/axios';
+import {isDef} from "/@/utils/is";
 
 enum Api {
-  Page = '/mate-system/dict/page',
-  Set = '/mate-system/dict/set',
-  Del = '/mate-system/dict/del',
-  SubPage = '/mate-system/dict/list-value',
+  List = '/system_proxy/system/dict/list',
+  GetById = '/system_proxy/system/dict',
+  Save = '/system_proxy/system/dict/save',
+  Update = '/system_proxy/system/dict/update',
+  Remove = '/system_proxy/system/dict/remove',
+  ChangeStatus = '/system_proxy/system/dict/changeStatus'
 }
 
-// 分页查询
-export const page = (params: DictVO) => defHttp.get<DictDTO>({ url: Api.Page, params });
 
-// 字典项分页查询
-export const subPage = (params: DictVO) => defHttp.get<DictDTO>({ url: Api.SubPage, params });
 
-// 保存
-export const set = (params: Dict) => defHttp.post<Dict>({ url: Api.Set, params });
+/**
+ * 条件查询字典数据列表
+ * @param params
+ */
+export const list = (params: DictParams) =>
+    defHttp.get({url: Api.List, params});
 
-// 删除
-export const del = (params: { ids: String }) =>
-  defHttp.post<boolean>({ url: Api.Del + `?ids=${params.ids}` });
+/**
+ * 修改或新增
+ * @param params
+ */
+export const set = (params: Dict) => {
+  if (isDef(params.id)) {
+    return defHttp.put({url: Api.Update, params});
+  } else {
+    return defHttp.post({url: Api.Save, params});
+  }
+}
+
+/**
+ * 通过id获取
+ * @param params
+ */
+export const getById = (params: { id: string }) =>
+    defHttp.get({url: Api.GetById + `/${params.id}`});
+
+/**
+ * 删除字典数据
+ * @param params
+ */
+export const remove = (params: {id: string}) =>
+    defHttp.delete({url: Api.Remove + `/${params.id}` });
+
+/**
+ * 修改状态
+ * @param params
+ */
+export const changeStatus = (params: Dict) =>
+    defHttp.get({url: Api.ChangeStatus, params});

kicc-ui/src/api/system/dictdata.ts

@@ -0,0 +1,61 @@
+import {DictDataParams, DictDataResult, DictData} from './model/dictDataModel';
+import {defHttp} from '/@/utils/http/axios';
+import {isDef} from "/@/utils/is";
+
+enum Api {
+    List = '/system_proxy/system/dictData/list',
+    GetById = '/system_proxy/system/dictData',
+    GetByData = '/system_proxy/system/dictData/getDictData',
+    GetByDictType = '/system_proxy/system/dictData/dictType',
+    Save = '/system_proxy/system/dictData/save',
+    Update = '/system_proxy/system/dictData/update',
+    Remove = '/system_proxy/system/dictData/remove'
+
+}
+
+/**
+ * 条件查询字典数据列表
+ * @param params
+ */
+export const list = (params: DictDataParams) =>
+    defHttp.get({url: Api.List, params});
+
+/**
+ * 修改或新增
+ * @param params
+ */
+export const set = (params: DictData) => {
+    if (isDef(params.id)) {
+        return defHttp.put({url: Api.Update, params});
+    } else {
+        return defHttp.post({url: Api.Save, params});
+    }
+}
+
+/**
+ * 通过id获取
+ * @param params
+ */
+export const getById = (params: { id: string }) =>
+    defHttp.get({url: Api.GetById + `/${params.id}`});
+
+/**
+ * 通过type和value查询
+ * @param params
+ */
+export const getByData = (params: {dataType: string, value: string}) =>
+    defHttp.get({url: Api.GetByData, params});
+
+/**
+ * 获取字典数据通过字典类型
+ * @param params
+ */
+export const getByDictType = (params: {dictType: string}) =>
+    defHttp.get({url: Api.GetByDictType + `/${params.dictType}`})
+
+/**
+ * 删除字典数据
+ * @param params
+ */
+export const remove = (params: {id: string}) =>
+    defHttp.delete({url: Api.Remove + `/${params.id}` });

kicc-ui/src/api/system/model/dictDataModel.ts

@@ -0,0 +1,24 @@
+// 引入基础包
+import {CommonEntity, Page, R} from '/@/api/model';
+
+// 定义查询参数
+export type DictDataParams = Page & {
+    id?: string;
+    dictType?: string;
+    label?: string;
+    value?: string;
+    sort?: string;
+
+}
+
+export interface DictData extends CommonEntity {
+    id: string;
+    dictType: string;
+    label: string;
+    value: string;
+    sort: number;
+
+}
+
+// 根据字典对象生成响应模型
+export type DictDataResult = R<DictData>;

kicc-ui/src/api/system/model/dictModel.ts

@@ -1,23 +1,26 @@
 // 引入基础包
-import { Page, R } from '/@/api/model';
+import {CommonEntity, Page, R} from '/@/api/model';
 
 // 定义查询参数
-export type DictVO = Page & {
-  code?: string;
-  dictValue?: string;
+export type DictParams = Page & {
+    id?:string;
+    name?:string;
+    type?:string;
+    isSys?:string;
+    status?:string;
+
 };
 
+
 // 定义字典对象
-export interface Dict {
+export interface Dict extends CommonEntity{
     id:string;
-  parentId: string;
-  code: string;
-  dictKey: string;
-  dictValue: string;
-  sort: string;
-  remark: string;
-  createTime: string;
+    name:string;
+    type:string;
+    isSys:string;
+    status:string;
 }
 
+
 // 根据字典对象生成响应模型
-export type DictDTO = R<DictVO>;
+export type DictResult = R<Dict>;

kicc-ui/src/views/system/dict/DictDataModal.vue

@@ -0,0 +1,55 @@
+<template>
+  <BasicModal
+      v-bind="$attrs"
+      @register="registerModal"
+      showFooter
+      :title="getTitle"
+      width="500px"
+      @ok="handleSubmit"
+  >
+    <BasicForm @register="registerForm"/>
+  </BasicModal>
+</template>
+<script lang="ts" setup>
+import {ref, computed, unref} from 'vue';
+import {BasicForm, useForm} from '/@/components/Form/index';
+import {formSchema} from './dictdata.data';
+import {set} from '/@/api/system/dictdata';
+import {BasicModal, useModalInner} from "/@/components/Modal";
+
+const emit = defineEmits(['success', 'register']);
+const isUpdate = ref(true);
+const [registerForm, {resetFields, setFieldsValue, validate}] = useForm({
+  labelWidth: 100,
+  schemas: formSchema,
+  showActionButtonGroup: false,
+});
+
+const [registerModal, {setModalProps, closeModal}] = useModalInner(async (data) => {
+  await resetFields();
+  setModalProps({confirmLoading: false});
+  isUpdate.value = !!data?.isUpdate;
+
+  if (unref(isUpdate)) {
+    await setFieldsValue({
+      ...data.record,
+    });
+  }
+});
+
+const getTitle = computed(() => (!unref(isUpdate) ? '新增字典项' : '编辑字典项'));
+
+async function handleSubmit() {
+  try {
+    const values = await validate();
+    setModalProps({confirmLoading: true});
+    await set(values);
+    closeModal();
+    emit('success');
+  } finally {
+    setModalProps({confirmLoading: false});
+  }
+}
+
+
+</script>

kicc-ui/src/views/system/dict/DictDataTable.vue

@@ -23,7 +23,7 @@
         />
       </template>
     </BasicTable>
-    <DictSubDrawer @register="registerDrawer" @success="handleSuccess" />
+    <DictDataModal @register="registerModal" @success="handleSuccess" />
   </PageWrapper>
 </template>
 <script lang="ts">
@@ -32,32 +32,32 @@
   import { PageWrapper } from '/@/components/Page';
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
   // 插入数据内容
-  import { columns, subSearchFormSchema } from './dict.data';
+  import { columns, searchFormSchema } from './dictdata.data';
   // 通过API接口获取日志
-  import { subPage, del } from '/@/api/system/dict';
-  import { useDrawer } from '/@/components/Drawer';
-  import DictSubDrawer from './DictSubDrawer.vue';
+  import { list, remove } from '/@/api/system/dictdata';
+  import { useModal } from '/@/components/Modal';
+  import DictDataModal from './DictDataModal.vue';
   import { useMessage } from '/@/hooks/web/useMessage';
 
   export default defineComponent({
-    components: { BasicTable, PageWrapper, DictSubDrawer, TableAction },
+    components: { BasicTable, PageWrapper, DictDataModal, TableAction },
     setup() {
       const { createMessage } = useMessage();
 
-      let code = ref<string>('');
+      let dictType = ref<string>('');
       let record = reactive({
-        code: '',
+        dictType: '',
         parentId: 0,
       });
 
-      const [registerDrawer, { openDrawer }] = useDrawer();
+      const [registerModal, { openModal }] = useModal();
       const [registerTable, { reload, setProps }] = useTable({
         title: '>>字典项列表',
-        api: subPage,
+        api: list,
         columns,
         formConfig: {
           labelWidth: 120,
-          schemas: subSearchFormSchema,
+          schemas: searchFormSchema,
         },
         useSearchForm: true,
         showTableSetting: true,
@@ -73,28 +73,28 @@
         immediate: false,
       });
 
-      function filterByDictCode(records: Recordable) {
-        setProps({ searchInfo: { code: records.code } });
-        record.code = records.code;
+      function filterByDictType(records: Recordable) {
+        setProps({ searchInfo: { dictType: records.type } });
+        record.dictType = records.type;
         record.parentId = records.id;
         reload();
       }
 
       function handleCreate() {
-        openDrawer(true, {
+        openModal(true, {
           record,
           isUpdate: true,
         });
       }
       function handleEdit(record: Recordable) {
-        openDrawer(true, {
+        openModal(true, {
           record,
           isUpdate: true,
         });
       }
 
       async function handleDelete(record: Recordable) {
-        await del({ ids: record.id });
+        await remove({ id: record.id });
         createMessage.success('删除成功!');
         handleSuccess();
       }
@@ -104,13 +104,13 @@
       }
       return {
         registerTable,
-        registerDrawer,
+        registerModal,
         handleCreate,
         handleEdit,
         handleDelete,
         handleSuccess,
-        filterByDictCode,
-        code,
+        filterByDictType,
+        dictType
       };
     },
   });

kicc-ui/src/views/system/dict/DictModal.vue

@@ -1,23 +1,22 @@
 <template>
-  <BasicDrawer
+  <BasicModal
     v-bind="$attrs"
-    @register="registerDrawer"
+    @register="registerModal"
     showFooter
     :title="getTitle"
     width="500px"
     @ok="handleSubmit"
   >
     <BasicForm @register="registerForm" />
-  </BasicDrawer>
+  </BasicModal>
 </template>
 <script lang="ts" setup>
   import { ref, computed, unref } from 'vue';
   import { BasicForm, useForm } from '/@/components/Form/index';
   import { formSchema } from './dict.data';
-  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
   import { TreeItem } from '/@/components/Tree';
-  //import { getMenuList } from '/@/api/system/role';
   import { set } from '/@/api/system/dict';
+  import {BasicModal, useModalInner} from "/@/components/Modal";
 
   const emit = defineEmits(['success', 'register']);
   const isUpdate = ref(true);
@@ -29,17 +28,14 @@
     showActionButtonGroup: false,
   });
 
-  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
-    resetFields();
-    setDrawerProps({ confirmLoading: false });
-    // 需要在setFieldsValue之前先填充treeData，否则Tree组件可能会报key not exist警告
-    if (unref(treeData).length === 0) {
-      //treeData.value = (await getMenuList()) as any as TreeItem[];
-    }
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
+    await resetFields();
+    setModalProps({ confirmLoading: false });
+
     isUpdate.value = !!data?.isUpdate;
 
     if (unref(isUpdate)) {
-      setFieldsValue({
+      await setFieldsValue({
         ...data.record,
       });
     }
@@ -50,12 +46,12 @@
   async function handleSubmit() {
     try {
       const values = await validate();
-      setDrawerProps({ confirmLoading: true });
+      setModalProps({ confirmLoading: true });
       await set(values);
-      closeDrawer();
+      closeModal();
       emit('success');
     } finally {
-      setDrawerProps({ confirmLoading: false });
+      setModalProps({ confirmLoading: false });
     }
   }
 </script>

kicc-ui/src/views/system/dict/DictSubDrawer.vue

@@ -1,53 +0,0 @@
-<template>
-  <BasicDrawer
-    v-bind="$attrs"
-    @register="registerDrawer"
-    showFooter
-    :title="getTitle"
-    width="500px"
-    @ok="handleSubmit"
-  >
-    <BasicForm @register="registerForm" />
-  </BasicDrawer>
-</template>
-<script lang="ts" setup>
-  import { ref, computed, unref } from 'vue';
-  import { BasicForm, useForm } from '/@/components/Form/index';
-  import { subFormSchema } from './dict.data';
-  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
-  import { set } from '/@/api/system/dict';
-
-  const emit = defineEmits(['success', 'register']);
-  const isUpdate = ref(true);
-  const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
-    labelWidth: 100,
-    schemas: subFormSchema,
-    showActionButtonGroup: false,
-  });
-
-  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
-    resetFields();
-    setDrawerProps({ confirmLoading: false });
-    isUpdate.value = !!data?.isUpdate;
-
-    if (unref(isUpdate)) {
-      setFieldsValue({
-        ...data.record,
-      });
-    }
-  });
-
-  const getTitle = computed(() => (!unref(isUpdate) ? '新增字典项' : '编辑字典项'));
-
-  async function handleSubmit() {
-    try {
-      const values = await validate();
-      setDrawerProps({ confirmLoading: true });
-      await set(values);
-      closeDrawer();
-      emit('success');
-    } finally {
-      setDrawerProps({ confirmLoading: false });
-    }
-  }
-</script>

kicc-ui/src/views/system/dict/dict.data.ts

@@ -1,5 +1,7 @@
 import {BasicColumn} from '/@/components/Table';
 import {FormSchema} from '/@/components/Table';
+import {h} from "vue";
+import {Tag} from "ant-design-vue";
 
 export const columns: BasicColumn[] = [
     {
@@ -8,44 +10,51 @@ export const columns: BasicColumn[] = [
         width: 100,
     },
     {
-    title: '字典编号',
-    dataIndex: 'code',
+        title: '字典名称',
+        dataIndex: 'name',
         width: 100,
     },
     {
-    title: '字典名称',
-    dataIndex: 'dictValue',
+        title: '字典类型',
+        dataIndex: 'type',
         width: 130,
     },
     {
-    title: '排序',
-    dataIndex: 'sort',
+        title: '系统内置',
+        dataIndex: 'isSys',
         width: 90,
+        customRender: ({ record }) => {
+            const status = record.status;
+            const enable = status === '0';
+            const color = 'gray';
+            const text = enable ? '是' : '否';
+            return h(Tag, { color: color }, () => text);
+        }
     },
-];
-
-export const searchFormSchema: FormSchema[] = [
     {
-    field: 'keyword',
-    label: '关键词',
-    component: 'Input',
-    componentProps: {
-      placeholder: '请输入字典名称/编码',
-    },
-    colProps: { span: 16 },
-  },
+        title: '状态',
+        dataIndex: 'status',
+        width: 90,
+        customRender: ({ record }) => {
+            const status = record.status;
+            const enable = status === '0';
+            const color = enable ? 'green' : 'red';
+            const text = enable ? '启用' : '禁用';
+            return h(Tag, { color: color }, () => text);
+        }
+    }
 ];
 
-export const subSearchFormSchema: FormSchema[] = [
+export const searchFormSchema: FormSchema[] = [
     {
-    field: 'keyword',
-    label: '关键词',
+        field: 'type',
+        label: '字典类型',
         component: 'Input',
         componentProps: {
-      placeholder: '请输入字典名称/编码',
+            placeholder: '请输入字典类型',
         },
         colProps: {span: 16},
-  },
+    }
 ];
 
 export const formSchema: FormSchema[] = [
@@ -56,63 +65,54 @@ export const formSchema: FormSchema[] = [
         show: false,
     },
     {
-    field: 'code',
-    label: '字典编号',
-    component: 'Input',
-  },
-  {
-    field: 'dictValue',
+        field: 'name',
         label: '字典名称',
         component: 'Input',
-  },
-  {
-    field: 'sort',
-    label: '排序',
-    component: 'InputNumber',
-  },
-  {
-    field: 'remark',
-    label: '备注',
-    component: 'InputTextArea',
-  },
-];
+        colProps:{
+            span: 12
+        }
 
-export const subFormSchema: FormSchema[] = [
-  {
-    field: 'id',
-    label: 'ID',
-    component: 'Input',
-    show: false,
     },
     {
-    field: 'parentId',
-    label: '上级ID',
+        field: 'type',
+        label: '字典类型',
         component: 'Input',
-    show: false,
+        colProps:{
+            span: 12
+        }
     },
     {
-    field: 'code',
-    label: '字典编号',
-    component: 'Input',
-    componentProps: { disabled: true },
+        field: 'isSys',
+        label: '系统内置',
+        component: 'Select',
+        defaultValue: '0',
+        componentProps: {
+            options: [
+                { label: '是', value: '0' },
+                { label: '否', value: '1' }
+            ]
         },
-  {
-    field: 'dictKey',
-    label: '字典值',
-    component: 'Input',
+        colProps:{
+            span: 12
+        }
     },
     {
-    field: 'dictValue',
-    label: '字典名称',
-    component: 'Input',
+        field: 'status',
+        label: '状态',
+        component: 'Select',
+        defaultValue: '0',
+        componentProps: {
+            options: [
+                { label: '启用', value: '0' },
+                { label: '禁用', value: '1' }
+            ]
         },
-  {
-    field: 'sort',
-    label: '排序',
-    component: 'InputNumber',
+        colProps:{
+            span: 12
+        }
     },
     {
-    field: 'remark',
+        field: 'remarks',
         label: '备注',
         component: 'InputTextArea',
     },

kicc-ui/src/views/system/dict/dictdata.data.ts

@@ -0,0 +1,82 @@
+import {BasicColumn} from '/@/components/Table';
+import {FormSchema} from '/@/components/Table';
+
+export const columns: BasicColumn[] = [
+    {
+        title: '字典ID',
+        dataIndex: 'id',
+        width: 100,
+    },
+    {
+        title: '字典类型',
+        dataIndex: 'dictType',
+        width: 100,
+    },
+    {
+        title: '字典标签',
+        dataIndex: 'label',
+        width: 130,
+    },
+    {
+        title: '字典键值',
+        dataIndex: 'value',
+        width: 90,
+    },
+    {
+        title: '字典排序',
+        dataIndex: 'sort',
+        width: 90,
+    }
+
+];
+
+
+export const searchFormSchema: FormSchema[] = [
+    {
+        field: 'dataType',
+        label: '字典参数类型',
+        component: 'Input',
+        componentProps: {
+            placeholder: '请输入字典参数类型',
+        },
+        colProps: {span: 16},
+    }
+];
+
+export const formSchema: FormSchema[] = [
+    {
+        field: 'id',
+        label: 'ID',
+        component: 'Input',
+        show: false,
+    },
+    {
+        field: 'dictType',
+        label: '字典类型',
+        component: 'Input',
+        required: true,
+        componentProps: {disabled: true}
+    },
+    {
+        field: 'label',
+        label: '字典标签',
+        component: 'Input',
+        required: true
+    },
+    {
+        field: 'value',
+        label: '字典键值',
+        component: 'Input',
+        required: true
+    },
+    {
+        field: 'sort',
+        label: '排序',
+        component: 'InputNumber',
+    },
+    {
+        field: 'remark',
+        label: '备注',
+        component: 'InputTextArea',
+    }
+];

kicc-ui/src/views/system/dict/index.vue

@@ -23,8 +23,8 @@
         />
       </template>
     </BasicTable>
-    <DictSubTable ref="dictSubRef" class="w-2/4 xl:w-2/4" />
-    <DictDrawer @register="registerDrawer" @success="handleSuccess" />
+    <DictDataTable ref="dictSubRef" class="w-2/4 xl:w-2/4" />
+    <DictModal @register="registerModal" @success="handleSuccess" />
   </PageWrapper>
 </template>
 <script lang="ts">
@@ -35,24 +35,24 @@
   // 插入数据内容
   import { columns, searchFormSchema} from './dict.data';
   // 通过API接口获取日志
-  import { page, del } from '/@/api/system/dict';
-  import { useDrawer } from '/@/components/Drawer';
-  import DictDrawer from './DictDrawer.vue';
-  import DictSubTable from './DictSubTable.vue';
+  import { list, remove } from '/@/api/system/dict';
+  import { useModal } from '/@/components/Modal';
+  import DictModal from './DictModal.vue';
+  import DictDataTable from './DictDataTable.vue';
   import { useMessage } from '/@/hooks/web/useMessage';
 
   export default defineComponent({
-    components: { BasicTable, PageWrapper, DictDrawer, DictSubTable, TableAction },
+    components: { BasicTable, PageWrapper, DictModal, DictDataTable, TableAction },
     setup() {
       const { createMessage } = useMessage();
       const dictSubRef = ref();
-      const [registerDrawer, { openDrawer }] = useDrawer();
+      const [registerModal, { openModal }] = useModal();
       const [registerTable, { reload }] = useTable({
         title: '字典列表',
-        api: page,
+        api: list,
         columns,
         formConfig: {
-          labelWidth: 120,
+          labelWidth: 100,
           schemas: searchFormSchema,
         },
         useSearchForm: true,
@@ -69,25 +69,25 @@
       });
 
       function handleCreate() {
-        openDrawer(true, {
+        openModal(true, {
           isUpdate: false,
         });
       }
       function handleEdit(record: Recordable) {
-        openDrawer(true, {
+        openModal(true, {
           record,
           isUpdate: true,
         });
       }
 
       async function handleDelete(record: Recordable) {
-        await del({ ids: record.id });
+        await remove({ id: record.id });
         createMessage.success('删除成功!');
         handleSuccess();
       }
 
       function clickSubTable(record: Recordable) {
-        dictSubRef.value.filterByDictCode(record);
+        dictSubRef.value.filterByDictType(record);
       }
 
       function handleSuccess() {
@@ -96,7 +96,7 @@
 
       return {
         registerTable,
-        registerDrawer,
+        registerModal,
         clickSubTable,
         handleCreate,
         handleEdit,