|
@@ -13,21 +13,36 @@ import { EllipsisOutlined } from '@ant-design/icons';
|
|
|
import {
|
|
|
queryUserList,
|
|
|
queryCompanyOAById,
|
|
|
- getControlSpaceCompany,
|
|
|
+ queryControlSpaceCompany,
|
|
|
+ deleteUser,
|
|
|
} from '@/services/sagacare_service/member';
|
|
|
|
|
|
const Member: React.FC = () => {
|
|
|
- const [perVisible, setPerVisible] = useState(false);
|
|
|
- const [isSyncOa, setIsSyncOa] = useState(false);
|
|
|
+ const [perVisible, setPerVisible] = useState(false); //人员对话框显示
|
|
|
+ const [temporary, setTemporary] = useState(false); //是否是临时成员添加
|
|
|
+ const [invalidSign, setInvalidSign] = useState(false); //显示作废
|
|
|
+ const [spaceMap, setSpaceMap] = useState<any>();
|
|
|
+
|
|
|
+ const [searchStr, setSearchStr] = useState();
|
|
|
+ const [isSyncOa, setIsSyncOa] = useState(true); //是否是OA同步
|
|
|
const [userList, setUserList] = useState<any>([]);
|
|
|
- const [total, setTotal] = useState(10);
|
|
|
+ const [total, setTotal] = useState();
|
|
|
const [loading, setLoading] = useState(false);
|
|
|
const [page, setPage] = useState({
|
|
|
pageNum: 1,
|
|
|
pageSize: 10,
|
|
|
});
|
|
|
- const [checkUser, setCheckUser] = useState({});
|
|
|
- const [checkSign, setCheckSign] = useState('add');
|
|
|
+ const [checkUser, setCheckUser] = useState({}); //查看的人
|
|
|
+ const [checkSign, setCheckSign] = useState('add'); // 三种状态 查看 编辑 新增
|
|
|
+ const [refreshNum, setRefreshNum] = useState(0); //刷新列表
|
|
|
+ const statusArr = {
|
|
|
+ 2: '正常',
|
|
|
+ 3: '待激活',
|
|
|
+ 5: '已作废',
|
|
|
+ };
|
|
|
+ const [sorter, setSorter] = useState<any>({
|
|
|
+ updateDate: 'DESC', //'ASC' : 'DESC'
|
|
|
+ });
|
|
|
|
|
|
const getColumns = () => {
|
|
|
return [
|
|
@@ -69,16 +84,22 @@ const Member: React.FC = () => {
|
|
|
title: '更新时间',
|
|
|
dataIndex: 'updateDate',
|
|
|
sorter: true,
|
|
|
- sortered: 'DESC',
|
|
|
+ sortered: sorter.updateDate,
|
|
|
},
|
|
|
{
|
|
|
title: '状态',
|
|
|
dataIndex: 'status',
|
|
|
render: function (content, item, index) {
|
|
|
+ //debugger;
|
|
|
return (
|
|
|
<div>
|
|
|
- <span className={styles.circle}></span>
|
|
|
- <span>{content}</span>
|
|
|
+ <span
|
|
|
+ className={cx(styles.circle, {
|
|
|
+ [styles.activated]: content == '3',
|
|
|
+ [styles.invalid]: content == '5',
|
|
|
+ })}
|
|
|
+ ></span>
|
|
|
+ <span>{statusArr[content]}</span>
|
|
|
</div>
|
|
|
);
|
|
|
},
|
|
@@ -130,7 +151,7 @@ const Member: React.FC = () => {
|
|
|
];
|
|
|
return (
|
|
|
<Dropdown menu={{ items: menuItems }}>
|
|
|
- <EllipsisOutlined />
|
|
|
+ <EllipsisOutlined style={{ color: '#4D5262', fontSize: '20px' }} />
|
|
|
</Dropdown>
|
|
|
);
|
|
|
},
|
|
@@ -140,91 +161,186 @@ const Member: React.FC = () => {
|
|
|
const goToInvalid = () => {
|
|
|
history.push(`/member/invalid`);
|
|
|
};
|
|
|
- const onClose = () => {
|
|
|
+ const refreshList = () => {
|
|
|
+ setRefreshNum(refreshNum + 1);
|
|
|
+ };
|
|
|
+ const onClose = (param) => {
|
|
|
setPerVisible(false);
|
|
|
};
|
|
|
+
|
|
|
useEffect(() => {
|
|
|
var paramObj = {
|
|
|
criteria: {
|
|
|
- // param: 'string',
|
|
|
- // status: 0,
|
|
|
- companyId: '',
|
|
|
+ param: searchStr,
|
|
|
+ status: 1,
|
|
|
+ companyId: '30bd3cf2b9ed4742b607fd5ea2c00d96',
|
|
|
},
|
|
|
- page: 0,
|
|
|
- size: 10,
|
|
|
+ page: page.pageNum,
|
|
|
+ size: page.pageSize,
|
|
|
orders: [
|
|
|
{
|
|
|
- column: '',
|
|
|
- asc: true,
|
|
|
+ column: 'updateDate',
|
|
|
+ asc: sorter.updateDate == 'DESC' ? true : false,
|
|
|
},
|
|
|
],
|
|
|
};
|
|
|
- setUserList([
|
|
|
- {
|
|
|
- userId: '222',
|
|
|
- companyId: '222',
|
|
|
- companyName: '博锐',
|
|
|
- name: '赵女士',
|
|
|
- phone: '13822222222',
|
|
|
- manageUserType: 1,
|
|
|
- manageUserTypeName: '普通员工',
|
|
|
- job: '部门总监',
|
|
|
- isAllControl: true,
|
|
|
- updateDate: '2022/08/11',
|
|
|
- status: '待激活',
|
|
|
- permanentSpaceName: '上格云',
|
|
|
- oaId: 'sdfsdf',
|
|
|
- },
|
|
|
- {
|
|
|
- userId: '222',
|
|
|
- companyId: '222',
|
|
|
- companyName: '博锐',
|
|
|
- name: '赵男士',
|
|
|
- phone: '1382266622',
|
|
|
- manageUserType: 2,
|
|
|
- manageUserTypeName: '普通员工',
|
|
|
- job: '部门总监',
|
|
|
- isAllControl: false,
|
|
|
- updateDate: '2022/08/11',
|
|
|
- status: '待激活',
|
|
|
- permanentSpaceName: '上格云',
|
|
|
- },
|
|
|
- ]);
|
|
|
- // setIsSyncOa(true);
|
|
|
+ setLoading(true);
|
|
|
+
|
|
|
queryUserList(paramObj)
|
|
|
- .then((res) => {})
|
|
|
- .catch((err) => {});
|
|
|
- queryCompanyOAById({ companyId: 'xxxx' })
|
|
|
- .then((res) => {})
|
|
|
- .catch((err) => {});
|
|
|
+ .then((res) => {
|
|
|
+ debugger;
|
|
|
+ setLoading(false);
|
|
|
+ var uarr = res.content || [];
|
|
|
+ var count = res.count || 0;
|
|
|
+ setUserList(uarr);
|
|
|
+ setTotal(count);
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ setLoading(false);
|
|
|
+ });
|
|
|
+ }, [searchStr, page, sorter, refreshNum]);
|
|
|
+ useEffect(() => {
|
|
|
+ // const spaceMap3 = {
|
|
|
+ // '北京中海金融街|2层': [
|
|
|
+ // {
|
|
|
+ // id: '22',
|
|
|
+ // companyId: '30bd3cf2b9ed4742b607fd5ea2c00d96',
|
|
|
+ // spaceId: 'Sp110102000292ab218dd67011e88bee87db7e0ad2b711',
|
|
|
+ // spaceName: 'D-303',
|
|
|
+ // floorId: 'Fl1101020002bf10b9cad5c811e88bee1113190f5c6a11',
|
|
|
+ // floorName: '2层',
|
|
|
+ // buildingId: 'Bd110102000223fbec0accfb11e8a471b5d1be3b6dfe',
|
|
|
+ // buildingName: '北京中海金融街',
|
|
|
+ // isPermanentSpace: true,
|
|
|
+ // createTime: 1692761562000,
|
|
|
+ // updateTime: 1692760902000,
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // id: '33',
|
|
|
+ // companyId: '30bd3cf2b9ed4742b607fd5ea2c00d96',
|
|
|
+ // spaceId: 'Sp110102000292ab218dd67011e88bee87db7e0ad2b722',
|
|
|
+ // spaceName: 'D-304',
|
|
|
+ // floorId: 'Fl1101020002bf10b9cad5c811e88bee1113190f5c6a22',
|
|
|
+ // floorName: '2层',
|
|
|
+ // buildingId: 'Bd110102000223fbec0accfb11e8a471b5d1be3b6dfe',
|
|
|
+ // buildingName: '北京中海金融街',
|
|
|
+ // isPermanentSpace: true,
|
|
|
+ // createTime: 1692761562000,
|
|
|
+ // updateTime: 1692760902000,
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // id: '55',
|
|
|
+ // companyId: '30bd3cf2b9ed4742b607fd5ea2c00d96',
|
|
|
+ // spaceId: 'Sp110102000292ab218dd67011e88bee87db7e0ad2b733',
|
|
|
+ // spaceName: 'D-306',
|
|
|
+ // floorId: 'Fl1101020002bf10b9cad5c811e88bee1113190f5c6a',
|
|
|
+ // floorName: '2层',
|
|
|
+ // buildingId: 'Bd110102000223fbec0accfb11e8a471b5d1be3b6dfe',
|
|
|
+ // buildingName: '北京中海金融街',
|
|
|
+ // isPermanentSpace: true,
|
|
|
+ // createTime: 1692761562000,
|
|
|
+ // updateTime: 1692760902000,
|
|
|
+ // },
|
|
|
+ // ],
|
|
|
+ // '北京中海金融街|3层': [
|
|
|
+ // {
|
|
|
+ // id: '22',
|
|
|
+ // companyId: '30bd3cf2b9ed4742b607fd5ea2c00d96',
|
|
|
+ // spaceId: 'Sp110102000292ab218dd67011e88bee87db7e0ad2b744',
|
|
|
+ // spaceName: 'C-303',
|
|
|
+ // floorId: 'Fl1101020002bf10b9cad5c811e88bee1113190f5c6a',
|
|
|
+ // floorName: '3层',
|
|
|
+ // buildingId: 'Bd110102000223fbec0accfb11e8a471b5d1be3b6dfe',
|
|
|
+ // buildingName: '北京中海金融街',
|
|
|
+ // isPermanentSpace: true,
|
|
|
+ // createTime: 1692761562000,
|
|
|
+ // updateTime: 1692760902000,
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // id: '33',
|
|
|
+ // companyId: '30bd3cf2b9ed4742b607fd5ea2c00d96',
|
|
|
+ // spaceId: 'Sp110102000292ab218dd67011e88bee87db7e0ad2b755',
|
|
|
+ // spaceName: 'C-304',
|
|
|
+ // floorId: 'Fl1101020002bf10b9cad5c811e88bee1113190f5c6a',
|
|
|
+ // floorName: '3层',
|
|
|
+ // buildingId: 'Bd110102000223fbec0accfb11e8a471b5d1be3b6dfe',
|
|
|
+ // buildingName: '北京中海金融街',
|
|
|
+ // isPermanentSpace: true,
|
|
|
+ // createTime: 1692761562000,
|
|
|
+ // updateTime: 1692760902000,
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // id: '55',
|
|
|
+ // companyId: '30bd3cf2b9ed4742b607fd5ea2c00d96',
|
|
|
+ // spaceId: 'Sp110102000292ab218dd67011e88bee87db7e0ad2b766',
|
|
|
+ // spaceName: 'C-306',
|
|
|
+ // floorId: 'Fl1101020002bf10b9cad5c811e88bee1113190f5c6a',
|
|
|
+ // floorName: '3层',
|
|
|
+ // buildingId: 'Bd110102000223fbec0accfb11e8a471b5d1be3b6dfe',
|
|
|
+ // buildingName: '北京中海金融街',
|
|
|
+ // isPermanentSpace: true,
|
|
|
+ // createTime: 1692761562000,
|
|
|
+ // updateTime: 1692760902000,
|
|
|
+ // },
|
|
|
+ // ],
|
|
|
+ // };
|
|
|
+
|
|
|
//查询受控列表
|
|
|
- getControlSpaceCompany()
|
|
|
- .then((res) => {})
|
|
|
+ var paramObj = {
|
|
|
+ criteria: {
|
|
|
+ //spaceName: '',
|
|
|
+ companyId: '30bd3cf2b9ed4742b607fd5ea2c00d96',
|
|
|
+ },
|
|
|
+ };
|
|
|
+ queryControlSpaceCompany(paramObj)
|
|
|
+ .then((res) => {
|
|
|
+ var data = res.data || {};
|
|
|
+ setSpaceMap(data);
|
|
|
+ })
|
|
|
+ .catch((err) => {});
|
|
|
+ queryCompanyOAById({ companyId: '30bd3cf2b9ed4742b607fd5ea2c00d96' })
|
|
|
+ .then((res) => {
|
|
|
+ var isSyncOa = res?.isSyncOa;
|
|
|
+ setIsSyncOa(isSyncOa == 1 ? true : false);
|
|
|
+ })
|
|
|
.catch((err) => {});
|
|
|
}, []);
|
|
|
+
|
|
|
const checkPerson = (item) => {
|
|
|
setPerVisible(true);
|
|
|
+ setInvalidSign(false);
|
|
|
setCheckSign('check'); //设置为查看状态
|
|
|
- debugger;
|
|
|
setCheckUser(item);
|
|
|
+ setTemporary(false);
|
|
|
};
|
|
|
const editPerson = (item) => {
|
|
|
setPerVisible(true);
|
|
|
+ setInvalidSign(false);
|
|
|
setCheckSign('edit');
|
|
|
setCheckUser(item);
|
|
|
+ setTemporary(false);
|
|
|
};
|
|
|
//作废用户
|
|
|
- const invalidPerson = (item) => {};
|
|
|
+ const invalidPerson = (item) => {
|
|
|
+ setInvalidSign(true);
|
|
|
+ setPerVisible(true);
|
|
|
+ setCheckUser(item);
|
|
|
+ setTemporary(false);
|
|
|
+ };
|
|
|
//添加临时用户
|
|
|
const addTemporaryPerson = () => {
|
|
|
setPerVisible(true);
|
|
|
+ setInvalidSign(false);
|
|
|
setCheckSign('add');
|
|
|
setCheckUser({});
|
|
|
+ setTemporary(true);
|
|
|
};
|
|
|
const addNewPerson = () => {
|
|
|
setPerVisible(true);
|
|
|
+ setInvalidSign(false);
|
|
|
setCheckSign('add');
|
|
|
setCheckUser({});
|
|
|
+ setTemporary(false);
|
|
|
};
|
|
|
|
|
|
return (
|
|
@@ -233,7 +349,7 @@ const Member: React.FC = () => {
|
|
|
title={<FormattedMessage id="menu.member" />}
|
|
|
action={
|
|
|
<div className={styles.headerRight}>
|
|
|
- <Search />
|
|
|
+ <Search setSearchStr={setSearchStr} />
|
|
|
{isSyncOa ? (
|
|
|
<>
|
|
|
<div className={styles.allIn}>已开启OA同步</div>
|
|
@@ -271,7 +387,7 @@ const Member: React.FC = () => {
|
|
|
<div className={styles.bottomTable}>
|
|
|
<Table
|
|
|
columns={getColumns()}
|
|
|
- rowKey="phone"
|
|
|
+ rowKey="userId"
|
|
|
dataSource={userList}
|
|
|
loading={loading}
|
|
|
page={page}
|
|
@@ -284,12 +400,10 @@ const Member: React.FC = () => {
|
|
|
// }
|
|
|
}}
|
|
|
onRowClick={(record) => {}}
|
|
|
- onSortChange={(col, direction) => {
|
|
|
- debugger;
|
|
|
- // setSorter({ [col['sortIndex']]: direction });
|
|
|
+ onSortChange={(col: any, direction: string) => {
|
|
|
+ setSorter({ [col['dataIndex']]: direction });
|
|
|
}}
|
|
|
onPageChange={(p) => {
|
|
|
- debugger;
|
|
|
setPage(p);
|
|
|
}}
|
|
|
/>
|
|
@@ -297,10 +411,16 @@ const Member: React.FC = () => {
|
|
|
</div>
|
|
|
{perVisible && (
|
|
|
<PersonModal
|
|
|
+ invalidSign={invalidSign}
|
|
|
+ temporary={temporary}
|
|
|
checkUser={checkUser}
|
|
|
checkSign={checkSign}
|
|
|
onClose={onClose}
|
|
|
setCheckSign={setCheckSign}
|
|
|
+ statusArr={statusArr}
|
|
|
+ setInvalidSign={setInvalidSign}
|
|
|
+ spaceMap={spaceMap}
|
|
|
+ refreshList={refreshList}
|
|
|
></PersonModal>
|
|
|
)}
|
|
|
</div>
|