From 916eaa8cfe079d28ce626c8397f9ac3734383014 Mon Sep 17 00:00:00 2001
From: DaxPay <xxm1995@outlook.com>
Date: Thu, 11 Jul 2024 18:52:35 +0800
Subject: [PATCH] =?UTF-8?q?feat=20=E7=B3=BB=E7=BB=9F=E5=8F=82=E6=95=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/common/Parameter.ts                 |   4 +-
 src/logics/websocket/UserGlobalWebSocker.ts |   4 +-
 src/views/baseapi/dict/DictEdit.vue         |   5 +-
 src/views/baseapi/dict/DictItemEdit.vue     |   5 +-
 src/views/baseapi/param/SystemParam.api.ts  |  97 ++++++++++
 src/views/baseapi/param/SystemParamEdit.vue | 191 ++++++++++++++++++++
 src/views/baseapi/param/SystemParamList.vue | 152 ++++++++++++++++
 src/views/iam/client/ClientEdit.vue         |   5 +-
 src/views/iam/perm/code/PermCodeEdit.vue    |   5 +-
 src/views/iam/perm/menu/MenuEdit.vue        |   5 +-
 src/views/iam/role/RoleEdit.vue             |   5 +-
 src/views/iam/role/RoleMenuModal.vue        |   8 +-
 src/views/iam/role/RolePathModal.vue        |   8 +-
 13 files changed, 466 insertions(+), 28 deletions(-)
 create mode 100644 src/views/baseapi/param/SystemParam.api.ts
 create mode 100644 src/views/baseapi/param/SystemParamEdit.vue
 create mode 100644 src/views/baseapi/param/SystemParamList.vue

diff --git a/src/api/common/Parameter.ts b/src/api/common/Parameter.ts
index c363b6c9a..b6b6d3ec3 100644
--- a/src/api/common/Parameter.ts
+++ b/src/api/common/Parameter.ts
@@ -4,9 +4,9 @@ import { Result } from '#/axios'
 /**
  * 根据键名获取键值
  */
-export function findByParamKey(key) {
+export function findByKey(key) {
   return defHttp.get<Result<string>>({
-    url: `/system/param/findByParamKey`,
+    url: `/system/param/findByKey`,
     method: 'GET',
     params: { key },
   })
diff --git a/src/logics/websocket/UserGlobalWebSocker.ts b/src/logics/websocket/UserGlobalWebSocker.ts
index 6d9b8e464..aad424ca1 100644
--- a/src/logics/websocket/UserGlobalWebSocker.ts
+++ b/src/logics/websocket/UserGlobalWebSocker.ts
@@ -11,7 +11,7 @@ import {
 } from '@/logics/websocket/WebSockerType'
 import { publishWsEvent } from '@/logics/websocket/WebsocketNotice'
 import { useMessage } from '@/hooks/web/useMessage'
-import { findByParamKey } from '@/api/common/Parameter'
+import { findByKey } from '@/api/common/Parameter'
 import { authEcho } from '@/api/common/BaseApi.api'
 
 const { notification } = useMessage()
@@ -25,7 +25,7 @@ let wsClose: WebSocket['close']
 export async function initWebSocket() {
   const userStore = useUserStoreWithOut()
   const token = userStore.getToken
-  const { data: wsUrl } = await findByParamKey('WebsocketServerUrl')
+  const { data: wsUrl } = await findByKey('WebsocketServerUrl')
   // 判断token是否有效, 无效会自动退出
   await authEcho('')
   // 后端服务地址
diff --git a/src/views/baseapi/dict/DictEdit.vue b/src/views/baseapi/dict/DictEdit.vue
index a5b0344be..e226891cb 100644
--- a/src/views/baseapi/dict/DictEdit.vue
+++ b/src/views/baseapi/dict/DictEdit.vue
@@ -126,11 +126,10 @@
     formRef.value?.validate().then(async () => {
       confirmLoading.value = true
       if (formEditType.value === FormEditType.Add) {
-        await add(form)
+        await add(form).finally(() => (confirmLoading.value = false))
       } else if (formEditType.value === FormEditType.Edit) {
-        await update(form)
+        await update(form).finally(() => (confirmLoading.value = false))
       }
-      confirmLoading.value = false
       handleCancel()
       emits('ok')
     })
diff --git a/src/views/baseapi/dict/DictItemEdit.vue b/src/views/baseapi/dict/DictItemEdit.vue
index d29c354d7..9581bdc32 100644
--- a/src/views/baseapi/dict/DictItemEdit.vue
+++ b/src/views/baseapi/dict/DictItemEdit.vue
@@ -129,11 +129,10 @@ import { nextTick, reactive, ref, unref } from "vue";
     formRef.value?.validate().then(async () => {
       confirmLoading.value = true
       if (formEditType.value === FormEditType.Add) {
-        await add(form)
+        await add(form).finally(() => (confirmLoading.value = false))
       } else if (formEditType.value === FormEditType.Edit) {
-        await update(form)
+        await update(form).finally(() => (confirmLoading.value = false))
       }
-      confirmLoading.value = false
       handleCancel()
       emits('ok')
     })
diff --git a/src/views/baseapi/param/SystemParam.api.ts b/src/views/baseapi/param/SystemParam.api.ts
new file mode 100644
index 000000000..105f0ba14
--- /dev/null
+++ b/src/views/baseapi/param/SystemParam.api.ts
@@ -0,0 +1,97 @@
+import { defHttp } from '@/utils/http/axios'
+import { PageResult, Result } from '#/axios'
+import { BaseEntity } from '#/web'
+
+/**
+ * 分页
+ */
+export const page = (params) => {
+  return defHttp.get<Result<PageResult<SystemParam>>>({
+    url: '/system/param/page',
+    params,
+  })
+}
+
+/**
+ * 获取单条
+ */
+export const get = (id) => {
+  return defHttp.get<Result<SystemParam>>({
+    url: '/system/param/findById',
+    params: { id },
+  })
+}
+
+/**
+ * 添加
+ */
+export const add = (obj: SystemParam) => {
+  return defHttp.post({
+    url: '/system/param/add',
+    data: obj,
+  })
+}
+
+/**
+ * 更新
+ */
+export const update = (obj: SystemParam) => {
+  return defHttp.post({
+    url: '/system/param/update',
+    data: obj,
+  })
+}
+
+/**
+ * 删除
+ */
+export const del = (id) => {
+  return defHttp.delete({
+    url: '/system/param/delete',
+    params: { id },
+  })
+}
+
+/**
+ * 查询全部
+ */
+export const findAll = () => {
+  return defHttp.get<Result<Array<SystemParam>>>({
+    url: '/system/param/findAll',
+  })
+}
+
+/**
+ * 编码是否被使用
+ */
+export const existsByKey = (key: string) => {
+  return defHttp.get<Result<boolean>>({
+    url: '/system/param/existsByKey',
+    params: { key },
+  })
+}
+export const existsByKeyNotId = (key: string, id) => {
+  return defHttp.get<Result<boolean>>({
+    url: '/system/param/existsByKeyNotId',
+    params: { key, id },
+  })
+}
+/**
+ * 系统参数配置
+ */
+export interface SystemParam extends BaseEntity {
+  // 参数名称
+  name?: string
+  // 参数键名
+  key?: string
+  // 参数值
+  value?: string
+  // 参数类型
+  type?: number
+  // 是否启用
+  enable?: boolean
+  // 内置参数
+  internal?: boolean
+  // 备注
+  remark?: string
+}
diff --git a/src/views/baseapi/param/SystemParamEdit.vue b/src/views/baseapi/param/SystemParamEdit.vue
new file mode 100644
index 000000000..9097278d4
--- /dev/null
+++ b/src/views/baseapi/param/SystemParamEdit.vue
@@ -0,0 +1,191 @@
+<template>
+  <basic-modal
+    v-bind="$attrs"
+    :loading="confirmLoading"
+    :width="modalWidth"
+    :title="title"
+    :open="visible"
+    :mask-closable="showable"
+    @cancel="handleCancel"
+  >
+    <a-form
+      class="small-from-item"
+      ref="formRef"
+      :model="form"
+      :rules="rules"
+      :label-col="labelCol"
+      :wrapper-col="wrapperCol"
+    >
+      <a-form-item label="主键" name="id" :hidden="true">
+        <a-input v-model:value="form.id" :disabled="showable" />
+      </a-form-item>
+      <a-form-item label="参数名称" name="name">
+        <a-input
+          v-model:value="form.name"
+          :disabled="showable || form.internal"
+          placeholder="请输入参数名称"
+        />
+      </a-form-item>
+      <a-form-item label="参数Key" name="key">
+        <a-input
+          v-model:value="form.key"
+          :disabled="showable || form.internal"
+          placeholder="请输入参数键名"
+        />
+      </a-form-item>
+      <a-form-item label="参数值" name="value">
+        <a-input v-model:value="form.value" :disabled="showable" placeholder="请输入参数值" />
+      </a-form-item>
+<!--      <a-form-item label="参数类型" name="type">-->
+<!--        <a-select-->
+<!--          allowClear-->
+<!--          :options="paramTypeList"-->
+<!--          style="width: 220px"-->
+<!--          :disabled="showable"-->
+<!--          v-model:value="form.type"-->
+<!--          placeholder="请选择状态"-->
+<!--        />-->
+<!--      </a-form-item>-->
+      <a-form-item label="是否启用" name="enable">
+        <a-switch
+          checked-children="启用"
+          un-checked-children="停用"
+          v-model:checked="form.enable"
+          :disabled="showable"
+        />
+      </a-form-item>
+      <a-form-item v-if="showable" label="系统内置" name="internal">
+        <a-switch
+          checked-children="是"
+          un-checked-children="否"
+          v-model:checked="form.internal"
+          disabled
+        />
+      </a-form-item>
+      <a-form-item label="备注" name="remark">
+        <a-textarea
+          :rows="3"
+          v-model:value="form.remark"
+          :disabled="showable"
+          placeholder="请输入备注"
+        />
+      </a-form-item>
+    </a-form>
+    <template #footer>
+      <a-space>
+        <a-button key="cancel" @click="handleCancel">取消</a-button>
+        <a-button
+          v-if="!showable"
+          key="forward"
+          :loading="confirmLoading"
+          type="primary"
+          @click="handleOk"
+          >保存</a-button
+        >
+      </a-space>
+    </template>
+  </basic-modal>
+</template>
+
+<script lang="ts" setup>
+  import { nextTick, reactive, ref } from 'vue'
+  import useFormEdit from '@/hooks/bootx/useFormEdit'
+  import { add, get, update, existsByKey, existsByKeyNotId, SystemParam } from './SystemParam.api'
+  import { FormInstance, Rule } from 'ant-design-vue/lib/form'
+  import { FormEditType } from '@/enums/formTypeEnum'
+  import { BasicModal } from '@/components/Modal'
+  import { useValidate } from '@/hooks/bootx/useValidate'
+  import { useDict } from '@/hooks/bootx/useDict'
+  import { LabeledValue } from 'ant-design-vue/lib/select'
+
+  const {
+    initFormEditType,
+    handleCancel,
+    labelCol,
+    wrapperCol,
+    modalWidth,
+    title,
+    confirmLoading,
+    visible,
+    showable,
+    formEditType,
+  } = useFormEdit()
+  const { existsByServer } = useValidate()
+  const { dictDropDownNumber } = useDict()
+
+  // 表单
+  const formRef = ref<FormInstance>()
+  let form = ref<SystemParam>({
+    id: null,
+    name: '',
+    key: '',
+    value: '',
+    enable: true,
+    type: undefined,
+    internal: false,
+    remark: '',
+  })
+  // 参数类型
+  let paramTypeList = ref<LabeledValue[]>([])
+  // 校验
+  const rules = reactive({
+    name: [{ required: true, message: '参数名称必填', trigger: ['blur', 'change'] }],
+    key: [
+      { required: true, message: '参数Key必填', trigger: ['blur', 'change'] },
+      { validator: validateKey, trigger: 'blur' },
+    ],
+    value: [{ required: true, message: '参数内容必填', trigger: ['blur', 'change'] }],
+    // type: [{ required: true, message: '参数类型必填', trigger: ['blur', 'change'] }],
+  } as Record<string, Rule[]>)
+  // 事件
+  const emits = defineEmits(['ok'])
+  // 入口
+  function init(id, editType: FormEditType) {
+    initFormEditType(editType)
+    resetForm()
+    getInfo(id, editType)
+    dictDropDownNumber('ParamType').then((res) => (paramTypeList.value = res))
+  }
+  // 获取信息
+  function getInfo(id, editType: FormEditType) {
+    if ([FormEditType.Edit, FormEditType.Show].includes(editType)) {
+      confirmLoading.value = true
+      get(id).then(({ data }) => {
+        form.value = data
+        confirmLoading.value = false
+      })
+    } else {
+      confirmLoading.value = false
+    }
+  }
+  // 保存
+  function handleOk() {
+    formRef.value?.validate().then(async () => {
+      confirmLoading.value = true
+      if (formEditType.value === FormEditType.Add) {
+        await add(form.value).finally(() => (confirmLoading.value = false))
+      } else if (formEditType.value === FormEditType.Edit) {
+        await update(form.value).finally(() => (confirmLoading.value = false))
+      }
+      handleCancel()
+      emits('ok')
+    })
+  }
+
+  // 重置表单的校验
+  function resetForm() {
+    nextTick(() => {
+      formRef.value?.resetFields()
+    })
+  }
+  // 校验key值
+  async function validateKey() {
+    const { key, id } = form.value
+    return existsByServer(key, id, formEditType.value, existsByKey, existsByKeyNotId, '该Key已存在')
+  }
+  defineExpose({
+    init,
+  })
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/views/baseapi/param/SystemParamList.vue b/src/views/baseapi/param/SystemParamList.vue
new file mode 100644
index 000000000..3e8c6cc1f
--- /dev/null
+++ b/src/views/baseapi/param/SystemParamList.vue
@@ -0,0 +1,152 @@
+<template>
+  <div>
+    <div class="m-3 p-3 pt-5 bg-white">
+      <b-query
+        :query-params="model.queryParam"
+        :fields="fields"
+        @query="queryPage"
+        @reset="resetQueryParams"
+      />
+    </div>
+    <div class="m-3 p-3 bg-white">
+      <vxe-toolbar ref="xToolbar" custom :refresh="{ queryMethod: queryPage }">
+        <template #buttons>
+          <a-space>
+            <a-button type="primary" pre-icon="ant-design:plus-outlined" @click="add"
+              >新建</a-button
+            >
+          </a-space>
+        </template>
+      </vxe-toolbar>
+      <vxe-table row-id="id" ref="xTable" :data="pagination.records" :loading="loading">
+        <vxe-column type="seq" :min-width="60" />
+        <vxe-column field="name" title="参数名称" :min-width="200" />
+        <vxe-column field="key" title="参数Key" :min-width="150" />
+        <vxe-column field="value" title="参数值" :min-width="200" />
+        <vxe-column field="type" title="参数类型" :min-width="80">
+          <template #default="{ row }">
+            <a-tag>{{ dictConvert('ParamType', row.type) || '无' }}</a-tag>
+          </template>
+        </vxe-column>
+        <vxe-column field="enable" title="启用状态" :min-width="80">
+          <template #default="{ row }">
+            <a-tag v-if="row.enable" color="green">启用</a-tag>
+            <a-tag v-else color="red">停用</a-tag>
+          </template>
+        </vxe-column>
+        <vxe-column field="internal" title="内置参数" :min-width="80">
+          <template #default="{ row }">
+            <a-tag v-if="row.internal" color="red">是</a-tag>
+            <a-tag v-else color="green">否</a-tag>
+          </template>
+        </vxe-column>
+        <vxe-column field="remark" title="备注" :min-width="220" />
+        <vxe-column field="createTime" title="创建时间" :min-width="160" />
+        <vxe-column fixed="right" width="150" :showOverflow="false" title="操作" :min-width="150">
+          <template #default="{ row }">
+            <span>
+              <a href="javascript:" @click="show(row)">查看</a>
+            </span>
+            <a-divider type="vertical" />
+            <span>
+              <a href="javascript:" @click="edit(row)">编辑</a>
+            </span>
+            <template v-if="!row.internal">
+              <a-divider type="vertical" />
+              <a-popconfirm title="是否删除" @confirm="remove(row)" okText="是" cancelText="否">
+                <a href="javascript:" style="color: red">删除</a>
+              </a-popconfirm>
+            </template>
+          </template>
+        </vxe-column>
+      </vxe-table>
+      <vxe-pager
+        size="medium"
+        :loading="loading"
+        :current-page="pagination.current"
+        :page-size="pagination.size"
+        :total="pagination.total"
+        @page-change="handleTableChange"
+      />
+      <SystemParamEdit ref="systemParamEdit" @ok="queryPage" />
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { onMounted, ref } from 'vue'
+  import { del, page } from './SystemParam.api'
+  import useTablePage from '@/hooks/bootx/useTablePage'
+  import SystemParamEdit from './SystemParamEdit.vue'
+  import { VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
+  import BQuery from '/@/components/Bootx/Query/BQuery.vue'
+  import { FormEditType } from '@/enums/formTypeEnum'
+  import { useMessage } from '@/hooks/web/useMessage'
+  import { QueryField, STRING } from '@/components/Bootx/Query/Query'
+  import { useDict } from '@/hooks/bootx/useDict'
+
+  // 使用hooks
+  const {
+    handleTableChange,
+    pageQueryResHandel,
+    resetQueryParams,
+    pagination,
+    pages,
+    model,
+    loading,
+  } = useTablePage(queryPage)
+  const { createMessage } = useMessage()
+  const { dictConvert } = useDict()
+
+  // 查询条件
+  const fields = [
+    { field: 'name', type: STRING, name: '参数名称', placeholder: '请输入参数名称' },
+    { field: 'key', type: STRING, name: '参数Key', placeholder: '请输入参数Key' },
+  ] as QueryField[]
+
+  const xTable = ref<VxeTableInstance>()
+  const xToolbar = ref<VxeToolbarInstance>()
+  const systemParamEdit = ref<any>()
+
+  onMounted(() => {
+    vxeBind()
+    queryPage()
+  })
+  function vxeBind() {
+    xTable.value?.connect(xToolbar.value as VxeToolbarInstance)
+  }
+
+  // 分页查询
+  function queryPage() {
+    loading.value = true
+    page({
+      ...model.queryParam,
+      ...pages,
+    }).then(({ data }) => {
+      pageQueryResHandel(data)
+    })
+    return Promise.resolve()
+  }
+  // 新增
+  function add() {
+    systemParamEdit.value.init(null, FormEditType.Add)
+  }
+  // 查看
+  function edit(record) {
+    systemParamEdit.value.init(record.id, FormEditType.Edit)
+  }
+  // 查看
+  function show(record) {
+    systemParamEdit.value.init(record.id, FormEditType.Show)
+  }
+
+  // 删除
+  function remove(record) {
+    del(record.id).then(() => {
+      createMessage.success('删除成功')
+      queryPage()
+    })
+  }
+</script>
+
+<style lang="less" scoped></style>
diff --git a/src/views/iam/client/ClientEdit.vue b/src/views/iam/client/ClientEdit.vue
index 9f5b7d47a..54a78df80 100644
--- a/src/views/iam/client/ClientEdit.vue
+++ b/src/views/iam/client/ClientEdit.vue
@@ -115,11 +115,10 @@
     formRef.value?.validate().then(async () => {
       confirmLoading.value = true
       if (formEditType.value === FormEditType.Add) {
-        await add(form.value)
+        await add(form.value).finally(() => (confirmLoading.value = false))
       } else if (formEditType.value === FormEditType.Edit) {
-        await update(form.value)
+        await update(form.value).finally(() => (confirmLoading.value = false))
       }
-      confirmLoading.value = false
       handleCancel()
       emits('ok')
     })
diff --git a/src/views/iam/perm/code/PermCodeEdit.vue b/src/views/iam/perm/code/PermCodeEdit.vue
index b8d5bd771..340a588ab 100644
--- a/src/views/iam/perm/code/PermCodeEdit.vue
+++ b/src/views/iam/perm/code/PermCodeEdit.vue
@@ -164,11 +164,10 @@
     formRef.value?.validate().then(async () => {
       confirmLoading.value = true
       if (formEditType.value === FormEditType.Add) {
-        await add(form.value)
+        await add(form.value).finally(() => (confirmLoading.value = false))
       } else if (formEditType.value === FormEditType.Edit) {
-        await update(form.value)
+        await update(form.value).finally(() => (confirmLoading.value = false))
       }
-      confirmLoading.value = false
       handleCancel()
       emits('ok')
     })
diff --git a/src/views/iam/perm/menu/MenuEdit.vue b/src/views/iam/perm/menu/MenuEdit.vue
index faadd6915..6909d4ab5 100644
--- a/src/views/iam/perm/menu/MenuEdit.vue
+++ b/src/views/iam/perm/menu/MenuEdit.vue
@@ -274,11 +274,10 @@
     formRef.value?.validate().then(async () => {
       confirmLoading.value = true
       if ([FormEditType.Add, FormEditType.Other].includes(formEditType.value)) {
-        await add(form.value)
+        await add(form.value).finally(() => (confirmLoading.value = false))
       } else if (formEditType.value === FormEditType.Edit) {
-        await update(form.value)
+        await update(form.value).finally(() => (confirmLoading.value = false))
       }
-      confirmLoading.value = false
       handleCancel()
       emits('ok')
     })
diff --git a/src/views/iam/role/RoleEdit.vue b/src/views/iam/role/RoleEdit.vue
index c9c06d993..2fd989fe7 100644
--- a/src/views/iam/role/RoleEdit.vue
+++ b/src/views/iam/role/RoleEdit.vue
@@ -154,11 +154,10 @@
     formRef.value?.validate().then(async () => {
       confirmLoading.value = true
       if (formEditType.value === FormEditType.Add) {
-        await add(unref(form))
+        await add(unref(form)).finally(() => (confirmLoading.value = false))
       } else if (formEditType.value === FormEditType.Edit) {
-        await update(unref(form))
+        await update(unref(form)).finally(() => (confirmLoading.value = false))
       }
-      confirmLoading.value = false
       handleCancel()
       emits('ok')
     })
diff --git a/src/views/iam/role/RoleMenuModal.vue b/src/views/iam/role/RoleMenuModal.vue
index 09cfa3b88..2b59d0d3a 100644
--- a/src/views/iam/role/RoleMenuModal.vue
+++ b/src/views/iam/role/RoleMenuModal.vue
@@ -171,10 +171,12 @@
       clientCode: clientCode.value,
       updateChildren,
       menuIds: checkedKeys.value,
-    }).then(() => {
-      createMessage.success('保存成功')
-      handleCancel()
     })
+      .then(() => {
+        createMessage.success('保存成功')
+        handleCancel()
+      })
+      .finally(() => (loading.value = false))
   }
 
   /**
diff --git a/src/views/iam/role/RolePathModal.vue b/src/views/iam/role/RolePathModal.vue
index 17b522112..d3ab5cd1d 100644
--- a/src/views/iam/role/RolePathModal.vue
+++ b/src/views/iam/role/RolePathModal.vue
@@ -168,10 +168,12 @@
       clientCode: clientCode.value,
       updateChildren,
       pathIds: checkedKeys.value,
-    }).then(() => {
-      createMessage.success('保存成功')
-      handleCancel()
     })
+      .then(() => {
+        createMessage.success('保存成功')
+        handleCancel()
+      })
+      .finally(() => (loading.value = false))
   }
 
   /**