Explorar el Código

Merge remote-tracking branch 'origin/dev' into dev

# Conflicts:
#	src/api/request.js
zhouna hace 3 años
padre
commit
7c8db1714a

+ 1 - 0
src/api/request.js

@@ -8,5 +8,6 @@ const request = {
     addHospital:'security-center/hospitalManage/addHospital', //添加组织
     updateHospital:'/security-center/hospitalManage/updateHospital',   //修改
     getHospitalById:'/security-center/hospitalManage/getHospitalById', //获取详情
+    getUserPage:'/security-center/userManage/getUserPage',//用户列表
 };
 export default request;

+ 0 - 1
src/common/common.less

@@ -11,7 +11,6 @@
 
 .wrapper{
   min-width: 1214px;
-  padding: 0 14px;
   .basic{
     height: 78px;
     background: #fff;

+ 41 - 28
src/components/UserManager/index.js

@@ -1,15 +1,38 @@
+import React, { useState, useEffect } from 'react';
 import { Form, Input, Button, Table, Select, Pagination, Breadcrumb, Space, Menu, Dropdown } from 'antd';
 import { DownOutlined, PlusOutlined } from '@ant-design/icons';
+import NormalPlayer from './testComponent/testComponent'
 import '@common/common.less';
-function OrgManager() {
-  const { Option } = Select;
+import apiObj from '@api/index';
+const { post, api } = apiObj;
+const { Option } = Select;
+function UserManager() {
+  useEffect(() => {
+    getUserPage();
+  }, []);
+  const [userList, setUserList] = useState([]);
+  const [title, setTitle] = useState("");
+  const [visible, setVisible] = useState(false);
   const onFinish = (values) => {
     console.log('Success:', values);
-  };
-
-  const onFinishFailed = (errorInfo) => {
-    console.log('Failed:', errorInfo);
-  };
+  }
+  const ChildrenChange =(val)=> {//这个val就是子组件传来的
+    setVisible(false);
+  }
+  const showModal = (name,type) => {
+    setVisible(type);
+    setTitle(name);
+  }
+  function getUserPage(param = {}) {
+    //const param = filterData;
+    post(api.getUserPage, param).then((res) => {
+      if (res.data.code === 200) {
+        const data = res.data.data;
+        console.log(data)
+        setUserList(data.records);
+      }
+    })
+  }
   const menu = (
     <Menu>
       <Menu.Item key="0">
@@ -40,7 +63,7 @@ function OrgManager() {
           {record.age == 1 ? (
             <a>查看</a>
           ) : (
-              <a>修改</a>
+              <a >修改</a>
             )}
         </Space>
       )
@@ -49,17 +72,16 @@ function OrgManager() {
       title: '操作', dataIndex: 'key', render: () => (
         <Space size="middle">
           <a>查看</a>
-          <a>修改</a>
+          <a onClick={e => showModal('修改用户', true)} >修改</a>
           <Dropdown overlay={menu}>
             <a className="ant-dropdown-link" onClick={e => e.preventDefault()}>
-              Hover me <DownOutlined />
+              更多 <DownOutlined />
             </a>
           </Dropdown>
         </Space>
       )
     }
-  ];
-
+  ]
   const data = [];
   for (let i = 0; i < 100; i++) {
     data.push({
@@ -74,18 +96,6 @@ function OrgManager() {
       gender: 'M',
     });
   }
-
-
-  function handleChange(value) {
-    console.log(`selected ${value}`);
-  }
-  function affiliatedTableTableChangePage(page) {
-    let params = {
-      currentPage: page,
-      pageSize: 10
-    }
-    this.props.getaffiliatedTableTableList(params)
-  }
   return (
     <div className="wrapper">
       <Form
@@ -133,21 +143,24 @@ function OrgManager() {
           <Breadcrumb>
             <Breadcrumb.Item>用户管理</Breadcrumb.Item>
           </Breadcrumb>
-          <Button type="primary" icon={<PlusOutlined />}>新增用户</Button>
+          <Button type="primary" icon={<PlusOutlined />} onClick={e => showModal('新增用户', true)}>新增用户</Button>
         </div>
-        
+
         <Table
           columns={columns}
           dataSource={data}
           pagination={{
             showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条数据`,
             pageSizeOptions: ['15', '30', '60', '120'],
-            pageSize:15,
+            pageSize: 5,
           }} />
       </div>
+      <div>
+        <NormalPlayer changeData={ChildrenChange} title={title}  visible={visible}></NormalPlayer>
+      </div>
 
     </div >
   )
 }
 
-export default OrgManager;
+export default UserManager;

+ 231 - 0
src/components/UserManager/testComponent/testComponent.js

@@ -0,0 +1,231 @@
+import React, { useState } from 'react';
+import { Modal, Form, Input, Select, Row, Col, Button, Switch  } from 'antd';
+
+const { Option } = Select;
+
+const formItemLayout = {
+  labelCol: {
+    xs: { span: 36 },
+    sm: { span: 8 },
+  },
+  wrapperCol: {
+    xs: { span: 24 },
+    sm: { span: 16 },
+  },
+};
+const tailFormItemLayout = {
+  wrapperCol: {
+    xs: {
+      span: 24,
+      offset: 0,
+    },
+    sm: {
+      span: 16,
+      offset: 8,
+    },
+  },
+};
+const state = {
+  phone: '123'
+}
+function NormalPlayer(props) {
+  console.log(state.phone)
+  const hideModal = () => {
+    form.resetFields();
+    props.changeData()
+  };
+  const submit = () => {
+    form
+      .validateFields()
+      .then((values) => {
+        form.resetFields();
+      })
+      .catch((info) => {
+        console.log('Validate Failed:', info);
+      });
+  }
+  const [form] = Form.useForm();
+  const handleMaxRestoreUp = (event) => {
+    console.log(event.target.value)
+  }
+  const onFinish = (values: any) => {
+    console.log('Received values of form: ', values);
+  };
+
+  const prefixSelector = (
+    <Form.Item name="prefix" noStyle>
+      <Select style={{ width: 70 }}>
+        <Option value="86">+86</Option>
+        <Option value="87">+87</Option>
+      </Select>
+    </Form.Item>
+  );
+
+  const [autoCompleteResult, setAutoCompleteResult] = useState([]);
+
+  const onWebsiteChange = (value: string) => {
+    if (!value) {
+      setAutoCompleteResult([]);
+    } else {
+      setAutoCompleteResult(['.com', '.org', '.net'].map(domain => `${value}${domain}`));
+    }
+  };
+
+  const websiteOptions = autoCompleteResult.map(website => ({
+    label: website,
+    value: website,
+  }));
+  return (
+    <>
+      <Modal
+        title={props.title}
+        visible={props.visible}
+        onOk={submit}
+        onCancel={hideModal}
+        okText="确认"
+        cancelText="取消">
+        <Form
+          {...formItemLayout}
+          form={form}
+          name="register"
+          onFinish={onFinish}
+          scrollToFirstError
+          initialValues={state}
+        >
+          <Form.Item
+            name="name"
+            label="用户名"
+            rules={[
+              {
+                required: true,
+                message: '请输入用户名',
+              },
+            ]}
+          >
+            <Input placeholder="用户名是组织中唯一标识,请勿重复" />
+          </Form.Item>
+
+          <Form.Item
+            name="phone"
+            label="手机号码"
+            rules={[
+              {
+                required: true,
+                message: '请输入手机号',
+              },
+            ]}
+          >
+            <Input />
+          </Form.Item>
+          <Form.Item
+            name="password"
+            label="初始密码"
+            rules={[
+              {
+                required: true,
+                message: '请输入初始密码',
+              },
+            ]}
+            hasFeedback
+          >
+            <Input.Password />
+          </Form.Item>
+          <Form.Item
+            name="confirm"
+            label="确认密码"
+            dependencies={['password']}
+            hasFeedback
+            rules={[
+              {
+                required: true,
+                message: '请输入确认密码',
+              },
+              ({ getFieldValue }) => ({
+                validator(_, value) {
+                  if (!value || getFieldValue('password') === value) {
+                    return Promise.resolve();
+                  }
+                  return Promise.reject(new Error('两次密码不一致,请确认密码'));
+                },
+              }),
+            ]}
+          >
+            <Input.Password />
+          </Form.Item>
+
+          <Form.Item
+            name="nickname"
+            label="姓名"
+            rules={[{ required: true, message: '请输入姓名', whitespace: true }]}
+          >
+            <Input />
+          </Form.Item>
+
+          <Form.Item
+            name="residence"
+            label="身份证号码"
+          >
+            <Input />
+          </Form.Item>
+
+          <Form.Item
+            name="phone"
+            label="所属组织"
+            rules={[{ required: true, message: 'Please input your phone number!' }]}
+          >
+            <Select placeholder="请选择组织">
+              <Option value="male">Male</Option>
+              <Option value="female">Female</Option>
+              <Option value="other">Other</Option>
+            </Select>
+          </Form.Item>
+
+          <Form.Item
+            name="website"
+            label="职称"
+          >
+            <Select placeholder="请选择职称">
+              <Option value="male">Male</Option>
+              <Option value="female">Female</Option>
+              <Option value="other">Other</Option>
+            </Select>
+          </Form.Item>
+
+          <Form.Item
+            name="gender"
+            label="工号"
+          >
+            <Input />
+          </Form.Item>
+
+          <Form.Item
+            name="captcha"
+            label="所属角色"
+            rules={[{ required: true, message: '请选择角色' }]}
+          >
+            <Select placeholder="请选择所属角色">
+              <Option value="male">Male</Option>
+              <Option value="female">Female</Option>
+              <Option value="other">Other</Option>
+            </Select>
+          </Form.Item>
+
+          <Form.Item
+            name="agreement"
+            label="排序"
+          >
+            <Input />
+          </Form.Item>
+          <Form.Item
+            name="agreement"
+            valuePropName="checked"
+            label="当前状态"
+          >
+            <Switch defaultChecked />
+          </Form.Item>
+        </Form>
+      </Modal>
+    </>
+  );
+}
+export default NormalPlayer;