review code.

2023-10-26 17:12:17 +08:00
parent 6c4e588f92
commit 18de1a2a3a
18 changed files with 81 additions and 51 deletions
--- a/orion-ops-ui/src/api/system/dict-value.ts
+++ b/orion-ops-ui/src/api/system/dict-value.ts
@@ -8,7 +8,6 @@ import qs from 'query-string';
 */
 export interface DictValueCreateRequest {
  keyId?: number;
-  keyName?: string;
  name?: string;
  value?: string;
  label?: string;
@@ -53,6 +52,7 @@ export interface DictValueQueryResponse extends TableData {
  id?: number;
  keyId?: number;
  keyName?: string;
+  keyDescription?: string;
  name?: string;
  value?: string;
  label?: string;
--- a/orion-ops-ui/src/assets/style/global.less
+++ b/orion-ops-ui/src/assets/style/global.less
@@ -120,6 +120,28 @@ body {
  }
 }

+.click-icon-wrapper {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: var(--color-text-2);
+  background: var(--color-fill-2);
+  border-radius: 2px;
+  cursor: pointer;
+  border: 1px solid transparent;
+  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+}
+
+.click-icon-wrapper:hover {
+  background: var(--color-fill-3);
+}
+
+.copy-left {
+  color: rgb(var(--arcoblue-6));
+  cursor: pointer;
+  margin-right: 4px;
+}
+
 .span-blue {
  color: rgb(var(--arcoblue-6));
 }
--- a/orion-ops-ui/src/assets/style/layout.less
+++ b/orion-ops-ui/src/assets/style/layout.less
@@ -46,7 +46,6 @@
      }
    }
  }
-
 }

 .table-wrapper {
@@ -110,22 +109,6 @@
  padding: 18px 24px 14px 24px;
 }

-.click-icon-wrapper {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  color: var(--color-text-2);
-  background: var(--color-fill-2);
-  border-radius: 2px;
-  cursor: pointer;
-  border: 1px solid transparent;
-  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
-}
-
-.click-icon-wrapper:hover {
-  background: var(--color-fill-3);
-}
-
 .arco-table-td-content {
  color: rgba(var(--gray-9), .95);
  font-size: 13px;
--- a/orion-ops-ui/src/hooks/copy.ts
+++ b/orion-ops-ui/src/hooks/copy.ts
@@ -20,5 +20,3 @@ export default function useCopy() {
    copied
  };
 }
-
-
--- a/orion-ops-ui/src/store/index.ts
+++ b/orion-ops-ui/src/store/index.ts
@@ -5,6 +5,7 @@ import useUserStore from './modules/user';
 import useTabBarStore from './modules/tab-bar';
 import useCacheStore from './modules/cache';
 import useTipsStore from './modules/tips';
+// import useDictStore from './modules/dict';

 const pinia = createPinia();

@@ -15,6 +16,7 @@ export {
  useTabBarStore,
  useCacheStore,
  useTipsStore,
+  // useDictStore,
 };

 export default pinia;
--- a/orion-ops-ui/src/store/modules/dict/index.ts
+++ b/orion-ops-ui/src/store/modules/dict/index.ts
--- a/orion-ops-ui/src/store/modules/dict/types.ts
+++ b/orion-ops-ui/src/store/modules/dict/types.ts
--- a/orion-ops-ui/src/views/asset/host-identity/components/host-identity-card-list.vue
+++ b/orion-ops-ui/src/views/asset/host-identity/components/host-identity-card-list.vue
@@ -20,9 +20,9 @@
    <!-- 用户名 -->
    <template #username="{ record }">
      <a-tooltip content="点击复制">
-          <span class="pointer span-blue" @click="copy(record.username)">
-            <icon-copy /> {{ record.username }}
-          </span>
+        <span class="pointer span-blue" @click="copy(record.username)">
+          <icon-copy /> {{ record.username }}
+        </span>
      </a-tooltip>
    </template>
    <!-- 秘钥名称 -->
--- 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
@@ -24,9 +24,9 @@
    <!-- 地址 -->
    <template #address="{ record }">
      <a-tooltip content="点击复制">
-          <span class="host-address" @click="copy(record.address)">
-            <icon-copy /> {{ record.address }}
-          </span>
+        <span class="host-address" @click="copy(record.address)">
+          <icon-copy /> {{ record.address }}
+        </span>
      </a-tooltip>
    </template>
    <!-- 标签 -->
--- a/orion-ops-ui/src/views/system/dict-key/components/dict-key-form-modal.vue
+++ b/orion-ops-ui/src/views/system/dict-key/components/dict-key-form-modal.vue
@@ -67,15 +67,15 @@
          <a-tag v-for="definedExtraKey in definedExtraKeys"
                 color="arcoblue"
                 :title="`添加参数 ${definedExtraKey}`"
-                 @click="addExtraParam(definedExtraKey)"
+                 @click="addExtraParam(definedExtraKey.name, definedExtraKey.type)"
                 checkable
                 checked>
-            {{ definedExtraKey }}
+            {{ definedExtraKey.name }}
          </a-tag>
          <!-- 添加参数 -->
          <a-button title="添加参数"
                    style="width: 180px;"
-                    @click="addExtraParam(undefined)"
+                    @click="addExtraParam(undefined,undefined)"
                    long>
            <icon-plus />
          </a-button>
@@ -114,7 +114,7 @@
    return {
      id: undefined,
      keyName: undefined,
-      valueType: ValueTypeEnum.STRING.value,
+      valueType: ValueTypeEnum.INTEGER.value,
      extraSchema: undefined,
      description: undefined,
    };
@@ -155,13 +155,13 @@
  defineExpose({ openAdd, openUpdate });

  // 添加额外参数
-  const addExtraParam = (name: string | undefined) => {
+  const addExtraParam = (name: string | undefined, type: any) => {
    if (name && extraSchemaArr.value.findIndex(v => v.name === name) != -1) {
      return;
    }
    extraSchemaArr.value.push({
      name: name,
-      type: ValueTypeEnum.STRING.value
+      type: type || ValueTypeEnum.STRING.value
    });
  };

@@ -194,11 +194,11 @@
            return false;
          }
          // 不合法
-          if (!new RegExp(/^[a-zA-Z0-9]{2,32}$/).test(extraSchema.name as string)) {
+          if (!new RegExp(/^[a-zA-Z0-9_]{2,32}$/).test(extraSchema.name as string)) {
            formRef.value.setFields({
              [`extra${i + 1}`]: {
                status: 'error',
-                message: '配置项需要为 2-32 位的数字以及字母'
+                message: '配置项需要为 2-32 位的数字,字母或下滑线'
              }
            });
            return false;
--- a/orion-ops-ui/src/views/system/dict-key/components/dict-key-table.vue
+++ b/orion-ops-ui/src/views/system/dict-key/components/dict-key-table.vue
@@ -56,7 +56,7 @@
      <!-- 配置项 -->
      <template #keyName="{ record }">
        <span class="pointer" @click="copy(record.keyName)">
-          <icon-copy class="span-blue" /> {{ record.keyName }}
+          <icon-copy /> {{ record.keyName }}
        </span>
      </template>
      <!-- 配置值类型 -->
--- a/orion-ops-ui/src/views/system/dict-key/components/dict-key-view-modal.vue
+++ b/orion-ops-ui/src/views/system/dict-key/components/dict-key-view-modal.vue
@@ -2,7 +2,7 @@
  <a-modal v-model:visible="visible"
           title-align="start"
           width="60%"
-           :body-style="{padding: '16px 4px'}"
+           :body-style="{padding: '16px 8px'}"
           :top="80"
           :title="title"
           :align-center="false"
--- a/orion-ops-ui/src/views/system/dict-key/types/const.ts
+++ b/orion-ops-ui/src/views/system/dict-key/types/const.ts
@@ -1,7 +1,18 @@
+import { ValueTypeEnum } from './enum.types';
+
 /**
 * 快捷定义字段
 */
-export const definedExtraKeys = ['status', 'type', 'color'];
+export const definedExtraKeys = [{
+  name: 'status',
+  type: ValueTypeEnum.STRING.value
+}, {
+  name: 'type',
+  type: ValueTypeEnum.STRING.value
+}, {
+  name: 'color',
+  type: ValueTypeEnum.COLOR.value
+}];

 /**
 * 内置字段
--- a/orion-ops-ui/src/views/system/dict-key/types/form.rules.ts
+++ b/orion-ops-ui/src/views/system/dict-key/types/form.rules.ts
@@ -4,8 +4,8 @@ export const keyName = [{
  required: true,
  message: '请输入配置项'
 }, {
-  match: /^[a-zA-Z0-9]{2,32}$/,
-  message: '配置项需要为 2-32 位的数字以及字母'
+  match: /^[a-zA-Z0-9_]{2,32}$/,
+  message: '配置项需要为 2-32 位的数字,字母或下滑线'
 }] as FieldRule[];

 export const valueType = [{
--- a/orion-ops-ui/src/views/system/dict-value/components/dict-value-form-modal.vue
+++ b/orion-ops-ui/src/views/system/dict-value/components/dict-value-form-modal.vue
@@ -27,6 +27,11 @@
        <!-- 配置名称 -->
        <a-form-item field="name" label="配置名称">
          <a-input v-model="formModel.name" placeholder="请输入配置名称" allow-clear />
+          <span class="item-extra-block pointer"
+                title="同步到值"
+                @click="() => formModel.value = formModel.name">
+            <icon-caret-down style="font-size: 16px" />
+          </span>
        </a-form-item>
        <!-- 配置值 -->
        <a-form-item field="value" label="配置值">
@@ -68,10 +73,9 @@
          <template v-else-if="ValueTypeEnum.COLOR.value === type">
            <a-input v-model="extraValue[name]"
                     :placeholder="`请输入 ${name}`"
-                     default-value="#"
                     allow-clear
                     hide-button />
-            <span class="color-block" :style="{
+            <span class="item-extra-block" :style="{
              background: extraValue[name] === '#' ? undefined : (extraValue[name] || undefined)
            }" />
          </template>
@@ -132,7 +136,7 @@
  const openAdd = () => {
    title.value = '添加字典配置值';
    isAddHandle.value = true;
-    renderForm({ ...defaultForm() });
+    renderForm({ ...defaultForm(), keyId: formModel.value.keyId });
    setVisible(true);
  };

@@ -224,11 +228,14 @@
 </script>

 <style lang="less" scoped>
-  .color-block {
-    width: 36px;
-    height: 30px;
+  .item-extra-block {
+    width: 38px;
+    height: 32px;
    margin-left: 8px;
    border-radius: 4px;
    background: var(--color-fill-2);
+    display: flex;
+    align-items: center;
+    justify-content: center;
  }
 </style>
--- a/orion-ops-ui/src/views/system/dict-value/components/dict-value-table.vue
+++ b/orion-ops-ui/src/views/system/dict-value/components/dict-value-table.vue
@@ -83,13 +83,19 @@
      <!-- 名称 -->
      <template #name="{ record }">
        <span class="pointer" @click="copy(record.name)">
-          <icon-copy class="span-blue" /> {{ record.name }}
+          <icon-copy class="copy-left" />
+          <a-tooltip :content="record.name">
+            <span>{{ record.name }}</span>
+          </a-tooltip>
        </span>
      </template>
      <!-- 值 -->
      <template #value="{ record }">
        <span class="pointer" @click="copy(record.value)">
-          <icon-copy class="span-blue" /> {{ record.value }}
+          <icon-copy class="copy-left" />
+          <a-tooltip :content="record.value">
+            <span>{{ record.value }}</span>
+          </a-tooltip>
        </span>
      </template>
      <!-- 操作 -->
--- a/orion-ops-ui/src/views/system/dict-value/types/table.columns.ts
+++ b/orion-ops-ui/src/views/system/dict-value/types/table.columns.ts
@@ -16,20 +16,21 @@ const columns = [
    align: 'left',
    ellipsis: true,
    tooltip: true,
+    render: ({ record }) => {
+      return `${record.keyName} - ${record.keyDescription}`;
+    },
  }, {
    title: '配置名称',
    dataIndex: 'name',
    slotName: 'name',
    align: 'left',
    ellipsis: true,
-    tooltip: true,
  }, {
    title: '配置值',
    dataIndex: 'value',
    slotName: 'value',
    align: 'left',
    ellipsis: true,
-    tooltip: true,
  }, {
    title: '配置描述',
    dataIndex: 'label',
--- a/orion-ops-ui/src/views/user/user/types/form.rules.ts
+++ b/orion-ops-ui/src/views/user/user/types/form.rules.ts
@@ -7,8 +7,8 @@ export const username = [{
  maxLength: 32,
  message: '用户名长度不能大于32位'
 }, {
-  match: /^[a-zA-Z0-9]{4,32}$/,
-  message: '用户名需要为 4-32 位的数字以及字母'
+  match: /^[a-zA-Z0-9_]{4,32}$/,
+  message: '用户名需要为 4-32 位的数字,字母或下滑线'
 }] as FieldRule[];

 export const password = [{