fix: 体验问题修复 (#1355)

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

@@ -181,8 +181,12 @@ const customConditions = ref([
   .icon-minus-fill {
     margin-left: 16px;
     font-size: 16px;
-    color: #EA3636;
+    color: #dcdee5;
     cursor: pointer;
+
+    &:hover {
+      color: #c4c6cc;
+    }
   }
 }
 

src/pages/src/views/data-source/local-details/EditUser.vue

@@ -140,7 +140,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, defineEmits, defineProps, reactive, ref, watch } from 'vue';
+import { computed, defineEmits, defineProps, onMounted, reactive, ref, watch } from 'vue';
 
 import phoneInput from '@/components/phoneInput.vue';
 import useValidate from '@/hooks/use-validate';
@@ -239,42 +239,49 @@ const leadersParams = reactive({
   pageSize: 10,
 });
 
-const changeCountryCode = async (code: string) => {
-  formData.phone_country_code = code;
+onMounted(async () => {
   const departments = await getDataSourceDepartments(departmentsParams);
   const leaders = await getDataSourceLeaders(leadersParams);
   state.departments = departments.data.results;
   departmentsCount.value = departments.data.count;
-  state.leaders = leaders.data.results;
+  state.leaders = leaders.data.results.filter(item => item.id !== props.currentId);
   leadersCount.value = leaders.data.count;
+});
+
+const changeCountryCode = (code: string) => {
+  formData.phone_country_code = code;
 };
 
 const departmentsScrollEnd = () => {
-  if (departmentsParams.name || departmentsCount.value <= (departmentsParams.page * 10)) return;
-  scrollLoading.value = true;
-  departmentsParams.page += 1;
-  getDataSourceDepartments(departmentsParams).then((res) => {
-    state.departments.push(...res.data.results.filter(item => item));
-    scrollLoading.value = false;
-  })
-    .catch((e) => {
-      console.warn(e);
+  if (departmentsCount.value > (departmentsParams.page * 10)) {
+    scrollLoading.value = true;
+    departmentsParams.page += 1;
+    getDataSourceDepartments(departmentsParams).then((res) => {
+      state.departments.push(...res.data.results.filter(item => item));
+      departmentsCount.value = res.data.count;
       scrollLoading.value = false;
-    });
+    })
+      .catch((e) => {
+        console.warn(e);
+        scrollLoading.value = false;
+      });
+  }
 };
 
 const leadersScrollEnd = () => {
-  if (leadersParams.keyword || leadersCount.value <= (leadersParams.page * 10)) return;
-  scrollLoading.value = true;
-  leadersParams.page += 1;
-  getDataSourceLeaders(leadersParams).then((res) => {
-    state.leaders.push(...res.data.results.filter(item => item));
-    scrollLoading.value = false;
-  })
-    .catch((e) => {
-      console.warn(e);
+  if (leadersCount.value > (leadersParams.page * 10)) {
+    scrollLoading.value = true;
+    leadersParams.page += 1;
+    getDataSourceLeaders(leadersParams).then((res) => {
+      state.leaders.push(...res.data.results.filter(item => item.id !== props.currentId));
+      leadersCount.value = res.data.count;
       scrollLoading.value = false;
-    });
+    })
+      .catch((e) => {
+        console.warn(e);
+        scrollLoading.value = false;
+      });
+  }
 };
 
 const handleDelete = () => {
@@ -309,18 +316,28 @@ const handleSubmit = async () => {
   window.changeInput = false;
 };
 
-const searchDepartments = async (value: string) => {
+const searchDepartments = (value: string) => {
   departmentsParams.name = value;
   departmentsParams.page = 1;
-  const departments = await getDataSourceDepartments(departmentsParams);
-  state.departments = departments.data.results;
+  getDataSourceDepartments(departmentsParams).then((res) => {
+    state.departments = res.data.results;
+    departmentsCount.value = res.data.count;
+  })
+    .catch((e) => {
+      console.warn(e);
+    });
 };
 
-const searchLeaders = async (value: string) => {
+const searchLeaders = (value: string) => {
   leadersParams.keyword = value;
   leadersParams.page = 1;
-  const leaders = await getDataSourceLeaders(leadersParams);
-  state.leaders = leaders.data.results;
+  getDataSourceLeaders(leadersParams).then((res) => {
+    state.leaders = res.data.results.filter(item => item.id !== props.currentId);
+    leadersCount.value = res.data.count;
+  })
+    .catch((e) => {
+      console.warn(e);
+    });
 };
 
 const handleChange = () => {

src/pages/src/views/data-source/local-details/UserInfo.vue

@@ -169,15 +169,14 @@
       </bk-upload>
       <template #footer>
         <div class="footer-wrapper">
-          <div>
+          <div class="footer-left">
             <bk-checkbox v-model="uploadInfo.overwrite">
               允许对同名用户覆盖更新
             </bk-checkbox>
             <bk-popover
               ext-cls="popover-wrapper"
               content="勾选覆盖用户信息将会对数据源中存在、但文件中不存在的成员执行删除操作，请谨慎选择。"
               placement="top"
-              theme="light"
               width="280"
             >
               <InfoLine class="info" />
@@ -492,12 +491,6 @@ const closed = () => {
 };
 </script>
 
-<style lang="less">
-.popover-wrapper {
-  color: #63656E !important;
-}
-</style>
-
 <style lang="less" scoped>
 .user-info-wrapper {
   width: 100%;
@@ -645,10 +638,15 @@ const closed = () => {
   align-items: center;
   justify-content: space-between;
 
+  .footer-left {
+    display: flex;
+    align-items: center;
+  }
+
   .info {
     margin-left: 5px;
-    font-size: 14px;
-    color: #63656E;
+    font-size: 16px;
+    color: #979BA5;
     cursor: pointer;
   }
 }

src/pages/src/views/data-source/new-data/index.less

@@ -48,7 +48,7 @@
         display: flex;
 
         .input-password {
-          width: 240px;
+          width: 380px;
           margin-left: 24px;
         }
       }

src/pages/src/views/tenant/group-details/OperationDetails.vue

@@ -533,7 +533,7 @@ const handleRandomPassword = async () => {
     }
 
     .input-password {
-      width: 240px;
+      width: 380px;
       margin-left: 24px;
     }
   }