系统管理还差一个流程设置

public/index.html

@@ -6,7 +6,7 @@
     <meta name="theme-color" content="#000000" />
     <meta name="description" content="Web site created using create-react-app" />
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
-    <!-- <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" /> -->
+    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon" />
 
     <title>义乌市博物馆馆藏管理系统</title>
   </head>

src/pages/Layout/data.ts

@@ -7,19 +7,19 @@ const tabLeftArr: RouterType = [
     name: '工作台',
     son: [
       {
-        id: 100,
+        id: 110,
         name: '数据统计',
         path: '/',
         Com: React.lazy(() => import('../A_workbench/A1dataSta'))
       }
       // {
-      //   id: 101,
+      //   id: 120,
       //   name: '业务中心',
       //   path: '/business',
       //   Com: React.lazy(() => import('../A_workbench/A2business'))
       // },
       // {
-      //   id: 102,
+      //   id: 130,
       //   name: '流程管理',
       //   path: '/flow',
       //   Com: React.lazy(() => import('../A_workbench/A3flow'))
@@ -31,25 +31,25 @@ const tabLeftArr: RouterType = [
   //   name: '入藏管理',
   //   son: [
   //     {
-  //       id: 103,
+  //       id: 210,
   //       name: '藏品征集',
   //       path: '/collect',
   //       Com: React.lazy(() => import('../B_enterTibet/B1collect'))
   //     },
   //     {
-  //       id: 104,
+  //       id: 220,
   //       name: '藏品鉴定',
   //       path: '/identify',
   //       Com: React.lazy(() => import('../B_enterTibet/B2identify'))
   //     },
   //     {
-  //       id: 105,
+  //       id: 230,
   //       name: '藏品入馆',
   //       path: '/entering',
   //       Com: React.lazy(() => import('../B_enterTibet/B3entering'))
   //     },
   //     {
-  //       id: 106,
+  //       id: 240,
   //       name: '藏品入藏',
   //       path: '/enterTibet',
   //       Com: React.lazy(() => import('../B_enterTibet/B4enterTibet'))
@@ -61,49 +61,49 @@ const tabLeftArr: RouterType = [
   //   name: '藏品管理',
   //   son: [
   //     {
-  //       id: 107,
+  //       id: 310,
   //       name: '藏品总账',
   //       path: '/ledger',
   //       Com: React.lazy(() => import('../C_goodsManage/C1ledger'))
   //     },
   //     {
-  //       id: 108,
+  //       id: 320,
   //       name: '藏品附件',
   //       path: '/files',
   //       Com: React.lazy(() => import('../C_goodsManage/C2files'))
   //     },
   //     {
-  //       id: 109,
+  //       id: 330,
   //       name: '藏品关注',
   //       path: '/focus',
   //       Com: React.lazy(() => import('../C_goodsManage/C3focus'))
   //     },
   //     {
-  //       id: 110,
+  //       id: 340,
   //       name: '藏品导入',
   //       path: '/import',
   //       Com: React.lazy(() => import('../C_goodsManage/C4import'))
   //     },
   //     {
-  //       id: 111,
+  //       id: 350,
   //       name: '藏品登记',
   //       path: '/register',
   //       Com: React.lazy(() => import('../C_goodsManage/C5register'))
   //     },
   //     {
-  //       id: 112,
+  //       id: 360,
   //       name: '藏品编辑',
   //       path: '/edit',
   //       Com: React.lazy(() => import('../C_goodsManage/C6edit'))
   //     },
   //     {
-  //       id: 113,
+  //       id: 370,
   //       name: '藏品删除',
   //       path: '/delete',
   //       Com: React.lazy(() => import('../C_goodsManage/C7delete'))
   //     },
   //     {
-  //       id: 114,
+  //       id: 380,
   //       name: '回收站',
   //       path: '/recycleBin',
   //       Com: React.lazy(() => import('../C_goodsManage/C8recycleBin'))
@@ -115,49 +115,49 @@ const tabLeftArr: RouterType = [
     name: '库存管理',
     son: [
       {
-        id: 100,
+        id: 410,
         name: '库房管理',
         path: '/storage',
         Com: React.lazy(() => import('../D_storeManage/D1storage'))
       },
       {
-        id: 101,
+        id: 420,
         name: '库房设置',
         path: '/storSet',
         Com: React.lazy(() => import('../D_storeManage/D2storSet'))
       }
       // {
-      //   id: 103,
+      //   id: 430,
       //   name: '人员出入库',
       //   path: '/staff',
       //   Com: React.lazy(() => import('../D_storeManage/D3staff'))
       // },
       // {
-      //   id: 104,
+      //   id: 440,
       //   name: '入库',
       //   path: '/impStor',
       //   Com: React.lazy(() => import('../D_storeManage/D4impStor'))
       // },
       // {
-      //   id: 105,
+      //   id: 450,
       //   name: '移库',
       //   path: '/moveStor',
       //   Com: React.lazy(() => import('../D_storeManage/D5moveStor'))
       // },
       // {
-      //   id: 106,
+      //   id: 460,
       //   name: '出库',
       //   path: '/putsStor',
       //   Com: React.lazy(() => import('../D_storeManage/D6putsStor'))
       // },
       // {
-      //   id: 107,
+      //   id: 470,
       //   name: '盘点',
       //   path: '/check',
       //   Com: React.lazy(() => import('../D_storeManage/D7check'))
       // },
       // {
-      //   id: 108,
+      //   id: 480,
       //   name: '注销',
       //   path: '/cancel',
       //   Com: React.lazy(() => import('../D_storeManage/D8cancel'))
@@ -169,25 +169,25 @@ const tabLeftArr: RouterType = [
   //   name: '藏品保管',
   //   son: [
   //     {
-  //       id: 100,
+  //       id: 510,
   //       name: '事故登记',
   //       path: '/accident',
   //       Com: React.lazy(() => import('../E_goodsStorage/E1accident'))
   //     },
   //     {
-  //       id: 101,
+  //       id: 520,
   //       name: '残损登记',
   //       path: '/damaged',
   //       Com: React.lazy(() => import('../E_goodsStorage/E2damaged'))
   //     },
   //     {
-  //       id: 102,
+  //       id: 530,
   //       name: '现状登记',
   //       path: '/actuality',
   //       Com: React.lazy(() => import('../E_goodsStorage/E3actuality'))
   //     },
   //     {
-  //       id: 103,
+  //       id: 540,
   //       name: '修复登记',
   //       path: '/repair',
   //       Com: React.lazy(() => import('../E_goodsStorage/E4repair'))
@@ -200,43 +200,45 @@ const tabLeftArr: RouterType = [
     name: '系统管理',
     son: [
       {
-        id: 100,
+        id: 710,
         name: '数据字典',
         path: '/dict',
         Com: React.lazy(() => import('../Z_system/Z1dict'))
       },
       {
-        id: 101,
+        id: 720,
         name: '编号规则',
         path: '/numRule',
         Com: React.lazy(() => import('../Z_system/Z2numRule'))
       },
-      // {
-      //   id: 102,
-      //   name: '流程设置',
-      //   path: '/flowSet',
-      //   Com: React.lazy(() => import('../Z_system/Z3flowSet'))
-      // },
       {
-        id: 103,
+        id: 730,
+        name: '流程设置',
+        path: '/flowSet',
+        Com: React.lazy(() => import('../Z_system/Z3flowSet'))
+      },
+
+      {
+        id: 740,
         name: '组织管理',
         path: '/organization',
         Com: React.lazy(() => import('../Z_system/Z4organization'))
       },
-      // {
-      //   id: 9900,
-      //   name: '角色管理',
-      //   path: '/role',
-      //   Com: React.lazy(() => import('../Z_system/Z5role'))
-      // },
-      // {
-      //   id: 106,
-      //   name: '用户管理',
-      //   path: '/user',
-      //   Com: React.lazy(() => import('../Z_system/Z6user'))
-      // },
       {
-        id: 9901,
+        id: 9900,
+        name: '角色管理',
+        path: '/role',
+        Com: React.lazy(() => import('../Z_system/Z5role'))
+      },
+      {
+        id: 760,
+        name: '用户管理',
+        path: '/user',
+        Com: React.lazy(() => import('../Z_system/Z6user'))
+      },
+
+      {
+        id: 770,
         name: '系统日志',
         path: '/log',
         Com: React.lazy(() => import('../Z_system/Z7log'))

src/pages/Layout/index.tsx

@@ -9,7 +9,7 @@ import history from '@/utils/history'
 import { Button, Form, Input, Modal } from 'antd'
 import { Base64 } from 'js-base64'
 import encodeStr from '@/utils/pass'
-import { passWordEditAPI } from '@/store/action/layout'
+import { API_getRoleArr, passWordEditAPI } from '@/store/action/layout'
 import { getTokenInfo, removeTokenInfo } from '@/utils/storage'
 import { MessageFu } from '@/utils/message'
 import logoImg from '@/assets/img/logo2.png'
@@ -18,6 +18,7 @@ import NotFound from '@/components/NotFound'
 import { RouterType, RouterTypeRow } from '@/types'
 import tabLeftArr, { routerSon } from './data'
 import MyPopconfirm from '@/components/MyPopconfirm'
+import { TypeZ5Role } from '../Z_system/Z5role/type'
 
 function Layout() {
   // 当前路径选中的左侧菜单
@@ -36,60 +37,72 @@ function Layout() {
   const getUserAuthFu = useCallback(async () => {
     const userInfo = getTokenInfo().user
 
-    // 待完善
-    const isOkIdArr: number[] = [
-      100, 101, 102, 103, 104, 105, 106, 107, 108, 109, 110, 111, 112, 113, 114, 115, 116
-    ]
+    // 获取权限
+    const getRoleRes = await API_getRoleArr(userInfo.id)
 
-    // 是管理员
-    if (userInfo.isAdmin === 1) {
-      // 待完善 push角色管理 / 系统日志
-      isOkIdArr.push(9900)
-      isOkIdArr.push(9901)
-    }
+    if (getRoleRes.code === 0) {
+      const getRoleArr: TypeZ5Role[] = getRoleRes.data || []
+
+      const isOkIdArr: number[] = []
 
-    const tempArr: RouterTypeRow = []
+      getRoleArr.forEach(v1 => {
+        if (v1.children) {
+          v1.children.forEach(v2 => {
+            if (v2.authority) isOkIdArr.push(v2.id)
+          })
+        }
+      })
 
-    tabLeftArr.forEach(v1 => {
-      if (v1.son && v1.son[0]) {
-        v1.son.forEach(v2 => {
-          if (isOkIdArr.includes(v2.id)) {
-            tempArr.push(v2)
-          }
-        })
+      // 是管理员
+      if (userInfo.isAdmin === 1) {
+        // push角色管理
+        isOkIdArr.push(9900)
+        // isOkIdArr.push(9901)
       }
-    })
 
-    setRouterCom(tempArr)
+      const tempArr: RouterTypeRow = []
 
-    // 如果当前页面没有权限了，跳转有权限的第一个页面
-    const urlAll = window.location.hash
+      tabLeftArr.forEach(v1 => {
+        if (v1.son && v1.son[0]) {
+          v1.son.forEach(v2 => {
+            if (isOkIdArr.includes(v2.id)) {
+              tempArr.push(v2)
+            }
+          })
+        }
+      })
 
-    const isNowPath = urlAll.replace('#', '')
-    const pathArr = tempArr.map(v => v.path)
+      setRouterCom(tempArr)
 
-    const routerSonArr = routerSon.map(v => v.path)
+      // 如果当前页面没有权限了，跳转有权限的第一个页面
+      const urlAll = window.location.hash
 
-    const lastArr = [...pathArr, ...routerSonArr]
+      const isNowPath = urlAll.replace('#', '')
+      const pathArr = tempArr.map(v => v.path)
 
-    let flagPush = true
+      const routerSonArr = routerSon.map(v => v.path)
 
-    lastArr.forEach(v => {
-      if (v === '/') {
-        if (isNowPath === '/') flagPush = false
-      } else {
-        if (isNowPath.includes(v)) flagPush = false
-      }
-    })
+      const lastArr = [...pathArr, ...routerSonArr]
+
+      let flagPush = true
 
-    if (flagPush) history.push(pathArr[0])
+      lastArr.forEach(v => {
+        if (v === '/') {
+          if (isNowPath === '/') flagPush = false
+        } else {
+          if (isNowPath.includes(v)) flagPush = false
+        }
+      })
 
-    const resList = tabLeftArr.map(v => ({
-      ...v,
-      son: v.son.filter(c => isOkIdArr.includes(c.id))
-    }))
+      if (flagPush) history.push(pathArr[0])
 
-    setList(resList)
+      const resList = tabLeftArr.map(v => ({
+        ...v,
+        son: v.son.filter(c => isOkIdArr.includes(c.id))
+      }))
+
+      setList(resList)
+    }
   }, [])
 
   useEffect(() => {

src/pages/Z_system/Z2numRule/index.tsx

@@ -88,7 +88,7 @@ function Z2numRule() {
       </div>
 
       {editObj.id ? (
-        <Z2edit editObj={editObj} editFu={getListFu} closeFu={() => setEditObj({} as TypeZ2list)} />
+        <Z2edit editObj={editObj} editFu={resetFu} closeFu={() => setEditObj({} as TypeZ2list)} />
       ) : null}
     </div>
   )

src/pages/Z_system/Z5role/Z5edit.tsx

@@ -0,0 +1,218 @@
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import styles from './index.module.scss'
+import { Button, Checkbox, Form, FormInstance, Input, InputNumber, Modal, Radio } from 'antd'
+import TextArea from 'antd/es/input/TextArea'
+import MyPopconfirm from '@/components/MyPopconfirm'
+import { Z5_APIgetAddTreeList, Z5_APIgetInfo, Z5_APIsave } from '@/store/action/Z5role'
+import { TypeZ5Role } from './type'
+import classNmaes from 'classnames'
+import { MessageFu } from '@/utils/message'
+
+type Props = {
+  sId: number
+  closeFu: () => void
+  addTableFu: () => void
+  editTableFu: () => void
+}
+
+function Z5edit({ sId, closeFu, addTableFu, editTableFu }: Props) {
+  // 设置表单ref
+  const FormBoxRef = useRef<FormInstance>(null)
+
+  // 编辑进来获取详情
+  const getInfoFu = useCallback(async (id: number) => {
+    const res = await Z5_APIgetInfo(id)
+    if (res.code === 0) {
+      FormBoxRef.current?.setFieldsValue(res.data.role)
+      setRoleArr(res.data.permission)
+    }
+  }, [])
+
+  // 新增进来获取权限数据
+  const [roleArr, setRoleArr] = useState<TypeZ5Role[]>([])
+  const getAddInfoFu = useCallback(async () => {
+    const res = await Z5_APIgetAddTreeList()
+    if (res.code === 0) {
+      // 新增模块 自己反转所有权限为 false
+
+      const resArr: TypeZ5Role[] = res.data || []
+
+      resArr.forEach(v1 => {
+        if (v1.children) {
+          v1.children.forEach(v2 => {
+            v2.authority = false
+          })
+        }
+      })
+
+      setRoleArr(resArr)
+    }
+  }, [])
+
+  useEffect(() => {
+    if (sId > 0) {
+      getInfoFu(sId)
+    } else {
+      FormBoxRef.current?.setFieldsValue({ sort: 999, dataScope: 2 })
+      getAddInfoFu()
+    }
+  }, [getAddInfoFu, getInfoFu, sId])
+
+  // 多选框变化
+  const onChange = useCallback(
+    (val: boolean, id1: number, id2: number) => {
+      setRoleArr(
+        roleArr.map(v => ({
+          ...v,
+          children:
+            v.id === id1
+              ? v.children.map(c => ({
+                  ...c,
+                  authority: c.id === id2 ? val : c.authority
+                }))
+              : v.children
+        }))
+      )
+    },
+    [roleArr]
+  )
+
+  // 二级选中的数组id集合
+  const checkIds = useMemo(() => {
+    const arr: number[] = []
+    roleArr.forEach(v => {
+      v.children.forEach(c => {
+        if (c.authority) arr.push(c.id)
+      })
+    })
+    return arr
+  }, [roleArr])
+
+  // 没有通过校验
+  const onFinishFailed = useCallback(async () => {
+    // return MessageFu.warning("有表单不符号规则!");
+  }, [])
+
+  // 通过校验点击确定
+  const onFinish = useCallback(
+    async (values: any) => {
+      const obj = {
+        ...values,
+        id: sId > 0 ? sId : null,
+        resources: checkIds
+      }
+
+      const res = await Z5_APIsave(obj)
+
+      if (res.code === 0) {
+        MessageFu.success(sId > 0 ? '编辑成功' : '新增成功')
+        sId > 0 ? editTableFu() : addTableFu()
+        closeFu()
+      }
+    },
+    [addTableFu, checkIds, closeFu, editTableFu, sId]
+  )
+
+  return (
+    <Modal
+      wrapClassName={styles.Z5edit}
+      open={true}
+      title={sId > 0 ? '编辑' : '新增'}
+      footer={
+        [] // 设置footer为空，去掉 取消 确定默认按钮
+      }
+    >
+      <div className='Z5eMain'>
+        <Form
+          scrollToFirstError={true}
+          ref={FormBoxRef}
+          name='basic'
+          labelCol={{ span: 3 }}
+          onFinish={onFinish}
+          onFinishFailed={onFinishFailed}
+          autoComplete='off'
+        >
+          <Form.Item
+            label='角色名称'
+            name='roleName'
+            rules={[{ required: true, message: '请输入角色名称' }]}
+          >
+            <Input maxLength={10} showCount placeholder='请输入内容' />
+          </Form.Item>
+
+          <Form.Item label='角色说明' name='roleDesc'>
+            <TextArea maxLength={100} showCount placeholder='请输入内容' />
+          </Form.Item>
+
+          <div className='fromRow2'>
+            <Form.Item
+              label='排序值'
+              name='sort'
+              rules={[{ required: true, message: '请输入排序值!' }]}
+            >
+              <InputNumber min={1} max={999} precision={0} placeholder='请输入' />
+            </Form.Item>
+            <div className='fromRowTit'>
+              请输入1~999的数字。数字越小，排序越靠前。数字相同时，更新发布的内容排在前面
+            </div>
+          </div>
+
+          <Form.Item label='数据权限' name='dataScope' rules={[{ required: true, message: '' }]}>
+            <Radio.Group>
+              <Radio value={0} className='Z5Rtit'>
+                流程可见权限
+              </Radio>
+              <Radio value={1}>所有流程</Radio>
+              <Radio value={2}>与自己相关流程（发起人、审批人、抄送人）</Radio>
+            </Radio.Group>
+          </Form.Item>
+
+          {/* 确定和取消按钮 */}
+          <br />
+          <Form.Item wrapperCol={{ offset: 9, span: 16 }} className='Z5eBtn'>
+            <Button type='primary' htmlType='submit' disabled={checkIds.length <= 0}>
+              提交
+            </Button>
+            <br />
+            <br />
+            <MyPopconfirm txtK='取消' onConfirm={closeFu} />
+          </Form.Item>
+        </Form>
+
+        <div className='Z5ebox Z5ebox0'>
+          <div className='Z5eboxll'>
+            <span> * </span> 功能权限：
+          </div>
+          <div className='Z5eboxrr'>
+            {roleArr.map(v => (
+              <div key={v.id} className='Z5eRow'>
+                <div className='Z5eRow1'>{v.name}</div>
+                <div className='Z5eRow2'>
+                  {v.children.map(c => (
+                    <Checkbox
+                      disabled={c.name === '角色管理'}
+                      key={c.id}
+                      checked={c.authority}
+                      onChange={e => onChange(e.target.checked, v.id, c.id)}
+                    >
+                      {c.name}
+                      {c.name === '角色管理' ? '(超级管理员才有)' : ''}
+                    </Checkbox>
+                  ))}
+                </div>
+              </div>
+            ))}
+
+            <div className={classNmaes('Z5eErr', checkIds.length <= 0 ? 'Z5eErrAc' : '')}>
+              至少选中一个
+            </div>
+          </div>
+        </div>
+      </div>
+    </Modal>
+  )
+}
+
+const MemoZ5edit = React.memo(Z5edit)
+
+export default MemoZ5edit

src/pages/Z_system/Z5role/index.module.scss

@@ -1,4 +1,130 @@
 .Z5role {
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 24px;
   :global {
+    .Z5top {
+      text-align: right;
+    }
+    .tableBox {
+      border-radius: 10px;
+      overflow: hidden;
+      margin-top: 15px;
+      height: calc(100% - 24px);
+      background-color: #fff;
+    }
+  }
+}
+
+// 新增弹窗页面
+.Z5edit {
+  :global {
+    .ant-modal-close {
+      display: none;
+    }
+
+    .ant-modal {
+      width: 1100px !important;
+    }
+
+    .ant-modal-body {
+      border-top: 1px solid #ccc;
+      .ant-form-item-label {
+        max-width: 100px;
+      }
+    }
+
+    .Z5eMain {
+      width: 900px;
+      position: relative;
+      padding-top: 15px;
+      .fromRow2 {
+        position: relative;
+
+        .fromRowTit {
+          position: absolute;
+          left: 200px;
+          top: 5px;
+          color: #999;
+          font-size: 12px;
+        }
+      }
+      .fromRow {
+        display: flex;
+        align-items: center;
+        margin-bottom: 24px;
+        .fromRowll {
+          width: 94px;
+          text-align: right;
+          position: relative;
+        }
+        .fromRowrr {
+          width: calc(100% - 94px);
+        }
+      }
+      .Z5eBtn {
+        position: absolute;
+        top: 50%;
+        transform: translateY(-50%);
+        right: -95px;
+        margin: 0;
+      }
+      .Z5Rtit {
+        pointer-events: none;
+        margin: 0 30px 0 20px;
+        .ant-radio {
+          display: none;
+        }
+      }
+
+      // 功能权限和数据权限
+      .Z5ebox {
+        display: flex;
+        .Z5eboxll {
+          width: 100px;
+          text-align: right;
+          & > span {
+            color: #ff4d4f;
+          }
+        }
+        .Z5eboxrr {
+          width: calc(100% - 100px);
+          .Z5eRow {
+            margin-bottom: 10px;
+            display: flex;
+
+            .Z5eRow1 {
+              width: 70px;
+              font-weight: 700;
+              text-align: right;
+              margin-right: 10px;
+            }
+
+            .Z5eRow2 {
+              width: calc(100% - 80px);
+            }
+          }
+
+          .Z5eErr {
+            margin-bottom: 20px;
+            text-align: center;
+            color: #ff4d4f;
+            opacity: 0;
+            pointer-events: none;
+            transition: all 0.3s;
+            position: relative;
+            top: -10px;
+          }
+
+          .Z5eErrAc {
+            opacity: 1;
+            top: 0;
+          }
+        }
+      }
+      .Z5ebox0 {
+        margin-top: -24px;
+      }
+    }
   }
 }

src/pages/Z_system/Z5role/index.tsx

@@ -1,10 +1,114 @@
-import React from 'react'
+import React, { useCallback, useEffect, useMemo, useState } from 'react'
 import styles from './index.module.scss'
+import { Button } from 'antd'
+import { useDispatch, useSelector } from 'react-redux'
+import { Z5_APIdel, Z5_APIgetList } from '@/store/action/Z5role'
+import { RootState } from '@/store'
+import { MessageFu } from '@/utils/message'
+import { TypeZ5table } from './type'
+import MyPopconfirm from '@/components/MyPopconfirm'
+import MyTable from '@/components/MyTable'
+import { Z5tableC } from '@/utils/tableData'
+import Z5edit from './Z5edit'
 function Z5role() {
+  const dispatch = useDispatch()
+
+  // 顶部筛选
+  const [fromData, setFromData] = useState({
+    pageNum: 1,
+    pageSize: 10,
+    searchKey: ''
+  })
+
+  // 封装发送请求的函数
+  const getList = useCallback(async () => {
+    dispatch(Z5_APIgetList(fromData))
+  }, [dispatch, fromData])
+
+  useEffect(() => {
+    getList()
+  }, [getList])
+
+  // 从仓库中获取表格数据
+  const tableInfo = useSelector((state: RootState) => state.Z5role.tableInfo)
+
+  // 点击删除
+  const delTableFu = useCallback(
+    async (id: number) => {
+      const res: any = await Z5_APIdel(id)
+      if (res.code === 0) {
+        MessageFu.success('删除成功!')
+        getList()
+      }
+    },
+    [getList]
+  )
+
+  const tableLastBtn = useMemo(() => {
+    return [
+      {
+        title: '操作',
+        width: 200,
+        render: (item: TypeZ5table) => {
+          return item.id === 1 ? (
+            '-'
+          ) : (
+            <>
+              <Button size='small' type='text' onClick={() => setEditId(item.id)}>
+                编辑
+              </Button>
+              <MyPopconfirm txtK='删除' onConfirm={() => delTableFu(item.id)} />
+            </>
+          )
+        }
+      }
+    ]
+  }, [delTableFu])
+
+  // 点击重置
+  const resetSelectFu = useCallback(() => {
+    setFromData({
+      pageNum: 1,
+      pageSize: 10,
+      searchKey: ''
+    })
+  }, [])
+
+  // 点击新增和编辑
+  const [editId, setEditId] = useState(0)
+
   return (
     <div className={styles.Z5role}>
       <div className='pageTitle'>角色管理</div>
-      <p>待开发</p>
+      <div className='Z5top'>
+        <Button type='primary' onClick={() => setEditId(-1)}>
+          新增
+        </Button>
+      </div>
+      {/* 表格主体 */}
+      <div className='tableBox'>
+        <MyTable
+          yHeight={630}
+          list={tableInfo.list}
+          columnsTemp={Z5tableC}
+          lastBtn={tableLastBtn}
+          pageNum={fromData.pageNum}
+          pageSize={fromData.pageSize}
+          total={tableInfo.total}
+          onChange={(pageNum, pageSize) => setFromData({ ...fromData, pageNum, pageSize })}
+          widthSet={{ roleDesc: 800, sort: 100 }}
+        />
+      </div>
+
+      {/* 新增和编辑 */}
+      {editId ? (
+        <Z5edit
+          sId={editId}
+          closeFu={() => setEditId(0)}
+          addTableFu={resetSelectFu}
+          editTableFu={getList}
+        />
+      ) : null}
     </div>
   )
 }

src/pages/Z_system/Z5role/type.d.ts

@@ -0,0 +1,21 @@
+export type TypeZ5table = {
+  count: number
+  createTime: string
+  creatorName: string
+  id: number
+  isEnabled: number
+  roleDesc: string
+  roleKey: string
+  roleName: string
+  sort: string
+  updateTime: string
+}
+
+// 功能权限列表
+export type TypeZ5Role = {
+  authority: boolean
+  children: TypeZ5Role[]
+  id: number
+  name: string
+  resourceType: string
+}

src/pages/Z_system/Z6user/UserAdd/index.module.scss

@@ -4,6 +4,10 @@
       display: none;
     }
 
+    .ant-modal {
+      width: 800px !important;
+    }
+
     .userAddMain {
       border-top: 1px solid #999999;
       padding-top: 15px;
@@ -14,6 +18,17 @@
         font-size: 14px;
         padding-left: 98px;
       }
+
+      .ant-form-item-label {
+        max-width: 98px;
+        min-width: 98px;
+      }
+      .Z6arow {
+        display: flex;
+        .ant-form-item {
+          margin-right: 40px;
+        }
+      }
     }
   }
-}
+}

src/pages/Z_system/Z6user/UserAdd/index.tsx

@@ -1,27 +1,63 @@
-import { SaveUserType } from '@/types'
 import { MessageFu } from '@/utils/message'
-import { Button, Form, FormInstance, Input, Modal } from 'antd'
+import { Button, Cascader, Checkbox, Form, FormInstance, Input, Modal, Select } from 'antd'
 import React, { useCallback, useEffect, useRef } from 'react'
 import styles from './index.module.scss'
 import MyPopconfirm from '@/components/MyPopconfirm'
 import { getUserInfoByIdAPI, userSaveAPI } from '@/store/action/Z6user'
+import { useDispatch, useSelector } from 'react-redux'
+import { RootState } from '@/store'
+import { Z5_APIgetList } from '@/store/action/Z5role'
+import { treeLastIdFindFatherFu } from '../data'
+import { UserTableAPIType } from '@/types'
 
 type Props = {
   id: any
   closePage: () => void
-  upTableList: () => void
+  upTableList: (formOld: UserTableAPIType) => void
   addTableList: () => void
+  formOld: UserTableAPIType
 }
 
-function UserAdd({ id, closePage, upTableList, addTableList }: Props) {
+function UserAdd({ id, closePage, upTableList, addTableList, formOld }: Props) {
+  // 角色
+  const dispatch = useDispatch()
+  useEffect(() => {
+    dispatch(
+      Z5_APIgetList({
+        pageNum: 1,
+        pageSize: 99999,
+        searchKey: ''
+      })
+    )
+  }, [dispatch])
+
+  const { list: roleList } = useSelector((state: RootState) => state.Z5role.tableInfo)
+
+  // 所属部门
+  const { treeData } = useSelector((state: RootState) => state.Z4organization)
+
   // 设置表单初始数据（区分编辑和新增）
   const FormBoxRef = useRef<FormInstance>(null)
 
-  const getInfoInAPIFu = useCallback(async (id: number) => {
-    const res = await getUserInfoByIdAPI(id)
-    FormBoxRef.current?.setFieldsValue(res.data)
-    // console.log("是编辑，在这里发请求拿数据", res);
-  }, [])
+  const getInfoInAPIFu = useCallback(
+    async (id: number) => {
+      if (treeData && treeData.length) {
+        const res = await getUserInfoByIdAPI(id)
+
+        const data = res.data
+
+        const deptId = treeLastIdFindFatherFu(treeData, data.deptId + '', 'id')
+
+        FormBoxRef.current?.setFieldsValue({
+          ...data,
+          deptId
+        })
+      }
+
+      // console.log("是编辑，在这里发请求拿数据", res);
+    },
+    [treeData]
+  )
 
   // 没有通过校验
   const onFinishFailed = useCallback(() => {
@@ -38,25 +74,34 @@ function UserAdd({ id, closePage, upTableList, addTableList }: Props) {
   // 通过校验点击确定
   const onFinish = useCallback(
     async (values: any) => {
-      const obj: SaveUserType = {
+      const obj = {
         ...values,
-        id: id ? id : null,
-        // 角色id写死 2=》普通用户
-        roleId: 2
+        id: id ? id : null
       }
 
+      const deptIdRes = obj.deptId
+      if (deptIdRes) obj.deptId = Number(deptIdRes[deptIdRes.length - 1])
+
+      obj.isLeader = obj.isLeader ? 1 : 0
+
+      // if (1 + 1 === 2) {
+      //   console.log(123, obj)
+
+      //   return
+      // }
+
       const res: any = await userSaveAPI(obj)
 
       if (res.code === 0) {
         MessageFu.success(id ? '编辑成功!' : '新增成功!')
-        if (id) upTableList()
+        if (id) upTableList(formOld)
         else addTableList()
 
         closePage()
       }
       // console.log("通过校验，点击确定");
     },
-    [addTableList, closePage, id, upTableList]
+    [addTableList, closePage, formOld, id, upTableList]
   )
 
   return (
@@ -80,7 +125,7 @@ function UserAdd({ id, closePage, upTableList, addTableList }: Props) {
           autoComplete='off'
         >
           <Form.Item
-            label='账号名'
+            label='登录账号'
             name='userName'
             rules={[
               { required: true, message: '请输入账号名!' },
@@ -104,6 +149,7 @@ function UserAdd({ id, closePage, upTableList, addTableList }: Props) {
             label='手机号'
             name='phone'
             rules={[
+              { required: true, message: '请输入手机号!' },
               {
                 pattern: /^1[3-9][0-9]{9}$/,
                 message: '请输入正确格式的手机号!'
@@ -114,6 +160,45 @@ function UserAdd({ id, closePage, upTableList, addTableList }: Props) {
             <Input maxLength={11} showCount placeholder='请输入11位手机号' />
           </Form.Item>
 
+          <div className='Z6arow'>
+            <Form.Item
+              label='所属部门'
+              name='deptId'
+              rules={[{ required: true, message: '请选择所属部门部门!' }]}
+            >
+              <Cascader
+                allowClear={false}
+                changeOnSelect
+                style={{ width: 240 }}
+                options={treeData}
+                fieldNames={{ label: 'name', value: 'id', children: 'children' }}
+                placeholder='请选择'
+              />
+            </Form.Item>
+
+            <Form.Item
+              label=''
+              name='isLeader'
+              valuePropName='checked'
+              getValueFromEvent={e => (e.target.checked ? 1 : 0)}
+            >
+              <Checkbox>设为主管</Checkbox>
+            </Form.Item>
+          </div>
+
+          <Form.Item
+            label='角色'
+            name='roleId'
+            rules={[{ required: true, message: '请选择角色!' }]}
+          >
+            <Select
+              style={{ width: 240 }}
+              placeholder='请选择'
+              options={roleList.filter(v => v.id !== 1)}
+              fieldNames={{ value: 'id', label: 'roleName' }}
+            />
+          </Form.Item>
+
           {id ? null : <div className='passTit'>* 默认密码 Aa147852</div>}
 
           {/* 确定和取消按钮 */}

src/pages/Z_system/Z6user/Z6auth.tsx

@@ -1,143 +0,0 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react'
-import styles from './index.module.scss'
-import { Button, Checkbox, Modal } from 'antd'
-import MyPopconfirm from '@/components/MyPopconfirm'
-import { Z6_APIgetAuthByUserId, Z6_APIsetAuth } from '@/store/action/Z6user'
-import classNmaes from 'classnames'
-import { MessageFu } from '@/utils/message'
-
-export type UserListType = {
-  id: number
-  name: string
-  children: {
-    id: number
-    name: string
-    authority: boolean
-  }[]
-}
-
-type Props = {
-  authInfo: { id: number; name: string }
-  closeFu: () => void
-}
-
-function Z6auth({ authInfo, closeFu }: Props) {
-  const getAuthByUserIdFu = useCallback(async () => {
-    const res = await Z6_APIgetAuthByUserId(authInfo.id)
-
-    if (res.code === 0) {
-      // 这里后台返回的一层的数据。懒得改逻辑，手动修改成2级的数据
-
-      setList([
-        {
-          id: Date.now(),
-          name: '',
-          children: res.data
-        }
-      ])
-
-      // setList(res.data)
-    }
-  }, [authInfo.id])
-
-  useEffect(() => {
-    getAuthByUserIdFu()
-  }, [getAuthByUserIdFu])
-
-  const [list, setList] = useState<UserListType[]>([])
-
-  // 多选框变化
-  const onChange = useCallback(
-    (val: boolean, id1: number, id2: number) => {
-      setList(
-        list.map(v => ({
-          ...v,
-          children:
-            v.id === id1
-              ? v.children.map(c => ({
-                  ...c,
-                  authority: c.id === id2 ? val : c.authority
-                }))
-              : v.children
-        }))
-      )
-    },
-    [list]
-  )
-
-  // 二级选中的数组id集合
-  const checkIds = useMemo(() => {
-    const arr: number[] = []
-    list.forEach(v => {
-      if (v.children) {
-        v.children.forEach(c => {
-          if (c.authority) arr.push(c.id)
-        })
-      }
-    })
-    return arr
-  }, [list])
-
-  // 点击确定
-  const btnOkFu = useCallback(async () => {
-    const obj = {
-      userId: authInfo.id,
-      resources: checkIds
-    }
-
-    const res = await Z6_APIsetAuth(obj)
-
-    if (res.code === 0) {
-      MessageFu.success('授权成功!')
-      closeFu()
-    }
-  }, [authInfo.id, checkIds, closeFu])
-
-  return (
-    <Modal
-      wrapClassName={styles.Z6auth}
-      open={true}
-      title={`${authInfo.name} - 权限管理`}
-      footer={
-        [] // 设置footer为空，去掉 取消 确定默认按钮
-      }
-    >
-      <div className='Z6aEmain'>
-        {list.map(v => (
-          <div key={v.id} className='Z6aRow'>
-            {/* 隐藏一级数据 */}
-            {/* <div className="Z6aRow1">{v.name}</div> */}
-            <div className='Z6aRow2'>
-              {v.children.map(c => (
-                <div key={c.id}>
-                  <Checkbox
-                    checked={c.authority}
-                    onChange={e => onChange(e.target.checked, v.id, c.id)}
-                  >
-                    {c.name}
-                  </Checkbox>
-                </div>
-              ))}
-            </div>
-          </div>
-        ))}
-
-        <div className={classNmaes('Z6aErr', checkIds.length <= 0 ? 'Z6aErrAc' : '')}>
-          至少选中一个
-        </div>
-
-        <div className='Z6aEbtn'>
-          <Button type='primary' onClick={btnOkFu} disabled={checkIds.length <= 0}>
-            提交
-          </Button>
-          &emsp;
-          <MyPopconfirm txtK='取消' onConfirm={closeFu} />
-        </div>
-      </div>
-    </Modal>
-  )
-}
-
-const MemoZ6auth = React.memo(Z6auth)
-
-export default MemoZ6auth

src/pages/Z_system/Z6user/data.ts

@@ -0,0 +1,34 @@
+import { TypeZ4Tree } from '../Z4organization/type'
+
+// 树结构 通过最后一级id得到前面的id或者名称
+
+export function treeLastIdFindFatherFu(
+  tree: TypeZ4Tree[],
+  targetId: string,
+  returnType: 'id' | 'name'
+): string[] {
+  let pathNodes: TypeZ4Tree[] = []
+
+  // 递归遍历函数
+  const traverse = (nodes: TypeZ4Tree[], currentPath: TypeZ4Tree[]): boolean => {
+    for (const node of nodes) {
+      const newPath = [...currentPath, node]
+
+      if (node.id === targetId) {
+        pathNodes = newPath
+        return true
+      }
+
+      if (node.children?.length) {
+        const found = traverse(node.children, newPath)
+        if (found) return true
+      }
+    }
+    return false
+  }
+
+  traverse(tree, [])
+
+  // 根据返回类型转换结果
+  return returnType === 'id' ? pathNodes.map(n => n.id) : pathNodes.map(n => n.name)
+}

src/pages/Z_system/Z6user/index.module.scss

@@ -6,6 +6,10 @@
       background-color: #fff;
       display: flex;
       justify-content: space-between;
+      // 级联选择器的 placeholder
+      .ant-select-selection-placeholder {
+        color: black;
+      }
     }
 
     .tableBox {

src/pages/Z_system/Z6user/index.tsx

@@ -1,7 +1,7 @@
 import { RootState } from '@/store'
 import { UserTableAPIType, UserTableListType } from '@/types'
 import { MessageFu } from '@/utils/message'
-import { Input, Button } from 'antd'
+import { Input, Button, Cascader } from 'antd'
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 import styles from './index.module.scss'
@@ -10,69 +10,116 @@ import MyTable from '@/components/MyTable'
 import { Z6tableC } from '@/utils/tableData'
 import MyPopconfirm from '@/components/MyPopconfirm'
 import { getUserListAPI, userPassResetAPI, userRemoveAPI } from '@/store/action/Z6user'
-import Z6auth from './Z6auth'
+import { D4_APIgetTree } from '@/store/action/Z4organization'
+import { treeLastIdFindFatherFu } from './data'
+
+const baseFormData: UserTableAPIType = {
+  pageNum: 1,
+  pageSize: 10,
+  searchKey: '',
+  deptId: undefined
+}
 
 function Z6user() {
   const dispatch = useDispatch()
 
+  // 获取组织管理列表
+  useEffect(() => {
+    dispatch(D4_APIgetTree())
+  }, [dispatch])
+
+  const { treeData } = useSelector((state: RootState) => state.Z4organization)
+
   // 顶部筛选
-  const [fromData, setFromData] = useState<UserTableAPIType>({
-    pageNum: 1,
-    pageSize: 10,
-    searchKey: ''
-  })
+  const [formData, setFormData] = useState(baseFormData)
+  const formDataRef = useRef(baseFormData)
+  const formDataOldRef = useRef(baseFormData)
+
+  useEffect(() => {
+    formDataRef.current = formData
+  }, [formData])
+
+  // 点击搜索的 时间戳
+  const [timeKey, setTimeKey] = useState(0)
+
+  // 点击搜索
+  const clickSearch = useCallback(() => {
+    setFormData({ ...formData, pageNum: 1 })
+    setTimeout(() => {
+      setTimeKey(Date.now())
+    }, 50)
+  }, [formData])
 
   // 封装发送请求的函数
+  const getListFu = useCallback(
+    (formOld?: UserTableAPIType) => {
+      if (formOld) setFormData({ ...formOld })
+
+      const obj = formOld
+        ? { ...formOld }
+        : {
+            ...formDataRef.current
+          }
+
+      formDataOldRef.current = { ...formDataRef.current }
+
+      let deptIdRes = obj.deptId
 
-  const getList = useCallback(async () => {
-    dispatch(getUserListAPI(fromData))
-  }, [dispatch, fromData])
+      if (deptIdRes) obj.deptId = Number(deptIdRes[deptIdRes.length - 1])
+
+      dispatch(getUserListAPI(obj))
+    },
+    [dispatch]
+  )
 
   useEffect(() => {
-    getList()
-  }, [getList])
+    getListFu()
+  }, [getListFu, timeKey])
 
-  const timeRef = useRef(-1)
-  // 用户名
+  // 输入框的改变
   const txtChangeFu = useCallback(
-    (e: React.ChangeEvent<HTMLInputElement>, key: 'searchKey') => {
-      clearTimeout(timeRef.current)
-      timeRef.current = window.setTimeout(() => {
-        setFromData({
-          ...fromData,
-          [key]: e.target.value,
-          pageNum: 1
-        })
-      }, 500)
+    (txt: string, key: 'searchKey') => {
+      setFormData({
+        ...formData,
+        [key]: txt
+      })
     },
-    [fromData]
+    [formData]
   )
 
   // 点击重置
-  const [inputKey, setInputKey] = useState(1)
   const resetSelectFu = useCallback(() => {
     // 把2个输入框和时间选择器清空
-    setInputKey(Date.now())
-    setFromData({
-      pageNum: 1,
-      pageSize: 10,
-      searchKey: ''
-    })
+    setFormData(baseFormData)
+    setTimeout(() => {
+      setTimeKey(Date.now())
+    }, 50)
   }, [])
 
   // 从仓库中获取表格数据
   const tableInfo = useSelector((state: RootState) => state.Z6user.tableInfo)
 
+  // 页码变化
+  const paginationChange = useCallback(
+    (pageNum: number, pageSize: number) => {
+      setFormData({ ...formData, pageNum, pageSize })
+      setTimeout(() => {
+        setTimeKey(Date.now())
+      }, 50)
+    },
+    [formData]
+  )
+
   // 点击删除
   const delTableFu = useCallback(
     async (id: number) => {
       const res: any = await userRemoveAPI(id)
       if (res.code === 0) {
         MessageFu.success('删除成功!')
-        getList()
+        getListFu()
       }
     },
-    [getList]
+    [getListFu]
   )
 
   // 点击重置密码
@@ -85,15 +132,10 @@ function Z6user() {
   const [editPageShow, setEditPageShow] = useState(false)
   const editId = useRef(0)
 
-  const openEditPageFu = useCallback(
-    (id: number) => {
-      if (id === 0 && tableInfo.list.length >= 20) return MessageFu.warning('最多支持20个用户！')
-
-      editId.current = id
-      setEditPageShow(true)
-    },
-    [tableInfo.list.length]
-  )
+  const openEditPageFu = useCallback((id: number) => {
+    editId.current = id
+    setEditPageShow(true)
+  }, [])
 
   const tableLastBtn = useMemo(() => {
     return [
@@ -113,15 +155,6 @@ function Z6user() {
                   </Button>
                 }
               />
-              {/* <Button
-                size="small"
-                type="text"
-                onClick={() =>
-                  setAuthInfo({ id: item.id, name: item.userName })
-                }
-              >
-                权限管理
-              </Button> */}
               <Button size='small' type='text' onClick={() => openEditPageFu(item.id)}>
                 编辑
               </Button>
@@ -133,8 +166,16 @@ function Z6user() {
     ]
   }, [delTableFu, openEditPageFu, resetPassFu])
 
-  // 授权管理
-  const [authInfo, setAuthInfo] = useState({ id: 0, name: '' })
+  // 处理所属部门数据
+  const resList = useMemo(() => {
+    let arr = tableInfo.list.map((v: any) => ({
+      ...v,
+      deptNameRes: v.deptId
+        ? treeLastIdFindFatherFu(treeData, v.deptId + '', 'name').join(' / ')
+        : '-'
+    }))
+    return arr
+  }, [tableInfo.list, treeData])
 
   return (
     <div className={styles.Z6user}>
@@ -144,28 +185,41 @@ function Z6user() {
           <div className='selectBoxRow'>
             <span>搜索项：</span>
             <Input
-              key={inputKey}
-              maxLength={10}
+              maxLength={15}
               showCount
               style={{ width: 300 }}
-              placeholder='请输入用户名'
-              allowClear
-              onChange={e => txtChangeFu(e, 'searchKey')}
+              placeholder='请输入用户名或真实姓名'
+              value={formData.searchKey}
+              onChange={e => txtChangeFu(e.target.value, 'searchKey')}
+            />
+            &emsp;&emsp;
+            <span>选择部门：</span>
+            <Cascader
+              allowClear={false}
+              changeOnSelect
+              style={{ width: 240 }}
+              options={treeData}
+              value={formData.deptId as string[]}
+              fieldNames={{ label: 'name', value: 'id', children: 'children' }}
+              placeholder='全部'
+              onChange={e =>
+                setFormData({
+                  ...formData,
+                  deptId: e as string[]
+                })
+              }
             />
           </div>
 
           <div className='selectBoxRow'>
-            &emsp;&emsp;<Button onClick={resetSelectFu}>重置</Button>
-            &emsp;&emsp;
-            <Button
-              type='primary'
-              onClick={() => {
-                if (tableInfo.total >= 30) return MessageFu.warning('最多30个账号!')
-                openEditPageFu(0)
-              }}
-            >
+            <Button type='primary' onClick={() => openEditPageFu(0)}>
               新增
             </Button>
+            &emsp;
+            <Button type='primary' onClick={clickSearch}>
+              查询
+            </Button>
+            &emsp;<Button onClick={resetSelectFu}>重置</Button>
           </div>
         </div>
       </div>
@@ -173,13 +227,13 @@ function Z6user() {
       <div className='tableBox'>
         <MyTable
           yHeight={630}
-          list={tableInfo.list}
+          list={resList}
           columnsTemp={Z6tableC}
           lastBtn={tableLastBtn}
-          pageNum={fromData.pageNum}
-          pageSize={fromData.pageSize}
+          pageNum={formData.pageNum}
+          pageSize={formData.pageSize}
           total={tableInfo.total}
-          onChange={(pageNum, pageSize) => setFromData({ ...fromData, pageNum, pageSize })}
+          onChange={(pageNum, pageSize) => paginationChange(pageNum, pageSize)}
         />
       </div>
 
@@ -188,15 +242,11 @@ function Z6user() {
         <UserAdd
           id={editId.current}
           closePage={() => setEditPageShow(false)}
-          upTableList={getList}
+          upTableList={formOld => getListFu(formOld)}
           addTableList={resetSelectFu}
+          formOld={formDataOldRef.current}
         />
       ) : null}
-
-      {/* 点击授权 */}
-      {authInfo.id ? (
-        <Z6auth authInfo={authInfo} closeFu={() => setAuthInfo({ id: 0, name: '' })} />
-      ) : null}
     </div>
   )
 }

src/store/action/Z5role.ts

@@ -0,0 +1,46 @@
+import http from '@/utils/http'
+import { AppDispatch } from '..'
+/**
+ * 角色管理 -获取分页列表
+ */
+export const Z5_APIgetList = (data: any): any => {
+  return async (dispatch: AppDispatch) => {
+    const res = await http.post('sys/role/listCountPage', data)
+    if (res.code === 0) {
+      const obj = {
+        list: res.data.records,
+        total: res.data.total
+      }
+
+      dispatch({ type: 'Z5/getList', payload: obj })
+    }
+  }
+}
+
+/**
+ * 角色管理 -删除
+ */
+export const Z5_APIdel = (id: number) => {
+  return http.get(`sys/role/remove/${id}`)
+}
+
+/**
+ * 角色管理 -新增--获取权限列表
+ */
+export const Z5_APIgetAddTreeList = () => {
+  return http.get('sys/resource/getTreeResource')
+}
+
+/**
+ * 角色管理 -新增/编辑
+ */
+export const Z5_APIsave = (data: any) => {
+  return http.post('sys/role/save', data)
+}
+
+/**
+ * 角色管理 -获取详情
+ */
+export const Z5_APIgetInfo = (id: number) => {
+  return http.get(`sys/role/detail/${id}`)
+}

src/store/action/Z6user.ts

@@ -1,10 +1,10 @@
 import http from '@/utils/http'
 import { AppDispatch } from '..'
-import { SaveUserType, UserTableAPIType } from '@/types'
+import { SaveUserType } from '@/types'
 /**
  * 获取用户管理表格列表
  */
-export const getUserListAPI = (data: UserTableAPIType): any => {
+export const getUserListAPI = (data: any): any => {
   return async (dispatch: AppDispatch) => {
     const res = await http.post('sys/user/list', data)
     if (res.code === 0) {
@@ -47,20 +47,6 @@ export const getUserInfoByIdAPI = (id: number) => {
 }
 
 /**
- * 角色授权-获取
- */
-export const Z6_APIgetAuthByUserId = (userId: number) => {
-  return http.get(`sys/user/perm/getUserTree/${userId}`)
-}
-
-/**
- * 角色授权-设置
- */
-export const Z6_APIsetAuth = (data: any) => {
-  return http.post('sys/user/perm/auth', data)
-}
-
-/**
  * 角色授权-获取 初始页面获取
  */
 export const Z6_APIgetAuthBase = () => {

src/store/action/layout.ts

@@ -47,3 +47,10 @@ export const API_upFile = (data: any, url: string) => {
     })
   })
 }
+
+/**
+ * 获取用户权限管理
+ */
+export const API_getRoleArr = (userId: number) => {
+  return http.get(`sys/user/perm/getUserTree/${userId}`)
+}

src/store/reducer/Z5role.ts

@@ -0,0 +1,28 @@
+import { TypeZ5table } from '@/pages/Z_system/Z5role/type'
+
+// 初始化状态
+const initState = {
+  // 列表数据
+  tableInfo: {
+    list: [] as TypeZ5table[],
+    total: 0
+  }
+}
+
+// 定义 action 类型
+type Props = {
+  type: 'Z5/getList'
+  payload: { list: TypeZ5table[]; total: number }
+}
+
+// reducer
+export default function userReducer(state = initState, action: Props) {
+  switch (action.type) {
+    // 获取列表数据
+    case 'Z5/getList':
+      return { ...state, tableInfo: action.payload }
+
+    default:
+      return state
+  }
+}

src/store/reducer/index.ts

@@ -7,6 +7,7 @@ import D2storSet from './D2storSet'
 import Z1dict from './Z1dict'
 import Z2numRule from './Z2numRule'
 import Z4organization from './Z4organization'
+import Z5role from './Z5role'
 import Z6user from './Z6user'
 import Z7log from './Z7log'
 
@@ -17,6 +18,7 @@ const rootReducer = combineReducers({
   Z1dict,
   Z2numRule,
   Z4organization,
+  Z5role,
   Z6user,
   Z7log
 })

src/types/api/Z6user.d.ts

@@ -1,31 +1,34 @@
-export type UserTableAPIType={
-  pageNum:number
-  pageSize:number
-  searchKey:string
+export type UserTableAPIType = {
+  pageNum: number
+  pageSize: number
+  searchKey: string
+  deptId: any
 }
 
-export type UserTableListType={
-  createTime: string;
-  creatorId: null;
-  creatorName: string;
-  id: number;
-  isAdmin: number;
-  isEnabled: number;
-  nickName: string;
-  phone: string;
-  realName: string;
-  roleId: null;
-  roleName: string;
-  sex: string;
-  thumb: string;
-  updateTime: string;
-  userName: string;
+export type UserTableListType = {
+  createTime: string
+  creatorId: null
+  creatorName: string
+  id: number
+  isAdmin: number
+  isEnabled: number
+  nickName: string
+  phone: string
+  realName: string
+  roleId: null
+  roleName: string
+  sex: string
+  thumb: string
+  updateTime: string
+  userName: string
+  deptName: string
+  deptNameRes: string
 }
 
-export type SaveUserType ={
-  id:number|null
-  userName:string
-  nickName:string
-  roleId:number
-  realName:string
-}
+export type SaveUserType = {
+  id: number | null
+  userName: string
+  nickName: string
+  roleId: number
+  realName: string
+}

src/utils/tableData.ts

@@ -37,11 +37,17 @@ export const Z2tableC = [
   ['txt', '起始流水编号', 'length']
 ]
 
+export const Z5tableC = [
+  ['txt', '角色名称', 'roleName'],
+  ['text', '角色说明', 'roleDesc', 50],
+  ['txt', '排序值', 'sort']
+]
+
 export const Z6tableC = [
-  ['txt', '用户名', 'userName'],
-  ['txtChange', '角色', 'isAdmin', { 1: '管理员', 0: '普通成员' }],
+  ['txt', '登录账号', 'userName'],
+  ['txt', '所属部门', 'deptNameRes'],
+  ['txt', '角色', 'roleName'],
   ['txt', '真实姓名', 'realName'],
-  ['txt', '手机号', 'phone'],
   ['txt', '创建日期', 'createTime']
 ]