From 824d3ccaeef489a69a5d3850cf226ee5d9e6b3c3 Mon Sep 17 00:00:00 2001
From: RubyLiu <liulubingjava@163.com>
Date: Mon, 14 Aug 2023 11:39:14 +0800
Subject: [PATCH] =?UTF-8?q?refactor(=E7=B3=BB=E7=BB=9F=E8=AE=BE=E7=BD=AE):?=
 =?UTF-8?q?=20=E7=94=A8=E6=88=B7=E7=BB=84=E7=AE=A1=E7=90=86=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2&=E8=A1=A8=E6=A0=BCtotal=E9=87=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/pure/ms-table/useTable.ts  |  7 +++---
 .../components/systemOrganization.vue         |  3 ++-
 .../system/organizationAndProject/index.vue   | 11 +++++----
 .../system/usergroup/components/authTable.vue |  2 +-
 .../system/usergroup/components/index.vue     |  2 --
 .../system/usergroup/components/userTable.vue | 14 +++++++++--
 .../views/setting/system/usergroup/index.vue  | 24 +++++++++++++------
 7 files changed, 43 insertions(+), 20 deletions(-)

diff --git a/frontend/src/components/pure/ms-table/useTable.ts b/frontend/src/components/pure/ms-table/useTable.ts
index f9b87d551d..65d5498f00 100644
--- a/frontend/src/components/pure/ms-table/useTable.ts
+++ b/frontend/src/components/pure/ms-table/useTable.ts
@@ -8,8 +8,6 @@ import { useAppStore } from '@/store';
 
 import type { TableData } from '@arco-design/web-vue';
 import { type MsTableProps, type MsTableData, type MsTableColumn, SpecialColumnEnum, MsTableErrorStatus } from './type';
-import { set } from 'nprogress';
-import debug from '@/utils/env';
 
 export interface Pagination {
   current: number;
@@ -130,7 +128,9 @@ export default function useTableProps(
   const setPagination = ({ current, total }: SetPaginationPrams) => {
     if (propsRes.value.msPagination && typeof propsRes.value.msPagination === 'object') {
       propsRes.value.msPagination.current = current;
-      propsRes.value.msPagination.total = total || 0;
+      if (total !== undefined) {
+        propsRes.value.msPagination.total = total;
+      }
     }
   };
 
@@ -190,6 +190,7 @@ export default function useTableProps(
       setTableErrorStatus('error');
     } finally {
       setLoading(false);
+      // eslint-disable-next-line no-console
       if (propsRes.value.debug) console.info(propsRes.value);
     }
   };
diff --git a/frontend/src/views/setting/system/organizationAndProject/components/systemOrganization.vue b/frontend/src/views/setting/system/organizationAndProject/components/systemOrganization.vue
index f8096a2862..b396e41f18 100644
--- a/frontend/src/views/setting/system/organizationAndProject/components/systemOrganization.vue
+++ b/frontend/src/views/setting/system/organizationAndProject/components/systemOrganization.vue
@@ -29,7 +29,7 @@
   import useTable from '@/components/pure/ms-table/useTable';
   import MsBaseTable from '@/components/pure/ms-table/base-table.vue';
   import { useTableStore } from '@/store';
-  import { ref, reactive, watchEffect, watch } from 'vue';
+  import { ref, reactive, watch } from 'vue';
   import type { ActionsItem } from '@/components/pure/ms-table-more-action/types';
   import { postOrgTable } from '@/api/modules/setting/system/organizationAndProject';
   import { TableKeyEnum } from '@/enums/tableEnum';
@@ -174,6 +174,7 @@
     noDisable: false,
     debug: true,
     size: 'default',
+    showSetting: true,
   });
 
   const fetchData = async () => {
diff --git a/frontend/src/views/setting/system/organizationAndProject/index.vue b/frontend/src/views/setting/system/organizationAndProject/index.vue
index 924c75aa03..61ffbe203c 100644
--- a/frontend/src/views/setting/system/organizationAndProject/index.vue
+++ b/frontend/src/views/setting/system/organizationAndProject/index.vue
@@ -11,9 +11,9 @@
       <div class="flex items-center">
         <a-input-search
           :placeholder="t('system.user.searchUser')"
-          class="w-[230px]"
-          @change="handleKeywordChange"
-          @search="handleKeywordChange"
+          class="w-[240px]"
+          @press-enter="handleEnter"
+          @search="handleSearch"
         ></a-input-search>
         <a-radio-group v-model="currentTable" class="ml-[14px]" type="button">
           <a-radio value="organization">{{
@@ -46,9 +46,12 @@
   const projectCount = ref(0);
   const currentKeyword = ref('');
 
-  const handleKeywordChange = (value: string) => {
+  const handleSearch = (value: string) => {
     currentKeyword.value = value;
   };
+  const handleEnter = (eve: Event) => {
+    currentKeyword.value = (eve.target as HTMLInputElement).value;
+  };
 
   const handleAddOrganization = () => {
     organizationVisible.value = true;
diff --git a/frontend/src/views/setting/system/usergroup/components/authTable.vue b/frontend/src/views/setting/system/usergroup/components/authTable.vue
index f90150d476..7737d076a8 100644
--- a/frontend/src/views/setting/system/usergroup/components/authTable.vue
+++ b/frontend/src/views/setting/system/usergroup/components/authTable.vue
@@ -93,7 +93,7 @@
     if ((column as TableColumnData).dataIndex === 'ability') {
       if (record.isSystem) {
         return {
-          rowspan: 2,
+          rowspan: systemSpan.value,
         };
       }
       if (record.isOrganization) {
diff --git a/frontend/src/views/setting/system/usergroup/components/index.vue b/frontend/src/views/setting/system/usergroup/components/index.vue
index fc81dd23da..43ff07cc57 100644
--- a/frontend/src/views/setting/system/usergroup/components/index.vue
+++ b/frontend/src/views/setting/system/usergroup/components/index.vue
@@ -1,7 +1,6 @@
 <template>
   <div class="user-group-left">
     <a-input-search
-      v-model="searchKey"
       class="w-[252px]"
       :placeholder="t('system.userGroup.searchHolder')"
       @press-enter="enterData"
@@ -75,7 +74,6 @@
 
   const { t } = useI18n();
 
-  const searchKey = ref('');
   const store = useUserGroupStore();
   const { openModal } = useModal();
   // 请求loading
diff --git a/frontend/src/views/setting/system/usergroup/components/userTable.vue b/frontend/src/views/setting/system/usergroup/components/userTable.vue
index 1d3fd8c230..595aab50a8 100644
--- a/frontend/src/views/setting/system/usergroup/components/userTable.vue
+++ b/frontend/src/views/setting/system/usergroup/components/userTable.vue
@@ -13,7 +13,7 @@
   import useTable from '@/components/pure/ms-table/useTable';
   import MsBaseTable from '@/components/pure/ms-table/base-table.vue';
   import { useUserGroupStore, useTableStore } from '@/store';
-  import { watchEffect, ref } from 'vue';
+  import { watchEffect, ref, watch } from 'vue';
   import { postUserByUserGroup, deleteUserFromUserGroup } from '@/api/modules/setting/usergroup';
   import { UserTableItem } from '@/models/setting/usergroup';
   import { TableKeyEnum } from '@/enums/tableEnum';
@@ -25,6 +25,9 @@
   const store = useUserGroupStore();
   const tableStore = useTableStore();
   const userVisible = ref(false);
+  const props = defineProps<{
+    keyword: string;
+  }>();
 
   const userGroupUsercolumns: MsTableColumn = [
     {
@@ -57,7 +60,7 @@
 
   tableStore.initColumn(TableKeyEnum.USERGROUPUSER, userGroupUsercolumns, 'drawer');
 
-  const { propsRes, propsEvent, loadList, setLoadListParams } = useTable(postUserByUserGroup, {
+  const { propsRes, propsEvent, loadList, setLoadListParams, setKeyword } = useTable(postUserByUserGroup, {
     tableKey: TableKeyEnum.USERGROUPUSER,
     scroll: { x: '600px' },
     selectable: true,
@@ -65,6 +68,7 @@
   });
 
   const fetchData = async () => {
+    setKeyword(props.keyword);
     await loadList();
   };
   const handleRemove = async (record: UserTableItem) => {
@@ -88,4 +92,10 @@
       fetchData();
     }
   });
+  watch(
+    () => props.keyword,
+    () => {
+      fetchData();
+    }
+  );
 </script>
diff --git a/frontend/src/views/setting/system/usergroup/index.vue b/frontend/src/views/setting/system/usergroup/index.vue
index 12dcc771ef..01eb04662f 100644
--- a/frontend/src/views/setting/system/usergroup/index.vue
+++ b/frontend/src/views/setting/system/usergroup/index.vue
@@ -12,11 +12,13 @@
         <div class="flex flex-row items-center justify-between">
           <div class="title">{{ store.userGroupInfo.currentName }}</div>
           <div class="flex items-center">
-            <a-input class="w-[240px]" :placeholder="t('system.userGroup.searchPlaceholder')">
-              <template #prefix>
-                <icon-search />
-              </template>
-            </a-input>
+            <a-input-search
+              v-if="currentTable === 'user'"
+              :placeholder="t('system.user.searchUser')"
+              class="w-[240px]"
+              @press-enter="handleEnter"
+              @search="handleSearch"
+            ></a-input-search>
             <a-radio-group v-if="couldShowUser" v-model="currentTable" class="ml-[14px]" type="button">
               <a-radio value="auth">{{ t('system.userGroup.auth') }}</a-radio>
               <a-radio value="user">{{ t('system.userGroup.user') }}</a-radio>
@@ -24,7 +26,7 @@
           </div>
         </div>
         <div class="mt-[16px]">
-          <user-table v-if="currentTable === 'user'" />
+          <user-table v-if="currentTable === 'user'" :keyword="currentKeyword" />
           <auth-table v-if="currentTable === 'auth'" />
         </div>
       </div>
@@ -45,11 +47,19 @@
   const collapse = ref(true);
 
   const { t } = useI18n();
+  const currentKeyword = ref('');
+
+  const handleSearch = (value: string) => {
+    currentKeyword.value = value;
+  };
+  const handleEnter = (eve: Event) => {
+    currentKeyword.value = (eve.target as HTMLInputElement).value;
+  };
 
   const store = useUserGroupStore();
   const couldShowUser = computed(() => store.userGroupInfo.currentType === 'SYSTEM');
   watch(
-    () => couldShowUser,
+    () => couldShowUser.value,
     (val) => {
       if (!val) {
         currentTable.value = 'auth';