🔨 修改 defineProps 规范.

orion-ops-ui/src/views/asset-audit/sftp-log/components/sftp-log-table.vue

@@ -103,7 +103,9 @@
       </template>
       <!-- 操作类型 -->
       <template #type="{ record }">
-        {{ getDictValue(sftpOperatorTypeKey, record.type) }}
+        <a-tag color="arcoblue">
+          {{ getDictValue(sftpOperatorTypeKey, record.type) }}
+        </a-tag>
       </template>
       <!-- 操作文件 -->
       <template #paths="{ record }">

orion-ops-ui/src/views/asset/grant/components/grant-layout.vue

@@ -1,11 +1,13 @@
 <template>
   <a-spin :loading="loading" class="grant-container">
     <!-- 角色列表 -->
-    <router-roles v-if="type === GrantType.ROLE" outer-class="router-wrapper"
+    <router-roles v-if="type === GrantType.ROLE"
+                  outer-class="router-wrapper"
                   v-model="subjectId"
                   @change="fetchAuthorizedData" />
     <!-- 角色列表 -->
-    <router-users v-else-if="type === GrantType.USER" outer-class="router-wrapper"
+    <router-users v-else-if="type === GrantType.USER"
+                  outer-class="router-wrapper"
                   v-model="subjectId"
                   @change="fetchAuthorizedData" />
     <!-- 数据列表 -->
@@ -60,10 +62,10 @@
   import RouterRoles from './router-roles.vue';
   import RouterUsers from './router-users.vue';
 
-  const props = defineProps({
-    type: String,
-    loading: Boolean,
-  });
+  const props = defineProps<{
+    type: string;
+    loading: boolean;
+  }>();
   const emits = defineEmits(['fetch', 'grant']);
 
   const subjectId = ref();

orion-ops-ui/src/views/asset/grant/components/host-group-grant.vue

@@ -5,13 +5,12 @@
                 @grant="doGrant">
     <!-- 分组 -->
     <host-group-tree outer-class="group-main-tree"
+                     v-model:checked-keys="checkedGroups"
                      :checkable="true"
-                     :checked-keys="checkedGroups"
                      :editable="false"
                      :loading="loading"
-                     @loading="setLoading"
-                     @select-node="(e) => selectedGroup = e"
-                     @update:checked-keys="updateCheckedGroups" />
+                     @set-loading="setLoading"
+                     @selected-node="(e) => selectedGroup = e" />
     <!-- 主机列表 -->
     <host-list class="group-main-hosts sticky-list" :group="selectedGroup" />
   </grant-layout>
@@ -34,9 +33,9 @@
   import HostList from './host-list.vue';
   import GrantLayout from './grant-layout.vue';
 
-  const props = defineProps({
-    type: String,
-  });
+  const props = defineProps<{
+    type: string;
+  }>();
 
   const { loading, setLoading } = useLoading();
 
@@ -44,11 +43,6 @@
   const checkedGroups = ref<Array<number>>([]);
   const selectedGroup = ref<TreeNodeData>({});
 
-  // 选择分组
-  const updateCheckedGroups = (e: Array<number>) => {
-    checkedGroups.value = e;
-  };
-
   // 获取授权列表
   const fetchAuthorizedGroup = async (request: AssetAuthorizedDataQueryRequest) => {
     setLoading(true);

orion-ops-ui/src/views/asset/grant/components/host-identity-grant.vue

@@ -45,9 +45,9 @@
   import { useRowSelection } from '@/types/table';
   import GrantLayout from './grant-layout.vue';
 
-  const props = defineProps({
-    type: String,
-  });
+  const props = defineProps<{
+    type: string;
+  }>();
 
   const cacheStore = useCacheStore();
   const rowSelection = useRowSelection();

orion-ops-ui/src/views/asset/grant/components/host-key-grant.vue

@@ -37,9 +37,10 @@
   import { hostKeyColumns } from '../types/table.columns';
   import GrantLayout from './grant-layout.vue';
 
-  const props = defineProps({
-    type: String,
-  });
+  const props = defineProps<{
+    type: string;
+  }>();
+
   const cacheStore = useCacheStore();
   const rowSelection = useRowSelection();
   const { loading, setLoading } = useLoading();

orion-ops-ui/src/views/asset/grant/components/host-list.vue

@@ -7,7 +7,7 @@
     <!-- 表头 -->
     <template #header>
       <span class="hosts-header-title">组内数据</span>
-      <span class="span-blue">{{ props.group?.title }}</span>
+      <span class="span-blue">{{ group?.title }}</span>
     </template>
     <!-- 空数据 -->
     <template #empty>
@@ -35,20 +35,14 @@
 <script lang="ts" setup>
   import type { TreeNodeData } from '@arco-design/web-vue';
   import type { HostQueryResponse } from '@/api/asset/host';
-  import type { PropType } from 'vue';
   import useLoading from '@/hooks/loading';
   import { useCacheStore } from '@/store';
   import { ref, watch } from 'vue';
   import { getHostGroupRelList } from '@/api/asset/host-group';
 
-  const props = defineProps({
-    group: {
-      type: Object as PropType<TreeNodeData>,
-      default: () => {
-        return {};
-      }
-    }
-  });
+  const props = defineProps<Partial<{
+    group: TreeNodeData;
+  }>>();
 
   const cacheStore = useCacheStore();
   const { loading, setLoading } = useLoading();

orion-ops-ui/src/views/asset/grant/components/router-roles.vue

@@ -36,9 +36,9 @@
   import { Message } from '@arco-design/web-vue';
   import useLoading from '@/hooks/loading';
 
-  const props = defineProps({
-    modelValue: Number
-  });
+  const props = defineProps<Partial<{
+    modelValue: number;
+  }>>();
 
   const emits = defineEmits(['update:modelValue', 'change']);
 

orion-ops-ui/src/views/asset/grant/components/router-users.vue

@@ -36,9 +36,9 @@
   import { Message } from '@arco-design/web-vue';
   import useLoading from '@/hooks/loading';
 
-  const props = defineProps({
-    modelValue: Number
-  });
+  const props = defineProps<Partial<{
+    modelValue: number;
+  }>>();
 
   const emits = defineEmits(['update:modelValue', 'change']);
 

orion-ops-ui/src/views/asset/host-list/components/config/host-config-drawer.vue

@@ -31,14 +31,14 @@
 
 <script lang="ts" setup>
   import type { HostConfigWrapper } from '../../types/const';
-  import { HostSshConfig } from './ssh/types/const';
+  import type { HostSshConfig } from './ssh/types/const';
   import { ref } from 'vue';
   import useVisible from '@/hooks/visible';
   import useLoading from '@/hooks/loading';
   import { Message } from '@arco-design/web-vue';
   import { getHostConfigList } from '@/api/asset/host-config';
   import { useCacheStore, useDictStore } from '@/store';
-  import { dictKeys as sshDictKeys } from './ssh/types/const';
+  import { dictKeys } from './ssh/types/const';
   import SshConfigForm from './ssh/ssh-config-form.vue';
 
   const { visible, setVisible } = useVisible();
@@ -58,7 +58,7 @@
       setVisible(true);
       // 加载字典值
       const dictStore = useDictStore();
-      await dictStore.loadKeys(sshDictKeys);
+      await dictStore.loadKeys(dictKeys);
       // 加载配置
       const { data } = await getHostConfigList(record.value.id);
       data.forEach(s => {

orion-ops-ui/src/views/asset/host-list/components/config/ssh/ssh-config-form.vue

@@ -159,10 +159,10 @@
   const { loading, setLoading } = useLoading();
   const { toRadioOptions } = useDictStore();
 
-  const props = defineProps({
-    content: Object,
-    hostId: Number,
-  });
+  const props = defineProps<{
+    content: any;
+    hostId: number;
+  }>();
 
   const emits = defineEmits(['submitted']);
 

orion-ops-ui/src/views/asset/host-list/components/group/host-group-drawer.vue

@@ -42,8 +42,8 @@
           <host-group-tree outer-class="tree-card-main"
                            ref="tree"
                            :loading="loading"
-                           @loading="setLoading"
-                           @select-node="selectGroup" />
+                           @set-loading="setLoading"
+                           @selected-node="selectGroup" />
         </div>
         <!-- 身体部分 -->
         <a-spin class="simple-card transfer-body"

orion-ops-ui/src/views/asset/host-list/components/group/host-transfer.vue

@@ -53,22 +53,17 @@
 <script lang="ts" setup>
   import type { TransferItem } from '@arco-design/web-vue/es/transfer/interface';
   import type { TreeNodeData } from '@arco-design/web-vue';
-  import type { PropType } from 'vue';
   import { onMounted, ref, watch, computed } from 'vue';
   import { useCacheStore } from '@/store';
   import { getHostGroupRelList } from '@/api/asset/host-group';
 
-  const props = defineProps({
-    modelValue: {
-      type: Array<string>,
-      default: () => []
+  const props = withDefaults(defineProps<Partial<{
+    modelValue: Array<string>;
+    group: TreeNodeData;
+  }>>(), {
+    group: () => {
+      return {};
     },
-    group: {
-      type: Object as PropType<TreeNodeData>,
-      default: () => {
-        return {};
-      }
-    }
   });
 
   const emits = defineEmits(['loading', 'update:modelValue']);

orion-ops-ui/src/views/asset/host-list/components/host-card-list.vue

@@ -244,7 +244,7 @@
 
   // 重置条件
   const reset = () => {
-    resetObject(formModel, ['extra']);
+    resetObject(formModel, ['queryTag']);
     fetchCardData();
   };
 

orion-ops-ui/src/views/exec/exec-log/index.vue

@@ -31,13 +31,13 @@
   import { ref, onBeforeMount } from 'vue';
   import { useDictStore } from '@/store';
   import { dictKeys } from './types/const';
+  import { useRouter } from 'vue-router';
+  import { openNewRoute } from '@/router';
   import ExecLogTable from './components/exec-log-table.vue';
   import ExecLogClearModal from './components/exec-log-clear-modal.vue';
   import JsonEditorModal from '@/components/view/json-editor/modal/index.vue';
   import ShellEditorModal from '@/components/view/shell-editor/modal/index.vue';
   import ExecLogPanelModal from '@/components/exec/log/panel-modal/index.vue';
-  import { useRouter } from 'vue-router';
-  import { openNewRoute } from '@/router';
 
   const router = useRouter();
 

orion-ops-ui/src/views/host/terminal/components/layout/icon-actions.vue

@@ -33,14 +33,13 @@
 
 <script lang="ts" setup>
   import type { SidebarAction } from '../../types/terminal.type';
-  import type { PropType } from 'vue';
 
-  defineProps({
-    actions: Array as PropType<Array<SidebarAction>>,
-    position: String,
-    wrapperClass: String,
-    iconClass: String,
-  });
+  defineProps<Partial<{
+    actions: Array<SidebarAction>;
+    position: string;
+    wrapperClass: string;
+    iconClass: string;
+  }>>();
 
 </script>
 

orion-ops-ui/src/views/host/terminal/components/sftp/sftp-editor-header.vue

@@ -3,18 +3,19 @@
   <div class="sftp-editor-header">
     <!-- 左侧操作 -->
     <div class="sftp-editor-header-left">
-      <div class="sftp-path-container">
-        <!-- 当前路径 -->
-        <a-tooltip position="top"
-                   :mini="true"
-                   :overlay-inverse="true"
-                   :auto-fix-position="false"
-                   content-class="terminal-tooltip-content"
-                   arrow-class="terminal-tooltip-content"
-                   :content="path">
+      <a-tooltip position="top"
+                 :mini="true"
+                 :overlay-inverse="true"
+                 :auto-fix-position="false"
+                 content-class="terminal-tooltip-content"
+                 arrow-class="terminal-tooltip-content"
+                 content="点击复制">
+        <a-tag class="sftp-path-container pointer"
+               color="green"
+               @click="copy(path, '已复制')">
           <span>{{ name }}</span>
-        </a-tooltip>
-      </div>
+        </a-tag>
+      </a-tooltip>
     </div>
     <!-- 右侧操作 -->
     <a-space class="sftp-editor-header-right">
@@ -56,6 +57,7 @@
 
 <script lang="ts" setup>
   import type { ISftpSession } from '../../types/terminal.type';
+  import { copy } from '@/hooks/copy';
 
   const props = defineProps<{
     name: string;
@@ -95,24 +97,6 @@
     }
   }
 
-  .sftp-path-container {
-    width: 100%;
-    height: @action-size;
-    background: var(--color-fill-2);
-    border-radius: 2px;
-    overflow: hidden;
-    display: flex;
-    align-items: center;
-    padding: 0 8px;
-
-    span {
-      font-size: 14px;
-      line-height: 1.2;
-      text-overflow: ellipsis;
-      overflow: hidden;
-    }
-  }
-
   .header-action-icon {
     font-size: 16px;
     padding: 4px;

orion-ops-ui/src/views/user/info/components/login-history.vue

@@ -60,7 +60,6 @@
 
 <script lang="ts" setup>
   import type { UserQueryResponse, LoginHistoryQueryResponse } from '@/api/user/user';
-  import type { PropType } from 'vue';
   import useLoading from '@/hooks/loading';
   import { ref, onBeforeMount } from 'vue';
   import { ResultStatus } from '../types/const';
@@ -69,9 +68,9 @@
   import { dateFormat } from '@/utils';
   import { isMobile } from '@/utils/is';
 
-  const props = defineProps({
-    user: Object as PropType<UserQueryResponse>,
-  });
+  const props = defineProps<{
+    user?: UserQueryResponse;
+  }>();
 
   const list = ref<LoginHistoryQueryResponse[]>([]);
 

orion-ops-ui/src/views/user/info/components/user-base-info.vue

@@ -49,7 +49,6 @@
 
 <script lang="ts" setup>
   import type { UserUpdateRequest, UserQueryResponse } from '@/api/user/user';
-  import type { PropType } from 'vue';
   import useLoading from '@/hooks/loading';
   import { ref, onMounted } from 'vue';
   import formRules from '../../user/types/form.rules';
@@ -59,9 +58,9 @@
   import { Message } from '@arco-design/web-vue';
   import { updateUser } from '@/api/user/user';
 
-  const props = defineProps({
-    user: Object as PropType<UserQueryResponse>,
-  });
+  const props = defineProps<{
+    user?: UserQueryResponse;
+  }>();
 
   const userStore = useUserStore();
   const { loading, setLoading } = useLoading();

orion-ops-ui/src/views/user/info/components/user-operator-log.vue

@@ -33,16 +33,15 @@
 
 <script lang="ts" setup>
   import type { UserQueryResponse } from '@/api/user/user';
-  import type { PropType } from 'vue';
   import { ref, onBeforeMount } from 'vue';
   import { useCacheStore, useDictStore } from '@/store';
   import { dictKeys } from '@/views/user/operator-log/types/const';
   import OperatorLogQueryHeader from '@/views/user/operator-log/components/operator-log-query-header.vue';
   import OperatorLogSimpleTable from '@/views/user/operator-log/components/operator-log-simple-table.vue';
 
-  const props = defineProps({
-    user: Object as PropType<UserQueryResponse>,
-  });
+  const props = defineProps<{
+    user?: UserQueryResponse;
+  }>();
 
   const cacheStore = useCacheStore();
 

orion-ops-ui/src/views/user/info/components/user-session.vue

@@ -68,7 +68,6 @@
 <script lang="ts" setup>
   import type { UserQueryResponse } from '@/api/user/user';
   import type { UserSessionQueryResponse } from '@/api/user/user';
-  import type { PropType } from 'vue';
   import useLoading from '@/hooks/loading';
   import { ref, onBeforeMount } from 'vue';
   import { getCurrentUserSessionList, offlineCurrentUserSession } from '@/api/user/mine';
@@ -78,9 +77,9 @@
   import usePermission from '@/hooks/permission';
   import { getUserSessionList, offlineUserSession } from '@/api/user/user';
 
-  const props = defineProps({
-    user: Object as PropType<UserQueryResponse>,
-  });
+  const props = defineProps<{
+    user?: UserQueryResponse;
+  }>();
 
   const list = ref<UserSessionQueryResponse[]>([]);
 

orion-ops-ui/src/views/user/operator-log/components/operator-log-query-header.vue

@@ -72,11 +72,10 @@
   import UserSelector from '@/components/user/user/selector/index.vue';
 
   const emits = defineEmits(['submit']);
-  const props = defineProps({
-    visibleUser: {
-      type: Boolean,
-      default: true
-    }
+  const props = withDefaults(defineProps<Partial<{
+    visibleUser: boolean;
+  }>>(), {
+    visibleUser: true,
   });
 
   const { loading, setLoading } = useLoading();

orion-ops-ui/src/views/user/operator-log/components/operator-log-simple-table.vue

@@ -81,21 +81,14 @@
   import { replaceHtmlTag, clearHtmlTag } from '@/utils';
   import JsonEditorModal from '@/components/view/json-editor/modal/index.vue';
 
-  const props = defineProps({
-    handleColumn: {
-      type: Boolean,
-      default: true
+  const props = withDefaults(defineProps<Partial<{
+    handleColumn: boolean;
+    current: boolean;
+    baseParams: object;
+  }>>(), {
+    baseParams: () => {
+      return {};
     },
-    current: {
-      type: Boolean,
-      default: false
-    },
-    baseParams: {
-      type: Object,
-      default: () => {
-        return {};
-      }
-    }
   });
 
   const pagination = usePagination();

orion-ops-ui/src/views/user/user/components/user-grant-roles-form-modal.vue

@@ -64,6 +64,7 @@
   const open = (record: any) => {
     renderForm(record);
     setVisible(true);
+    // 加载用户角色
     loadRoles();
   };
 

orion-ops-ui/src/views/user/user/components/user-table.vue

@@ -73,6 +73,13 @@
              @page-change="(page) => fetchTableData(page, pagination.pageSize)"
              @page-size-change="(size) => fetchTableData(1, size)"
              :bordered="false">
+      <!-- 用户名 -->
+      <template #username="{ record }">
+        <span class="span-blue text-copy"
+              @click="copy(record.username)">
+          {{ record.username }}`
+        </span>
+      </template>
       <!-- 状态 -->
       <template #status="{ record }">
         <span class="circle" :style="{
@@ -166,6 +173,7 @@
   import { usePagination } from '@/types/table';
   import { useDictStore, useUserStore } from '@/store';
   import { useRouter } from 'vue-router';
+  import { copy } from '@/hooks/copy';
 
   const emits = defineEmits(['openAdd', 'openUpdate', 'openResetPassword', 'openGrantRole']);