李志伟 3 years ago
parent
commit
138f10cb73

+ 93
- 15
src/pages/SystemManagement/Administrator/index.jsx View File

@@ -1,5 +1,21 @@
1 1
 import React, { useState, useEffect, useRef } from 'react';
2
-import { Button, Popconfirm, Modal, Form, Input, message, Radio, Select, Checkbox } from 'antd';
2
+import {
3
+  Button,
4
+  Popconfirm,
5
+  Modal,
6
+  Form,
7
+  Input,
8
+  message,
9
+  Radio,
10
+  Select,
11
+  List,
12
+  Row,
13
+  Col,
14
+  Card,
15
+  Tree,
16
+  Typography,
17
+  Checkbox,
18
+} from 'antd';
3 19
 import { PlusOutlined } from '@ant-design/icons';
4 20
 import { getCooperativeList } from '@/services/cooperative';
5 21
 import {
@@ -16,6 +32,7 @@ import { PageHeaderWrapper } from '@ant-design/pro-layout';
16 32
 import PageTable from '@/components/PageTable';
17 33
 import moment from 'moment';
18 34
 import Search from '@/components/CooperativeSearch';
35
+import './index.less';
19 36
 
20 37
 const FormItem = Form.Item;
21 38
 const { Option } = Select;
@@ -39,7 +56,33 @@ export default (props) => {
39 56
   const [currentCheckbox, setCurrentCheckbox] = useState();
40 57
   //列表数据
41 58
   const actionRef = useRef();
59
+  const [data, setData] = useState([]);
60
+  const [orgId, setOrgId] = useState();
42 61
 
62
+  // 动态生成树
63
+  const handelNode = (item) => {
64
+    let node = (
65
+      <div
66
+        key={item.orgId}
67
+        style={{
68
+          justifyContent: 'space-between',
69
+          display: 'flex',
70
+          // width: '100%',
71
+          padding: '8px 0',
72
+        }}
73
+      >
74
+        <span>{item.title}</span>
75
+      </div>
76
+    );
77
+    return node;
78
+  };
79
+  const onSelect = (checkedKeys, info) => {
80
+    if (info.selected) {
81
+      setOrgId(info.node.key);
82
+    } else {
83
+      setOrgId();
84
+    }
85
+  };
43 86
   // 编辑弹窗的表单提交
44 87
   const Submit = (values) => {
45 88
     const newData = { ...values };
@@ -182,6 +225,10 @@ export default (props) => {
182 225
     //获取机构列表数据
183 226
     getCooperativeList().then((res) => {
184 227
       setCooperativeList(res.records);
228
+      const list = res.records?.map((item) => {
229
+        return { title: item.name, key: item.orgId };
230
+      });
231
+      setData(list);
185 232
     });
186 233
     //获取角色列表数据
187 234
     getRoleList().then((res) => {
@@ -245,6 +292,7 @@ export default (props) => {
245 292
       title: '状态',
246 293
       dataIndex: 'status',
247 294
       key: 'status',
295
+      width: 80,
248 296
       renderFormItem: () => {
249 297
         return (
250 298
           <Select placeholder="请选择">
@@ -260,10 +308,11 @@ export default (props) => {
260 308
     {
261 309
       title: '操作',
262 310
       valueType: 'option',
311
+      width: 240,
263 312
       render: (_, record) => [
264
-        <Button type="link" key={1} onClick={() => handleOK(record)}>
313
+        <a key={1} onClick={() => handleOK(record)}>
265 314
           {record.status === 0 ? '启用' : '禁用'}
266
-        </Button>,
315
+        </a>,
267 316
         <a key={2} onClick={() => handleEdit(record)}>
268 317
           编辑
269 318
         </a>,
@@ -285,16 +334,31 @@ export default (props) => {
285 334
 
286 335
   return (
287 336
     <PageHeaderWrapper>
288
-      <PageTable
289
-        request={getUserList}
290
-        // expfunc={exportPersonList}
291
-        columns={columns}
292
-        actionRef={actionRef}
293
-        rowKey="userId"
294
-        options={false}
295
-        toolBarRender={actions}
296
-        scroll={{ x: 1000 }}
297
-      />
337
+      <Row gutter={16}>
338
+        <Col span={6}>
339
+          <Card title="机构列表">
340
+            <Tree
341
+              onSelect={onSelect}
342
+              className="treeClass"
343
+              titleRender={(data) => handelNode(data)}
344
+              treeData={data}
345
+            />
346
+          </Card>
347
+        </Col>
348
+        <Col span={18}>
349
+          <PageTable
350
+            request={getUserList}
351
+            params={{ org_id: orgId }}
352
+            // expfunc={exportPersonList}
353
+            columns={columns}
354
+            actionRef={actionRef}
355
+            rowKey="userId"
356
+            options={false}
357
+            toolBarRender={actions}
358
+            scroll={{ x: 1000 }}
359
+          />
360
+        </Col>
361
+      </Row>
298 362
       <Modal
299 363
         forceRender
300 364
         title={userId ? '人员编辑' : '人员新增'}
@@ -371,7 +435,7 @@ export default (props) => {
371 435
       </Modal>
372 436
       <Modal
373 437
         forceRender
374
-        title="角色授权"
438
+        title="授权角色"
375 439
         visible={editRoleModal}
376 440
         onCancel={onRoleCancel}
377 441
         keyboard={false}
@@ -384,6 +448,20 @@ export default (props) => {
384 448
           style={{ width: '100%' }}
385 449
           value={currentCheckbox}
386 450
           onChange={handleCheckboxChange}
451
+        >
452
+          <List
453
+            dataSource={roleList}
454
+            renderItem={(item) => (
455
+              <List.Item>
456
+                <Checkbox value={item.roleId}>{item.name}</Checkbox>
457
+              </List.Item>
458
+            )}
459
+          />
460
+        </Checkbox.Group>
461
+        {/* <Checkbox.Group
462
+          style={{ width: '100%' }}
463
+          value={currentCheckbox}
464
+          onChange={handleCheckboxChange}
387 465
         >
388 466
           {roleList.map((item) => {
389 467
             return (
@@ -393,7 +471,7 @@ export default (props) => {
393 471
               </div>
394 472
             );
395 473
           })}
396
-        </Checkbox.Group>
474
+        </Checkbox.Group> */}
397 475
       </Modal>
398 476
     </PageHeaderWrapper>
399 477
   );

+ 15
- 0
src/pages/SystemManagement/Administrator/index.less View File

@@ -0,0 +1,15 @@
1
+@import (reference) '~antd/es/style/themes/index';
2
+
3
+.treeClass {
4
+  .ant-tree-list {
5
+    & div {
6
+      width: 100% !important;
7
+      .ant-tree-switcher-noop {
8
+        display: none !important;
9
+      }
10
+      span:nth-child(3) {
11
+        width: 100%;
12
+      }
13
+    }
14
+  }
15
+}

+ 1
- 2
src/pages/SystemManagement/Cooperative/index.jsx View File

@@ -62,12 +62,11 @@ export default (props) => {
62 62
       });
63 63
   };
64 64
   // 动态生成树
65
-
66 65
   const handelNode = (item) => {
67 66
     let node = (
68 67
       <div
69 68
         key={item.orgId}
70
-        style={{ justifyContent: 'space-between', display: 'flex', width: '100%' }}
69
+        style={{ justifyContent: 'space-between', display: 'flex', padding: '8px 0' }}
71 70
         onClick={() => handleslect(item.key)}
72 71
       >
73 72
         <span>{item.title}</span>

+ 2
- 0
src/pages/SystemManagement/Region/index.jsx View File

@@ -85,10 +85,12 @@ export default (props) => {
85 85
       key: 'createDate',
86 86
       render: formatterTime,
87 87
       search: false,
88
+      width: 240,
88 89
     },
89 90
     {
90 91
       title: '操作',
91 92
       valueType: 'option',
93
+      width: 160,
92 94
       render: (_, record) => [
93 95
         <a key={1} onClick={() => handelEdit(record)}>
94 96
           编辑

+ 4
- 2
src/pages/SystemManagement/UserRights/index.jsx View File

@@ -336,10 +336,12 @@ export default (props) => {
336 336
       dataIndex: 'createDate',
337 337
       key: 'createDate',
338 338
       render: formatterTime,
339
+      width: 240,
339 340
     },
340 341
     {
341 342
       title: '操作',
342 343
       valueType: 'option',
344
+      width: 240,
343 345
       render: (_, record) => [
344 346
         <a key={1} onClick={() => handelEdit(record)}>
345 347
           编辑
@@ -354,7 +356,7 @@ export default (props) => {
354 356
           <a href="#">删除</a>
355 357
         </Popconfirm>,
356 358
         <a key={3} onClick={() => handelEmpower(record)}>
357
-          角色授权
359
+          授权菜单
358 360
         </a>,
359 361
       ],
360 362
     },
@@ -402,7 +404,7 @@ export default (props) => {
402 404
         </Form>
403 405
       </Modal>
404 406
       <Modal
405
-        title="角色授权"
407
+        title="授权菜单"
406 408
         visible={showModal}
407 409
         onCancel={onEmpowerCancel}
408 410
         keyboard={false}