#

luxiaotao1123

2024-02-27 03df7542cd456dc3e63a33cdd1f4cced5364f867

 zy-asrs-flow/src/pages/system/user/index.jsx

@@ -1,4 +1,3 @@

import React, { useState, useRef, useEffect } from 'react';
import { Button, message, Modal, Row, Col, Card, Tree, Input, Tag, Skeleton } from 'antd';
import {
@@ -6,14 +5,19 @@
    PageContainer,
    ProTable,
    LightFilter,
    TableDropdown
} from '@ant-design/pro-components';
import { PlusOutlined, ExportOutlined, DownOutlined, DeleteOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
import Http from '@/utils/http';
import Edit from './components/edit'
import Pwd from './components/pwd'
import AssignRole from './components/assignRole'
import { TextFilter, SelectFilter, DatetimeRangeFilter, LinkFilter } from '@/components/TableSearch'
import { transformTreeData, getTreeAllKeys } from '@/utils/tree-util'
import { statusMap } from '@/utils/enum-util'
import { repairBug } from '@/utils/common-util';

const TABLE_KEY = "pro-table-user";

const handleSave = async (val) => {
    const hide = message.loading('正在添加');
@@ -124,6 +128,8 @@

    const [pwdModalVisible, setPwdModalVisible] = useState(false);

    const [assignModalVisible, setAssignModalVisible] = useState(false);

    const loadDeptTreeData = (param) => {
        setDeptTreeLoading(true);
        Http.doPostPromise('/api/dept/tree', param, (res) => {
@@ -141,7 +147,7 @@
    }

    useEffect(() => {
        const handleResize = () => setBoxHeight(window.innerHeight - 368);
        const handleResize = () => setBoxHeight(window.innerHeight - 320);
        window.addEventListener('resize', handleResize);
        handleResize();

@@ -155,40 +161,64 @@
            title: 'No',
            dataIndex: 'index',
            valueType: 'indexBorder',
            width: 30,
            width: 48,
        },
        {
            title: '名称',
            dataIndex: 'nickname',
            title: '部门',
            dataIndex: 'deptId$',
            valueType: 'text',
            hidden: false,
            width: 100,
            filterDropdown: (props) => <TextFilter
                name='nickname'
                {...props}
                actionRef={actionRef}
                setSearchParam={setSearchParam}
            />,
            render: (_, record) => {
                if (_ && _ !== '-') {
                    return <Tag color={""}>{_}</Tag>
                } else {
                    return '-'
                }
            },
            // filterDropdown: (props) => <LinkFilter
            //     name='deptId'
            //     major='dept'
            //     {...props}
            //     actionRef={actionRef}
            //     setSearchParam={setSearchParam}
            // />,
        },
        {
            title: '登录账号',
            dataIndex: 'username',
            valueType: 'text',
            hidden: false,
            width: 100,
            copyable: true,
            filterDropdown: (props) => <TextFilter
                name='username'
                {...props}
                actionRef={actionRef}
                setSearchParam={setSearchParam}
            />,
            render: (_, record) => {
                return <span style={{ fontWeight: "bold" }}>{_}</span>
            }
        },
        {
            title: '名称',
            dataIndex: 'nickname',
            valueType: 'text',
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='nickname'
                {...props}
                actionRef={actionRef}
                setSearchParam={setSearchParam}
            />,
            render: (_, record) => {
                return <span style={{ fontWeight: "bold" }}>{_}</span>
            }
        },
        {
            title: '密码',
            dataIndex: 'password',
            valueType: 'password',
            hidden: true,
            width: 100,
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='password'
                {...props}
@@ -200,8 +230,7 @@
            title: '头像',
            dataIndex: 'avatar',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='avatar'
                {...props}
@@ -213,8 +242,7 @@
            title: '工号',
            dataIndex: 'code',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='code'
                {...props}
@@ -227,7 +255,6 @@
            dataIndex: 'sex$',
            valueType: 'text',
            hidden: false,
            width: 80,
            filterDropdown: (props) => <SelectFilter
                name='sex'
                {...props}
@@ -245,7 +272,6 @@
            dataIndex: 'phone',
            valueType: 'text',
            hidden: false,
            width: 100,
            filterDropdown: (props) => <TextFilter
                name='phone'
                {...props}
@@ -257,8 +283,7 @@
            title: '邮箱',
            dataIndex: 'email',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='email'
                {...props}
@@ -270,8 +295,7 @@
            title: '邮箱验证',
            dataIndex: 'emailVerified$',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <SelectFilter
                name='emailVerified'
                {...props}
@@ -283,33 +307,26 @@
                ]}
            />,
        },
        {
            title: '所属部门',
            dataIndex: 'deptId$',
            valueType: 'text',
            hidden: false,
            width: 100,
            render: (_, record) => {
                if (_ && _ !== '-') {
                    return <Tag color={""}>{_}</Tag>
                } else {
                    return '-'
                }
            },
            // filterDropdown: (props) => <LinkFilter
            //     name='deptId'
            //     major='dept'
            //     {...props}
            //     actionRef={actionRef}
            //     setSearchParam={setSearchParam}
            // />,
        },
        // {
        //     title: '角色',
        //     valueType: 'text',
        //     hidden: false,
        //     width: 100,
        //     render: (_, record) => {
        //         if (record.roleIds && record.roleIds.length > 0) {
        //             Http.doGetPromise('api/role/list/name/' + record.roleIds.join(','), null, (res) => {
        //                 return '-'
        //             });
        //         } else {
        //             return '-'
        //         }
        //     },
        // },
        {
            title: '真实姓名',
            dataIndex: 'realName',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='realName'
                {...props}
@@ -321,8 +338,7 @@
            title: '身份证号',
            dataIndex: 'idCard',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='idCard'
                {...props}
@@ -334,8 +350,7 @@
            title: '出生日期',
            dataIndex: 'birthday',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='birthday'
                {...props}
@@ -347,8 +362,7 @@
            title: '个人简介',
            dataIndex: 'introduction',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='introduction'
                {...props}
@@ -361,7 +375,6 @@
            dataIndex: 'status$',
            valueType: 'text',
            hidden: false,
            width: 80,
            render: (_, record) => {
                const status = statusMap[record.status]
                return <Tag color={status.color}>{status.text}</Tag>
@@ -381,8 +394,7 @@
            title: '添加时间',
            dataIndex: 'createTime$',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <DatetimeRangeFilter
                name='createTime'
                {...props}
@@ -394,8 +406,7 @@
            title: '修改时间',
            dataIndex: 'updateTime$',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <DatetimeRangeFilter
                name='updateTime'
                {...props}
@@ -407,8 +418,7 @@
            title: '修改人员',
            dataIndex: 'updateBy$',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <LinkFilter
                name='updateBy'
                major='user'
@@ -421,8 +431,7 @@
            title: '备注',
            dataIndex: 'memo',
            valueType: 'text',
            hidden: true,
            width: 140,
            hidden: false,
            filterDropdown: (props) => <TextFilter
                name='memo'
                {...props}
@@ -434,12 +443,13 @@
        {
            title: '操作',
            dataIndex: 'option',
            width: 150,
            valueType: 'option',
            width : 180,
            render: (_, record) => [
                <Button
                    type="link"
                    key="edit"
                    style={{ padding: '2px 3px' }}
                    onClick={() => {
                        setModalVisible(true);
                        setCurrentRow(record);
@@ -450,6 +460,7 @@
                <Button
                    type="link"
                    key="pwd"
                    style={{ padding: '2px 2px' }}
                    onClick={() => {
                        setPwdModalVisible(true);
                        setCurrentRow(record);
@@ -460,6 +471,7 @@
                <Button
                    type="link"
                    danger
                    style={{ padding: '4px' }}
                    key="remove"
                    onClick={async () => {
                        Modal.confirm({
@@ -478,6 +490,19 @@
                >
                    删除
                </Button>,
                <TableDropdown
                    key="actionGroup"
                    name="dropdown"
                    onSelect={(key) => {
                        if (key === 'assign') {
                            setAssignModalVisible(true);
                            setCurrentRow(record);
                        }
                    }}
                    menus={[
                        { key: 'assign', name: '分配角色' },
                    ]}
                />,
            ],
        },
    ];
@@ -490,10 +515,10 @@
        >
            <Row gutter={[16, 24]}>
                <Col lg={6} md={24}>
                    <Card title="部门" style={{ width: '100%', height: 'calc(100vh - 200px)' }}>
                    <Card title="部门" style={{ width: '100%', height: 'calc(100vh - 160px)' }}>
                        <Input
                            style={{ marginBottom: 10 }}
                            placeholder="Search"
                            placeholder="请输入"
                            onChange={(e) => {
                                const { value } = e.target;
                                loadDeptTreeData({
@@ -501,11 +526,11 @@
                                })
                            }}
                        />
                        <div style={{ height: 'calc(100vh - 350px)', overflowY: 'auto' }}>
                        <div style={{ height: 'calc(100vh - 325px)', overflowY: 'auto' }}>
                            {deptTreeLoading ? (
                                <Skeleton active />
                            ) : (
                                < Tree
                                <Tree
                                    showLine
                                    blockNode
                                    defaultExpandAll    // 异步加载失效
@@ -534,9 +559,10 @@
                        formRef={formTableRef}
                        columns={columns}
                        cardBordered
                        scroll={{ y: boxHeight }}
                        size='small'
                        // scroll={{ y: boxHeight }}
                        dateFormatter="string"
                        pagination={{ pageSize: 20 }}
                        pagination={{ pageSize: 12 }}
                        search={false}
                        toolbar={{
                            search: {
@@ -617,9 +643,23 @@
                            }
                        }}
                        columnsState={{
                            persistenceKey: 'pro-table-user',
                            persistenceKey: TABLE_KEY,
                            persistenceType: 'localStorage',
                            defaultValue: {
                                password: { show: repairBug(TABLE_KEY, 'password', false) },
                                avatar: { show: repairBug(TABLE_KEY, 'avatar', false) },
                                code: { show: repairBug(TABLE_KEY, 'code', false) },
                                phone: { show: repairBug(TABLE_KEY, 'phone', false) },
                                email: { show: repairBug(TABLE_KEY, 'email', false) },
                                emailVerified$: { show: repairBug(TABLE_KEY, 'emailVerified$', false) },
                                realName: { show: repairBug(TABLE_KEY, 'realName', false) },
                                idCard: { show: repairBug(TABLE_KEY, 'idCard', false) },
                                birthday: { show: repairBug(TABLE_KEY, 'birthday', false) },
                                introduction: { show: repairBug(TABLE_KEY, 'introduction', false) },
                                createTime$: { show: repairBug(TABLE_KEY, 'createTime$', false) },
                                updateTime$: { show: repairBug(TABLE_KEY, 'updateTime$', false) },
                                updateBy$: { show: repairBug(TABLE_KEY, 'updateBy$', false) },
                                memo: { show: repairBug(TABLE_KEY, 'memo', false) },
                                option: { fixed: 'right', disable: true },
                            },
                            onChange(value) {
@@ -627,60 +667,85 @@
                        }}
                    />
                </Col>

                <Edit
                    open={modalVisible}
                    values={currentRow || {}}
                    treeData={deptTreeData}
                    onCancel={
                        () => {
                            setModalVisible(false);
                            setCurrentRow(undefined);
                        }
                    }
                    onSubmit={async (values) => {
                        let ok = false;
                        if (values.id) {
                            ok = await handleUpdate({ ...values })
                        } else {
                            ok = await handleSave({ ...values })
                        }
                        if (ok) {
                            setModalVisible(false);
                            setCurrentRow(undefined);
                            if (actionRef.current) {
                                actionRef.current.reload();
                            }
                        }
                    }
                    }
                />

                <Pwd
                    open={pwdModalVisible}
                    values={currentRow || {}}
                    onCancel={
                        () => {
                            setPwdModalVisible(false);
                            setCurrentRow(undefined);
                        }
                    }
                    onSubmit={async (values) => {
                        let ok = false;
                        if (values.id) {
                            ok = await handlePwd({ ...values })
                        }
                        if (ok) {
                            setPwdModalVisible(false);
                            setCurrentRow(undefined);
                            if (actionRef.current) {
                                actionRef.current.reload();
                            }
                        }
                    }
                    }
                />
            </Row>

            <Edit
                open={modalVisible}
                values={currentRow || {}}
                treeData={deptTreeData}
                onCancel={
                    () => {
                        setModalVisible(false);
                        setCurrentRow(undefined);
                    }
                }
                onSubmit={async (values) => {
                    let ok = false;
                    if (values.id) {
                        ok = await handleUpdate({ ...values })
                    } else {
                        ok = await handleSave({ ...values })
                    }
                    if (ok) {
                        setModalVisible(false);
                        setCurrentRow(undefined);
                        if (actionRef.current) {
                            actionRef.current.reload();
                        }
                    }
                }
                }
            />

            <Pwd
                open={pwdModalVisible}
                values={currentRow || {}}
                onCancel={
                    () => {
                        setPwdModalVisible(false);
                        setCurrentRow(undefined);
                    }
                }
                onSubmit={async (values) => {
                    let ok = false;
                    if (values.id) {
                        ok = await handlePwd({ ...values })
                    }
                    if (ok) {
                        setPwdModalVisible(false);
                        setCurrentRow(undefined);
                        if (actionRef.current) {
                            actionRef.current.reload();
                        }
                    }
                }
                }
            />

            <AssignRole
                open={assignModalVisible}
                values={currentRow || {}}
                onCancel={
                    () => {
                        setAssignModalVisible(false);
                        setCurrentRow(undefined);
                    }
                }
                onSubmit={async (values) => {
                    let ok = false;
                    if (values.id) {
                        ok = await handleUpdate({ ...values })
                    }
                    if (ok) {
                        setAssignModalVisible(false);
                        setCurrentRow(undefined);
                        if (actionRef.current) {
                            actionRef.current.reload();
                        }
                    }
                }}
            />

        </PageContainer>
    );
};