feats

src/pages/roles/index.jsx

@@ -0,0 +1,7 @@
+import React from 'react'
+
+export default (props) => {
+  return (
+    <div></div>
+  )
+}

src/pages/roles/list.jsx

@@ -0,0 +1,49 @@
+import React from 'react';
+import { Button, Input, List, Popconfirm, Tree, Space, Modal } from 'antd';
+
+export default (props) => {
+  const data = [
+    'Racing car sprays burning fuel into crowd.',
+    'Japanese princess to wed commoner.',
+    'Australian walks 100km after outback crash.',
+    'Man charged over missing wedding girl.',
+    'Los Angeles battles huge wildfires.',
+  ];
+
+  const [visible, setVisible] = React.useState(false);
+  const [inText, setInText] = React.useState();
+
+  return (
+    <>
+      <List
+        header='角色列表'
+        style={{ background: '#fff' }}
+        bordered
+        dataSource={data}
+        renderItem={item => (
+          <List.Item
+            style={{ width: '100%' }}
+            actions={[
+              <Button key='edit' type='link' onClick={() => onEdit(item)}>编辑</Button>,
+              <Popconfirm key='delete' title="确认删除?" onConfirm={() => onDelete(item)}>
+                <Button type='link' danger>删除</Button>
+              </Popconfirm>
+            ]}
+          >
+            <div onClick={() => props.onChange(item)}>
+              {item}
+            </div>
+          </List.Item>
+        )}
+      />
+      <Modal
+        title="Basic Modal"
+        open={visible}
+        onOk={handleOk}
+        onCancel={() => setVisible(false)}
+      >
+        <Input value={inText} onChange={e => setInText(e.target.value)} />
+      </Modal>
+    </>
+  )
+}

src/pages/user/Role.jsx

@@ -0,0 +1,105 @@
+import React from 'react';
+import { Button, Row, Col, Card, List, Popconfirm, Tree, Space, Modal } from 'antd';
+
+export default (props) => {
+  const data = [
+    'Racing car sprays burning fuel into crowd.',
+    'Japanese princess to wed commoner.',
+    'Australian walks 100km after outback crash.',
+    'Man charged over missing wedding girl.',
+    'Los Angeles battles huge wildfires.',
+  ];
+
+  const treeData = [
+    {
+      title: 'parent 1',
+      key: '0-0',
+      children: [
+        {
+          title: 'parent 1-0',
+          key: '0-0-0',
+          disabled: true,
+          children: [
+            {
+              title: 'leaf',
+              key: '0-0-0-0',
+              disableCheckbox: true,
+            },
+            {
+              title: 'leaf',
+              key: '0-0-0-1',
+            },
+          ],
+        },
+        {
+          title: 'parent 1-1',
+          key: '0-0-1',
+          children: [
+            {
+              title: (
+                <span
+                  style={{
+                    color: '#1890ff',
+                  }}
+                >
+                  sss
+                </span>
+              ),
+              key: '0-0-1-0',
+            },
+          ],
+        },
+      ],
+    },
+  ];
+
+  const onSelect = (selectedKeys, info) => {
+    console.log('selected', selectedKeys, info);
+  };
+  const onCheck = (checkedKeys, info) => {
+    console.log('onCheck', checkedKeys, info);
+  };
+
+  return (
+    <div>
+      <Row gutter={24}>
+        <Col span={8}>
+          <List
+            header='角色列表'
+            style={{ background: '#fff' }}
+            bordered
+            dataSource={data}
+            renderItem={item => (
+              <List.Item
+                style={{ width: '100%' }}
+                actions={[
+                  <Button key='edit' type='link' onClick={() => onEdit(item)}>编辑</Button>,
+                  <Popconfirm key='delete' title="确认删除?" onConfirm={() => onDelete(item)}>
+                    <Button type='link' danger>删除</Button>
+                  </Popconfirm>
+                ]}
+              >
+                <div onClick={() => setCurrent(item)}>
+                  {item}
+                </div>
+              </List.Item>
+            )}
+          />
+        </Col>
+        <Col span={16}>
+          <Card title='授权菜单' extra={<Button type='primary' ghost>保存</Button>}>
+            <Tree
+              checkable
+              defaultExpandedKeys={['0-0-0', '0-0-1']}
+              defaultSelectedKeys={['0-0-0', '0-0-1']}
+              defaultCheckedKeys={['0-0-0', '0-0-1']}
+              onSelect={onSelect}
+              onCheck={onCheck}
+              treeData={treeData}
+            />
+          </Card>
+        </Col>
+      </Row>
+    </div>
+  )
+}

src/routes/routes.jsx

@@ -29,6 +29,7 @@ import StockClassificationList from '@/pages/stockClassification/list';
 import StockClassificationEdit from '@/pages/stockClassification/edit';
 import RotationChartList from '@/pages/rotationChart/list';
 import RotationChartEdit from '@/pages/rotationChart/edit';
+import Roles from '@/pages/user/Role';
 
 /**
  * meta 用来扩展自定义数据数据
@@ -225,6 +226,13 @@ export default [
               title: '库存分类维护',
               hideInMenu: true,
             },
+          },
+          {
+            path: 'roles',
+            element: <Roles />,
+            meta: {
+              title: '系统角色管理',
+            },
           }
         ],
       },