From 6829de2ea2e0c70ea34c06272522b9c7f3753450 Mon Sep 17 00:00:00 2001
From: v_yutyi <a670003190@qq.com>
Date: Fri, 10 May 2024 16:12:14 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E8=B7=A8=E7=A7=9F=E6=88=B7=E5=8D=8F?=
 =?UTF-8?q?=E5=90=8C=E4=BA=A4=E4=BA=92=E4=BC=98=E5=8C=96=20#1684=20#=20Rev?=
 =?UTF-8?q?iewed,=20transaction=20id:=207497?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../cross-tenant-collaboration/index.vue      | 19 ++++---
 .../my-share/index.vue                        | 19 +++++--
 .../other-share/OperationDetails.vue          |  2 +-
 .../other-share/index.vue                     | 50 +++++++++++++++----
 src/pages/src/views/tenant/index.vue          |  2 +-
 5 files changed, 64 insertions(+), 28 deletions(-)

diff --git a/src/pages/src/views/setting/cross-tenant-collaboration/index.vue b/src/pages/src/views/setting/cross-tenant-collaboration/index.vue
index 5921eb52f..2588853b1 100644
--- a/src/pages/src/views/setting/cross-tenant-collaboration/index.vue
+++ b/src/pages/src/views/setting/cross-tenant-collaboration/index.vue
@@ -5,32 +5,31 @@
     type="unborder-card"
   >
     <bk-tab-panel
-      v-for="(item, index) in panels"
-      :key="index"
+      v-for="item in panels"
+      :key="item.name"
       :name="item.name"
       :label="item.label"
     >
-      <MyShare v-if="active === 'local'" />
-      <OtherShare v-else />
+      <component :is="item.component" :active="active"></component>
     </bk-tab-panel>
   </bk-tab>
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue';
-
-import MyShare from './my-share/index.vue';
-import OtherShare from './other-share/index.vue';
+import { defineAsyncComponent, ref } from 'vue';
 
 import { t } from '@/language/index';
 import { useMainViewStore } from '@/store';
 
+const MyShare = defineAsyncComponent(() => import('./my-share/index.vue'));
+const OtherShare = defineAsyncComponent(() => import('./other-share/index.vue'));
+
 const store = useMainViewStore();
 store.customBreadcrumbs = false;
 
 const panels = [
-  { name: 'local', label: t('我分享的') },
-  { name: 'other', label: t('其他租户分享的') },
+  { name: 'local', label: t('我分享的'), component: MyShare },
+  { name: 'other', label: t('其他租户分享的'), component: OtherShare },
 ];
 const active = ref('local');
 </script>
diff --git a/src/pages/src/views/setting/cross-tenant-collaboration/my-share/index.vue b/src/pages/src/views/setting/cross-tenant-collaboration/my-share/index.vue
index fbde21205..9bd65b750 100644
--- a/src/pages/src/views/setting/cross-tenant-collaboration/my-share/index.vue
+++ b/src/pages/src/views/setting/cross-tenant-collaboration/my-share/index.vue
@@ -99,7 +99,7 @@
 
 <script setup lang="ts">
 import { bkTooltips as vBkTooltips, InfoBox, Message } from 'bkui-vue';
-import { computed, inject, onMounted, reactive, ref, watch } from 'vue';
+import { computed, defineProps, inject, reactive, ref, watch, watchEffect } from 'vue';
 
 import OperationDetails from './OperationDetails.vue';
 import ViewDetails from './ViewDetails.vue';
@@ -114,6 +114,13 @@ const store = useMainViewStore();
 store.customBreadcrumbs = false;
 const userStore = useUser();
 
+const props = defineProps({
+  active: {
+    type: String,
+    default: '',
+  },
+});
+
 const tableMaxHeight = useTableMaxHeight(202);
 const editLeaveBefore = inject('editLeaveBefore');
 const isLoading = ref(false);
@@ -123,10 +130,6 @@ const isDataError = ref(false);
 const isSearchEmpty = ref(false);
 const search = ref('');
 
-onMounted(() => {
-  fetchToStrategies();
-});
-
 // 获取协同策略列表
 const fetchToStrategies = async () => {
   try {
@@ -146,6 +149,12 @@ const fetchToStrategies = async () => {
   }
 };
 
+watchEffect(() => {
+  if (props.active === 'local') {
+    fetchToStrategies();
+  }
+});
+
 const statusFilters = [
   { text: t('启用'), value: 'enabled' },
   { text: t('停用'), value: 'disabled' },
diff --git a/src/pages/src/views/setting/cross-tenant-collaboration/other-share/OperationDetails.vue b/src/pages/src/views/setting/cross-tenant-collaboration/other-share/OperationDetails.vue
index b4048e58a..f12d994f3 100644
--- a/src/pages/src/views/setting/cross-tenant-collaboration/other-share/OperationDetails.vue
+++ b/src/pages/src/views/setting/cross-tenant-collaboration/other-share/OperationDetails.vue
@@ -271,7 +271,7 @@ const handleSave = async () => {
     },
   };
 
-  await props.config.type === 'view' ? putFromStrategies(params) : putFromStrategiesConfirm(params);
+  props.config.type === 'view' ? await putFromStrategies(params) : await putFromStrategiesConfirm(params);
   Message({ theme: 'success', message: t('更新成功') });
   emit('updateList');
 };
diff --git a/src/pages/src/views/setting/cross-tenant-collaboration/other-share/index.vue b/src/pages/src/views/setting/cross-tenant-collaboration/other-share/index.vue
index 2da1ddadb..811088bab 100644
--- a/src/pages/src/views/setting/cross-tenant-collaboration/other-share/index.vue
+++ b/src/pages/src/views/setting/cross-tenant-collaboration/other-share/index.vue
@@ -1,5 +1,7 @@
 <template>
-  <div v-bkloading="{ loading: isLoading, zIndex: 9 }" class="user-info-wrapper user-scroll-y">
+  <div
+    v-bkloading="{ loading: isLoading, zIndex: 9 }"
+    :class="['user-info-wrapper user-scroll-y', { 'has-alert': userStore.showAlert }]">
     <!-- 一期不做 -->
     <!-- <header>
       <bk-button text theme="primary" @click="handleUpdateRecord">
@@ -206,7 +208,7 @@
 </template>
 
 <script setup lang="ts">
-import { inject, onMounted, reactive, ref } from 'vue';
+import { defineProps, inject, reactive, ref, watchEffect } from 'vue';
 
 import OperationDetails from './OperationDetails.vue';
 
@@ -214,11 +216,19 @@ import Empty from '@/components/Empty.vue';
 import { useTableMaxHeight } from '@/hooks';
 import { getFromStrategies, putFromStrategiesStatus } from '@/http';
 import { t } from '@/language/index';
-import { useMainViewStore } from '@/store';
+import { useMainViewStore, useUser } from '@/store';
 import { dataSourceStatus } from '@/utils';
 
 const store = useMainViewStore();
 store.customBreadcrumbs = false;
+const userStore = useUser();
+
+const props = defineProps({
+  active: {
+    type: String,
+    default: '',
+  },
+});
 
 const tableMaxHeight = useTableMaxHeight(238);
 const editLeaveBefore = inject('editLeaveBefore');
@@ -245,20 +255,24 @@ const detailsConfig = reactive({
   type: '',
 });
 
-onMounted(() => {
-  fetchFromStrategies();
-});
-
 const fetchFromStrategies = async () => {
   try {
     isLoading.value = true;
     isDataEmpty.value = false;
     isDataError.value = false;
     const res = await getFromStrategies();
-    tableData.value = res?.data;
-    if (tableData.value.length === 0) {
-      isDataEmpty.value = true;
-    }
+    tableData.value = res.data?.sort(a => (a.target_status === 'unconfirmed' ? -1 : 1));
+
+    const table = document.querySelector('.user-info-table');
+    const rows = table.querySelectorAll('.hover-highlight');
+    rows.forEach((row) => {
+      const statusCell = row.cells[1];
+      if (statusCell.textContent.trim() === t('待确认')) {
+        row.classList.add('unconfirmed');
+      }
+    });
+
+    isDataEmpty.value = tableData.value.length === 0;
   } catch (error) {
     isDataError.value = true;
   } finally {
@@ -266,6 +280,12 @@ const fetchFromStrategies = async () => {
   }
 };
 
+watchEffect(() => {
+  if (props.active === 'other') {
+    fetchFromStrategies();
+  }
+});
+
 const handleFilter = ({ checked }) => {
   if (checked.length === 0) return isDataEmpty.value = false;
   isDataEmpty.value = !tableData.value.some(item => checked.includes(item.status));
@@ -328,6 +348,10 @@ const updateList = () => {
 </script>
 
 <style lang="less" scoped>
+.has-alert {
+  height: calc(100vh - 180px) !important;
+}
+
 .user-info-wrapper {
   width: 100%;
   height: calc(100vh - 140px);
@@ -348,6 +372,10 @@ const updateList = () => {
   }
 
   :deep(.user-info-table) {
+    .unconfirmed td {
+      background-color: #F2FCF5;
+    }
+
     .bk-table-head {
       table thead th {
         text-align: center;
diff --git a/src/pages/src/views/tenant/index.vue b/src/pages/src/views/tenant/index.vue
index 205205101..eea0eb550 100644
--- a/src/pages/src/views/tenant/index.vue
+++ b/src/pages/src/views/tenant/index.vue
@@ -413,7 +413,7 @@ const fetchTenantsList = () => {
 
         const rows = getRows();
         for (const i of rows) {
-          i.style.background = '#DCFFE2';
+          i.style.background = '#F2FCF5';
         }
       } else {
         state.list = res.data.sort((a, b) => a.name.localeCompare(b.name, 'zh-Hans-CN'));