From 9285f3809b38a7909619d6c3af2a23df9ba140fe Mon Sep 17 00:00:00 2001
From: gexinzhineng/gxzn27 <1348660141@qq.com>
Date: Wed, 8 Mar 2023 10:42:57 +0800
Subject: [PATCH 01/40] =?UTF-8?q?=E6=B5=8F=E8=A7=88=E5=99=A8=E7=BC=A9?=
 =?UTF-8?q?=E6=94=BE=E4=BC=9A=E5=AF=BC=E8=87=B4=E4=BF=9D=E5=AD=98=E6=8C=89?=
 =?UTF-8?q?=E9=92=AE=E8=A2=AB=E4=B8=8B=E9=9D=A2=E7=9A=84bpmnjs=E5=9B=BE?=
 =?UTF-8?q?=E6=8C=A1=E4=BD=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bpmnProcessDesigner/package/designer/ProcessDesigner.vue   | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
index e16857ecb..60430c253 100644
--- a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
+++ b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="my-process-designer">
-    <div class="my-process-designer__header">
+    <div class="my-process-designer__header" style="display: table-row-group; z-index: 999">
       <slot name="control-header"></slot>
       <template v-if="!$slots['control-header']">
         <ElButtonGroup key="file-control">
@@ -166,6 +166,7 @@
           @click="processSave"
           :type="props.headerButtonType"
           :disabled="simulationStatus"
+
         />
       </template>
       <!-- 用于打开本地文件-->

From aa3b299ee2197fd34ba103e533f0f9c8f9d59804 Mon Sep 17 00:00:00 2001
From: bimei <18812666091@163.com>
Date: Wed, 8 Mar 2023 17:37:06 +0800
Subject: [PATCH 02/40] =?UTF-8?q?1.=20=E4=BF=AE=E6=94=B9icon=E5=9B=BE?=
 =?UTF-8?q?=E6=A0=87=E5=B1=95=E7=A4=BA=202.=E5=B0=9D=E8=AF=95=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9=E5=8C=85=E5=90=AB=E5=AD=97=E5=85=B8=E8=A1=A8=E7=9A=84?=
 =?UTF-8?q?=E9=A1=B5=E9=9D=A2=E5=8A=A0=E8=BD=BD=E6=97=B6=E6=8A=A5=E9=94=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/permission.ts             | 2 +-
 src/views/bpm/model/index.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/permission.ts b/src/permission.ts
index bcba0119d..0698dc880 100644
--- a/src/permission.ts
+++ b/src/permission.ts
@@ -35,7 +35,7 @@ router.beforeEach(async (to, from, next) => {
       const userStore = useUserStoreWithOut()
       const permissionStore = usePermissionStoreWithOut()
       if (!dictStore.getIsSetDict) {
-        dictStore.setDictMap()
+        await dictStore.setDictMap()
       }
       if (!userStore.getIsSetUser) {
         isRelogin.show = true
diff --git a/src/views/bpm/model/index.vue b/src/views/bpm/model/index.vue
index 298b0b6e7..01a97d3f5 100644
--- a/src/views/bpm/model/index.vue
+++ b/src/views/bpm/model/index.vue
@@ -250,7 +250,7 @@
           name="bpmnFile"
           :data="importForm"
         >
-          <el-icon class="el-icon--upload"><upload-filled /></el-icon>
+          <Icon class="el-icon--upload" icon="ep:upload-filled" />
           <div class="el-upload__text"> 将文件拖到此处，或 <em>点击上传</em> </div>
           <template #tip>
             <div class="el-upload__tip" style="color: red">

From 3354462b7592de1a76aed206972717817566abb7 Mon Sep 17 00:00:00 2001
From: gexinzhineng/gxzn27 <1348660141@qq.com>
Date: Thu, 9 Mar 2023 18:50:19 +0800
Subject: [PATCH 03/40] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=B5=8B=E8=AF=95?=
 =?UTF-8?q?=E6=89=80=E6=8F=90bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../system/sms/smsChannel/sms.channel.data.ts | 17 +++-
 src/views/system/sms/smsLog/index.vue         |  3 +-
 src/views/system/sms/smsLog/sms.log.data.ts   | 17 +++-
 src/views/system/tenant/tenant.data.ts        | 37 ++++++-
 src/views/system/tenantPackage/index.vue      | 96 +++++++++----------
 src/views/system/user/user.data.ts            | 17 +++-
 6 files changed, 129 insertions(+), 58 deletions(-)

diff --git a/src/views/system/sms/smsChannel/sms.channel.data.ts b/src/views/system/sms/smsChannel/sms.channel.data.ts
index d3a807edb..71b096e5d 100644
--- a/src/views/system/sms/smsChannel/sms.channel.data.ts
+++ b/src/views/system/sms/smsChannel/sms.channel.data.ts
@@ -1,6 +1,10 @@
 import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
+import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
+
 const { t } = useI18n() // 国际化
 
+const authorizedGrantOptions = getStrDictOptions(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE)
+
 // 表单校验
 export const rules = reactive({
   signature: [required],
@@ -24,8 +28,17 @@ const crudSchemas = reactive<VxeCrudSchema>({
     {
       title: '渠道编码',
       field: 'code',
-      dictType: DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE,
-      isSearch: true
+      // dictType: DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE,
+      // dictClass: 'string',
+      isSearch: true,
+      form: {
+        component: 'Select',
+        componentProps: {
+          options: authorizedGrantOptions,
+          multiple: false,
+          filterable: true
+        }
+      }
     },
     {
       title: t('common.status'),
diff --git a/src/views/system/sms/smsLog/index.vue b/src/views/system/sms/smsLog/index.vue
index 93d1315fc..7099e1a81 100644
--- a/src/views/system/sms/smsLog/index.vue
+++ b/src/views/system/sms/smsLog/index.vue
@@ -44,12 +44,13 @@ const [registerTable, { exportList }] = useXTable({
 
 // 弹窗相关的变量
 const dialogVisible = ref(false) // 是否显示弹出层
-const dialogTitle = ref('edit') // 弹出层标题
+const dialogTitle = ref('详情') // 弹出层标题
 const actionType = ref('') // 操作按钮的类型
 // ========== 详情相关 ==========
 const detailData = ref() // 详情 Ref
 const handleDetail = (row: SmsLoglApi.SmsLogVO) => {
   // 设置数据
+  actionType.value = 'detail'
   detailData.value = row
   dialogVisible.value = true
 }
diff --git a/src/views/system/sms/smsLog/sms.log.data.ts b/src/views/system/sms/smsLog/sms.log.data.ts
index 4610ee625..c975bb0fa 100644
--- a/src/views/system/sms/smsLog/sms.log.data.ts
+++ b/src/views/system/sms/smsLog/sms.log.data.ts
@@ -1,6 +1,9 @@
 import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
+import { DICT_TYPE, getStrDictOptions } from '@/utils/dict'
+
 const { t } = useI18n() // 国际化
 
+const authorizedGrantOptions = getStrDictOptions(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE)
 // CrudSchema
 const crudSchemas = reactive<VxeCrudSchema>({
   primaryKey: 'id',
@@ -25,9 +28,17 @@ const crudSchemas = reactive<VxeCrudSchema>({
     {
       title: '短信渠道',
       field: 'channelId',
-      dictType: DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE,
-      dictClass: 'number',
-      isSearch: true
+      // dictType: DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE,
+      // dictClass: 'number',
+      isSearch: true,
+      // table: {
+      // component: 'Select',
+      componentProps: {
+        options: authorizedGrantOptions
+        // multiple: false,
+        // filterable: true
+      }
+      // }
     },
     {
       title: '发送状态',
diff --git a/src/views/system/tenant/tenant.data.ts b/src/views/system/tenant/tenant.data.ts
index 2aab1b903..1137b44a2 100644
--- a/src/views/system/tenant/tenant.data.ts
+++ b/src/views/system/tenant/tenant.data.ts
@@ -19,12 +19,44 @@ const getTenantPackageOptions = async () => {
 }
 getTenantPackageOptions()
 
+const validateName = (rule: any, value: any, callback: any) => {
+  const reg = /^[a-zA-Z0-9]{4,30}$/
+  if (value === '') {
+    callback(new Error('请输入用户名称'))
+  } else {
+    console.log(reg.test(rule), 'reg.test(rule)')
+    if (!reg.test(value)) {
+      callback(new Error('用户名称由 数字、字母 组成'))
+    } else {
+      callback()
+    }
+  }
+}
+const validateMobile = (rule: any, value: any, callback: any) => {
+  const reg = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/
+  if (value === '') {
+    callback(new Error('请输入联系手机'))
+  } else {
+    if (!reg.test(value)) {
+      callback(new Error('请输入正确的手机号'))
+    } else {
+      callback()
+    }
+  }
+}
+
 // 表单校验
 export const rules = reactive({
   name: [required],
   packageId: [required],
   contactName: [required],
-  contactMobile: [required],
+  contactMobile: [
+    required,
+    {
+      validator: validateMobile,
+      trigger: 'blur'
+    }
+  ],
   accountCount: [required],
   expireTime: [required],
   username: [
@@ -34,7 +66,8 @@ export const rules = reactive({
       max: 30,
       trigger: 'blur',
       message: '用户名称长度为 4-30 个字符'
-    }
+    },
+    { validator: validateName, trigger: 'blur' }
   ],
   password: [
     required,
diff --git a/src/views/system/tenantPackage/index.vue b/src/views/system/tenantPackage/index.vue
index 9222365bd..c8f5756a1 100644
--- a/src/views/system/tenantPackage/index.vue
+++ b/src/views/system/tenantPackage/index.vue
@@ -15,54 +15,54 @@
         <XTextButton preIcon="ep:delete" :title="t('action.del')" @click="deleteData(row.id)" />
       </template>
     </XTable>
-  </ContentWrap>
-  <XModal v-model="dialogVisible" :title="dialogTitle">
-    <!-- 对话框(添加 / 修改) -->
-    <Form
-      v-if="['create', 'update'].includes(actionType)"
-      :schema="allSchemas.formSchema"
-      :rules="rules"
-      ref="formRef"
-    >
-      <template #menuIds>
-        <el-card>
-          <template #header>
-            <div class="card-header">
-              全选/全不选:
-              <el-switch
-                v-model="treeNodeAll"
-                inline-prompt
-                active-text="是"
-                inactive-text="否"
-                @change="handleCheckedTreeNodeAll()"
-              />
-            </div>
-          </template>
-          <el-tree
-            ref="treeRef"
-            node-key="id"
-            show-checkbox
-            :props="defaultProps"
-            :data="menuOptions"
-            empty-text="加载中，请稍后"
-          />
-        </el-card>
-      </template>
-    </Form>
-    <!-- 操作按钮 -->
-    <template #footer>
-      <!-- 按钮：保存 -->
-      <XButton
+    <XModal v-model="dialogVisible" :title="dialogTitle">
+      <!-- 对话框(添加 / 修改) -->
+      <Form
         v-if="['create', 'update'].includes(actionType)"
-        type="primary"
-        :title="t('action.save')"
-        :loading="loading"
-        @click="submitForm()"
-      />
-      <!-- 按钮：关闭 -->
-      <XButton :loading="loading" :title="t('dialog.close')" @click="dialogVisible = false" />
-    </template>
-  </XModal>
+        :schema="allSchemas.formSchema"
+        :rules="rules"
+        ref="formRef"
+      >
+        <template #menuIds>
+          <el-card class="cardHeight">
+            <template #header>
+              <div class="card-header">
+                全选/全不选:
+                <el-switch
+                  v-model="treeNodeAll"
+                  inline-prompt
+                  active-text="是"
+                  inactive-text="否"
+                  @change="handleCheckedTreeNodeAll()"
+                />
+              </div>
+            </template>
+            <el-tree
+              ref="treeRef"
+              node-key="id"
+              show-checkbox
+              :props="defaultProps"
+              :data="menuOptions"
+              empty-text="加载中，请稍候"
+            />
+          </el-card>
+        </template>
+      </Form>
+      <!-- 操作按钮 -->
+      <template #footer>
+        <!-- 按钮：保存 -->
+        <XButton
+          v-if="['create', 'update'].includes(actionType)"
+          type="primary"
+          :title="t('action.save')"
+          :loading="loading"
+          @click="submitForm()"
+        />
+        <!-- 按钮：关闭 -->
+        <XButton :loading="loading" :title="t('dialog.close')" @click="dialogVisible = false" />
+      </template>
+    </XModal>
+  </ContentWrap>
 </template>
 <script setup lang="ts" name="TenantPackage">
 import { handleTree, defaultProps } from '@/utils/tree'
@@ -179,7 +179,7 @@ onMounted(async () => {
 // getList()
 </script>
 <style scoped>
-.el-card {
+.cardHeight {
   width: 100%;
   max-height: 400px;
   overflow-y: scroll;
diff --git a/src/views/system/user/user.data.ts b/src/views/system/user/user.data.ts
index 94b1d436f..59a795e71 100644
--- a/src/views/system/user/user.data.ts
+++ b/src/views/system/user/user.data.ts
@@ -1,6 +1,18 @@
 import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
 // 国际化
 const { t } = useI18n()
+const validateMobile = (rule: any, value: any, callback: any) => {
+  const reg = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/
+  if (value === '') {
+    callback(new Error('请输入联系手机'))
+  } else {
+    if (!reg.test(value)) {
+      callback(new Error('请输入正确的手机号'))
+    } else {
+      callback()
+    }
+  }
+}
 // 表单校验
 export const rules = reactive({
   username: [required],
@@ -17,12 +29,13 @@ export const rules = reactive({
   ],
   status: [required],
   mobile: [
+    required,
     {
-      required: true,
       len: 11,
       trigger: 'blur',
       message: '请输入正确的手机号码'
-    }
+    },
+    { validator: validateMobile, trigger: 'blur' }
   ]
 })
 // crudSchemas

From b2665afe2af65b1845e94eeea340ec4825b2a22d Mon Sep 17 00:00:00 2001
From: Siyu Kong <boil@vip.qq.com>
Date: Fri, 10 Mar 2023 18:11:05 +0800
Subject: [PATCH 04/40] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8DProcessDesigner.?=
 =?UTF-8?q?vue=E9=94=99=E8=AF=AF=E6=8D=A2=E8=A1=8C=E5=AF=BC=E8=87=B4?=
 =?UTF-8?q?=E7=9A=84=E7=BC=96=E8=AF=91=E9=94=99=E8=AF=AF=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bpmnProcessDesigner/package/designer/ProcessDesigner.vue     | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
index 60430c253..a14b0b60f 100644
--- a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
+++ b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
@@ -166,7 +166,6 @@
           @click="processSave"
           :type="props.headerButtonType"
           :disabled="simulationStatus"
-
         />
       </template>
       <!-- 用于打开本地文件-->

From 58a3af8c84fc34128833389ad214ee67411badc1 Mon Sep 17 00:00:00 2001
From: LinkLi <317842744@qq.com>
Date: Sat, 11 Mar 2023 01:59:27 +0000
Subject: [PATCH 05/40] =?UTF-8?q?!22=20issue#I6KY0M=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E5=BB=BA=E8=AE=AE=20*=20feat:=20=E5=A2=9E=E5=8A=A0=E5=85=A8?=
 =?UTF-8?q?=E5=B1=80=E6=9D=83=E9=99=90=E5=88=A4=E6=96=AD=E5=87=BD=E6=95=B0?=
 =?UTF-8?q?#I6KY0M?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/permission.ts | 45 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 45 insertions(+)
 create mode 100644 src/utils/permission.ts

diff --git a/src/utils/permission.ts b/src/utils/permission.ts
new file mode 100644
index 000000000..a63ee6286
--- /dev/null
+++ b/src/utils/permission.ts
@@ -0,0 +1,45 @@
+import { CACHE_KEY, useCache } from '@/hooks/web/useCache'
+
+const { t } = useI18n() // 国际化
+
+/**
+ * 字符权限校验
+ * @param {Array} value 校验值
+ * @returns {Boolean}
+ */
+export function checkPermi(value: string[]) {
+  if (value && value instanceof Array && value.length > 0) {
+    const { wsCache } = useCache()
+    const permissionDatas = value
+    const all_permission = '*:*:*'
+    const permissions = wsCache.get(CACHE_KEY.USER).permissions
+    const hasPermission = permissions.some((permission) => {
+      return all_permission === permission || permissionDatas.includes(permission)
+    })
+    return !!hasPermission
+  } else {
+    console.error(t('permission.hasPermission'))
+    return false
+  }
+}
+
+/**
+ * 角色权限校验
+ * @param {string[]} value 校验值
+ * @returns {Boolean}
+ */
+export function checkRole(value: string[]) {
+  if (value && value instanceof Array && value.length > 0) {
+    const { wsCache } = useCache()
+    const permissionRoles = value
+    const super_admin = 'admin'
+    const roles = wsCache.get(CACHE_KEY.USER).roles
+    const hasRole = roles.some((role) => {
+      return super_admin === role || permissionRoles.includes(role)
+    })
+    return !!hasRole
+  } else {
+    console.error(t('permission.hasRole'))
+    return false
+  }
+}

From 1757515b14f78ae86b1d8a22839ca79d77aa158b Mon Sep 17 00:00:00 2001
From: chiwenda <18150028757@163.com>
Date: Sun, 12 Mar 2023 12:54:28 +0800
Subject: [PATCH 06/40] =?UTF-8?q?fix:=E5=85=AC=E5=91=8A=E9=80=9A=E7=9F=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/notice/index.ts    |   2 +-
 src/views/system/notice/form.vue  | 131 +++++++++++++++
 src/views/system/notice/index.vue | 270 ++++++++++++++++--------------
 3 files changed, 277 insertions(+), 126 deletions(-)
 create mode 100644 src/views/system/notice/form.vue

diff --git a/src/api/system/notice/index.ts b/src/api/system/notice/index.ts
index f0f5d7e9c..cd420a29a 100644
--- a/src/api/system/notice/index.ts
+++ b/src/api/system/notice/index.ts
@@ -1,7 +1,7 @@
 import request from '@/config/axios'
 
 export interface NoticeVO {
-  id: number
+  id: number | undefined
   title: string
   type: number
   content: string
diff --git a/src/views/system/notice/form.vue b/src/views/system/notice/form.vue
new file mode 100644
index 000000000..0f928a7b8
--- /dev/null
+++ b/src/views/system/notice/form.vue
@@ -0,0 +1,131 @@
+<template>
+  <Dialog :title="modelTitle" v-model="modelVisible">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="80px"
+      v-loading="formLoading"
+    >
+      <el-form-item label="公告标题" prop="title">
+        <el-input v-model="formData.title" placeholder="请输入公告标题" />
+      </el-form-item>
+      <el-form-item label="公告内容" prop="content">
+        <el-input v-model="formData.content" type="textarea" placeholder="请输公告内容" />
+      </el-form-item>
+      <el-form-item label="公告类型" prop="type">
+        <el-select v-model="formData.type" placeholder="请选择公告类型" clearable>
+          <el-option
+            v-for="dict in getDictOptions(DICT_TYPE.SYSTEM_NOTICE_TYPE)"
+            :key="parseInt(dict.value)"
+            :label="dict.label"
+            :value="parseInt(dict.value)"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="状态" prop="status">
+        <el-select v-model="formData.status" placeholder="请选择状态" clearable>
+          <el-option
+            v-for="dict in getDictOptions(DICT_TYPE.COMMON_STATUS)"
+            :key="parseInt(dict.value)"
+            :label="dict.label"
+            :value="parseInt(dict.value)"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="备注" prop="remark">
+        <el-input v-model="formData.remark" type="textarea" placeholder="请输备注" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+        <el-button @click="modelVisible = false">取 消</el-button>
+      </div>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
+import * as NoticeApi from '@/api/system/notice'
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const modelTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const formData = ref({
+  id: undefined,
+  title: '',
+  type: undefined,
+  content: '',
+  status: undefined,
+  remark: ''
+})
+const formRules = reactive({
+  title: [{ required: true, message: '公告标题不能为空', trigger: 'blur' }],
+  type: [{ required: true, message: '公告类型不能为空', trigger: 'change' }],
+  status: [{ required: true, message: '状态不能为空', trigger: 'change' }],
+  content: [{ required: true, message: '公告内容不能为空', trigger: 'blur' }]
+})
+const formRef = ref() // 表单 Ref
+
+/** 打开弹窗 */
+const openModal = async (type: string, id?: number) => {
+  modelVisible.value = true
+  modelTitle.value = t('action.' + type)
+  formType.value = type
+  resetForm()
+  // 修改时，设置数据
+  if (id) {
+    formLoading.value = true
+    try {
+      formData.value = await NoticeApi.getNoticeApi(id)
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = formData.value as unknown as NoticeApi.NoticeVO
+    if (formType.value === 'create') {
+      await NoticeApi.createNoticeApi(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await NoticeApi.updateNoticeApi(data)
+      message.success(t('common.updateSuccess'))
+    }
+    modelVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    id: undefined,
+    title: '',
+    type: undefined,
+    content: '',
+    status: undefined,
+    remark: ''
+  }
+  formRef.value?.resetFields()
+}
+</script>
diff --git a/src/views/system/notice/index.vue b/src/views/system/notice/index.vue
index ab31b09bf..ab375f88b 100644
--- a/src/views/system/notice/index.vue
+++ b/src/views/system/notice/index.vue
@@ -1,150 +1,170 @@
 <template>
-  <ContentWrap>
-    <el-form ref="searchForm" :model="queryParms" :inline="true">
-      <el-form-item label="公告标题">
-        <el-input v-model="queryParms.title" />
+  <content-wrap>
+    <!-- 搜索工作栏 -->
+    <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+      <el-form-item label="公告标题" prop="title">
+        <el-input
+          v-model="queryParams.title"
+          placeholder="请输入公告标题"
+          clearable
+          @keyup.enter="handleQuery"
+        />
       </el-form-item>
-      <el-form-item label="状态">
-        <el-select v-model="queryParms.status">
-          <el-option label="全部" value="" />
-          <el-option label="开启" :value="1" />
-          <el-option label="关闭" :value="0" />
+      <el-form-item label="公告类型" prop="type">
+        <el-select v-model="queryParams.type" placeholder="请选择公告类型" clearable>
+          <el-option
+            v-for="dict in getDictOptions(DICT_TYPE.SYSTEM_NOTICE_TYPE)"
+            :key="parseInt(dict.value)"
+            :label="dict.label"
+            :value="parseInt(dict.value)"
+          />
         </el-select>
       </el-form-item>
+      <el-form-item label="状态" prop="status">
+        <el-select v-model="queryParams.type" placeholder="请选择状态" clearable>
+          <el-option
+            v-for="dict in getDictOptions(DICT_TYPE.COMMON_STATUS)"
+            :key="parseInt(dict.value)"
+            :label="dict.label"
+            :value="parseInt(dict.value)"
+          />
+        </el-select>
+      </el-form-item>
+
       <el-form-item>
-        <el-button type="primary" @click="getList">Query</el-button>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+        <el-button
+          type="primary"
+          @click="openModal('create')"
+          v-hasPermi="['system:notice:create']"
+        >
+          <Icon icon="ep:plus" class="mr-5px" /> 新增
+        </el-button>
       </el-form-item>
     </el-form>
-    <div style="width: 100%; height: 600px">
-      <el-auto-resizer>
-        <template #default="{ height, width }">
-          <el-table-v2
-            :columns="columns"
-            :data="tableData"
-            :width="width"
-            :height="height - 50"
-            fixed
-          />
+    <!-- 列表 -->
+    <el-table v-loading="loading" :data="list" align="center">
+      <el-table-column label="公告主键" align="center" prop="id" />
+      <el-table-column label="公告标题" align="center" prop="title" />
+      <el-table-column label="公告类型" align="center" prop="type">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.SYSTEM_NOTICE_TYPE" :value="scope.row.type" />
         </template>
-      </el-auto-resizer>
-    </div>
-    <div class="mt-2">
-      <el-pagination
-        :current-page="queryParms.pageNo"
-        :page-size="queryParms.pageSize"
-        :page-sizes="[10, 20, 30, 50, 100]"
-        layout="total, sizes, prev, pager, next, jumper"
-        :total="tableTotal"
-        @size-change="getList"
-        @current-change="getList"
+      </el-table-column>
+      <el-table-column label="状态" align="center" prop="status">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="公告内容"
+        align="center"
+        prop="content"
+        :show-overflow-tooltip="true"
       />
-    </div>
-  </ContentWrap>
+      <el-table-column
+        label="创建时间"
+        align="center"
+        prop="createTime"
+        width="180"
+        :formatter="dateFormatter"
+      />
+      <el-table-column label="操作" align="center">
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            @click="openModal('update', scope.row.id)"
+            v-hasPermi="['system:notice:update']"
+          >
+            编辑
+          </el-button>
+          <el-button
+            link
+            type="danger"
+            @click="handleDelete(scope.row.id)"
+            v-hasPermi="['system:notice:delete']"
+          >
+            删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </content-wrap>
+
+  <NoticeForm ref="modalRef" @success="getList" />
 </template>
 <script setup lang="tsx">
-import dayjs from 'dayjs'
-import { Column, ElPagination, ElTableV2, TableV2FixedDir } from 'element-plus'
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
+import { dateFormatter } from '@/utils/formatTime'
 import * as NoticeApi from '@/api/system/notice'
-import { XTextButton } from '@/components/XButton'
 import { DictTag } from '@/components/DictTag'
+import NoticeForm from './form.vue'
+const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
 
-const columns: Column<any>[] = [
-  {
-    key: 'id',
-    dataKey: 'id', //需要渲染当前列的数据字段，如{id:9527,name:'Mike'}，则填id
-    title: 'id', //显示在单元格表头的文本
-    width: 80, //当前列的宽度，必须设置
-    fixed: true //是否固定列
-  },
-  {
-    key: 'title',
-    dataKey: 'title',
-    title: '公告标题',
-    width: 180
-  },
-  {
-    key: 'type',
-    dataKey: 'type',
-    title: '公告类型',
-    width: 180,
-    cellRenderer: ({ cellData: type }) => (
-      <DictTag type={DICT_TYPE.SYSTEM_NOTICE_TYPE} value={type}></DictTag>
-    )
-  },
-  {
-    key: 'status',
-    dataKey: 'status',
-    title: t('common.status'),
-    width: 180,
-    cellRenderer: ({ cellData: status }) => (
-      <DictTag type={DICT_TYPE.COMMON_STATUS} value={status}></DictTag>
-    )
-  },
-  {
-    key: 'content',
-    dataKey: 'content',
-    title: '公告内容',
-    width: 400,
-    cellRenderer: ({ cellData: content }) => <span v-html={content}></span>
-  },
-  {
-    key: 'createTime',
-    dataKey: 'createTime',
-    title: t('common.createTime'),
-    width: 180,
-    cellRenderer: ({ cellData: createTime }) => (
-      <>{dayjs(createTime).format('YYYY-MM-DD HH:mm:ss')}</>
-    )
-  },
-  {
-    key: 'actionbtns',
-    dataKey: 'actionbtns', //需要渲染当前列的数据字段，如{id:9527,name:'Mike'}，则填id
-    title: '操作', //显示在单元格表头的文本
-    width: 160, //当前列的宽度，必须设置
-    fixed: TableV2FixedDir.RIGHT, //是否固定列
-    align: 'center',
-    cellRenderer: ({ cellData: id }) => (
-      <>
-        <XTextButton
-          preIcon="ep:delete"
-          title={t('action.edit')}
-          onClick={handleUpdate.bind(this, id)}
-        ></XTextButton>
-        <XTextButton
-          preIcon="ep:delete"
-          title={t('action.del')}
-          onClick={handleDelete.bind(this, id)}
-        ></XTextButton>
-      </>
-    )
-  }
-]
-
-const tableData = ref([])
-
-const tableTotal = ref(0)
-
-const queryParms = reactive({
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
   title: '',
+  type: undefined,
   status: undefined,
   pageNo: 1,
   pageSize: 100
 })
+const queryFormRef = ref() // 搜索的表单
 
+/** 查询公告列表 */
 const getList = async () => {
-  const res = await NoticeApi.getNoticePageApi(queryParms)
-  tableData.value = res.list
-  tableTotal.value = res.total
+  loading.value = true
+  try {
+    const data = await NoticeApi.getNoticePageApi(queryParams)
+
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+/** 添加/修改操作 */
+const modalRef = ref()
+const openModal = (type: string, id?: number) => {
+  modalRef.value.openModal(type, id)
+}
+/** 删除按钮操作 */
+const handleDelete = async (id: number) => {
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await NoticeApi.deleteNoticeApi(id)
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
 }
 
-const handleUpdate = (id) => {
-  console.info(id)
-}
-
-const handleDelete = (id) => {
-  console.info(id)
-}
-
-getList()
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
 </script>

From 8c9217166d73b7019e899c2042cfb4fd91f4aa38 Mon Sep 17 00:00:00 2001
From: chiwenda <18150028757@163.com>
Date: Sun, 12 Mar 2023 17:22:51 +0800
Subject: [PATCH 07/40] =?UTF-8?q?fix:=E4=BF=AE=E6=94=B9=E8=8F=9C=E5=8D=95?=
 =?UTF-8?q?=E6=89=BE=E4=B8=8D=E5=88=B0=E5=9B=BE=E6=A0=87=E6=97=B6=E6=8A=A5?=
 =?UTF-8?q?=E9=94=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Icon/src/IconSelect.vue | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/components/Icon/src/IconSelect.vue b/src/components/Icon/src/IconSelect.vue
index 97a3e384c..f5be8d3a8 100644
--- a/src/components/Icon/src/IconSelect.vue
+++ b/src/components/Icon/src/IconSelect.vue
@@ -45,17 +45,22 @@ const tabsList = [
 const pageList = computed(() => {
   if (currentPage.value === 1) {
     return copyIconList[currentActiveType.value]
-      .filter((v) => v.includes(filterValue.value))
+      ?.filter((v) => v.includes(filterValue.value))
       .slice(currentPage.value - 1, pageSize.value)
   } else {
     return copyIconList[currentActiveType.value]
-      .filter((v) => v.includes(filterValue.value))
+      ?.filter((v) => v.includes(filterValue.value))
       .slice(
         pageSize.value * (currentPage.value - 1),
         pageSize.value * (currentPage.value - 1) + pageSize.value
       )
   }
 })
+const iconCount = computed(() => {
+  return copyIconList[currentActiveType.value] == undefined
+    ? 0
+    : copyIconList[currentActiveType.value].length
+})
 
 const iconItemStyle = computed((): ParameterCSSProperties => {
   return (item) => {
@@ -159,7 +164,7 @@ watch(
 
           <ElPagination
             small
-            :total="copyIconList[currentActiveType].length as unknown as number"
+            :total="iconCount"
             :page-size="pageSize"
             :current-page="currentPage"
             background

From 2323946ce2147893be5f47b31b4a439690af8b2d Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sun, 12 Mar 2023 18:22:21 +0800
Subject: [PATCH 08/40] =?UTF-8?q?notice=20=E9=87=8D=E6=9E=84=E8=A1=A5?=
 =?UTF-8?q?=E5=85=85=EF=BC=9A=201.=20=E7=A7=BB=E9=99=A4=20API=20=E6=96=B9?=
 =?UTF-8?q?=E6=B3=95=E7=9A=84=E5=90=8E=E7=BC=80=202.=20=E5=85=AC=E5=91=8A?=
 =?UTF-8?q?=E5=86=85=E5=AE=B9=E4=BD=BF=E7=94=A8=20Editor=20=E5=AF=8C?=
 =?UTF-8?q?=E6=96=87=E6=9C=AC=E7=BC=96=E8=BE=91=E5=99=A8=203.=20=E5=88=97?=
 =?UTF-8?q?=E8=A1=A8=E7=9A=84=E7=8A=B6=E6=80=81=E6=A3=80=E7=B4=A2=E7=9A=84?=
 =?UTF-8?q?=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/notice/index.ts         |  15 +--
 src/views/system/notice/form.vue       |  10 +-
 src/views/system/notice/index.vue      |  35 ++----
 src/views/system/notice/indexd.vue     | 148 -------------------------
 src/views/system/notice/indexh.vue     | 103 -----------------
 src/views/system/notice/notice.data.ts |  59 ----------
 6 files changed, 22 insertions(+), 348 deletions(-)
 delete mode 100644 src/views/system/notice/indexd.vue
 delete mode 100644 src/views/system/notice/indexh.vue
 delete mode 100644 src/views/system/notice/notice.data.ts

diff --git a/src/api/system/notice/index.ts b/src/api/system/notice/index.ts
index cd420a29a..62bf5259d 100644
--- a/src/api/system/notice/index.ts
+++ b/src/api/system/notice/index.ts
@@ -11,32 +11,27 @@ export interface NoticeVO {
   createTime: Date
 }
 
-export interface NoticePageReqVO extends PageParam {
-  title?: string
-  status?: number
-}
-
 // 查询公告列表
-export const getNoticePageApi = (params: NoticePageReqVO) => {
+export const getNoticePage = (params: PageParam) => {
   return request.get({ url: '/system/notice/page', params })
 }
 
 // 查询公告详情
-export const getNoticeApi = (id: number) => {
+export const getNotice = (id: number) => {
   return request.get({ url: '/system/notice/get?id=' + id })
 }
 
 // 新增公告
-export const createNoticeApi = (data: NoticeVO) => {
+export const createNotice = (data: NoticeVO) => {
   return request.post({ url: '/system/notice/create', data })
 }
 
 // 修改公告
-export const updateNoticeApi = (data: NoticeVO) => {
+export const updateNotice = (data: NoticeVO) => {
   return request.put({ url: '/system/notice/update', data })
 }
 
 // 删除公告
-export const deleteNoticeApi = (id: number) => {
+export const deleteNotice = (id: number) => {
   return request.delete({ url: '/system/notice/delete?id=' + id })
 }
diff --git a/src/views/system/notice/form.vue b/src/views/system/notice/form.vue
index 0f928a7b8..b8a49586c 100644
--- a/src/views/system/notice/form.vue
+++ b/src/views/system/notice/form.vue
@@ -1,5 +1,5 @@
 <template>
-  <Dialog :title="modelTitle" v-model="modelVisible">
+  <Dialog :title="modelTitle" v-model="modelVisible" width="800">
     <el-form
       ref="formRef"
       :model="formData"
@@ -11,7 +11,7 @@
         <el-input v-model="formData.title" placeholder="请输入公告标题" />
       </el-form-item>
       <el-form-item label="公告内容" prop="content">
-        <el-input v-model="formData.content" type="textarea" placeholder="请输公告内容" />
+        <Editor :model-value="formData.content" height="150px" />
       </el-form-item>
       <el-form-item label="公告类型" prop="type">
         <el-select v-model="formData.type" placeholder="请选择公告类型" clearable>
@@ -82,7 +82,7 @@ const openModal = async (type: string, id?: number) => {
   if (id) {
     formLoading.value = true
     try {
-      formData.value = await NoticeApi.getNoticeApi(id)
+      formData.value = await NoticeApi.getNotice(id)
     } finally {
       formLoading.value = false
     }
@@ -102,10 +102,10 @@ const submitForm = async () => {
   try {
     const data = formData.value as unknown as NoticeApi.NoticeVO
     if (formType.value === 'create') {
-      await NoticeApi.createNoticeApi(data)
+      await NoticeApi.createNotice(data)
       message.success(t('common.createSuccess'))
     } else {
-      await NoticeApi.updateNoticeApi(data)
+      await NoticeApi.updateNotice(data)
       message.success(t('common.updateSuccess'))
     }
     modelVisible.value = false
diff --git a/src/views/system/notice/index.vue b/src/views/system/notice/index.vue
index ab375f88b..8add0eaba 100644
--- a/src/views/system/notice/index.vue
+++ b/src/views/system/notice/index.vue
@@ -10,18 +10,8 @@
           @keyup.enter="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="公告类型" prop="type">
-        <el-select v-model="queryParams.type" placeholder="请选择公告类型" clearable>
-          <el-option
-            v-for="dict in getDictOptions(DICT_TYPE.SYSTEM_NOTICE_TYPE)"
-            :key="parseInt(dict.value)"
-            :label="dict.label"
-            :value="parseInt(dict.value)"
-          />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="状态" prop="status">
-        <el-select v-model="queryParams.type" placeholder="请选择状态" clearable>
+      <el-form-item label="公告状态" prop="status">
+        <el-select v-model="queryParams.status" placeholder="请选择公告状态" clearable>
           <el-option
             v-for="dict in getDictOptions(DICT_TYPE.COMMON_STATUS)"
             :key="parseInt(dict.value)"
@@ -30,7 +20,6 @@
           />
         </el-select>
       </el-form-item>
-
       <el-form-item>
         <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
         <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
@@ -43,9 +32,10 @@
         </el-button>
       </el-form-item>
     </el-form>
+
     <!-- 列表 -->
     <el-table v-loading="loading" :data="list" align="center">
-      <el-table-column label="公告主键" align="center" prop="id" />
+      <el-table-column label="公告编号" align="center" prop="id" />
       <el-table-column label="公告标题" align="center" prop="title" />
       <el-table-column label="公告类型" align="center" prop="type">
         <template #default="scope">
@@ -57,12 +47,6 @@
           <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
         </template>
       </el-table-column>
-      <el-table-column
-        label="公告内容"
-        align="center"
-        prop="content"
-        :show-overflow-tooltip="true"
-      />
       <el-table-column
         label="创建时间"
         align="center"
@@ -100,7 +84,8 @@
     />
   </content-wrap>
 
-  <NoticeForm ref="modalRef" @success="getList" />
+  <!-- 表单弹窗：添加/修改 -->
+  <notice-form ref="modalRef" @success="getList" />
 </template>
 <script setup lang="tsx">
 import { DICT_TYPE, getDictOptions } from '@/utils/dict'
@@ -127,7 +112,7 @@ const queryFormRef = ref() // 搜索的表单
 const getList = async () => {
   loading.value = true
   try {
-    const data = await NoticeApi.getNoticePageApi(queryParams)
+    const data = await NoticeApi.getNoticePage(queryParams)
 
     list.value = data.list
     total.value = data.total
@@ -135,28 +120,32 @@ const getList = async () => {
     loading.value = false
   }
 }
+
 /** 搜索按钮操作 */
 const handleQuery = () => {
   queryParams.pageNo = 1
   getList()
 }
+
 /** 重置按钮操作 */
 const resetQuery = () => {
   queryFormRef.value.resetFields()
   handleQuery()
 }
+
 /** 添加/修改操作 */
 const modalRef = ref()
 const openModal = (type: string, id?: number) => {
   modalRef.value.openModal(type, id)
 }
+
 /** 删除按钮操作 */
 const handleDelete = async (id: number) => {
   try {
     // 删除的二次确认
     await message.delConfirm()
     // 发起删除
-    await NoticeApi.deleteNoticeApi(id)
+    await NoticeApi.deleteNotice(id)
     message.success(t('common.delSuccess'))
     // 刷新列表
     await getList()
diff --git a/src/views/system/notice/indexd.vue b/src/views/system/notice/indexd.vue
deleted file mode 100644
index aceadbbaa..000000000
--- a/src/views/system/notice/indexd.vue
+++ /dev/null
@@ -1,148 +0,0 @@
-<template>
-  <ContentWrap>
-    <!-- 列表 -->
-    <XTable @register="registerTable">
-      <!-- 操作：新增 -->
-      <template #toolbar_buttons>
-        <XButton
-          type="primary"
-          preIcon="ep:zoom-in"
-          :title="t('action.add')"
-          v-hasPermi="['system:notice:create']"
-          @click="handleCreate()"
-        />
-      </template>
-      <template #actionbtns_default="{ row }">
-        <!-- 操作：修改 -->
-        <XTextButton
-          preIcon="ep:edit"
-          :title="t('action.edit')"
-          v-hasPermi="['system:notice:update']"
-          @click="handleUpdate(row.id)"
-        />
-        <!-- 操作：详情 -->
-        <XTextButton
-          preIcon="ep:view"
-          :title="t('action.detail')"
-          v-hasPermi="['system:notice:query']"
-          @click="handleDetail(row.id)"
-        />
-        <!-- 操作：删除 -->
-        <XTextButton
-          preIcon="ep:delete"
-          :title="t('action.del')"
-          v-hasPermi="['system:notice:delete']"
-          @click="deleteData(row.id)"
-        />
-      </template>
-    </XTable>
-  </ContentWrap>
-  <!-- 弹窗 -->
-  <XModal id="noticeModel" v-model="dialogVisible" :title="dialogTitle">
-    <!-- 对话框(添加 / 修改) -->
-    <Form
-      ref="formRef"
-      v-if="['create', 'update'].includes(actionType)"
-      :schema="allSchemas.formSchema"
-      :rules="rules"
-    />
-    <!-- 对话框(详情) -->
-    <Descriptions
-      v-if="actionType === 'detail'"
-      :schema="allSchemas.detailSchema"
-      :data="detailData"
-    >
-      <template #content="{ row }">
-        <Editor :model-value="row.content" :readonly="true" />
-      </template>
-    </Descriptions>
-    <template #footer>
-      <!-- 按钮：保存 -->
-      <XButton
-        v-if="['create', 'update'].includes(actionType)"
-        type="primary"
-        :title="t('action.save')"
-        :loading="actionLoading"
-        @click="submitForm()"
-      />
-      <!-- 按钮：关闭 -->
-      <XButton :loading="actionLoading" :title="t('dialog.close')" @click="dialogVisible = false" />
-    </template>
-  </XModal>
-</template>
-<script setup lang="ts" name="Notice">
-import type { FormExpose } from '@/components/Form'
-// 业务相关的 import
-import * as NoticeApi from '@/api/system/notice'
-import { rules, allSchemas } from './notice.data'
-
-const { t } = useI18n() // 国际化
-const message = useMessage() // 消息弹窗
-// 列表相关的变量
-const [registerTable, { reload, deleteData }] = useXTable({
-  allSchemas: allSchemas,
-  getListApi: NoticeApi.getNoticePageApi,
-  deleteApi: NoticeApi.deleteNoticeApi
-})
-// 弹窗相关的变量
-const dialogVisible = ref(false) // 是否显示弹出层
-const dialogTitle = ref('edit') // 弹出层标题
-const actionType = ref('') // 操作按钮的类型
-const actionLoading = ref(false) // 按钮 Loading
-const formRef = ref<FormExpose>() // 表单 Ref
-const detailData = ref() // 详情 Ref
-
-// 设置标题
-const setDialogTile = (type: string) => {
-  dialogTitle.value = t('action.' + type)
-  actionType.value = type
-  dialogVisible.value = true
-}
-
-// 新增操作
-const handleCreate = () => {
-  setDialogTile('create')
-}
-
-// 修改操作
-const handleUpdate = async (rowId: number) => {
-  setDialogTile('update')
-  // 设置数据
-  const res = await NoticeApi.getNoticeApi(rowId)
-  unref(formRef)?.setValues(res)
-}
-
-// 详情操作
-const handleDetail = async (rowId: number) => {
-  setDialogTile('detail')
-  // 设置数据
-  const res = await NoticeApi.getNoticeApi(rowId)
-  detailData.value = res
-}
-
-// 提交新增/修改的表单
-const submitForm = async () => {
-  const elForm = unref(formRef)?.getElFormRef()
-  if (!elForm) return
-  elForm.validate(async (valid) => {
-    if (valid) {
-      actionLoading.value = true
-      // 提交请求
-      try {
-        const data = unref(formRef)?.formModel as NoticeApi.NoticeVO
-        if (actionType.value === 'create') {
-          await NoticeApi.createNoticeApi(data)
-          message.success(t('common.createSuccess'))
-        } else {
-          await NoticeApi.updateNoticeApi(data)
-          message.success(t('common.updateSuccess'))
-        }
-        dialogVisible.value = false
-      } finally {
-        actionLoading.value = false
-        await reload()
-      }
-    }
-  })
-}
-</script>
diff --git a/src/views/system/notice/indexh.vue b/src/views/system/notice/indexh.vue
deleted file mode 100644
index 2879a1c41..000000000
--- a/src/views/system/notice/indexh.vue
+++ /dev/null
@@ -1,103 +0,0 @@
-<template>
-  <ContentWrap>
-    <div style="width: 100%; height: 500px">
-      <el-auto-resizer>
-        <template #default="{ height, width }">
-          <el-table-v2 :columns="columns" :data="tableData" :width="width" :height="height" fixed />
-        </template>
-      </el-auto-resizer>
-      <el-pagination
-        :current-page="queryParms.pageNo"
-        :page-size="queryParms.pageSize"
-        layout="total, prev, pager, next"
-        :total="tableTotal"
-        @size-change="getList"
-        @current-change="getList"
-      />
-    </div>
-  </ContentWrap>
-</template>
-<script setup lang="ts">
-import { Column, TableV2FixedDir } from 'element-plus'
-import * as NoticeApi from '@/api/system/notice'
-import { XTextButton } from '@/components/XButton'
-const { t } = useI18n() // 国际化
-
-const columns: Column<any>[] = [
-  {
-    key: 'id',
-    dataKey: 'id', //需要渲染当前列的数据字段，如{id:9527,name:'Mike'}，则填id
-    title: 'id', //显示在单元格表头的文本
-    width: 80, //当前列的宽度，必须设置
-    fixed: true //是否固定列
-  },
-  {
-    key: 'title',
-    dataKey: 'title',
-    title: '公告标题',
-    width: 180
-  },
-  {
-    key: 'type',
-    dataKey: 'type',
-    title: '公告类型',
-    width: 180
-  },
-  {
-    key: 'status',
-    dataKey: 'status',
-    title: t('common.status'),
-    width: 180
-  },
-  {
-    key: 'content',
-    dataKey: 'content',
-    title: '公告内容',
-    width: 180
-  },
-  {
-    key: 'createTime',
-    dataKey: 'createTime',
-    title: t('common.createTime'),
-    width: 180
-  },
-  {
-    key: 'actionbtns',
-    dataKey: 'actionbtns', //需要渲染当前列的数据字段，如{id:9527,name:'Mike'}，则填id
-    title: '操作', //显示在单元格表头的文本
-    width: 80, //当前列的宽度，必须设置
-    fixed: TableV2FixedDir.RIGHT, //是否固定列
-    align: 'center',
-    cellRenderer: (date) =>
-      h(XTextButton, {
-        onClick: () => handleDelete(date.rowData),
-        type: 'danger',
-        preIcon: 'ep:delete',
-        title: t('action.del')
-      })
-  }
-]
-
-const tableData = ref([])
-
-const tableTotal = ref(0)
-
-const queryParms = reactive({
-  title: '',
-  status: undefined,
-  pageNo: 1,
-  pageSize: 10
-})
-
-const getList = async () => {
-  const res = await NoticeApi.getNoticePageApi(queryParms)
-  tableData.value = res.list
-  tableTotal.value = res.total
-}
-
-const handleDelete = (row) => {
-  console.info(row.id)
-}
-
-getList()
-</script>
diff --git a/src/views/system/notice/notice.data.ts b/src/views/system/notice/notice.data.ts
deleted file mode 100644
index 7a72a7239..000000000
--- a/src/views/system/notice/notice.data.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
-const { t } = useI18n() // 国际化
-
-// 表单校验
-export const rules = reactive({
-  title: [required],
-  type: [required]
-})
-
-// CrudSchema
-const crudSchemas = reactive<VxeCrudSchema>({
-  primaryKey: 'id',
-  primaryType: 'seq',
-  action: true,
-  columns: [
-    {
-      title: '公告标题',
-      field: 'title',
-      isSearch: true
-    },
-    {
-      title: '公告类型',
-      field: 'type',
-      dictType: DICT_TYPE.SYSTEM_NOTICE_TYPE,
-      dictClass: 'number'
-    },
-    {
-      title: t('common.status'),
-      field: 'status',
-      dictType: DICT_TYPE.COMMON_STATUS,
-      dictClass: 'number',
-      isSearch: true
-    },
-    {
-      title: '公告内容',
-      field: 'content',
-      table: {
-        type: 'html'
-      },
-      form: {
-        component: 'Editor',
-        colProps: {
-          span: 24
-        },
-        componentProps: {
-          valueHtml: ''
-        }
-      },
-      isTable: false
-    },
-    {
-      title: t('common.createTime'),
-      field: 'createTime',
-      formatter: 'formatDate',
-      isForm: false
-    }
-  ]
-})
-export const { allSchemas } = useVxeCrudSchemas(crudSchemas)

From c63421421328b47db0a2b7a35a5aad300c0de993 Mon Sep 17 00:00:00 2001
From: gexinzhineng/gxzn27 <1348660141@qq.com>
Date: Mon, 13 Mar 2023 09:53:43 +0800
Subject: [PATCH 09/40] =?UTF-8?q?1=E3=80=81=E8=B0=83=E5=BA=A6=E6=97=A5?=
 =?UTF-8?q?=E5=BF=97=E7=82=B9=E5=87=BB=E8=AF=A6=E6=83=85=E6=97=A0=E6=95=B0?=
 =?UTF-8?q?=E6=8D=AE=E6=98=BE=E7=A4=BA=202=E3=80=81id=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=E5=BA=8F=E5=8F=B7=E9=97=AE=E9=A2=98=203=E3=80=81=E7=A7=9F?=
 =?UTF-8?q?=E6=88=B7=E8=AF=A6=E6=83=85=E4=BF=AE=E6=94=B9=E4=B8=AD=E4=B8=8D?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=E5=90=8D=E7=A7=B0=E5=AF=86=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../package/designer/ProcessDesigner.vue                    | 1 -
 src/views/infra/job/JobLog.vue                              | 2 +-
 src/views/infra/job/job.data.ts                             | 2 +-
 src/views/infra/job/jobLog.data.ts                          | 2 +-
 src/views/system/tenant/tenant.data.ts                      | 6 ++++--
 5 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
index 60430c253..a14b0b60f 100644
--- a/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
+++ b/src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
@@ -166,7 +166,6 @@
           @click="processSave"
           :type="props.headerButtonType"
           :disabled="simulationStatus"
-
         />
       </template>
       <!-- 用于打开本地文件-->
diff --git a/src/views/infra/job/JobLog.vue b/src/views/infra/job/JobLog.vue
index 7f860cec6..1bf9d7453 100644
--- a/src/views/infra/job/JobLog.vue
+++ b/src/views/infra/job/JobLog.vue
@@ -70,7 +70,7 @@ const detailData = ref() // 详情 Ref
 // 详情操作
 const handleDetail = async (row: JobLogApi.JobLogVO) => {
   // 设置数据
-  const res = JobLogApi.getJobLogApi(row.id)
+  const res = await JobLogApi.getJobLogApi(row.id)
   detailData.value = res
   dialogTitle.value = t('action.detail')
   dialogVisible.value = true
diff --git a/src/views/infra/job/job.data.ts b/src/views/infra/job/job.data.ts
index a0fc3bec8..38761cd70 100644
--- a/src/views/infra/job/job.data.ts
+++ b/src/views/infra/job/job.data.ts
@@ -11,7 +11,7 @@ export const rules = reactive({
 // CrudSchema
 const crudSchemas = reactive<VxeCrudSchema>({
   primaryKey: 'id',
-  primaryType: 'seq',
+  primaryType: 'id',
   primaryTitle: '任务编号',
   action: true,
   actionWidth: '280px',
diff --git a/src/views/infra/job/jobLog.data.ts b/src/views/infra/job/jobLog.data.ts
index ac6e39f24..ccca3d08b 100644
--- a/src/views/infra/job/jobLog.data.ts
+++ b/src/views/infra/job/jobLog.data.ts
@@ -4,7 +4,7 @@ const { t } = useI18n()
 // CrudSchema
 const crudSchemas = reactive<VxeCrudSchema>({
   primaryKey: 'id',
-  primaryType: 'seq',
+  primaryType: 'id',
   primaryTitle: '日志编号',
   action: true,
   columns: [
diff --git a/src/views/system/tenant/tenant.data.ts b/src/views/system/tenant/tenant.data.ts
index 1137b44a2..adda1807f 100644
--- a/src/views/system/tenant/tenant.data.ts
+++ b/src/views/system/tenant/tenant.data.ts
@@ -123,7 +123,8 @@ const crudSchemas = reactive<VxeCrudSchema>({
       title: '用户名称',
       field: 'username',
       isTable: false,
-      isDetail: false
+      isDetail: false,
+      isForm: false
     },
     {
       title: '用户密码',
@@ -132,7 +133,8 @@ const crudSchemas = reactive<VxeCrudSchema>({
       isDetail: false,
       form: {
         component: 'InputPassword'
-      }
+      },
+      isForm: false
     },
     {
       title: '账号额度',

From f1313b1f1c08a5e10fe4e309e82c97f911d5505c Mon Sep 17 00:00:00 2001
From: dlarmor <121919810@qq.com>
Date: Tue, 14 Mar 2023 10:47:52 +0800
Subject: [PATCH 10/40] =?UTF-8?q?=E9=87=8D=E6=9E=84=EF=BC=9A=E5=9F=BA?=
 =?UTF-8?q?=E7=A1=80=E8=AE=BE=E6=96=BD=20->=20=E6=96=87=E4=BB=B6=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=20=E6=96=87=E4=BB=B6=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/locales/en.ts                         |   3 +-
 src/locales/zh-CN.ts                      |   3 +-
 src/views/infra/file/form.vue             |  82 ++++++++++
 src/views/infra/file/index.vue            | 162 ++++++++++++++++++++
 src/views/infra/fileList/fileList.data.ts |  52 -------
 src/views/infra/fileList/index.vue        | 173 ----------------------
 6 files changed, 248 insertions(+), 227 deletions(-)
 create mode 100644 src/views/infra/file/form.vue
 create mode 100644 src/views/infra/file/index.vue
 delete mode 100644 src/views/infra/fileList/fileList.data.ts
 delete mode 100644 src/views/infra/fileList/index.vue

diff --git a/src/locales/en.ts b/src/locales/en.ts
index 1600a19f1..4f4d4895d 100644
--- a/src/locales/en.ts
+++ b/src/locales/en.ts
@@ -297,7 +297,8 @@ export default {
     typeCreate: 'Dict Type Create',
     typeUpdate: 'Dict Type Eidt',
     dataCreate: 'Dict Data Create',
-    dataUpdate: 'Dict Data Eidt'
+    dataUpdate: 'Dict Data Eidt',
+    fileUpload: 'File Upload'
   },
   dialog: {
     dialog: 'Dialog',
diff --git a/src/locales/zh-CN.ts b/src/locales/zh-CN.ts
index 7c5742c42..6f46f1aba 100644
--- a/src/locales/zh-CN.ts
+++ b/src/locales/zh-CN.ts
@@ -297,7 +297,8 @@ export default {
     typeCreate: '字典类型新增',
     typeUpdate: '字典类型编辑',
     dataCreate: '字典数据新增',
-    dataUpdate: '字典数据编辑'
+    dataUpdate: '字典数据编辑',
+    fileUpload: '上传文件'
   },
   dialog: {
     dialog: '弹窗',
diff --git a/src/views/infra/file/form.vue b/src/views/infra/file/form.vue
new file mode 100644
index 000000000..8550d4400
--- /dev/null
+++ b/src/views/infra/file/form.vue
@@ -0,0 +1,82 @@
+<template>
+  <Dialog :title="modelTitle" v-model="modelVisible">
+    <el-upload
+      ref="uploadRef"
+      :limit="1"
+      accept=".jpg, .png, .gif"
+      :auto-upload="false"
+      drag
+      :headers="headers"
+      :action="url"
+      :data="data"
+      :disabled="formLoading"
+      :on-change="handleFileChange"
+      :on-progress="handleFileUploadProgress"
+      :on-success="handleFileSuccess"
+    >
+      <i class="el-icon-upload"></i>
+      <div class="el-upload__text"> 将文件拖到此处，或 <em>点击上传</em> </div>
+      <template #tip>
+        <div class="el-upload__tip" style="color: red">
+          提示：仅允许导入 jpg、png、gif 格式文件！
+        </div>
+      </template>
+    </el-upload>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="submitFileForm" type="primary" :disabled="formLoading">确 定</el-button>
+        <el-button @click="modelVisible = false">取 消</el-button>
+      </div>
+    </template>
+  </Dialog>
+</template>
+
+<script setup lang="ts">
+import { Dialog } from '@/components/Dialog'
+import { getAccessToken } from '@/utils/auth'
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const modelTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const url = import.meta.env.VITE_UPLOAD_URL
+const headers = { Authorization: 'Bearer ' + getAccessToken() }
+const data = ref({ path: '' })
+const uploadRef = ref()
+
+/** 打开弹窗 */
+const openModal = async () => {
+  modelVisible.value = true
+  modelTitle.value = t('action.fileUpload')
+}
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+/** 处理上传的文件发生变化 */
+const handleFileChange = (file) => {
+  data.value.path = file.name
+}
+/** 处理文件上传中 */
+const handleFileUploadProgress = () => {
+  formLoading.value = true // 禁止修改
+}
+/** 发起文件上传 */
+const submitFileForm = () => {
+  unref(uploadRef)?.submit()
+}
+/** 文件上传成功处理 */
+const handleFileSuccess = () => {
+  // 清理
+  modelVisible.value = false
+  formLoading.value = false
+  unref(uploadRef)?.clearFiles()
+  // 提示成功，并刷新
+  message.success(t('common.createSuccess'))
+  emit('success')
+}
+</script>
+
+<style scoped></style>
diff --git a/src/views/infra/file/index.vue b/src/views/infra/file/index.vue
new file mode 100644
index 000000000..77beb3e5c
--- /dev/null
+++ b/src/views/infra/file/index.vue
@@ -0,0 +1,162 @@
+<template>
+  <!-- 搜索 -->
+  <content-wrap>
+    <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true">
+      <el-form-item label="文件路径" prop="path">
+        <el-input
+          v-model="queryParams.path"
+          placeholder="请输入文件路径"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="文件类型" prop="type" width="80">
+        <el-input
+          v-model="queryParams.type"
+          placeholder="请输入文件类型"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="创建时间" prop="createTime">
+        <el-date-picker
+          v-model="queryParams.createTime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+        <el-button type="primary" @click="openModal">
+          <Icon icon="ep:upload" class="mr-5px" /> 上传文件
+        </el-button>
+      </el-form-item>
+    </el-form>
+  </content-wrap>
+
+  <!-- 列表 -->
+  <content-wrap>
+    <el-table v-loading="loading" :data="list" align="center">
+      <el-table-column label="文件名" align="center" prop="name" :show-overflow-tooltip="true" />
+      <el-table-column label="文件路径" align="center" prop="path" :show-overflow-tooltip="true" />
+      <el-table-column label="URL" align="center" prop="url" :show-overflow-tooltip="true" />
+      <el-table-column
+        label="文件大小"
+        align="center"
+        prop="size"
+        width="120"
+        :formatter="sizeFormat"
+      />
+      <el-table-column label="文件类型" align="center" prop="type" width="180px" />
+      <el-table-column
+        label="上传时间"
+        align="center"
+        prop="createTime"
+        width="180"
+        :formatter="dateFormatter"
+      />
+      <el-table-column label="操作" align="center">
+        <template #default="scope">
+          <el-button
+            link
+            type="danger"
+            @click="handleDelete(scope.row.id)"
+            v-hasPermi="['infra:config:delete']"
+          >
+            删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </content-wrap>
+
+  <!-- 表单弹窗：添加/修改 -->
+  <file-upload-form ref="modalRef" @success="getList" />
+</template>
+<script setup lang="ts" name="Config">
+import { dateFormatter } from '@/utils/formatTime'
+import * as FileApi from '@/api/infra/fileList'
+import FileUploadForm from './form.vue'
+const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
+
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  name: undefined,
+  type: undefined,
+  createTime: []
+})
+const queryFormRef = ref() // 搜索的表单
+
+/** 查询参数列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await FileApi.getFilePageApi(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+/** 添加/修改操作 */
+const modalRef = ref()
+const openModal = () => {
+  modalRef.value.openModal()
+}
+
+/** 删除按钮操作 */
+const handleDelete = async (id: number) => {
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await FileApi.deleteFileApi(id)
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
+}
+
+const sizeFormat = (row) => {
+  const unitArr = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
+  const srcSize = parseFloat(row.size)
+  const index = Math.floor(Math.log(srcSize) / Math.log(1024))
+  const size = srcSize / Math.pow(1024, index)
+  const sizeStr = size.toFixed(2) //保留的小数位数
+  return sizeStr + ' ' + unitArr[index]
+}
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
+</script>
diff --git a/src/views/infra/fileList/fileList.data.ts b/src/views/infra/fileList/fileList.data.ts
deleted file mode 100644
index 29be6dae4..000000000
--- a/src/views/infra/fileList/fileList.data.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
-const { t } = useI18n() // 国际化
-
-// CrudSchema
-const crudSchemas = reactive<VxeCrudSchema>({
-  primaryKey: 'id',
-  primaryType: 'seq',
-  action: true,
-  columns: [
-    {
-      title: '文件名',
-      field: 'name'
-    },
-    {
-      title: '文件路径',
-      field: 'path',
-      isSearch: true
-    },
-    {
-      title: 'URL',
-      field: 'url',
-      table: {
-        cellRender: {
-          name: 'XPreview'
-        }
-      }
-    },
-    {
-      title: '文件大小',
-      field: 'size',
-      formatter: 'formatSize'
-    },
-    {
-      title: '文件类型',
-      field: 'type',
-      isSearch: true
-    },
-    {
-      title: t('common.createTime'),
-      field: 'createTime',
-      formatter: 'formatDate',
-      isForm: false,
-      search: {
-        show: true,
-        itemRender: {
-          name: 'XDataTimePicker'
-        }
-      }
-    }
-  ]
-})
-export const { allSchemas } = useVxeCrudSchemas(crudSchemas)
diff --git a/src/views/infra/fileList/index.vue b/src/views/infra/fileList/index.vue
deleted file mode 100644
index cda8b68dd..000000000
--- a/src/views/infra/fileList/index.vue
+++ /dev/null
@@ -1,173 +0,0 @@
-<template>
-  <ContentWrap>
-    <!-- 列表 -->
-    <XTable @register="registerTable">
-      <template #toolbar_buttons>
-        <XButton
-          type="primary"
-          preIcon="ep:upload"
-          title="上传文件"
-          @click="uploadDialogVisible = true"
-        />
-      </template>
-      <template #actionbtns_default="{ row }">
-        <XTextButton
-          preIcon="ep:copy-document"
-          :title="t('common.copy')"
-          @click="handleCopy(row.url)"
-        />
-        <XTextButton preIcon="ep:view" :title="t('action.detail')" @click="handleDetail(row)" />
-        <XTextButton
-          preIcon="ep:delete"
-          :title="t('action.del')"
-          v-hasPermi="['infra:file:delete']"
-          @click="deleteData(row.id)"
-        />
-      </template>
-    </XTable>
-  </ContentWrap>
-  <XModal v-model="dialogVisible" :title="dialogTitle">
-    <!-- 对话框(详情) -->
-    <Descriptions :schema="allSchemas.detailSchema" :data="detailData">
-      <template #url="{ row }">
-        <el-image
-          v-if="row.type === 'jpg' || 'png' || 'gif'"
-          style="width: 100px; height: 100px"
-          :src="row.url"
-          :key="row.url"
-          lazy
-        />
-        <span>{{ row.url }}</span>
-      </template>
-    </Descriptions>
-    <!-- 操作按钮 -->
-    <template #footer>
-      <XButton :title="t('dialog.close')" @click="dialogVisible = false" />
-    </template>
-  </XModal>
-  <XModal v-model="uploadDialogVisible" :title="uploadDialogTitle">
-    <el-upload
-      ref="uploadRef"
-      :action="updateUrl + '?updateSupport=' + updateSupport"
-      :headers="uploadHeaders"
-      :drag="true"
-      :limit="1"
-      :multiple="true"
-      :show-file-list="true"
-      :disabled="uploadDisabled"
-      :before-upload="beforeUpload"
-      :on-exceed="handleExceed"
-      :on-success="handleFileSuccess"
-      :on-error="excelUploadError"
-      :auto-upload="false"
-      accept=".jpg, .png, .gif"
-    >
-      <Icon icon="ep:upload-filled" />
-      <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-      <template #tip>
-        <div class="el-upload__tip">请上传 .jpg, .png, .gif 标准格式文件</div>
-      </template>
-    </el-upload>
-    <template #footer>
-      <!-- 按钮：保存 -->
-      <XButton
-        type="primary"
-        preIcon="ep:upload-filled"
-        :title="t('action.save')"
-        @click="submitFileForm()"
-      />
-      <!-- 按钮：关闭 -->
-      <XButton :title="t('dialog.close')" @click="uploadDialogVisible = false" />
-    </template>
-  </XModal>
-</template>
-<script setup lang="ts" name="FileList">
-import type { UploadInstance, UploadRawFile } from 'element-plus'
-// 业务相关的 import
-import { allSchemas } from './fileList.data'
-import * as FileApi from '@/api/infra/fileList'
-import { getAccessToken, getTenantId } from '@/utils/auth'
-import { useClipboard } from '@vueuse/core'
-
-const { t } = useI18n() // 国际化
-const message = useMessage() // 消息弹窗
-
-// 列表相关的变量
-const [registerTable, { reload, deleteData }] = useXTable({
-  allSchemas: allSchemas,
-  getListApi: FileApi.getFilePageApi,
-  deleteApi: FileApi.deleteFileApi
-})
-
-const detailData = ref() // 详情 Ref
-const dialogVisible = ref(false) // 是否显示弹出层
-const dialogTitle = ref('') // 弹出层标题
-const uploadDialogVisible = ref(false)
-const uploadDialogTitle = ref('上传')
-const updateSupport = ref(0)
-const uploadDisabled = ref(false)
-const uploadRef = ref<UploadInstance>()
-let updateUrl = import.meta.env.VITE_UPLOAD_URL
-const uploadHeaders = ref()
-// 文件上传之前判断
-const beforeUpload = (file: UploadRawFile) => {
-  const isImg = file.type === 'image/jpeg' || 'image/gif' || 'image/png'
-  const isLt5M = file.size / 1024 / 1024 < 5
-  if (!isImg) message.error('上传文件只能是 jpeg / gif / png 格式!')
-  if (!isLt5M) message.error('上传文件大小不能超过 5MB!')
-  return isImg && isLt5M
-}
-// 处理上传的文件发生变化
-// const handleFileChange = (uploadFile: UploadFile): void => {
-//   uploadRef.value.data.path = uploadFile.name
-// }
-// 文件上传
-const submitFileForm = () => {
-  uploadHeaders.value = {
-    Authorization: 'Bearer ' + getAccessToken(),
-    'tenant-id': getTenantId()
-  }
-  uploadDisabled.value = true
-  uploadRef.value!.submit()
-}
-// 文件上传成功
-const handleFileSuccess = async (response: any): Promise<void> => {
-  if (response.code !== 0) {
-    message.error(response.msg)
-    return
-  }
-  message.success('上传成功')
-  uploadDialogVisible.value = false
-  uploadDisabled.value = false
-  await reload()
-}
-// 文件数超出提示
-const handleExceed = (): void => {
-  message.error('最多只能上传一个文件！')
-}
-// 上传错误提示
-const excelUploadError = (): void => {
-  message.error('导入数据失败，请您重新上传！')
-}
-
-// 详情操作
-const handleDetail = (row: FileApi.FileVO) => {
-  // 设置数据
-  detailData.value = row
-  dialogTitle.value = t('action.detail')
-  dialogVisible.value = true
-}
-
-// ========== 复制相关 ==========
-const handleCopy = async (text: string) => {
-  const { copy, copied, isSupported } = useClipboard({ source: text })
-  if (!isSupported) {
-    message.error(t('common.copyError'))
-  } else {
-    await copy()
-    if (unref(copied)) {
-      message.success(t('common.copySuccess'))
-    }
-  }
-}
-</script>

From fee8245f4ed758fa42a0ef39ca7f65a7b4b59f3f Mon Sep 17 00:00:00 2001
From: dlarmor <121919810@qq.com>
Date: Tue, 14 Mar 2023 11:45:37 +0800
Subject: [PATCH 11/40] =?UTF-8?q?=E9=87=8D=E6=9E=84=EF=BC=9A=E5=9F=BA?=
 =?UTF-8?q?=E7=A1=80=E8=AE=BE=E6=96=BD=20->=20=E6=96=87=E4=BB=B6=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=20=E6=96=87=E4=BB=B6=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/infra/fileConfig/fileConfig.data.ts |  77 ----
 src/views/infra/fileConfig/form.vue           | 195 ++++++++
 src/views/infra/fileConfig/index.vue          | 433 +++++++-----------
 3 files changed, 365 insertions(+), 340 deletions(-)
 delete mode 100644 src/views/infra/fileConfig/fileConfig.data.ts
 create mode 100644 src/views/infra/fileConfig/form.vue

diff --git a/src/views/infra/fileConfig/fileConfig.data.ts b/src/views/infra/fileConfig/fileConfig.data.ts
deleted file mode 100644
index d0f648699..000000000
--- a/src/views/infra/fileConfig/fileConfig.data.ts
+++ /dev/null
@@ -1,77 +0,0 @@
-import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
-const { t } = useI18n() // 国际化
-
-// 表单校验
-export const rules = reactive({
-  name: [required],
-  storage: [required],
-  config: {
-    basePath: [required],
-    host: [required],
-    port: [required],
-    username: [required],
-    password: [required],
-    mode: [required],
-    endpoint: [required],
-    bucket: [required],
-    accessKey: [required],
-    accessSecret: [required],
-    domain: [required]
-  }
-})
-
-// CrudSchema
-const crudSchemas = reactive<VxeCrudSchema>({
-  primaryKey: 'id',
-  primaryType: 'seq',
-  primaryTitle: '配置编号',
-  action: true,
-  actionWidth: '400px',
-  columns: [
-    {
-      title: '配置名',
-      field: 'name',
-      isSearch: true
-    },
-    {
-      title: '存储器',
-      field: 'storage',
-      dictType: DICT_TYPE.INFRA_FILE_STORAGE,
-      dictClass: 'number',
-      isSearch: true
-    },
-    {
-      title: '主配置',
-      field: 'master',
-      dictType: DICT_TYPE.INFRA_BOOLEAN_STRING,
-      dictClass: 'boolean'
-    },
-    {
-      title: t('form.remark'),
-      field: 'remark',
-      form: {
-        component: 'Input',
-        componentProps: {
-          type: 'textarea',
-          rows: 4
-        },
-        colProps: {
-          span: 24
-        }
-      }
-    },
-    {
-      title: t('common.createTime'),
-      field: 'createTime',
-      formatter: 'formatDate',
-      isForm: false,
-      search: {
-        show: true,
-        itemRender: {
-          name: 'XDataTimePicker'
-        }
-      }
-    }
-  ]
-})
-export const { allSchemas } = useVxeCrudSchemas(crudSchemas)
diff --git a/src/views/infra/fileConfig/form.vue b/src/views/infra/fileConfig/form.vue
new file mode 100644
index 000000000..ee7bd2387
--- /dev/null
+++ b/src/views/infra/fileConfig/form.vue
@@ -0,0 +1,195 @@
+<template>
+  <Dialog :title="modelTitle" v-model="modelVisible">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="120px"
+      v-loading="formLoading"
+    >
+      <el-form-item label="配置名" prop="name">
+        <el-input v-model="formData.name" placeholder="请输入配置名" />
+      </el-form-item>
+      <el-form-item label="备注" prop="remark">
+        <el-input v-model="formData.remark" placeholder="请输入备注" />
+      </el-form-item>
+      <el-form-item label="存储器" prop="storage">
+        <el-select
+          v-model="formData.storage"
+          placeholder="请选择存储器"
+          :disabled="formData.id !== undefined"
+        >
+          <el-option
+            v-for="dict in getDictOptions(DICT_TYPE.INFRA_FILE_STORAGE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="parseInt(dict.value)"
+          />
+        </el-select>
+      </el-form-item>
+      <!-- DB -->
+      <!-- Local / FTP / SFTP -->
+      <el-form-item
+        v-if="formData.storage >= 10 && formData.storage <= 12"
+        label="基础路径"
+        prop="config.basePath"
+      >
+        <el-input v-model="formData.config.basePath" placeholder="请输入基础路径" />
+      </el-form-item>
+      <el-form-item
+        v-if="formData.storage >= 11 && formData.storage <= 12"
+        label="主机地址"
+        prop="config.host"
+      >
+        <el-input v-model="formData.config.host" placeholder="请输入主机地址" />
+      </el-form-item>
+      <el-form-item
+        v-if="formData.storage >= 11 && formData.storage <= 12"
+        label="主机端口"
+        prop="config.port"
+      >
+        <el-input-number :min="0" v-model="formData.config.port" placeholder="请输入主机端口" />
+      </el-form-item>
+      <el-form-item
+        v-if="formData.storage >= 11 && formData.storage <= 12"
+        label="用户名"
+        prop="config.username"
+      >
+        <el-input v-model="formData.config.username" placeholder="请输入密码" />
+      </el-form-item>
+      <el-form-item
+        v-if="formData.storage >= 11 && formData.storage <= 12"
+        label="密码"
+        prop="config.password"
+      >
+        <el-input v-model="formData.config.password" placeholder="请输入密码" />
+      </el-form-item>
+      <el-form-item v-if="formData.storage === 11" label="连接模式" prop="config.mode">
+        <el-radio-group v-model="formData.config.mode">
+          <el-radio key="Active" label="Active">主动模式</el-radio>
+          <el-radio key="Passive" label="Passive">主动模式</el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <!-- S3 -->
+      <el-form-item v-if="formData.storage === 20" label="节点地址" prop="config.endpoint">
+        <el-input v-model="formData.config.endpoint" placeholder="请输入节点地址" />
+      </el-form-item>
+      <el-form-item v-if="formData.storage === 20" label="存储 bucket" prop="config.bucket">
+        <el-input v-model="formData.config.bucket" placeholder="请输入 bucket" />
+      </el-form-item>
+      <el-form-item v-if="formData.storage === 20" label="accessKey" prop="config.accessKey">
+        <el-input v-model="formData.config.accessKey" placeholder="请输入 accessKey" />
+      </el-form-item>
+      <el-form-item v-if="formData.storage === 20" label="accessSecret" prop="config.accessSecret">
+        <el-input v-model="formData.config.accessSecret" placeholder="请输入 accessSecret" />
+      </el-form-item>
+      <!-- 通用 -->
+      <el-form-item v-if="formData.storage === 20" label="自定义域名">
+        <!-- 无需参数校验，所以去掉 prop -->
+        <el-input v-model="formData.config.domain" placeholder="请输入自定义域名" />
+      </el-form-item>
+      <el-form-item v-else-if="formData.storage" label="自定义域名" prop="config.domain">
+        <el-input v-model="formData.config.domain" placeholder="请输入自定义域名" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+        <el-button @click="modelVisible = false">取 消</el-button>
+      </div>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
+import * as FileConfigApi from '@/api/infra/fileConfig'
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const modelTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const formData = ref({
+  id: undefined,
+  name: '',
+  storage: '',
+  remark: '',
+  config: {}
+})
+const formRules = reactive({
+  name: [{ required: true, message: '配置名不能为空', trigger: 'blur' }],
+  storage: [{ required: true, message: '存储器不能为空', trigger: 'change' }],
+  config: {
+    basePath: [{ required: true, message: '基础路径不能为空', trigger: 'blur' }],
+    host: [{ required: true, message: '主机地址不能为空', trigger: 'blur' }],
+    port: [{ required: true, message: '主机端口不能为空', trigger: 'blur' }],
+    username: [{ required: true, message: '用户名不能为空', trigger: 'blur' }],
+    password: [{ required: true, message: '密码不能为空', trigger: 'blur' }],
+    mode: [{ required: true, message: '连接模式不能为空', trigger: 'change' }],
+    endpoint: [{ required: true, message: '节点地址不能为空', trigger: 'blur' }],
+    bucket: [{ required: true, message: '存储 bucket 不能为空', trigger: 'blur' }],
+    accessKey: [{ required: true, message: 'accessKey 不能为空', trigger: 'blur' }],
+    accessSecret: [{ required: true, message: 'accessSecret 不能为空', trigger: 'blur' }],
+    domain: [{ required: true, message: '自定义域名不能为空', trigger: 'blur' }]
+  }
+})
+const formRef = ref() // 表单 Ref
+
+/** 打开弹窗 */
+const openModal = async (type: string, id?: number) => {
+  modelVisible.value = true
+  modelTitle.value = t('action.' + type)
+  formType.value = type
+  resetForm()
+  // 修改时，设置数据
+  if (id) {
+    formLoading.value = true
+    try {
+      formData.value = await FileConfigApi.getFileConfigApi(id)
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = formData.value as unknown as FileConfigApi.FileConfigVO
+    if (formType.value === 'create') {
+      await FileConfigApi.createFileConfigApi(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await FileConfigApi.updateFileConfigApi(data)
+      message.success(t('common.updateSuccess'))
+    }
+    modelVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    id: undefined,
+    name: '',
+    storage: '',
+    remark: '',
+    config: {}
+  }
+  formRef.value?.resetFields()
+}
+</script>
diff --git a/src/views/infra/fileConfig/index.vue b/src/views/infra/fileConfig/index.vue
index 9d796a659..4416b094b 100644
--- a/src/views/infra/fileConfig/index.vue
+++ b/src/views/infra/fileConfig/index.vue
@@ -1,294 +1,201 @@
 <template>
-  <ContentWrap>
-    <!-- 列表 -->
-    <XTable @register="registerTable">
-      <template #toolbar_buttons>
-        <!-- 操作：新增 -->
-        <XButton
-          type="primary"
-          preIcon="ep:zoom-in"
-          :title="t('action.add')"
-          v-hasPermi="['infra:file-config:create']"
-          @click="handleCreate(formRef)"
-        />
-      </template>
-      <template #actionbtns_default="{ row }">
-        <!-- 操作：编辑 -->
-        <XTextButton
-          preIcon="ep:edit"
-          :title="t('action.edit')"
-          v-hasPermi="['infra:file-config:update']"
-          @click="handleUpdate(row.id)"
-        />
-        <!-- 操作：详情 -->
-        <XTextButton
-          preIcon="ep:view"
-          :title="t('action.detail')"
-          v-hasPermi="['infra:file-config:query']"
-          @click="handleDetail(row.id)"
-        />
-        <!-- 操作：主配置 -->
-        <XTextButton
-          preIcon="ep:flag"
-          title="主配置"
-          v-hasPermi="['infra:file-config:update']"
-          @click="handleMaster(row)"
-        />
-        <!-- 操作：测试 -->
-        <XTextButton preIcon="ep:share" :title="t('action.test')" @click="handleTest(row.id)" />
-        <!-- 操作：删除 -->
-        <XTextButton
-          preIcon="ep:delete"
-          :title="t('action.del')"
-          v-hasPermi="['infra:file-config:delete']"
-          @click="deleteData(row.id)"
-        />
-      </template>
-    </XTable>
-  </ContentWrap>
-  <XModal v-model="dialogVisible" :title="dialogTitle">
-    <!-- 对话框(添加 / 修改) -->
-    <el-form
-      ref="formRef"
-      v-if="['create', 'update'].includes(actionType)"
-      :model="form"
-      :rules="rules"
-      label-width="120px"
-    >
+  <!-- 搜索 -->
+  <content-wrap>
+    <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true">
       <el-form-item label="配置名" prop="name">
-        <el-input v-model="form.name" placeholder="请输入配置名" />
-      </el-form-item>
-      <el-form-item label="备注" prop="remark">
-        <el-input v-model="form.remark" placeholder="请输入备注" />
+        <el-input
+          v-model="queryParams.name"
+          placeholder="请输入配置名"
+          clearable
+          @keyup.enter="handleQuery"
+        />
       </el-form-item>
       <el-form-item label="存储器" prop="storage">
-        <el-select v-model="form.storage" placeholder="请选择存储器" :disabled="form.id !== 0">
+        <el-select v-model="queryParams.storage" placeholder="请选择存储器" clearable>
           <el-option
-            v-for="(dict, index) in getIntDictOptions(DICT_TYPE.INFRA_FILE_STORAGE)"
-            :key="index"
+            v-for="dict in getDictOptions(DICT_TYPE.INFRA_FILE_STORAGE)"
+            :key="parseInt(dict.value)"
             :label="dict.label"
-            :value="dict.value"
+            :value="parseInt(dict.value)"
           />
         </el-select>
       </el-form-item>
-      <!-- DB -->
-      <!-- Local / FTP / SFTP -->
-      <el-form-item
-        v-if="form.storage >= 10 && form.storage <= 12"
-        label="基础路径"
-        prop="config.basePath"
-      >
-        <el-input v-model="form.config.basePath" placeholder="请输入基础路径" />
+      <el-form-item label="创建时间" prop="createTime">
+        <el-date-picker
+          v-model="queryParams.createTime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+        />
       </el-form-item>
-      <el-form-item
-        v-if="form.storage >= 11 && form.storage <= 12"
-        label="主机地址"
-        prop="config.host"
-      >
-        <el-input v-model="form.config.host" placeholder="请输入主机地址" />
-      </el-form-item>
-      <el-form-item
-        v-if="form.storage >= 11 && form.storage <= 12"
-        label="主机端口"
-        prop="config.port"
-      >
-        <el-input-number :min="0" v-model="form.config.port" placeholder="请输入主机端口" />
-      </el-form-item>
-      <el-form-item
-        v-if="form.storage >= 11 && form.storage <= 12"
-        label="用户名"
-        prop="config.username"
-      >
-        <el-input v-model="form.config.username" placeholder="请输入密码" />
-      </el-form-item>
-      <el-form-item
-        v-if="form.storage >= 11 && form.storage <= 12"
-        label="密码"
-        prop="config.password"
-      >
-        <el-input v-model="form.config.password" placeholder="请输入密码" />
-      </el-form-item>
-      <el-form-item v-if="form.storage === 11" label="连接模式" prop="config.mode">
-        <el-radio-group v-model="form.config.mode">
-          <el-radio key="Active" label="Active">主动模式</el-radio>
-          <el-radio key="Passive" label="Passive">主动模式</el-radio>
-        </el-radio-group>
-      </el-form-item>
-      <!-- S3 -->
-      <el-form-item v-if="form.storage === 20" label="节点地址" prop="config.endpoint">
-        <el-input v-model="form.config.endpoint" placeholder="请输入节点地址" />
-      </el-form-item>
-      <el-form-item v-if="form.storage === 20" label="存储 bucket" prop="config.bucket">
-        <el-input v-model="form.config.bucket" placeholder="请输入 bucket" />
-      </el-form-item>
-      <el-form-item v-if="form.storage === 20" label="accessKey" prop="config.accessKey">
-        <el-input v-model="form.config.accessKey" placeholder="请输入 accessKey" />
-      </el-form-item>
-      <el-form-item v-if="form.storage === 20" label="accessSecret" prop="config.accessSecret">
-        <el-input v-model="form.config.accessSecret" placeholder="请输入 accessSecret" />
-      </el-form-item>
-      <!-- 通用 -->
-      <el-form-item v-if="form.storage === 20" label="自定义域名">
-        <!-- 无需参数校验，所以去掉 prop -->
-        <el-input v-model="form.config.domain" placeholder="请输入自定义域名" />
-      </el-form-item>
-      <el-form-item v-else-if="form.storage" label="自定义域名" prop="config.domain">
-        <el-input v-model="form.config.domain" placeholder="请输入自定义域名" />
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+        <el-button
+          type="primary"
+          @click="openModal('create')"
+          v-hasPermi="['infra:file-config:create']"
+        >
+          <Icon icon="ep:plus" class="mr-5px" /> 新增
+        </el-button>
       </el-form-item>
     </el-form>
-    <!-- 对话框(详情) -->
-    <Descriptions
-      v-if="actionType === 'detail'"
-      :schema="allSchemas.detailSchema"
-      :data="detailData"
-    />
-    <!-- 操作按钮 -->
-    <template #footer>
-      <!-- 按钮：保存 -->
-      <XButton
-        v-if="['create', 'update'].includes(actionType)"
-        type="primary"
-        :title="t('action.save')"
-        :loading="actionLoading"
-        @click="submitForm(formRef)"
+  </content-wrap>
+
+  <!-- 列表 -->
+  <content-wrap>
+    <el-table v-loading="loading" :data="list" align="center">
+      <el-table-column label="编号" align="center" prop="id" />
+      <el-table-column label="配置名" align="center" prop="name" />
+      <el-table-column label="存储器" align="center" prop="storage">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.INFRA_FILE_STORAGE" :value="scope.row.storage" />
+        </template>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remark" />
+      <el-table-column label="主配置" align="center" prop="primary">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.INFRA_BOOLEAN_STRING" :value="scope.row.master" />
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="创建时间"
+        align="center"
+        prop="createTime"
+        width="180"
+        :formatter="dateFormatter"
       />
-      <!-- 按钮：关闭 -->
-      <XButton :loading="actionLoading" :title="t('dialog.close')" @click="dialogVisible = false" />
-    </template>
-  </XModal>
+      <el-table-column label="操作" align="center">
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            @click="openModal('update', scope.row.id)"
+            v-hasPermi="['infra:file-config:update']"
+          >
+            编辑
+          </el-button>
+          <el-button
+            link
+            type="primary"
+            :disabled="scope.row.master"
+            @click="handleMaster(scope.row.id)"
+            v-hasPermi="['infra:file-config:update']"
+          >
+            主配置
+          </el-button>
+          <el-button link type="primary" @click="handleTest(scope.row.id)"> 测试 </el-button>
+          <el-button
+            link
+            type="danger"
+            @click="handleDelete(scope.row.id)"
+            v-hasPermi="['infra:config:delete']"
+          >
+            删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </content-wrap>
+
+  <!-- 表单弹窗：添加/修改 -->
+  <file-config-form ref="modalRef" @success="getList" />
 </template>
-<script setup lang="ts" name="FileConfig">
-import type { FormInstance } from 'element-plus'
-// 业务相关的 import
+<script setup lang="ts" name="Config">
 import * as FileConfigApi from '@/api/infra/fileConfig'
-import { rules, allSchemas } from './fileConfig.data'
-import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
-
-const { t } = useI18n() // 国际化
+import FileConfigForm from './form.vue'
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
+import { dateFormatter } from '@/utils/formatTime'
 const message = useMessage() // 消息弹窗
-// 列表相关的变量
-const [registerTable, { reload, deleteData }] = useXTable({
-  allSchemas: allSchemas,
-  getListApi: FileConfigApi.getFileConfigPageApi,
-  deleteApi: FileConfigApi.deleteFileConfigApi
-})
+const { t } = useI18n() // 国际化
 
-// ========== CRUD 相关 ==========
-const actionLoading = ref(false) // 遮罩层
-const actionType = ref('') // 操作按钮的类型
-const dialogVisible = ref(false) // 是否显示弹出层
-const dialogTitle = ref('edit') // 弹出层标题
-const formRef = ref<FormInstance>() // 表单 Ref
-const detailData = ref() // 详情 Ref
-const form = ref<FileConfigApi.FileConfigVO>({
-  id: 0,
-  name: '',
-  storage: 0,
-  master: false,
-  visible: false,
-  config: {
-    basePath: '',
-    host: '',
-    port: 0,
-    username: '',
-    password: '',
-    mode: '',
-    endpoint: '',
-    bucket: '',
-    accessKey: '',
-    accessSecret: '',
-    domain: ''
-  },
-  remark: '',
-  createTime: new Date()
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  name: undefined,
+  storage: undefined,
+  createTime: []
 })
-// 设置标题
-const setDialogTile = (type: string) => {
-  dialogTitle.value = t('action.' + type)
-  actionType.value = type
-  dialogVisible.value = true
-}
+const queryFormRef = ref() // 搜索的表单
 
-// 新增操作
-const handleCreate = (formEl: FormInstance | undefined) => {
-  setDialogTile('create')
-  formEl?.resetFields()
-  form.value = {
-    id: 0,
-    name: '',
-    storage: 0,
-    master: false,
-    visible: false,
-    config: {
-      basePath: '',
-      host: '',
-      port: 0,
-      username: '',
-      password: '',
-      mode: '',
-      endpoint: '',
-      bucket: '',
-      accessKey: '',
-      accessSecret: '',
-      domain: ''
-    },
-    remark: '',
-    createTime: new Date()
+/** 查询参数列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await FileConfigApi.getFileConfigPageApi(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
   }
 }
 
-// 修改操作
-const handleUpdate = async (rowId: number) => {
-  // 设置数据
-  const res = await FileConfigApi.getFileConfigApi(rowId)
-  form.value = res
-  setDialogTile('update')
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
 }
 
-// 详情操作
-const handleDetail = async (rowId: number) => {
-  setDialogTile('detail')
-  // 设置数据
-  const res = await FileConfigApi.getFileConfigApi(rowId)
-  detailData.value = res
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
 }
 
-// 主配置操作
-const handleMaster = (row: FileConfigApi.FileConfigVO) => {
+/** 添加/修改操作 */
+const modalRef = ref()
+const openModal = (type: string, id?: number) => {
+  modalRef.value.openModal(type, id)
+}
+
+/** 删除按钮操作 */
+const handleDelete = async (id: number) => {
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await FileConfigApi.deleteFileConfigApi(id)
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
+}
+/** 主配置按钮操作 */
+const handleMaster = (id) => {
   message
-    .confirm('是否确认修改配置【 ' + row.name + ' 】为主配置?', t('common.reminder'))
-    .then(async () => {
-      await FileConfigApi.updateFileConfigMasterApi(row.id)
-      await reload()
+    .confirm('是否确认修改配置编号为"' + id + '"的数据项为主配置?')
+    .then(function () {
+      return FileConfigApi.updateFileConfigMasterApi(id)
     })
+    .then(() => {
+      getList()
+      message.success(t('common.updateSuccess'))
+    })
+    .catch(() => {})
 }
-
-const handleTest = async (rowId: number) => {
-  const res = await FileConfigApi.testFileConfigApi(rowId)
-  message.alert('测试通过，上传文件成功！访问地址：' + res)
-}
-
-// 提交按钮
-const submitForm = async (formEl: FormInstance | undefined) => {
-  if (!formEl) return
-  formEl.validate(async (valid) => {
-    if (valid) {
-      actionLoading.value = true
-      // 提交请求
-      try {
-        if (actionType.value === 'create') {
-          await FileConfigApi.createFileConfigApi(form.value)
-          message.success(t('common.createSuccess'))
-        } else {
-          await FileConfigApi.updateFileConfigApi(form.value)
-          message.success(t('common.updateSuccess'))
-        }
-        dialogVisible.value = false
-      } finally {
-        actionLoading.value = false
-        await reload()
-      }
-    }
-  })
+/** 测试按钮操作 */
+const handleTest = (id) => {
+  FileConfigApi.testFileConfigApi(id)
+    .then((response) => {
+      message.alert('测试通过，上传文件成功！访问地址：' + response)
+    })
+    .catch(() => {})
 }
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
 </script>

From fe2fa21d44c93b419dbe55bc0b1cd6172aaaccc0 Mon Sep 17 00:00:00 2001
From: dlarmor <121919810@qq.com>
Date: Tue, 14 Mar 2023 11:48:35 +0800
Subject: [PATCH 12/40] =?UTF-8?q?=E9=87=8D=E6=9E=84=EF=BC=9A=E5=9F=BA?=
 =?UTF-8?q?=E7=A1=80=E8=AE=BE=E6=96=BD=20->=20=E6=96=87=E4=BB=B6=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=20=E6=8E=A5=E5=8F=A3=E6=96=87=E4=BB=B6=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/infra/{fileList => file}/index.ts | 15 ++-------------
 src/api/infra/fileConfig/index.ts         | 14 +++++++-------
 src/views/infra/fileConfig/form.vue       |  6 +++---
 src/views/infra/fileConfig/index.vue      |  8 ++++----
 4 files changed, 16 insertions(+), 27 deletions(-)
 rename src/api/infra/{fileList => file}/index.ts (54%)

diff --git a/src/api/infra/fileList/index.ts b/src/api/infra/file/index.ts
similarity index 54%
rename from src/api/infra/fileList/index.ts
rename to src/api/infra/file/index.ts
index 48b3c9917..f64bc0d69 100644
--- a/src/api/infra/fileList/index.ts
+++ b/src/api/infra/file/index.ts
@@ -1,16 +1,5 @@
 import request from '@/config/axios'
 
-export interface FileVO {
-  id: number
-  configId: number
-  path: string
-  name: string
-  url: string
-  size: string
-  type: string
-  createTime: Date
-}
-
 export interface FilePageReqVO extends PageParam {
   path?: string
   type?: string
@@ -18,11 +7,11 @@ export interface FilePageReqVO extends PageParam {
 }
 
 // 查询文件列表
-export const getFilePageApi = (params: FilePageReqVO) => {
+export const getFilePage = (params: FilePageReqVO) => {
   return request.get({ url: '/infra/file/page', params })
 }
 
 // 删除文件
-export const deleteFileApi = (id: number) => {
+export const deleteFile = (id: number) => {
   return request.delete({ url: '/infra/file/delete?id=' + id })
 }
diff --git a/src/api/infra/fileConfig/index.ts b/src/api/infra/fileConfig/index.ts
index 2151141cd..2f0967063 100644
--- a/src/api/infra/fileConfig/index.ts
+++ b/src/api/infra/fileConfig/index.ts
@@ -31,36 +31,36 @@ export interface FileConfigPageReqVO extends PageParam {
 }
 
 // 查询文件配置列表
-export const getFileConfigPageApi = (params: FileConfigPageReqVO) => {
+export const getFileConfigPage = (params: FileConfigPageReqVO) => {
   return request.get({ url: '/infra/file-config/page', params })
 }
 
 // 查询文件配置详情
-export const getFileConfigApi = (id: number) => {
+export const getFileConfig = (id: number) => {
   return request.get({ url: '/infra/file-config/get?id=' + id })
 }
 
 // 更新文件配置为主配置
-export const updateFileConfigMasterApi = (id: number) => {
+export const updateFileConfigMaster = (id: number) => {
   return request.put({ url: '/infra/file-config/update-master?id=' + id })
 }
 
 // 新增文件配置
-export const createFileConfigApi = (data: FileConfigVO) => {
+export const createFileConfig = (data: FileConfigVO) => {
   return request.post({ url: '/infra/file-config/create', data })
 }
 
 // 修改文件配置
-export const updateFileConfigApi = (data: FileConfigVO) => {
+export const updateFileConfig = (data: FileConfigVO) => {
   return request.put({ url: '/infra/file-config/update', data })
 }
 
 // 删除文件配置
-export const deleteFileConfigApi = (id: number) => {
+export const deleteFileConfig = (id: number) => {
   return request.delete({ url: '/infra/file-config/delete?id=' + id })
 }
 
 // 测试文件配置
-export const testFileConfigApi = (id: number) => {
+export const testFileConfig = (id: number) => {
   return request.get({ url: '/infra/file-config/test?id=' + id })
 }
diff --git a/src/views/infra/fileConfig/form.vue b/src/views/infra/fileConfig/form.vue
index ee7bd2387..a23aac9f0 100644
--- a/src/views/infra/fileConfig/form.vue
+++ b/src/views/infra/fileConfig/form.vue
@@ -147,7 +147,7 @@ const openModal = async (type: string, id?: number) => {
   if (id) {
     formLoading.value = true
     try {
-      formData.value = await FileConfigApi.getFileConfigApi(id)
+      formData.value = await FileConfigApi.getFileConfig(id)
     } finally {
       formLoading.value = false
     }
@@ -167,10 +167,10 @@ const submitForm = async () => {
   try {
     const data = formData.value as unknown as FileConfigApi.FileConfigVO
     if (formType.value === 'create') {
-      await FileConfigApi.createFileConfigApi(data)
+      await FileConfigApi.createFileConfig(data)
       message.success(t('common.createSuccess'))
     } else {
-      await FileConfigApi.updateFileConfigApi(data)
+      await FileConfigApi.updateFileConfig(data)
       message.success(t('common.updateSuccess'))
     }
     modelVisible.value = false
diff --git a/src/views/infra/fileConfig/index.vue b/src/views/infra/fileConfig/index.vue
index 4416b094b..3b683e4ed 100644
--- a/src/views/infra/fileConfig/index.vue
+++ b/src/views/infra/fileConfig/index.vue
@@ -135,7 +135,7 @@ const queryFormRef = ref() // 搜索的表单
 const getList = async () => {
   loading.value = true
   try {
-    const data = await FileConfigApi.getFileConfigPageApi(queryParams)
+    const data = await FileConfigApi.getFileConfigPage(queryParams)
     list.value = data.list
     total.value = data.total
   } finally {
@@ -167,7 +167,7 @@ const handleDelete = async (id: number) => {
     // 删除的二次确认
     await message.delConfirm()
     // 发起删除
-    await FileConfigApi.deleteFileConfigApi(id)
+    await FileConfigApi.deleteFileConfig(id)
     message.success(t('common.delSuccess'))
     // 刷新列表
     await getList()
@@ -178,7 +178,7 @@ const handleMaster = (id) => {
   message
     .confirm('是否确认修改配置编号为"' + id + '"的数据项为主配置?')
     .then(function () {
-      return FileConfigApi.updateFileConfigMasterApi(id)
+      return FileConfigApi.updateFileConfigMaster(id)
     })
     .then(() => {
       getList()
@@ -188,7 +188,7 @@ const handleMaster = (id) => {
 }
 /** 测试按钮操作 */
 const handleTest = (id) => {
-  FileConfigApi.testFileConfigApi(id)
+  FileConfigApi.testFileConfig(id)
     .then((response) => {
       message.alert('测试通过，上传文件成功！访问地址：' + response)
     })

From 1a7f89a8e23a41a0f313afd5e0b9c81bd2dbb7bb Mon Sep 17 00:00:00 2001
From: dlarmor <121919810@qq.com>
Date: Tue, 14 Mar 2023 11:50:31 +0800
Subject: [PATCH 13/40] =?UTF-8?q?=E9=87=8D=E6=9E=84=EF=BC=9A=E5=9F=BA?=
 =?UTF-8?q?=E7=A1=80=E8=AE=BE=E6=96=BD=20->=20=E6=96=87=E4=BB=B6=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=20=E6=8E=A5=E5=8F=A3=E6=96=87=E4=BB=B6=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/infra/file/index.vue | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/views/infra/file/index.vue b/src/views/infra/file/index.vue
index 77beb3e5c..0f63ea288 100644
--- a/src/views/infra/file/index.vue
+++ b/src/views/infra/file/index.vue
@@ -87,7 +87,7 @@
 </template>
 <script setup lang="ts" name="Config">
 import { dateFormatter } from '@/utils/formatTime'
-import * as FileApi from '@/api/infra/fileList'
+import * as FileApi from '@/api/infra/file'
 import FileUploadForm from './form.vue'
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
@@ -108,7 +108,7 @@ const queryFormRef = ref() // 搜索的表单
 const getList = async () => {
   loading.value = true
   try {
-    const data = await FileApi.getFilePageApi(queryParams)
+    const data = await FileApi.getFilePage(queryParams)
     list.value = data.list
     total.value = data.total
   } finally {
@@ -140,7 +140,7 @@ const handleDelete = async (id: number) => {
     // 删除的二次确认
     await message.delConfirm()
     // 发起删除
-    await FileApi.deleteFileApi(id)
+    await FileApi.deleteFile(id)
     message.success(t('common.delSuccess'))
     // 刷新列表
     await getList()

From be6e307ba006e23c41fe0edec63bb831e11b8c1d Mon Sep 17 00:00:00 2001
From: gexinzhineng/gxzn27 <1348660141@qq.com>
Date: Tue, 14 Mar 2023 13:10:31 +0800
Subject: [PATCH 14/40] =?UTF-8?q?id=E6=98=BE=E7=A4=BA=E4=B8=BA=E5=BA=8F?=
 =?UTF-8?q?=E5=8F=B7bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/bpm/form/form.data.ts                   | 2 +-
 src/views/infra/apiAccessLog/apiAccessLog.data.ts | 2 +-
 src/views/infra/apiErrorLog/apiErrorLog.data.ts   | 2 +-
 src/views/infra/fileConfig/fileConfig.data.ts     | 2 +-
 src/views/system/sms/smsLog/index.vue             | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/views/bpm/form/form.data.ts b/src/views/bpm/form/form.data.ts
index d367da132..43c93dd7a 100644
--- a/src/views/bpm/form/form.data.ts
+++ b/src/views/bpm/form/form.data.ts
@@ -10,7 +10,7 @@ export const rules = reactive({
 // CrudSchema
 const crudSchemas = reactive<VxeCrudSchema>({
   primaryKey: 'id',
-  primaryType: 'seq',
+  primaryType: 'id',
   primaryTitle: '表单编号',
   action: true,
   columns: [
diff --git a/src/views/infra/apiAccessLog/apiAccessLog.data.ts b/src/views/infra/apiAccessLog/apiAccessLog.data.ts
index 927e2330b..b2d9786d9 100644
--- a/src/views/infra/apiAccessLog/apiAccessLog.data.ts
+++ b/src/views/infra/apiAccessLog/apiAccessLog.data.ts
@@ -3,7 +3,7 @@ import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
 // CrudSchema
 const crudSchemas = reactive<VxeCrudSchema>({
   primaryKey: 'id',
-  primaryType: 'seq',
+  primaryType: 'id',
   primaryTitle: '日志编号',
   action: true,
   actionWidth: '80px',
diff --git a/src/views/infra/apiErrorLog/apiErrorLog.data.ts b/src/views/infra/apiErrorLog/apiErrorLog.data.ts
index 6471f64d7..a539c1678 100644
--- a/src/views/infra/apiErrorLog/apiErrorLog.data.ts
+++ b/src/views/infra/apiErrorLog/apiErrorLog.data.ts
@@ -3,7 +3,7 @@ import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
 // CrudSchema
 const crudSchemas = reactive<VxeCrudSchema>({
   primaryKey: 'id',
-  primaryType: 'seq',
+  primaryType: 'id',
   primaryTitle: '日志编号',
   action: true,
   actionWidth: '300',
diff --git a/src/views/infra/fileConfig/fileConfig.data.ts b/src/views/infra/fileConfig/fileConfig.data.ts
index d0f648699..ae351cfab 100644
--- a/src/views/infra/fileConfig/fileConfig.data.ts
+++ b/src/views/infra/fileConfig/fileConfig.data.ts
@@ -23,7 +23,7 @@ export const rules = reactive({
 // CrudSchema
 const crudSchemas = reactive<VxeCrudSchema>({
   primaryKey: 'id',
-  primaryType: 'seq',
+  primaryType: 'id',
   primaryTitle: '配置编号',
   action: true,
   actionWidth: '400px',
diff --git a/src/views/system/sms/smsLog/index.vue b/src/views/system/sms/smsLog/index.vue
index 7099e1a81..334da2ad8 100644
--- a/src/views/system/sms/smsLog/index.vue
+++ b/src/views/system/sms/smsLog/index.vue
@@ -44,7 +44,7 @@ const [registerTable, { exportList }] = useXTable({
 
 // 弹窗相关的变量
 const dialogVisible = ref(false) // 是否显示弹出层
-const dialogTitle = ref('详情') // 弹出层标题
+const dialogTitle = ref(t('action.detail')) // 弹出层标题
 const actionType = ref('') // 操作按钮的类型
 // ========== 详情相关 ==========
 const detailData = ref() // 详情 Ref

From d46812483f72a23bacfa646e11db077c3507c888 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Tue, 14 Mar 2023 21:08:00 +0800
Subject: [PATCH 15/40] =?UTF-8?q?file=20=E9=87=8D=E6=9E=84=E7=9A=84=20revi?=
 =?UTF-8?q?ew=20=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/infra/fileConfig/index.ts    | 9 ++-------
 src/views/infra/file/form.vue        | 5 +++--
 src/views/infra/file/index.vue       | 2 ++
 src/views/infra/fileConfig/index.vue | 7 ++++++-
 4 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/src/api/infra/fileConfig/index.ts b/src/api/infra/fileConfig/index.ts
index 2f0967063..d6c00996e 100644
--- a/src/api/infra/fileConfig/index.ts
+++ b/src/api/infra/fileConfig/index.ts
@@ -13,6 +13,7 @@ export interface FileClientConfig {
   accessSecret?: string
   domain: string
 }
+
 export interface FileConfigVO {
   id: number
   name: string
@@ -24,14 +25,8 @@ export interface FileConfigVO {
   createTime: Date
 }
 
-export interface FileConfigPageReqVO extends PageParam {
-  name?: string
-  storage?: number
-  createTime?: Date[]
-}
-
 // 查询文件配置列表
-export const getFileConfigPage = (params: FileConfigPageReqVO) => {
+export const getFileConfigPage = (params: PageParam) => {
   return request.get({ url: '/infra/file-config/page', params })
 }
 
diff --git a/src/views/infra/file/form.vue b/src/views/infra/file/form.vue
index 8550d4400..15ef02fdf 100644
--- a/src/views/infra/file/form.vue
+++ b/src/views/infra/file/form.vue
@@ -59,14 +59,17 @@ const emit = defineEmits(['success']) // 定义 success 事件，用于操作成
 const handleFileChange = (file) => {
   data.value.path = file.name
 }
+
 /** 处理文件上传中 */
 const handleFileUploadProgress = () => {
   formLoading.value = true // 禁止修改
 }
+
 /** 发起文件上传 */
 const submitFileForm = () => {
   unref(uploadRef)?.submit()
 }
+
 /** 文件上传成功处理 */
 const handleFileSuccess = () => {
   // 清理
@@ -78,5 +81,3 @@ const handleFileSuccess = () => {
   emit('success')
 }
 </script>
-
-<style scoped></style>
diff --git a/src/views/infra/file/index.vue b/src/views/infra/file/index.vue
index 0f63ea288..7c88ffb00 100644
--- a/src/views/infra/file/index.vue
+++ b/src/views/infra/file/index.vue
@@ -147,6 +147,7 @@ const handleDelete = async (id: number) => {
   } catch {}
 }
 
+// TODO 写到 utils/index.ts 中
 const sizeFormat = (row) => {
   const unitArr = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
   const srcSize = parseFloat(row.size)
@@ -155,6 +156,7 @@ const sizeFormat = (row) => {
   const sizeStr = size.toFixed(2) //保留的小数位数
   return sizeStr + ' ' + unitArr[index]
 }
+
 /** 初始化 **/
 onMounted(() => {
   getList()
diff --git a/src/views/infra/fileConfig/index.vue b/src/views/infra/fileConfig/index.vue
index 3b683e4ed..4145d7a03 100644
--- a/src/views/infra/fileConfig/index.vue
+++ b/src/views/infra/fileConfig/index.vue
@@ -68,7 +68,7 @@
         width="180"
         :formatter="dateFormatter"
       />
-      <el-table-column label="操作" align="center">
+      <el-table-column label="操作" align="center" width="240px">
         <template #default="scope">
           <el-button
             link
@@ -173,8 +173,10 @@ const handleDelete = async (id: number) => {
     await getList()
   } catch {}
 }
+
 /** 主配置按钮操作 */
 const handleMaster = (id) => {
+  // TODO 改成 await 的形式
   message
     .confirm('是否确认修改配置编号为"' + id + '"的数据项为主配置?')
     .then(function () {
@@ -186,14 +188,17 @@ const handleMaster = (id) => {
     })
     .catch(() => {})
 }
+
 /** 测试按钮操作 */
 const handleTest = (id) => {
+  // TODO 改成 await 的形式
   FileConfigApi.testFileConfig(id)
     .then((response) => {
       message.alert('测试通过，上传文件成功！访问地址：' + response)
     })
     .catch(() => {})
 }
+
 /** 初始化 **/
 onMounted(() => {
   getList()

From b6e3a583ff1e3cb9f4ad0347dc2c38d403e3a3dd Mon Sep 17 00:00:00 2001
From: dlarmor <121919810@qq.com>
Date: Wed, 15 Mar 2023 10:07:27 +0800
Subject: [PATCH 16/40] file finished todo

---
 src/utils/index.ts                   |  9 ++++++++
 src/views/infra/file/index.vue       | 13 ++----------
 src/views/infra/fileConfig/index.vue | 31 +++++++++++-----------------
 3 files changed, 23 insertions(+), 30 deletions(-)

diff --git a/src/utils/index.ts b/src/utils/index.ts
index d30584738..c86d4cd85 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -137,3 +137,12 @@ export const generateUUID = () => {
     return (c === 'x' ? random : (random & 0x3) | 0x8).toString(16)
   })
 }
+
+export const fileSizeFormatter = (row) => {
+  const unitArr = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
+  const srcSize = parseFloat(row.size)
+  const index = Math.floor(Math.log(srcSize) / Math.log(1024))
+  const size = srcSize / Math.pow(1024, index)
+  const sizeStr = size.toFixed(2) //保留的小数位数
+  return sizeStr + ' ' + unitArr[index]
+}
diff --git a/src/views/infra/file/index.vue b/src/views/infra/file/index.vue
index 7c88ffb00..5137ec3e3 100644
--- a/src/views/infra/file/index.vue
+++ b/src/views/infra/file/index.vue
@@ -50,7 +50,7 @@
         align="center"
         prop="size"
         width="120"
-        :formatter="sizeFormat"
+        :formatter="fileSizeFormatter"
       />
       <el-table-column label="文件类型" align="center" prop="type" width="180px" />
       <el-table-column
@@ -86,6 +86,7 @@
   <file-upload-form ref="modalRef" @success="getList" />
 </template>
 <script setup lang="ts" name="Config">
+import { fileSizeFormatter } from '@/utils'
 import { dateFormatter } from '@/utils/formatTime'
 import * as FileApi from '@/api/infra/file'
 import FileUploadForm from './form.vue'
@@ -147,16 +148,6 @@ const handleDelete = async (id: number) => {
   } catch {}
 }
 
-// TODO 写到 utils/index.ts 中
-const sizeFormat = (row) => {
-  const unitArr = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
-  const srcSize = parseFloat(row.size)
-  const index = Math.floor(Math.log(srcSize) / Math.log(1024))
-  const size = srcSize / Math.pow(1024, index)
-  const sizeStr = size.toFixed(2) //保留的小数位数
-  return sizeStr + ' ' + unitArr[index]
-}
-
 /** 初始化 **/
 onMounted(() => {
   getList()
diff --git a/src/views/infra/fileConfig/index.vue b/src/views/infra/fileConfig/index.vue
index 4145d7a03..e38e3a502 100644
--- a/src/views/infra/fileConfig/index.vue
+++ b/src/views/infra/fileConfig/index.vue
@@ -175,28 +175,21 @@ const handleDelete = async (id: number) => {
 }
 
 /** 主配置按钮操作 */
-const handleMaster = (id) => {
-  // TODO 改成 await 的形式
-  message
-    .confirm('是否确认修改配置编号为"' + id + '"的数据项为主配置?')
-    .then(function () {
-      return FileConfigApi.updateFileConfigMaster(id)
-    })
-    .then(() => {
-      getList()
-      message.success(t('common.updateSuccess'))
-    })
-    .catch(() => {})
+const handleMaster = async (id) => {
+  try {
+    await message.confirm('是否确认修改配置编号为"' + id + '"的数据项为主配置?')
+    await FileConfigApi.updateFileConfigMaster(id)
+    message.success(t('common.updateSuccess'))
+    await getList()
+  } catch {}
 }
 
 /** 测试按钮操作 */
-const handleTest = (id) => {
-  // TODO 改成 await 的形式
-  FileConfigApi.testFileConfig(id)
-    .then((response) => {
-      message.alert('测试通过，上传文件成功！访问地址：' + response)
-    })
-    .catch(() => {})
+const handleTest = async (id) => {
+  try {
+    const response = await FileConfigApi.testFileConfig(id)
+    message.alert('测试通过，上传文件成功！访问地址：' + response)
+  } catch {}
 }
 
 /** 初始化 **/

From c1be4339d6688cfd03aab2556389cb1dfd0a4c00 Mon Sep 17 00:00:00 2001
From: gexinzhineng/gxzn27 <1348660141@qq.com>
Date: Wed, 15 Mar 2023 14:33:04 +0800
Subject: [PATCH 17/40] =?UTF-8?q?1=E3=80=81bpmnjs=E4=B8=ADtemplate?=
 =?UTF-8?q?=E4=B8=AD=E4=B8=8D=E8=83=BD=E5=86=99=E6=B3=A8=E9=87=8A=EF=BC=8C?=
 =?UTF-8?q?=E4=BC=9A=E5=AF=BC=E8=87=B4=E6=8A=A5=E9=94=99=202=E3=80=81?=
 =?UTF-8?q?=E7=A7=9F=E5=AE=A2=E5=88=97=E8=A1=A8=E6=B7=BB=E5=8A=A0=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA=E8=B4=A6=E5=8F=B7=E5=AF=86=E7=A0=81=EF=BC=8C=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9=E4=B8=8D=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../multi-instance/ElementMultiInstance.vue   |  2 --
 src/views/system/tenant/index.vue             | 25 ++++++++++++++++++-
 src/views/system/tenant/tenant.data.ts        |  6 ++---
 src/views/system/user/user.data.ts            |  7 ++++++
 4 files changed, 33 insertions(+), 7 deletions(-)

diff --git a/src/components/bpmnProcessDesigner/package/penal/multi-instance/ElementMultiInstance.vue b/src/components/bpmnProcessDesigner/package/penal/multi-instance/ElementMultiInstance.vue
index 962234d53..2e5bc8a7f 100644
--- a/src/components/bpmnProcessDesigner/package/penal/multi-instance/ElementMultiInstance.vue
+++ b/src/components/bpmnProcessDesigner/package/penal/multi-instance/ElementMultiInstance.vue
@@ -3,10 +3,8 @@
     <el-form label-width="90px">
       <el-form-item label="回路特性">
         <el-select v-model="loopCharacteristics" @change="changeLoopCharacteristicsType">
-          <!--bpmn:MultiInstanceLoopCharacteristics-->
           <el-option label="并行多重事件" value="ParallelMultiInstance" />
           <el-option label="时序多重事件" value="SequentialMultiInstance" />
-          <!--bpmn:StandardLoopCharacteristics-->
           <el-option label="循环事件" value="StandardLoop" />
           <el-option label="无" value="Null" />
         </el-select>
diff --git a/src/views/system/tenant/index.vue b/src/views/system/tenant/index.vue
index 20c697d69..bb1ca1a32 100644
--- a/src/views/system/tenant/index.vue
+++ b/src/views/system/tenant/index.vue
@@ -123,14 +123,37 @@ const setDialogTile = (type: string) => {
 }
 
 // 新增操作
-const handleCreate = () => {
+const handleCreate = async () => {
   // 重置表单
   setDialogTile('create')
+  await nextTick()
+  console.log(allSchemas.formSchema, 'allSchemas.formSchema')
+  if (allSchemas.formSchema[4].field !== 'username') {
+    unref(formRef)?.addSchema(
+      {
+        field: 'username',
+        label: '用户名称',
+        component: 'Input'
+      },
+      0
+    )
+    unref(formRef)?.addSchema(
+      {
+        field: 'password',
+        label: '用户密码',
+        component: 'InputPassword'
+      },
+      1
+    )
+  }
 }
 
 // 修改操作
 const handleUpdate = async (rowId: number) => {
   setDialogTile('update')
+  await nextTick()
+  unref(formRef)?.delSchema('username')
+  unref(formRef)?.delSchema('password')
   // 设置数据
   const res = await TenantApi.getTenantApi(rowId)
   unref(formRef)?.setValues(res)
diff --git a/src/views/system/tenant/tenant.data.ts b/src/views/system/tenant/tenant.data.ts
index adda1807f..1137b44a2 100644
--- a/src/views/system/tenant/tenant.data.ts
+++ b/src/views/system/tenant/tenant.data.ts
@@ -123,8 +123,7 @@ const crudSchemas = reactive<VxeCrudSchema>({
       title: '用户名称',
       field: 'username',
       isTable: false,
-      isDetail: false,
-      isForm: false
+      isDetail: false
     },
     {
       title: '用户密码',
@@ -133,8 +132,7 @@ const crudSchemas = reactive<VxeCrudSchema>({
       isDetail: false,
       form: {
         component: 'InputPassword'
-      },
-      isForm: false
+      }
     },
     {
       title: '账号额度',
diff --git a/src/views/system/user/user.data.ts b/src/views/system/user/user.data.ts
index 59a795e71..3a702c041 100644
--- a/src/views/system/user/user.data.ts
+++ b/src/views/system/user/user.data.ts
@@ -60,6 +60,13 @@ const crudSchemas = reactive<VxeCrudSchema>({
         component: 'InputPassword'
       }
     },
+    {
+      title: '用户' + t('profile.user.sex'),
+      field: 'sex',
+      dictType: DICT_TYPE.SYSTEM_USER_SEX,
+      dictClass: 'number',
+      table: { show: false }
+    },
     {
       title: '用户昵称',
       field: 'nickname'

From 629c177c996c93295ba3a8d10a72d2a3441ac44d Mon Sep 17 00:00:00 2001
From: gexinzhineng/gxzn27 <1348660141@qq.com>
Date: Wed, 15 Mar 2023 18:09:03 +0800
Subject: [PATCH 18/40] =?UTF-8?q?1=E3=80=81=E5=BA=94=E7=94=A8=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E7=BC=BA=E5=B0=91=E5=AD=97=E6=AE=B5=E5=AF=BC=E8=87=B4?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E4=B8=8D=E4=BA=86=202=E3=80=81=E7=9F=AD?=
 =?UTF-8?q?=E4=BF=A1=E6=A8=A1=E6=9D=BF=E6=B7=BB=E5=8A=A0=E7=BC=BA=E5=B0=91?=
 =?UTF-8?q?=E5=AD=97=E6=AE=B5=203=E3=80=81=E7=9F=AD=E4=BF=A1=E6=97=A5?=
 =?UTF-8?q?=E5=BF=97=E5=AF=BC=E5=87=BA=E6=8E=A5=E5=8F=A3=E9=94=99=E8=AF=AF?=
 =?UTF-8?q?=204=E3=80=81=E5=9F=BA=E7=A1=80=E8=AE=BE=E6=96=BD=E4=B8=AD?=
 =?UTF-8?q?=E8=8B=B1=E5=88=87=E6=8D=A2=E6=9A=82=E6=97=A0=E7=94=A8=EF=BC=8C?=
 =?UTF-8?q?=E5=85=88=E6=B3=A8=E9=87=8A=EF=BC=8C=E7=94=9F=E6=88=90json?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E6=A0=BC=E5=BC=8F=E5=8C=96=205=E3=80=81?=
 =?UTF-8?q?=E6=97=A5=E5=BF=97=E8=A1=A8=E6=A0=BC=E4=B8=8D=E6=98=BE=E7=A4=BA?=
 =?UTF-8?q?=E9=93=BE=E8=B7=AF=E5=9C=B0=E5=9D=80=EF=BC=88=E5=90=8Cvue2?=
 =?UTF-8?q?=EF=BC=89=206=E3=80=81=E6=90=9C=E7=B4=A2=E6=A1=86=E5=89=8D?=
 =?UTF-8?q?=E5=AD=97=E5=AE=BD=E6=8D=A2=E8=A1=8C=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/sms/smsLog/index.ts            |  2 +-
 src/components/XTable/src/XTable.vue          |  2 +-
 .../infra/apiAccessLog/apiAccessLog.data.ts   |  3 +-
 src/views/infra/build/index.vue               | 16 ++++++-----
 src/views/system/oauth2/client/client.data.ts |  4 +++
 .../sms/smsTemplate/sms.template.data.ts      | 28 ++++++++++++++++++-
 6 files changed, 44 insertions(+), 11 deletions(-)

diff --git a/src/api/system/sms/smsLog/index.ts b/src/api/system/sms/smsLog/index.ts
index 52594b908..863eabb6b 100644
--- a/src/api/system/sms/smsLog/index.ts
+++ b/src/api/system/sms/smsLog/index.ts
@@ -53,5 +53,5 @@ export const getSmsLogPageApi = (params: SmsLogPageReqVO) => {
 
 // 导出短信日志
 export const exportSmsLogApi = (params: SmsLogExportReqVO) => {
-  return request.download({ url: '/system/sms-log/export', params })
+  return request.download({ url: '/system/sms-log/export-excel', params })
 }
diff --git a/src/components/XTable/src/XTable.vue b/src/components/XTable/src/XTable.vue
index 451d3d302..55c7b129c 100644
--- a/src/components/XTable/src/XTable.vue
+++ b/src/components/XTable/src/XTable.vue
@@ -128,7 +128,7 @@ const getColumnsConfig = (options: XTableProps) => {
     proxyForm = true
     options.formConfig = {
       enabled: true,
-      titleWidth: 100,
+      titleWidth: 180,
       titleAlign: 'right',
       items: allSchemas.searchSchema
     }
diff --git a/src/views/infra/apiAccessLog/apiAccessLog.data.ts b/src/views/infra/apiAccessLog/apiAccessLog.data.ts
index b2d9786d9..cb9e97a7e 100644
--- a/src/views/infra/apiAccessLog/apiAccessLog.data.ts
+++ b/src/views/infra/apiAccessLog/apiAccessLog.data.ts
@@ -10,7 +10,8 @@ const crudSchemas = reactive<VxeCrudSchema>({
   columns: [
     {
       title: '链路追踪',
-      field: 'traceId'
+      field: 'traceId',
+      isTable: false
     },
     {
       title: '用户编号',
diff --git a/src/views/infra/build/index.vue b/src/views/infra/build/index.vue
index 7da88f8c0..6f577e952 100644
--- a/src/views/infra/build/index.vue
+++ b/src/views/infra/build/index.vue
@@ -8,7 +8,7 @@
           <el-button size="small" type="primary" @click="showJson">生成JSON</el-button>
           <el-button size="small" type="success" @click="showOption">生成Options</el-button>
           <el-button size="small" type="danger" @click="showTemplate">生成组件</el-button>
-          <el-button size="small" @click="changeLocale">中英切换</el-button>
+          <!-- <el-button size="small" @click="changeLocale">中英切换</el-button> -->
         </div>
       </el-col>
       <el-col>
@@ -19,9 +19,11 @@
       <div ref="editor" v-if="dialogVisible">
         <XTextButton style="float: right" :title="t('common.copy')" @click="copy(formValue)" />
         <el-scrollbar height="580">
-          <pre>
-            {{ formValue }}
-          </pre>
+          <div v-highlight>
+            <code class="hljs">
+              {{ formValue }}
+            </code>
+          </div>
         </el-scrollbar>
       </div>
       <span style="color: red" v-if="err">输入内容格式有误!</span>
@@ -69,9 +71,9 @@ const showTemplate = () => {
   type.value = 2
   formValue.value = makeTemplate()
 }
-const changeLocale = () => {
-  console.info('changeLocale')
-}
+// const changeLocale = () => {
+//   console.info('changeLocale')
+// }
 
 /** 复制 **/
 const copy = async (text: string) => {
diff --git a/src/views/system/oauth2/client/client.data.ts b/src/views/system/oauth2/client/client.data.ts
index 5f84e8117..52ee88957 100644
--- a/src/views/system/oauth2/client/client.data.ts
+++ b/src/views/system/oauth2/client/client.data.ts
@@ -22,6 +22,10 @@ const crudSchemas = reactive<VxeCrudSchema>({
   primaryType: null,
   action: true,
   columns: [
+    {
+      title: '客户端端号',
+      field: 'clientId'
+    },
     {
       title: '客户端密钥',
       field: 'secret'
diff --git a/src/views/system/sms/smsTemplate/sms.template.data.ts b/src/views/system/sms/smsTemplate/sms.template.data.ts
index 514a503af..6178d6c2b 100644
--- a/src/views/system/sms/smsTemplate/sms.template.data.ts
+++ b/src/views/system/sms/smsTemplate/sms.template.data.ts
@@ -1,6 +1,19 @@
 import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
+import * as smsApi from '@/api/system/sms/smsChannel'
 const { t } = useI18n() // 国际化
-
+const tenantPackageOption = []
+const getTenantPackageOptions = async () => {
+  const res = await smsApi.getSimpleSmsChannels()
+  console.log(res, 'resresres')
+  res.forEach((tenantPackage: TenantPackageVO) => {
+    tenantPackageOption.push({
+      key: tenantPackage.id,
+      value: tenantPackage.id,
+      label: tenantPackage.signature
+    })
+  })
+}
+getTenantPackageOptions()
 // 表单校验
 export const rules = reactive({
   type: [required],
@@ -20,6 +33,19 @@ const crudSchemas = reactive<VxeCrudSchema>({
   action: true,
   actionWidth: '280',
   columns: [
+    {
+      title: '短信渠道编码',
+      field: 'channelId',
+      isSearch: false,
+      isForm: true,
+      isTable: false,
+      form: {
+        component: 'Select',
+        componentProps: {
+          options: tenantPackageOption
+        }
+      }
+    },
     {
       title: '模板编码',
       field: 'code',

From 11d4e2ea177a5c3d1522448e1eb2ab45eab54052 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Wed, 15 Mar 2023 20:35:18 +0800
Subject: [PATCH 19/40] =?UTF-8?q?=E8=A1=A5=E5=85=A8=20fileSizeFormatter=20?=
 =?UTF-8?q?=E7=9A=84=E6=B3=A8=E9=87=8A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/index.ts | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/utils/index.ts b/src/utils/index.ts
index c86d4cd85..e016c1e20 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -138,9 +138,18 @@ export const generateUUID = () => {
   })
 }
 
-export const fileSizeFormatter = (row) => {
+/**
+ * element plus 的文件大小 Formatter 实现
+ *
+ * @param row 行数据
+ * @param column 字段
+ * @param cellValue 字段值
+ */
+// @ts-ignore
+export const fileSizeFormatter = (row, column, cellValue) => {
+  const fileSize = cellValue
   const unitArr = ['Bytes', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
-  const srcSize = parseFloat(row.size)
+  const srcSize = parseFloat(fileSize)
   const index = Math.floor(Math.log(srcSize) / Math.log(1024))
   const size = srcSize / Math.pow(1024, index)
   const sizeStr = size.toFixed(2) //保留的小数位数

From 4c143c1c6cd011305d4e0edbeb009f520a5b9cfa Mon Sep 17 00:00:00 2001
From: xiaobai <2511883673@qq.com>
Date: Wed, 15 Mar 2023 22:20:12 +0800
Subject: [PATCH 20/40] =?UTF-8?q?=E7=9F=AD=E4=BF=A1=E6=B8=A0=E9=81=93?=
 =?UTF-8?q?=E7=BF=BB=E5=86=99vue2->vue3=2020230315?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/sms/smsChannel/index.vue     | 321 +++++++++++-------
 .../system/sms/smsChannel/sms.channel.data.ts |  63 ----
 2 files changed, 200 insertions(+), 184 deletions(-)
 delete mode 100644 src/views/system/sms/smsChannel/sms.channel.data.ts

diff --git a/src/views/system/sms/smsChannel/index.vue b/src/views/system/sms/smsChannel/index.vue
index ee47a51aa..94a46b7d9 100644
--- a/src/views/system/sms/smsChannel/index.vue
+++ b/src/views/system/sms/smsChannel/index.vue
@@ -1,147 +1,226 @@
 <template>
   <ContentWrap>
-    <!-- 列表 -->
-    <XTable @register="registerTable">
-      <!-- 操作：新增 -->
-      <template #toolbar_buttons>
-        <XButton
+    <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+      <el-form-item label="短信签名" prop="signature">
+        <el-input
+          v-model="queryParams.signature"
+          placeholder="请输入短信签名"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="启用状态" prop="status">
+        <el-select v-model="queryParams.status" placeholder="请选择启用状态" clearable>
+          <el-option
+            v-for="dict in getDictOptions(DICT_TYPE.COMMON_STATUS)"
+            :key="parseInt(dict.value)"
+            :label="dict.label"
+            :value="parseInt(dict.value)"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="创建时间" prop="createTime">
+        <el-date-picker
+          v-model="queryParams.createTime"
+          value-format="yyyy-MM-dd HH:mm:ss"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+        <el-button
           type="primary"
-          preIcon="ep:zoom-in"
-          :title="t('action.add')"
+          @click="openModal('create')"
           v-hasPermi="['system:sms-channel:create']"
-          @click="handleCreate()"
-        />
-      </template>
-      <template #actionbtns_default="{ row }">
-        <!-- 操作：修改 -->
-        <XTextButton
-          preIcon="ep:edit"
-          :title="t('action.edit')"
-          v-hasPermi="['system:sms-channel:update']"
-          @click="handleUpdate(row.id)"
-        />
-        <!-- 操作：详情 -->
-        <XTextButton
-          preIcon="ep:view"
-          :title="t('action.detail')"
-          v-hasPermi="['system:sms-channel:query']"
-          @click="handleDetail(row.id)"
-        />
-        <!-- 操作：删除 -->
-        <XTextButton
-          preIcon="ep:delete"
-          :title="t('action.del')"
-          v-hasPermi="['system:sms-channel:delete']"
-          @click="deleteData(row.id)"
-        />
-      </template>
-    </XTable>
-  </ContentWrap>
+        >
+          <Icon icon="ep:plus" class="mr-5px" /> 新增</el-button
+        >
+        <el-button
+          type="success"
+          plain
+          @click="handleExport"
+          :loading="exportLoading"
+          v-hasPermi="['system:sms-channel:export']"
+        >
+          <Icon icon="ep:download" class="mr-5px" /> 导出</el-button
+        >
+      </el-form-item>
+    </el-form>
 
-  <XModal id="smsChannel" 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="detailData"
-    />
-    <!-- 操作按钮 -->
-    <template #footer>
-      <!-- 按钮：保存 -->
-      <XButton
-        v-if="['create', 'update'].includes(actionType)"
-        type="primary"
-        :title="t('action.save')"
-        :loading="actionLoading"
-        @click="submitForm()"
+    <!-- 列表 -->
+    <el-table v-loading="loading" :data="list" align="center">
+      <el-table-column label="编号" align="center" prop="id" />
+      <el-table-column label="短信签名" align="center" prop="signature" />
+      <el-table-column label="渠道编码" align="center" prop="code">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE" :value="scope.row.code" />
+        </template>
+      </el-table-column>
+      <el-table-column label="启用状态" align="center" prop="status">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.COMMON_STATUS" :value="scope.row.status" />
+        </template>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remark" :show-overflow-tooltip="true" />
+      <el-table-column
+        label="短信 API 的账号"
+        align="center"
+        prop="apiKey"
+        :show-overflow-tooltip="true"
       />
-      <!-- 按钮：关闭 -->
-      <XButton :loading="actionLoading" :title="t('dialog.close')" @click="dialogVisible = false" />
-    </template>
-  </XModal>
+      <el-table-column
+        label="短信 API 的密钥"
+        align="center"
+        prop="apiSecret"
+        :show-overflow-tooltip="true"
+      />
+      <el-table-column
+        label="短信发送回调 URL"
+        align="center"
+        prop="callbackUrl"
+        :show-overflow-tooltip="true"
+      />
+      <el-table-column
+        label="创建时间"
+        align="center"
+        prop="createTime"
+        width="180"
+        :formatter="dateFormatter"
+      />
+      <el-table-column label="操作" align="center">
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            @click="openModal('update', scope.row.id)"
+            v-hasPermi="['system:sms-channel:update']"
+          >
+            编辑
+          </el-button>
+          <el-button
+            link
+            type="danger"
+            @click="handleDelete(scope.row.id)"
+            v-hasPermi="['system:sms-channel:delete']"
+          >
+            删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </ContentWrap>
+  <!-- 表单弹窗：添加/修改 -->
+  <SmsChannelForm ref="modalRef" @success="getList" />
 </template>
 <script setup lang="ts" name="SmsChannel">
-import type { FormExpose } from '@/components/Form'
 // 业务相关的 import
 import * as SmsChannelApi from '@/api/system/sms/smsChannel'
-import { rules, allSchemas } from './sms.channel.data'
+//格式化时间
+import { dateFormatter } from '@/utils/formatTime'
+//字典
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
+//表单弹窗：添加/修改
+import SmsChannelForm from './form.vue'
+//下载
+// import download from '@/utils/download'
 
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
-// 列表相关的变量
-const [registerTable, { reload, deleteData }] = useXTable({
-  allSchemas: allSchemas,
-  getListApi: SmsChannelApi.getSmsChannelPageApi,
-  deleteApi: SmsChannelApi.deleteSmsChannelApi
+// 列表的加载中
+const loading = ref(true)
+//搜索的表单
+const queryFormRef = ref()
+// 列表的总页数
+const total = ref(0)
+// 列表的数据
+const list = ref([])
+//导出的加载中
+const exportLoading = ref(false)
+//查询参数
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  signature: undefined,
+  status: undefined,
+  createTime: []
 })
 
-// 弹窗相关的变量
-const dialogVisible = ref(false) // 是否显示弹出层
-const dialogTitle = ref('edit') // 弹出层标题
-const actionType = ref('') // 操作按钮的类型
-const actionLoading = ref(false) // 按钮 Loading
-const formRef = ref<FormExpose>() // 表单 Ref
-const detailData = ref() // 详情 Ref
-
-// 设置标题
-const setDialogTile = (type: string) => {
-  dialogTitle.value = t('action.' + type)
-  actionType.value = type
-  dialogVisible.value = true
+/** 查询参数列表 */
+const getList = async () => {
+  loading.value = true
+  // 执行查询
+  try {
+    const data = await SmsChannelApi.getSmsChannelPageApi(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
 }
 
-// 新增操作
-const handleCreate = () => {
-  setDialogTile('create')
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
 }
 
-// 修改操作
-const handleUpdate = async (rowId: number) => {
-  setDialogTile('update')
-  // 设置数据
-  const res = await SmsChannelApi.getSmsChannelApi(rowId)
-  unref(formRef)?.setValues(res)
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
 }
 
-// 详情操作
-const handleDetail = async (rowId: number) => {
-  setDialogTile('detail')
-  const res = await SmsChannelApi.getSmsChannelApi(rowId)
-  detailData.value = res
+/** 添加/修改操作 */
+const modalRef = ref()
+const openModal = (type: string, id?: number) => {
+  modalRef.value.openModal(type, id)
 }
 
-// 提交按钮
-const submitForm = async () => {
-  const elForm = unref(formRef)?.getElFormRef()
-  if (!elForm) return
-  elForm.validate(async (valid) => {
-    if (valid) {
-      actionLoading.value = true
-      // 提交请求
-      try {
-        const data = unref(formRef)?.formModel as SmsChannelApi.SmsChannelVO
-        if (actionType.value === 'create') {
-          await SmsChannelApi.createSmsChannelApi(data)
-          message.success(t('common.createSuccess'))
-        } else {
-          await SmsChannelApi.updateSmsChannelApi(data)
-          message.success(t('common.updateSuccess'))
-        }
-        dialogVisible.value = false
-      } finally {
-        actionLoading.value = false
-        // 刷新列表
-        await reload()
-      }
-    }
-  })
+/** 导出按钮操作 */
+const handleExport = async () => {
+  try {
+    // 导出的二次确认
+    await message.exportConfirm()
+    // 发起导出
+    exportLoading.value = true
+    await message.info('该功能目前不支持')
+    //导出功能先不考虑
+    // const data = await SmsChannelApi.exportSmsChanelApi(queryParams)
+    // download.excel(data, '短信渠道.xls')
+  } catch {
+  } finally {
+    exportLoading.value = false
+  }
 }
+
+/** 删除按钮操作 */
+const handleDelete = async (id: number) => {
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await SmsChannelApi.deleteSmsChannelApi(id)
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
+}
+
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
 </script>
diff --git a/src/views/system/sms/smsChannel/sms.channel.data.ts b/src/views/system/sms/smsChannel/sms.channel.data.ts
deleted file mode 100644
index d3a807edb..000000000
--- a/src/views/system/sms/smsChannel/sms.channel.data.ts
+++ /dev/null
@@ -1,63 +0,0 @@
-import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
-const { t } = useI18n() // 国际化
-
-// 表单校验
-export const rules = reactive({
-  signature: [required],
-  code: [required],
-  apiKey: [required],
-  status: [required]
-})
-
-// CrudSchema
-const crudSchemas = reactive<VxeCrudSchema>({
-  primaryKey: 'id',
-  primaryType: 'id',
-  primaryTitle: '渠道编号',
-  action: true,
-  columns: [
-    {
-      title: '短信签名',
-      field: 'signature',
-      isSearch: true
-    },
-    {
-      title: '渠道编码',
-      field: 'code',
-      dictType: DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE,
-      isSearch: true
-    },
-    {
-      title: t('common.status'),
-      field: 'status',
-      dictType: DICT_TYPE.COMMON_STATUS,
-      dictClass: 'number',
-      isSearch: true
-    },
-    {
-      title: '短信 API 的账号',
-      field: 'apiKey'
-    },
-    {
-      title: '短信 API 的密钥',
-      field: 'apiSecret'
-    },
-    {
-      title: '短信发送回调 URL',
-      field: 'callbackUrl'
-    },
-    {
-      title: t('common.createTime'),
-      field: 'createTime',
-      formatter: 'formatDate',
-      isForm: false,
-      search: {
-        show: true,
-        itemRender: {
-          name: 'XDataTimePicker'
-        }
-      }
-    }
-  ]
-})
-export const { allSchemas } = useVxeCrudSchemas(crudSchemas)

From a94172d7a5cccbd7f79e4f41102eaca2a37f7842 Mon Sep 17 00:00:00 2001
From: xiaobai <2511883673@qq.com>
Date: Wed, 15 Mar 2023 22:20:28 +0800
Subject: [PATCH 21/40] =?UTF-8?q?=E7=9F=AD=E4=BF=A1=E6=B8=A0=E9=81=93?=
 =?UTF-8?q?=E7=BF=BB=E5=86=99vue2->vue3=2020230315?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/sms/smsChannel/form.vue | 137 +++++++++++++++++++++++
 1 file changed, 137 insertions(+)
 create mode 100644 src/views/system/sms/smsChannel/form.vue

diff --git a/src/views/system/sms/smsChannel/form.vue b/src/views/system/sms/smsChannel/form.vue
new file mode 100644
index 000000000..7c20a90dd
--- /dev/null
+++ b/src/views/system/sms/smsChannel/form.vue
@@ -0,0 +1,137 @@
+<template>
+  <Dialog :title="modelTitle" v-model="modelVisible">
+    <el-form ref="formRef" :model="form" :rules="rules" label-width="130px" v-loading="formLoading">
+      <el-form-item label="短信签名" prop="signature">
+        <el-input v-model="form.signature" placeholder="请输入短信签名" />
+      </el-form-item>
+      <el-form-item label="渠道编码" prop="code">
+        <el-select v-model="form.code" placeholder="请选择渠道编码" clearable>
+          <el-option
+            v-for="dict in getDictOptions(DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="启用状态">
+        <el-radio-group v-model="form.status">
+          <el-radio
+            v-for="dict in getDictOptions(DICT_TYPE.COMMON_STATUS)"
+            :key="dict.value"
+            :label="parseInt(dict.value)"
+            >{{ dict.label }}</el-radio
+          >
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="备注" prop="remark">
+        <el-input v-model="form.remark" placeholder="请输入备注" />
+      </el-form-item>
+      <el-form-item label="短信 API 的账号" prop="apiKey">
+        <el-input v-model="form.apiKey" placeholder="请输入短信 API 的账号" />
+      </el-form-item>
+      <el-form-item label="短信 API 的密钥" prop="apiSecret">
+        <el-input v-model="form.apiSecret" placeholder="请输入短信 API 的密钥" />
+      </el-form-item>
+      <el-form-item label="短信发送回调 URL" prop="callbackUrl">
+        <el-input v-model="form.callbackUrl" placeholder="请输入短信发送回调 URL" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+        <el-button @click="modelVisible = false">取 消</el-button>
+      </div>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
+import * as SmsChannelApi from '@/api/system/sms/smsChannel'
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const modelTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const form = ref({
+  id: undefined,
+  signature: '',
+  code: '',
+  status: '',
+  remark: '',
+  apiKey: '',
+  apiSecret: '',
+  callbackUrl: ''
+})
+const rules = reactive({
+  signature: [{ required: true, message: '短信签名不能为空', trigger: 'blur' }],
+  code: [{ required: true, message: '渠道编码不能为空', trigger: 'blur' }],
+  status: [{ required: true, message: '启用状态不能为空', trigger: 'blur' }],
+  apiKey: [{ required: true, message: '短信 API 的账号不能为空', trigger: 'blur' }]
+})
+const formRef = ref() // 表单 Ref
+
+/** 打开弹窗 */
+const openModal = async (type: string, id?: number) => {
+  modelVisible.value = true
+  modelTitle.value = t('action.' + type)
+  formType.value = type
+  resetForm()
+  // 修改时，设置数据
+  if (id) {
+    formLoading.value = true
+    try {
+      form.value = await SmsChannelApi.getSmsChannelApi(id)
+      console.log(form)
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = unref(formRef)?.formModel as SmsChannelApi.SmsChannelVO
+    if (formType.value === 'create') {
+      await SmsChannelApi.createSmsChannelApi(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await SmsChannelApi.updateSmsChannelApi(data)
+      message.success(t('common.updateSuccess'))
+    }
+    modelVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  form.value = {
+    id: undefined,
+    signature: '',
+    code: '',
+    status: '',
+    remark: '',
+    apiKey: '',
+    apiSecret: '',
+    callbackUrl: ''
+  }
+  formRef.value?.resetFields()
+}
+</script>

From f1a80fe558ea459f37af552487e4c8cb40488e30 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Fri, 17 Mar 2023 00:02:45 +0800
Subject: [PATCH 22/40] =?UTF-8?q?vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E9=82=AE=E4=BB=B6=E8=B4=A6=E5=8F=B7=E7=9A=84=E5=88=97=E8=A1=A8?=
 =?UTF-8?q?=20+=20=E6=90=9C=E7=B4=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/mail/account/account.data.ts | 102 +++++------
 src/views/system/mail/account/index.vue       | 167 +++---------------
 2 files changed, 77 insertions(+), 192 deletions(-)

diff --git a/src/views/system/mail/account/account.data.ts b/src/views/system/mail/account/account.data.ts
index bd05ce4fb..8555a7e38 100644
--- a/src/views/system/mail/account/account.data.ts
+++ b/src/views/system/mail/account/account.data.ts
@@ -1,10 +1,12 @@
-import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
+import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
+import { DictTag } from '@/components/DictTag'
+import { TableColumn } from '@/types/table'
+import { dateFormatter } from '@/utils/formatTime'
 
 const { t } = useI18n() // 国际化
 
 // 表单校验
 export const rules = reactive({
-  // mail: [required],
   mail: [
     { required: true, message: t('profile.rules.mail'), trigger: 'blur' },
     {
@@ -21,55 +23,49 @@ export const rules = reactive({
 })
 
 // CrudSchema
-const crudSchemas = reactive<VxeCrudSchema>({
-  primaryKey: 'id', // 默认的主键 ID
-  primaryTitle: '编号',
-  primaryType: 'id',
-  action: true,
-  actionWidth: '200', // 3 个按钮默认 200，如有删减对应增减即可
-  columns: [
-    {
-      title: '邮箱',
-      field: 'mail',
-      isSearch: true
-    },
-    {
-      title: '用户名',
-      field: 'username',
-      isSearch: true
-    },
-    {
-      title: '密码',
-      field: 'password',
-      isTable: false
-    },
-    {
-      title: 'SMTP 服务器域名',
-      field: 'host'
-    },
-    {
-      title: 'SMTP 服务器端口',
-      field: 'port',
-      form: {
-        component: 'InputNumber',
-        value: 465
-      }
-    },
-    {
-      title: '是否开启 SSL',
-      field: 'sslEnable',
-      dictType: DICT_TYPE.INFRA_BOOLEAN_STRING,
-      dictClass: 'boolean'
-    },
-    {
-      title: '创建时间',
-      field: 'createTime',
-      isForm: false,
-      formatter: 'formatDate',
-      table: {
-        width: 180
-      }
+const crudSchemas = reactive<CrudSchema[]>([
+  {
+    label: '邮箱',
+    field: 'mail',
+    isSearch: true
+  },
+  {
+    label: '用户名',
+    field: 'username',
+    isSearch: true
+  },
+  {
+    label: '密码',
+    field: 'password',
+    isTable: false
+  },
+  {
+    label: 'SMTP 服务器域名',
+    field: 'host'
+  },
+  {
+    label: 'SMTP 服务器端口',
+    field: 'port',
+    form: {
+      component: 'InputNumber',
+      value: 465
     }
-  ]
-})
-export const { allSchemas } = useVxeCrudSchemas(crudSchemas)
+  },
+  {
+    label: '是否开启 SSL',
+    field: 'sslEnable',
+    formatter: (_: Recordable, __: TableColumn, cellValue: boolean) => {
+      return h(DictTag, {
+        type: DICT_TYPE.INFRA_BOOLEAN_STRING,
+        value: cellValue
+      })
+    }
+  },
+  {
+    label: '创建时间',
+    field: 'createTime',
+    isForm: false,
+    formatter: dateFormatter
+  }
+])
+export const { allSchemas } = useCrudSchemas(crudSchemas)
diff --git a/src/views/system/mail/account/index.vue b/src/views/system/mail/account/index.vue
index 7c4ad0f9d..821c7c736 100644
--- a/src/views/system/mail/account/index.vue
+++ b/src/views/system/mail/account/index.vue
@@ -1,151 +1,40 @@
 <template>
   <ContentWrap>
-    <!-- 列表 -->
-    <XTable @register="registerTable">
-      <template #toolbar_buttons>
-        <!-- 操作：新增 -->
-        <XButton
-          type="primary"
-          preIcon="ep:zoom-in"
-          :title="t('action.add')"
-          v-hasPermi="['system:mail-account:create']"
-          @click="handleCreate()"
-        />
-      </template>
-      <template #actionbtns_default="{ row }">
-        <!-- 操作：修改 -->
-        <XTextButton
-          preIcon="ep:edit"
-          :title="t('action.edit')"
-          v-hasPermi="['system:mail-account:update']"
-          @click="handleUpdate(row.id)"
-        />
-        <!-- 操作：详情 -->
-        <XTextButton
-          preIcon="ep:view"
-          :title="t('action.detail')"
-          v-hasPermi="['system:mail-account:query']"
-          @click="handleDetail(row.id)"
-        />
-        <!-- 操作：删除 -->
-        <XTextButton
-          preIcon="ep:delete"
-          :title="t('action.del')"
-          v-hasPermi="['system:mail-account:delete']"
-          @click="deleteData(row.id)"
-        />
-      </template>
-    </XTable>
+    <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
+  </ContentWrap>
+
+  <ContentWrap>
+    <Table
+      v-model:pageSize="tableObject.pageSize"
+      v-model:currentPage="tableObject.currentPage"
+      :columns="allSchemas.tableColumns"
+      :data="tableObject.tableList"
+      :loading="tableObject.loading"
+      :pagination="{
+        total: tableObject.total
+      }"
+      @register="register"
+    >
+      <template #action="{ row }">
+        <ElButton type="danger" @click="delData(row, false)">
+          {{ t('exampleDemo.del') }}
+        </ElButton>
+      </template>
+    </Table>
   </ContentWrap>
-  <!-- 弹窗 -->
-  <XModal id="mailAccountModel" :loading="modelLoading" v-model="modelVisible" :title="modelTitle">
-    <!-- 表单：添加/修改 -->
-    <Form
-      ref="formRef"
-      v-if="['create', 'update'].includes(actionType)"
-      :schema="allSchemas.formSchema"
-      :rules="rules"
-    />
-    <!-- 表单：详情 -->
-    <Descriptions
-      v-if="actionType === 'detail'"
-      :schema="allSchemas.detailSchema"
-      :data="detailData"
-    />
-    <template #footer>
-      <!-- 按钮：保存 -->
-      <XButton
-        v-if="['create', 'update'].includes(actionType)"
-        type="primary"
-        :title="t('action.save')"
-        :loading="actionLoading"
-        @click="submitForm()"
-      />
-      <!-- 按钮：关闭 -->
-      <XButton :loading="actionLoading" :title="t('dialog.close')" @click="modelVisible = false" />
-    </template>
-  </XModal>
 </template>
 <script setup lang="ts" name="MailAccount">
-import { FormExpose } from '@/components/Form'
-// 业务相关的 import
-import { rules, allSchemas } from './account.data'
+import { allSchemas } from './account.data'
+import { useTable } from '@/hooks/web/useTable'
+import { Table } from '@/components/Table'
 import * as MailAccountApi from '@/api/system/mail/account'
 
-const { t } = useI18n() // 国际化
-const message = useMessage() // 消息弹窗
-
-// 列表相关的变量
-const [registerTable, { reload, deleteData }] = useXTable({
-  allSchemas: allSchemas,
+const { register, tableObject, methods } = useTable<MailAccountApi.MailAccountVO>({
   getListApi: MailAccountApi.getMailAccountPageApi,
-  deleteApi: MailAccountApi.deleteMailAccountApi
+  delListApi: MailAccountApi.deleteMailAccountApi
 })
 
-// 弹窗相关的变量
-const modelVisible = ref(false) // 是否显示弹出层
-const modelTitle = ref('edit') // 弹出层标题
-const modelLoading = ref(false) // 弹出层loading
-const actionType = ref('') // 操作按钮的类型
-const actionLoading = ref(false) // 按钮 Loading
-const formRef = ref<FormExpose>() // 表单 Ref
-const detailData = ref() // 详情 Ref
+const { getList, setSearchParams } = methods
 
-// 设置标题
-const setDialogTile = (type: string) => {
-  modelLoading.value = true
-  modelTitle.value = t('action.' + type)
-  actionType.value = type
-  modelVisible.value = true
-}
-
-// 新增操作
-const handleCreate = () => {
-  setDialogTile('create')
-  modelLoading.value = false
-}
-
-// 修改操作
-const handleUpdate = async (rowId: number) => {
-  setDialogTile('update')
-  // 设置数据
-  const res = await MailAccountApi.getMailAccountApi(rowId)
-  unref(formRef)?.setValues(res)
-  modelLoading.value = false
-}
-
-// 详情操作
-const handleDetail = async (rowId: number) => {
-  setDialogTile('detail')
-  const res = await MailAccountApi.getMailAccountApi(rowId)
-  detailData.value = res
-  modelLoading.value = false
-}
-
-// 提交按钮
-const submitForm = async () => {
-  const elForm = unref(formRef)?.getElFormRef()
-  if (!elForm) return
-  elForm.validate(async (valid) => {
-    if (valid) {
-      actionLoading.value = true
-      // 提交请求
-      try {
-        const data = unref(formRef)?.formModel as MailAccountApi.MailAccountVO
-        if (actionType.value === 'create') {
-          await MailAccountApi.createMailAccountApi(data)
-          message.success(t('common.createSuccess'))
-        } else {
-          await MailAccountApi.updateMailAccountApi(data)
-          message.success(t('common.updateSuccess'))
-        }
-        modelVisible.value = false
-      } finally {
-        actionLoading.value = false
-        // 刷新列表
-        await reload()
-      }
-    }
-  })
-}
+getList()
 </script>

From 262874a117b05d0057950b493eb72b91ac12e71b Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Fri, 17 Mar 2023 01:35:38 +0800
Subject: [PATCH 23/40] =?UTF-8?q?vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E9=82=AE=E4=BB=B6=E8=B4=A6=E5=8F=B7=E7=9A=84=E6=96=B0=E5=A2=9E?=
 =?UTF-8?q?=20+=20=E4=BF=AE=E6=94=B9=20+=20=E5=88=A0=E9=99=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/mail/account/index.ts          |  7 +-
 src/views/system/mail/account/account.data.ts | 15 ++++
 src/views/system/mail/account/form.vue        | 68 +++++++++++++++++++
 src/views/system/mail/account/index.vue       | 44 ++++++++++--
 4 files changed, 124 insertions(+), 10 deletions(-)
 create mode 100644 src/views/system/mail/account/form.vue

diff --git a/src/api/system/mail/account/index.ts b/src/api/system/mail/account/index.ts
index 8b662a701..7f3b53827 100644
--- a/src/api/system/mail/account/index.ts
+++ b/src/api/system/mail/account/index.ts
@@ -10,13 +10,8 @@ export interface MailAccountVO {
   sslEnable: boolean
 }
 
-export interface MailAccountPageReqVO extends PageParam {
-  mail?: string
-  username?: string
-}
-
 // 查询邮箱账号列表
-export const getMailAccountPageApi = async (params: MailAccountPageReqVO) => {
+export const getMailAccountPageApi = async (params: PageParam) => {
   return await request.get({ url: '/system/mail-account/page', params })
 }
 
diff --git a/src/views/system/mail/account/account.data.ts b/src/views/system/mail/account/account.data.ts
index 8555a7e38..5d018cb9c 100644
--- a/src/views/system/mail/account/account.data.ts
+++ b/src/views/system/mail/account/account.data.ts
@@ -2,6 +2,7 @@ import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
 import { DictTag } from '@/components/DictTag'
 import { TableColumn } from '@/types/table'
 import { dateFormatter } from '@/utils/formatTime'
+import { getBoolDictOptions } from '@/utils/dict'
 
 const { t } = useI18n() // 国际化
 
@@ -59,6 +60,12 @@ const crudSchemas = reactive<CrudSchema[]>([
         type: DICT_TYPE.INFRA_BOOLEAN_STRING,
         value: cellValue
       })
+    },
+    form: {
+      component: 'Radio',
+      componentProps: {
+        options: getBoolDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING)
+      }
     }
   },
   {
@@ -66,6 +73,14 @@ const crudSchemas = reactive<CrudSchema[]>([
     field: 'createTime',
     isForm: false,
     formatter: dateFormatter
+  },
+  {
+    label: '操作',
+    field: 'action',
+    width: '260px',
+    form: {
+      show: false
+    }
   }
 ])
 export const { allSchemas } = useCrudSchemas(crudSchemas)
diff --git a/src/views/system/mail/account/form.vue b/src/views/system/mail/account/form.vue
new file mode 100644
index 000000000..ba6a31d8e
--- /dev/null
+++ b/src/views/system/mail/account/form.vue
@@ -0,0 +1,68 @@
+<template>
+  <Dialog :title="modelTitle" v-model="modelVisible">
+    <!-- TODO 芋艿：loading -->
+    <Form ref="formRef" :schema="allSchemas.formSchema" :rules="rules" :isCol="false" />
+    <template #footer>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+      <el-button @click="modelVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import * as MailAccountApi from '@/api/system/mail/account'
+import { rules, allSchemas } from './account.data'
+
+const formRef = ref() // 表单 Ref
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const modelTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
+
+/** 打开弹窗 */
+const openModal = async (type: string, id?: number) => {
+  modelVisible.value = true
+  modelTitle.value = t('action.' + type)
+  formType.value = type
+  // resetForm()
+  // 修改时，设置数据
+  if (id) {
+    formLoading.value = true
+    try {
+      const data = await MailAccountApi.getMailAccountApi(id)
+      formRef.value.setValues(data)
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.getElFormRef().validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = formRef.value.formModel as MailAccountApi.MailAccountVO
+    if (formType.value === 'create') {
+      await MailAccountApi.createMailAccountApi(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await MailAccountApi.updateMailAccountApi(data)
+      message.success(t('common.updateSuccess'))
+    }
+    modelVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+</script>
diff --git a/src/views/system/mail/account/index.vue b/src/views/system/mail/account/index.vue
index 821c7c736..8bc29f6d7 100644
--- a/src/views/system/mail/account/index.vue
+++ b/src/views/system/mail/account/index.vue
@@ -1,8 +1,17 @@
 <template>
   <ContentWrap>
+    <!-- TODO @芋艿：setSearchParams -->
     <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
   </ContentWrap>
 
+  <el-button
+    type="primary"
+    @click="openModal('create')"
+    v-hasPermi="['system:mail-account:create']"
+  >
+    <Icon icon="ep:plus" class="mr-5px" /> 新增
+  </el-button>
+
   <ContentWrap>
     <Table
       v-model:pageSize="tableObject.pageSize"
@@ -16,18 +25,37 @@
       @register="register"
     >
       <template #action="{ row }">
-        <ElButton type="danger" @click="delData(row, false)">
-          {{ t('exampleDemo.del') }}
-        </ElButton>
+        <el-button
+          link
+          type="primary"
+          @click="openModal('update', row.id)"
+          v-hasPermi="['system:mail-account:update']"
+        >
+          编辑
+        </el-button>
+        <el-button
+          link
+          type="danger"
+          v-hasPermi="['system:mail-account:delete']"
+          @click="delList(row.id, false)"
+        >
+          删除
+        </el-button>
       </template>
     </Table>
   </ContentWrap>
+
+  <!-- 表单弹窗：添加/修改 -->
+  <mail-account-form ref="modalRef" @success="getList" />
 </template>
 <script setup lang="ts" name="MailAccount">
 import { allSchemas } from './account.data'
 import { useTable } from '@/hooks/web/useTable'
-import { Table } from '@/components/Table'
 import * as MailAccountApi from '@/api/system/mail/account'
+import MailAccountForm from './form.vue'
+
+// const { t } = useI18n() // 国际化
+// const message = useMessage() // 消息弹窗
 
 const { register, tableObject, methods } = useTable<MailAccountApi.MailAccountVO>({
   getListApi: MailAccountApi.getMailAccountPageApi,
@@ -36,5 +64,13 @@ const { register, tableObject, methods } = useTable<MailAccountApi.MailAccountVO
 
 const { getList, setSearchParams } = methods
 
+const { delList } = methods
+
+/** 添加/修改操作 */
+const modalRef = ref()
+const openModal = (type: string, id?: number) => {
+  modalRef.value.openModal(type, id)
+}
+
 getList()
 </script>

From 714dd661c40e0aafb91f51223695d646affe29af Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Fri, 17 Mar 2023 21:48:00 +0800
Subject: [PATCH 24/40] =?UTF-8?q?Search=20=E7=BB=84=E4=BB=B6=EF=BC=9A1?=
 =?UTF-8?q?=EF=BC=89=E4=BF=AE=E6=94=B9=20search=20=E6=8C=89=E9=92=AE?=
 =?UTF-8?q?=E7=9A=84=E6=A0=B7=E5=BC=8F=EF=BC=9B2=EF=BC=89=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0=20search=20=E6=8C=89=E9=92=AE=E5=90=8E=E7=9A=84=20act?=
 =?UTF-8?q?ionMore=20slot=EF=BC=9B3=EF=BC=89=E4=BF=AE=E6=94=B9=20Form=20?=
 =?UTF-8?q?=E5=90=91=E4=B8=8B=E5=87=8F=E5=B0=91=2015px=20=E9=97=B4?=
 =?UTF-8?q?=E8=B7=9D=EF=BC=8C=E6=9B=B4=E7=B4=A7=E5=87=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Search/src/Search.vue | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/components/Search/src/Search.vue b/src/components/Search/src/Search.vue
index 80f2b37cf..cb3d5dea1 100644
--- a/src/components/Search/src/Search.vue
+++ b/src/components/Search/src/Search.vue
@@ -98,6 +98,7 @@ const setVisible = () => {
 </script>
 
 <template>
+  <!-- update by 芋艿：class="-mb-15px" 用于降低和 ContentWrap 组件的底部距离，避免空隙过大 -->
   <Form
     :is-custom="false"
     :label-width="labelWidth"
@@ -106,21 +107,26 @@ const setVisible = () => {
     :is-col="isCol"
     :schema="newSchema"
     @register="register"
+    class="-mb-15px"
   >
     <template #action>
       <div v-if="layout === 'inline'">
-        <ElButton v-if="showSearch" type="primary" @click="search">
+        <!-- update by 芋艿：去除搜索的 type="primary"，颜色变淡一点 -->
+        <ElButton v-if="showSearch" @click="search">
           <Icon icon="ep:search" class="mr-5px" />
           {{ t('common.query') }}
         </ElButton>
+        <!-- update by 芋艿：将 icon="ep:refresh-right" 修改成 icon="ep:refresh"，和 ruoyi-vue 搜索保持一致  -->
         <ElButton v-if="showReset" @click="reset">
-          <Icon icon="ep:refresh-right" class="mr-5px" />
+          <Icon icon="ep:refresh" class="mr-5px" />
           {{ t('common.reset') }}
         </ElButton>
         <ElButton v-if="expand" text @click="setVisible">
           {{ t(visible ? 'common.shrink' : 'common.expand') }}
           <Icon :icon="visible ? 'ep:arrow-up' : 'ep:arrow-down'" />
         </ElButton>
+        <!-- add by 芋艿：补充在搜索后的按钮 -->
+        <slot name="actionMore"></slot>
       </div>
     </template>
     <template #[name] v-for="name in Object.keys($slots)" :key="name"
@@ -142,6 +148,8 @@ const setVisible = () => {
         {{ t(visible ? 'common.shrink' : 'common.expand') }}
         <Icon :icon="visible ? 'ep:arrow-up' : 'ep:arrow-down'" />
       </ElButton>
+      <!-- add by 芋艿：补充在搜索后的按钮 -->
+      <slot name="actionMore"></slot>
     </div>
   </template>
 </template>

From 96e0ce98663eb69e854d1c1d2895a5ac34701521 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Fri, 17 Mar 2023 22:32:25 +0800
Subject: [PATCH 25/40] =?UTF-8?q?Table=20=E7=BB=84=E4=BB=B6=EF=BC=9A1?=
 =?UTF-8?q?=EF=BC=89=E5=A2=9E=E5=8A=A0=20tableMethods=20=E5=B1=9E=E6=80=A7?=
 =?UTF-8?q?=EF=BC=8C=E6=8F=90=E5=8D=87=E4=BB=A3=E7=A0=81=E7=9A=84=E5=8F=AF?=
 =?UTF-8?q?=E9=98=85=E8=AF=BB=E6=80=A7=EF=BC=9B2=EF=BC=89Table=20=E5=92=8C?=
 =?UTF-8?q?=20Pagination=20=E7=BB=84=E4=BB=B6=E7=9A=84=E9=80=BB=E8=BE=91?=
 =?UTF-8?q?=E7=BB=9F=E4=B8=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Pagination/index.vue | 2 +-
 src/components/Table/src/Table.vue  | 6 ++++--
 src/hooks/web/useTable.ts           | 4 +++-
 3 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/components/Pagination/index.vue b/src/components/Pagination/index.vue
index 9fc350686..788809a5b 100644
--- a/src/components/Pagination/index.vue
+++ b/src/components/Pagination/index.vue
@@ -5,7 +5,7 @@
     class="float-right mt-15px mb-15px"
     :background="true"
     layout="total, sizes, prev, pager, next, jumper"
-    :page-sizes="[10, 20, 30, 50]"
+    :page-sizes="[10, 20, 30, 50, 100]"
     v-model:current-page="currentPage"
     v-model:page-size="pageSize"
     :pager-count="pagerCount"
diff --git a/src/components/Table/src/Table.vue b/src/components/Table/src/Table.vue
index 66969c99f..8ca596845 100644
--- a/src/components/Table/src/Table.vue
+++ b/src/components/Table/src/Table.vue
@@ -104,11 +104,12 @@ export default defineComponent({
     })
 
     const pagination = computed(() => {
+      // update by 芋艿：保持和 Pagination 组件的逻辑一致
       return Object.assign(
         {
           small: false,
           background: true,
-          pagerCount: 5,
+          pagerCount: document.body.clientWidth < 992 ? 5 : 7,
           layout: 'total, sizes, prev, pager, next, jumper',
           pageSizes: [10, 20, 30, 50, 100],
           disabled: false,
@@ -283,10 +284,11 @@ export default defineComponent({
           }}
         </ElTable>
         {unref(getProps).pagination ? (
+          // update by 芋艿：保持和 Pagination 组件一致
           <ElPagination
             v-model:pageSize={pageSizeRef.value}
             v-model:currentPage={currentPageRef.value}
-            class="mt-10px"
+            class="float-right mt-15px mb-15px"
             {...unref(pagination)}
           ></ElPagination>
         ) : undefined}
diff --git a/src/hooks/web/useTable.ts b/src/hooks/web/useTable.ts
index 7a9b1afea..3f0d5055e 100644
--- a/src/hooks/web/useTable.ts
+++ b/src/hooks/web/useTable.ts
@@ -218,6 +218,8 @@ export const useTable = <T = any>(config?: UseTableConfig<T>) => {
     register,
     elTableRef,
     tableObject,
-    methods
+    methods,
+    // add by 芋艿：返回 tableMethods 属性，和 tableObject 更统一
+    tableMethods: methods
   }
 }

From 3f2a77f2d239f3e4d43818fe651f25cb0a5d55b7 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Fri, 17 Mar 2023 22:33:30 +0800
Subject: [PATCH 26/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E9=82=AE=E4=BB=B6=E8=B4=A6=E5=8F=B7=E7=9A=84=E9=87=8D=E6=9E=84?=
 =?UTF-8?q?=E9=83=A8=E5=88=86=E6=8F=90=E4=BA=A4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/mail/account/index.ts          | 12 ++--
 src/views/system/mail/account/account.data.ts |  1 -
 src/views/system/mail/account/form.vue        |  6 +-
 src/views/system/mail/account/index.vue       | 61 +++++++++++--------
 src/views/system/mail/log/index.vue           |  2 +-
 src/views/system/mail/template/index.vue      |  2 +-
 6 files changed, 46 insertions(+), 38 deletions(-)

diff --git a/src/api/system/mail/account/index.ts b/src/api/system/mail/account/index.ts
index 7f3b53827..9e10c92a1 100644
--- a/src/api/system/mail/account/index.ts
+++ b/src/api/system/mail/account/index.ts
@@ -11,31 +11,31 @@ export interface MailAccountVO {
 }
 
 // 查询邮箱账号列表
-export const getMailAccountPageApi = async (params: PageParam) => {
+export const getMailAccountPage = async (params: PageParam) => {
   return await request.get({ url: '/system/mail-account/page', params })
 }
 
 // 查询邮箱账号详情
-export const getMailAccountApi = async (id: number) => {
+export const getMailAccount = async (id: number) => {
   return await request.get({ url: '/system/mail-account/get?id=' + id })
 }
 
 // 新增邮箱账号
-export const createMailAccountApi = async (data: MailAccountVO) => {
+export const createMailAccount = async (data: MailAccountVO) => {
   return await request.post({ url: '/system/mail-account/create', data })
 }
 
 // 修改邮箱账号
-export const updateMailAccountApi = async (data: MailAccountVO) => {
+export const updateMailAccount = async (data: MailAccountVO) => {
   return await request.put({ url: '/system/mail-account/update', data })
 }
 
 // 删除邮箱账号
-export const deleteMailAccountApi = async (id: number) => {
+export const deleteMailAccount = async (id: number) => {
   return await request.delete({ url: '/system/mail-account/delete?id=' + id })
 }
 
 // 获得邮箱账号精简列表
-export const getSimpleMailAccounts = async () => {
+export const getSimpleMailAccountList = async () => {
   return request.get({ url: '/system/mail-account/list-all-simple' })
 }
diff --git a/src/views/system/mail/account/account.data.ts b/src/views/system/mail/account/account.data.ts
index 5d018cb9c..24017dc04 100644
--- a/src/views/system/mail/account/account.data.ts
+++ b/src/views/system/mail/account/account.data.ts
@@ -77,7 +77,6 @@ const crudSchemas = reactive<CrudSchema[]>([
   {
     label: '操作',
     field: 'action',
-    width: '260px',
     form: {
       show: false
     }
diff --git a/src/views/system/mail/account/form.vue b/src/views/system/mail/account/form.vue
index ba6a31d8e..6160dd98a 100644
--- a/src/views/system/mail/account/form.vue
+++ b/src/views/system/mail/account/form.vue
@@ -31,7 +31,7 @@ const openModal = async (type: string, id?: number) => {
   if (id) {
     formLoading.value = true
     try {
-      const data = await MailAccountApi.getMailAccountApi(id)
+      const data = await MailAccountApi.getMailAccount(id)
       formRef.value.setValues(data)
     } finally {
       formLoading.value = false
@@ -52,10 +52,10 @@ const submitForm = async () => {
   try {
     const data = formRef.value.formModel as MailAccountApi.MailAccountVO
     if (formType.value === 'create') {
-      await MailAccountApi.createMailAccountApi(data)
+      await MailAccountApi.createMailAccount(data)
       message.success(t('common.createSuccess'))
     } else {
-      await MailAccountApi.updateMailAccountApi(data)
+      await MailAccountApi.updateMailAccount(data)
       message.success(t('common.updateSuccess'))
     }
     modelVisible.value = false
diff --git a/src/views/system/mail/account/index.vue b/src/views/system/mail/account/index.vue
index 8bc29f6d7..ec88d60b8 100644
--- a/src/views/system/mail/account/index.vue
+++ b/src/views/system/mail/account/index.vue
@@ -1,28 +1,31 @@
 <template>
+  <!-- 搜索工作栏 -->
   <ContentWrap>
-    <!-- TODO @芋艿：setSearchParams -->
-    <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
+    <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams">
+      <!-- 新增等操作按钮 -->
+      <template #actionMore>
+        <el-button
+          type="primary"
+          @click="openModal('create')"
+          v-hasPermi="['system:mail-account:create']"
+        >
+          <Icon icon="ep:plus" class="mr-5px" /> 新增
+        </el-button>
+      </template>
+    </Search>
   </ContentWrap>
 
-  <el-button
-    type="primary"
-    @click="openModal('create')"
-    v-hasPermi="['system:mail-account:create']"
-  >
-    <Icon icon="ep:plus" class="mr-5px" /> 新增
-  </el-button>
-
+  <!-- 列表 -->
   <ContentWrap>
     <Table
-      v-model:pageSize="tableObject.pageSize"
-      v-model:currentPage="tableObject.currentPage"
       :columns="allSchemas.tableColumns"
       :data="tableObject.tableList"
       :loading="tableObject.loading"
       :pagination="{
         total: tableObject.total
       }"
-      @register="register"
+      v-model:pageSize="tableObject.pageSize"
+      v-model:currentPage="tableObject.currentPage"
     >
       <template #action="{ row }">
         <el-button
@@ -37,7 +40,7 @@
           link
           type="danger"
           v-hasPermi="['system:mail-account:delete']"
-          @click="delList(row.id, false)"
+          @click="handleDelete(row.id)"
         >
           删除
         </el-button>
@@ -46,7 +49,7 @@
   </ContentWrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <mail-account-form ref="modalRef" @success="getList" />
+  <MailAccountForm ref="modalRef" @success="getList" />
 </template>
 <script setup lang="ts" name="MailAccount">
 import { allSchemas } from './account.data'
@@ -54,17 +57,15 @@ import { useTable } from '@/hooks/web/useTable'
 import * as MailAccountApi from '@/api/system/mail/account'
 import MailAccountForm from './form.vue'
 
-// const { t } = useI18n() // 国际化
-// const message = useMessage() // 消息弹窗
-
-const { register, tableObject, methods } = useTable<MailAccountApi.MailAccountVO>({
-  getListApi: MailAccountApi.getMailAccountPageApi,
-  delListApi: MailAccountApi.deleteMailAccountApi
+// https://kailong110120130.gitee.io/vue-element-plus-admin-doc/components/table.html#usetable
+// tableObject：表格的属性对象，可获得分页大小、条数等属性
+// tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
+const { tableObject, tableMethods } = useTable({
+  getListApi: MailAccountApi.getMailAccountPage, // 分页接口
+  delListApi: MailAccountApi.deleteMailAccount // 删除接口
 })
-
-const { getList, setSearchParams } = methods
-
-const { delList } = methods
+// 获得表格的各种操作
+const { getList, setSearchParams } = tableMethods
 
 /** 添加/修改操作 */
 const modalRef = ref()
@@ -72,5 +73,13 @@ const openModal = (type: string, id?: number) => {
   modalRef.value.openModal(type, id)
 }
 
-getList()
+/** 删除按钮操作 */
+const handleDelete = (id: number) => {
+  tableMethods.delList(id, false)
+}
+
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
 </script>
diff --git a/src/views/system/mail/log/index.vue b/src/views/system/mail/log/index.vue
index e147c52ca..bbc0ba005 100644
--- a/src/views/system/mail/log/index.vue
+++ b/src/views/system/mail/log/index.vue
@@ -91,7 +91,7 @@ const handleDetail = async (rowId: number) => {
 
 // ========== 初始化 ==========
 onMounted(() => {
-  MailAccountApi.getSimpleMailAccounts().then((data) => {
+  MailAccountApi.getSimpleMailAccountList().then((data) => {
     accountOptions.value = data
   })
 })
diff --git a/src/views/system/mail/template/index.vue b/src/views/system/mail/template/index.vue
index cb4a7e5d8..fab6dc676 100644
--- a/src/views/system/mail/template/index.vue
+++ b/src/views/system/mail/template/index.vue
@@ -266,7 +266,7 @@ const sendTest = async () => {
 
 // ========== 初始化 ==========
 onMounted(() => {
-  MailAccountApi.getSimpleMailAccounts().then((data) => {
+  MailAccountApi.getSimpleMailAccountList().then((data) => {
     accountOptions.value = data
   })
 })

From 4aeee485826303b406e6a48a05944166c0b5492b Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Fri, 17 Mar 2023 22:58:49 +0800
Subject: [PATCH 27/40] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=20useCrudSchemas?=
 =?UTF-8?q?=E3=80=81useTable=20=E7=9A=84=20autoimport=20=E5=AE=9E=E7=8E=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 build/vite/index.ts                           | 5 ++++-
 src/types/auto-imports.d.ts                   | 2 ++
 src/views/system/mail/account/account.data.ts | 2 +-
 src/views/system/mail/account/index.vue       | 3 +--
 4 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/build/vite/index.ts b/build/vite/index.ts
index 304ce0d5b..53f66ec04 100644
--- a/build/vite/index.ts
+++ b/build/vite/index.ts
@@ -39,11 +39,14 @@ export function createVitePlugins(VITE_APP_TITLE: string) {
       imports: [
         'vue',
         'vue-router',
+        // 可额外添加需要 autoImport 的组件
         {
           '@/hooks/web/useI18n': ['useI18n'],
-          '@/hooks/web/useXTable': ['useXTable'],
           '@/hooks/web/useMessage': ['useMessage'],
+          '@/hooks/web/useXTable': ['useXTable'],
           '@/hooks/web/useVxeCrudSchemas': ['useVxeCrudSchemas'],
+          '@/hooks/web/useTable': ['useTable'],
+          '@/hooks/web/useCrudSchemas': ['useCrudSchemas'],
           '@/utils/formRules': ['required'],
           '@/utils/dict': ['DICT_TYPE']
         }
diff --git a/src/types/auto-imports.d.ts b/src/types/auto-imports.d.ts
index 7c9f5ff1a..75cf16d9a 100644
--- a/src/types/auto-imports.d.ts
+++ b/src/types/auto-imports.d.ts
@@ -52,6 +52,7 @@ declare global {
   const triggerRef: typeof import('vue')['triggerRef']
   const unref: typeof import('vue')['unref']
   const useAttrs: typeof import('vue')['useAttrs']
+  const useCrudSchemas: typeof import('@/hooks/web/useCrudSchemas')['useCrudSchemas']
   const useCssModule: typeof import('vue')['useCssModule']
   const useCssVars: typeof import('vue')['useCssVars']
   const useI18n: typeof import('@/hooks/web/useI18n')['useI18n']
@@ -60,6 +61,7 @@ declare global {
   const useRoute: typeof import('vue-router')['useRoute']
   const useRouter: typeof import('vue-router')['useRouter']
   const useSlots: typeof import('vue')['useSlots']
+  const useTable: typeof import('@/hooks/web/useTable')['useTable']
   const useVxeCrudSchemas: typeof import('@/hooks/web/useVxeCrudSchemas')['useVxeCrudSchemas']
   const useXTable: typeof import('@/hooks/web/useXTable')['useXTable']
   const watch: typeof import('vue')['watch']
diff --git a/src/views/system/mail/account/account.data.ts b/src/views/system/mail/account/account.data.ts
index 24017dc04..31856296e 100644
--- a/src/views/system/mail/account/account.data.ts
+++ b/src/views/system/mail/account/account.data.ts
@@ -1,4 +1,4 @@
-import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas'
+import type { CrudSchema } from '@/hooks/web/useCrudSchemas'
 import { DictTag } from '@/components/DictTag'
 import { TableColumn } from '@/types/table'
 import { dateFormatter } from '@/utils/formatTime'
diff --git a/src/views/system/mail/account/index.vue b/src/views/system/mail/account/index.vue
index ec88d60b8..bb1a0a2a0 100644
--- a/src/views/system/mail/account/index.vue
+++ b/src/views/system/mail/account/index.vue
@@ -53,13 +53,12 @@
 </template>
 <script setup lang="ts" name="MailAccount">
 import { allSchemas } from './account.data'
-import { useTable } from '@/hooks/web/useTable'
 import * as MailAccountApi from '@/api/system/mail/account'
 import MailAccountForm from './form.vue'
 
-// https://kailong110120130.gitee.io/vue-element-plus-admin-doc/components/table.html#usetable
 // tableObject：表格的属性对象，可获得分页大小、条数等属性
 // tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
+// 详细可见：https://kailong110120130.gitee.io/vue-element-plus-admin-doc/components/table.html#usetable
 const { tableObject, tableMethods } = useTable({
   getListApi: MailAccountApi.getMailAccountPage, // 分页接口
   delListApi: MailAccountApi.deleteMailAccount // 删除接口

From a784bc7db27515d053aca451c104d220e4742657 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Fri, 17 Mar 2023 23:23:24 +0800
Subject: [PATCH 28/40] =?UTF-8?q?Form=20=E7=BB=84=E4=BB=B6=EF=BC=9A?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=20vLoading=20=E5=8A=A0=E8=BD=BD=E4=B8=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Form/src/Form.vue | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/Form/src/Form.vue b/src/components/Form/src/Form.vue
index 5e5120c3d..c11216416 100644
--- a/src/components/Form/src/Form.vue
+++ b/src/components/Form/src/Form.vue
@@ -35,7 +35,8 @@ export default defineComponent({
       default: () => []
     },
     // 是否需要栅格布局
-    isCol: propTypes.bool.def(true),
+    // update by 芋艿：将 true 改成 false，因为项目更常用这种方式
+    isCol: propTypes.bool.def(false),
     // 表单数据对象
     model: {
       type: Object as PropType<Recordable>,
@@ -46,7 +47,9 @@ export default defineComponent({
     // 是否自定义内容
     isCustom: propTypes.bool.def(false),
     // 表单label宽度
-    labelWidth: propTypes.oneOfType([String, Number]).def('auto')
+    labelWidth: propTypes.oneOfType([String, Number]).def('auto'),
+    // 是否 loading 数据中 add by 芋艿
+    vLoading: propTypes.bool.def(false)
   },
   emits: ['register'],
   setup(props, { slots, expose, emit }) {
@@ -280,6 +283,7 @@ export default defineComponent({
         {...getFormBindValue()}
         model={props.isCustom ? props.model : formModel}
         class={prefixCls}
+        v-loading={props.vLoading}
       >
         {{
           // 如果需要自定义，就什么都不渲染，而是提供默认插槽

From e42a9aa60cebbc6462ed9e34230f61e3fee727aa Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Fri, 17 Mar 2023 23:24:21 +0800
Subject: [PATCH 29/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E5=9F=BA=E6=9C=AC=E5=AE=8C=E5=96=84=E5=AE=8C=20=E9=82=AE?=
 =?UTF-8?q?=E4=BB=B6=E8=B4=A6=E5=8F=B7=20=E7=9A=84=E9=87=8D=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/mail/account/account.data.ts |  2 +-
 src/views/system/mail/account/form.vue        |  5 ++---
 src/views/system/mail/account/index.vue       | 10 +++++-----
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/views/system/mail/account/account.data.ts b/src/views/system/mail/account/account.data.ts
index 31856296e..85a27d858 100644
--- a/src/views/system/mail/account/account.data.ts
+++ b/src/views/system/mail/account/account.data.ts
@@ -23,7 +23,7 @@ export const rules = reactive({
   sslEnable: [required]
 })
 
-// CrudSchema
+// CrudSchema：https://kailong110120130.gitee.io/vue-element-plus-admin-doc/hooks/useCrudSchemas.html
 const crudSchemas = reactive<CrudSchema[]>([
   {
     label: '邮箱',
diff --git a/src/views/system/mail/account/form.vue b/src/views/system/mail/account/form.vue
index 6160dd98a..706838306 100644
--- a/src/views/system/mail/account/form.vue
+++ b/src/views/system/mail/account/form.vue
@@ -1,7 +1,6 @@
 <template>
   <Dialog :title="modelTitle" v-model="modelVisible">
-    <!-- TODO 芋艿：loading -->
-    <Form ref="formRef" :schema="allSchemas.formSchema" :rules="rules" :isCol="false" />
+    <Form ref="formRef" :schema="allSchemas.formSchema" :rules="rules" v-loading="formLoading" />
     <template #footer>
       <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
       <el-button @click="modelVisible = false">取 消</el-button>
@@ -12,7 +11,6 @@
 import * as MailAccountApi from '@/api/system/mail/account'
 import { rules, allSchemas } from './account.data'
 
-const formRef = ref() // 表单 Ref
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
 
@@ -20,6 +18,7 @@ const modelVisible = ref(false) // 弹窗的是否展示
 const modelTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const formRef = ref() // 表单 Ref
 
 /** 打开弹窗 */
 const openModal = async (type: string, id?: number) => {
diff --git a/src/views/system/mail/account/index.vue b/src/views/system/mail/account/index.vue
index bb1a0a2a0..1f80684f7 100644
--- a/src/views/system/mail/account/index.vue
+++ b/src/views/system/mail/account/index.vue
@@ -1,6 +1,6 @@
 <template>
   <!-- 搜索工作栏 -->
-  <ContentWrap>
+  <content-wrap>
     <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams">
       <!-- 新增等操作按钮 -->
       <template #actionMore>
@@ -13,10 +13,10 @@
         </el-button>
       </template>
     </Search>
-  </ContentWrap>
+  </content-wrap>
 
   <!-- 列表 -->
-  <ContentWrap>
+  <content-wrap>
     <Table
       :columns="allSchemas.tableColumns"
       :data="tableObject.tableList"
@@ -46,10 +46,10 @@
         </el-button>
       </template>
     </Table>
-  </ContentWrap>
+  </content-wrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <MailAccountForm ref="modalRef" @success="getList" />
+  <mail-account-form ref="modalRef" @success="getList" />
 </template>
 <script setup lang="ts" name="MailAccount">
 import { allSchemas } from './account.data'

From 90cd829737b9ddbc0c6b23f76f83b8b0f8be9646 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 00:42:25 +0800
Subject: [PATCH 30/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E9=82=AE=E4=BB=B6=E6=A8=A1=E7=89=88=E7=9A=84=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/infra/dataSourceConfig/form.vue     |   3 +-
 src/views/system/mail/account/account.data.ts |   4 +-
 src/views/system/mail/template/index.vue      | 319 ++++--------------
 .../system/mail/template/template.data.ts     | 168 ++++-----
 4 files changed, 155 insertions(+), 339 deletions(-)

diff --git a/src/views/infra/dataSourceConfig/form.vue b/src/views/infra/dataSourceConfig/form.vue
index b050a1c8b..ea699b570 100644
--- a/src/views/infra/dataSourceConfig/form.vue
+++ b/src/views/infra/dataSourceConfig/form.vue
@@ -30,7 +30,6 @@
 </template>
 <script setup lang="ts">
 import * as DataSourceConfigApi from '@/api/infra/dataSourceConfig'
-import { DataSourceConfigVO } from '@/api/infra/dataSourceConfig'
 
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
@@ -39,7 +38,7 @@ const modelVisible = ref(false) // 弹窗的是否展示
 const modelTitle = ref('') // 弹窗的标题
 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
 const formType = ref('') // 表单的类型：create - 新增；update - 修改
-const formData = ref<DataSourceConfigVO>({
+const formData = ref<DataSourceConfigApi.DataSourceConfigVO>({
   id: undefined,
   name: '',
   url: '',
diff --git a/src/views/system/mail/account/account.data.ts b/src/views/system/mail/account/account.data.ts
index 85a27d858..532a6a08e 100644
--- a/src/views/system/mail/account/account.data.ts
+++ b/src/views/system/mail/account/account.data.ts
@@ -77,9 +77,7 @@ const crudSchemas = reactive<CrudSchema[]>([
   {
     label: '操作',
     field: 'action',
-    form: {
-      show: false
-    }
+    isForm: false
   }
 ])
 export const { allSchemas } = useCrudSchemas(crudSchemas)
diff --git a/src/views/system/mail/template/index.vue b/src/views/system/mail/template/index.vue
index fab6dc676..d9684e86b 100644
--- a/src/views/system/mail/template/index.vue
+++ b/src/views/system/mail/template/index.vue
@@ -1,273 +1,84 @@
 <template>
-  <ContentWrap>
-    <!-- 列表 -->
-    <XTable @register="registerTable">
-      <template #accountId_search>
-        <el-select v-model="queryParams.accountId">
-          <el-option :key="undefined" label="全部" :value="undefined" />
-          <el-option
-            v-for="item in accountOptions"
-            :key="item.id"
-            :label="item.mail"
-            :value="item.id"
-          />
-        </el-select>
-      </template>
-      <template #toolbar_buttons>
-        <!-- 操作：新增 -->
-        <XButton
+  <!-- 搜索工作栏 -->
+  <content-wrap>
+    <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams">
+      <!-- 新增等操作按钮 -->
+      <template #actionMore>
+        <el-button
           type="primary"
-          preIcon="ep:zoom-in"
-          :title="t('action.add')"
-          v-hasPermi="['system:mail-template:create']"
-          @click="handleCreate()"
-        />
+          @click="openModal('create')"
+          v-hasPermi="['system:mail-account:create']"
+        >
+          <Icon icon="ep:plus" class="mr-5px" /> 新增
+        </el-button>
       </template>
-      <template #accountId_default="{ row }">
-        <span>{{ accountOptions.find((account) => account.id === row.accountId)?.mail }}</span>
-      </template>
-      <template #actionbtns_default="{ row }">
-        <!-- 操作：测试短信 -->
-        <XTextButton
-          preIcon="ep:cpu"
-          :title="t('action.test')"
-          v-hasPermi="['system:mail-template:send-mail']"
-          @click="handleSendMail(row)"
-        />
-        <!-- 操作：修改 -->
-        <XTextButton
-          preIcon="ep:edit"
-          :title="t('action.edit')"
-          v-hasPermi="['system:mail-template:update']"
-          @click="handleUpdate(row.id)"
-        />
-        <!-- 操作：详情 -->
-        <XTextButton
-          preIcon="ep:view"
-          :title="t('action.detail')"
-          v-hasPermi="['system:mail-template:query']"
-          @click="handleDetail(row.id)"
-        />
-        <!-- 操作：删除 -->
-        <XTextButton
-          preIcon="ep:delete"
-          :title="t('action.del')"
-          v-hasPermi="['system:mail-template:delete']"
-          @click="deleteData(row.id)"
-        />
-      </template>
-    </XTable>
-  </ContentWrap>
+    </Search>
+  </content-wrap>
 
-  <!-- 添加/修改/详情的弹窗 -->
-  <XModal id="mailTemplateModel" :loading="modelLoading" v-model="modelVisible" :title="modelTitle">
-    <!-- 表单：添加/修改 -->
-    <Form
-      ref="formRef"
-      v-if="['create', 'update'].includes(actionType)"
-      :schema="allSchemas.formSchema"
-      :rules="rules"
+  <!-- 列表 -->
+  <content-wrap>
+    <Table
+      :columns="allSchemas.tableColumns"
+      :data="tableObject.tableList"
+      :loading="tableObject.loading"
+      :pagination="{
+        total: tableObject.total
+      }"
+      v-model:pageSize="tableObject.pageSize"
+      v-model:currentPage="tableObject.currentPage"
     >
-      <template #accountId="form">
-        <el-select v-model="form.accountId">
-          <el-option
-            v-for="item in accountOptions"
-            :key="item.id"
-            :label="item.mail"
-            :value="item.id"
-          />
-        </el-select>
+      <template #action="{ row }">
+        <el-button
+          link
+          type="primary"
+          @click="openModal('update', row.id)"
+          v-hasPermi="['system:mail-template:update']"
+        >
+          编辑
+        </el-button>
+        <el-button
+          link
+          type="danger"
+          v-hasPermi="['system:mail-template:delete']"
+          @click="handleDelete(row.id)"
+        >
+          删除
+        </el-button>
       </template>
-    </Form>
-    <!-- 表单：详情 -->
-    <Descriptions
-      v-if="actionType === 'detail'"
-      :schema="allSchemas.detailSchema"
-      :data="detailData"
-    />
-    <template #footer>
-      <!-- 按钮：保存 -->
-      <XButton
-        v-if="['create', 'update'].includes(actionType)"
-        type="primary"
-        :title="t('action.save')"
-        :loading="actionLoading"
-        @click="submitForm()"
-      />
-      <!-- 按钮：关闭 -->
-      <XButton :loading="actionLoading" :title="t('dialog.close')" @click="modelVisible = false" />
-    </template>
-  </XModal>
+    </Table>
+  </content-wrap>
 
-  <!-- 测试邮件的弹窗 -->
-  <XModal id="sendTest" v-model="sendVisible" title="测试">
-    <el-form :model="sendForm" :rules="sendRules" label-width="200px" label-position="top">
-      <el-form-item label="模板内容" prop="content">
-        <Editor :model-value="sendForm.content" readonly height="150px" />
-      </el-form-item>
-      <el-form-item label="收件邮箱" prop="mail">
-        <el-input v-model="sendForm.mail" placeholder="请输入收件邮箱" />
-      </el-form-item>
-      <el-form-item
-        v-for="param in sendForm.params"
-        :key="param"
-        :label="'参数 {' + param + '}'"
-        :prop="'templateParams.' + param"
-      >
-        <el-input
-          v-model="sendForm.templateParams[param]"
-          :placeholder="'请输入 ' + param + ' 参数'"
-        />
-      </el-form-item>
-    </el-form>
-    <!-- 操作按钮 -->
-    <template #footer>
-      <XButton
-        type="primary"
-        :title="t('action.test')"
-        :loading="actionLoading"
-        @click="sendTest()"
-      />
-      <XButton :title="t('dialog.close')" @click="sendVisible = false" />
-    </template>
-  </XModal>
+  <!-- 表单弹窗：添加/修改 -->
+  <!--  <mail-template-form ref="modalRef" @success="getList" />-->
 </template>
 <script setup lang="ts" name="MailTemplate">
-import { FormExpose } from '@/components/Form'
-// 业务相关的 import
-import { rules, allSchemas } from './template.data'
+import { allSchemas } from './template.data'
 import * as MailTemplateApi from '@/api/system/mail/template'
-import * as MailAccountApi from '@/api/system/mail/account'
+// import MailAccountForm from './form.vue'
 
-const { t } = useI18n() // 国际化
-const message = useMessage() // 消息弹窗
-
-// 列表相关的变量
-const queryParams = reactive({
-  accountId: null
+// tableObject：表格的属性对象，可获得分页大小、条数等属性
+// tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
+// 详细可见：https://kailong110120130.gitee.io/vue-element-plus-admin-doc/components/table.html#usetable
+const { tableObject, tableMethods } = useTable({
+  getListApi: MailTemplateApi.getMailTemplatePageApi, // 分页接口
+  delListApi: MailTemplateApi.deleteMailTemplateApi // 删除接口
 })
-const [registerTable, { reload, deleteData }] = useXTable({
-  allSchemas: allSchemas,
-  params: queryParams,
-  getListApi: MailTemplateApi.getMailTemplatePageApi,
-  deleteApi: MailTemplateApi.deleteMailTemplateApi
-})
-const accountOptions = ref<any[]>([]) // 账号下拉选项
+// 获得表格的各种操作
+const { getList, setSearchParams } = tableMethods
 
-// 弹窗相关的变量
-const modelVisible = ref(false) // 是否显示弹出层
-const modelTitle = ref('edit') // 弹出层标题
-const modelLoading = ref(false) // 弹出层loading
-const actionType = ref('') // 操作按钮的类型
-const actionLoading = ref(false) // 按钮 Loading
-const formRef = ref<FormExpose>() // 表单 Ref
-const detailData = ref() // 详情 Ref
+/** 添加/修改操作 */
+// const modalRef = ref()
+// const openModal = (type: string, id?: number) => {
+//   modalRef.value.openModal(type, id)
+// }
 
-// 设置标题
-const setDialogTile = (type: string) => {
-  modelLoading.value = true
-  modelTitle.value = t('action.' + type)
-  actionType.value = type
-  modelVisible.value = true
+/** 删除按钮操作 */
+const handleDelete = (id: number) => {
+  tableMethods.delList(id, false)
 }
 
-// 新增操作
-const handleCreate = () => {
-  setDialogTile('create')
-  modelLoading.value = false
-}
-
-// 修改操作
-const handleUpdate = async (rowId: number) => {
-  setDialogTile('update')
-  // 设置数据
-  const res = await MailTemplateApi.getMailTemplateApi(rowId)
-  unref(formRef)?.setValues(res)
-  modelLoading.value = false
-}
-
-// 详情操作
-const handleDetail = async (rowId: number) => {
-  setDialogTile('detail')
-  const res = await MailTemplateApi.getMailTemplateApi(rowId)
-  detailData.value = res
-  modelLoading.value = false
-}
-
-// 提交按钮
-const submitForm = async () => {
-  const elForm = unref(formRef)?.getElFormRef()
-  if (!elForm) return
-  elForm.validate(async (valid) => {
-    if (valid) {
-      actionLoading.value = true
-      // 提交请求
-      try {
-        const data = unref(formRef)?.formModel as MailTemplateApi.MailTemplateVO
-        if (actionType.value === 'create') {
-          await MailTemplateApi.createMailTemplateApi(data)
-          message.success(t('common.createSuccess'))
-        } else {
-          await MailTemplateApi.updateMailTemplateApi(data)
-          message.success(t('common.updateSuccess'))
-        }
-        modelVisible.value = false
-      } finally {
-        actionLoading.value = false
-        // 刷新列表
-        await reload()
-      }
-    }
-  })
-}
-
-// ========== 测试相关 ==========
-const sendForm = ref({
-  content: '',
-  params: {},
-  mail: '',
-  templateCode: '',
-  templateParams: {}
-})
-const sendRules = ref({
-  mail: [{ required: true, message: '邮箱不能为空', trigger: 'blur' }],
-  templateCode: [{ required: true, message: '模版编号不能为空', trigger: 'blur' }],
-  templateParams: {}
-})
-const sendVisible = ref(false)
-
-const handleSendMail = (row: any) => {
-  sendForm.value.content = row.content
-  sendForm.value.params = row.params
-  sendForm.value.templateCode = row.code
-  sendForm.value.templateParams = row.params.reduce(function (obj, item) {
-    obj[item] = undefined
-    return obj
-  }, {})
-  sendRules.value.templateParams = row.params.reduce(function (obj, item) {
-    obj[item] = { required: true, message: '参数 ' + item + ' 不能为空', trigger: 'change' }
-    return obj
-  }, {})
-  sendVisible.value = true
-}
-
-const sendTest = async () => {
-  const data: MailTemplateApi.MailSendReqVO = {
-    mail: sendForm.value.mail,
-    templateCode: sendForm.value.templateCode,
-    templateParams: sendForm.value.templateParams as unknown as Map<string, Object>
-  }
-  const res = await MailTemplateApi.sendMailApi(data)
-  if (res) {
-    message.success('提交发送成功！发送结果，见发送日志编号：' + res)
-  }
-  sendVisible.value = false
-}
-
-// ========== 初始化 ==========
+/** 初始化 **/
 onMounted(() => {
-  MailAccountApi.getSimpleMailAccountList().then((data) => {
-    accountOptions.value = data
-  })
+  getList()
 })
 </script>
diff --git a/src/views/system/mail/template/template.data.ts b/src/views/system/mail/template/template.data.ts
index 32522e33c..0f4c75f72 100644
--- a/src/views/system/mail/template/template.data.ts
+++ b/src/views/system/mail/template/template.data.ts
@@ -1,98 +1,106 @@
-import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
+import type { CrudSchema } from '@/hooks/web/useCrudSchemas'
+import { dateFormatter } from '@/utils/formatTime'
+import { TableColumn } from '@/types/table'
+import { DictTag } from '@/components/DictTag'
+import * as MailAccountApi from '@/api/system/mail/account'
+
+const accounts = await MailAccountApi.getSimpleMailAccountList()
 
 // 表单校验
 export const rules = reactive({
   name: [required],
   code: [required],
   accountId: [required],
-  title: [required],
+  label: [required],
   content: [required],
   params: [required],
   status: [required]
 })
 
-// CrudSchema
-const crudSchemas = reactive<VxeCrudSchema>({
-  primaryKey: 'id', // 默认的主键ID
-  primaryTitle: '编号', // 默认显示的值
-  primaryType: null,
-  action: true,
-  actionWidth: '260',
-  columns: [
-    {
-      title: '模板编码',
-      field: 'code',
-      isSearch: true
-    },
-    {
-      title: '模板名称',
-      field: 'name',
-      isSearch: true
-    },
-    {
-      title: '模板标题',
-      field: 'title'
-    },
-    {
-      title: '模板内容',
-      field: 'content',
-      form: {
-        component: 'Editor',
-        colProps: {
-          span: 24
-        },
-        componentProps: {
-          valueHtml: ''
-        }
-      }
-    },
-    {
-      title: '邮箱账号',
-      field: 'accountId',
-      isSearch: true,
-      table: {
-        width: 200,
-        slots: {
-          default: 'accountId_default'
-        }
+// CrudSchema：https://kailong110120130.gitee.io/vue-element-plus-admin-doc/hooks/useCrudSchemas.html
+const crudSchemas = reactive<CrudSchema[]>([
+  {
+    label: '模板编码',
+    field: 'code',
+    isSearch: true
+  },
+  {
+    label: '模板名称',
+    field: 'name',
+    isSearch: true
+  },
+  {
+    label: '模板标题',
+    field: 'title'
+  },
+  {
+    label: '模板内容',
+    field: 'content',
+    form: {
+      component: 'Editor',
+      colProps: {
+        span: 24
       },
-      search: {
-        slots: {
-          default: 'accountId_search'
-        }
+      componentProps: {
+        valueHtml: ''
       }
+    }
+  },
+  {
+    label: '邮箱账号',
+    field: 'accountId',
+    isSearch: true,
+    width: '200px',
+    formatter: (_: Recordable, __: TableColumn, cellValue: number) => {
+      return accounts.find((account) => account.id === cellValue)?.mail
     },
-    {
-      title: '发送人名称',
-      field: 'nickname'
-    },
-    {
-      title: '开启状态',
-      field: 'status',
-      isSearch: true,
-      dictType: DICT_TYPE.COMMON_STATUS,
-      dictClass: 'number'
-    },
-    {
-      title: '备注',
-      field: 'remark',
-      isTable: false
-    },
-    {
-      title: '创建时间',
-      field: 'createTime',
-      isForm: false,
-      formatter: 'formatDate',
-      table: {
-        width: 180
+    search: {
+      show: true,
+      component: 'Select',
+      api: () => {
+        return accounts
       },
-      search: {
-        show: true,
-        itemRender: {
-          name: 'XDataTimePicker'
+      componentProps: {
+        optionsAlias: {
+          labelField: 'mail',
+          valueField: 'id'
         }
       }
     }
-  ]
-})
-export const { allSchemas } = useVxeCrudSchemas(crudSchemas)
+  },
+  {
+    label: '发送人名称',
+    field: 'nickname'
+  },
+  {
+    label: '开启状态',
+    field: 'status',
+    isSearch: true,
+    formatter: (_: Recordable, __: TableColumn, cellValue: number) => {
+      return h(DictTag, {
+        type: DICT_TYPE.COMMON_STATUS,
+        value: cellValue
+      })
+    },
+    dictType: DICT_TYPE.COMMON_STATUS,
+    dictClass: 'number'
+  },
+  {
+    label: '备注',
+    field: 'remark',
+    isTable: false
+  },
+  {
+    label: '创建时间',
+    field: 'createTime',
+    isForm: false,
+    formatter: dateFormatter,
+    search: {
+      show: true,
+      itemRender: {
+        name: 'XDataTimePicker'
+      }
+    }
+  }
+])
+export const { allSchemas } = useCrudSchemas(crudSchemas)

From 4d03e46142ea2712b01f0a628d458c14cd9b11d2 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 01:23:07 +0800
Subject: [PATCH 31/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E9=82=AE=E4=BB=B6=E6=A8=A1=E7=89=88=E7=9A=84=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/infra/config/index.vue                | 1 -
 src/views/infra/file/index.vue                  | 1 -
 src/views/infra/fileConfig/index.vue            | 1 -
 src/views/system/mail/template/template.data.ts | 7 +++++--
 src/views/system/sms/smsChannel/index.vue       | 3 +--
 5 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/views/infra/config/index.vue b/src/views/infra/config/index.vue
index 4c35d4854..0136a9d51 100644
--- a/src/views/infra/config/index.vue
+++ b/src/views/infra/config/index.vue
@@ -33,7 +33,6 @@
           v-model="queryParams.createTime"
           value-format="YYYY-MM-DD HH:mm:ss"
           type="daterange"
-          range-separator="-"
           start-placeholder="开始日期"
           end-placeholder="结束日期"
           :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
diff --git a/src/views/infra/file/index.vue b/src/views/infra/file/index.vue
index 5137ec3e3..adf9d3a4c 100644
--- a/src/views/infra/file/index.vue
+++ b/src/views/infra/file/index.vue
@@ -23,7 +23,6 @@
           v-model="queryParams.createTime"
           value-format="YYYY-MM-DD HH:mm:ss"
           type="daterange"
-          range-separator="-"
           start-placeholder="开始日期"
           end-placeholder="结束日期"
           :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
diff --git a/src/views/infra/fileConfig/index.vue b/src/views/infra/fileConfig/index.vue
index e38e3a502..ed0cfed70 100644
--- a/src/views/infra/fileConfig/index.vue
+++ b/src/views/infra/fileConfig/index.vue
@@ -25,7 +25,6 @@
           v-model="queryParams.createTime"
           value-format="YYYY-MM-DD HH:mm:ss"
           type="daterange"
-          range-separator="-"
           start-placeholder="开始日期"
           end-placeholder="结束日期"
           :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
diff --git a/src/views/system/mail/template/template.data.ts b/src/views/system/mail/template/template.data.ts
index 0f4c75f72..aec8c4015 100644
--- a/src/views/system/mail/template/template.data.ts
+++ b/src/views/system/mail/template/template.data.ts
@@ -97,8 +97,11 @@ const crudSchemas = reactive<CrudSchema[]>([
     formatter: dateFormatter,
     search: {
       show: true,
-      itemRender: {
-        name: 'XDataTimePicker'
+      component: 'DatePicker',
+      componentProps: {
+        valueFormat: 'YYYY-MM-DD HH:mm:ss',
+        type: 'daterange',
+        defaultTime: [new Date('1 00:00:00'), new Date('1 23:59:59')]
       }
     }
   }
diff --git a/src/views/system/sms/smsChannel/index.vue b/src/views/system/sms/smsChannel/index.vue
index 94a46b7d9..bac94f25a 100644
--- a/src/views/system/sms/smsChannel/index.vue
+++ b/src/views/system/sms/smsChannel/index.vue
@@ -22,9 +22,8 @@
       <el-form-item label="创建时间" prop="createTime">
         <el-date-picker
           v-model="queryParams.createTime"
-          value-format="yyyy-MM-dd HH:mm:ss"
+          value-format="YYYY-MM-DD HH:mm:ss"
           type="daterange"
-          range-separator="-"
           start-placeholder="开始日期"
           end-placeholder="结束日期"
           :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"

From ba327cd8aeff7870f82cb8e2389a2915eabf588c Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 10:39:19 +0800
Subject: [PATCH 32/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E9=82=AE=E4=BB=B6=E6=A8=A1=E7=89=88=E7=9A=84=E6=96=B0=E5=A2=9E?=
 =?UTF-8?q?=E5=92=8C=E4=BF=AE=E6=94=B9=E6=93=8D=E4=BD=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/mail/template/index.ts         | 20 ++----
 src/views/system/mail/account/form.vue        |  1 -
 src/views/system/mail/template/form.vue       | 66 +++++++++++++++++++
 src/views/system/mail/template/index.vue      | 16 ++---
 .../system/mail/template/template.data.ts     | 23 +++++--
 5 files changed, 98 insertions(+), 28 deletions(-)
 create mode 100644 src/views/system/mail/template/form.vue

diff --git a/src/api/system/mail/template/index.ts b/src/api/system/mail/template/index.ts
index c044ddd4e..fb7ce5ea7 100644
--- a/src/api/system/mail/template/index.ts
+++ b/src/api/system/mail/template/index.ts
@@ -13,14 +13,6 @@ export interface MailTemplateVO {
   remark: string
 }
 
-export interface MailTemplatePageReqVO extends PageParam {
-  name?: string
-  code?: string
-  accountId?: number
-  status?: number
-  createTime?: Date[]
-}
-
 export interface MailSendReqVO {
   mail: string
   templateCode: string
@@ -28,31 +20,31 @@ export interface MailSendReqVO {
 }
 
 // 查询邮件模版列表
-export const getMailTemplatePageApi = async (params: MailTemplatePageReqVO) => {
+export const getMailTemplatePage = async (params: PageParam) => {
   return await request.get({ url: '/system/mail-template/page', params })
 }
 
 // 查询邮件模版详情
-export const getMailTemplateApi = async (id: number) => {
+export const getMailTemplate = async (id: number) => {
   return await request.get({ url: '/system/mail-template/get?id=' + id })
 }
 
 // 新增邮件模版
-export const createMailTemplateApi = async (data: MailTemplateVO) => {
+export const createMailTemplate = async (data: MailTemplateVO) => {
   return await request.post({ url: '/system/mail-template/create', data })
 }
 
 // 修改邮件模版
-export const updateMailTemplateApi = async (data: MailTemplateVO) => {
+export const updateMailTemplate = async (data: MailTemplateVO) => {
   return await request.put({ url: '/system/mail-template/update', data })
 }
 
 // 删除邮件模版
-export const deleteMailTemplateApi = async (id: number) => {
+export const deleteMailTemplate = async (id: number) => {
   return await request.delete({ url: '/system/mail-template/delete?id=' + id })
 }
 
 // 发送邮件
-export const sendMailApi = (data: MailSendReqVO) => {
+export const sendMail = (data: MailSendReqVO) => {
   return request.post({ url: '/system/mail-template/send-mail', data })
 }
diff --git a/src/views/system/mail/account/form.vue b/src/views/system/mail/account/form.vue
index 706838306..78d7cf0da 100644
--- a/src/views/system/mail/account/form.vue
+++ b/src/views/system/mail/account/form.vue
@@ -25,7 +25,6 @@ const openModal = async (type: string, id?: number) => {
   modelVisible.value = true
   modelTitle.value = t('action.' + type)
   formType.value = type
-  // resetForm()
   // 修改时，设置数据
   if (id) {
     formLoading.value = true
diff --git a/src/views/system/mail/template/form.vue b/src/views/system/mail/template/form.vue
new file mode 100644
index 000000000..92f3c5c12
--- /dev/null
+++ b/src/views/system/mail/template/form.vue
@@ -0,0 +1,66 @@
+<template>
+  <Dialog :title="modelTitle" v-model="modelVisible" :scroll="true" :width="800" :max-height="500">
+    <Form ref="formRef" :schema="allSchemas.formSchema" :rules="rules" v-loading="formLoading" />
+    <template #footer>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+      <el-button @click="modelVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import * as MailTemplateApi from '@/api/system/mail/template'
+import { rules, allSchemas } from './template.data'
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const modelTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const formRef = ref() // 表单 Ref
+
+/** 打开弹窗 */
+const openModal = async (type: string, id?: number) => {
+  modelVisible.value = true
+  modelTitle.value = t('action.' + type)
+  formType.value = type
+  // 修改时，设置数据
+  if (id) {
+    formLoading.value = true
+    try {
+      const data = await MailTemplateApi.getMailTemplate(id)
+      formRef.value.setValues(data)
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.getElFormRef().validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = formRef.value.formModel as MailTemplateApi.MailTemplateVO
+    if (formType.value === 'create') {
+      await MailTemplateApi.createMailTemplate(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await MailTemplateApi.updateMailTemplate(data)
+      message.success(t('common.updateSuccess'))
+    }
+    modelVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+</script>
diff --git a/src/views/system/mail/template/index.vue b/src/views/system/mail/template/index.vue
index d9684e86b..ef8d800d3 100644
--- a/src/views/system/mail/template/index.vue
+++ b/src/views/system/mail/template/index.vue
@@ -49,28 +49,28 @@
   </content-wrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <!--  <mail-template-form ref="modalRef" @success="getList" />-->
+  <mail-template-form ref="modalRef" @success="getList" />
 </template>
 <script setup lang="ts" name="MailTemplate">
 import { allSchemas } from './template.data'
 import * as MailTemplateApi from '@/api/system/mail/template'
-// import MailAccountForm from './form.vue'
+import MailTemplateForm from './form.vue'
 
 // tableObject：表格的属性对象，可获得分页大小、条数等属性
 // tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
 // 详细可见：https://kailong110120130.gitee.io/vue-element-plus-admin-doc/components/table.html#usetable
 const { tableObject, tableMethods } = useTable({
-  getListApi: MailTemplateApi.getMailTemplatePageApi, // 分页接口
-  delListApi: MailTemplateApi.deleteMailTemplateApi // 删除接口
+  getListApi: MailTemplateApi.getMailTemplatePage, // 分页接口
+  delListApi: MailTemplateApi.deleteMailTemplate // 删除接口
 })
 // 获得表格的各种操作
 const { getList, setSearchParams } = tableMethods
 
 /** 添加/修改操作 */
-// const modalRef = ref()
-// const openModal = (type: string, id?: number) => {
-//   modalRef.value.openModal(type, id)
-// }
+const modalRef = ref()
+const openModal = (type: string, id?: number) => {
+  modalRef.value.openModal(type, id)
+}
 
 /** 删除按钮操作 */
 const handleDelete = (id: number) => {
diff --git a/src/views/system/mail/template/template.data.ts b/src/views/system/mail/template/template.data.ts
index aec8c4015..129fa4e50 100644
--- a/src/views/system/mail/template/template.data.ts
+++ b/src/views/system/mail/template/template.data.ts
@@ -42,14 +42,14 @@ const crudSchemas = reactive<CrudSchema[]>([
         span: 24
       },
       componentProps: {
-        valueHtml: ''
+        valueHtml: '',
+        height: 200
       }
     }
   },
   {
     label: '邮箱账号',
     field: 'accountId',
-    isSearch: true,
     width: '200px',
     formatter: (_: Recordable, __: TableColumn, cellValue: number) => {
       return accounts.find((account) => account.id === cellValue)?.mail
@@ -57,9 +57,17 @@ const crudSchemas = reactive<CrudSchema[]>([
     search: {
       show: true,
       component: 'Select',
-      api: () => {
-        return accounts
-      },
+      api: () => accounts,
+      componentProps: {
+        optionsAlias: {
+          labelField: 'mail',
+          valueField: 'id'
+        }
+      }
+    },
+    form: {
+      component: 'Select',
+      api: () => accounts,
       componentProps: {
         optionsAlias: {
           labelField: 'mail',
@@ -104,6 +112,11 @@ const crudSchemas = reactive<CrudSchema[]>([
         defaultTime: [new Date('1 00:00:00'), new Date('1 23:59:59')]
       }
     }
+  },
+  {
+    label: '操作',
+    field: 'action',
+    isForm: false
   }
 ])
 export const { allSchemas } = useCrudSchemas(crudSchemas)

From 7d22328d6907635f8eb7e7606db65a84d4933608 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 11:02:40 +0800
Subject: [PATCH 33/40] =?UTF-8?q?Table=20=E7=BB=84=E4=BB=B6=EF=BC=9A?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=AF=B9=E5=AD=97=E5=85=B8=E6=95=B0=E6=8D=AE?=
 =?UTF-8?q?=E7=9A=84=E6=94=AF=E6=8C=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/web/useCrudSchemas.ts | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/hooks/web/useCrudSchemas.ts b/src/hooks/web/useCrudSchemas.ts
index 543111ca2..66c5eb0a6 100644
--- a/src/hooks/web/useCrudSchemas.ts
+++ b/src/hooks/web/useCrudSchemas.ts
@@ -8,6 +8,7 @@ import { FormSchema } from '@/types/form'
 import { TableColumn } from '@/types/table'
 import { DescriptionsSchema } from '@/types/descriptions'
 import { ComponentOptions, ComponentProps } from '@/types/components'
+import { DictTag } from '@/components/DictTag'
 
 export type CrudSchema = Omit<TableColumn, 'children'> & {
   isSearch?: boolean // 是否在查询显示
@@ -151,6 +152,15 @@ const filterTableSchema = (crudSchema: CrudSchema[]): TableColumn[] => {
   const tableColumns = treeMap<CrudSchema>(crudSchema, {
     conversion: (schema: CrudSchema) => {
       if (schema?.isTable !== false && schema?.table?.show !== false) {
+        // add by 芋艿：增加对 dict 字典数据的支持
+        if (!schema.formatter && schema.dictType) {
+          schema.formatter = (_: Recordable, __: TableColumn, cellValue: any) => {
+            return h(DictTag, {
+              type: schema.dictType!, // ! 表示一定不为空
+              value: cellValue
+            })
+          }
+        }
         return {
           ...schema.table,
           ...schema

From e8d83d4718380a4e7b9ecde399e443e50a297533 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 11:40:55 +0800
Subject: [PATCH 34/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E5=9F=BA=E6=9C=AC=E5=AE=8C=E5=96=84=E5=AE=8C=20=E9=82=AE?=
 =?UTF-8?q?=E4=BB=B6=E6=A8=A1=E7=89=88=20=E7=9A=84=E9=87=8D=E6=9E=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/mail/account/account.data.ts |  16 +--
 src/views/system/mail/template/index.vue      |  18 +++
 src/views/system/mail/template/send.vue       | 115 ++++++++++++++++++
 .../system/mail/template/template.data.ts     |  10 --
 4 files changed, 136 insertions(+), 23 deletions(-)
 create mode 100644 src/views/system/mail/template/send.vue

diff --git a/src/views/system/mail/account/account.data.ts b/src/views/system/mail/account/account.data.ts
index 532a6a08e..f01c39f28 100644
--- a/src/views/system/mail/account/account.data.ts
+++ b/src/views/system/mail/account/account.data.ts
@@ -1,8 +1,5 @@
 import type { CrudSchema } from '@/hooks/web/useCrudSchemas'
-import { DictTag } from '@/components/DictTag'
-import { TableColumn } from '@/types/table'
 import { dateFormatter } from '@/utils/formatTime'
-import { getBoolDictOptions } from '@/utils/dict'
 
 const { t } = useI18n() // 国际化
 
@@ -55,17 +52,10 @@ const crudSchemas = reactive<CrudSchema[]>([
   {
     label: '是否开启 SSL',
     field: 'sslEnable',
-    formatter: (_: Recordable, __: TableColumn, cellValue: boolean) => {
-      return h(DictTag, {
-        type: DICT_TYPE.INFRA_BOOLEAN_STRING,
-        value: cellValue
-      })
-    },
+    dictType: DICT_TYPE.INFRA_BOOLEAN_STRING,
+    dictClass: 'boolean',
     form: {
-      component: 'Radio',
-      componentProps: {
-        options: getBoolDictOptions(DICT_TYPE.INFRA_BOOLEAN_STRING)
-      }
+      component: 'Radio'
     }
   },
   {
diff --git a/src/views/system/mail/template/index.vue b/src/views/system/mail/template/index.vue
index ef8d800d3..b9a5040b8 100644
--- a/src/views/system/mail/template/index.vue
+++ b/src/views/system/mail/template/index.vue
@@ -28,6 +28,14 @@
       v-model:currentPage="tableObject.currentPage"
     >
       <template #action="{ row }">
+        <el-button
+          link
+          type="primary"
+          @click="openSend(row.id)"
+          v-hasPermi="['system:mail-template:send-mail']"
+        >
+          测试
+        </el-button>
         <el-button
           link
           type="primary"
@@ -50,11 +58,15 @@
 
   <!-- 表单弹窗：添加/修改 -->
   <mail-template-form ref="modalRef" @success="getList" />
+
+  <!-- 表单弹窗：发送测试 -->
+  <mail-template-send ref="sendRef" />
 </template>
 <script setup lang="ts" name="MailTemplate">
 import { allSchemas } from './template.data'
 import * as MailTemplateApi from '@/api/system/mail/template'
 import MailTemplateForm from './form.vue'
+import MailTemplateSend from './send.vue'
 
 // tableObject：表格的属性对象，可获得分页大小、条数等属性
 // tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
@@ -77,6 +89,12 @@ const handleDelete = (id: number) => {
   tableMethods.delList(id, false)
 }
 
+/** 发送测试操作 */
+const sendRef = ref()
+const openSend = (id: number) => {
+  sendRef.value.openModal(id)
+}
+
 /** 初始化 **/
 onMounted(() => {
   getList()
diff --git a/src/views/system/mail/template/send.vue b/src/views/system/mail/template/send.vue
new file mode 100644
index 000000000..94aaf004d
--- /dev/null
+++ b/src/views/system/mail/template/send.vue
@@ -0,0 +1,115 @@
+<template>
+  <Dialog title="测试" v-model="modelVisible">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="120px"
+      v-loading="formLoading"
+    >
+      <el-form-item label="模板内容" prop="content">
+        <Editor :model-value="formData.content" readonly height="150px" />
+      </el-form-item>
+      <el-form-item label="收件邮箱" prop="mail">
+        <el-input v-model="formData.mail" placeholder="请输入收件邮箱" />
+      </el-form-item>
+      <el-form-item
+        v-for="param in formData.params"
+        :key="param"
+        :label="'参数 {' + param + '}'"
+        :prop="'templateParams.' + param"
+      >
+        <el-input
+          v-model="formData.templateParams[param]"
+          :placeholder="'请输入 ' + param + ' 参数'"
+        />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+        <el-button @click="modelVisible = false">取 消</el-button>
+      </div>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import * as MailTemplateApi from '@/api/system/mail/template'
+
+const message = useMessage() // 消息弹窗
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formData = ref({
+  content: '',
+  params: {},
+  mail: '',
+  templateCode: '',
+  templateParams: new Map()
+})
+const formRules = reactive({
+  mail: [{ required: true, message: '邮箱不能为空', trigger: 'blur' }],
+  templateCode: [{ required: true, message: '模版编号不能为空', trigger: 'blur' }],
+  templateParams: {}
+})
+const formRef = ref() // 表单 Ref
+
+/** 打开弹窗 */
+const openModal = async (id: number) => {
+  modelVisible.value = true
+  resetForm()
+  // 设置数据
+  formLoading.value = true
+  try {
+    const data = await MailTemplateApi.getMailTemplate(id)
+    // 设置动态表单
+    formData.value.content = data.content
+    formData.value.params = data.params
+    formData.value.templateCode = data.code
+    formData.value.templateParams = data.params.reduce((obj, item) => {
+      obj[item] = '' // 给每个动态属性赋值，避免无法读取
+      return obj
+    }, {})
+    formRules.templateParams = data.params.reduce((obj, item) => {
+      obj[item] = { required: true, message: '参数 ' + item + ' 不能为空', trigger: 'blur' }
+      return obj
+    }, {})
+  } finally {
+    formLoading.value = false
+  }
+}
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+
+/** 提交表单 */
+const submitForm = async () => {
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    const data = formData.value as MailTemplateApi.MailSendReqVO
+    const logId = await MailTemplateApi.sendMail(data)
+    if (logId) {
+      message.success('提交发送成功！发送结果，见发送日志编号：' + logId)
+    }
+    modelVisible.value = false
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    content: '',
+    params: {},
+    mail: '',
+    templateCode: '',
+    templateParams: new Map()
+  }
+  formRules.templateParams = {}
+  formRef.value?.resetFields()
+}
+</script>
diff --git a/src/views/system/mail/template/template.data.ts b/src/views/system/mail/template/template.data.ts
index 129fa4e50..bfdd5cad7 100644
--- a/src/views/system/mail/template/template.data.ts
+++ b/src/views/system/mail/template/template.data.ts
@@ -1,7 +1,6 @@
 import type { CrudSchema } from '@/hooks/web/useCrudSchemas'
 import { dateFormatter } from '@/utils/formatTime'
 import { TableColumn } from '@/types/table'
-import { DictTag } from '@/components/DictTag'
 import * as MailAccountApi from '@/api/system/mail/account'
 
 const accounts = await MailAccountApi.getSimpleMailAccountList()
@@ -38,9 +37,6 @@ const crudSchemas = reactive<CrudSchema[]>([
     field: 'content',
     form: {
       component: 'Editor',
-      colProps: {
-        span: 24
-      },
       componentProps: {
         valueHtml: '',
         height: 200
@@ -84,12 +80,6 @@ const crudSchemas = reactive<CrudSchema[]>([
     label: '开启状态',
     field: 'status',
     isSearch: true,
-    formatter: (_: Recordable, __: TableColumn, cellValue: number) => {
-      return h(DictTag, {
-        type: DICT_TYPE.COMMON_STATUS,
-        value: cellValue
-      })
-    },
     dictType: DICT_TYPE.COMMON_STATUS,
     dictClass: 'number'
   },

From 3c75d6065ddd91180c7b5de0100dc3738ca64448 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 12:24:21 +0800
Subject: [PATCH 35/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E9=82=AE=E4=BB=B6=E6=97=A5=E5=BF=97=E7=9A=84=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/mail/log/index.vue           | 127 ++++-----
 src/views/system/mail/log/log.data.ts         | 242 +++++++++---------
 .../system/mail/template/template.data.ts     |   1 +
 3 files changed, 169 insertions(+), 201 deletions(-)

diff --git a/src/views/system/mail/log/index.vue b/src/views/system/mail/log/index.vue
index bbc0ba005..a8b0c6c1a 100644
--- a/src/views/system/mail/log/index.vue
+++ b/src/views/system/mail/log/index.vue
@@ -1,98 +1,59 @@
 <template>
-  <ContentWrap>
-    <!-- 列表 -->
-    <XTable @register="registerTable">
-      <template #accountId_search>
-        <el-select v-model="queryParams.accountId">
-          <el-option :key="undefined" label="全部" :value="undefined" />
-          <el-option
-            v-for="item in accountOptions"
-            :key="item.id"
-            :label="item.mail"
-            :value="item.id"
-          />
-        </el-select>
-      </template>
-      <template #toMail_default="{ row }">
-        <div>{{ row.toMail }}</div>
-        <div v-if="row.userType && row.userId">
-          <DictTag :type="DICT_TYPE.USER_TYPE" :value="row.userType" />{{ '(' + row.userId + ')' }}
-        </div>
-      </template>
-      <template #actionbtns_default="{ row }">
-        <!-- 操作：详情 -->
-        <XTextButton
-          preIcon="ep:view"
-          :title="t('action.detail')"
+  <!-- 搜索工作栏 -->
+  <content-wrap>
+    <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" />
+  </content-wrap>
+
+  <!-- 列表 -->
+  <content-wrap>
+    <Table
+      :columns="allSchemas.tableColumns"
+      :data="tableObject.tableList"
+      :loading="tableObject.loading"
+      :pagination="{
+        total: tableObject.total
+      }"
+      v-model:pageSize="tableObject.pageSize"
+      v-model:currentPage="tableObject.currentPage"
+    >
+      <template #action="{ row }">
+        <el-button
+          link
+          type="primary"
+          @click="openModal('update', row.id)"
           v-hasPermi="['system:mail-log:query']"
-          @click="handleDetail(row.id)"
-        />
+        >
+          详情
+        </el-button>
       </template>
-    </XTable>
-  </ContentWrap>
-  <!-- 弹窗 -->
-  <XModal id="mailLogModel" :loading="modelLoading" v-model="modelVisible" :title="modelTitle">
-    <!-- 表单：详情 -->
-    <Descriptions
-      v-if="actionType === 'detail'"
-      :schema="allSchemas.detailSchema"
-      :data="detailData"
-    />
-    <template #footer>
-      <!-- 按钮：关闭 -->
-      <XButton :loading="actionLoading" :title="t('dialog.close')" @click="modelVisible = false" />
-    </template>
-  </XModal>
+    </Table>
+  </content-wrap>
+
+  <!-- 表单弹窗：添加/修改 -->
+  <!--  <mail-account-form ref="modalRef" @success="getList" />-->
 </template>
 <script setup lang="ts" name="MailLog">
-// 业务相关的 import
-import { DICT_TYPE } from '@/utils/dict'
 import { allSchemas } from './log.data'
 import * as MailLogApi from '@/api/system/mail/log'
-import * as MailAccountApi from '@/api/system/mail/account'
+// import MailAccountForm from './form.vue'
 
-const { t } = useI18n() // 国际化
-
-// 列表相关的变量
-const queryParams = reactive({
-  accountId: null
+// tableObject：表格的属性对象，可获得分页大小、条数等属性
+// tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
+// 详细可见：https://kailong110120130.gitee.io/vue-element-plus-admin-doc/components/table.html#usetable
+const { tableObject, tableMethods } = useTable({
+  getListApi: MailLogApi.getMailLogPageApi // 分页接口
 })
-const [registerTable] = useXTable({
-  allSchemas: allSchemas,
-  topActionSlots: false,
-  params: queryParams,
-  getListApi: MailLogApi.getMailLogPageApi
-})
-const accountOptions = ref<any[]>([]) // 账号下拉选项
+// 获得表格的各种操作
+const { getList, setSearchParams } = tableMethods
 
-// 弹窗相关的变量
-const modelVisible = ref(false) // 是否显示弹出层
-const modelTitle = ref('edit') // 弹出层标题
-const modelLoading = ref(false) // 弹出层loading
-const actionType = ref('') // 操作按钮的类型
-const actionLoading = ref(false) // 按钮 Loading
-const detailData = ref() // 详情 Ref
-
-// 设置标题
-const setDialogTile = (type: string) => {
-  modelLoading.value = true
-  modelTitle.value = t('action.' + type)
-  actionType.value = type
-  modelVisible.value = true
+/** 添加/修改操作 */
+const modalRef = ref()
+const openModal = (type: string, id?: number) => {
+  modalRef.value.openModal(type, id)
 }
 
-// 详情操作
-const handleDetail = async (rowId: number) => {
-  setDialogTile('detail')
-  const res = await MailLogApi.getMailLogApi(rowId)
-  detailData.value = res
-  modelLoading.value = false
-}
-
-// ========== 初始化 ==========
+/** 初始化 **/
 onMounted(() => {
-  MailAccountApi.getSimpleMailAccountList().then((data) => {
-    accountOptions.value = data
-  })
+  getList()
 })
 </script>
diff --git a/src/views/system/mail/log/log.data.ts b/src/views/system/mail/log/log.data.ts
index d389bce58..e3679535e 100644
--- a/src/views/system/mail/log/log.data.ts
+++ b/src/views/system/mail/log/log.data.ts
@@ -1,121 +1,127 @@
-import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
+import type { CrudSchema } from '@/hooks/web/useCrudSchemas'
+import { dateFormatter } from '@/utils/formatTime'
+import * as MailAccountApi from '@/api/system/mail/account'
 
-// CrudSchema
-const crudSchemas = reactive<VxeCrudSchema>({
-  primaryKey: 'id',
-  primaryTitle: '编号',
-  primaryType: 'id',
-  action: true,
-  actionWidth: '70',
-  columns: [
-    {
-      title: '发送时间',
-      field: 'sendTime',
-      table: {
-        width: 180
-      },
-      formatter: 'formatDate',
-      search: {
-        show: true,
-        itemRender: {
-          name: 'XDataTimePicker'
-        }
+// 邮箱账号的列表
+const accounts = await MailAccountApi.getSimpleMailAccountList()
+
+// CrudSchema：https://kailong110120130.gitee.io/vue-element-plus-admin-doc/hooks/useCrudSchemas.html
+const crudSchemas = reactive<CrudSchema[]>([
+  {
+    label: '编号',
+    field: 'id'
+  },
+  {
+    label: '发送时间',
+    field: 'sendTime',
+    formatter: dateFormatter,
+    search: {
+      show: true,
+      component: 'DatePicker',
+      componentProps: {
+        valueFormat: 'YYYY-MM-DD HH:mm:ss',
+        type: 'daterange',
+        defaultTime: [new Date('1 00:00:00'), new Date('1 23:59:59')]
       }
-    },
-    {
-      title: '接收邮箱',
-      field: 'toMail',
-      isSearch: true,
-      table: {
-        width: 180,
-        slots: {
-          default: 'toMail_default'
-        }
-      }
-    },
-    {
-      title: '用户编号',
-      field: 'userId',
-      isSearch: true,
-      isTable: false
-    },
-    {
-      title: '用户类型',
-      field: 'userType',
-      dictType: DICT_TYPE.USER_TYPE,
-      dictClass: 'number',
-      isSearch: true,
-      isTable: false
-    },
-    {
-      title: '邮件标题',
-      field: 'templateTitle'
-    },
-    {
-      title: '邮件内容',
-      field: 'templateContent',
-      isTable: false
-    },
-    {
-      title: '邮箱参数',
-      field: 'templateParams',
-      isTable: false
-    },
-    {
-      title: '发送状态',
-      field: 'sendStatus',
-      dictType: DICT_TYPE.SYSTEM_MAIL_SEND_STATUS,
-      dictClass: 'string',
-      isSearch: true
-    },
-    {
-      title: '邮箱账号',
-      field: 'accountId',
-      isSearch: true,
-      isTable: false,
-      search: {
-        slots: {
-          default: 'accountId_search'
-        }
-      }
-    },
-    {
-      title: '发送邮箱地址',
-      field: 'fromMail',
-      table: {
-        title: '邮箱账号'
-      }
-    },
-    {
-      title: '模板编号',
-      field: 'templateId',
-      isSearch: true
-    },
-    {
-      title: '模板编码',
-      field: 'templateCode',
-      isTable: false
-    },
-    {
-      title: '模版发送人名称',
-      field: 'templateNickname',
-      isTable: false
-    },
-    {
-      title: '发送返回的消息编号',
-      field: 'sendMessageId',
-      isTable: false
-    },
-    {
-      title: '发送异常',
-      field: 'sendException',
-      isTable: false
-    },
-    {
-      title: '创建时间',
-      field: 'createTime',
-      isTable: false
     }
-  ]
-})
-export const { allSchemas } = useVxeCrudSchemas(crudSchemas)
+  },
+  {
+    label: '接收邮箱',
+    field: 'toMail'
+  },
+  {
+    label: '用户编号',
+    field: 'userId',
+    isSearch: true,
+    isTable: false
+  },
+  {
+    label: '用户类型',
+    field: 'userType',
+    dictType: DICT_TYPE.USER_TYPE,
+    dictClass: 'number',
+    isSearch: true,
+    isTable: false
+  },
+  {
+    label: '邮件标题',
+    field: 'templateTitle'
+  },
+  {
+    label: '邮件内容',
+    field: 'templateContent',
+    isTable: false
+  },
+  {
+    label: '邮箱参数',
+    field: 'templateParams',
+    isTable: false
+  },
+  {
+    label: '发送状态',
+    field: 'sendStatus',
+    dictType: DICT_TYPE.SYSTEM_MAIL_SEND_STATUS,
+    dictClass: 'string',
+    isSearch: true
+  },
+  {
+    label: '邮箱账号',
+    field: 'accountId',
+    isTable: false,
+    search: {
+      show: true,
+      component: 'Select',
+      api: () => accounts,
+      componentProps: {
+        optionsAlias: {
+          labelField: 'mail',
+          valueField: 'id'
+        }
+      }
+    }
+  },
+  {
+    label: '发送邮箱地址',
+    field: 'fromMail',
+    table: {
+      label: '邮箱账号'
+    }
+  },
+  {
+    label: '模板编号',
+    field: 'templateId',
+    isSearch: true
+  },
+  {
+    label: '模板编码',
+    field: 'templateCode',
+    isTable: false
+  },
+  {
+    label: '模版发送人名称',
+    field: 'templateNickname',
+    isTable: false
+  },
+  {
+    label: '发送返回的消息编号',
+    field: 'sendMessageId',
+    isTable: false
+  },
+  {
+    label: '发送异常',
+    field: 'sendException',
+    isTable: false
+  },
+  {
+    label: '创建时间',
+    field: 'createTime',
+    isTable: false,
+    formatter: dateFormatter
+  },
+  {
+    label: '操作',
+    field: 'action',
+    isForm: false
+  }
+])
+export const { allSchemas } = useCrudSchemas(crudSchemas)
diff --git a/src/views/system/mail/template/template.data.ts b/src/views/system/mail/template/template.data.ts
index bfdd5cad7..ba76dc276 100644
--- a/src/views/system/mail/template/template.data.ts
+++ b/src/views/system/mail/template/template.data.ts
@@ -3,6 +3,7 @@ import { dateFormatter } from '@/utils/formatTime'
 import { TableColumn } from '@/types/table'
 import * as MailAccountApi from '@/api/system/mail/account'
 
+// 邮箱账号的列表
 const accounts = await MailAccountApi.getSimpleMailAccountList()
 
 // 表单校验

From 0f4c74fef0bf2959abd0963a95e5ad0f289aa524 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 13:56:17 +0800
Subject: [PATCH 36/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E9=82=AE=E4=BB=B6=E6=97=A5=E5=BF=97=E7=9A=84=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/mail/log/index.ts      | 14 ++----------
 src/types/descriptions.d.ts           |  4 ++--
 src/views/system/mail/log/detail.vue  | 31 +++++++++++++++++++++++++++
 src/views/system/mail/log/index.vue   | 12 +++++------
 src/views/system/mail/log/log.data.ts | 10 +++++++--
 5 files changed, 49 insertions(+), 22 deletions(-)
 create mode 100644 src/views/system/mail/log/detail.vue

diff --git a/src/api/system/mail/log/index.ts b/src/api/system/mail/log/index.ts
index 9c6c60eb2..13172a72d 100644
--- a/src/api/system/mail/log/index.ts
+++ b/src/api/system/mail/log/index.ts
@@ -19,22 +19,12 @@ export interface MailLogVO {
   sendException: string
 }
 
-export interface MailLogPageReqVO extends PageParam {
-  userId?: number
-  userType?: number
-  toMail?: string
-  accountId?: number
-  templateId?: number
-  sendStatus?: number
-  sendTime?: Date[]
-}
-
 // 查询邮件日志列表
-export const getMailLogPageApi = async (params: MailLogPageReqVO) => {
+export const getMailLogPage = async (params: PageParam) => {
   return await request.get({ url: '/system/mail-log/page', params })
 }
 
 // 查询邮件日志详情
-export const getMailLogApi = async (id: number) => {
+export const getMailLog = async (id: number) => {
   return await request.get({ url: '/system/mail-log/get?id=' + id })
 }
diff --git a/src/types/descriptions.d.ts b/src/types/descriptions.d.ts
index 48835e9c5..35c0b81be 100644
--- a/src/types/descriptions.d.ts
+++ b/src/types/descriptions.d.ts
@@ -8,6 +8,6 @@ export interface DescriptionsSchema {
   labelAlign?: 'left' | 'center' | 'right'
   className?: string
   labelClassName?: string
-  dateFormat?: string
-  dictType?: string
+  dateFormat?: string // add by 星语：支持时间的格式化
+  dictType?: string // add by 星语：支持 dict 字典数据
 }
diff --git a/src/views/system/mail/log/detail.vue b/src/views/system/mail/log/detail.vue
new file mode 100644
index 000000000..1795f7516
--- /dev/null
+++ b/src/views/system/mail/log/detail.vue
@@ -0,0 +1,31 @@
+<template>
+  <Dialog title="详情" v-model="modelVisible" :scroll="true" :max-height="500">
+    <Descriptions :schema="allSchemas.detailSchema" :data="detailData">
+      <!-- 展示 HTML 内容 -->
+      <template #templateContent="{ row }">
+        <div v-html="row.templateContent"></div>
+      </template>
+    </Descriptions>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import * as MailLogApi from '@/api/system/mail/log'
+import { allSchemas } from './log.data'
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const detailLoading = ref(false) // 表单的加载中
+const detailData = ref() // 详情数据
+
+/** 打开弹窗 */
+const openModal = async (id: number) => {
+  modelVisible.value = true
+  // 设置数据
+  detailLoading.value = true
+  try {
+    detailData.value = await MailLogApi.getMailLog(id)
+  } finally {
+    detailLoading.value = false
+  }
+}
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+</script>
diff --git a/src/views/system/mail/log/index.vue b/src/views/system/mail/log/index.vue
index a8b0c6c1a..f8d98b833 100644
--- a/src/views/system/mail/log/index.vue
+++ b/src/views/system/mail/log/index.vue
@@ -20,7 +20,7 @@
         <el-button
           link
           type="primary"
-          @click="openModal('update', row.id)"
+          @click="openModal(row.id)"
           v-hasPermi="['system:mail-log:query']"
         >
           详情
@@ -30,26 +30,26 @@
   </content-wrap>
 
   <!-- 表单弹窗：添加/修改 -->
-  <!--  <mail-account-form ref="modalRef" @success="getList" />-->
+  <mail-log-detail ref="modalRef" @success="getList" />
 </template>
 <script setup lang="ts" name="MailLog">
 import { allSchemas } from './log.data'
 import * as MailLogApi from '@/api/system/mail/log'
-// import MailAccountForm from './form.vue'
+import MailLogDetail from './detail.vue'
 
 // tableObject：表格的属性对象，可获得分页大小、条数等属性
 // tableMethods：表格的操作对象，可进行获得分页、删除记录等操作
 // 详细可见：https://kailong110120130.gitee.io/vue-element-plus-admin-doc/components/table.html#usetable
 const { tableObject, tableMethods } = useTable({
-  getListApi: MailLogApi.getMailLogPageApi // 分页接口
+  getListApi: MailLogApi.getMailLogPage // 分页接口
 })
 // 获得表格的各种操作
 const { getList, setSearchParams } = tableMethods
 
 /** 添加/修改操作 */
 const modalRef = ref()
-const openModal = (type: string, id?: number) => {
-  modalRef.value.openModal(type, id)
+const openModal = (id: number) => {
+  modalRef.value.openModal(id)
 }
 
 /** 初始化 **/
diff --git a/src/views/system/mail/log/log.data.ts b/src/views/system/mail/log/log.data.ts
index e3679535e..8ea96926a 100644
--- a/src/views/system/mail/log/log.data.ts
+++ b/src/views/system/mail/log/log.data.ts
@@ -23,6 +23,9 @@ const crudSchemas = reactive<CrudSchema[]>([
         type: 'daterange',
         defaultTime: [new Date('1 00:00:00'), new Date('1 23:59:59')]
       }
+    },
+    detail: {
+      dateFormat: 'YYYY-MM-DD HH:mm:ss'
     }
   },
   {
@@ -116,12 +119,15 @@ const crudSchemas = reactive<CrudSchema[]>([
     label: '创建时间',
     field: 'createTime',
     isTable: false,
-    formatter: dateFormatter
+    formatter: dateFormatter,
+    detail: {
+      dateFormat: 'YYYY-MM-DD HH:mm:ss'
+    }
   },
   {
     label: '操作',
     field: 'action',
-    isForm: false
+    isDetail: false
   }
 ])
 export const { allSchemas } = useCrudSchemas(crudSchemas)

From c9a30e6fbf36ef8f3d8fa3be1ab3306163f1cdc5 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 19:00:58 +0800
Subject: [PATCH 37/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E6=93=8D=E4=BD=9C=E6=97=A5=E5=BF=97=E7=9A=84=E5=88=97=E8=A1=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/operatelog/index.ts    |  12 +-
 src/views/infra/config/index.vue      |   2 +-
 src/views/system/notice/index.vue     |   8 +-
 src/views/system/operatelog/index.vue | 233 +++++++++++++++++++-------
 4 files changed, 184 insertions(+), 71 deletions(-)

diff --git a/src/api/system/operatelog/index.ts b/src/api/system/operatelog/index.ts
index 5fd31dbac..848a53333 100644
--- a/src/api/system/operatelog/index.ts
+++ b/src/api/system/operatelog/index.ts
@@ -23,19 +23,11 @@ export type OperateLogVO = {
   resultData: string
 }
 
-export interface OperateLogPageReqVO extends PageParam {
-  module?: string
-  userNickname?: string
-  type?: number
-  success?: boolean
-  startTime?: Date[]
-}
-
 // 查询操作日志列表
-export const getOperateLogPageApi = (params: OperateLogPageReqVO) => {
+export const getOperateLogPage = (params: PageParam) => {
   return request.get({ url: '/system/operate-log/page', params })
 }
 // 导出操作日志
-export const exportOperateLogApi = (params: OperateLogPageReqVO) => {
+export const exportOperateLog = (params) => {
   return request.download({ url: '/system/operate-log/export', params })
 }
diff --git a/src/views/infra/config/index.vue b/src/views/infra/config/index.vue
index 0136a9d51..11fc8fe05 100644
--- a/src/views/infra/config/index.vue
+++ b/src/views/infra/config/index.vue
@@ -59,7 +59,7 @@
 
   <!-- 列表 -->
   <content-wrap>
-    <el-table v-loading="loading" :data="list" align="center">
+    <el-table v-loading="loading" :data="list">
       <el-table-column label="参数主键" align="center" prop="id" />
       <el-table-column label="参数分类" align="center" prop="category" />
       <el-table-column label="参数名称" align="center" prop="name" :show-overflow-tooltip="true" />
diff --git a/src/views/system/notice/index.vue b/src/views/system/notice/index.vue
index 8add0eaba..e36f3aace 100644
--- a/src/views/system/notice/index.vue
+++ b/src/views/system/notice/index.vue
@@ -1,7 +1,7 @@
 <template>
   <content-wrap>
     <!-- 搜索工作栏 -->
-    <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+    <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true">
       <el-form-item label="公告标题" prop="title">
         <el-input
           v-model="queryParams.title"
@@ -32,9 +32,11 @@
         </el-button>
       </el-form-item>
     </el-form>
+  </content-wrap>
 
-    <!-- 列表 -->
-    <el-table v-loading="loading" :data="list" align="center">
+  <!-- 列表 -->
+  <content-wrap>
+    <el-table v-loading="loading" :data="list">
       <el-table-column label="公告编号" align="center" prop="id" />
       <el-table-column label="公告标题" align="center" prop="title" />
       <el-table-column label="公告类型" align="center" prop="type">
diff --git a/src/views/system/operatelog/index.vue b/src/views/system/operatelog/index.vue
index 7f1e9bb44..f4de18a2a 100644
--- a/src/views/system/operatelog/index.vue
+++ b/src/views/system/operatelog/index.vue
@@ -1,67 +1,186 @@
 <template>
-  <ContentWrap>
-    <!-- 列表 -->
-    <XTable @register="registerTable">
-      <template #toolbar_buttons>
-        <!-- 操作：新增 -->
-        <XButton
-          type="warning"
-          preIcon="ep:download"
-          :title="t('action.export')"
-          v-hasPermi="['system:operate-log:export']"
-          @click="exportList('操作日志.xls')"
+  <content-wrap>
+    <!-- 搜索工作栏 -->
+    <el-form class="-mb-15px" :model="queryParams" ref="queryFormRef" :inline="true">
+      <el-form-item label="系统模块" prop="module">
+        <el-input
+          v-model="queryParams.module"
+          placeholder="请输入系统模块"
+          clearable
+          @keyup.enter="handleQuery"
         />
-      </template>
-      <template #duration="{ row }">
-        <span>{{ row.duration + 'ms' }}</span>
-      </template>
-      <template #resultCode="{ row }">
-        <span>{{ row.resultCode === 0 ? '成功' : '失败' }}</span>
-      </template>
-      <template #actionbtns_default="{ row }">
-        <!-- 操作：详情 -->
-        <XTextButton preIcon="ep:view" :title="t('action.detail')" @click="handleDetail(row)" />
-      </template>
-    </XTable>
-  </ContentWrap>
-  <!-- 弹窗 -->
-  <XModal id="postModel" v-model="dialogVisible" :title="t('action.detail')">
-    <!-- 对话框(详情) -->
-    <Descriptions :schema="allSchemas.detailSchema" :data="detailData">
-      <template #resultCode="{ row }">
-        <span>{{ row.resultCode === 0 ? '成功' : '失败' }}</span>
-      </template>
-      <template #duration="{ row }">
-        <span>{{ row.duration + 'ms' }}</span>
-      </template>
-    </Descriptions>
-    <template #footer>
-      <!-- 按钮：关闭 -->
-      <XButton :loading="actionLoading" :title="t('dialog.close')" @click="dialogVisible = false" />
-    </template>
-  </XModal>
+      </el-form-item>
+      <el-form-item label="操作人员" prop="userNickname">
+        <el-input
+          v-model="queryParams.userNickname"
+          placeholder="请输入操作人员"
+          clearable
+          @keyup.enter="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="类型" prop="type">
+        <el-select v-model="queryParams.type" placeholder="操作类型" clearable>
+          <el-option
+            v-for="dict in getDictOptions(DICT_TYPE.INFRA_CONFIG_TYPE)"
+            :key="parseInt(dict.value)"
+            :label="dict.label"
+            :value="parseInt(dict.value)"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="状态" prop="success">
+        <el-select v-model="queryParams.success" placeholder="操作状态" clearable>
+          <el-option :key="true" label="成功" :value="true" />
+          <el-option :key="false" label="失败" :value="false" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="操作时间" prop="startTime">
+        <el-date-picker
+          v-model="queryParams.startTime"
+          value-format="YYYY-MM-DD HH:mm:ss"
+          type="daterange"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+        <el-button
+          type="success"
+          plain
+          @click="handleExport"
+          :loading="exportLoading"
+          v-hasPermi="['infra:config:export']"
+        >
+          <Icon icon="ep:download" class="mr-5px" /> 导出
+        </el-button>
+      </el-form-item>
+    </el-form>
+  </content-wrap>
+
+  <!-- 列表 -->
+  <content-wrap>
+    <el-table v-loading="loading" :data="list">
+      <el-table-column label="日志编号" align="center" prop="id" />
+      <el-table-column label="操作模块" align="center" prop="module" width="180" />
+      <el-table-column label="操作名" align="center" prop="name" width="180" />
+      <el-table-column label="操作类型" align="center" prop="type">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.SYSTEM_OPERATE_TYPE" :value="scope.row.type" />
+        </template>
+      </el-table-column>
+      <el-table-column label="操作人" align="center" prop="userNickname" />
+      <el-table-column label="操作结果" align="center" prop="status">
+        <template #default="scope">
+          <span>{{ scope.row.resultCode === 0 ? '成功' : '失败' }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="操作时间"
+        align="center"
+        prop="startTime"
+        width="180"
+        :formatter="dateFormatter"
+      />
+      <el-table-column label="执行时长" align="center" prop="startTime">
+        <template #default="scope">
+          <span>{{ scope.row.duration }} ms</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center">
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            @click="openModal('update', scope.row.id)"
+            v-hasPermi="['infra:config:query']"
+          >
+            详情
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </content-wrap>
 </template>
 <script setup lang="ts" name="OperateLog">
-// 业务相关的 import
+import { DICT_TYPE, getDictOptions } from '@/utils/dict'
+import { dateFormatter } from '@/utils/formatTime'
+import download from '@/utils/download'
 import * as OperateLogApi from '@/api/system/operatelog'
-import { allSchemas } from './operatelog.data'
+// import ConfigForm from './form.vue'
+const message = useMessage() // 消息弹窗
 
-const { t } = useI18n() // 国际化
-// 列表相关的变量
-const [registerTable, { exportList }] = useXTable({
-  allSchemas: allSchemas,
-  getListApi: OperateLogApi.getOperateLogPageApi,
-  exportListApi: OperateLogApi.exportOperateLogApi
+const loading = ref(true) // 列表的加载中
+const total = ref(0) // 列表的总页数
+const list = ref([]) // 列表的数据
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  module: undefined,
+  userNickname: undefined,
+  type: undefined,
+  success: undefined,
+  startTime: []
 })
+const queryFormRef = ref() // 搜索的表单
+const exportLoading = ref(false) // 导出的加载中
 
-// 弹窗相关的变量
-const dialogVisible = ref(false) // 是否显示弹出层
-const actionLoading = ref(false) // 按钮 Loading
-const detailData = ref() // 详情 Ref
-// 详情
-const handleDetail = (row: OperateLogApi.OperateLogVO) => {
-  // 设置数据
-  detailData.value = row
-  dialogVisible.value = true
+/** 查询参数列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await OperateLogApi.getOperateLogPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
 }
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+/** 添加/修改操作 */
+// const modalRef = ref()
+// const openModal = (type: string, id?: number) => {
+//   modalRef.value.openModal(type, id)
+// }
+
+/** 导出按钮操作 */
+const handleExport = async () => {
+  try {
+    // 导出的二次确认
+    await message.exportConfirm()
+    // 发起导出
+    exportLoading.value = true
+    const data = await OperateLogApi.exportOperateLog(queryParams)
+    download.excel(data, '操作日志.xls')
+  } catch {
+  } finally {
+    exportLoading.value = false
+  }
+}
+
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
 </script>

From e669dffddc29e335300dd0953cc2580b0e0ec796 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 20:09:30 +0800
Subject: [PATCH 38/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E6=93=8D=E4=BD=9C=E6=97=A5=E5=BF=97=E7=9A=84=E8=AF=A6=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/formatTime.ts                       |  52 +--------
 src/views/system/mail/log/index.vue           |   6 +-
 src/views/system/operatelog/detail.vue        |  80 +++++++++++++
 src/views/system/operatelog/index.vue         |  19 ++--
 .../system/operatelog/operatelog.data.ts      | 106 ------------------
 5 files changed, 95 insertions(+), 168 deletions(-)
 create mode 100644 src/views/system/operatelog/detail.vue
 delete mode 100644 src/views/system/operatelog/operatelog.data.ts

diff --git a/src/utils/formatTime.ts b/src/utils/formatTime.ts
index 396712790..2582beeed 100644
--- a/src/utils/formatTime.ts
+++ b/src/utils/formatTime.ts
@@ -12,57 +12,7 @@ import dayjs from 'dayjs'
  * @returns 返回拼接后的时间字符串
  */
 export function formatDate(date: Date, format: string): string {
-  const we = date.getDay() // 星期
-  const z = getWeek(date) // 周
-  const qut = Math.floor((date.getMonth() + 3) / 3).toString() // 季度
-  const opt: { [key: string]: string } = {
-    'Y+': date.getFullYear().toString(), // 年
-    'm+': (date.getMonth() + 1).toString(), // 月(月份从0开始，要+1)
-    'd+': date.getDate().toString(), // 日
-    'H+': date.getHours().toString(), // 时
-    'M+': date.getMinutes().toString(), // 分
-    'S+': date.getSeconds().toString(), // 秒
-    'q+': qut // 季度
-  }
-  // 中文数字 (星期)
-  const week: { [key: string]: string } = {
-    '0': '日',
-    '1': '一',
-    '2': '二',
-    '3': '三',
-    '4': '四',
-    '5': '五',
-    '6': '六'
-  }
-  // 中文数字（季度）
-  const quarter: { [key: string]: string } = {
-    '1': '一',
-    '2': '二',
-    '3': '三',
-    '4': '四'
-  }
-  if (/(W+)/.test(format))
-    format = format.replace(
-      RegExp.$1,
-      RegExp.$1.length > 1 ? (RegExp.$1.length > 2 ? '星期' + week[we] : '周' + week[we]) : week[we]
-    )
-  if (/(Q+)/.test(format))
-    format = format.replace(
-      RegExp.$1,
-      RegExp.$1.length == 4 ? '第' + quarter[qut] + '季度' : quarter[qut]
-    )
-  if (/(Z+)/.test(format))
-    format = format.replace(RegExp.$1, RegExp.$1.length == 3 ? '第' + z + '周' : z + '')
-  for (const k in opt) {
-    const r = new RegExp('(' + k + ')').exec(format)
-    // 若输入的长度不为1，则前面补零
-    if (r)
-      format = format.replace(
-        r[1],
-        RegExp.$1.length == 1 ? opt[k] : opt[k].padStart(RegExp.$1.length, '0')
-      )
-  }
-  return format
+  return dayjs(date).format(format)
 }
 
 /**
diff --git a/src/views/system/mail/log/index.vue b/src/views/system/mail/log/index.vue
index f8d98b833..5373b71d2 100644
--- a/src/views/system/mail/log/index.vue
+++ b/src/views/system/mail/log/index.vue
@@ -29,8 +29,8 @@
     </Table>
   </content-wrap>
 
-  <!-- 表单弹窗：添加/修改 -->
-  <mail-log-detail ref="modalRef" @success="getList" />
+  <!-- 表单弹窗：详情 -->
+  <mail-log-detail ref="modalRef" />
 </template>
 <script setup lang="ts" name="MailLog">
 import { allSchemas } from './log.data'
@@ -46,7 +46,7 @@ const { tableObject, tableMethods } = useTable({
 // 获得表格的各种操作
 const { getList, setSearchParams } = tableMethods
 
-/** 添加/修改操作 */
+/** 详情操作 */
 const modalRef = ref()
 const openModal = (id: number) => {
   modalRef.value.openModal(id)
diff --git a/src/views/system/operatelog/detail.vue b/src/views/system/operatelog/detail.vue
new file mode 100644
index 000000000..6c856e951
--- /dev/null
+++ b/src/views/system/operatelog/detail.vue
@@ -0,0 +1,80 @@
+<template>
+  <Dialog title="详情" v-model="modelVisible" :scroll="true" :max-height="500" width="800">
+    <el-descriptions border :column="1">
+      <el-descriptions-item label="日志主键" min-width="120">
+        {{ detailData.id }}
+      </el-descriptions-item>
+      <el-descriptions-item label="链路追踪">
+        {{ detailData.traceId }}
+      </el-descriptions-item>
+      <el-descriptions-item label="操作人编号">
+        {{ detailData.userId }}
+      </el-descriptions-item>
+      <el-descriptions-item label="操作人名字">
+        {{ detailData.userNickname }}
+      </el-descriptions-item>
+      <el-descriptions-item label="操作人 IP">
+        {{ detailData.userIp }}
+      </el-descriptions-item>
+      <el-descriptions-item label="操作人 UA">
+        {{ detailData.userAgent }}
+      </el-descriptions-item>
+      <el-descriptions-item label="操作模块">
+        {{ detailData.module }}
+      </el-descriptions-item>
+      <el-descriptions-item label="操作名">
+        {{ detailData.name }}
+      </el-descriptions-item>
+      <el-descriptions-item label="操作内容" v-if="detailData.content">
+        {{ detailData.content }}
+      </el-descriptions-item>
+      <el-descriptions-item label="操作拓展参数" v-if="detailData.exts">
+        {{ detailData.exts }}
+      </el-descriptions-item>
+      <el-descriptions-item label="请求 URL">
+        {{ detailData.requestMethod }} {{ detailData.requestUrl }}
+      </el-descriptions-item>
+      <el-descriptions-item label="Java 方法名">
+        {{ detailData.javaMethod }}
+      </el-descriptions-item>
+      <el-descriptions-item label="Java 方法参数">
+        {{ detailData.javaMethodArgs }}
+      </el-descriptions-item>
+      <el-descriptions-item label="操作时间">
+        {{ formatDate(detailData.startTime, 'YYYY-MM-DD HH:mm:ss') }}
+      </el-descriptions-item>
+      <el-descriptions-item label="执行时长">{{ detailData.duration }} ms</el-descriptions-item>
+      <el-descriptions-item label="操作结果">
+        <div v-if="detailData.resultCode === 0">正常</div>
+        <div v-else>失败({{ detailData.resultCode }})</div>
+      </el-descriptions-item>
+      <el-descriptions-item label="操作结果" v-if="detailData.resultCode === 0">
+        {{ detailData.resultData }}
+      </el-descriptions-item>
+      <el-descriptions-item label="失败提示" v-if="detailData.resultCode > 0">
+        {{ detailData.resultMsg }}
+      </el-descriptions-item>
+    </el-descriptions>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import { formatDate } from '@/utils/formatTime'
+import * as OperateLogApi from '@/api/system/operatelog'
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const detailLoading = ref(false) // 表单的加载中
+const detailData = ref() // 详情数据
+
+/** 打开弹窗 */
+const openModal = async (data: OperateLogApi.OperateLogVO) => {
+  modelVisible.value = true
+  // 设置数据
+  detailLoading.value = true
+  try {
+    detailData.value = data
+  } finally {
+    detailLoading.value = false
+  }
+}
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+</script>
diff --git a/src/views/system/operatelog/index.vue b/src/views/system/operatelog/index.vue
index f4de18a2a..f96679124 100644
--- a/src/views/system/operatelog/index.vue
+++ b/src/views/system/operatelog/index.vue
@@ -21,7 +21,7 @@
       <el-form-item label="类型" prop="type">
         <el-select v-model="queryParams.type" placeholder="操作类型" clearable>
           <el-option
-            v-for="dict in getDictOptions(DICT_TYPE.INFRA_CONFIG_TYPE)"
+            v-for="dict in getDictOptions(DICT_TYPE.SYSTEM_OPERATE_TYPE)"
             :key="parseInt(dict.value)"
             :label="dict.label"
             :value="parseInt(dict.value)"
@@ -94,7 +94,7 @@
           <el-button
             link
             type="primary"
-            @click="openModal('update', scope.row.id)"
+            @click="openModal(scope.row)"
             v-hasPermi="['infra:config:query']"
           >
             详情
@@ -110,13 +110,16 @@
       @pagination="getList"
     />
   </content-wrap>
+
+  <!-- 表单弹窗：详情 -->
+  <operate-log-detail ref="modalRef" />
 </template>
 <script setup lang="ts" name="OperateLog">
 import { DICT_TYPE, getDictOptions } from '@/utils/dict'
 import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 import * as OperateLogApi from '@/api/system/operatelog'
-// import ConfigForm from './form.vue'
+import OperateLogDetail from './detail.vue'
 const message = useMessage() // 消息弹窗
 
 const loading = ref(true) // 列表的加载中
@@ -158,11 +161,11 @@ const resetQuery = () => {
   handleQuery()
 }
 
-/** 添加/修改操作 */
-// const modalRef = ref()
-// const openModal = (type: string, id?: number) => {
-//   modalRef.value.openModal(type, id)
-// }
+/** 详情操作 */
+const modalRef = ref()
+const openModal = (data: OperateLogApi.OperateLogVO) => {
+  modalRef.value.openModal(data)
+}
 
 /** 导出按钮操作 */
 const handleExport = async () => {
diff --git a/src/views/system/operatelog/operatelog.data.ts b/src/views/system/operatelog/operatelog.data.ts
deleted file mode 100644
index f8b4ef90a..000000000
--- a/src/views/system/operatelog/operatelog.data.ts
+++ /dev/null
@@ -1,106 +0,0 @@
-import type { VxeCrudSchema } from '@/hooks/web/useVxeCrudSchemas'
-
-const { t } = useI18n() // 国际化
-
-const crudSchemas = reactive<VxeCrudSchema>({
-  primaryKey: 'id',
-  primaryType: 'id',
-  primaryTitle: '日志编号',
-  action: true,
-  actionWidth: '80px',
-  columns: [
-    {
-      title: '操作模块',
-      field: 'module',
-      isSearch: true
-    },
-    {
-      title: '操作名',
-      field: 'name'
-    },
-    {
-      title: '操作类型',
-      field: 'type',
-      dictType: DICT_TYPE.SYSTEM_OPERATE_TYPE,
-      dictClass: 'number',
-      isSearch: true
-    },
-    {
-      title: '请求方法名',
-      field: 'requestMethod',
-      isTable: false
-    },
-    {
-      title: '请求地址',
-      field: 'requestUrl',
-      isTable: false
-    },
-    {
-      title: '操作人员',
-      field: 'userNickname',
-      isSearch: true
-    },
-    {
-      title: '操作明细',
-      field: 'content',
-      isTable: false
-    },
-    {
-      title: '用户 IP',
-      field: 'userIp',
-      isTable: false
-    },
-    {
-      title: 'userAgent',
-      field: 'userAgent'
-    },
-    {
-      title: '操作结果',
-      field: 'resultCode',
-      table: {
-        slots: {
-          default: 'resultCode'
-        }
-      }
-    },
-    {
-      title: '操作结果',
-      field: 'success',
-      isTable: false,
-      isDetail: false,
-      search: {
-        show: true,
-        itemRender: {
-          name: '$select',
-          props: { placeholder: t('common.selectText') },
-          options: [
-            { label: '成功', value: 'true' },
-            { label: '失败', value: 'false' }
-          ]
-        }
-      }
-    },
-    {
-      title: '操作日期',
-      field: 'startTime',
-      formatter: 'formatDate',
-      isForm: false,
-      search: {
-        show: true,
-        itemRender: {
-          name: 'XDataTimePicker'
-        }
-      }
-    },
-    {
-      title: '执行时长',
-      field: 'duration',
-      table: {
-        slots: {
-          default: 'duration'
-        }
-      }
-    }
-  ]
-})
-export const { allSchemas } = useVxeCrudSchemas(crudSchemas)

From c56a887767fd1a132b01d6ca15d5a00dbd6f0777 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 21:45:58 +0800
Subject: [PATCH 39/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E5=9C=B0=E5=8C=BA=E6=8E=A5=E5=85=A5=20TableV2=20=E9=AB=98?=
 =?UTF-8?q?=E6=80=A7=E8=83=BD=E8=A1=A8=E6=A0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/area/index.ts    | 11 ++++++++
 src/views/system/area/index.vue | 46 +++++++++++++++++++++++++++++++++
 2 files changed, 57 insertions(+)
 create mode 100644 src/api/system/area/index.ts
 create mode 100644 src/views/system/area/index.vue

diff --git a/src/api/system/area/index.ts b/src/api/system/area/index.ts
new file mode 100644
index 000000000..f77ce0d10
--- /dev/null
+++ b/src/api/system/area/index.ts
@@ -0,0 +1,11 @@
+import request from '@/config/axios'
+
+// 获得地区树
+export const getAreaTree = async () => {
+  return await request.get({ url: '/system/area/tree' })
+}
+
+// 获得 IP 对应的地区名
+export const getDeptApi = async (ip: string) => {
+  return await request.get({ url: '/system/area/get-by-ip?ip=' + ip })
+}
diff --git a/src/views/system/area/index.vue b/src/views/system/area/index.vue
new file mode 100644
index 000000000..dcb659c3e
--- /dev/null
+++ b/src/views/system/area/index.vue
@@ -0,0 +1,46 @@
+<template>
+  <ContentWrap>
+    <div style="width: 100%; height: 500px">
+      <el-auto-resizer>
+        <template #default="{ height, width }">
+          <el-table-v2
+            :columns="columns"
+            :data="tableData"
+            :width="width"
+            :height="height"
+            fixed
+            expand-column-key="id"
+          />
+        </template>
+      </el-auto-resizer>
+    </div>
+  </ContentWrap>
+</template>
+<script setup lang="tsx">
+import { Column, ElTableV2 } from 'element-plus'
+import * as AreaApi from '@/api/system/area'
+
+const columns: Column[] = [
+  {
+    key: 'id',
+    dataKey: 'id', // 需要渲染当前列的数据字段，如{id:9527,name:'Mike'}，则填id
+    title: '编号', // 显示在单元格表头的文本
+    width: 200, // 当前列的宽度，必须设置
+    fixed: true // 是否固定列
+  },
+  {
+    key: 'name',
+    dataKey: 'name',
+    title: '地名',
+    width: 200
+  }
+]
+
+const tableData = ref([])
+
+const getList = async () => {
+  tableData.value = await AreaApi.getAreaTree()
+}
+
+getList()
+</script>

From 2cf384d7abfeb0d30adf6b0b7a5a02bd9baace21 Mon Sep 17 00:00:00 2001
From: YunaiV <zhijiantianya@gmail.com>
Date: Sat, 18 Mar 2023 22:29:08 +0800
Subject: [PATCH 40/40] =?UTF-8?q?Vue3=20=E9=87=8D=E6=9E=84=EF=BC=9A?=
 =?UTF-8?q?=E5=9C=B0=E5=8C=BA=E6=8E=A5=E5=85=A5=20TableV2=20=E9=AB=98?=
 =?UTF-8?q?=E6=80=A7=E8=83=BD=E8=A1=A8=E6=A0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/area/index.ts    |  2 +-
 src/types/auto-components.d.ts  |  1 +
 src/views/system/area/form.vue  | 71 +++++++++++++++++++++++++++++++++
 src/views/system/area/index.vue | 57 ++++++++++++++++++--------
 4 files changed, 114 insertions(+), 17 deletions(-)
 create mode 100644 src/views/system/area/form.vue

diff --git a/src/api/system/area/index.ts b/src/api/system/area/index.ts
index f77ce0d10..e91a4997c 100644
--- a/src/api/system/area/index.ts
+++ b/src/api/system/area/index.ts
@@ -6,6 +6,6 @@ export const getAreaTree = async () => {
 }
 
 // 获得 IP 对应的地区名
-export const getDeptApi = async (ip: string) => {
+export const getAreaByIp = async (ip: string) => {
   return await request.get({ url: '/system/area/get-by-ip?ip=' + ip })
 }
diff --git a/src/types/auto-components.d.ts b/src/types/auto-components.d.ts
index 7b10d6797..be71517ca 100644
--- a/src/types/auto-components.d.ts
+++ b/src/types/auto-components.d.ts
@@ -73,6 +73,7 @@ declare module '@vue/runtime-core' {
     ElSwitch: typeof import('element-plus/es')['ElSwitch']
     ElTable: typeof import('element-plus/es')['ElTable']
     ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+    ElTableV2: typeof import('element-plus/es')['ElTableV2']
     ElTabPane: typeof import('element-plus/es')['ElTabPane']
     ElTabs: typeof import('element-plus/es')['ElTabs']
     ElTag: typeof import('element-plus/es')['ElTag']
diff --git a/src/views/system/area/form.vue b/src/views/system/area/form.vue
new file mode 100644
index 000000000..4e61fe322
--- /dev/null
+++ b/src/views/system/area/form.vue
@@ -0,0 +1,71 @@
+<template>
+  <Dialog title="IP 查询" v-model="modelVisible">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="80px"
+      v-loading="formLoading"
+    >
+      <el-form-item label="IP" prop="ip">
+        <el-input v-model="formData.ip" placeholder="请输入 IP 地址" />
+      </el-form-item>
+      <el-form-item label="地址" prop="result">
+        <el-input v-model="formData.result" readonly placeholder="展示查询 IP 结果" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+        <el-button @click="modelVisible = false">取 消</el-button>
+      </div>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import * as AreaApi from '@/api/system/area'
+const message = useMessage() // 消息弹窗
+
+const modelVisible = ref(false) // 弹窗的是否展示
+const formLoading = ref(false) // 表单的加载中：提交的按钮禁用
+const formData = ref({
+  ip: '',
+  result: undefined
+})
+const formRules = reactive({
+  ip: [{ required: true, message: 'IP 地址不能为空', trigger: 'blur' }]
+})
+const formRef = ref() // 表单 Ref
+
+/** 打开弹窗 */
+const openModal = async () => {
+  modelVisible.value = true
+  resetForm()
+}
+defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
+
+/** 提交表单 */
+const submitForm = async () => {
+  // 校验表单
+  if (!formRef) return
+  const valid = await formRef.value.validate()
+  if (!valid) return
+  // 提交请求
+  formLoading.value = true
+  try {
+    formData.value.result = await AreaApi.getAreaByIp(formData.value.ip!.trim())
+    message.success('查询成功')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    ip: '',
+    result: undefined
+  }
+  formRef.value?.resetFields()
+}
+</script>
diff --git a/src/views/system/area/index.vue b/src/views/system/area/index.vue
index dcb659c3e..f9d4c57de 100644
--- a/src/views/system/area/index.vue
+++ b/src/views/system/area/index.vue
@@ -1,46 +1,71 @@
 <template>
-  <ContentWrap>
-    <div style="width: 100%; height: 500px">
+  <!-- 操作栏 -->
+  <content-wrap>
+    <el-button type="primary" @click="openModal()">
+      <Icon icon="ep:plus" class="mr-5px" /> IP 查询
+    </el-button>
+  </content-wrap>
+
+  <!-- 列表 -->
+  <content-wrap>
+    <div style="width: 100%; height: 700px">
+      <!-- AutoResizer 自动调节大小 -->
       <el-auto-resizer>
         <template #default="{ height, width }">
+          <!-- Virtualized Table 虚拟化表格：高性能，解决表格在大数据量下的卡顿问题 -->
           <el-table-v2
             :columns="columns"
-            :data="tableData"
+            :data="list"
             :width="width"
             :height="height"
-            fixed
             expand-column-key="id"
           />
         </template>
       </el-auto-resizer>
     </div>
-  </ContentWrap>
+  </content-wrap>
+
+  <!-- 表单弹窗：添加/修改 -->
+  <area-form ref="modalRef" />
 </template>
-<script setup lang="tsx">
-import { Column, ElTableV2 } from 'element-plus'
+<script setup lang="tsx" name="Area">
+import type { Column } from 'element-plus'
+import AreaForm from './form.vue'
 import * as AreaApi from '@/api/system/area'
 
+// 表格的 column 字段
 const columns: Column[] = [
   {
-    key: 'id',
-    dataKey: 'id', // 需要渲染当前列的数据字段，如{id:9527,name:'Mike'}，则填id
+    dataKey: 'id', // 需要渲染当前列的数据字段。例如说：{id:9527, name:'Mike'}，则填 id
     title: '编号', // 显示在单元格表头的文本
-    width: 200, // 当前列的宽度，必须设置
-    fixed: true // 是否固定列
+    width: 400, // 当前列的宽度，必须设置
+    fixed: true, // 是否固定列
+    key: 'id' // 树形展开对应的 key
   },
   {
-    key: 'name',
     dataKey: 'name',
     title: '地名',
     width: 200
   }
 ]
+// 表格的数据
+const list = ref([])
 
-const tableData = ref([])
-
+/**
+ * 获得数据列表
+ */
 const getList = async () => {
-  tableData.value = await AreaApi.getAreaTree()
+  list.value = await AreaApi.getAreaTree()
 }
 
-getList()
+/** 添加/修改操作 */
+const modalRef = ref()
+const openModal = () => {
+  modalRef.value.openModal()
+}
+
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
 </script>