.

src/pages/SystemManagement/Administrator/index.jsx

 import React, { useState, useEffect, useRef } from 'react';
-import { history, Link } from 'umi';
-import { Button, Popconfirm, Modal, Form, Input, message, Radio, Select, Tooltip } from 'antd';
+import { Button, Popconfirm, Modal, Form, Input, message, Radio, Select } from 'antd';
 import { PlusOutlined } from '@ant-design/icons';
-import { getRegionList, addRegion, deleteRegion, updateRegion } from '@/services/region';
 import { getCooperativeList } from '@/services/cooperative';
 import {
   getUserList,
 const { Option } = Select;
 
 export default (props) => {
-  const actions = () => [
-    <Button key="add" type="primary" icon={<PlusOutlined />} onClick={() => setEditModal(true)}>
-      新增
-    </Button>,
-  ];
+  //编辑弹窗
   const formItemLayout = { labelCol: { span: 6 }, wrapperCol: { span: 14 } };
   const [form] = Form.useForm();
   const [editModal, setEditModal] = useState(false);
   const [loading, setLoading] = useState(false);
   const [userId, setuserId] = useState();
   const [password, setPassWord] = useState('');
-  const actionRef = useRef();
   const [cooperativeList, setCooperativeList] = useState([]);
 
+  //列表数据
+  const actionRef = useRef();
+
+  // 编辑弹窗的表单提交
   const Submit = (values) => {
     const newData = { ...values };
     if (!newData.sex && newData.sex !== 0) {
       newData.sex = 1;
     }
-    console.log(newData);
     setLoading(true);
     if (!/^1[0-9]{10}$/.test(newData.phone)) {
       message.warning('请输入正确的十一位手机号');
         });
     }
   };
-  const handelEdit = (val) => {
-    setuserId(val.userId);
-    form.setFieldsValue(val);
-    setEditModal(true);
-  };
+  //表单点击取消按钮
   const onCancel = () => {
     setuserId();
     form.resetFields();
     setEditModal(false);
   };
+  // 弹窗表单中机构搜索框改变事件目前没用
   const handelChange = () => {};
+
+  // 列表点击编辑按钮
+  const handelEdit = (val) => {
+    setuserId(val.userId);
+    setEditModal(true);
+  };
+  //列表点击删除按钮
   const handleDelete = (id) => {
-    deleteRegion(id)
+    deleteUser(id)
       .then(() => {
         message.success('删除成功');
         actionRef.current.reload();
         message.error(err);
       });
   };
+  //列表切换人员状态方法
+  const handleOK = (record, data) => {
+    const title = record.status
+      ? '您确定要将该人员状态变更为禁用吗? 禁用后该人员将不能登录'
+      : '您确定要将该人员状态变更为启用吗? 启用后该人员可以登录!';
+    Modal.confirm({
+      title: title,
+      okText: '确认',
+      cancelText: '取消',
+      onOk() {
+        updateUser(record.userId, { ...record, status: record.status === 1 ? 0 : 1 })
+          .then((res) => {
+            message.success('操作成功');
+            actionRef.current.reload();
+          })
+          .catch((err) => {
+            message.error(err);
+          });
+      },
+    });
+  };
   useEffect(() => {
+    //获取账号默认密码
     getDefaultPassword().then((res) => {
       setPassWord(res);
     });
+    //获取机构列表数据
     getCooperativeList().then((res) => {
       setCooperativeList(res.records);
     });
     if (userId) {
+      getUserDetail(userId).then((res) => {
+        if (res.orgId === '-1') {
+          form.setFieldsValue({ ...res, orgId: cooperativeList[0].orgId });
+        } else {
+          form.setFieldsValue(res);
+        }
+      });
     } else {
       form.resetFields();
     }
   }, [userId]);
+
+  const actions = () => [
+    <Button key="add" type="primary" icon={<PlusOutlined />} onClick={() => setEditModal(true)}>
+      新增
+    </Button>,
+  ];
   const columns = [
-    {
-      title: '登录账号',
-      dataIndex: 'loginName',
-      key: 'loginName',
-    },
     {
       title: '用户名',
       dataIndex: 'userName',
       key: 'userName',
     },
-
+    {
+      title: '性别',
+      dataIndex: 'sex',
+      key: 'sex',
+      width: 80,
+      render: (_, record) => {
+        return record.sex === 1 ? '男' : record.sex === 0 ? '女' : '未知';
+      },
+      search: false,
+    },
     {
       title: '手机号',
       dataIndex: 'phone',
       key: 'phone',
+      width: 120,
     },
     {
       title: '邮箱',
       title: '状态',
       dataIndex: 'status',
       key: 'status',
+      renderFormItem: () => {
+        return (
+          <Select placeholder="请选择">
+            <Option value={1}>启用</Option>
+            <Option value={0}>禁用</Option>
+          </Select>
+        );
+      },
       render: (_, record) => {
         return record.status === 1 ? '启用' : '未启用';
       },
       title: '操作',
       valueType: 'option',
       render: (_, record) => [
-        <a key={1} onClick={() => handelEdit(record)}>
+        <Button type="link" key={1} onClick={() => handleOK(record)}>
+          {record.status === 0 ? '启用' : '禁用'}
+        </Button>,
+        <a key={2} onClick={() => handelEdit(record)}>
           编辑
         </a>,
         <Popconfirm
-          key={2}
+          key={3}
           title="您是否确认删除 ?"
           onConfirm={() => handleDelete(record.userId)}
           okText="确定"
           <FormItem label="邮箱" name="email" rules={[{ required: true, message: '请输入' }]}>
             <Input placeholder="请输入" />
           </FormItem>
-          <FormItem label="所属机构" name="orgId">
+          <FormItem label="所属机构" name="orgId" rules={[{ required: true, message: '请输入' }]}>
             <Search placeholder="请选择机构" onChange={handelChange} />
             {/* <Select
               placeholder="请选择机构"
               ))}
             </Select> */}
           </FormItem>
+          <FormItem label="状态" name="status" rules={[{ required: true, message: '请选择' }]}>
+            <Select placeholder="请选择是否启用">
+              <Option value={1}>启用</Option>
+              <Option value={0}>禁用</Option>
+            </Select>
+          </FormItem>
           <FormItem label=" " colon={false}>
             <Button type="default" onClick={onCancel}>
               取消