role

config/config.js

@@ -479,7 +479,7 @@ export default {
 
   proxy: {
     '/api/': {
-      target: 'http://localhost:8080/',
+      target: 'http://192.168.0.172:8080/',
       changeOrigin: true,
       // pathRewrite: { '^/server': '' },
     },

src/pages/staff/list/addRole.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { Checkbox, Input, Card, Form, Button } from 'antd';
+import { Checkbox, Input, Card, Form, Button,Row,Col } from 'antd';
 import { connect } from 'dva';
 import XForm, { FieldTypes } from '../../../components/XForm';
 import request from '../../../utils/request';
@@ -16,237 +16,247 @@ const { TextArea } = Input;
  * @param {*} props
  * @returns
  */
-  const Poster = props => {
-    console.log('props,props', props.user.currentUser)
-    const userMenus = props.user.currentUser.menus;
-    const userBtns = props.user.currentUser.buttons;
-
-   // 获取当前所有菜单
-   const [data, setData] = useState({ data: [] })
-   const [buutonDate, setBuutonDate] = useState({ })
-
-   // 展示要显示的菜单和按钮----（编辑）
-   const [dataMenuId, setDataMenuId] = useState([])
-   const [dataButtonId, setDataButtonId] = useState([])
-
-    useEffect(() => {
-      // 新增和编辑用一个页面，判断新增是否为0和null
-      if (props.location.query) {
-        const { id } = props.location.query
-        if (id) {
-          buttonAndMenuList('', id)
-        }
+const Poster = props => {
+  console.log('props,props', props.user.currentUser)
+  const userMenus = props.user.currentUser.menus;
+  const userBtns = props.user.currentUser.buttons;
+
+  // 获取当前所有菜单
+  const [data, setData] = useState({ data: [] })
+  const [buutonDate, setBuutonDate] = useState({})
+
+  // 展示要显示的菜单和按钮----（编辑）
+  const [dataMenuId, setDataMenuId] = useState([])
+  const [dataButtonId, setDataButtonId] = useState([])
+
+  useEffect(() => {
+    // 新增和编辑用一个页面，判断新增是否为0和null
+    if (props.location.query) {
+      const { id } = props.location.query
+      if (id) {
+        buttonAndMenuList('', id)
       }
-      // menuList({ pageNum: 1, pageSize: 100 })
-      buttonList({ pageNum: 1, pageSize: 100 })
-    }, [])
-    // 当前所有的菜单
-    function menuList(params) {
-      request({
-        url: '/api/admin/menuList',
-        method: 'GET',
-        params: { ...params },
-    // eslint-disable-next-line no-shadow
+    }
+    // menuList({ pageNum: 1, pageSize: 100 })
+    buttonList({ pageNum: 1, pageSize: 100 })
+  }, [])
+  // 当前所有的菜单
+  function menuList(params) {
+    request({
+      url: '/api/admin/menuList',
+      method: 'GET',
+      params: { ...params },
+      // eslint-disable-next-line no-shadow
     }).then(data => {
-        setData(data)
+      setData(data)
     })
-    }
-    // 所有按钮
-    function buttonList(params) {
-      request({
-        url: '/api/admin/buttonList',
-        method: 'GET',
-        params: { ...params },
-    // eslint-disable-next-line no-shadow
+  }
+  // 所有按钮
+  function buttonList(params) {
+    request({
+      url: '/api/admin/buttonList',
+      method: 'GET',
+      params: { ...params },
+      // eslint-disable-next-line no-shadow
     }).then(data => {
-        console.log(data)
-        setBuutonDate(data)
+      console.log(data)
+      setBuutonDate(data)
     })
-    }
-    
-    // 根据角色id查询当前的菜单及其按钮
-    function buttonAndMenuList(params, id) {
-      console.log('id: ', id)
-      request({
-        url: `/api/admin/taRole/details/${id}`,
-        method: 'GET',
-        params: { ...params },
-    // eslint-disable-next-line no-shadow
+  }
+
+  // 根据角色id查询当前的菜单及其按钮
+  function buttonAndMenuList(params, id) {
+    console.log('id: ', id)
+    request({
+      url: `/api/admin/taRole/details/${id}`,
+      method: 'GET',
+      params: { ...params },
+      // eslint-disable-next-line no-shadow
     }).then(data => {
       console.log('data.roleName: ', data)
       props.form.setFieldsValue({ roleName: data.roleName })
-        console.log(data)
-        setData(data)
+      console.log(data)
+      setData(data)
 
-        // 获取所有的权限Id
-        setDataMenuId(data.sysMenuList.map(item => item.menuId))
-        setDataButtonId((data.sysMenuList.map(item => item.sysButtonInMenu.map(btn => btn.btnId).join(',')).filter(f => f !== '').join(',').split(',')).map(a => parseInt(a)))
+      // 获取所有的权限Id
+      setDataMenuId(data.sysMenuList.map(item => item.menuId))
+      setDataButtonId((data.sysMenuList.map(item => item.sysButtonInMenu.map(btn => btn.btnId).join(',')).filter(f => f !== '').join(',').split(',')).map(a => parseInt(a)))
     })
-    }
-        // 添加角色
-        function addRole(params) {
-          request({
-            url: '/api/admin/taRole/',
-            method: 'GET',
-            params: { ...params },
-        // eslint-disable-next-line no-shadow
-        }).then(data => {
-            console.log(data)
-            setData(data)
-        })
-        }
+  }
+  // 添加角色
+  function addRole(params) {
+    request({
+      url: '/api/admin/taRole/',
+      method: 'GET',
+      params: { ...params },
+      // eslint-disable-next-line no-shadow
+    }).then(data => {
+      console.log(data)
+      setData(data)
+    })
+  }
 
 
-    // const [menus, setMenus] = useState([]);
-    // 判断menus是否有值
-    const [menus, setMenus] = useState([]);
-    const addMenus = m => {
+  // const [menus, setMenus] = useState([]);
+  // 判断menus是否有值
+  const [menus, setMenus] = useState([]);
+  const addMenus = m => {
     const newMenus = [...menus, m]
-          setMenus([...menus, m])
-    };
-    const delMenus = m => setMenus(menus.filter(x => x.menuId !== m.menuId));
-    const handleMenuChange = m => e => {
-      if (e.target.checked) {
-        setDataMenuId(dataMenuId.concat(m.menuId))
-        addMenus(m)
-      } else {
-        setDataMenuId([m.menuId])
-        delMenus(m)
-      }
-      console.log('dataMenuId', dataMenuId)
-      console.log('menus', menus)
+    setMenus([...menus, m])
+  };
+  const delMenus = m => setMenus(menus.filter(x => x.menuId !== m.menuId));
+  const handleMenuChange = m => e => {
+    if (e.target.checked) {
+      setDataMenuId(dataMenuId.concat(m.menuId))
+      addMenus(m)
+    } else {
+      setDataMenuId([m.menuId])
+      delMenus(m)
     }
+    console.log('dataMenuId', dataMenuId)
+    console.log('menus', menus)
+  }
 
-    const [but, setBut] = useState([]);
-    // 判断menus是否有值
-        const addBut = m => setBut([...but, m]);
-        const delBut = m => setBut(but.filter(x => x.menuId !== m.menuId));
-        const handleButChange = m => e => {
-          console.log('e', m)
-          if (e.target.checked) {
-            addBut(m)
-          } else {
-            delBut(m)
-          }
-        }
-    const gridStyle1 = {
-      width: '17%',
-      textAlign: 'left',
-    };
-    const gridStyle2 = {
-      width: '80%',
-      textAlign: 'left',
-      height: '72px',
-    };
-// 添加菜单
-function addMenuList() {
-  request({
-    url: '/api/admin/updateAuthMenu',
-    method: 'PUT',
-    data: { sysMenu: menus },
-// eslint-disable-next-line no-shadow
-}).then(data => {
-    console.log(data)
-})
-}
+  const [but, setBut] = useState([]);
+  // 判断menus是否有值
+  const addBut = m => setBut([...but, m]);
+  const delBut = m => setBut(but.filter(x => x.menuId !== m.menuId));
+  const handleButChange = m => e => {
+    console.log('e', m)
+    if (e.target.checked) {
+      addBut(m)
+    } else {
+      delBut(m)
+    }
+  }
+  const gridStyle1 = {
+    width: '17%',
+    textAlign: 'left',
+  };
+  const gridStyle2 = {
+    width: '80%',
+    textAlign: 'left',
+    height: '72px',
+  };
+  // 添加菜单
+  function addMenuList() {
+    request({
+      url: '/api/admin/updateAuthMenu',
+      method: 'PUT',
+      data: { sysMenu: menus },
+      // eslint-disable-next-line no-shadow
+    }).then(data => {
+      console.log(data)
+    })
+  }
 
-// 添加按钮
-function addButt() {
-  request({
-    url: '/api/admin/updateAuthMenu',
-    method: 'PUT',
-    data: { sysMenu: but },
-// eslint-disable-next-line no-shadow
-}).then(data => {
-    console.log(data)
-})
-}
+  // 添加按钮
+  function addButt() {
+    request({
+      url: '/api/admin/updateAuthMenu',
+      method: 'PUT',
+      data: { sysMenu: but },
+      // eslint-disable-next-line no-shadow
+    }).then(data => {
+      console.log(data)
+    })
+  }
 
-// 添加按钮
-function editAndAddRole() {
-  request({
-    url: '/admin/editAndAddRole/{id}',
-    method: 'PUT',
-    data: { sysMenu: but },
-// eslint-disable-next-line no-shadow
-}).then(data => {
-    console.log(data)
-})
-}
+  // 添加按钮
+  function editAndAddRole() {
+    request({
+      url: '/admin/editAndAddRole/{id}',
+      method: 'PUT',
+      data: { sysMenu: but },
+      // eslint-disable-next-line no-shadow
+    }).then(data => {
+      console.log(data)
+    })
+  }
 
-function toRoleList(roleId) {
-  router.push({
-    pathname: '/staff/RoleList',
-  });
-}
+  function toRoleList(roleId) {
+    router.push({
+      pathname: '/staff/RoleList',
+    });
+  }
 
-    function handleSubmit (e) {
-      e.preventDefault();
-      props.form.validateFields((err, values) => {
+  function handleSubmit(e) {
+    e.preventDefault();
+    props.form.validateFields((err, values) => {
       console.log('values', values)
-        // 保存菜单
-        // addMenuList()
-        // setm
-        const sumitMenu = [...data.sysMenuList, ...menus]
-        request({
-          url: '/api/admin/updateAuthMenu',
-          method: 'POST',
-          data: { sysMenu: sumitMenu, name: values.roleName, id: props.location.query.id },
-      // eslint-disable-next-line no-shadow
+      // 保存菜单
+      // addMenuList()
+      // setm
+      const sumitMenu = [...data.sysMenuList, ...menus]
+      request({
+        url: '/api/admin/updateAuthMenu',
+        method: 'POST',
+        data: { sysMenu: sumitMenu, name: values.roleName, id: props.location.query.id },
+        // eslint-disable-next-line no-shadow
       }).then(data => {
         toRoleList()
       })
-      });
-    }
-    const { getFieldDecorator } = props.form;
-    return (
+    });
+  }
+  const { getFieldDecorator } = props.form;
+  return (
     <>
       <div >
         <Form labelCol={{ span: 7 }} wrapperCol={{ span: 12 }} onSubmit={handleSubmit}>
-        <Form.Item label="角色名称">
-          {getFieldDecorator('roleName', {
-            rules: [{ required: true, message: '请输入渠道名称' }],
-          })(<Input className={channels.inpuit} />)}
-
-        </Form.Item>
-        {userMenus.map(item => (
-          (item.parentCode === '-1') &&
-          <Card title={<Checkbox checked={ dataMenuId.includes(item.menuId) } onChange={handleMenuChange(item)}>{item.name}</Checkbox>} bordered style={{ width: '100%', alignItems: 'center' }} >
-              {
-                   userMenus.map(menu => (
-
-                    (item.menuId === menu.menuRoot && item.menuId !== menu.menuId) &&
-                    <>
-                      <Card.Grid style={gridStyle1} >
-                          <Checkbox checked={ dataMenuId.includes(menu.menuId) } onChange={handleMenuChange(menu)}>{menu.name}</Checkbox>
-                      </Card.Grid>
-                      <Card.Grid style={gridStyle2}>
-                        {buutonDate.length > 0 && buutonDate.map(btn => (
-                          <>
-                            {
-                              btn.menuId === menu.menuId &&
-                              <Checkbox checked={ dataButtonId.includes(btn.btnId) } onChange={handleButChange(btn)}>{btn.name}</Checkbox>
-                            }
-                          </>
-                        ))}
-                      </Card.Grid>
-                   </>
-                   ))
-              }
-          </Card>
-        ))}
-        <Form.Item wrapperCol={{ span: 15, offset: 7 }}>
-          <Button type="primary" htmlType="submit">
-            保存
+          <Form.Item label="角色名称">
+            {getFieldDecorator('roleName', {
+              rules: [{ required: true, message: '请输入渠道名称' }],
+            })(<Input className={channels.inpuit} />)}
+
+          </Form.Item>
+          {userMenus.map(item => (
+            (item.parentCode === '-1') &&
+            <Row >
+              <Col span={7}>
+
+              </Col>
+              <Col span={17}>
+
+
+                <Card title={<Checkbox checked={dataMenuId.includes(item.menuId)} onChange={handleMenuChange(item)}>{item.name}</Checkbox>} bordered style={{ width: '100%', alignItems: 'center' }} >
+                  {
+                    userMenus.map(menu => (
+
+                      (item.menuId === menu.menuRoot && item.menuId !== menu.menuId) &&
+                      <>
+                        <Card.Grid style={gridStyle1} >
+                          <Checkbox checked={dataMenuId.includes(menu.menuId)} onChange={handleMenuChange(menu)}>{menu.name}</Checkbox>
+                        </Card.Grid>
+                        <Card.Grid style={gridStyle2}>
+                          {buutonDate.length > 0 && buutonDate.map(btn => (
+                            <>
+                              {
+                                btn.menuId === menu.menuId &&
+                                <Checkbox checked={dataButtonId.includes(btn.btnId)} onChange={handleButChange(btn)}>{btn.name}</Checkbox>
+                              }
+                            </>
+                          ))}
+                        </Card.Grid>
+                      </>
+                    ))
+                  }
+                </Card>
+              </Col>
+
+            </Row>
+          ))}
+          <Form.Item wrapperCol={{ span: 15, offset: 7 }} style={{ marginTop: '10px' }}>
+            <Button type="primary" htmlType="submit">
+              保存
           </Button>
-          <Button className={channels.formButton} type="primary" htmlType="submit">
-            取消
+            <Button className={channels.formButton} htmlType="submit">
+              取消
           </Button>
-        </Form.Item>
-      </Form>
+          </Form.Item>
+        </Form>
       </div>
     </>
-    )
-  }
+  )
+}
 const WrappedNormalLoginForm = Form.create({ name: 'Poster' })(Poster);
 export default connect(({ user }) => ({ user }))(WrappedNormalLoginForm);