fix

src/pages/weComTask/API/device/index.ts

@@ -1,15 +1,24 @@
 import request from "@/utils/request";
 const { api } = process.env.CONFIG;
 
+
+export interface GetAllOfUserListProps {
+    pageNum: number,
+    pageSize: number,
+    corpIdList?: string[],
+    corpUserName?: string,
+    stopUse?: boolean,
+    online?: boolean
+}
 /**
  * 设备 列表
  * @param data 
  * @returns 
  */
-export async function getAllOfUserListApi({ userId, ...params }: { userId: number, corpId?: string, corpUserName?: string }) {
+export async function getAllOfUserListApi(data: GetAllOfUserListProps) {
     return request({
-        url: api + `/corp/corpUser/allOfUserList/${userId}`,
-        method: 'GET',
-        params
+        url: api + `/corp/corpUser/corpUserDevicePage`,
+        method: 'POST',
+        data
     });
 }

src/pages/weComTask/page/device/index.tsx

@@ -1,29 +1,22 @@
 import React, { useEffect, useRef, useState } from "react";
 import style from '../corpUserManage/index.less'
-import { Button, Card, Input, Select, Table, Tabs } from "antd";
-import { MenuUnfoldOutlined, MenuFoldOutlined, SearchOutlined } from '@ant-design/icons';
-import TeamMembers from "@/components/Team/teamMembers";
+import { Button, Card, Input, Select, Table } from "antd";
+import { SearchOutlined } from '@ant-design/icons';
 import { getAdAccountAllOfMember, getCorpAllListApi } from "@/API/global";
 import { useAjax } from "@/Hook/useAjax";
-import { getAllOfUserListApi } from "../../API/device";
+import { getAllOfUserListApi, GetAllOfUserListProps } from "../../API/device";
 import { useSize } from "ahooks";
 import { WeTableConfig } from "./tableConfig";
-import useNewToken from "@/Hook/useNewToken";
 import SearchBox from "../../components/searchBox";
 
 
 const DevicePage: React.FC = () => {
 
     /**************************************/
-    const { token } = useNewToken();
     const ref = useRef<HTMLDivElement>(null)
     const size = useSize(ref)
-    const [activeKey, setActiveKey] = useState<string>('1')
-    const [showLeft, setShowLeft] = useState<boolean>(false)
-    const userIdStr = sessionStorage.getItem('userId')
-    const [userId, setUserId] = useState<number>(userIdStr ? Number(userIdStr) : undefined);
-    const [queryForm, setQueryForm] = useState<{ corpId?: string, corpUserName?: string }>({})
-    const [queryFormNew, setQueryFormNew] = useState<{ corpId?: string, corpUserName?: string }>({})
+    const [queryForm, setQueryForm] = useState<GetAllOfUserListProps>({ pageNum: 1, pageSize: 20, stopUse: false, online: false })
+    const [queryFormNew, setQueryFormNew] = useState<GetAllOfUserListProps>({ pageNum: 1, pageSize: 20, stopUse: false, online: false })
 
     const allOfMember = useAjax(() => getAdAccountAllOfMember())
     const getAllOfUserList = useAjax((params) => getAllOfUserListApi(params))
@@ -36,35 +29,12 @@ const DevicePage: React.FC = () => {
     }, [])
 
     useEffect(() => {
-        if (userId) {
-            getAllOfUserList.run({ userId, ...queryForm })
-        }
-    }, [userId, queryForm])
+        getAllOfUserList.run(queryForm)
+    }, [queryForm])
 
     return <div className={style.corpUserManage}>
-        <Tabs
-            tabBarStyle={{ marginBottom: 1 }}
-            activeKey={activeKey}
-            type="card"
-            onChange={(activeKey) => {
-                if (activeKey !== 'contract') {
-                    setUserId(userIdStr ? Number(userIdStr) : undefined)
-                    setActiveKey(activeKey)
-                } else {
-                    setShowLeft(!showLeft)
-                }
-            }}
-            items={[{ label: '我的', key: '1' }, { label: '组员', key: '2' }, { label: showLeft ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />, key: 'contract' }]}
-        />
 
-        <div className={style.corpUserManage_bottom}>
-            {!showLeft && activeKey === '2' && <TeamMembers
-                allOfMember={allOfMember}
-                onChange={(putUserId) => {
-                    setUserId(putUserId)
-                }}
-                value={userId}
-            />}
+        <div className={style.corpUserManage_bottom} style={{ height: '100%' }}>
 
             <Card className={style.corpUserList} styles={{ body: { padding: 0, display: 'flex', flexDirection: 'column', height: '100%', overflow: 'hidden' } }}>
                 <SearchBox
@@ -77,12 +47,13 @@ const DevicePage: React.FC = () => {
                 >
                     <>
                         <Select
-                            value={queryFormNew?.corpId}
-                            onChange={(e) => setQueryFormNew({ ...queryFormNew, corpId: e })}
+                            value={queryFormNew?.corpIdList}
+                            onChange={(e) => setQueryFormNew({ ...queryFormNew, corpIdList: e })}
                             showSearch
                             style={{ width: 150 }}
                             maxTagCount={1}
-                            placeholder="主体"
+                            mode='multiple'
+                            placeholder="选择企业"
                             filterOption={(input, option) =>
                                 ((option?.label ?? '') as string).toLowerCase().includes(input.toLowerCase())
                             }
@@ -90,18 +61,43 @@ const DevicePage: React.FC = () => {
                             options={getCorpAllList?.data?.data?.map((item: any) => ({ label: item.corpName, value: item.corpId }))}
                         />
                         <Input onChange={(e) => setQueryFormNew({ ...queryFormNew, corpUserName: e.target.value as any })} value={queryFormNew?.corpUserName} placeholder="企微号名称" allowClear />
+                        <Select
+                            value={queryFormNew?.stopUse}
+                            onChange={(e) => setQueryFormNew({ ...queryFormNew, stopUse: e })}
+                            showSearch
+                            style={{ width: 100 }}
+                            placeholder="是否停用？"
+                            allowClear
+                            options={[{ label: '是', value: true }, { label: '否', value: false }]}
+                        />
+                        <Select
+                            value={queryFormNew?.online}
+                            onChange={(e) => setQueryFormNew({ ...queryFormNew, online: e })}
+                            showSearch
+                            style={{ width: 100 }}
+                            placeholder="手机在线？"
+                            allowClear
+                            options={[{ label: '是', value: true }, { label: '否', value: false }]}
+                        />
                     </>
                 </SearchBox>
                 <div className={style.corpUserList_table} ref={ref}>
                     <Table
-                        dataSource={getAllOfUserList?.data?.data}
+                        dataSource={getAllOfUserList?.data?.data?.records}
                         columns={WeTableConfig()}
                         bordered
                         pagination={{
-                            defaultPageSize: 20
+                            current: getAllOfUserList?.data?.data?.current,
+                            pageSize: getAllOfUserList?.data?.data?.size,
+                            total: getAllOfUserList?.data?.data?.total,
+                            showSizeChanger: true,
+                            onChange: (page, pageSize) => {
+                                setQueryFormNew({ ...queryFormNew, pageNum: page, pageSize })
+                                setQueryForm({ ...queryForm, pageNum: page, pageSize })
+                            }
                         }}
                         rowClassName={(record) => record?.phoneInfo?.online && record?.phoneInfo?.accessibility != false ? '' : style.notOnline}
-                        rowKey={(row) => userId + '_' + row.corpUserId + '_' + row.corpId}
+                        rowKey={(row) => row.corpUserId + '_' + row.corpId}
                         loading={getAllOfUserList?.loading}
                         scroll={{ y: size?.height && ref.current ? size?.height - ref.current.querySelector('.ant-table-thead').clientHeight - 42 : 300 }}
                     />

src/pages/weComTask/page/device/tableConfig.tsx

@@ -13,7 +13,6 @@ export function WeTableConfig(): ColumnsType<any> {
             align: 'center',
             width: 100,
             ellipsis: true,
-            fixed: 'left',
             render: (a: string) => {
                 return <a onClick={() => copy(a)}>{a}</a>
             }
@@ -28,13 +27,13 @@ export function WeTableConfig(): ColumnsType<any> {
         },
         {
             title: '所属企业',
-            dataIndex: 'corp',
-            key: 'corp',
+            dataIndex: 'corpName',
+            key: 'corpName',
             align: 'center',
             width: 120,
             ellipsis: true,
             render(value) {
-                return value?.corpName || '--'
+                return value || '--'
             },
         },
         {
@@ -50,22 +49,22 @@ export function WeTableConfig(): ColumnsType<any> {
         },
         {
             title: '投手',
-            dataIndex: 'putUser',
-            key: 'putUser',
+            dataIndex: 'putUserName',
+            key: 'putUserName',
             align: 'center',
             width: 80,
-            render: (a: { nickName: string }) => {
-                return <span>{a?.nickName || '--'}</span>
+            render: (a) => {
+                return <span>{a || '--'}</span>
             }
         },
         {
             title: '运营',
-            dataIndex: 'operUser',
-            key: 'operUser',
+            dataIndex: 'operUserName',
+            key: 'operUserName',
             align: 'center',
             width: 80,
-            render: (a: { nickName: string }) => {
-                return <span>{a?.nickName || '--'}</span>
+            render: (a) => {
+                return <span>{a || '--'}</span>
             }
         },
         {
@@ -101,50 +100,61 @@ export function WeTableConfig(): ColumnsType<any> {
                 return a ? <a onClick={() => copy(a)}>{a}</a> : '--'
             }
         },
+        {
+            title: '地域备注',
+            dataIndex: 'note',
+            key: 'note',
+            align: 'center',
+            width: 120,
+            ellipsis: true,
+            render: (a: any) => {
+                return a || '--'
+            }
+        },
         {
             title: '手机编号',
-            dataIndex: 'phoneInfo',
-            key: 'phoneInfo',
+            dataIndex: 'phoneNumber',
+            key: 'phoneNumber',
             align: 'center',
             width: 80,
             render: (a: any) => {
-                return a?.phoneNumber || '--'
+                return a || '--'
             }
         },
         {
             title: '手机品牌',
-            dataIndex: 'phoneInfo',
-            key: 'phoneInfo',
+            dataIndex: 'model',
+            key: 'model',
             align: 'center',
             width: 80,
-            render: (b: any) => {
-                let model = b?.model
+            render: (b: any, record) => {
+                let model = b
                 try {
                     model = JSON.parse(model)
                 } catch (error) {
                     model = b?.model
                 }
-                return model ? <Tooltip title={typeof model === "string" ? <>设备型号：{model}</> : <Space direction="vertical"><span>设备型号：{model?.model}</span><span>系统版本：{model?.sdkVersion}</span><span>SDK版本：{model?.sdkInt}</span><span>系统：{model?.displayName}</span></Space>}><a>{b?.brand || '--'}</a></Tooltip> : <span>{b?.brand || "--"}</span>
+                return model ? <Tooltip title={typeof model === "string" ? <>设备型号：{model}</> : <Space direction="vertical"><span>设备型号：{model?.model}</span><span>系统版本：{model?.sdkVersion}</span><span>SDK版本：{model?.sdkInt}</span><span>系统：{model?.displayName}</span></Space>}><a>{record?.brand || '--'}</a></Tooltip> : <span>{record?.brand || "--"}</span>
             }
         },
         {
             title: '脚本版本',
-            dataIndex: 'phoneInfo',
-            key: 'phoneInfo',
+            dataIndex: 'sysVersion',
+            key: 'sysVersion',
             align: 'center',
             width: 80,
             render: (a: any) => {
-                return a?.sysVersion || '--'
+                return a || '--'
             }
         },
         {
             title: '手机持有者',
-            dataIndex: 'phoneInfo',
-            key: 'phoneInfo',
+            dataIndex: 'holder',
+            key: 'holder',
             align: 'center',
             width: 70,
             render: (a: any) => {
-                return a?.holder || '--'
+                return a || '--'
             }
         },
         {
@@ -153,31 +163,28 @@ export function WeTableConfig(): ColumnsType<any> {
             key: 'stopUse',
             align: 'center',
             width: 55,
-            fixed: 'right',
             render: (a, b) => {
                 return <Switch checked={a} disabled size="small" />
             }
         },
         {
             title: <Tooltip title="此状态代表设备是否能正常接收指令,不在线时无法正常使用,请确保设备有电，并且秘密基地APP正常运行！">手机在线?</Tooltip>,
-            dataIndex: 'phoneInfo',
-            key: 'phoneInfo',
+            dataIndex: 'online',
+            key: 'online',
             align: 'center',
             width: 55,
-            fixed: 'right',
             render: (a: any) => {
-                return a ? a?.online ? <Tag color="success">是</Tag> : <Tag color="error">否</Tag> : ''
+                return a != null ? a ? <Tag color="success">是</Tag> : <Tag color="error">否</Tag> : '--'
             }
         },
         {
             title: '电脑可用',
-            dataIndex: 'pcInfo',
-            key: 'pcInfo',
+            dataIndex: 'enabled',
+            key: 'enabled',
             align: 'center',
             width: 50,
-            fixed: 'right',
             render: (a: any) => {
-                return a ? a?.enabled ? <Badge status="success" text="是" /> : <Badge status="error" text="否" /> : '--'
+                return a != null ? a ? <Badge status="success" text="是" /> : <Badge status="error" text="否" /> : '--'
             }
         },
         {
@@ -186,47 +193,22 @@ export function WeTableConfig(): ColumnsType<any> {
             key: 'accessibility',
             align: 'center',
             width: 50,
-            fixed: 'right',
             render: (a: any, b: any) => {
-                return b?.phoneInfo?.accessibility != null ? b?.phoneInfo?.accessibility == true ? <Badge status="success" text="有效" /> : <Badge status="error" text="无效" /> : '--'
-            }
-        },
-        // {
-        //     title: <Tooltip title="为否时无法云控手机,此状态证明APP与云控服务器的连接状态是否正常">支持云控?</Tooltip>,
-        //     dataIndex: 'on_line',
-        //     key: 'on_line',
-        //     align: 'center',
-        //     width: 50,
-        //     fixed: 'right',
-        //     render: (a: any, b: any) => {
-        //         return (b?.phoneInfo?.sysVersion?.includes("mmjdSw") && b?.phoneInfo?.sysVersion >= "mmjdSw1.6") ? <Badge status="success" text="是" />
-        //             : <Badge status="error" text="否" />
-        //     }
-        // },
-        {
-            title: '应用状态',
-            dataIndex: 'configStatus',
-            key: 'configStatus',
-            align: 'center',
-            width: 60,
-            fixed: 'right',
-            render: (a, b) => {
-                return <Badge text={a ? '已配置' : '未配置'} status={a ? 'success' : 'default'} />
+                return a != null ? a == true ? <Badge status="success" text="有效" /> : <Badge status="error" text="无效" /> : '--'
             }
         },
         {
             title: '手机电量',
-            dataIndex: 'phone_cell',
-            key: 'phone_cell',
+            dataIndex: 'phoneCell',
+            key: 'phoneCell',
             align: 'center',
             width: 60,
-            fixed: 'right',
             render: (a, b) => {
-                let dl = a ? a : b?.phoneInfo?.phoneCell
-                return b?.phoneInfo?.assistUuid ? <div>
+                let dl = a
+                return b?.assistUuid ? <div>
                     <div>
                         <a style={dl >= 20 && dl <= 50 ? { color: '#e38b07' } : dl > 50 ? { color: '#4CAF50' } : { color: 'red' }}>{dl}</a>
-                        <a style={b?.phoneInfo?.phoneIsCharging ? { color: '#4CAF50' } : { color: 'red' }}>{b?.phoneInfo?.phoneIsCharging ? <ThunderboltOutlined /> : <ApiOutlined />}</a>
+                        <a style={b?.phoneIsCharging ? { color: '#4CAF50' } : { color: 'red' }}>{b?.phoneIsCharging ? <ThunderboltOutlined /> : <ApiOutlined />}</a>
                     </div>
                 </div> : <a style={dl >= 20 && dl <= 50 ? { color: '#e38b07' } : dl > 50 ? { color: '#4CAF50' } : { color: 'red' }}>{dl}</a>
             }
@@ -240,7 +222,6 @@ export function WeTableConfig(): ColumnsType<any> {
             dataIndex: 'closeReSend',
             key: 'closeReSend',
             align: 'center',
-            fixed: 'right',
             width: 60,
             render: (a, b) => {
                 return <Switch checkedChildren="开启" unCheckedChildren="关闭" checked={a} disabled size="small" />