style: 样式优化

--bug=1035283 --user=吕梦园
https://www.tapd.cn/55049933/bugtrace/bugs/view/1155049933001035283
--bug=1035615 --user=吕梦园
https://www.tapd.cn/55049933/bugtrace/bugs/view/1155049933001035615

frontend/src/assets/style/global.less

@@ -216,3 +216,11 @@ body {
     }
   }
 }
+
+// 表格选中行样式
+.selected-row-class.arco-table-tr {
+  background: var(--color-fill-1) !important;
+  .arco-table-td {
+    background: var(--color-fill-1) !important;
+  }
+}

frontend/src/components/business/ms-batch-form/index.vue

@@ -194,15 +194,16 @@
               class="minus"
               :class="[
                 'flex',
-                'h-full',
+                'h-[32px]',
                 'w-[32px]',
                 'cursor-pointer',
                 'items-center',
                 'justify-center',
                 'text-[var(--color-text-4)]',
-                'mt-[8px]',
+                'hover:bg-[var(--color-text-n9)]',
+                'rounded',
               ]"
-              :style="{ 'margin-top': index === 0 && !props.isShowDrag ? '36px' : '' }"
+              :style="{ 'margin-top': index === 0 && !props.isShowDrag ? '30px' : '' }"
               @click="removeField(index)"
             >
               <icon-minus-circle />

frontend/src/components/pure/ms-drawer/index.vue

@@ -19,8 +19,8 @@
     <template #title>
       <div class="flex items-center justify-between gap-[4px]">
         <slot name="title">
-          <div class="flex flex-1 items-center justify-between">
+          <div class="flex flex-1 items-center justify-between overflow-hidden">
-            <div class="flex items-center">
+            <div class="flex items-center overflow-hidden">
               <a-tooltip :disabled="!props.title" :content="props.title">
                 <span class="one-line-text max-w-[300px]"> {{ props.title }}</span>
               </a-tooltip>

frontend/src/views/setting/organization/project/components/userDrawer.vue

@@ -8,6 +8,17 @@
     :mask="false"
     @cancel="handleCancel"
   >
+    <template #headerLeft>
+      <a-tooltip :content="props.currentName">
+        <div class="ml-[8px] flex flex-1 overflow-hidden text-[var(--color-text-4)]">
+          (
+          <div class="one-line-text flex-1">
+            {{ props.currentName }}
+          </div>
+          )
+        </div>
+      </a-tooltip>
+    </template>
     <div>
       <div class="flex flex-row justify-between">
         <a-button
@@ -117,6 +128,7 @@
     visible: boolean;
     organizationId?: string;
     projectId?: string;
+    currentName?: string;
   }
   const { t } = useI18n();
   const props = defineProps<projectDrawerProps>();

frontend/src/views/setting/organization/project/orgProject.vue

@@ -17,7 +17,7 @@
         @clear="fetchData"
       ></a-input-search>
     </div>
-    <MsBaseTable v-bind="propsRes" v-on="propsEvent" @enable-change="enableChange">
+    <MsBaseTable v-bind="propsRes" :row-class="getRowClass" v-on="propsEvent" @enable-change="enableChange">
       <template #revokeDelete="{ record }">
         <a-tooltip class="ms-tooltip-white">
           <template #content>
@@ -271,6 +271,7 @@
   const currentUserDrawer = reactive({
     visible: false,
     projectId: '',
+    currentName: '',
   });
 
   const tableActions: ActionsItem[] = [
@@ -339,10 +340,16 @@
   const showUserDrawer = (record: TableData) => {
     currentUserDrawer.visible = true;
     currentUserDrawer.projectId = record.id;
+    currentUserDrawer.currentName = record.name;
   };
 
+  function getRowClass(record: TableData) {
+    return record.id === currentUserDrawer.projectId ? 'selected-row-class' : '';
+  }
+
   const handleUserDrawerCancel = () => {
     currentUserDrawer.visible = false;
+    currentUserDrawer.projectId = '';
   };
 
   const handleAddProjectModalCancel = (shouldSearch: boolean) => {

frontend/src/views/setting/system/organizationAndProject/components/systemOrganization.vue

@@ -1,5 +1,5 @@
 <template>
-  <MsBaseTable v-bind="propsRes" v-on="propsEvent" @enable-change="enableChange">
+  <MsBaseTable v-bind="propsRes" :row-class="getRowClass" v-on="propsEvent" @enable-change="enableChange">
     <template #revokeDelete="{ record }">
       <a-tooltip class="ms-tooltip-white">
         <template #content>
@@ -325,8 +325,13 @@
     currentUserDrawer.currentName = record.name;
   };
 
+  function getRowClass(record: TableData) {
+    return record.id === currentUserDrawer.organizationId ? 'selected-row-class' : '';
+  }
+
   const handleUserDrawerCancel = () => {
     currentUserDrawer.visible = false;
+    currentUserDrawer.organizationId = '';
   };
 
   const handleAddOrgModalCancel = (shouldSearch: boolean) => {

frontend/src/views/setting/system/organizationAndProject/components/systemProject.vue

@@ -1,5 +1,5 @@
 <template>
-  <MsBaseTable v-bind="propsRes" v-on="propsEvent" @enable-change="enableChange">
+  <MsBaseTable v-bind="propsRes" :row-class="getRowClass" v-on="propsEvent" @enable-change="enableChange">
     <template #revokeDelete="{ record }">
       <a-tooltip class="ms-tooltip-white">
         <template #content>
@@ -292,6 +292,10 @@
     currentUserDrawer.currentName = record.name;
   };
 
+  function getRowClass(record: TableData) {
+    return record.id === currentUserDrawer.projectId ? 'selected-row-class' : '';
+  }
+
   const handleUserDrawerCancel = () => {
     currentUserDrawer.visible = false;
     currentUserDrawer.projectId = '';

frontend/src/views/setting/system/organizationAndProject/components/userDrawer.vue

@@ -9,6 +9,17 @@
     :title="t('system.memberList')"
     @cancel="handleCancel"
   >
+    <template #headerLeft>
+      <a-tooltip :content="props.currentName">
+        <div class="ml-[8px] flex flex-1 overflow-hidden text-[var(--color-text-4)]">
+          (
+          <div class="one-line-text flex-1">
+            {{ props.currentName }}
+          </div>
+          )
+        </div>
+      </a-tooltip>
+    </template>
     <div>
       <div class="flex flex-row justify-between">
         <a-button

frontend/src/views/test-plan/report/detail/component/system-card/testTableIndex.vue

@@ -177,10 +177,4 @@
     @apply overflow-y-auto;
     .ms-scroll-bar();
   }
-  :deep(.selected-row-class.arco-table-tr) {
-    background: var(--color-fill-1) !important;
-    .arco-table-td {
-      background: var(--color-fill-1) !important;
-    }
-  }
 </style>