fix(frontend): 集群列表复制 ip去重 TencentBlueKing#8973

jinquantianxia · Jan 8, 2025 · 9fc2155 · 9fc2155
1 parent 94379a1
commit 9fc2155
Show file tree

Hide file tree

Showing 13 changed files with 66 additions and 112 deletions.
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/Index.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/Index.vue
@@ -228,6 +228,7 @@
         display: flex;
         height: 32px;
         padding: 0 12px;
+        line-height: 32px;
         cursor: pointer;
         align-items: center;
         justify-content: space-between;
@@ -238,10 +239,18 @@
         }
 
         .value-text {
-          display: flex;
-          height: 32px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          word-break: keep-all;
+          white-space: nowrap;
           cursor: pointer;
           align-items: center;
+          flex: 0 1 auto;
+
+          .intro {
+            padding-left: 4px;
+            color: #c4c6cc;
+          }
 
           &:hover {
             background: #f5f7fa;
@@ -253,18 +262,8 @@
             overflow: unset;
           }
 
-          .value-text {
-            display: flex;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            word-break: keep-all;
-            white-space: nowrap;
-            flex: 0 1 auto;
-
-            .intro {
-              padding-left: 4px;
-              color: #c4c6cc;
-            }
+          * {
+            display: inline;
           }
         }
 

diff --git a/...ntend/src/components/system-search/components/search-result/render-result/ClusterName.vue b/...ntend/src/components/system-search/components/search-result/render-result/ClusterName.vue
@@ -5,15 +5,13 @@
       :key="item.name"
       class="result-item"
       @click="handleGo(item)">
-      <TextOverflowLayout>
-        <div class="value-text">
-          <HightLightText
-            class="keyword-highlight"
-            :key-word="keyWord"
-            :text="item.name" />
-          <div class="intro">（{{ item.immute_domain }}）</div>
-        </div>
-      </TextOverflowLayout>
+      <div class="value-text">
+        <HightLightText
+          class="keyword-highlight"
+          :key-word="keyWord"
+          :text="item.name" />
+        <span class="intro">（{{ item.immute_domain }}）</span>
+      </div>
       <div class="biz-text">
         {{ bizIdNameMap[item.bk_biz_id] }}
       </div>
@@ -24,7 +22,6 @@
   import { systemSearchCache } from '@common/cache';
 
   import { useRedirect } from '@components/system-search/hooks/useRedirect';
-  import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
   import HightLightText from './components/HightLightText.vue';
 

diff --git a/...frontend/src/components/system-search/components/search-result/render-result/Instance.vue b/...frontend/src/components/system-search/components/search-result/render-result/Instance.vue
@@ -5,19 +5,17 @@
       :key="item.id"
       class="result-item"
       @click="handleGo(item)">
-      <TextOverflowLayout>
-        <div class="value-text">
-          <HightLightText
-            class="keyword-highlight"
-            :key-word="keyWord"
-            :text="getMatchText(item)" />
-          <div
-            v-if="item.cluster_domain"
-            class="intro">
-            （{{ item.cluster_domain }}）
-          </div>
-        </div>
-      </TextOverflowLayout>
+      <div class="value-text">
+        <HightLightText
+          class="keyword-highlight"
+          :key-word="keyWord"
+          :text="getMatchText(item)" />
+        <span
+          v-if="item.cluster_domain"
+          class="intro">
+          （{{ item.cluster_domain }}）
+        </span>
+      </div>
       <div class="biz-text">
         {{ bizIdNameMap[item.bk_biz_id] }}
       </div>
@@ -28,7 +26,6 @@
   import { systemSearchCache } from '@common/cache';
 
   import { useRedirect } from '@components/system-search/hooks/useRedirect';
-  import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
   import HightLightText from './components/HightLightText.vue';
 

diff --git a/...ui/frontend/src/components/system-search/components/search-result/render-result/entry.vue b/...ui/frontend/src/components/system-search/components/search-result/render-result/entry.vue
@@ -5,13 +5,11 @@
       :key="item.immute_domain"
       class="result-item"
       @click="handleGo(item)">
-      <TextOverflowLayout>
-        <div class="value-text">
-          <HightLightText
-            :key-word="formattedKeyword"
-            :text="item.immute_domain" />
-        </div>
-      </TextOverflowLayout>
+      <div class="value-text">
+        <HightLightText
+          :key-word="formattedKeyword"
+          :text="item.immute_domain" />
+      </div>
       <div class="biz-text">
         {{ bizIdNameMap[item.bk_biz_id] }}
       </div>
@@ -23,7 +21,6 @@
   import { batchSplitRegex } from '@common/regex';
 
   import { useRedirect } from '@components/system-search/hooks/useRedirect';
-  import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
   import HightLightText from './components/HightLightText.vue';
 

diff --git a/...end/src/views/db-manage/common/cluster-table-column/components/base-role-column/Index.vue b/...end/src/views/db-manage/common/cluster-table-column/components/base-role-column/Index.vue
@@ -117,10 +117,14 @@
   const { t } = useI18n();
 
   const getCopyList = (data: ClusterModel<T>[], field: 'ip' | 'instance') =>
-    data.reduce(
-      (result, item) =>
-        result.concat((item[props.field as keyof typeof item] as ClusterListNode[]).map((nodeItem) => nodeItem[field])),
-      [] as string[],
+    _.uniq(
+      data.reduce(
+        (result, item) =>
+          result.concat(
+            (item[props.field as keyof typeof item] as ClusterListNode[]).map((nodeItem) => nodeItem[field]),
+          ),
+        [] as string[],
+      ),
     );
 
   const getRoleInstanceList = (data: IRowData) => (_.get(data, props.field) || []) as ClusterListNode[];

diff --git a/...ntend/src/views/db-manage/redis/list/components/list/components/MasterSlaveRoleColume.vue b/...ntend/src/views/db-manage/redis/list/components/list/components/MasterSlaveRoleColume.vue
@@ -76,6 +76,7 @@
   </BaseRoleColumn>
 </template>
 <script setup lang="ts">
+  import _ from 'lodash';
   import { useI18n } from 'vue-i18n';
 
   import RedisModel from '@services/model/redis/redis';
@@ -93,13 +94,13 @@
   const { t } = useI18n();
 
   const handleCopy = (data: { ip: string; instance: string }[], field: 'ip' | 'instance') => {
-    const copyData = data.map((item) => item[field]);
+    const copyData = _.uniq(data.map((item) => item[field]));
     if (copyData.length < 1) {
       messageWarn('数据为空');
       return;
     }
     execCopy(
-      copyData.join(','),
+      copyData.join('\n'),
       t('成功复制n个', {
         n: copyData.length,
       }),

diff --git a/...c/views/db-manage/tendb-cluster/list/components/list/components/MasterSlaveRoleColume.vue b/...c/views/db-manage/tendb-cluster/list/components/list/components/MasterSlaveRoleColume.vue
@@ -73,6 +73,7 @@
   </BaseRoleColumn>
 </template>
 <script setup lang="ts">
+  import _ from 'lodash';
   import { useI18n } from 'vue-i18n';
 
   import TendbClusterModel from '@services/model/tendbcluster/tendbcluster';
@@ -92,13 +93,13 @@
   const { t } = useI18n();
 
   const handleCopy = (data: { ip: string; instance: string }[], field: 'ip' | 'instance') => {
-    const copyData = data.map((item) => item[field]);
+    const copyData = _.uniq(data.map((item) => item[field]));
     if (copyData.length < 1) {
       messageWarn('数据为空');
       return;
     }
     execCopy(
-      copyData.join(','),
+      copyData.join('\n'),
       t('成功复制n个', {
         n: copyData.length,
       }),

diff --git a/...nd/src/views/db-manage/tendb-cluster/list/components/list/components/RemoteRoleColumn.vue b/...nd/src/views/db-manage/tendb-cluster/list/components/list/components/RemoteRoleColumn.vue
@@ -76,6 +76,7 @@
   </BaseRoleColumn>
 </template>
 <script setup lang="ts">
+  import _ from 'lodash';
   import { useI18n } from 'vue-i18n';
 
   import TendbClusterModel from '@services/model/tendbcluster/tendbcluster';
@@ -88,22 +89,18 @@
 
   import { execCopy, messageWarn } from '@utils';
 
-  const props = defineProps<
-    Props<ClusterTypes.TENDBCLUSTER, 'remote_db' | 'remote_dr'> & {
-      field: 'remote_db' | 'remote_dr';
-    }
-  >();
+  const props = defineProps<Props<ClusterTypes.TENDBCLUSTER, 'remote_db' | 'remote_dr'>>();
 
   const { t } = useI18n();
 
   const handleCopy = (data: { ip: string; instance: string }[], field: 'ip' | 'instance') => {
-    const copyData = data.map((item) => item[field]);
+    const copyData = _.uniq(data.map((item) => item[field]));
     if (copyData.length < 1) {
       messageWarn('数据为空');
       return;
     }
     execCopy(
-      copyData.join(','),
+      copyData.join('\n'),
       t('成功复制n个', {
         n: copyData.length,
       }),

diff --git a/dbm-ui/frontend/src/views/ticket-center/common/TableModeTable.vue b/dbm-ui/frontend/src/views/ticket-center/common/TableModeTable.vue
@@ -91,7 +91,10 @@
           :label="t('单号')"
           width="100">
           <template #default="{ data }: { data: IRowData }">
-            <RouterLink
+            <AuthRouterLink
+              action-id="ticket_view"
+              :permission="data.permission.ticket_view"
+              :resource="data.id"
               target="_blank"
               :to="{
                 name: 'ticketDetail',
@@ -101,7 +104,7 @@
               }"
               @click="(event: MouseEvent) => handleGoDetail(data, event)">
               {{ data.id }}
-            </RouterLink>
+            </AuthRouterLink>
           </template>
         </BkTableColumn>
         <BkTableColumn

diff --git a/dbm-ui/frontend/src/views/ticket-center/common/hooks/use-date-picker.ts b/dbm-ui/frontend/src/views/ticket-center/common/hooks/use-date-picker.ts
@@ -1,6 +1,5 @@
 import dayjs from 'dayjs';
-import { computed, ref } from 'vue';
-import { onBeforeRouteLeave } from 'vue-router';
+import { computed, onBeforeUnmount, ref } from 'vue';
 
 import { useUrlSearch } from '@hooks';
 
@@ -80,7 +79,7 @@ export default () => {
     context = create();
   }
 
-  onBeforeRouteLeave(() => {
+  onBeforeUnmount(() => {
     context = undefined;
   });
 

diff --git a/dbm-ui/frontend/src/views/ticket-center/common/hooks/use-fetch-data.ts b/dbm-ui/frontend/src/views/ticket-center/common/hooks/use-fetch-data.ts
@@ -1,6 +1,5 @@
-import { reactive, ref } from 'vue';
+import { onBeforeUnmount, reactive, ref } from 'vue';
 import { useRequest } from 'vue-request';
-import { onBeforeRouteLeave } from 'vue-router';
 
 import TicketModel from '@services/model/ticket/ticket';
 import { getTickets, getTicketStatus } from '@services/source/ticket';
@@ -92,7 +91,7 @@ const create = (dataSource: typeof getTickets, options?: { onSuccess?: (data: Ti
 
   eventBus.on('refreshTicketStatus', fetchTicketStatus);
 
-  onBeforeRouteLeave(() => {
+  onBeforeUnmount(() => {
     eventBus.off('refreshTicketStatus', fetchTicketStatus);
   });
 
@@ -113,7 +112,7 @@ export default (...args: Parameters<typeof create>) => {
     context = create(...args);
   }
 
-  onBeforeRouteLeave(() => {
+  onBeforeUnmount(() => {
     context = undefined;
   });
 

diff --git a/dbm-ui/frontend/src/views/ticket-center/common/hooks/use-open-detail.ts b/dbm-ui/frontend/src/views/ticket-center/common/hooks/use-open-detail.ts
diff --git a/dbm-ui/frontend/src/views/ticket-center/common/hooks/use-search-select.ts b/dbm-ui/frontend/src/views/ticket-center/common/hooks/use-search-select.ts
@@ -1,7 +1,6 @@
-import { computed, shallowRef } from 'vue';
+import { computed, onBeforeUnmount, shallowRef } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useRequest } from 'vue-request';
-import { onBeforeRouteLeave } from 'vue-router';
 
 import TicketModel from '@services/model/ticket/ticket';
 import { getTicketTypes } from '@services/source/ticket';
@@ -117,7 +116,7 @@ export default (...args: Parameters<typeof create>) => {
     context = create(...args);
   }
 
-  onBeforeRouteLeave(() => {
+  onBeforeUnmount(() => {
     context = undefined;
   });