优化：按商户分组展示员工账号

frontend/src/api/index.ts

@@ -18,6 +18,7 @@ import type {
   LowBalanceAlertConfig,
   Merchant,
   MerchantMember,
+	MerchantMemberGroup,
 	MerchantRole,
   MerchantProduct,
   PageResult,
@@ -179,7 +180,7 @@ export const deliveryApi = {
 
 export const platformApi = {
   members: (params?: Record<string, unknown>) =>
-    request.get('/platform/members', { params }).then((r) => r.data.data as PageResult<MerchantMember>),
+    request.get('/platform/members', { params }).then((r) => r.data.data as PageResult<MerchantMemberGroup>),
   merchants: (params?: Record<string, unknown>) =>
     request.get('/platform/merchants', { params }).then((r) => r.data.data as PageResult<Merchant>),
   createMerchant: (data: {

frontend/src/pages/PlatformUsers.tsx

@@ -4,7 +4,7 @@ import { DeleteOutlined, ReloadOutlined, SafetyCertificateOutlined } from '@ant-
 import type { ColumnsType } from 'antd/es/table'
 import { platformApi, userApi } from '../api'
 import { PageHeader } from '../components/PageHeader'
-import type { MerchantMember, PageResult, User } from '../types'
+import type { MerchantMember, MerchantMemberGroup, PageResult, User } from '../types'
 import { formatDateTime } from '../utils/time'
 import { useAuth } from '../store/auth'
 import { roleText } from './merchantCenterUtils'
@@ -15,7 +15,7 @@ export default function PlatformUsers() {
   const navigate = useNavigate()
   const [tab, setTab] = useState('admins')
   const [admins, setAdmins] = useState<PageResult<User>>({ list: [], total: 0, page: 1, size: 20 })
-  const [members, setMembers] = useState<PageResult<MerchantMember>>({ list: [], total: 0, page: 1, size: 20 })
+  const [members, setMembers] = useState<PageResult<MerchantMemberGroup>>({ list: [], total: 0, page: 1, size: 20 })
   const [loading, setLoading] = useState(false)
 
   const loadAdmins = useCallback(async (page = admins.page, size = admins.size) => {
@@ -82,10 +82,9 @@ export default function PlatformUsers() {
   ]
 
   const memberColumns: ColumnsType<MerchantMember> = [
-    { title: '商户', width: 240, render: (_, record) => <Space direction="vertical" size={0}><Typography.Text strong>{record.merchant?.name || `商户#${record.merchant_id}`}</Typography.Text><Typography.Text type="secondary" style={{ fontSize: 12 }}>{record.merchant?.code}</Typography.Text></Space> },
-    { title: '员工账号', dataIndex: ['user', 'username'], width: 200, render: (_, record) => record.user?.username || `#${record.user_id}` },
-    { title: '昵称', dataIndex: ['user', 'nickname'], width: 160, render: (_, record) => record.user?.nickname || '-' },
-    { title: '商户角色', dataIndex: 'role', width: 130, render: (role) => <Tag color="blue">{roleText(role)}</Tag> },
+    { title: '员工账号', dataIndex: ['user', 'username'], width: 220, render: (_, record) => <Typography.Text strong>{record.user?.username || `#${record.user_id}`}</Typography.Text> },
+    { title: '昵称', dataIndex: ['user', 'nickname'], width: 180, render: (_, record) => record.user?.nickname || '-' },
+    { title: '商户角色', dataIndex: 'role', width: 140, render: (role) => <Tag color="blue">{roleText(role)}</Tag> },
     { title: '成员状态', dataIndex: 'status', width: 110, render: (status) => status === 1 ? <Tag color="green">启用</Tag> : <Tag>停用</Tag> },
     {
       title: '操作',
@@ -97,15 +96,47 @@ export default function PlatformUsers() {
               <Button type="link" size="small" icon={<SafetyCertificateOutlined />}>设为平台管理员</Button>
             </Popconfirm>
           )}
-          <Button type="link" size="small" onClick={() => {
-            localStorage.setItem('merchant_id', String(record.merchant_id))
-            navigate('/merchant-members')
-          }}>管理商户成员</Button>
         </Space>
       ),
     },
   ]
 
+  const merchantColumns: ColumnsType<MerchantMemberGroup> = [
+    {
+      title: '商户',
+      width: 310,
+      render: (_, record) => <Space direction="vertical" size={0}><Typography.Text strong>{record.merchant?.name || `商户#${record.merchant_id}`}</Typography.Text><Typography.Text type="secondary" style={{ fontSize: 12 }}>{record.merchant?.code || '-'}</Typography.Text></Space>,
+    },
+    {
+      title: '员工',
+      width: 120,
+      render: (_, record) => <Typography.Text>{record.members.length} 人</Typography.Text>,
+    },
+    {
+      title: '角色分布',
+      render: (_, record) => {
+        const roles = [...new Set(record.members.map((member) => member.role))]
+        return <Space size={[4, 4]} wrap>{roles.map((role) => <Tag color="blue" key={role}>{roleText(role)}</Tag>)}</Space>
+      },
+    },
+    {
+      title: '状态',
+      width: 150,
+      render: (_, record) => {
+        const enabled = record.members.filter((member) => member.status === 1).length
+        return <><Tag color="green">启用 {enabled}</Tag>{enabled < record.members.length && <Tag>停用 {record.members.length - enabled}</Tag>}</>
+      },
+    },
+    {
+      title: '操作',
+      width: 150,
+      render: (_, record) => <Button type="link" size="small" onClick={() => {
+        localStorage.setItem('merchant_id', String(record.merchant_id))
+        navigate('/merchant-members')
+      }}>管理该商户员工</Button>,
+    },
+  ]
+
   const items = useMemo(() => [
     {
       key: 'admins',
@@ -115,7 +146,17 @@ export default function PlatformUsers() {
     {
       key: 'members',
       label: `商户员工 (${members.total})`,
-      children: <Table rowKey="id" loading={loading} columns={memberColumns} dataSource={members.list} pagination={{ current: members.page, pageSize: members.size, total: members.total, showSizeChanger: true, onChange: (page, size) => loadMembers(page, size) }} />,
+      children: <Table
+        rowKey="merchant_id"
+        loading={loading}
+        columns={merchantColumns}
+        dataSource={members.list}
+        expandable={{
+          expandedRowRender: (record) => <Table rowKey="id" size="small" columns={memberColumns} dataSource={record.members} pagination={false} />,
+          rowExpandable: (record) => record.members.length > 0,
+        }}
+        pagination={{ current: members.page, pageSize: members.size, total: members.total, showSizeChanger: true, onChange: (page, size) => loadMembers(page, size) }}
+      />,
     },
   ], [adminColumns, admins, loadAdmins, loadMembers, loading, memberColumns, members])
 

frontend/src/types/index.ts

@@ -33,6 +33,12 @@ export interface MerchantMember {
   created_at: string
 }
 
+export interface MerchantMemberGroup {
+  merchant_id: number
+  merchant?: Merchant
+  members: MerchantMember[]
+}
+
 export interface MerchantRole {
   id: number
   merchant_id: number