dingxin преди 5 години
родител
ревизия
765a166389
променени са 3 файла, в които са добавени 229 реда и са изтрити 231 реда
  1. 62
    36
      src/pages/staff/list/RoleList.jsx
  2. 81
    55
      src/pages/staff/list/addRole.jsx
  3. 86
    140
      src/pages/staff/list/editRole.jsx

+ 62
- 36
src/pages/staff/list/RoleList.jsx Целия файл

@@ -8,39 +8,73 @@ import { Card, Avatar } from 'antd';
8 8
 import request from '../../../utils/request'
9 9
 import Styles from './style.less';
10 10
 
11
-
12
-function confirm() {
13
-  Modal.confirm({
14
-    title: '确认停用该角色?',
15
-    okText: '确认',
16
-    cancelText: '取消',
17
-    onOk() {
18
-      console.log('OK');
19
-    },
20
-    onCancel() {
21
-      console.log('Cancel');
11
+const header = props => {
12
+// function confirm(id) {
13
+//   Modal.confirm({
14
+//     title: '确认停用该角色?',
15
+//     okText: '确认',
16
+//     cancelText: '取消',
17
+//     onOk() {
18
+//     },
19
+//     onCancel() {
20
+//       console.log('Cancel');
21
+//     },
22
+//   });
23
+// }
24
+
25
+function addRole(roleId) {
26
+  router.push({
27
+    pathname: '/staff/list/addRole',
28
+    query: {
29
+      id: roleId,
22 30
     },
23 31
   });
24
-
25 32
 }
26
-function toEditRole() {
33
+
34
+function toEditRole(roleId) {
27 35
   router.push({
28
-    pathname: '/staff/list/addRole',
36
+    pathname: '/staff/list/editRole',
29 37
     query: {
30
-      a: 'b',
38
+      id: roleId,
31 39
     },
32 40
   });
33 41
 }
34
-
35
-
42
+const [data, setData] = useState({ data: [] })
43
+// 初始化角色
44
+ useEffect(() => {
45
+   localStorage.removeItem('value');
46
+    getList({ pageNum: 1, pageSize: 100 })
47
+ }, [])
48
+
49
+ function getList(params) {
50
+   request({
51
+     url: '/api/admin/taRole',
52
+     method: 'GET',
53
+     params: { ...params },
54
+ // eslint-disable-next-line no-shadow
55
+ }).then(data => {
56
+     console.log(data)
57
+     setData(data)
58
+ })
59
+ }
60
+// 是否停用
61
+function stop(id) {
62
+  request({
63
+    url: `/api/admin/taRole/stop/${id}`,
64
+    method: 'PUT',
65
+// eslint-disable-next-line no-shadow
66
+}).then(data => {
67
+  getList({ pageNum: 1, pageSize: 100 })
68
+})
69
+}
36 70
 const dataSource = [
37 71
   {
38 72
     name: '置业顾问',
39
-    status: '1',//显示停用
73
+    status: '1',
40 74
   },
41 75
   {
42 76
     name: '置业经理',
43
-    status: '1',//停用
77
+    status: '1',
44 78
   },
45 79
 ];
46 80
 
@@ -55,10 +89,9 @@ const columns = [
55 89
   // },
56 90
   {
57 91
     title: '角色名称',
58
-    dataIndex: 'name',
59
-    key: 'name',
92
+    dataIndex: 'roleName',
93
+    key: 'roleName',
60 94
     align: 'center',
61
-    render: text => <a>{text}</a>,
62 95
   },
63 96
 
64 97
   {
@@ -67,9 +100,9 @@ const columns = [
67 100
     key: 'status',
68 101
     align: 'center',
69 102
 
70
-    render: () => <>
71
-      <span style={{ color: '#1990FF', marginRight: '20px' }} onClick={confirm}>停用
72
-      <Icon type="stop" className={styles.shoppingCart} style={{fontSize:14}}/>
103
+    render: (text, record) => <>
104
+      <span style={{ color: '#1990FF', marginRight: '20px' }} onClick={() => stop(record.roleId)}>{ record.status === 1 ? '停用' : '启用' }
105
+      <Icon type="stop" className={styles.shoppingCart} style={{ fontSize: 14 }}/>
73 106
       </span>
74 107
       <span style={{ color: '#FF925C' }} onClick={toEditRole}>编辑
75 108
       <Icon type="form" className={styles.edit} />
@@ -80,22 +113,15 @@ const columns = [
80 113
 ];
81 114
 
82 115
 
83
-const header = (props) => {
84
-
85
-
86
-
87
-
88
-  return (
116
+return (
89 117
     <>
90
-      <Button type="danger" className={styles.addBtn} onClick={toEditRole}>新增</Button>
118
+      <Button type="danger" className={styles.addBtn} onClick={addRole}>新增</Button>
91 119
       <div className={Styles.roletext}>
92 120
 
93
-        <Table dataSource={dataSource} columns={columns} />
121
+        <Table dataSource={data.records} columns={columns} />
94 122
       </div>
95 123
     </>
96 124
 
97 125
   )
98 126
 }
99
-const WrappedHeader = Form.create({ name: 'header' })(header);
100
-
101
-export default WrappedHeader
127
+export default header

+ 81
- 55
src/pages/staff/list/addRole.jsx Целия файл

@@ -4,6 +4,7 @@ import { connect } from 'dva';
4 4
 import XForm, { FieldTypes } from '../../../components/XForm';
5 5
 import request from '../../../utils/request';
6 6
 import channels from './channelList.less';
7
+import { resolve } from 'path';
7 8
 
8 9
 const { TextArea } = Input;
9 10
 
@@ -14,51 +15,69 @@ const { TextArea } = Input;
14 15
  * @param {*} props
15 16
  * @returns
16 17
  */
17
-const Edit = props => {
18
-  console.log('props,props', props.user.currentUser)
19
-  const userMenus = props.user.currentUser.menus;
20
-  const userBtns = props.user.currentUser.buttons;
21
-
22
-
23
-  const [data, setData] = useState({ data: [] })
24
- // 获取当前所有菜单
25
-  useEffect(() => {
26
-    localStorage.removeItem('value');
27
-    menuList({ pageNum: 1, pageSize: 100 })
28
-  }, [])
29
-
30
-  function menuList(params) {
31
-    request({
32
-      url: '/api/admin/menuList',
33
-      method: 'GET',
34
-      params: { ...params },
35
-  // eslint-disable-next-line no-shadow
36
-  }).then(data => {
37
-      console.log(data)
38
-      setData(data)
39
-  })
40
-  }
41
-
42
-  // function SuBmenu(params) {
43
-  //  return Array.from(userMenus).map(Item =>
44
-  //  <Checkbox value={ Item.menuId }> { Item.name }</Checkbox>)
45
-  // }
46
-  // const [tab, changeTab] = useState('basic')
47
-
48
-  const Permission = [
49
-    '项目管理',
50
-    '员工管理',
51
-    '客户管理',
52
-    '系统管理',
53
-    '渠道管理',
54
-    '轮播图管理',
55
-    '资讯管理',
56
-    '活动管理',
57
-    '积分商城',
58
-    '首页数据',
59
-  ]
18
+const add = props => {
19
+  const Poster = propses => {
20
+    console.log('props,props', props.user.currentUser)
21
+    const userMenus = props.user.currentUser.menus;
22
+    const userBtns = props.user.currentUser.buttons;
23
+    const [data, setData] = useState({ data: [] })
24
+   // 获取当前所有菜单
25
+    useEffect(() => {
26
+      localStorage.removeItem('value');
27
+      menuList({ pageNum: 1, pageSize: 100 })
28
+    }, [])
29
+  
30
+    function menuList(params) {
31
+      request({
32
+        url: '/api/admin/menuList',
33
+        method: 'GET',
34
+        params: { ...params },
35
+    // eslint-disable-next-line no-shadow
36
+    }).then(data => {
37
+        console.log(data)
38
+        setData(data)
39
+    })
40
+    }
41
+
42
+
43
+    // const [menus, setMenus] = useState([]);
44
+// 判断menus是否有值
45
+    const [menus, setMenus] = useState([]);
46
+
47
+
48
+    const addMenus = m => {
49
+      const newMenus = [...menus, m]
50
+      setMenus([...menus, m])
51
+    };
52
+    const delMenus = m => setMenus(menus.filter(x => x.menuId !== m.menuId));
53
+    const handleMenuChange = m => e => {
54
+      console.log('e', m)
55
+      if (e.target.checked) {
56
+        // setMenusData(m)
57
+        addMenus(m)
58
+      } else {
59
+        delMenus(m)
60
+      }
61
+      console.log('menus1111', menus)
62
+    }
63
+
64
+    const [but, setBut] = useState([]);
65
+    // 判断menus是否有值
66
+        const addBut = m => setBut([...but, m]);
67
+        const delBut = m => setBut(but.filter(x => x.menuId !== m.menuId));
68
+        const handleButChange = m => e => {
69
+          console.log('e', m)
70
+          if (e.target.checked) {
71
+            addBut(m)
72
+          } else {
73
+            delBut(m)
74
+          }
75
+          // console.log('menus', menus)
76
+
77
+          console.log('menus', menus)
78
+          console.log('but', but)
79
+        }
60 80
 
61
-  const Poster = props => {
62 81
     const dataSource = [
63 82
       {
64 83
         name: '员工管理',
@@ -91,23 +110,26 @@ const Edit = props => {
91 110
 
92 111
     return (
93 112
     <>
94
-      <div style={{}}>
113
+      <div >
114
+        {/* { console.log('userMenus', userMenus) }
115
+        { console.log('userBtns', userBtns) } */}
95 116
         {userMenus.map(item => (
96
-          <Card title={<Checkbox>{item.name}</Checkbox>} bordered style={{ width: '100%' }}>
117
+          (item.parentCode === '-1') &&
118
+          <Card title={<Checkbox onChange={handleMenuChange(item)}>{item.name}</Checkbox>} bordered style={{ width: '100%', alignItems: 'center' }} >
97 119
               {
98 120
                    userMenus.map(menu => (
99 121
 
100 122
                     (item.menuId === menu.menuRoot && item.menuId !== menu.menuId) &&
101 123
                     <>
102 124
                       <Card.Grid style={gridStyle1} >
103
-                          <Checkbox>{menu.name}</Checkbox>
125
+                          <Checkbox onChange={handleMenuChange(menu)}>{menu.name}</Checkbox>
104 126
                       </Card.Grid>
105 127
                       <Card.Grid style={gridStyle2}>
106 128
                         {userBtns.map(btn => (
107 129
                           <>
108 130
                             {
109 131
                               btn.menuId === menu.menuId &&
110
-                              <Checkbox>{btn.name}</Checkbox>
132
+                              <Checkbox onChange={handleButChange(btn)}>{btn.name}</Checkbox>
111 133
                             }
112 134
                           </>
113 135
                         ))}
@@ -121,7 +143,7 @@ const Edit = props => {
121 143
     </>
122 144
     )
123 145
   }
124
-
146
+  
125 147
   const fields = [
126 148
     {
127 149
       label: '角色名称',
@@ -144,19 +166,23 @@ const Edit = props => {
144 166
       render:
145 167
         <>
146 168
           <div>
147
-
148
-            <Poster />
169
+            <Poster/>
149 170
           </div>
150 171
         </>,
151 172
     },
152 173
 
153 174
   ]
154
-
155 175
   const handleSubmit = val => {
156 176
     window.console.log('submit data --->', val)
177
+    request({
178
+      url: '/api/admin/menuList',
179
+      method: 'POST',
180
+      params: { ...params },
181
+  // eslint-disable-next-line no-shadow
182
+  }).then(data => {
183
+      console.log(data)
184
+  })
157 185
   }
158 186
   return <XForm onSubmit={handleSubmit} fields={fields}></XForm>
159 187
 }
160
-
161
-
162
-export default connect(({ user }) => ({ user }))(Edit);
188
+export default connect(({ user }) => ({ user }))(add);

+ 86
- 140
src/pages/staff/list/editRole.jsx Целия файл

@@ -1,12 +1,10 @@
1 1
 import React, { useState, useEffect } from 'react';
2
-import { Checkbox, Row, Col, Input, Menu, Dropdown, Button, Icon, message, Table, Tooltip, Tabs, Radio, Divider, Tag, DatePicker, Select, Form, Alert, Card } from 'antd';
3
-import { FormattedMessage } from 'umi-plugin-react/locale';
4
-import styles from '../../style/GoodsList.less';
2
+import { Checkbox, Input, Card } from 'antd';
3
+import { connect } from 'dva';
5 4
 import XForm, { FieldTypes } from '../../../components/XForm';
6
-import Wangedit from '../../../components/Wangedit/Wangedit';
7 5
 import request from '../../../utils/request';
8 6
 import channels from './channelList.less';
9
-import Tagss from '../components/Tagss.jsx';
7
+import { resolve } from 'path';
10 8
 
11 9
 const { TextArea } = Input;
12 10
 
@@ -17,7 +15,11 @@ const { TextArea } = Input;
17 15
  * @param {*} props
18 16
  * @returns
19 17
  */
20
-const Edit = (props) => {
18
+const Edit = props => {
19
+  console.log('props,props', props.user.currentUser)
20
+  const userMenus = props.user.currentUser.menus;
21
+  const userBtns = props.user.currentUser.buttons;
22
+
21 23
   const [data, setData] = useState({ data: [] })
22 24
  // 获取当前所有菜单
23 25
   useEffect(() => {
@@ -36,6 +38,11 @@ const Edit = (props) => {
36 38
       setData(data)
37 39
   })
38 40
   }
41
+
42
+  // function SuBmenu(params) {
43
+  //  return Array.from(userMenus).map(Item =>
44
+  //  <Checkbox value={ Item.menuId }> { Item.name }</Checkbox>)
45
+  // }
39 46
   // const [tab, changeTab] = useState('basic')
40 47
 
41 48
   const Permission = [
@@ -51,80 +58,47 @@ const Edit = (props) => {
51 58
     '首页数据',
52 59
   ]
53 60
 
54
-  // const Basic = (props) => {
55
-
56
-  //   const dataSource = [
57
-
58
-
59
-  //     {
60
-  //       name: '员工管理',
61
-  //       per: [
62
-  //         '111111',
63
-  //         '22222',
64
-  //         '33333',
65
-  //       ]
66
-  //     },
67
-  //     {
68
-  //       name: '角色管理',
69
-  //       per: [
70
-  //         '444',
71
-  //         '555',
72
-  //         '666',
73
-  //       ]
74
-  //     },
75
-  //   ];
76
-
77
-  //   const columns = [
78
-  //     // {
79
-  //     //   title: '商品图片',
80
-  //     //   dataIndex: 'img',
81
-  //     //   key: 'img',
82
-  //     //   align: 'center',
83
-
84
-  //     //   render: (text, record) => <img src={record.img} className={channels.touxiang} />,
85
-  //     // },
86
-  //     {
87
-  //       title: '员工管理',
88
-  //       dataIndex: 'name',
89
-  //       key: 'name',
90
-  //       align: 'left',
91
-  //       render: text => <a>{text}</a>,
92
-  //     },
93
-
94
-  //     {
95
-  //       // title: '操作  ',
96
-  //       dataIndex: 'status',
97
-  //       key: 'per',
98
-  //       align: 'left',
99
-  //       render: () => <>
100
-  //         {/* {pre.map((item,index)=>(
101
-  //       <Checkbox>{item[index]}</Checkbox>
102
-
103
-
104
-  //               ))} */}
105
-  //       </>,
106
-  //     },
107
-  //   ];
108
-  //   return <Table dataSource={dataSource} columns={columns} />
109
-
110
-
61
+  const Poster = props => {
62
+    const [menus, setMenus] = useState([]);
63
+// 判断menus是否有值
64
+    const addMenus = m => setMenus([...menus, m]);
65
+    const delMenus = m => setMenus(menus.filter(x => x.menuId !== m.menuId));
66
+    const handleMenuChange = m => e => {
67
+      console.log('e', m)
68
+      if (e.target.checked) {
69
+        addMenus(m)
70
+      } else {
71
+        delMenus(m)
72
+      }
73
+      console.log('menus', menus)
74
+    }
111 75
 
76
+    const [but, setBut] = useState([]);
77
+    // 判断menus是否有值
78
+        const addBut = m => setBut([...but, m]);
79
+        const delBut = m => setBut(but.filter(x => x.menuId !== m.menuId));
80
+        const handleButChange = m => e => {
81
+          console.log('e', m)
82
+          if (e.target.checked) {
83
+            addBut(m)
84
+          } else {
85
+            delBut(m)
86
+          }
87
+          // console.log('menus', menus)
112 88
 
113
-  // }
114
-  // const [Card] = useState('Poster')
89
+          console.log('menus', menus)
90
+          console.log('but', but)
91
+        }
115 92
 
116
-  const Poster = props => {
117 93
 
118 94
     const dataSource = [
119
-
120
-
121 95
       {
122 96
         name: '员工管理',
123 97
         per: [
124 98
           '111111',
125 99
           '22222',
126 100
           '33333',
127
-        ]
101
+        ],
128 102
       },
129 103
       {
130 104
         name: '角色管理',
@@ -132,7 +106,7 @@ const Edit = (props) => {
132 106
           '444',
133 107
           '555',
134 108
           '666',
135
-        ]
109
+        ],
136 110
       },
137 111
     ];
138 112
 
@@ -144,45 +118,45 @@ const Edit = (props) => {
144 118
     const gridStyle2 = {
145 119
       width: '80%',
146 120
       textAlign: 'left',
121
+      height: '69px',
147 122
     };
148 123
 
149
-{/* <Checkbox>{Permission[index]}</Checkbox> */}
150
-    return <>
124
+    return (
125
+    <>
151 126
       <div style={{}}>
152
-      {Array.from(data).map(Item =>
153
-                <Checkbox value={ Item.menuId }> { Item.name } </Checkbox>,
154
-              )}
155
-        {Permission.map((item, index) => (
156
-          <Card title={<Checkbox>{Permission[index]}</Checkbox>} bordered={true} style={{ width: '100%' }}>
157
-            
158
-              {dataSource.map((items, indexs) => (
159
-              <>
160
-                <Card.Grid style={gridStyle1}><Checkbox>{items.name}</Checkbox></Card.Grid>
161
-                
162
-                <Card.Grid style={gridStyle2}>
163
-                {items.per.map((itemss,indexss) =>(
164
-                  <Checkbox>{items.per[indexss]}</Checkbox>
165
-                ))}
166
-                </Card.Grid>
167
-                </>
168
-            ))}
169
-            
127
+        {/* { console.log('userMenus', userMenus) }
128
+        { console.log('userBtns', userBtns) } */}
129
+        {userMenus.map(item => (
130
+          (item.parentCode === '-1') &&
131
+          <Card title={<Checkbox onChange={handleMenuChange(item)}>{item.name}</Checkbox>} bordered style={{ width: '100%' }}>
132
+              {
133
+                   userMenus.map(menu => (
134
+
135
+                    (item.menuId === menu.menuRoot && item.menuId !== menu.menuId) &&
136
+                    <>
137
+                      <Card.Grid style={gridStyle1} >
138
+                          <Checkbox onChange={handleMenuChange(menu)}>{menu.name}</Checkbox>
139
+                      </Card.Grid>
140
+                      <Card.Grid style={gridStyle2}>
141
+                        {userBtns.map(btn => (
142
+                          <>
143
+                            {
144
+                              btn.menuId === menu.menuId &&
145
+                              <Checkbox onChange={handleButChange(btn)}>{btn.name}</Checkbox>
146
+                            }
147
+                          </>
148
+                        ))}
149
+                      </Card.Grid>
150
+                   </>
151
+                   ))
152
+              }
170 153
           </Card>
171
-
172
-
173
-
174 154
         ))}
175 155
       </div>
176 156
     </>
157
+    )
177 158
   }
178 159
 
179
-  const Share = (props) => {
180
-    return <div>Share</div>
181
-  }
182
-
183
-
184
-
185
-
186 160
   const fields = [
187 161
     {
188 162
       label: '角色名称',
@@ -191,9 +165,6 @@ const Edit = (props) => {
191 165
       // placeholder: '名称',
192 166
       value: ''
193 167
     },
194
-
195
-
196
-
197 168
     {
198 169
       label: '简介',
199 170
       name: 'roleIntroduction',
@@ -208,50 +179,25 @@ const Edit = (props) => {
208 179
       render:
209 180
         <>
210 181
           <div>
211
-
212
-            <Poster />
213
-
214
-            {/* <Radio.Group value={tab} defaultValue="1" buttonStyle="solid">
215
-             
216
-        <Checkbox>Checkbox</Checkbox>
217
-                {Permission.map((item,index)=>(
218
-                  <Radio.Button style={BottonStyle} value="{index}">{Permission[index]}</Radio.Button>
219
-                 
220
-                ))}
221
-            </Radio.Group>
222
-          
223
-          </div>
224
-          <div>
225
-             
226
-          <Table dataSource={Permission[index]} columns={columns} />
227
-           
228
-             */}
182
+            <Poster value="111111" />
229 183
           </div>
230 184
         </>,
231
-
232
-    }
233
-    // {
234
-    //   label: '状态',
235
-    //   name: 'roleState',
236
-    //   render: <Radio.Group>
237
-    //     <Radio.Button style={{background:'#f0f0f0'}} value="a">禁用</Radio.Button>
238
-    //     <Radio.Button style={{background:'#f0f0f0',color:'#ff7e48'}} value="b">启用</Radio.Button>
239
-    //   </Radio.Group>,
240
-    //   value: 'b'
241
-    // },
185
+    },
242 186
 
243 187
   ]
244 188
 
245 189
   const handleSubmit = val => {
246 190
     window.console.log('submit data --->', val)
191
+    request({
192
+      url: '/api/admin/menuList',
193
+      method: 'POST',
194
+      params: { ...params },
195
+  // eslint-disable-next-line no-shadow
196
+  }).then(data => {
197
+      console.log(data)
198
+      setData(data)
199
+  })
247 200
   }
248 201
   return <XForm onSubmit={handleSubmit} fields={fields}></XForm>
249
-
250
-
251
-
252
-
253 202
 }
254
-
255
-
256
-
257
-export default Edit
203
+export default connect(({ user }) => ({ user }))(Edit);