fix: 体验问题修复 TencentBlueKing#1684

# Reviewed, transaction id: 7657

src/pages/src/components/field-mapping/FieldMapping.vue

@@ -81,9 +81,9 @@
             v-for="option in apiFields"
             :key="option.key"
             :id="option.key"
-            :name="option.key"
+            :name="formatOptionName(option)"
             :disabled="option.disabled">
-            <span>{{option.key}}</span>
+            <span>{{ formatOptionName(option) }}</span>
           </bk-option>
         </bk-select>
       </bk-form-item>
@@ -134,6 +134,8 @@ const customConditions = ref([
   { name: t('直接'), key: 'direct' },
   { name: t('表达式'), key: 'expression' },
 ]);
+
+const formatOptionName = (option: any) => (option.display_name ? `${option.display_name}（${option.key}）` : option.key);
 </script>
 
 <style lang="less" scoped>

src/pages/src/hooks/useAdminPassword.ts

@@ -51,7 +51,6 @@ export const useAdminPassword = (formData) => {
   };
 
   const changeCountryCode = (code: string) => {
-    console.log('code', code);
     formData.phone_country_code = code;
   };
 

src/pages/src/views/Header.vue

@@ -129,7 +129,7 @@
 <script setup lang="ts">
 import { DownShape } from 'bkui-vue/lib/icon';
 import Cookies from 'js-cookie';
-import { computed, reactive, ref, onMounted } from 'vue';
+import { computed, onMounted, reactive, ref } from 'vue';
 import { useRoute } from 'vue-router';
 
 import NoticeComponent from '@blueking/notice-component';
@@ -138,12 +138,11 @@ import ReleaseNote from '@blueking/release-note';
 import '@blueking/notice-component/dist/style.css';
 import '@blueking/release-note/dist/vue3-light.css';
 import { logout } from '@/common/auth';
-import { getVersionLogs } from '@/http';
+import { getTenantInfo, getVersionLogs } from '@/http';
 import I18n, { t } from '@/language/index';
 import router from '@/router';
 import { useUser } from '@/store';
 import { logoConvert } from '@/utils';
-import { getVersionLogs, getTenantInfo } from '@/http';
 
 const state = reactive({
   logoutDropdown: false,
@@ -311,9 +310,9 @@ const openVersionLog = async () => {
         }
 
         .tenant-id {
+          max-width: 150px;
           margin: 0 8px 0 4px;
           color: #FFF;
-          max-width: 150px;
         }
 
         .icon-shezhi {

src/pages/src/views/setting/cross-tenant-collaboration/my-share/OperationDetails.vue

@@ -93,7 +93,7 @@
     </bk-form>
     <div class="footer fixed">
       <bk-button theme="primary" @click="handleSave" :loading="btnLoading">
-        {{ $t('保存并启用') }}
+        {{ config.type === 'add' ? $t('保存并启用') : $t('保存')}}
       </bk-button>
       <bk-button @click="() => $emit('handleCancelEdit')">
         {{ $t('取消') }}

src/pages/src/views/setting/cross-tenant-collaboration/other-share/OperationDetails.vue

@@ -46,8 +46,8 @@
             :field-setting-data="fieldSettingData"
             :api-fields="apiFields"
             :rules="rulesFieldSetting"
-            :source-field="$t('源租户用户字段')"
-            :target-field="$t('本租户用户字段')"
+            :source-field="$t('本租户用户字段')"
+            :target-field="$t('源租户用户字段')"
             :disabled-builtin-field="true"
             @change-api-fields="changeApiFields"
             @handle-add-field="handleAddField"
@@ -147,7 +147,9 @@ onMounted(() => {
 const initFields = async () => {
   try {
     isLoading.value = true;
-    fieldSettingData.addFieldList = JSON.parse(JSON.stringify(formData.target_config.field_mapping));
+    if (formData.target_config?.field_mapping) {
+      fieldSettingData.addFieldList = JSON.parse(JSON.stringify(formData.target_config.field_mapping));
+    }
 
     const [fieldsRes, customRes] = await Promise.all([getFields(), getSourceTenantCustomFields(formData.id)]);
 
@@ -157,14 +159,26 @@ const initFields = async () => {
         source_field: fields.name,
         disabled: isDisabled,
       });
-      apiFields.value.push({ key: fields.name, disabled: isDisabled });
 
-      const targetFieldList = fieldSettingData.field_mapping[fieldMappingType];
-      targetFieldList.push(fields);
+      if (fieldMappingType !== 'source_fields') {
+        const targetFieldList = fieldSettingData.field_mapping[fieldMappingType];
+        targetFieldList.push(fields);
+      }
+
+      const filterKeys = new Set(fieldSettingData.addFieldList?.map(item => (fieldMappingType === 'custom_fields'
+        ? item.target_field
+        : item.source_field
+      )));
+      fields.disabled = filterKeys.has(fields.name);
 
       if (fieldMappingType === 'custom_fields') {
-        const filterKeys = new Set(fieldSettingData.addFieldList?.map(item => item.source_field));
-        fields.disabled = filterKeys.has(fields.name);
+        fieldSettingData.field_mapping.custom_fields?.forEach((item) => {
+          if (filterKeys.has(item.name)) {
+            item.disabled = true;
+          }
+        });
+      } else if (fieldMappingType === 'source_fields') {
+        apiFields.value.push({ key: fields.name, disabled: isDisabled, display_name: fields.display_name });
         apiFields.value.forEach((item) => {
           if (filterKeys.has(item.key)) {
             item.disabled = true;
@@ -173,9 +187,9 @@ const initFields = async () => {
       }
     };
     // 自定义字段的数据来源是本租户的自定义字段
-    fieldsRes.data.custom_fields = customRes?.data || [];
     fieldsRes.data?.builtin_fields?.forEach(field => mapFields(field, true, 'builtin_fields'));
     fieldsRes.data?.custom_fields?.forEach(field => mapFields(field, false, 'custom_fields'));
+    customRes?.data?.forEach(field => mapFields(field, false, 'source_fields'));
   } finally {
     isLoading.value = false;
   }
@@ -256,9 +270,11 @@ const cancelEdit = () => {
 const saveEdit = async () => {
   await formRef.value.validate();
   if (props.config.type === 'view') {
-    handleSave();
+    await handleSave();
+    isEdit.value = false;
+  } else {
+    isEdit.value = false;
   }
-  isEdit.value = false;
 };
 
 const handleSave = async () => {

src/pages/src/views/setting/cross-tenant-collaboration/other-share/index.vue

@@ -16,6 +16,7 @@
       :max-height="tableMaxHeight"
       show-overflow-tooltip
       @column-filter="handleFilter"
+      :row-class="tableRowClassName"
     >
       <template #empty>
         <Empty
@@ -255,6 +256,14 @@ const detailsConfig = reactive({
   type: '',
 });
 
+//  状态为unconfirmed的行添加class
+const tableRowClassName = (item) => {
+  if (item.target_status === 'unconfirmed') {
+    return 'unconfirmed';
+  }
+  return '';
+};
+
 const fetchFromStrategies = async () => {
   try {
     isLoading.value = true;
@@ -263,15 +272,6 @@ const fetchFromStrategies = async () => {
     const res = await getFromStrategies();
     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;

src/pages/src/views/tenant/OperationDetails.vue

@@ -200,9 +200,11 @@ const handleError = (file) => {
 // 校验表单
 async function handleSubmit() {
   if (isEmail.value) {
-    handleBlur();
-  } else if (formData.phone === '') {
-    changeTelError(true);
+    return handleBlur();
+  }
+
+  if (formData.phone === '') {
+    return changeTelError(true);
   }
 
   await formRef.value.validate();