From e0a6057515b31ab7bce74c8b170886e229cbd4b8 Mon Sep 17 00:00:00 2001
From: lijiahang <ljh1553488six@139.com>
Date: Wed, 18 Oct 2023 18:02:11 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=8C=85=E7=BB=93=E6=9E=84.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../asset/host/components/host-card-list.vue  |   2 +-
 .../host/components/host-config-ssh-form.vue  |   2 +-
 .../asset/host/components/host-form-modal.vue |   2 +-
 .../asset/host/components/host-table.vue      |   2 +-
 ...fig.rules.ts => host-config.form.rules.ts} |   0
 .../{card.fields.ts => host.card.fields.ts}   |   0
 .../{form.rules.ts => host.form.rules.ts}     |   0
 ...table.columns.ts => host.table.columns.ts} |   1 -
 .../dict/components/dict-key-form-modal.vue   | 151 ++++++++++++++++++
 .../dict/components/dict-value-form-modal.vue |   2 +-
 .../dict/components/dict-value-table.vue      |   6 +-
 orion-ops-ui/src/views/system/dict/index.vue  |  40 +++--
 .../system/dict/types/dict-key.form.rules.ts  |  37 +++++
 .../dict/types/dict-key.table.columns.ts      |  75 +++++++++
 ...form.rules.ts => dict-value.form.rules.ts} |   0
 ...columns.ts => dict-value.table.columns.ts} |   0
 .../src/views/system/dict/types/enum.types.ts |  26 +++
 17 files changed, 326 insertions(+), 20 deletions(-)
 rename orion-ops-ui/src/views/asset/host/types/{host-config.rules.ts => host-config.form.rules.ts} (100%)
 rename orion-ops-ui/src/views/asset/host/types/{card.fields.ts => host.card.fields.ts} (100%)
 rename orion-ops-ui/src/views/asset/host/types/{form.rules.ts => host.form.rules.ts} (100%)
 rename orion-ops-ui/src/views/asset/host/types/{table.columns.ts => host.table.columns.ts} (98%)
 create mode 100644 orion-ops-ui/src/views/system/dict/components/dict-key-form-modal.vue
 create mode 100644 orion-ops-ui/src/views/system/dict/types/dict-key.form.rules.ts
 create mode 100644 orion-ops-ui/src/views/system/dict/types/dict-key.table.columns.ts
 rename orion-ops-ui/src/views/system/dict/types/{form.rules.ts => dict-value.form.rules.ts} (100%)
 rename orion-ops-ui/src/views/system/dict/types/{table.columns.ts => dict-value.table.columns.ts} (100%)

diff --git a/orion-ops-ui/src/views/asset/host/components/host-card-list.vue b/orion-ops-ui/src/views/asset/host/components/host-card-list.vue
index 72c6d8d5..cc4f48fd 100644
--- a/orion-ops-ui/src/views/asset/host/components/host-card-list.vue
+++ b/orion-ops-ui/src/views/asset/host/components/host-card-list.vue
@@ -145,7 +145,7 @@
   import { computed, reactive, ref } from 'vue';
   import useLoading from '@/hooks/loading';
   import { dataColor, objectTruthKeyCount, resetObject } from '@/utils';
-  import fieldConfig from '../types/card.fields';
+  import fieldConfig from '../types/host.card.fields';
   import { deleteHost, getHostPage, HostQueryRequest, HostQueryResponse } from '@/api/asset/host';
   import { Message, Modal } from '@arco-design/web-vue';
   import { tagColor } from '@/views/asset/host/types/const';
diff --git a/orion-ops-ui/src/views/asset/host/components/host-config-ssh-form.vue b/orion-ops-ui/src/views/asset/host/components/host-config-ssh-form.vue
index 0f745094..17d23ba9 100644
--- a/orion-ops-ui/src/views/asset/host/components/host-config-ssh-form.vue
+++ b/orion-ops-ui/src/views/asset/host/components/host-config-ssh-form.vue
@@ -141,7 +141,7 @@
   import { ref, watch } from 'vue';
   import { updateHostConfigStatus, updateHostConfig } from '@/api/asset/host';
   import { HostSshConfig, AuthTypeEnum } from '@/views/asset/host/types/host-config.types';
-  import { sshRules } from '@/views/asset/host/types/host-config.rules';
+  import { sshRules } from '@/views/asset/host/types/host-config.form.rules';
   import HostKeySelector from '@/components/asset/host-key/host-key-selector.vue';
   import HostIdentitySelector from '@/components/asset/host-identity/host-identity-selector.vue';
   import { toOptions } from '@/utils/enum';
diff --git a/orion-ops-ui/src/views/asset/host/components/host-form-modal.vue b/orion-ops-ui/src/views/asset/host/components/host-form-modal.vue
index dbbe384d..2e8a5136 100644
--- a/orion-ops-ui/src/views/asset/host/components/host-form-modal.vue
+++ b/orion-ops-ui/src/views/asset/host/components/host-form-modal.vue
@@ -56,7 +56,7 @@
   import { ref } from 'vue';
   import useLoading from '@/hooks/loading';
   import useVisible from '@/hooks/visible';
-  import formRules from '../types/form.rules';
+  import formRules from '../types/host.form.rules';
   import { createHost, updateHost, HostUpdateRequest } from '@/api/asset/host';
   import { Message } from '@arco-design/web-vue';
   import TagMultiSelector from '@/components/meta/tag/tag-multi-selector.vue';
diff --git a/orion-ops-ui/src/views/asset/host/components/host-table.vue b/orion-ops-ui/src/views/asset/host/components/host-table.vue
index 205a0acd..cb706d8a 100644
--- a/orion-ops-ui/src/views/asset/host/components/host-table.vue
+++ b/orion-ops-ui/src/views/asset/host/components/host-table.vue
@@ -166,7 +166,7 @@
   import { deleteHost, getHostPage, HostQueryRequest, HostQueryResponse } from '@/api/asset/host';
   import { Message } from '@arco-design/web-vue';
   import useLoading from '@/hooks/loading';
-  import columns from '../types/table.columns';
+  import columns from '../types/host.table.columns';
   import { tagColor } from '../types/const';
   import { usePagination } from '@/types/table';
   import useCopy from '@/hooks/copy';
diff --git a/orion-ops-ui/src/views/asset/host/types/host-config.rules.ts b/orion-ops-ui/src/views/asset/host/types/host-config.form.rules.ts
similarity index 100%
rename from orion-ops-ui/src/views/asset/host/types/host-config.rules.ts
rename to orion-ops-ui/src/views/asset/host/types/host-config.form.rules.ts
diff --git a/orion-ops-ui/src/views/asset/host/types/card.fields.ts b/orion-ops-ui/src/views/asset/host/types/host.card.fields.ts
similarity index 100%
rename from orion-ops-ui/src/views/asset/host/types/card.fields.ts
rename to orion-ops-ui/src/views/asset/host/types/host.card.fields.ts
diff --git a/orion-ops-ui/src/views/asset/host/types/form.rules.ts b/orion-ops-ui/src/views/asset/host/types/host.form.rules.ts
similarity index 100%
rename from orion-ops-ui/src/views/asset/host/types/form.rules.ts
rename to orion-ops-ui/src/views/asset/host/types/host.form.rules.ts
diff --git a/orion-ops-ui/src/views/asset/host/types/table.columns.ts b/orion-ops-ui/src/views/asset/host/types/host.table.columns.ts
similarity index 98%
rename from orion-ops-ui/src/views/asset/host/types/table.columns.ts
rename to orion-ops-ui/src/views/asset/host/types/host.table.columns.ts
index 0c6497ea..19cb9ab2 100644
--- a/orion-ops-ui/src/views/asset/host/types/table.columns.ts
+++ b/orion-ops-ui/src/views/asset/host/types/host.table.columns.ts
@@ -22,7 +22,6 @@ const columns = [
     title: '主机地址',
     dataIndex: 'address',
     slotName: 'address',
-    width: 260
   }, {
     title: '主机标签',
     dataIndex: 'tags',
diff --git a/orion-ops-ui/src/views/system/dict/components/dict-key-form-modal.vue b/orion-ops-ui/src/views/system/dict/components/dict-key-form-modal.vue
new file mode 100644
index 00000000..152c494b
--- /dev/null
+++ b/orion-ops-ui/src/views/system/dict/components/dict-key-form-modal.vue
@@ -0,0 +1,151 @@
+<template>
+  <a-modal v-model:visible="visible"
+           body-class="modal-form"
+           title-align="start"
+           :title="title"
+           :top="80"
+           :align-center="false"
+           :draggable="true"
+           :mask-closable="false"
+           :unmount-on-close="true"
+           :ok-button-props="{ disabled: loading }"
+           :cancel-button-props="{ disabled: loading }"
+           :on-before-ok="handlerOk"
+           @close="handleClose">
+    <a-spin :loading="loading">
+      <a-form :model="formModel"
+              ref="formRef"
+              label-align="right"
+              :style="{ width: '460px' }"
+              :label-col-props="{ span: 6 }"
+              :wrapper-col-props="{ span: 18 }"
+              :rules="formRules">
+        <!-- 配置项 -->
+        <a-form-item field="keyName" label="配置项">
+          <a-input v-model="formModel.keyName" placeholder="请输入配置项" allow-clear />
+        </a-form-item>
+        <!-- 配置值定义 -->
+        <a-form-item field="valueType" label="配置值定义">
+          <a-select v-model="formModel.valueType"
+                    :options="toOptions(ValueTypeEnum)"
+                    placeholder="请选择配置值定义" />
+        </a-form-item>
+        <!-- 额外配置定义 -->
+        <a-form-item field="extraSchema" label="额外配置定义">
+          <a-input v-model="formModel.extraSchema" placeholder="请输入额外配置定义" allow-clear />
+        </a-form-item>
+        <!-- 配置描述 -->
+        <a-form-item field="description" label="配置描述">
+          <a-input v-model="formModel.description" placeholder="请输入配置描述" allow-clear />
+        </a-form-item>
+      </a-form>
+    </a-spin>
+  </a-modal>
+</template>
+
+<script lang="ts">
+  export default {
+    name: 'system-dict-key-form-modal'
+  };
+</script>
+
+<script lang="ts" setup>
+  import { ref } from 'vue';
+  import useLoading from '@/hooks/loading';
+  import useVisible from '@/hooks/visible';
+  import formRules from '../types/dict-key.form.rules';
+  import { createDictKey, updateDictKey, DictKeyUpdateRequest } from '@/api/system/dict-key';
+  import { Message } from '@arco-design/web-vue';
+  import {} from '../types/const';
+  import { ValueTypeEnum } from '../types/enum.types';
+  import { toOptions } from '@/utils/enum';
+
+  const { visible, setVisible } = useVisible();
+  const { loading, setLoading } = useLoading();
+
+  const title = ref<string>();
+  const isAddHandle = ref<boolean>(true);
+
+  const defaultForm = (): DictKeyUpdateRequest => {
+    return {
+      id: undefined,
+      keyName: undefined,
+      valueType: undefined,
+      extraSchema: undefined,
+      description: undefined,
+    };
+  };
+
+  const formRef = ref<any>();
+  const formModel = ref<DictKeyUpdateRequest>({});
+
+  const emits = defineEmits(['added', 'updated']);
+
+  // 打开新增
+  const openAdd = () => {
+    title.value = '添加字典配置项';
+    isAddHandle.value = true;
+    renderForm({ ...defaultForm() });
+    setVisible(true);
+  };
+
+  // 打开修改
+  const openUpdate = (record: any) => {
+    title.value = '修改字典配置项';
+    isAddHandle.value = false;
+    renderForm({ ...defaultForm(), ...record });
+    setVisible(true);
+  };
+
+  // 渲染表单
+  const renderForm = (record: any) => {
+    formModel.value = Object.assign({}, record);
+  };
+
+  defineExpose({ openAdd, openUpdate });
+
+  // 确定
+  const handlerOk = async () => {
+    setLoading(true);
+    try {
+      // 验证参数
+      const error = await formRef.value.validate();
+      if (error) {
+        return false;
+      }
+      if (isAddHandle.value) {
+        // 新增
+        await createDictKey(formModel.value);
+        Message.success('创建成功');
+        emits('added');
+      } else {
+        // 修改
+        await updateDictKey(formModel.value);
+        Message.success('修改成功');
+        emits('updated');
+      }
+      // 清空
+      handlerClear();
+    } catch (e) {
+      return false;
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  // 关闭
+  const handleClose = () => {
+    handlerClear();
+  };
+
+  // 清空
+  const handlerClear = () => {
+    setLoading(false);
+    setVisible(false);
+  };
+
+</script>
+
+<style lang="less" scoped>
+
+</style>
diff --git a/orion-ops-ui/src/views/system/dict/components/dict-value-form-modal.vue b/orion-ops-ui/src/views/system/dict/components/dict-value-form-modal.vue
index f81a47fa..917534fe 100644
--- a/orion-ops-ui/src/views/system/dict/components/dict-value-form-modal.vue
+++ b/orion-ops-ui/src/views/system/dict/components/dict-value-form-modal.vue
@@ -67,7 +67,7 @@
   import { ref } from 'vue';
   import useLoading from '@/hooks/loading';
   import useVisible from '@/hooks/visible';
-  import formRules from '../types/form.rules';
+  import formRules from '../types/dict-value.form.rules';
   import { createDictValue, updateDictValue, DictValueUpdateRequest } from '@/api/system/dict-value';
   import { Message } from '@arco-design/web-vue';
   import {} from '../types/const';
diff --git a/orion-ops-ui/src/views/system/dict/components/dict-value-table.vue b/orion-ops-ui/src/views/system/dict/components/dict-value-table.vue
index 84a251da..0914a08e 100644
--- a/orion-ops-ui/src/views/system/dict/components/dict-value-table.vue
+++ b/orion-ops-ui/src/views/system/dict/components/dict-value-table.vue
@@ -95,7 +95,7 @@
           <a-button type="text"
                     size="mini"
                     v-permission="['infra:dict-value:update']"
-                    @click="emits('openValueUpdate', record)">
+                    @click="emits('openUpdateValue', record)">
             修改
           </a-button>
           <!-- 历史 -->
@@ -134,7 +134,7 @@
   import { batchDeleteDictValue, deleteDictValue, getDictValuePage, DictValueQueryRequest, DictValueQueryResponse } from '@/api/system/dict-value';
   import { Message } from '@arco-design/web-vue';
   import useLoading from '@/hooks/loading';
-  import columns from '../types/table.columns';
+  import columns from '../types/dict-value.table.columns';
   import { usePagination, useRowSelection } from '@/types/table';
   import {} from '../types/const';
   import {} from '../types/enum.types';
@@ -142,7 +142,7 @@
 
   const tableRenderData = ref<DictValueQueryResponse[]>([]);
   const { loading, setLoading } = useLoading();
-  const emits = defineEmits(['openAddKey', 'openAddValue', 'openValueUpdate', 'openValueHistory']);
+  const emits = defineEmits(['openAddKey', 'openAddValue', 'openUpdateValue', 'openValueHistory']);
 
   const pagination = usePagination();
   const selectedKeys = ref<number[]>([]);
diff --git a/orion-ops-ui/src/views/system/dict/index.vue b/orion-ops-ui/src/views/system/dict/index.vue
index 4e7aff24..d3113f3e 100644
--- a/orion-ops-ui/src/views/system/dict/index.vue
+++ b/orion-ops-ui/src/views/system/dict/index.vue
@@ -2,12 +2,18 @@
   <div class="layout-container">
     <!-- 列表-表格 -->
     <dict-value-table ref="table"
-                  @openAdd="() => modal.openAdd()"
-                  @openUpdate="(e) => modal.openUpdate(e)" />
-    <!-- 添加修改模态框 -->
-    <dict-value-form-modal ref="modal"
-                   @added="modalAddCallback"
-                   @updated="modalUpdateCallback" />
+                      @openAddKey="() => keyModal.openAdd()"
+                      @openValueHistory="() => keyModal.openAdd()"
+                      @openAddValue="() => valueModal.openAdd()"
+                      @openUpdateValue="(e) => valueModal.openUpdate(e)" />
+    <!-- 添加修改 配置项模态框 -->
+    <dict-key-form-modal ref="keyModal"
+                         @added="keyModalAddCallback"
+                         @updated="keyModalUpdateCallback" />
+    <!-- 添加修改 配置值模态框 -->
+    <dict-value-form-modal ref="valueModal"
+                           @added="valueModalAddCallback"
+                           @updated="valueModalUpdateCallback" />
   </div>
 </template>
 
@@ -20,19 +26,31 @@
 <script lang="ts" setup>
   import DictValueTable from './components/dict-value-table.vue';
   import DictValueFormModal from './components/dict-value-form-modal.vue';
+  import DictKeyFormModal from './components/dict-key-form-modal.vue';
 
   import { ref } from 'vue';
 
   const table = ref();
-  const modal = ref();
+  const keyModal = ref();
+  const valueModal = ref();
 
-  // 添加回调
-  const modalAddCallback = () => {
+  // 配置项添加回调
+  const keyModalAddCallback = () => {
     table.value.addedCallback();
   };
 
-  // 修改回调
-  const modalUpdateCallback = () => {
+  // 配置项修改回调
+  const keyModalUpdateCallback = () => {
+    table.value.updatedCallback();
+  };
+
+  // 配置值添加回调
+  const valueModalAddCallback = () => {
+    table.value.addedCallback();
+  };
+
+  // 配置值修改回调
+  const valueModalUpdateCallback = () => {
     table.value.updatedCallback();
   };
 
diff --git a/orion-ops-ui/src/views/system/dict/types/dict-key.form.rules.ts b/orion-ops-ui/src/views/system/dict/types/dict-key.form.rules.ts
new file mode 100644
index 00000000..927d8511
--- /dev/null
+++ b/orion-ops-ui/src/views/system/dict/types/dict-key.form.rules.ts
@@ -0,0 +1,37 @@
+import { FieldRule } from '@arco-design/web-vue';
+
+export const keyName = [{
+  required: true,
+  message: '请输入配置项'
+}, {
+  maxLength: 32,
+  message: '配置项长度不能大于32位'
+}] as FieldRule[];
+
+export const valueType = [{
+  required: true,
+  message: '请输入配置值定义'
+}, {
+  maxLength: 12,
+  message: '配置值定义长度不能大于12位'
+}] as FieldRule[];
+
+export const extraSchema = [{
+  required: true,
+  message: '请输入额外配置定义'
+}] as FieldRule[];
+
+export const description = [{
+  required: true,
+  message: '请输入配置描述'
+}, {
+  maxLength: 64,
+  message: '配置描述长度不能大于64位'
+}] as FieldRule[];
+
+export default {
+  keyName,
+  valueType,
+  extraSchema,
+  description,
+} as Record<string, FieldRule | FieldRule[]>;
diff --git a/orion-ops-ui/src/views/system/dict/types/dict-key.table.columns.ts b/orion-ops-ui/src/views/system/dict/types/dict-key.table.columns.ts
new file mode 100644
index 00000000..7604bfc9
--- /dev/null
+++ b/orion-ops-ui/src/views/system/dict/types/dict-key.table.columns.ts
@@ -0,0 +1,75 @@
+import { TableColumnData } from '@arco-design/web-vue/es/table/interface';
+import { dateFormat } from '@/utils';
+
+const columns = [
+  {
+    title: 'id',
+    dataIndex: 'id',
+    slotName: 'id',
+    width: 70,
+    align: 'left',
+    fixed: 'left',
+  }, {
+    title: '配置项',
+    dataIndex: 'keyName',
+    slotName: 'keyName',
+    align: 'center',
+    ellipsis: true,
+    tooltip: true,
+  }, {
+    title: '配置值定义',
+    dataIndex: 'valueType',
+    slotName: 'valueType',
+    align: 'center',
+    ellipsis: true,
+    tooltip: true,
+  }, {
+    title: '额外配置定义',
+    dataIndex: 'extraSchema',
+    slotName: 'extraSchema',
+    align: 'center',
+    ellipsis: true,
+    tooltip: true,
+  }, {
+    title: '配置描述',
+    dataIndex: 'description',
+    slotName: 'description',
+    align: 'center',
+    ellipsis: true,
+    tooltip: true,
+  }, {
+    title: '创建时间',
+    dataIndex: 'createTime',
+    slotName: 'createTime',
+    align: 'center',
+    width: 180,
+    render: ({ record }) => {
+      return dateFormat(new Date(record.createTime));
+    },
+  }, {
+    title: '修改时间',
+    dataIndex: 'updateTime',
+    slotName: 'updateTime',
+    align: 'center',
+    width: 180,
+    render: ({ record }) => {
+      return dateFormat(new Date(record.updateTime));
+    },
+  }, {
+    title: '创建人',
+    dataIndex: 'creator',
+    slotName: 'creator',
+  }, {
+    title: '修改人',
+    dataIndex: 'updater',
+    slotName: 'updater',
+  }, {
+    title: '操作',
+    slotName: 'handle',
+    width: 130,
+    align: 'center',
+    fixed: 'right',
+  },
+] as TableColumnData[];
+
+export default columns;
diff --git a/orion-ops-ui/src/views/system/dict/types/form.rules.ts b/orion-ops-ui/src/views/system/dict/types/dict-value.form.rules.ts
similarity index 100%
rename from orion-ops-ui/src/views/system/dict/types/form.rules.ts
rename to orion-ops-ui/src/views/system/dict/types/dict-value.form.rules.ts
diff --git a/orion-ops-ui/src/views/system/dict/types/table.columns.ts b/orion-ops-ui/src/views/system/dict/types/dict-value.table.columns.ts
similarity index 100%
rename from orion-ops-ui/src/views/system/dict/types/table.columns.ts
rename to orion-ops-ui/src/views/system/dict/types/dict-value.table.columns.ts
diff --git a/orion-ops-ui/src/views/system/dict/types/enum.types.ts b/orion-ops-ui/src/views/system/dict/types/enum.types.ts
index e69de29b..4da3740e 100644
--- a/orion-ops-ui/src/views/system/dict/types/enum.types.ts
+++ b/orion-ops-ui/src/views/system/dict/types/enum.types.ts
@@ -0,0 +1,26 @@
+/**
+ * 配置值定义
+ */
+export const ValueTypeEnum = {
+  STRING: {
+    label: '字符串',
+    value: 'STRING',
+  },
+  INTEGER: {
+    label: '整数',
+    value: 'INTEGER',
+  },
+  DECIMAL: {
+    label: '小数',
+    value: 'DECIMAL',
+  },
+  BOOLEAN: {
+    label: '布尔值',
+    value: 'BOOLEAN',
+  },
+  COLOR: {
+    label: '颜色',
+    value: 'COLOR',
+  },
+}
+