hejianhao
2025-02-27 b79e8a63a1ab322dc948b74eb2cf9e91676a3792
management/src/pages/setting/user/index.jsx
@@ -1,82 +1,225 @@
import { sendRequest, showDelConfirm } from '@/utils/antdUtils';
import { buildProTableDataSource, sendRequest, showDelConfirm } from '@/utils/antdUtils';
import { DeleteOutlined, EditOutlined, PlusOutlined } from '@ant-design/icons';
import { PageContainer, ProFormText, ProTable, QueryFilter } from '@ant-design/pro-components';
import { Button, Col, Menu, Row, Space } from 'antd';
import { Button, Cascader, Col, Menu, Row, Space } from 'antd';
import { useEffect, useRef, useState } from 'react';
import { Access, useAccess } from 'umi';
import AddAndEdit from './components/addAndEdit';
import { add, del, edit, getUnitList } from './service';
import AddUnit from './components/addUnit';
import { add, addUnit, del, delUnit, edit, editUnit, getList, getUnitList ,editSystemUserInfo,addSystemUserInfo} from './service';
const Role = () => {
  const actionRef = useRef();
  const addViewRef = useRef();
  const addViewRef1 = useRef();
  const [modalVisible, handleModalVisibles] = useState(false);
  const [modalVisible1, handleModalVisibles1] = useState(false);
  const [unitId, setUnitId] = useState('');
  const access = useAccess();
  const [items, setItems] = useState([
    {
      key: '1',
      icon: (
        <div
          style={{
            display: 'flex',
            alignItems: 'center',
            justifyContent: 'space-between',
            width: '100%',
          }}
        >
          <span>组织部</span>
          <div>
  const [items, setItems] = useState([]);
  const { SubMenu } = Menu;
  useEffect(() => {
    fetchUnit();
  }, []);
  const node = (item) => {
    return (
      <div
        style={{
          display: 'flex',
          alignItems: 'center',
          justifyContent: 'space-between',
          width: '100%',
        }}
      >
        <span>{item.name}</span>
        <div>
          {item.tier < 4 && (
            <PlusOutlined
              onClick={(e) => {
                e.stopPropagation();
                console.log(e);
                addViewRef1.current.refreshData({ ...item, type: 'add' });
                handleModalVisibles1(true);
              }}
            />
            <EditOutlined
              onClick={(e) => {
                e.stopPropagation();
                console.log(e);
              }}
            />
            <DeleteOutlined
              onClick={(e) => {
                e.stopPropagation();
                console.log(e);
              }}
            />
          </div>
          )}
          <EditOutlined
            onClick={(e) => {
              e.stopPropagation();
              addViewRef1.current.refreshData({ ...item, type: 'edit' });
              handleModalVisibles1(true);
            }}
          />
          <DeleteOutlined
            onClick={(e) => {
              e.stopPropagation();
              showDelConfirm(async () => {
                let status = await sendRequest(delUnit, item.id);
                if (status) {
                  fetchUnit();
                }
              }, '确认删除该单位吗?');
            }}
          />
        </div>
      ),
      children: [
        {
          key: '11',
          label: 'Option 1',
        },
        {
          key: '12',
          label: 'Option 2',
        },
        {
          key: '13',
          label: 'Option 3',
        },
        {
          key: '14',
          label: 'Option 4',
        },
      ],
    },
  ]);
  useEffect(() => {
    getUnitList().then((res) => {
      console.log(res);
      </div>
    );
  };
  const renderMenuItems = (items) => {
    return items.map((item) => {
      if (item.children && item.children.length > 0) {
        return (
          <SubMenu
            key={item.key}
            title={node(item)}
            onTitleClick={(item) => {
              setUnitId(item.key);
              actionRef.current.reload();
            }}
          >
            {renderMenuItems(item.children)}
          </SubMenu>
        );
      }
      return (
        <Menu.Item
          onClick={(item) => {
            setUnitId(item.key);
            actionRef.current.reload();
          }}
          key={item.key}
        >
          {node(item)}
        </Menu.Item>
      );
    });
    console.log(items);
  }, []);
  };
  const fetchUnit = () => {
    getUnitList().then((res) => {
      if (res.code == 200 && res.data) {
        const traverseItems = (items) => {
          return items.map((item) => {
            item.key = item.id;
            item.title = '1';
            if (item.child && item.child.length > 0) {
              item.children = traverseItems(item.child);
            }
            return item;
          });
        };
        setItems(traverseItems(res.data));
      }
    });
  };
  const columns = [
    {
      title: '角色名称',
      title: '姓名',
      dataIndex: 'name',
    },
    {
      title: '联系方式',
      dataIndex: 'phone',
    },
    {
      title: '所在单位',
      dataIndex: 'departmentName',
      hideInSearch: true,
      renderFormItem: () => {
        return (
          <Cascader
            options={items}
            fieldNames={{ value: 'key', label: 'name' }}
            placeholder="请选择"
            displayRender={(label) => label[label.length - 1]}
            changeOnSelect={true}
          />
        );
      },
    },
    {
      hideInTable: true,
      title: '所在单位',
      dataIndex: 'departmentId',
      renderFormItem: () => {
        return (
          <Cascader
            options={items}
            fieldNames={{ value: 'key', label: 'name' }}
            placeholder="请选择"
            displayRender={(label) => label[label.length - 1]}
            changeOnSelect={true}
          />
        );
      },
    },
    {
      title: '所属职位',
      dataIndex: 'systemPostName',
      hideInSearch: true,
    },
    {
      title: '所属角色',
      dataIndex: 'systemRoleName',
      hideInSearch: true,
    },
    {
      title: '所属角色',
      dataIndex:'systemRoleId',
      hideInTable: true,
    },
    {
      title: '账号层级',
      dataIndex: 'accountLevel',
      // (1=市级账号,2=区县账号,3=街道账号,4=社区账号)
      render: (text, record) => {
        let role = '';
        switch (record.accountLevel) {
          case 1:
            role = '市';
            break;
          case 2:
            role = '区县';
            break;
          case 3:
            role = '街道';
            break;
          case 4:
            role = '社区';
            break;
          case 5:
            role = '党员';
            break;
          default:
            role = '';
        }
        return role;
      },
      valueEnum: {
        1: '市',
        2: '区县',
        3: '街道',
        4: '社区',
        5: '党员',
      },
    },
    {
      title: '状态',
      dataIndex: 'status',
      // (1=使用中,2=已冻结)
      hideInSearch: true,
      render: (text, record) => {
        let status = '';
        switch (record.status) {
          case 1:
            status = '使用中';
            break;
          case 2:
            status = '已冻结';
            break;
          default:
            status = '';
        }
        return status;
      },
    },
    {
      title: '操作',
@@ -86,21 +229,19 @@
          <Space>
            {record.roleId != 1 && (
              <Access accessible={access['/system_setting/people_management/edit']}>
                <Button
                  type="link"
                <a
                  onClick={() => {
                    addViewRef.current.refreshData(record);
                    handleModalVisibles(true);
                  }}
                >
                  编辑
                </Button>
                </a>
              </Access>
            )}
            {record.roleId != 1 && (
              <Access accessible={access['/system_setting/people_management/del']}>
                <Button
                  type="link"
                <a
                  onClick={() => {
                    showDelConfirm(async () => {
                      let status = await sendRequest(del, record.id);
@@ -111,19 +252,28 @@
                  }}
                >
                  删除
                </Button>
                </a>
              </Access>
            )}
            <Access accessible={access['/system_setting/people_management/detail'] || false}>
              <Button
                type="link"
              <a
                onClick={() => {
                  addViewRef.current.refreshData(record, true);
                  handleModalVisibles(true);
                }}
              >
                查看详情
              </Button>
              </a>
            </Access>
            <Access accessible={access['/system_setting/role_management/edit'] || false}>
              <a
                onClick={() => {
                  addViewRef.current.refreshData(record, true);
                  handleModalVisibles(true);
                }}
              >
                冻结
              </a>
            </Access>
          </Space>
        );
@@ -145,17 +295,19 @@
      <Row style={{ marginTop: 20, background: '#fff' }}>
        <Col span={4}>
          <Space style={{ margin: '10px 0' }}>
            <span style={{ margin: '0 27px'}}>单位管理</span>
            <Button type="primary">添加</Button>
            <span style={{ margin: '0 27px' }}>单位管理</span>
            <Button
              type="primary"
              onClick={() => {
                addViewRef1.current.refreshData({});
                handleModalVisibles1(true);
              }}
            >
              添加
            </Button>
          </Space>
          <Menu
            mode="inline"
            defaultSelectedKeys={['231']}
            style={{
              //   width: 256,
            }}
            items={items}
          />
          <Menu mode="inline">{renderMenuItems(items)}</Menu>
        </Col>
        <Col span={20} style={{ minHeight: 650 }}>
          <ProTable
@@ -167,7 +319,21 @@
              showQuickJumper: true,
              defaultPageSize: 10,
            }}
            // request={(params) => buildProTableDataSource(getList, params)}
            search={{
              labelWidth: 'auto',
              span: 6,
              defaultCollapsed: false, // 默认是否收起
            }}
            request={(params) => {
              let obj = { ...params };
              if (unitId) {
                obj.departmentId = unitId;
              }
              if (params.departmentId) {
                obj.departmentId = params.departmentId[params.departmentId.length - 1];
              }
              return buildProTableDataSource(getList, obj);
            }}
            toolBarRender={(action, selectRows) => [
              <Access accessible={access['/system_setting/people_management/add']}>
                <Space>
@@ -191,7 +357,7 @@
        ref={addViewRef}
        visible={modalVisible}
        onSave={async (fileds) => {
          let success = await sendRequest(add, fileds);
          let success = await sendRequest(addSystemUserInfo, fileds);
          if (success) {
            handleModalVisibles(false);
            actionRef.current.reload();
@@ -199,7 +365,7 @@
          addViewRef.current.clean();
        }}
        onUpdate={async (fileds) => {
          let success = await sendRequest(edit, fileds);
          let success = await sendRequest(editSystemUserInfo, fileds);
          if (success) {
            handleModalVisibles(false);
            actionRef.current.reload();
@@ -208,6 +374,25 @@
        }}
        onCancel={() => handleModalVisibles(false)}
      />
      <AddUnit
        ref={addViewRef1}
        visible={modalVisible1}
        onSave={async (fileds) => {
          let success = await sendRequest(addUnit, fileds);
          if (success) {
            handleModalVisibles1(false);
            fetchUnit();
          }
        }}
        onUpdate={async (fileds) => {
          let success = await sendRequest(editUnit, fileds);
          if (success) {
            handleModalVisibles1(false);
            fetchUnit();
          }
        }}
        onCancel={() => handleModalVisibles1(false)}
      />
    </PageContainer>
  );
};