修改密码更新逻辑.

2023-09-20 18:23:28 +08:00
parent d29cdac130
commit 6c8ccb3864
16 changed files with 176 additions and 41 deletions
--- a/orion-ops-ui/src/api/asset/host-key.ts
+++ b/orion-ops-ui/src/api/asset/host-key.ts
@@ -9,6 +9,7 @@ export interface HostKeyCreateRequest {
  publicKey?: string;
  privateKey?: string;
  password?: string;
+  useNewPassword?: boolean;
 }

 /**
--- a/orion-ops-ui/src/views/asset/host-key/components/host-key-form-drawer.vue
+++ b/orion-ops-ui/src/views/asset/host-key/components/host-key-form-drawer.vue
@@ -1,13 +1,18 @@
 <template>
-  <a-drawer :visible="visible"
+  <a-drawer class="drawer-body-padding-0"
+            :visible="visible"
            :title="title"
            :width="470"
            :mask-closable="false"
            :unmount-on-close="true"
+            :ok-button-props="{ disabled: loading || isViewHandler }"
+            :cancel-button-props="{ disabled: loading }"
            :on-before-ok="handlerOk"
            @cancel="handleClose">
-    <a-spin :loading="loading">
-      <a-alert style="margin-bottom: 18px;">请使用 ssh-keygen -m PEM -t rsa 生成秘钥</a-alert>
+    <a-spin class="form-wrapper" :loading="loading">
+      <a-alert class="keygen-alert">
+        请使用 ssh-keygen -m PEM -t rsa 生成秘钥
+      </a-alert>
      <a-form :model="formModel"
              ref="formRef"
              label-align="right"
@@ -17,19 +22,23 @@
              :rules="formRules">
        <!-- 名称 -->
        <a-form-item field="name" label="名称">
-          <a-input v-model="formModel.name" placeholder="请输入名称" />
+          <a-input v-model="formModel.name"
+                   :disabled="isViewHandler"
+                   placeholder="请输入名称" />
        </a-form-item>
        <!-- 公钥文本 -->
        <a-form-item field="publicKey" label="公钥">
          <a-upload :auto-upload="false"
                    :show-file-list="false"
-                    draggable
+                    :draggable="true"
+                    :disabled="isViewHandler"
                    @change="selectPublicFile"
                    @click.prevent="() => {}">
            <template #upload-button>
              <a-textarea v-model="formModel.publicKey"
+                          :disabled="isViewHandler"
                          placeholder="请输入公钥文本或将文件拖拽到此处"
-                          :auto-size="{ minRows: 7, maxRows: 7}" />
+                          :auto-size="{ minRows: 8, maxRows: 8}" />
            </template>
          </a-upload>
        </a-form-item>
@@ -37,19 +46,38 @@
        <a-form-item field="privateKey" label="私钥">
          <a-upload :auto-upload="false"
                    :show-file-list="false"
-                    draggable
+                    :draggable="true"
+                    :disabled="isViewHandler"
                    @change="selectPrivateFile"
                    @click.prevent="() => {}">
            <template #upload-button>
              <a-textarea v-model="formModel.privateKey"
+                          :disabled="isViewHandler"
                          placeholder="请输入私钥文本或将文件拖拽到此处"
                          :auto-size="{ minRows: 8, maxRows: 8}" />
            </template>
          </a-upload>
        </a-form-item>
        <!-- 密码 -->
-        <a-form-item field="password" label="密码">
-          <a-input-password v-model="formModel.password" placeholder="请输入私钥密码" />
+        <a-form-item v-if="!isViewHandler"
+                     field="password"
+                     label="密码"
+                     style="justify-content: space-between;">
+          <a-input-password v-model="formModel.password"
+                            :disabled="!formModel.useNewPassword"
+                            class="password-input"
+                            placeholder="请输入私钥密码" />
+          <a-switch v-model="formModel.useNewPassword"
+                    class="password-switch"
+                    type="round"
+                    size="large">
+            <template #checked>
+              使用新密码
+            </template>
+            <template #unchecked>
+              使用原密码
+            </template>
+          </a-switch>
        </a-form-item>
      </a-form>
    </a-spin>
@@ -78,6 +106,7 @@

  const title = ref<string>();
  const isAddHandle = ref<boolean>(true);
+  const isViewHandler = ref<boolean>(false);

  const defaultForm = () => {
    return {
@@ -86,6 +115,7 @@
      publicKey: undefined,
      privateKey: undefined,
      password: undefined,
+      useNewPassword: false
    };
  };

@@ -98,6 +128,7 @@
  const openAdd = () => {
    title.value = '添加主机秘钥';
    isAddHandle.value = true;
+    isViewHandler.value = false;
    renderForm({ ...defaultForm() });
    setVisible(true);
  };
@@ -106,10 +137,24 @@
  const openUpdate = async (record: any) => {
    title.value = '修改主机秘钥';
    isAddHandle.value = false;
+    isViewHandler.value = false;
+    await render(record.id);
+  };
+
+  // 打开查看
+  const openView = async (record: any) => {
+    title.value = '主机秘钥';
+    isAddHandle.value = false;
+    isViewHandler.value = true;
+    await render(record.id);
+  };
+
+  // 渲染数据
+  const render = async (id: number) => {
    setVisible(true);
    setLoading(true);
    try {
-      const { data } = await getHostKey(record.id);
+      const { data } = await getHostKey(id);
      renderForm({ ...data });
    } catch (e) {
      setVisible(false);
@@ -125,7 +170,7 @@
    });
  };

-  defineExpose({ openAdd, openUpdate });
+  defineExpose({ openAdd, openUpdate, openView });

  // 选择公钥文件
  const selectPublicFile = async (fileList: FileItem[]) => {
@@ -182,5 +227,21 @@
 </script>

 <style lang="less" scoped>
+  .form-wrapper {
+    width: 100%;
+    padding: 12px 12px 0 12px;
+  }

+  .keygen-alert {
+    margin: 0 0 12px 16px;
+    width: calc(100% - 42px);
+  }
+
+  .password-input {
+    width: 240px;
+  }
+
+  .password-switch {
+    margin-left: 16px;
+  }
 </style>
--- a/orion-ops-ui/src/views/asset/host-key/components/host-key-table.vue
+++ b/orion-ops-ui/src/views/asset/host-key/components/host-key-table.vue
@@ -52,6 +52,13 @@
      <!-- 操作 -->
      <template #handle="{ record }">
        <div class="table-handle-wrapper">
+          <!-- 查看 -->
+          <a-button type="text"
+                    size="mini"
+                    v-permission="['asset:host-key:detail', 'asset:host-key:update']"
+                    @click="emits('openView', record)">
+            查看
+          </a-button>
          <!-- 修改 -->
          <a-button type="text"
                    size="mini"
@@ -90,13 +97,10 @@
  import useLoading from '@/hooks/loading';
  import columns from '../types/table.columns';
  import { defaultPagination } from '@/types/table';
-  import {} from '../types/enum.types';
-  import {} from '../types/const';
-  import { toOptions } from '@/utils/enum';

  const tableRenderData = ref<HostKeyQueryResponse[]>();
  const { loading, setLoading } = useLoading();
-  const emits = defineEmits(['openAdd', 'openUpdate']);
+  const emits = defineEmits(['openAdd', 'openUpdate', 'openView']);

  const pagination = reactive(defaultPagination());

@@ -105,7 +109,6 @@
    name: undefined,
    publicKey: undefined,
    privateKey: undefined,
-    password: undefined,
  });

  // 删除当前行
--- a/orion-ops-ui/src/views/asset/host-key/index.vue
+++ b/orion-ops-ui/src/views/asset/host-key/index.vue
@@ -2,12 +2,13 @@
  <div class="layout-container">
    <!-- 表格 -->
    <host-key-table ref="table"
-                  @openAdd="() => drawer.openAdd()"
-                  @openUpdate="(e) => drawer.openUpdate(e)" />
+                    @openView="(e) => drawer.openView(e)"
+                    @openAdd="() => drawer.openAdd()"
+                    @openUpdate="(e) => drawer.openUpdate(e)" />
    <!-- 添加修改模态框 -->
    <host-key-form-drawer ref="drawer"
-                       @added="() => table.addedCallback()"
-                       @updated="() => table.updatedCallback()" />
+                          @added="() => table.addedCallback()"
+                          @updated="() => table.updatedCallback()" />
  </div>
 </template>

--- a/orion-ops-ui/src/views/asset/host-key/types/table.columns.ts
+++ b/orion-ops-ui/src/views/asset/host-key/types/table.columns.ts
@@ -32,7 +32,7 @@ const columns = [
  }, {
    title: '操作',
    slotName: 'handle',
-    width: 130,
+    width: 180,
    align: 'center',
    fixed: 'right',
  },
--- a/orion-ops-ui/src/views/asset/host/types/table.columns.ts
+++ b/orion-ops-ui/src/views/asset/host/types/table.columns.ts
@@ -12,17 +12,14 @@ const columns = [
    title: '主机名称',
    dataIndex: 'name',
    slotName: 'name',
-    align: 'center',
  }, {
    title: '主机编码',
    dataIndex: 'code',
    slotName: 'code',
-    align: 'center',
  }, {
    title: '主机地址',
    dataIndex: 'address',
    slotName: 'address',
-    align: 'center',
  }, {
    title: '标签',
    dataIndex: 'tag',
--- a/orion-ops-ui/src/views/system/menu/components/menu-form-modal.vue
+++ b/orion-ops-ui/src/views/system/menu/components/menu-form-modal.vue
@@ -30,7 +30,9 @@
          <a-input v-model="formModel.name" placeholder="请输入菜单名称" />
        </a-form-item>
        <!-- 菜单类型 -->
-        <a-form-item field="type" label="菜单类型">
+        <a-form-item v-if="isAddHandle"
+                     field="type"
+                     label="菜单类型">
          <a-radio-group type="button"
                         v-model="formModel.type"
                         :options="toOptions(MenuTypeEnum)" />