👣 强制使用单引号

kicc-platform/kicc-platform-biz/kicc-system-biz/src/main/java/com/cloud/kicc/system/controller/DictController.java

@@ -68,10 +68,10 @@ public class DictController {
     }
 
     @SysLog("字典删除")
-    @DeleteMapping("/remove/{ids:[\\w,]+}")
+    @DeleteMapping("/remove/{types:[\\w,]+}")
     @PreAuthorize("@pms.hasPermission('dict_del')")
-    public R remove(@PathVariable String[] ids) {
+    public R remove(@PathVariable String[] types) {
-        dictService.removeByIds(Arrays.asList(ids));
+        dictService.deleteByTypes(types);
         return R.ok();
     }
 

kicc-platform/kicc-platform-biz/kicc-system-biz/src/main/java/com/cloud/kicc/system/service/DictService.java

@@ -13,4 +13,11 @@ import com.cloud.kicc.system.api.entity.Dict;
  */
 public interface DictService extends IService<Dict> {
 
+    /**
+     * 删除字典,包括字典数据
+     * @param types 多个字典类型
+     * @return void
+     */
+    void deleteByTypes(String[] types);
+
 }

kicc-platform/kicc-platform-biz/kicc-system-biz/src/main/java/com/cloud/kicc/system/service/impl/DictServiceImpl.java

@@ -1,10 +1,15 @@
 package com.cloud.kicc.system.service.impl;
 
+import com.baomidou.mybatisplus.core.toolkit.Wrappers;
 import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
 import com.cloud.kicc.system.api.entity.Dict;
+import com.cloud.kicc.system.api.entity.DictData;
 import com.cloud.kicc.system.mapper.DictMapper;
+import com.cloud.kicc.system.service.DictDataService;
 import com.cloud.kicc.system.service.DictService;
+import lombok.RequiredArgsConstructor;
 import org.springframework.stereotype.Service;
+import org.springframework.transaction.annotation.Transactional;
 
 /**
  *<p>
@@ -15,6 +20,18 @@ import org.springframework.stereotype.Service;
  * @Date: 2022/2/24
  */
 @Service
+@RequiredArgsConstructor
 public class DictServiceImpl extends ServiceImpl<DictMapper, Dict> implements DictService {
 
+    private final DictDataService dictDataService;
+
+    @Override
+    @Transactional(rollbackFor = Exception.class)
+    public void deleteByTypes(String[] types) {
+        for (int i = 0; i < types.length; ++i) {
+            this.remove(Wrappers.<Dict>lambdaUpdate().eq(Dict::getType, types[i]));
+            dictDataService.remove(Wrappers.<DictData>lambdaUpdate().eq(DictData::getDictType, types[i]));
+        }
+    }
+
 }

kicc-ui/.eslintrc.js

@@ -44,13 +44,14 @@ module.exports = defineConfig({
     '@typescript-eslint/no-non-null-assertion': 'off',
     '@typescript-eslint/explicit-module-boundary-types': 'off',
     '@typescript-eslint/no-unused-vars': 'off',
+    '@typescript-eslint/quotes': ['error', 'single'],
 
     /** ----------eslint配置-----------  */
     'no-use-before-define': 'off',
     'no-unused-vars': 'off',
     'space-before-function-paren': 'off',
-    'semi': ['error', 'always',],
+    'semi': ['error', 'always'],
-    "prefer-const": 'off',
+    'prefer-const': 'off',
 
     /** ----------vue配置-----------  */
     'vue/script-setup-uses-vars': 'error',
@@ -75,5 +76,6 @@ module.exports = defineConfig({
         math: 'always',
       },
     ],
+    'vue/html-quotes': [ 'error', 'double', { 'avoidEscape': false } ]
   },
 });

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

@@ -1,119 +1,134 @@
-import {BasicColumn} from '/@/components/Table';
+/**
-import {FormSchema} from '/@/components/Table';
+ * @program: kicc-ui
-import {h} from "vue";
+ * @description: 字典模块动态渲染配置
-import {Tag} from "ant-design-vue";
+ * @author: entfrm开发团队-王翔
+ * @create: 2022/5/8
+ */
 
+import { BasicColumn } from '/@/components/Table';
+import { FormSchema } from '/@/components/Table';
+import { h } from 'vue';
+import { Tag } from 'ant-design-vue';
+
+/** 表格列配置 */
 export const columns: BasicColumn[] = [
-    {
+  {
-        title: '字典ID',
+    title: '字典名称',
-        dataIndex: 'id',
+    dataIndex: 'name'
-        width: 100,
+  },
-    },
+  {
-    {
+    title: '字典类型',
-        title: '字典名称',
+    dataIndex: 'type'
-        dataIndex: 'name',
+  },
-        width: 100,
+  {
-    },
+    title: '系统内置',
-    {
+    dataIndex: 'isSys',
-        title: '字典类型',
+    width: 90,
-        dataIndex: 'type',
+    customRender: ({ record }) => {
-        width: 130,
+      const status = record.status;
-    },
+      const enable = ~~status === 0;
-    {
+      const color = enable ? 'green' : 'red';
-        title: '系统内置',
+      const text = enable ? '是' : '否';
-        dataIndex: 'isSys',
+      return h(Tag, { color: color }, () => text);
-        width: 90,
-        customRender: ({ record }) => {
-            const status = record.status;
-            const enable = status === '0';
-            const color = 'gray';
-            const text = enable ? '是' : '否';
-            return h(Tag, { color: color }, () => text);
-        }
-    },
-    {
-        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 searchFormSchema: FormSchema[] = [
+    title: '状态',
-    {
+    dataIndex: 'status',
-        field: 'type',
+    width: 130,
-        label: '字典类型',
+    customRender: ({ record }) => {
-        component: 'Input',
+      const status = record.status;
-        componentProps: {
+      const enable = ~~status === 0;
-            placeholder: '请输入字典类型',
+      const color = enable ? 'green' : 'red';
-        },
+      const text = enable ? '启用' : '禁用';
-        colProps: {span: 16},
+      return h(Tag, { color: color }, () => text);
     }
+  }
 ];
 
-export const formSchema: FormSchema[] = [
+/** 搜索表单配置 */
-    {
+export const searchFormSchema: FormSchema[] = [
-        field: 'id',
+  {
-        label: 'ID',
+    field: 'name',
-        component: 'Input',
+    label: '字典名称',
-        show: false,
+    component: 'Input',
-    },
+    componentProps: {
-    {
+      placeholder: '请输入字典名称',
-        field: 'name',
-        label: '字典名称',
-        component: 'Input',
-        colProps:{
-            span: 12
-        }
-
     },
-    {
+    colProps: { span: 8 }
-        field: 'type',
+  },
-        label: '字典类型',
+  {
-        component: 'Input',
+    field: 'type',
-        colProps:{
+    label: '字典类型',
-            span: 12
+    component: 'Input',
-        }
+    componentProps: {
+      placeholder: '请输入字典类型',
     },
-    {
+    colProps: { span: 8 }
-        field: 'isSys',
+  },
-        label: '系统内置',
+  {
-        component: 'Select',
+    field: 'status',
-        defaultValue: '0',
+    label: '状态',
-        componentProps: {
+    component: 'Select',
-            options: [
+    componentProps: {
-                { label: '是', value: '0' },
+      options: [
-                { label: '否', value: '1' }
+        { label: '正常', value: '0' },
-            ]
+        { label: '停用', value: '1' }
-        },
+      ]
-        colProps:{
-            span: 12
-        }
     },
-    {
+    colProps: { span: 8 }
-        field: 'status',
+  }
-        label: '状态',
+];
-        component: 'Select',
+
-        defaultValue: '0',
+/** 表单配置 */
-        componentProps: {
+export const formSchema: FormSchema[] = [
-            options: [
+  {
-                { label: '启用', value: '0' },
+    field: 'id',
-                { label: '禁用', value: '1' }
+    label: 'ID',
-            ]
+    component: 'Input',
-        },
+    show: false
-        colProps:{
+  },
-            span: 12
+  {
-        }
+    field: 'name',
+    label: '字典名称',
+    component: 'Input',
+    colProps:{ span: 12 }
+  },
+  {
+    field: 'type',
+    label: '字典类型',
+    component: 'Input',
+    colProps:{ span: 12 }
+  },
+  {
+    field: 'isSys',
+    label: '系统内置',
+    component: 'Select',
+    defaultValue: '0',
+    componentProps: {
+      options: [
+        { label: '是', value: '0' },
+        { label: '否', value: '1' }
+      ]
     },
-    {
+    colProps:{ span: 12 }
-        field: 'remarks',
+  },
-        label: '备注',
+  {
-        component: 'InputTextArea',
+    field: 'status',
+    label: '状态',
+    component: 'Select',
+    defaultValue: '0',
+    componentProps: {
+      options: [
+        { label: '启用', value: '0' },
+        { label: '禁用', value: '1' }
+      ]
     },
+    colProps:{ span: 12 }
+  },
+  {
+    field: 'remarks',
+    label: '备注',
+    component: 'InputTextArea',
+  },
 ];

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

@@ -1,109 +1,177 @@
 <template>
-  <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
+  <PageWrapper dense
-    <BasicTable @register="registerTable" @row-click="clickSubTable" class="w-2/4 xl:w-2/4">
+               fixedHeight
+               contentFullHeight
+               contentClass="flex"
+  >
+    <BasicTable class="w-2/4 xl:w-2/4"
+                @register="registerTable"
+                @selection-change="handleSelectionChange"
+                @row-click="handleClickSubTable"
+    >
       <template #toolbar>
-        <a-button type="primary" @click="handleCreate">新增字典</a-button>
+        <a-button v-auth="['dict_add']"
+                  type="primary"
+                  @click="handleAdd()"
+        >新增字典</a-button>
+        <a-button v-auth="['dict_edit']"
+                  type="primary"
+                  :disabled="state.single"
+                  @click="handleEdit()"
+        >修改字典</a-button>
+        <a-button v-auth="['dict_del']"
+                  type="primary"
+                  :disabled="state.multiple"
+                  @click="handleDel()"
+        >删除字典</a-button>
       </template>
       <template #action="{ record }">
-        <TableAction
+        <TableAction :actions="[
-          :actions="[
+          {
-            {
+            label: '编辑',
-              icon: 'clarity:note-edit-line',
+            icon: 'fa6-regular:pen-to-square',
-              onClick: handleEdit.bind(null, record),
+            auth: ['dict_edit'],
-            },
+            onClick: handleEdit.bind(null, record)
-            {
+          },
-              icon: 'ant-design:delete-outlined',
+          {
-              color: 'error',
+            label: '删除',
-              popConfirm: {
+            icon: 'ant-design:delete-outlined',
-                title: '是否确认删除',
+            auth: ['dict_del'],
-                confirm: handleDelete.bind(null, record),
+            color: 'error',
-              },
+            onClick: handleDel.bind(null, record)
-            },
+          }]"
-          ]"
         />
       </template>
     </BasicTable>
-    <DictDataTable ref="dictSubRef" class="w-2/4 xl:w-2/4" />
+    <DictDataTable ref="dictSubRef" class="w-2/4 xl:w-2/4"/>
-    <DictModal @register="registerModal" @success="handleSuccess" />
+    <!--弹出窗体区域-->
+    <DictModal @register="registerModal" @success="handleRefreshTable"/>
   </PageWrapper>
 </template>
 <script lang="ts">
-  import { defineComponent, ref } from 'vue';
+  /**
-  // 引入基础组件
+   * 提供模板规范代码参考,请尽量保证编写代码风格跟模板规范代码一致
+   * 采用vben-动态表格表单封装组件编写,不采用 setup 写法
+   * Copyright © 2020-2022 <a href="http://www.entfrm.com/">entfrm</a> All rights reserved.
+   * author entfrm开发团队-王翔
+   */
+  import { defineComponent, reactive, ref, toRaw } from 'vue';
   import { PageWrapper } from '/@/components/Page';
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
-  // 插入数据内容
   import { columns, searchFormSchema} from './dict.data';
-  // 通过API接口获取日志
+  import { listDict, delDict } from '/@/api/platform/system/controller/dict';
-  //import { list, remove } from '/@/api/platform/system/controller/dict';
   import { useModal } from '/@/components/Modal';
+  import { useMessage } from '/@/hooks/web/useMessage';
   import DictModal from './DictModal.vue';
   import DictDataTable from './DictDataTable.vue';
-  import { useMessage } from '/@/hooks/web/useMessage';
+  import {delRole} from "/@/api/platform/system/controller/role";
+
+  /** 类型规范统一声明定义区域 */
+  interface TableState {
+    ids: string[];
+    single: boolean;
+    multiple: boolean;
+  }
 
   export default defineComponent({
+    name: 'DictManagement',
     components: { BasicTable, PageWrapper, DictModal, DictDataTable, TableAction },
     setup() {
-      const { createMessage } = useMessage();
+
+      /** 通用变量统一声明区域 */
       const dictSubRef = ref();
+      const state = reactive<TableState>({
+        // 选中数组
+        ids: [],
+        // 非单个禁用
+        single: true,
+        // 非多个禁用
+        multiple: true
+      });
+      const { createConfirm, createMessage } = useMessage();
       const [registerModal, { openModal }] = useModal();
-      const [registerTable, { reload }] = useTable({
+      const [registerTable, { reload, clearSelectedRowKeys }] = useTable({
         title: '字典列表',
-        //api: list,
+        api: listDict,
+        rowKey: 'id',
         columns,
         formConfig: {
-          labelWidth: 100,
+          labelWidth: 80,
           schemas: searchFormSchema,
+          autoSubmitOnEnter: true
         },
+        rowSelection: { type: 'checkbox' },
         useSearchForm: true,
         showTableSetting: true,
         bordered: true,
         showIndexColumn: false,
         actionColumn: {
-          width: 80,
+          width: 220,
           title: '操作',
           dataIndex: 'action',
           slots: { customRender: 'action' },
-          fixed: undefined,
+          fixed: false
         },
+        handleSearchInfoFn: () => clearSelectedRowKeys()
       });
 
-      function handleCreate() {
+      /** 处理多选框选中数据 */
-        openModal(true, {
+      function handleSelectionChange(selection?: Recordable) {
-          isUpdate: false,
+        const rowSelection = toRaw(selection?.keys) || [];
-        });
+        state.ids = rowSelection;
+        state.single = rowSelection.length != 1;
+        state.multiple = !rowSelection.length;
       }
-      function handleEdit(record: Recordable) {
+
-        openModal(true, {
+      /** 新增按钮操作,行内新增与工具栏局域新增通用 */
-          record,
+      function handleAdd() {
-          isUpdate: true,
+        openModal(true,{ _tag: 'add' });
-        });
+      }
+
+      /** 编辑按钮操作,行内编辑 */
+      function handleEdit(record?: Recordable) {
+        record = record || { id: toRaw(state.ids) };
+        openModal(true, { _tag: 'edit', record });
       }
 
-      async function handleDelete(record: Recordable) {
+      /** 删除按钮操作,行内删除 */
-        await remove({ id: record.id });
+      async function handleDel(record?: Recordable) {
-        createMessage.success('删除成功!');
+        const ids = record?.id || toRaw(state.ids);
-        handleSuccess();
+        createConfirm({
+          iconType: 'warning',
+          title: '警告',
+          content: `是否确认删除角色编号为${ids}角色吗?`,
+          onOk: async () => {
+            await delRole(ids);
+            createMessage.success('删除成功!');
+            handleRefreshTable();
+          }
+        });
       }
 
-      function clickSubTable(record: Recordable) {
+      /** 处理点击字典子表 */
+      function handleClickSubTable(record: Recordable) {
         dictSubRef.value.filterByDictType(record);
       }
 
-      function handleSuccess() {
+      /** 处理表格刷新 */
+      function handleRefreshTable() {
+        clearSelectedRowKeys();
         reload();
       }
 
       return {
+        state,
         registerTable,
         registerModal,
-        clickSubTable,
-        handleCreate,
-        handleEdit,
-        handleDelete,
-        handleSuccess,
         dictSubRef,
+        handleClickSubTable,
+        handleAdd,
+        handleEdit,
+        handleDel,
+        handleRefreshTable,
+        handleSelectionChange
       };
-    },
+    }
   });
 </script>