From b4cb1aa0ebd29969f13961d48d8fabd241cad5c3 Mon Sep 17 00:00:00 2001
From: pdsuwwz <pdsu.wwz@foxmail.com>
Date: Tue, 27 Jun 2023 15:05:50 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=AA=84=20=20feat:=20update=20member=20tea?=
 =?UTF-8?q?m=20index=20columns?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/modules/MemberTeam/pages/index.vue   | 56 ++++++++++++++++++++----
 src/modules/MemberTeam/pages/preview.vue |  7 +++
 2 files changed, 54 insertions(+), 9 deletions(-)

diff --git a/src/modules/MemberTeam/pages/index.vue b/src/modules/MemberTeam/pages/index.vue
index 38818c3..2d96e1c 100755
--- a/src/modules/MemberTeam/pages/index.vue
+++ b/src/modules/MemberTeam/pages/index.vue
@@ -12,6 +12,7 @@
         flex-height
         striped
         class="h-full"
+        :scroll-x="1800"
       />
     </n-card>
   </LayoutPage>
@@ -20,7 +21,11 @@
 <script lang="ts" setup>
 import { NTag, NSpace, NButton, NPopconfirm } from 'naive-ui'
 
-import { memberTeamList, findUserRankMapByRankName } from '@/modules/MemberTeam/data'
+import {
+  memberTeamList,
+  findUserRankMapByRankName,
+  findUserRoleMapByRankName
+} from '@/modules/MemberTeam/data'
 import type { TypeMemberPerson } from '@/modules/MemberTeam/data'
 
 /**
@@ -51,15 +56,41 @@ const pagination = reactive({
 const columns: DataTableColumns<TypeMemberPerson> = [
   {
     title: '姓名',
-    key: 'username'
+    key: 'username',
+    width: 80,
+    fixed: 'left'
+  },
+  {
+    title: '工号',
+    key: 'userId',
+    align: 'center',
+    width: 60
   },
   {
     title: '角色',
-    key: 'roleId'
+    key: 'roleId',
+    align: 'center',
+    width: 100,
+    render(row) {
+      const roleItem = findUserRoleMapByRankName(row.roleId)
+      return h(
+        NTag,
+        {
+          bordered: false
+        },
+        {
+          default: () => {
+            return roleItem.label
+          }
+        }
+      )
+    }
   },
   {
     title: '职级',
     key: 'rank',
+    align: 'center',
+    width: 100,
     render(row) {
       const rankItem = findUserRankMapByRankName(row.rank)
       return h(
@@ -76,23 +107,30 @@ const columns: DataTableColumns<TypeMemberPerson> = [
     }
   },
   {
-    title: '工号',
-    key: 'userId'
+    title: '邮箱',
+    key: 'email',
+    align: 'center',
+    width: 150
   },
   {
-    title: '邮箱',
-    key: 'email'
+    title: '手机号',
+    key: 'phone',
+    align: 'center',
+    width: 80
   },
   {
     title: '操作列',
     key: 'actions',
-    width: '210px',
     align: 'center',
+    width: 80,
+    fixed: 'right',
     render (row) {
       return [
         h(
           NSpace,
-          null,
+          {
+            justify: 'center'
+          },
           {
             default: () => [
               h(
diff --git a/src/modules/MemberTeam/pages/preview.vue b/src/modules/MemberTeam/pages/preview.vue
index 059860d..3e3e1af 100644
--- a/src/modules/MemberTeam/pages/preview.vue
+++ b/src/modules/MemberTeam/pages/preview.vue
@@ -11,6 +11,7 @@
           :model="memberFormModel"
           label-placement="top"
           label-width="auto"
+          disabled
         >
           <n-form-item
             v-for="(infoItem, index) in memberInfoMap"
@@ -33,12 +34,14 @@
             <n-button
               type="primary"
               :loading="loadingSubmit"
+              disabled
               @click="handleSubmit()"
             >
               更新
             </n-button>
           </n-form-item>
         </n-form>
+
         <pre>{{ JSON.stringify(memberFormModel, null, 2) }}</pre>
       </n-spin>
     </n-card>
@@ -89,6 +92,10 @@ const memberInfoMap = [
     path: 'username',
     label: '姓名'
   },
+  {
+    path: 'userId',
+    label: '工号'
+  },
   {
     path: 'roleId',
     label: '角色',