feat: 调整

# Reviewed, transaction id: 23516
TencentBlueKing · Nov 11, 2024 · b44f07a · b44f07a
1 parent c1ed363
commit b44f07a
Show file tree

Hide file tree

Showing 3 changed files with 40 additions and 5 deletions.
diff --git a/frontend/src/common/util.ts b/frontend/src/common/util.ts
@@ -588,6 +588,28 @@ export const sort = (arr: any[], key: string) => {
     return (`${pre}`).toString().localeCompare((`${next}`));
   });
 };
+/**
+ * 单个函数用于解析和比较版本号
+ * 排序规则：1. 数字
+ */
+export const compareVersions = (a: string, b: string) => {
+  if (a === b) return 0;
+  if (!a || !b) return a ? 1 : -1;
+  // 解析版本号字符串，返回数字数组
+  const parseVersion = (version: string) => version?.match(/\d+/g)?.map(Number);
+
+  // 获取版本号的数字数组
+  const versionA = parseVersion(a) || [];
+  const versionB = parseVersion(b) || [];
+
+  // 比较主版本号、次版本号、补丁号和附加编号
+  for (let i = 0; i < versionA.length; i++) {
+    const diff = versionA[i] - versionB[i];
+    if (diff !== 0) return diff;
+  }
+
+  return 0; // 全部相同
+}
 /**
  * 对象深拷贝
  * @param {*} obj

diff --git a/frontend/src/components/common/tag.vue b/frontend/src/components/common/tag.vue
@@ -232,10 +232,11 @@ export default defineComponent ({
 
         // 处理输入值更改时候的option效果
         const handleInputchange = (value: string) => {
+            value = value.trim();
             const index = props.options.findIndex((item: any) => (
                 item.children.some((child: any) => child.name === value || child.id === value)
             ));
-            if (index === -1 && value && !localValue.value.includes(value)) {
+                        if (index === -1 && value && !localValue.value.includes(value)) {
                 state.popShow = true;
                 tag.value = value;
             } else {
@@ -252,7 +253,7 @@ export default defineComponent ({
         }
 
         const filterData = (filterVal :string, filterKey :string, data: []) => {
-            return data.filter((item: Record<string,any>) => item.id.includes(filterVal) || item.name.includes(filterVal));
+            return data.filter((item: Record<string,any>) => item.id.includes(filterVal?.trim()) || item.name.includes(filterVal?.trim()));
         }
 
         // 新建标签

diff --git a/frontend/src/views/agent/components/choose-pkg-dialog.vue b/frontend/src/views/agent/components/choose-pkg-dialog.vue
@@ -53,6 +53,7 @@
             :data="tableData"
             :outer-border="false"
             :row-class-name="handleRowClass"
+            @sort-change="handleSortChange"
             @row-click="handleRowClick">
             <bk-table-column width="34">
               <template #default="{ row }">
@@ -70,7 +71,7 @@
                 </bk-radio>
               </template>
             </bk-table-column>
-            <NmColumn :label="$t('Agent版本')" sortable prop="version" :show-overflow-tooltip="false">
+            <NmColumn :label="$t('Agent版本')" sortable="custom" prop="version" :show-overflow-tooltip="false">
               <template #default="{ row }">
                 <span class="version">{{ row.version || '--' }}</span>
                 <FlexibleTag v-if="row.tags.length" :list="row.tags" />
@@ -101,6 +102,7 @@ import { defineComponent, nextTick, ref, toRefs, watch, PropType, computed } fro
 import { AgentStore } from '@/store';
 import FlexibleTag from '@/components/common/flexible-tag.vue';
 import { IPkgVersion, PkgType } from '@/types/agent/pkg-manage';
+import { compareVersions } from '@/common/util';
 
 export default defineComponent({
   name: 'ChoosePkgDialog',
@@ -180,7 +182,7 @@ export default defineComponent({
         os: props.osType,
         cpu_arch: props.cpuArch,
         versions:props.versions,
-      });
+              });
       defaultVersion.value = default_version;
       currentLatestVersion.value = machine_latest_version;
       const builtinTags = ['stable', 'latest', 'test'];
@@ -222,7 +224,16 @@ export default defineComponent({
         return 'row-active';
       }
     };
-
+    // 版本排序
+    const handleSortChange = async ({ prop, order }: { prop: string, order: string }) => {
+      if (prop === 'version') {
+        tableData.value = tableData.value.sort((a, b) => {
+          return order === 'ascending'
+            ? compareVersions(a.version,b.version)
+            : compareVersions(b.version,a.version);
+        });
+      }
+    }
     const handleRowClick = async (row: IPkgVersion) => {
       if (!row.disabled) {
         selectedRow.value = row;
@@ -309,6 +320,7 @@ export default defineComponent({
       markdown,
       allOsVersions,
       handleConfirm,
+      handleSortChange,
       handleCancel,
       handleRowClass,
       handleRowClick,