feat: update member team open tabs

.eslintrc-auto-import.json

@@ -315,6 +315,7 @@
     "GlobalThemeOverrides": true,
     "DropdownOption": true,
     "ConfigProviderProps": true,
-    "MenuOption": true
+    "MenuOption": true,
+    "DataTableRowKey": true
   }
 }

auto-imports.d.ts

@@ -304,7 +304,7 @@ declare global {
   // @ts-ignore
   export type { RouteRecordRaw, RouteLocationRaw, LocationQuery, NavigationFailure, RouteParams, RouteLocationNormalizedLoaded, RouteRecordName, NavigationGuard } from 'vue-router'
   // @ts-ignore
-  export type { GlobalThemeOverrides, ConfigProviderProps, DataTableColumns, DropdownOption, MenuOption, FormInst } from 'naive-ui'
+  export type { GlobalThemeOverrides, ConfigProviderProps, DataTableColumns, DataTableRowKey, DropdownOption, MenuOption, FormInst } from 'naive-ui'
 }
 // for vue template auto import
 import { UnwrapRef } from 'vue'

src/modules/MemberTeam/pages/index.vue

@@ -8,21 +8,24 @@
       <template #header-extra>
         <n-button
           type="primary"
+          @click="handleOpenTabs()"
         >
           打开
         </n-button>
       </template>
       <n-data-table
+        v-model:checked-row-keys="checkedRowKeysRef"
+        class="h-full"
         :columns="columns"
         :data="tableData"
         :pagination="pagination"
-        flex-height
-        striped
-        :row-key="(row: TypeMemberPerson) => row.userId"
-        class="h-full"
         :scroll-x="1100"
         :bordered="false"
         :single-line="false"
+        flex-height
+        striped
+        :row-key="getRowKey"
+        @update:checked-row-keys="handleUpdateCheckedRows"
       />
     </n-card>
   </LayoutPage>
@@ -46,6 +49,7 @@ import {
   PersonDelete16Regular as IconPersonDelete16Regular
 } from '@vicons/fluent'
 import { sleep } from '@/utils/request'
+import type { MultipleLinkItem } from '@/widgets/WorkTabs/types'
 
 /**
  * MemberTeamIndex 成员管理-团队成员列表
@@ -54,9 +58,55 @@ defineOptions({
   name: 'MemberTeamIndex'
 })
 
+const route = useRoute()
 const router = useTabRouter()
 
 
+
+/**
+ * 构造行唯一 ID
+ */
+const getRowKey = (row: TypeMemberPerson) => row.userId
+
+/**
+ * 选中行
+ */
+const checkedRowKeysRef = ref<Array<DataTableRowKey>>([])
+const checkedRowsRef = ref<Array<TypeMemberPerson>>([])
+
+const handleUpdateCheckedRows = (keys, rows: Array<object>) => {
+  checkedRowsRef.value = rows as Array<TypeMemberPerson>
+}
+
+
+/**
+ * 打开多个 Tabs
+ */
+const handleOpenTabs = () => {
+
+  const multipleLinks = checkedRowsRef.value.map((rowData) => {
+    return {
+      to: {
+        name: 'MemberTeamPreview',
+        params: {
+          datasetId: rowData.userId
+        }
+      },
+      tabName: `成员查看-${rowData.username}`
+    } as MultipleLinkItem
+  })
+
+  const projectId = route.params.projectId as string
+  router.pushMultiple(projectId, multipleLinks)
+
+  nextTick(() => {
+    checkedRowKeysRef.value = []
+  })
+
+}
+
+
+
 const pagination = reactive({
   page: 1,
   pageSize: 30,
@@ -71,6 +121,7 @@ const pagination = reactive({
   }
 })
 
+
 const renderIcon = (icon: Component, className = '') => {
   return () => {
     return h(NIcon, { class: className }, {

vite.config.ts

@@ -97,6 +97,7 @@ export default defineConfig(({ mode }) => {
               'GlobalThemeOverrides',
               'ConfigProviderProps',
               'DataTableColumns',
+              'DataTableRowKey',
               'DropdownOption',
               'MenuOption',
               'FormInst'