!234 vue3 添加验证码关闭功能修复vue2部分查询问题

Merge pull request !234 from xingyu/master

!234 vue3 添加验证码关闭功能修复vue2部分查询问题
Merge pull request !234 from xingyu/master
芋道源码 · Gitee
2 parents 62dc600c e16f8abc
Showing 59 changed files with 931 additions and 261 deletions
yudao-framework/yudao-spring-boot-starter-file/src/main/java/cn/iocoder/yudao/framework/file/core/client/ftp/FtpFileClient.java
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3/views/index.vue.vm
yudao-ui-admin-vue3/package.json
yudao-ui-admin-vue3/src/api/bpm/form/index.ts
yudao-ui-admin-vue3/src/api/bpm/form/types.ts
yudao-ui-admin-vue3/src/api/bpm/leave/index.ts
yudao-ui-admin-vue3/src/api/bpm/leave/types.ts
yudao-ui-admin-vue3/src/api/bpm/model/index.ts
yudao-ui-admin-vue3/src/api/bpm/model/types.ts
yudao-ui-admin-vue3/src/api/bpm/processInstance/index.ts
yudao-ui-admin-vue3/src/api/bpm/processInstance/types.ts
yudao-ui-admin-vue3/src/api/bpm/task/index.ts
yudao-ui-admin-vue3/src/api/bpm/task/types.ts
yudao-ui-admin-vue3/src/api/bpm/taskAssignRule/index.ts
yudao-ui-admin-vue3/src/api/bpm/taskAssignRule/types.ts
yudao-ui-admin-vue3/src/api/bpm/userGroup/index.ts
yudao-ui-admin-vue3/src/api/bpm/userGroup/types.ts
yudao-ui-admin-vue3/src/api/system/user/index.ts
yudao-ui-admin-vue3/src/api/system/user/profile/index.ts
yudao-ui-admin-vue3/src/hooks/web/useAxios.ts
@@ -10,7 +10,6 @@ import cn.iocoder.yudao.framework.file.core.client.AbstractFileClient;
 import java.io.ByteArrayInputStream;
 import java.io.ByteArrayOutputStream;
-import java.io.File;
 /**
  * Ftp 文件客户端
@@ -19,11 +19,6 @@
   })
   const { getList, setSearchParams, delList, exportList } = methods
-  // 导出操作
-  const handleExport = async () => {
-    await exportList('数据.xls')
-  }
-
   // ========== CRUD 相关 ==========
   const actionLoading = ref(false) // 遮罩层
   const actionType = ref('') // 操作按钮的类型
@@ -74,11 +69,6 @@
     }
   }
-  // 删除操作
-  const handleDelete = (row: ${simpleClassName}VO) => {
-    delList(row.id, false)
-  }
-
   // ========== 详情相关 ==========
   const detailRef = ref() // 详情 Ref
@@ -108,7 +98,7 @@
           type="warning"
           v-hasPermi="['${permissionPrefix}:export']"
           :loading="tableObject.exportLoading"
-          @click="handleExport"
+          @click="exportList('数据.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -161,7 +151,7 @@
             link
             type="primary"
             v-hasPermi="['${permissionPrefix}:delete']"
-            @click="handleDelete(row)"
+            @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -26,8 +26,8 @@
   },
   "dependencies": {
     "@iconify/iconify": "^2.2.1",
-    "@vueuse/core": "^8.9.4",
-    "@wangeditor/editor": "^5.1.10",
+    "@vueuse/core": "^9.0.0",
+    "@wangeditor/editor": "^5.1.14",
     "@wangeditor/editor-for-vue": "^5.1.10",
     "@zxcvbn-ts/core": "^2.0.3",
     "animate.css": "^4.1.1",
@@ -35,7 +35,7 @@
     "dayjs": "^1.11.4",
     "echarts": "^5.3.3",
     "echarts-wordcloud": "^2.0.0",
-    "element-plus": "2.2.9",
+    "element-plus": "2.2.11",
     "intro.js": "^6.0.0",
     "jsencrypt": "^3.2.1",
     "lodash-es": "^4.17.21",
@@ -49,14 +49,14 @@
     "vue": "3.2.37",
     "vue-cropper": "^1.0.3",
     "vue-i18n": "9.1.10",
-    "vue-router": "^4.1.2",
+    "vue-router": "^4.1.3",
     "vue-types": "^4.2.0",
     "web-storage-cache": "^1.1.1"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.0.3",
     "@commitlint/config-conventional": "^17.0.3",
-    "@iconify/json": "^2.1.82",
+    "@iconify/json": "^2.1.84",
     "@intlify/vite-plugin-vue-i18n": "^5.0.1",
     "@purge-icons/generated": "^0.8.1",
     "@types/intro.js": "^5.1.0",
@@ -83,7 +83,7 @@
     "postcss-less": "^6.0.0",
     "prettier": "^2.7.1",
     "rimraf": "^3.0.2",
-    "rollup": "^2.77.0",
+    "rollup": "^2.77.2",
     "stylelint": "^14.9.1",
     "stylelint-config-html": "^1.1.0",
     "stylelint-config-prettier": "^9.0.3",
@@ -100,7 +100,7 @@
     "vite-plugin-style-import": "^1.4.1",
     "vite-plugin-svg-icons": "^2.0.1",
     "vite-plugin-windicss": "^1.8.7",
-    "vue-tsc": "^0.39.0",
+    "vue-tsc": "^0.39.2",
     "windicss": "^3.5.6",
     "windicss-analysis": "^0.3.5"
   },
+import { useAxios } from '@/hooks/web/useAxios'
+import { FormVO } from './types'
+const request = useAxios()
+
+// 创建工作流的表单定义
+export const createFormApi = async (data: FormVO) => {
+  return await request.post({
+    url: '/bpm/form/create',
+    data: data
+  })
+}
+
+// 更新工作流的表单定义
+export const updateFormApi = async (data: FormVO) => {
+  return await request.put({
+    url: '/bpm/form/update',
+    data: data
+  })
+}
+
+// 删除工作流的表单定义
+export const deleteFormApi = async (id: number) => {
+  return await request.delete({
+    url: '/bpm/form/delete?id=' + id
+  })
+}
+
+// 获得工作流的表单定义
+export const getFormApi = async (id: number) => {
+  return await request.get({
+    url: '/bpm/form/get?id=' + id
+  })
+}
+
+// 获得工作流的表单定义分页
+export const getFormPageApi = async (params) => {
+  return await request.get({
+    url: '/bpm/form/page',
+    params
+  })
+}
+
+// 获得动态表单的精简列表
+export const getSimpleFormsApi = async () => {
+  return await request.get({
+    url: '/bpm/form/list-all-simple'
+  })
+}
+export type FormVO = {
+  id: number
+  name: string
+  conf: string
+  fields: string[]
+  status: number
+  remark: string
+  createTime: string
+}
+import { useAxios } from '@/hooks/web/useAxios'
+import { LeaveVO } from './types'
+const request = useAxios()
+
+// 创建请假申请
+export const createLeaveApi = async (data: LeaveVO) => {
+  return await request.post({ url: '/bpm/oa/leave/create', data: data })
+}
+
+// 获得请假申请
+export const getLeaveApi = async (id: number) => {
+  return await request.get({ url: '/bpm/oa/leave/get?id=' + id })
+}
+
+// 获得请假申请分页
+export const getLeavePageApi = async (params) => {
+  return await request.get({ url: '/bpm/oa/leave/page', params })
+}
+export type LeaveVO = {
+  id: number
+  result: number
+  type: number
+  reason: string
+  processInstanceId: string
+  startTime: string
+  endTime: string
+  createTime: string
+}
+import { useAxios } from '@/hooks/web/useAxios'
+import { ModelVO } from './types'
+const request = useAxios()
+
+export const getModelPage = async (params) => {
+  return await request.get({ url: '/bpm/model/page', params })
+}
+
+export const getModel = async (id: number) => {
+  return await request.get({ url: '/bpm/model/get?id=' + id })
+}
+
+export const updateModel = async (data: ModelVO) => {
+  return await request.put({ url: '/bpm/model/update', data: data })
+}
+
+// 任务状态修改
+export const updateModelState = async (id: number, state: string) => {
+  const data = {
+    id: id,
+    state: state
+  }
+  return await request.put({ url: '/bpm/model/update-state', data: data })
+}
+
+export const createModel = async (data: ModelVO) => {
+  return await request.post({ url: '/bpm/model/create', data: data })
+}
+
+export const deleteModel = async (id: number) => {
+  return await request.delete({ url: '/bpm/model/delete?id=' + id })
+}
+
+export const deployModel = async (id: number) => {
+  return await request.post({ url: '/bpm/model/deploy?id=' + id })
+}
+export type ModelVO = {
+  id: number
+  formName: string
+  key: string
+  name: string
+  description: string
+  category: string
+  formType: number
+  formId: number
+  formCustomCreatePath: string
+  formCustomViewPath: string
+  status: number
+  remark: string
+  createTime: string
+}
+import { useAxios } from '@/hooks/web/useAxios'
+import { ProcessInstanceVO } from './types'
+const request = useAxios()
+
+export const getMyProcessInstancePage = async (params) => {
+  return await request.get({ url: '/bpm/process-instance/my-page', params })
+}
+
+export const createProcessInstance = async (data: ProcessInstanceVO) => {
+  return await request.post({ url: '/bpm/process-instance/create', data: data })
+}
+
+export const cancelProcessInstance = async (id: number, reason: string) => {
+  const data = {
+    id: id,
+    reason: reason
+  }
+  return await request.delete({ url: '/bpm/process-instance/cancel', data: data })
+}
+
+export const getProcessInstance = async (id: number) => {
+  return await request.get({ url: '/bpm/process-instance/get?id=' + id })
+}
+export type task = {
+  id: string
+  name: string
+}
+export type ProcessInstanceVO = {
+  id: number
+  name: string
+  processDefinitionId: string
+  category: string
+  result: number
+  tasks: task[]
+  fields: string[]
+  status: number
+  remark: string
+  businessKey: string
+  createTime: string
+  endTime: string
+}
+import { useAxios } from '@/hooks/web/useAxios'
+
+const request = useAxios()
+
+export const getTodoTaskPage = async (params) => {
+  return await request.get({ url: '/bpm/task/todo-page', params })
+}
+
+export const getDoneTaskPage = async (params) => {
+  return await request.get({ url: '/bpm/task/done-page', params })
+}
+
+export const completeTask = async (data) => {
+  return await request.put({ url: '/bpm/task/complete', data: data })
+}
+
+export const approveTask = async (data) => {
+  return await request.put({ url: '/bpm/task/approve', data: data })
+}
+
+export const rejectTask = async (data) => {
+  return await request.put({ url: '/bpm/task/reject', data: data })
+}
+export const backTask = async (data) => {
+  return await request.put({ url: '/bpm/task/back', data: data })
+}
+
+export const updateTaskAssignee = async (data) => {
+  return await request.put({ url: '/bpm/task/update-assignee', data: data })
+}
+
+export const getTaskListByProcessInstanceId = async (processInstanceId) => {
+  return await request.get({
+    url: '/bpm/task/list-by-process-instance-id?processInstanceId=' + processInstanceId
+  })
+}
+export type FormVO = {
+  id: number
+  name: string
+  conf: string
+  fields: string[]
+  status: number
+  remark: string
+  createTime: string
+}
+import { useAxios } from '@/hooks/web/useAxios'
+import { TaskAssignVO } from './types'
+const request = useAxios()
+
+export const getTaskAssignRuleList = async (params) => {
+  return await request.get({ url: '/bpm/task-assign-rule/list', params })
+}
+
+export const createTaskAssignRule = async (data: TaskAssignVO) => {
+  return await request.post({
+    url: '/bpm/task-assign-rule/create',
+    data: data
+  })
+}
+
+export const updateTaskAssignRule = async (data: TaskAssignVO) => {
+  return await request.put({
+    url: '/bpm/task-assign-rule/update',
+    data: data
+  })
+}
+export type TaskAssignVO = {
+  id: number
+  modelId: string
+  processDefinitionId: string
+  taskDefinitionKey: string
+  taskDefinitionName: string
+  options: string[]
+  type: number
+}
+import { useAxios } from '@/hooks/web/useAxios'
+import { UserGroupVO } from './types'
+const request = useAxios()
+
+// 创建用户组
+export const createUserGroupApi = async (data: UserGroupVO) => {
+  return await request.post({
+    url: '/bpm/user-group/create',
+    data: data
+  })
+}
+
+// 更新用户组
+export const updateUserGroupApi = async (data: UserGroupVO) => {
+  return await request.put({
+    url: '/bpm/user-group/update',
+    data: data
+  })
+}
+
+// 删除用户组
+export const deleteUserGroupApi = async (id: number) => {
+  return await request.delete({ url: '/bpm/user-group/delete?id=' + id })
+}
+
+// 获得用户组
+export const getUserGroupApi = async (id: number) => {
+  return await request.get({ url: '/bpm/user-group/get?id=' + id })
+}
+
+// 获得用户组分页
+export const getUserGroupPageApi = async (params) => {
+  return await request.get({ url: '/bpm/user-group/page', params })
+}
+
+// 获取用户组精简信息列表
+export const listSimpleUserGroupsApi = async () => {
+  return await request.get({ url: '/bpm/user-group/list-all-simple' })
+}
+export type UserGroupVO = {
+  id: number
+  name: string
+  description: string
+  memberUserIds: number[]
+  status: number
+  remark: string
+  createTime: string
+}
@@ -55,3 +55,8 @@ export const updateUserStatusApi = (id: number, status: number) =&gt; {
   }
   return request.put({ url: '/system/user/update-status', data: data })
 }
+
+// 获取用户精简信息列表
+export const getListSimpleUsersApi = () => {
+  return request.get({ url: '/system/user/list-all-simple' })
+}
@@ -24,6 +24,6 @@ export const updateUserPwdApi = (oldPassword: string, newPassword: string) =&gt; {
 }
 // 用户头像上传
-export const uploadAvatarApi = (data) => {
-  return request.put({ url: '/system/user/profile/update-avatar', data: data })
+export const uploadAvatarApi = (params) => {
+  return request.upload({ url: '/system/user/profile/update-avatar', params })
 }
@@ -42,12 +42,19 @@ async function downloadFn&lt;T = any&gt;(option: AxiosConfig): Promise&lt;T&gt; {
   return res as unknown as Promise<T>
 }
+async function uploadFn<T = any>(option: AxiosConfig): Promise<T> {
+  option.headersType = 'multipart/form-data'
+  const res = await request({ method: 'PUT', ...option })
+  return res as unknown as Promise<T>
+}
+
 export const useAxios = () => {
   return {
     get: getFn,
     post: postFn,
     delete: deleteFn,
     put: putFn,
-    download: downloadFn
+    download: downloadFn,
+    upload: uploadFn
   }
 }
@@ -47,12 +47,17 @@ const iconHouse = useIcon({ icon: &#39;ep:house&#39; })
 const iconAvatar = useIcon({ icon: 'ep:avatar' })
 const iconLock = useIcon({ icon: 'ep:lock' })
 const iconCircleCheck = useIcon({ icon: 'ep:circle-check' })
-const LoginRules = {
+const LoginCaptchaRules = {
   tenantName: [required],
   username: [required],
   password: [required],
   code: [required]
 }
+const LoginRules = {
+  tenantName: [required],
+  username: [required],
+  password: [required]
+}
 const loginLoading = ref(false)
 const loginData = reactive({
   codeImg: '',
@@ -76,8 +81,11 @@ const loginData = reactive({
 // 获取验证码
 const getCode = async () => {
   const res = await LoginApi.getCodeImgApi()
-  loginData.codeImg = 'data:image/gif;base64,' + res.img
-  loginData.loginForm.uuid = res.uuid
+  loginData.captchaEnable = res.enable
+  if (res.enable) {
+    loginData.codeImg = 'data:image/gif;base64,' + res.img
+    loginData.loginForm.uuid = res.uuid
+  }
 }
 //获取租户ID
 const getTenantId = async () => {
@@ -159,7 +167,7 @@ onMounted(async () =&gt; {
 <template>
   <el-form
     :model="loginData.loginForm"
-    :rules="LoginRules"
+    :rules="loginData.captchaEnable ? LoginCaptchaRules : LoginRules"
     label-position="top"
     class="login-form"
     label-width="120px"
@@ -205,7 +213,7 @@ onMounted(async () =&gt; {
         </el-form-item>
       </el-col>
       <el-col :span="24" style="padding-left: 10px; padding-right: 10px">
-        <el-form-item prop="code">
+        <el-form-item prop="code" v-if="loginData.captchaEnable">
           <el-row justify="space-between" style="width: 100%">
             <el-col :span="14">
               <el-input
@@ -2,7 +2,7 @@
 import { getUserProfileApi } from '@/api/system/user/profile'
 import { onMounted, reactive } from 'vue'
 import dayjs from 'dayjs'
-import { UserAvatarVue } from './'
+import UserAvatar from './UserAvatar.vue'
 import { ProfileVO } from '@/api/system/user/profile/types'
 import { useI18n } from '@/hooks/web/useI18n'
 const { t } = useI18n()
@@ -43,7 +43,7 @@ onMounted(async () =&gt; {
 <template>
   <div>
     <div class="text-center">
-      <UserAvatarVue :img="userInfo.user.avatar" />
+      <UserAvatar :img="userInfo.user.avatar" />
     </div>
     <ul class="list-group list-group-striped">
       <li class="list-group-item">
@@ -2,7 +2,7 @@
 import { ref, reactive, watch } from 'vue'
 import 'vue-cropper/dist/index.css'
 import { VueCropper } from 'vue-cropper'
-import { ElRow, ElCol, ElUpload, ElMessage } from 'element-plus'
+import { ElRow, ElCol, ElUpload, ElMessage, ElDialog } from 'element-plus'
 import { propTypes } from '@/utils/propTypes'
 import { uploadAvatarApi } from '@/api/system/user/profile'
 const cropper = ref()
@@ -43,6 +43,8 @@ const changeScale = (num: number) =&gt; {
   num = num || 1
   cropper.value.changeScale(num)
 }
+// 覆盖默认的上传行为
+const requestUpload = () => {}
 /** 上传预处理 */
 const beforeUpload = (file: Blob) => {
   if (file.type.indexOf('image/') == -1) {
@@ -84,7 +86,7 @@ watch(
   <div class="user-info-head" @click="editCropper()">
     <img :src="state.options.img" title="点击上传头像" class="img-circle img-lg" alt="" />
   </div>
-  <Dialog
+  <el-dialog
     v-model="state.dialogVisible"
     :title="state.dialogTitle"
     width="50%"
@@ -92,7 +94,7 @@ watch(
     style="padding: 30px 20px"
   >
     <el-row>
-      <el-col :xs="24" :md="12" :style="{ height: '350px' }">
+      <el-col :xs="24" :md="12" style="height: 350px">
         <VueCropper
           ref="cropper"
           :img="state.options.img"
@@ -105,7 +107,7 @@ watch(
           v-if="state.cropperVisible"
         />
       </el-col>
-      <el-col :xs="24" :md="12" :style="{ height: '350px' }">
+      <el-col :xs="24" :md="12" style="height: 350px">
         <div class="avatar-upload-preview">
           <img
             :src="state.previews.url"
@@ -119,7 +121,12 @@ watch(
     <template #footer>
       <el-row>
         <el-col :lg="2" :md="2">
-          <el-upload action="#" :show-file-list="false" :before-upload="beforeUpload">
+          <el-upload
+            action="#"
+            :http-request="requestUpload"
+            :show-file-list="false"
+            :before-upload="beforeUpload"
+          >
             <el-button size="small">
               <Icon icon="ep:upload-filled" class="mr-5px" />
               选择
@@ -151,7 +158,7 @@ watch(
         </el-col>
       </el-row>
     </template>
-  </Dialog>
+  </el-dialog>
 </template>
 <style scoped>
 .user-info-head {
-<script setup lang="ts"></script>
-
-<template>
-  <div>index</div>
-</template>
-
-<style scoped></style>
+import { reactive } from 'vue'
+import { useI18n } from '@/hooks/web/useI18n'
+import { required } from '@/utils/formRules'
+import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
+import { DICT_TYPE } from '@/utils/dict'
+const { t } = useI18n() // 国际化
+
+// 表单校验
+export const rules = reactive({
+  name: [required]
+})
+
+// CrudSchema
+const crudSchemas = reactive<CrudSchema[]>([
+  {
+    label: t('common.index'),
+    field: 'id',
+    type: 'index',
+    form: {
+      show: false
+    },
+    detail: {
+      show: false
+    }
+  },
+  {
+    label: '表单名',
+    field: 'name',
+    search: {
+      show: true
+    }
+  },
+  {
+    label: t('common.status'),
+    field: 'status',
+    dictType: DICT_TYPE.COMMON_STATUS
+  },
+  {
+    label: '备注',
+    field: 'remark'
+  },
+  {
+    label: t('common.createTime'),
+    field: 'createTime',
+    form: {
+      show: false
+    }
+  },
+  {
+    label: t('table.action'),
+    field: 'action',
+    width: '240px',
+    form: {
+      show: false
+    },
+    detail: {
+      show: false
+    }
+  }
+])
+export const { allSchemas } = useCrudSchemas(crudSchemas)
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import { ref, unref } from 'vue'
+import dayjs from 'dayjs'
+import { ElMessage } from 'element-plus'
+import { DICT_TYPE } from '@/utils/dict'
+import { useTable } from '@/hooks/web/useTable'
+import { useI18n } from '@/hooks/web/useI18n'
+import { FormExpose } from '@/components/Form'
+import type { FormVO } from '@/api/bpm/form/types'
+import { rules, allSchemas } from './form.data'
+import * as FormApi from '@/api/bpm/form'
+const { t } = useI18n() // 国际化
+
+// ========== 列表相关 ==========
+const { register, tableObject, methods } = useTable<FormVO>({
+  getListApi: FormApi.getFormPageApi,
+  delListApi: FormApi.deleteFormApi
+})
+const { getList, setSearchParams, delList } = methods
+
+// ========== CRUD 相关 ==========
+const actionLoading = ref(false) // 遮罩层
+const actionType = ref('') // 操作按钮的类型
+const dialogVisible = ref(false) // 是否显示弹出层
+const dialogTitle = ref('edit') // 弹出层标题
+const formRef = ref<FormExpose>() // 表单 Ref
+
+// 设置标题
+const setDialogTile = (type: string) => {
+  dialogTitle.value = t('action.' + type)
+  actionType.value = type
+  dialogVisible.value = true
+}
+
+// 新增操作
+const handleCreate = () => {
+  setDialogTile('create')
+  // 重置表单
+  unref(formRef)?.getElFormRef()?.resetFields()
+}
+
+// 修改操作
+const handleUpdate = async (row: FormVO) => {
+  setDialogTile('update')
+  // 设置数据
+  const res = await FormApi.getFormApi(row.id)
+  unref(formRef)?.setValues(res)
+}
+
+// 提交按钮
+const submitForm = async () => {
+  actionLoading.value = true
+  // 提交请求
+  try {
+    const data = unref(formRef)?.formModel as FormVO
+    if (actionType.value === 'create') {
+      await FormApi.createFormApi(data)
+      ElMessage.success(t('common.createSuccess'))
+    } else {
+      await FormApi.updateFormApi(data)
+      ElMessage.success(t('common.updateSuccess'))
+    }
+    // 操作成功，重新加载列表
+    dialogVisible.value = false
+    await getList()
+  } finally {
+    actionLoading.value = false
+  }
+}
+
+// ========== 详情相关 ==========
+const detailRef = ref() // 详情 Ref
+
+// 详情操作
+const handleDetail = async (row: FormVO) => {
+  // 设置数据
+  detailRef.value = row
+  setDialogTile('detail')
+}
+
+// ========== 初始化 ==========
+getList()
+</script>
 <template>
-  <div>index</div>
-</template>
+  <!-- 搜索工作区 -->
+  <ContentWrap>
+    <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
+  </ContentWrap>
+  <ContentWrap>
+    <!-- 操作工具栏 -->
+    <div class="mb-10px">
+      <el-button type="primary" v-hasPermi="['bpm:form:create']" @click="handleCreate">
+        <Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
+      </el-button>
+    </div>
+    <!-- 列表 -->
+    <Table
+      :columns="allSchemas.tableColumns"
+      :selection="false"
+      :data="tableObject.tableList"
+      :loading="tableObject.loading"
+      :pagination="{
+        total: tableObject.total
+      }"
+      v-model:pageSize="tableObject.pageSize"
+      v-model:currentPage="tableObject.currentPage"
+      @register="register"
+    >
+      <template #status="{ row }">
+        <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" />
+      </template>
+      <template #createTime="{ row }">
+        <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
+      </template>
+      <template #action="{ row }">
+        <el-button link type="primary" v-hasPermi="['bpm:form:update']" @click="handleUpdate(row)">
+          <Icon icon="ep:edit" class="mr-1px" /> {{ t('action.edit') }}
+        </el-button>
+        <el-button link type="primary" v-hasPermi="['bpm:form:update']" @click="handleDetail(row)">
+          <Icon icon="ep:view" class="mr-1px" /> {{ t('action.detail') }}
+        </el-button>
+        <el-button
+          link
+          type="primary"
+          v-hasPermi="['bpm:form:delete']"
+          @click="delList(row.id, false)"
+        >
+          <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
+        </el-button>
+      </template>
+    </Table>
+  </ContentWrap>
-<style scoped></style>
+  <Dialog v-model="dialogVisible" :title="dialogTitle">
+    <!-- 对话框(添加 / 修改) -->
+    <Form
+      v-if="['create', 'update'].includes(actionType)"
+      :schema="allSchemas.formSchema"
+      :rules="rules"
+      ref="formRef"
+    />
+    <!-- 对话框(详情) -->
+    <Descriptions
+      v-if="actionType === 'detail'"
+      :schema="allSchemas.detailSchema"
+      :data="detailRef"
+    >
+      <template #status="{ row }">
+        <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" />
+      </template>
+      <template #createTime="{ row }">
+        <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
+      </template>
+    </Descriptions>
+    <!-- 操作按钮 -->
+    <template #footer>
+      <el-button
+        v-if="['create', 'update'].includes(actionType)"
+        type="primary"
+        :loading="actionLoading"
+        @click="submitForm"
+      >
+        {{ t('action.save') }}
+      </el-button>
+      <el-button @click="dialogVisible = false">{{ t('dialog.close') }}</el-button>
+    </template>
+  </Dialog>
+</template>
+import { reactive } from 'vue'
+import { useI18n } from '@/hooks/web/useI18n'
+import { required } from '@/utils/formRules'
+import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
+import { DICT_TYPE } from '@/utils/dict'
+const { t } = useI18n() // 国际化
+
+// 表单校验
+export const rules = reactive({
+  name: [required]
+})
+
+// CrudSchema
+const crudSchemas = reactive<CrudSchema[]>([
+  {
+    label: t('common.index'),
+    field: 'id',
+    type: 'index',
+    form: {
+      show: false
+    },
+    detail: {
+      show: false
+    }
+  },
+  {
+    label: '组名',
+    field: 'name',
+    search: {
+      show: true
+    }
+  },
+  {
+    label: '成员',
+    field: 'memberUserIds'
+  },
+  {
+    label: '描述',
+    field: 'description'
+  },
+  {
+    label: t('common.status'),
+    field: 'status',
+    dictType: DICT_TYPE.COMMON_STATUS
+  },
+  {
+    label: '备注',
+    field: 'remark',
+    table: {
+      show: false
+    }
+  },
+  {
+    label: t('common.createTime'),
+    field: 'createTime',
+    form: {
+      show: false
+    }
+  },
+  {
+    label: t('table.action'),
+    field: 'action',
+    width: '240px',
+    form: {
+      show: false
+    },
+    detail: {
+      show: false
+    }
+  }
+])
+export const { allSchemas } = useCrudSchemas(crudSchemas)
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import { ref, unref, onMounted } from 'vue'
+import dayjs from 'dayjs'
+import { ElMessage, ElSelect, ElOption } from 'element-plus'
+import { DICT_TYPE } from '@/utils/dict'
+import { useTable } from '@/hooks/web/useTable'
+import { useI18n } from '@/hooks/web/useI18n'
+import { FormExpose } from '@/components/Form'
+import type { UserGroupVO } from '@/api/bpm/userGroup/types'
+import { rules, allSchemas } from './group.data'
+import * as UserGroupApi from '@/api/bpm/userGroup'
+import { getListSimpleUsersApi } from '@/api/system/user'
+import { UserVO } from '@/api/system/user/types'
+
+const { t } = useI18n() // 国际化
+
+// ========== 列表相关 ==========
+const { register, tableObject, methods } = useTable<UserGroupVO>({
+  getListApi: UserGroupApi.getUserGroupPageApi,
+  delListApi: UserGroupApi.deleteUserGroupApi
+})
+const { getList, setSearchParams, delList } = methods
+
+// ========== CRUD 相关 ==========
+const actionLoading = ref(false) // 遮罩层
+const actionType = ref('') // 操作按钮的类型
+const dialogVisible = ref(false) // 是否显示弹出层
+const dialogTitle = ref('edit') // 弹出层标题
+const formRef = ref<FormExpose>() // 表单 Ref
+
+// ========== 用户选择  ==========
+const userIds = ref<number[]>([])
+const userOptions = ref<UserVO[]>([])
+const getUserOptions = async () => {
+  const res = await getListSimpleUsersApi()
+  userOptions.value.push(...res)
+}
+
+// 设置标题
+const setDialogTile = (type: string) => {
+  dialogTitle.value = t('action.' + type)
+  actionType.value = type
+  dialogVisible.value = true
+}
+
+// 新增操作
+const handleCreate = () => {
+  setDialogTile('create')
+  userIds.value = []
+  // 重置表单
+  unref(formRef)?.getElFormRef()?.resetFields()
+}
+
+// 修改操作
+const handleUpdate = async (row: UserGroupVO) => {
+  setDialogTile('update')
+  // 设置数据
+  const res = await UserGroupApi.getUserGroupApi(row.id)
+  userIds.value = res.memberUserIds
+  unref(formRef)?.setValues(res)
+}
+
+// 提交按钮
+const submitForm = async () => {
+  actionLoading.value = true
+  // 提交请求
+  try {
+    const data = unref(formRef)?.formModel as UserGroupVO
+    data.memberUserIds = userIds.value
+    if (actionType.value === 'create') {
+      await UserGroupApi.createUserGroupApi(data)
+      ElMessage.success(t('common.createSuccess'))
+    } else {
+      await UserGroupApi.updateUserGroupApi(data)
+      ElMessage.success(t('common.updateSuccess'))
+    }
+    // 操作成功，重新加载列表
+    dialogVisible.value = false
+    await getList()
+  } finally {
+    actionLoading.value = false
+  }
+}
+
+// 根据用户名获取用户真实名
+const getUserNickName = (userId: number) => {
+  for (const user of userOptions.value) {
+    if (user.id === userId) return user.nickname
+  }
+  return '未知(' + userId + ')'
+}
+// ========== 详情相关 ==========
+const detailRef = ref() // 详情 Ref
+
+// 详情操作
+const handleDetail = async (row: UserGroupVO) => {
+  // 设置数据
+  detailRef.value = row
+  setDialogTile('detail')
+}
+
+// ========== 初始化 ==========
+onMounted(async () => {
+  await getList()
+  await getUserOptions()
+})
+</script>
 <template>
-  <div>index</div>
-</template>
+  <!-- 搜索工作区 -->
+  <ContentWrap>
+    <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
+  </ContentWrap>
+  <ContentWrap>
+    <!-- 操作工具栏 -->
+    <div class="mb-10px">
+      <el-button type="primary" v-hasPermi="['bpm:user-group:create']" @click="handleCreate">
+        <Icon icon="ep:zoom-in" class="mr-5px" /> {{ t('action.add') }}
+      </el-button>
+    </div>
+    <!-- 列表 -->
+    <Table
+      :columns="allSchemas.tableColumns"
+      :selection="false"
+      :data="tableObject.tableList"
+      :loading="tableObject.loading"
+      :pagination="{
+        total: tableObject.total
+      }"
+      v-model:pageSize="tableObject.pageSize"
+      v-model:currentPage="tableObject.currentPage"
+      @register="register"
+    >
+      <template #status="{ row }">
+        <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" />
+      </template>
+      <template #memberUserIds="{ row }">
+        <span v-for="userId in row.memberUserIds" :key="userId">
+          {{ getUserNickName(userId) + ' ' }}
+        </span>
+      </template>
+      <template #createTime="{ row }">
+        <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
+      </template>
+      <template #action="{ row }">
+        <el-button
+          link
+          type="primary"
+          v-hasPermi="['bpm:user-group:update']"
+          @click="handleUpdate(row)"
+        >
+          <Icon icon="ep:edit" class="mr-1px" /> {{ t('action.edit') }}
+        </el-button>
+        <el-button
+          link
+          type="primary"
+          v-hasPermi="['bpm:user-group:update']"
+          @click="handleDetail(row)"
+        >
+          <Icon icon="ep:view" class="mr-1px" /> {{ t('action.detail') }}
+        </el-button>
+        <el-button
+          link
+          type="primary"
+          v-hasPermi="['bpm:user-group:delete']"
+          @click="delList(row.id, false)"
+        >
+          <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
+        </el-button>
+      </template>
+    </Table>
+  </ContentWrap>
-<style scoped></style>
+  <Dialog v-model="dialogVisible" :title="dialogTitle">
+    <!-- 对话框(添加 / 修改) -->
+    <Form
+      v-if="['create', 'update'].includes(actionType)"
+      :schema="allSchemas.formSchema"
+      :rules="rules"
+      ref="formRef"
+    >
+      <template #memberUserIds>
+        <el-select v-model="userIds" multiple>
+          <el-option
+            v-for="item in userOptions"
+            :key="item.id"
+            :label="item.nickname"
+            :value="item.id"
+          />
+        </el-select>
+      </template>
+    </Form>
+    <!-- 对话框(详情) -->
+    <Descriptions
+      v-if="actionType === 'detail'"
+      :schema="allSchemas.detailSchema"
+      :data="detailRef"
+    >
+      <template #memberUserIds="{ row }">
+        <span v-for="userId in row.memberUserIds" :key="userId">
+          {{ getUserNickName(userId) + ' ' }}
+        </span>
+      </template>
+      <template #status="{ row }">
+        <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" />
+      </template>
+      <template #createTime="{ row }">
+        <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
+      </template>
+    </Descriptions>
+    <!-- 操作按钮 -->
+    <template #footer>
+      <el-button
+        v-if="['create', 'update'].includes(actionType)"
+        type="primary"
+        :loading="actionLoading"
+        @click="submitForm"
+      >
+        {{ t('action.save') }}
+      </el-button>
+      <el-button @click="dialogVisible = false">{{ t('dialog.close') }}</el-button>
+    </template>
+  </Dialog>
+</template>
@@ -23,10 +23,6 @@ const { getList, setSearchParams, exportList } = methods
 const detailRef = ref() // 详情 Ref
 const dialogVisible = ref(false) // 是否显示弹出层
 const dialogTitle = ref('') // 弹出层标题
-// 导出操作
-const handleExport = async () => {
-  await exportList('用户数据.xls')
-}
 // 详情操作
 const handleDetail = (row: ApiErrorLogVO) => {
@@ -57,7 +53,7 @@ getList()
     <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
   </ContentWrap>
   <ContentWrap>
-    <el-button v-hasPermi="['infra:api-error-log:export']" @click="handleExport">
+    <el-button v-hasPermi="['infra:api-error-log:export']" @click="exportList('错误数据.xls')">
       <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
     </el-button>
     <!-- 列表 -->
@@ -49,10 +49,6 @@ const handleGenTable = async (row: CodegenTableVO) =&gt; {
   const res = await CodegenApi.downloadCodegenApi(row.id)
   download.zip(res, 'codegen-' + row.className + '.zip')
 }
-// 删除操作
-const handleDelete = (row: CodegenTableVO) => {
-  delList(row.id, false)
-}
 // 查询操作
 const handleQuery = () => {
   getList()
@@ -112,7 +108,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['infra:codegen:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -19,11 +19,6 @@ const { register, tableObject, methods } = useTable&lt;ConfigVO&gt;({
 })
 const { getList, setSearchParams, delList, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('参数配置.xls')
-}
-
 // ========== CRUD 相关 ==========
 const actionLoading = ref(false) // 遮罩层
 const actionType = ref('') // 操作按钮的类型
@@ -74,11 +69,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: ConfigVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -108,7 +98,7 @@ getList()
         type="warning"
         v-hasPermi="['infra:config:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('参数配置.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -156,7 +146,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['infra:config:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -79,11 +79,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: FileConfigVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -169,7 +164,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['infra:file-config:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -69,10 +69,6 @@ const excelUploadError = (): void =&gt; {
 const detailRef = ref() // 详情 Ref
 const dialogVisible = ref(false) // 是否显示弹出层
 const dialogTitle = ref('') // 弹出层标题
-// 删除操作
-const handleDelete = (row: FileVO) => {
-  delList(row.id, false)
-}
 // 详情操作
 const handleDetail = (row: FileVO) => {
   // 设置数据
@@ -128,7 +124,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['infra:file:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -25,10 +25,6 @@ const getTableList = async () =&gt; {
   }
   await getList()
 }
-// 导出操作
-const handleExport = async () => {
-  await exportList('定时任务日志.xls')
-}
 // ========== CRUD 相关 ==========
 const dialogVisible = ref(false) // 是否显示弹出层
@@ -63,7 +59,7 @@ onMounted(() =&gt; {
         type="warning"
         v-hasPermi="['infra:job:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('定时任务日志.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -22,11 +22,6 @@ const { register, tableObject, methods } = useTable&lt;JobVO&gt;({
 })
 const { getList, setSearchParams, delList, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('定时任务.xls')
-}
-
 // ========== CRUD 相关 ==========
 const actionLoading = ref(false) // 遮罩层
 const actionType = ref('') // 操作按钮的类型
@@ -92,11 +87,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: JobVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -126,7 +116,7 @@ getList()
         type="warning"
         v-hasPermi="['infra:job:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('定时任务.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -157,7 +147,12 @@ getList()
         <el-button link type="primary" v-hasPermi="['infra:job:query']" @click="handleDetail(row)">
           <Icon icon="ep:view" class="mr-1px" /> {{ t('action.detail') }}
         </el-button>
-        <el-button link type="primary" v-hasPermi="['infra:job:delete']" @click="handleDelete(row)">
+        <el-button
+          link
+          type="primary"
+          v-hasPermi="['infra:job:delete']"
+          @click="delList(row.id, false)"
+        >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
         <el-button link type="primary" v-hasPermi="['infra:job:trigger']" @click="handleRun(row)">
@@ -19,11 +19,6 @@ const { register, tableObject, methods } = useTable&lt;AppVO&gt;({
 })
 const { getList, setSearchParams, delList, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('应用数据.xls')
-}
-
 // ========== CRUD 相关 ==========
 const actionLoading = ref(false) // 遮罩层
 const actionType = ref('') // 操作按钮的类型
@@ -74,11 +69,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: AppVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -108,7 +98,7 @@ getList()
         type="warning"
         v-hasPermi="['system:post:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('应用数据.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -153,7 +143,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:post:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -19,11 +19,6 @@ const { register, tableObject, methods } = useTable&lt;MerchantVO&gt;({
 })
 const { getList, setSearchParams, delList, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('商户数据.xls')
-}
-
 // ========== CRUD 相关 ==========
 const actionLoading = ref(false) // 遮罩层
 const actionType = ref('') // 操作按钮的类型
@@ -74,11 +69,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: MerchantVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -108,7 +98,7 @@ getList()
         type="warning"
         v-hasPermi="['system:post:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('商户数据.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -153,7 +143,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:post:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -17,10 +17,6 @@ const { register, tableObject, methods } = useTable&lt;OrderVO&gt;({
   exportListApi: OrderApi.exportOrderApi
 })
 const { getList, setSearchParams, delList, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('订单数据.xls')
-}
 // ========== CRUD 相关 ==========
 const actionLoading = ref(false) // 遮罩层
 const actionType = ref('') // 操作按钮的类型
@@ -71,11 +67,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: OrderVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -105,7 +96,7 @@ getList()
         type="warning"
         v-hasPermi="['pay:order:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('订单数据.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -133,7 +124,12 @@ getList()
         <el-button link type="primary" v-hasPermi="['pay:order:update']" @click="handleDetail(row)">
           <Icon icon="ep:view" class="mr-1px" /> {{ t('action.detail') }}
         </el-button>
-        <el-button link type="primary" v-hasPermi="['pay:order:delete']" @click="handleDelete(row)">
+        <el-button
+          link
+          type="primary"
+          v-hasPermi="['pay:order:delete']"
+          @click="delList(row.id, false)"
+        >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
       </template>
@@ -17,20 +17,10 @@ const { register, tableObject, methods } = useTable&lt;RefundVO&gt;({
 })
 const { getList, setSearchParams, delList, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('退款订单.xls')
-}
-
 // ========== CRUD 相关 ==========
 const dialogVisible = ref(false) // 是否显示弹出层
 const dialogTitle = ref('edit') // 弹出层标题
-// 删除操作
-const handleDelete = (row: RefundVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -58,7 +48,7 @@ getList()
         type="warning"
         v-hasPermi="['system:post:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('退款订单.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -95,7 +85,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:post:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -38,10 +38,6 @@ const handleTypeUpdate = async (row: DictTypeVO) =&gt; {
   const res = await DictTypeApi.getDictTypeApi(row.id)
   unref(typeFormRef)?.setValues(res)
 }
-// 字典分类删除操作
-const handleTypeDelete = async (row: DictTypeVO) => {
-  await delTypeList(row.id, false)
-}
 // ========== 字典数据列表相关 ==========
 const tableTypeSelect = ref(false)
@@ -71,10 +67,6 @@ const handleDataUpdate = async (row: DictDataVO) =&gt; {
   const res = await DictDataApi.getDictDataApi(row.id)
   unref(dataFormRef)?.setValues(res)
 }
-// 字典数据删除操作
-const handleDataDelete = async (row: DictTypeVO) => {
-  await delDataList(row.id, false)
-}
 // 字典分类点击行事件
 const parentType = ref('')
 const onClickType = async (data: { [key: string]: any }) => {
@@ -195,7 +187,7 @@ onMounted(async () =&gt; {
             link
             type="primary"
             v-hasPermi="['system:dict:delete']"
-            @click="handleTypeDelete(row)"
+            @click="delTypeList(row.id, false)"
           >
             <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
           </el-button>
@@ -252,7 +244,7 @@ onMounted(async () =&gt; {
               link
               type="primary"
               v-hasPermi="['system:dict:delete']"
-              @click="handleDataDelete(row)"
+              @click="delDataList(row.id, false)"
             >
               <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
             </el-button>
@@ -68,11 +68,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: ErrorCodeVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -139,7 +134,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:error-code:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -67,11 +67,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: NoticeVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -141,7 +136,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:notice:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -68,11 +68,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: OAuth2ClientVo) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -152,7 +147,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:oauth2-client:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -18,10 +18,6 @@ const detailRef = ref() // 详情 Ref
 const dialogVisible = ref(false) // 是否显示弹出层
 const dialogTitle = ref(t('action.detail')) // 弹出层标题
 const { getList, setSearchParams, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('操作日志.xls')
-}
 // 详情
 const handleDetail = (row: OperateLogVO) => {
   // 设置数据
@@ -41,7 +37,7 @@ getList()
         type="warning"
         v-hasPermi="['system:operate-log:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('操作日志.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -19,11 +19,6 @@ const { register, tableObject, methods } = useTable&lt;PostVO&gt;({
 })
 const { getList, setSearchParams, delList, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('岗位数据.xls')
-}
-
 // ========== CRUD 相关 ==========
 const actionLoading = ref(false) // 遮罩层
 const actionType = ref('') // 操作按钮的类型
@@ -74,11 +69,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: PostVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -108,7 +98,7 @@ getList()
         type="warning"
         v-hasPermi="['system:post:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('岗位数据.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -153,7 +143,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:post:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -83,11 +83,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: RoleVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -221,7 +216,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:role:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -19,10 +19,6 @@ const { register, tableObject, methods } = useTable&lt;SensitiveWordVO&gt;({
 })
 const { getList, setSearchParams, delList, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('敏感词数据.xls')
-}
 // 获取标签
 const tagsOptions = ref()
 const getTags = async () => {
@@ -79,11 +75,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: SensitiveWordVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -116,7 +107,7 @@ onMounted(async () =&gt; {
         type="warning"
         v-hasPermi="['system:post:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('敏感词数据.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -171,7 +162,7 @@ onMounted(async () =&gt; {
           link
           type="primary"
           v-hasPermi="['system:post:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -68,11 +68,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: SmsChannelVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -142,7 +137,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:sms-channel:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -68,11 +68,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: SmsTemplateVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -190,7 +185,7 @@ getList()
           link
           type="primary"
           v-hasPermi="['system:sms-template:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -21,10 +21,6 @@ const { register, tableObject, methods } = useTable&lt;TenantVO&gt;({
 })
 const { getList, setSearchParams, delList, exportList } = methods
-// 导出操作
-const handleExport = async () => {
-  await exportList('租户数据.xls')
-}
 // ========== 套餐 ==========
 const tenantPackageId = ref() // 套餐
 const tenantPackageOptions = ref<TenantPackageVO[]>([]) //套餐列表
@@ -97,11 +93,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: TenantVO) => {
-  delList(row.id, false)
-}
-
 // ========== 详情相关 ==========
 const detailRef = ref() // 详情 Ref
@@ -134,7 +125,7 @@ onMounted(async () =&gt; {
         type="warning"
         v-hasPermi="['system:tenant:export']"
         :loading="tableObject.exportLoading"
-        @click="handleExport"
+        @click="exportList('租户数据.xls')"
       >
         <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
       </el-button>
@@ -191,7 +182,7 @@ onMounted(async () =&gt; {
           link
           type="primary"
           v-hasPermi="['system:tenant:delete']"
-          @click="handleDelete(row)"
+          @click="delList(row.id, false)"
         >
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
@@ -101,11 +101,6 @@ const submitForm = async () =&gt; {
   }
 }
-// 删除操作
-const handleDelete = (row: TenantPackageVO) => {
-  delList(row.id, false)
-}
-
 // ========== 初始化 ==========
 onMounted(async () => {
   await getList()
@@ -149,7 +144,7 @@ onMounted(async () =&gt; {
         <el-button link type="primary" @click="handleUpdate(row)">
           <Icon icon="ep:edit" class="mr-1px" /> {{ t('action.edit') }}
         </el-button>
-        <el-button link type="primary" @click="handleDelete(row)">
+        <el-button link type="primary" @click="delList(row.id, false)">
           <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
         </el-button>
       </template>
@@ -164,15 +164,6 @@ const handleResetPwd = (row: UserVO) =&gt; {
     })
   })
 }
-// 删除操作
-const handleDelete = (row: UserVO) => {
-  delList(row.id, false)
-}
-
-// 导出操作
-const handleExport = async () => {
-  await exportList('用户数据.xls')
-}
 // ========== 详情相关 ==========
 const detailRef = ref()
@@ -300,7 +291,11 @@ getList()
         >
           <Icon icon="ep:upload" class="mr-5px" /> {{ t('action.import') }}
         </el-button>
-        <el-button type="warning" v-hasPermi="['system:user:export']" @click="handleExport">
+        <el-button
+          type="warning"
+          v-hasPermi="['system:user:export']"
+          @click="exportList('用户数据.xls')"
+        >
           <Icon icon="ep:download" class="mr-5px" /> {{ t('action.export') }}
         </el-button>
       </div>
@@ -360,7 +355,7 @@ getList()
             link
             type="primary"
             v-hasPermi="['system:user:delete']"
-            @click="handleDelete(row)"
+            @click="delList(row.id, false)"
           >
             <Icon icon="ep:delete" class="mr-1px" /> {{ t('action.del') }}
           </el-button>
@@ -137,16 +137,19 @@ export default ({ command, mode }: ConfigEnv): UserConfig =&gt; {
         'vue',
         'vue-router',
         'vue-types',
+        'vue-i18n',
         'element-plus/es/locale/lang/zh-cn',
         'element-plus/es/locale/lang/en',
         '@iconify/iconify',
         '@vueuse/core',
         'axios',
         'qs',
+        'dayjs',
         'echarts',
         'echarts-wordcloud',
         'intro.js',
         'qrcode',
+        'pinia',
         '@wangeditor/editor',
         '@wangeditor/editor-for-vue'
       ]
@@ -101,10 +101,8 @@ export default {
     /** 查询列表 */
     getList() {
       this.loading = true;
-      // 处理查询参数
-      let params = {...this.queryParams};
       // 执行查询
-      getFormPage(params).then(response => {
+      getFormPage(this.queryParams).then(response => {
         this.list = response.data.list;
         this.total = response.data.total;
         this.loading = false;
@@ -121,7 +121,7 @@
     <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
       <el-form ref="form" :model="form" :rules="rules" label-width="110px">
         <el-form-item label="流程标识" prop="key">
-          <el-input v-model="form.key" placeholder="请输入流标标识" style="width: 330px;" :disabled="form.id" />
+          <el-input v-model="form.key" placeholder="请输入流标标识" style="width: 330px;" :disabled="!!form.id" />
           <el-tooltip v-if="!form.id" class="item" effect="light" content="新建后，流程标识不可修改！" placement="top">
             <i style="padding-left: 5px;" class="el-icon-question" />
           </el-tooltip>
@@ -130,7 +130,7 @@
           </el-tooltip>
         </el-form-item>
         <el-form-item label="流程名称" prop="name">
-          <el-input v-model="form.name" placeholder="请输入流程名称" :disabled="form.id" clearable />
+          <el-input v-model="form.name" placeholder="请输入流程名称" :disabled="!!form.id" clearable />
         </el-form-item>
         <el-form-item v-if="form.id" label="流程分类" prop="category">
           <el-select v-model="form.category" placeholder="请选择流程分类" clearable style="width: 100%">
@@ -131,7 +131,7 @@ export default {
     getList() {
       this.loading = true;
       // 执行查询
-      getFilePage(params).then(response => {
+      getFilePage(this.queryParams).then(response => {
         this.list = response.data.list;
         this.total = response.data.total;
         this.loading = false;
@@ -165,7 +165,7 @@ export default {
     getList() {
       this.loading = true;
       // 执行查询
-      getBannerPage(params).then(response => {
+      getBannerPage(this.queryParams).then(response => {
         this.list = response.data.list;
         this.total = response.data.total;
         this.loading = false;
@@ -571,7 +571,7 @@
             getList() {
                 this.loading = true;
                 // 执行查询
-                getSpuPage(params).then(response => {
+                getSpuPage(this.queryParams).then(response => {
                     this.list = response.data.list;
                     this.total = response.data.total;
                     this.loading = false;
@@ -206,10 +206,8 @@ export default {
     /** 查询列表 */
     getList() {
       this.loading = true;
-      // 处理查询参数
-      let params = {...this.queryParams};
       // 执行查询
-      getOAuth2ClientPage(params).then(response => {
+      getOAuth2ClientPage(this.queryParams).then(response => {
         this.list = response.data.list;
         this.total = response.data.total;
         this.loading = false;