feat: 客户端查询列表展示“最后一次拉取配置耗时”字段 (#3528)

TencentBlueKing · Sep 23, 2024 · 28a3fc4 · 28a3fc4
1 parent f1a0ce4
commit 28a3fc4
Show file tree

Hide file tree

Showing 4 changed files with 32 additions and 1 deletion.
diff --git a/bcs-services/bcs-bscp/ui/src/i18n/en-us.ts b/bcs-services/bcs-bscp/ui/src/i18n/en-us.ts
@@ -1064,6 +1064,7 @@ export default {
   '组件类型 / 版本分布': 'Component type / Version distribution',
   下钻: 'Drill down',
   总和: 'Total',
+  最后一次拉取配置耗时: 'Last pull time-consuming',
 
   // 跨页全选
   跨页全选: 'AcrossChecked',

diff --git a/bcs-services/bcs-bscp/ui/src/i18n/zh-cn.ts b/bcs-services/bcs-bscp/ui/src/i18n/zh-cn.ts
@@ -1068,6 +1068,7 @@ export default {
   '组件类型 / 版本分布': '组件类型 / 版本分布',
   下钻: '下钻',
   总和: '总和',
+  最后一次拉取配置耗时: '最后一次拉取配置耗时',
 
   // 跨页全选
   跨页全选: '跨页全选',

diff --git a/bcs-services/bcs-bscp/ui/src/views/space/client/search/index.vue b/bcs-services/bcs-bscp/ui/src/views/space/client/search/index.vue
@@ -24,6 +24,7 @@
           @page-limit-change="handlePageLimitChange"
           @page-value-change="loadList(true)"
           @column-filter="handleFilter"
+          @column-sort="handleSort"
           @setting-change="handleSettingsChange">
           <template #prepend>
             <render-table-tip />
@@ -106,6 +107,21 @@
               </div>
             </template>
           </bk-table-column>
+          <bk-table-column
+            v-if="selectedShowColumn.includes('online-status')"
+            :label="t('最后一次拉取配置耗时')"
+            :width="200"
+            :sort="true">
+            <template #default="{ row }">
+              <span v-if="row.client">
+                {{
+                  row.client.spec.total_seconds > 1
+                    ? `${Math.round(row.client.spec.total_seconds)}s`
+                    : `${Math.round(row.client.spec.total_seconds * 1000)}ms`
+                }}
+              </span>
+            </template>
+          </bk-table-column>
           <!-- <bk-table-column label="附加信息" :width="244"></bk-table-column> -->
           <bk-table-column
             v-if="selectedShowColumn.includes('online-status')"
@@ -321,6 +337,7 @@
   ];
   const onlineStatusFilterChecked = ref<string[]>([]);
   const pollTimer = ref(0);
+  const updateSortType = ref('null');
 
   // 当前页数据，不含禁用
   const selecTableData = computed(() => {
@@ -545,6 +562,11 @@
         desc: 'online_status',
       },
     };
+    if (updateSortType.value === 'desc') {
+      params.order!.desc = 'online_status,total_seconds';
+    } else if (updateSortType.value === 'asc') {
+      params.order!.asc = 'total_seconds';
+    }
     try {
       listLoading.value = true;
       const res = await getClientQueryList(bkBizId.value, appId.value, params);
@@ -608,6 +630,11 @@
     }
   };
 
+  const handleSort = ({ type }: any) => {
+    updateSortType.value = type;
+    loadList();
+  };
+
   const handleSettingsChange = ({ checked, size }: any) => {
     selectedShowColumn.value = [...checked];
     localStorage.setItem('client-show-column', JSON.stringify({ checked, size }));

diff --git a/...pace/templates/list/package-detail/operations/add-configs/import-configs/config-table.vue b/...pace/templates/list/package-detail/operations/add-configs/import-configs/config-table.vue
@@ -171,7 +171,9 @@
       <RecycleScroller class="table-body" :items="data" :item-size="44" key-field="fileAP" v-slot="{ item, index }">
         <div class="table-row">
           <div class="not-editable td-cell name">
-            {{ item.fileAP }}
+            <span class="text-ov">
+              {{ item.fileAP }}
+            </span>
           </div>
           <div class="not-editable td-cell type">
             {{ item.file_type === 'text' ? t('文本') : t('二进制') }}