Browse Source

feat: ConnectModal重构

lanjianrong 4 years ago
parent
commit
46f01b85ae

+ 0 - 5
config/proxy.ts

@@ -11,11 +11,6 @@ export default {
       target: 'http://cld2qa.management.com/',
       target: 'http://cld2qa.management.com/',
       changeOrigin: true,
       changeOrigin: true,
       pathRewrite: { '^': '' }
       pathRewrite: { '^': '' }
-    },
-    '/api/': {
-      target: 'http://cld2qa.management.com/',
-      changeOrigin: true,
-      pathRewrite: { '^': '' }
     }
     }
   },
   },
   test: {
   test: {

+ 2 - 2
config/routes.ts

@@ -60,8 +60,8 @@
       {
       {
         path: '/business/attendance',
         path: '/business/attendance',
         name: 'attendance',
         name: 'attendance',
-        component: './Business/Attendance',
-        access: 'authRouteFilter'
+        component: './business/Attendance'
+        // access: 'authRouteFilter'
       },
       },
       {
       {
         path: '/business/contact',
         path: '/business/contact',

+ 0 - 155
src/pages/Business/Attendance/components/ConnectModal/index.tsx

@@ -1,155 +0,0 @@
-import { useRequest } from 'umi'
-import { Input, message, Modal } from 'antd'
-import type { PropsWithChildren } from 'react'
-import React, { useState, useRef, useEffect } from 'react'
-import { fetchStaffList } from '@/services/user/api'
-import { linkAttendance, addAttendance } from '@/services/user/system'
-import '@/pages/Role/System/components/ConnectModal/index.less'
-import { LoadingOutlined, MoreOutlined } from '@ant-design/icons'
-import { modalType } from '@/pages/Business/Attendance/index.tsx'
-
-interface ConnectModalProps extends PropsWithChildren {
-  dataId: string
-  visible: boolean
-  onCancel: () => void
-  onRefresh: () => void
-}
-const ConnectModal: React.FC<ConnectModalProps> = ({
-  type,
-  dataId,
-  visible,
-  onCancel,
-  onRefresh,
-  children
-}) => {
-  const containerRef = useRef<HTMLDivElement>(null)
-  const [searchVal, setSearchVal] = useState('')
-
-  const {
-    run: tryQueryStaffList,
-    data,
-    noMore,
-    loadMore,
-    loadingMore
-  } = useRequest(
-    result =>
-      fetchStaffList({
-        current: result?.list.length / 10 + 1 || 1,
-        pageSize: 10,
-        search: searchVal
-      }),
-    {
-      manual: true,
-      loadMore: true,
-      ref: containerRef,
-      isNoMore: (res: API.BasicFetchResult<API.StaffItem>) => res.list.length >= res.total,
-      refreshDeps: [searchVal]
-    }
-  )
-
-  const { run: tryLinkAttendance } = useRequest(
-    (params: API.LinkAttendance) => linkAttendance(params),
-    {
-      manual: true,
-      onSuccess: () => {
-        message.success('添加申请对象成功')
-        onCancel()
-        onRefresh()
-      },
-      onError: e => {
-        message.error(e.message)
-      }
-    }
-  )
-  const { run: tryAddAttendance } = useRequest(
-    (params: API.Addattendance) => addAttendance(params),
-    {
-      manual: true,
-      onSuccess: () => {
-        message.success('添加申请人成功')
-        onCancel()
-        onRefresh()
-      },
-      onError: e => {
-        message.error(e.message)
-      }
-    }
-  )
-
-  const connectHandler = (staffId: string) => {
-    if (type === modalType.addobjectModal) {
-      tryAddAttendance({ applicantStaffId: staffId })
-    } else {
-      tryLinkAttendance({ id: dataId, staffId })
-    }
-  }
-  const handleSearch = (value: string) => {
-    setSearchVal(value)
-    setTimeout(() => {
-      tryQueryStaffList()
-    }, 250)
-  }
-
-  const { list = [] }: { list: API.StaffItem[] } = data || {}
-  useEffect(() => {
-    if (visible) {
-      tryQueryStaffList()
-    }
-  }, [visible])
-
-  // const itemSelectHandler = (staffId: string) => {
-  //   if (type === addType.addobjectModal) {
-
-  //   } else {
-
-  //   }
-  // }
-  return (
-    <>
-      {children}
-      <Modal
-        visible={visible}
-        onCancel={onCancel}
-        getContainer={false}
-        width="60vw"
-        title={
-          <Input.Search
-            placeholder="搜索员工(姓名)"
-            onSearch={value => handleSearch(value)}
-            onPressEnter={e => handleSearch(e.currentTarget.value)}
-            style={{ width: '95%' }}
-            allowClear={true}></Input.Search>
-        }>
-        <div ref={containerRef} className="h-60vh overflow-y-auto overflow-x-hidden modal-content">
-          {list.map(item => (
-            <div className="card" key={item.id}>
-              <div className="w-4/3 flex justify-between">
-                <span className="w-1/5">{item.username}</span>
-                <span className="w-2/5">{item.phone}</span>
-                <span className="w-1/5">{item.position}</span>
-                <span className="w-1/5">{item.category}</span>
-              </div>
-              <div className="w-1/4 flex justify-end">
-                <span className="btn-outline" onClick={() => connectHandler(item.id)}>
-                  选择ta
-                </span>
-              </div>
-            </div>
-          ))}
-          {noMore && <div className="text-center text-gray-400">已到底部</div>}
-          {!noMore && (
-            <div className="text-center mt-3 cursor-pointer">
-              {loadingMore ? (
-                <LoadingOutlined />
-              ) : (
-                <MoreOutlined rotate={90} style={{ fontSize: 24 }} onClick={loadMore} />
-              )}
-            </div>
-          )}
-        </div>
-      </Modal>
-    </>
-  )
-}
-
-export default ConnectModal

+ 3 - 3
src/pages/Business/Attendance/components/AttendanceMenu/index.tsx

@@ -1,10 +1,10 @@
 import React from 'react'
 import React from 'react'
 import '@/pages/Role/System/components/RoleMenu/index.less'
 import '@/pages/Role/System/components/RoleMenu/index.less'
 
 
-interface AttendanceMenuProps {
+interface ShowTitleMenuProps {
   itemTitle: string
   itemTitle: string
 }
 }
-const AttendanceMenu: React.FC<AttendanceMenuProps> = ({ itemTitle }) => {
+const showTitleMenu: React.FC<ShowTitleMenuProps> = ({ itemTitle }) => {
   return (
   return (
     <div className="h-full w-max-234px rounded-4px roleMenu">
     <div className="h-full w-max-234px rounded-4px roleMenu">
       <div className="p-4 border-b-1 border-solid border-black border-opacity-10 bg-[#f7f9fa] justify-around text-left">
       <div className="p-4 border-b-1 border-solid border-black border-opacity-10 bg-[#f7f9fa] justify-around text-left">
@@ -24,4 +24,4 @@ const AttendanceMenu: React.FC<AttendanceMenuProps> = ({ itemTitle }) => {
   )
   )
 }
 }
 
 
-export default AttendanceMenu
+export default showTitleMenu

+ 18 - 22
src/pages/Business/Attendance/index.tsx

@@ -1,16 +1,16 @@
-import React, { useState, useEffect } from 'react'
-import AttendanceMenu from './components/AttendanceMenu'
+import React, { useState } from 'react'
+import ShowTitleMenu from './components/ShowTitleMenu'
 import { useRequest } from 'umi'
 import { useRequest } from 'umi'
 import { Plus, Delete } from '@icon-park/react'
 import { Plus, Delete } from '@icon-park/react'
-import ConnectModal from './components/ConnectModal'
 import { Table, Tag, Popconfirm, Popover, Button } from 'antd'
 import { Table, Tag, Popconfirm, Popover, Button } from 'antd'
 import { fetchAttendanceList, unlinkAttendance, deleteAttendance } from '@/services/user/system'
 import { fetchAttendanceList, unlinkAttendance, deleteAttendance } from '@/services/user/system'
+import ConnectModal from '@/pages/role/System/components/ConnectModal'
 
 
 export enum modalType {
 export enum modalType {
   addobjectModal = 0,
   addobjectModal = 0,
   linkAttendance = 1
   linkAttendance = 1
 }
 }
-const Attendance = () => {
+const Attendance: React.FC = () => {
   const [state, setState] = useState({
   const [state, setState] = useState({
     id: '',
     id: '',
     modalId: '',
     modalId: '',
@@ -21,6 +21,8 @@ const Attendance = () => {
 
 
   const { run: tryGetRoleStaffList } = useRequest(fetchAttendanceList, {
   const { run: tryGetRoleStaffList } = useRequest(fetchAttendanceList, {
     onSuccess: result => {
     onSuccess: result => {
+      console.log('result', result)
+
       setState({ ...state, attendanceList: result })
       setState({ ...state, attendanceList: result })
     }
     }
   })
   })
@@ -49,15 +51,6 @@ const Attendance = () => {
     }
     }
   )
   )
 
 
-  useEffect(() => {
-    if (state.id) {
-      tryGetRoleStaffList(state.id)
-    }
-    return () => {
-      // formRef.current?.resetFields()
-    }
-  }, [state.id])
-
   const columns: ColumnsType<API.AttendanceItem> = [
   const columns: ColumnsType<API.AttendanceItem> = [
     {
     {
       title: '申请人名称',
       title: '申请人名称',
@@ -86,7 +79,7 @@ const Attendance = () => {
             onClick={() =>
             onClick={() =>
               setState({
               setState({
                 ...state,
                 ...state,
-                modalId: record.id,
+                id: record.id,
                 visible: true,
                 visible: true,
                 type: modalType.linkAttendance
                 type: modalType.linkAttendance
               })
               })
@@ -120,7 +113,7 @@ const Attendance = () => {
 
 
   return (
   return (
     <div className="h-full w-full flex flex-row">
     <div className="h-full w-full flex flex-row">
-      <AttendanceMenu itemTitle="加班申请人" />
+      <ShowTitleMenu itemTitle="加班申请人" />
       <div className="w-max-3/4">
       <div className="w-max-3/4">
         <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
         <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
           <div className="absolute right-7 top-7 z-100">
           <div className="absolute right-7 top-7 z-100">
@@ -130,13 +123,16 @@ const Attendance = () => {
               添加新申请人
               添加新申请人
             </Button>
             </Button>
             <ConnectModal
             <ConnectModal
-              type={state.type}
-              dataId={state.modalId}
-              visible={state.visible}
-              onCancel={() => setState({ ...state, visible: false })}
-              onRefresh={() => {
-                tryGetRoleStaffList(state.id)
-              }}
+              dataId={state.id}
+              show={state.visible}
+              onShowChange={(visible: boolean) => setState({ ...state, visible })}
+              onReload={() => tryGetRoleStaffList(state.id)}
+              postUrl={
+                state.type === modalType.addobjectModal
+                  ? '/attendance/add'
+                  : '/attendance/linkStaff'
+              }
+              showButton={false}
             />
             />
           </div>
           </div>
           <Table
           <Table

+ 69 - 39
src/pages/Business/Contact/index.tsx

@@ -3,7 +3,8 @@ import { Button } from 'antd'
 import ProForm, { ModalForm, ProFormText } from '@ant-design/pro-form'
 import ProForm, { ModalForm, ProFormText } from '@ant-design/pro-form'
 import type { ProFormColumnsType } from '@ant-design/pro-form'
 import type { ProFormColumnsType } from '@ant-design/pro-form'
 import { EditableProTable } from '@ant-design/pro-table'
 import { EditableProTable } from '@ant-design/pro-table'
-import AttendanceMenu from '../Attendance/components/AttendanceMenu'
+import ShowTitleMenu from '../Attendance/components/ShowTitleMenu'
+// import type { ColumnsType } from 'antd/lib/table'
 
 
 enum modalType {
 enum modalType {
   CREATE = 0,
   CREATE = 0,
@@ -14,7 +15,7 @@ interface StageSettingsType {
   id: React.Key
   id: React.Key
   name?: string
   name?: string
   stage?: string
   stage?: string
-  percentage?: string
+  percentage?: number
 }
 }
 const Contact = () => {
 const Contact = () => {
   const [state, setState] = useState({
   const [state, setState] = useState({
@@ -24,6 +25,26 @@ const Contact = () => {
     type: modalType.CREATE
     type: modalType.CREATE
   })
   })
 
 
+  const defaultStageSettingsData = [
+    {
+      id: 1,
+      stage: '结束',
+      name: '赢单',
+      percentage: 100
+    },
+    {
+      id: 2,
+      stage: '结束',
+      name: '赢单',
+      percentage: 0
+    },
+    {
+      id: 3,
+      stage: '结束',
+      name: '无效',
+      percentage: 0
+    }
+  ]
   const columns: ProFormColumnsType<StageSettingsType>[] = [
   const columns: ProFormColumnsType<StageSettingsType>[] = [
     {
     {
       title: '阶段',
       title: '阶段',
@@ -33,63 +54,72 @@ const Contact = () => {
     {
     {
       title: '阶段名称',
       title: '阶段名称',
       dataIndex: 'name',
       dataIndex: 'name',
-      width: '50%'
+      width: '45%'
     },
     },
     {
     {
       title: '赢单率',
       title: '赢单率',
       dataIndex: 'percentage',
       dataIndex: 'percentage',
-      width: '35%',
+      width: '30%',
       valueType: 'text',
       valueType: 'text',
       fieldProps: {
       fieldProps: {
         addonAfter: '%'
         addonAfter: '%'
       }
       }
+    },
+    {
+      title: '操作',
+      valueType: 'option',
+      width: '10%'
     }
     }
   ]
   ]
 
 
+  // const mainColumns: ColumnsType = [
+  //   {
+  //     dataIndex: ''
+  //   }
+  // ]
   return (
   return (
     <div className="h-full w-full flex flex-row">
     <div className="h-full w-full flex flex-row">
-      <AttendanceMenu itemTitle="商机状态组" />
+      <ShowTitleMenu itemTitle="商机状态组" />
       <div className="w-max-3/4">
       <div className="w-max-3/4">
         <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
         <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
           <div className="absolute right-7 top-7 z-100">
           <div className="absolute right-7 top-7 z-100">
-            <ModalForm
-              visible={state.visible}
-              onVisibleChange={() => setState({ ...state, visible: false })}
-              title={state.type === modalType.CREATE ? '创建商机角色' : '更新商机角色'}
-              trigger={
-                <Button
-                  type="primary"
-                  onClick={() => setState({ ...state, visible: true, type: modalType.CREATE })}>
-                  添加新组
-                </Button>
-              }>
-              <ProFormText name="name" label="组名称" required />
-              <ProFormText name="department" label="应用部门" required />
-              <ProForm.Item label="阶段设置" name="stageSettings">
-                <EditableProTable<StageSettingsType>
-                  rowKey="id"
-                  toolBarRender={false}
-                  columns={columns}
-                  recordCreatorProps={{
-                    newRecordType: 'dataSource',
-                    position: 'top',
-                    record: () => ({
-                      id: Date.now()
-                    })
-                  }}
-                  editable={{
-                    type: 'multiple',
-                    actionRender: (row, _, dom) => {
-                      return [dom.delete]
-                    }
-                  }}
-                />
-              </ProForm.Item>
-            </ModalForm>
+            <Button
+              type="primary"
+              onClick={() => setState({ ...state, visible: true, type: modalType.CREATE })}>
+              添加新组
+            </Button>
           </div>
           </div>
           {/* <Table columns={}></Table> */}
           {/* <Table columns={}></Table> */}
         </div>
         </div>
       </div>
       </div>
+      <ModalForm
+        visible={state.visible}
+        onVisibleChange={show => setState({ ...state, visible: show })}
+        title={state.type === modalType.CREATE ? '创建商机角' : '更新商机角'}>
+        <ProFormText name="name" label="组名称" required />
+        <ProFormText name="department" label="应用部门" required />
+        <ProForm.Item label="阶段设置" name="stageSettings" initialValue={defaultStageSettingsData}>
+          <EditableProTable<StageSettingsType>
+            rowKey="id"
+            toolBarRender={false}
+            columns={columns}
+            recordCreatorProps={{
+              newRecordType: 'dataSource',
+              position: 'top',
+              record: index => ({
+                id: Date.now(),
+                stage: `阶段${index - 2}`
+              })
+            }}
+            editable={{
+              type: 'multiple',
+              actionRender: (row, _, dom) => {
+                return [dom.delete]
+              }
+            }}
+          />
+        </ProForm.Item>
+      </ModalForm>
     </div>
     </div>
   )
   )
 }
 }

+ 68 - 3
src/pages/Role/Customer/index.tsx

@@ -2,22 +2,48 @@ import { useModel, useRequest } from 'umi'
 import { Delete, EveryUser } from '@icon-park/react'
 import { Delete, EveryUser } from '@icon-park/react'
 import ProForm, { ProFormCheckbox, ProFormDependency, ProFormSwitch } from '@ant-design/pro-form'
 import ProForm, { ProFormCheckbox, ProFormDependency, ProFormSwitch } from '@ant-design/pro-form'
 import type { FormInstance } from 'antd'
 import type { FormInstance } from 'antd'
-import { message, Table, Tabs } from 'antd'
+import { message, Table, Tabs, Radio, Space } from 'antd'
 import React, { useRef, useMemo, useState, useEffect } from 'react'
 import React, { useRef, useMemo, useState, useEffect } from 'react'
 
 
 import {
 import {
   fetchRoleStaffListByRoleId,
   fetchRoleStaffListByRoleId,
   updateRolePermission,
   updateRolePermission,
-  getRolePermissions
+  getRolePermissions,
+  updatePermDataByRoleId
 } from '@/services/user/api'
 } from '@/services/user/api'
 import type { ColumnsType } from 'antd/lib/table'
 import type { ColumnsType } from 'antd/lib/table'
 import { formatPermission } from '@/utils/utils'
 import { formatPermission } from '@/utils/utils'
 import RoleMenu from '../System/components/RoleMenu'
 import RoleMenu from '../System/components/RoleMenu'
 import ConnectModal from '../System/components/ConnectModal'
 import ConnectModal from '../System/components/ConnectModal'
+import FormItem from 'antd/lib/form/FormItem'
+
+const permData = [
+  {
+    label: '本人',
+    value: 'onsself'
+  },
+  {
+    label: '本人及下属',
+    value: 'underling'
+  },
+  {
+    label: '本部门',
+    value: 'department'
+  },
+  {
+    label: '本部门及下属部门',
+    value: 'departmentAll'
+  },
+  {
+    label: '全部',
+    value: 'all'
+  }
+]
 
 
 const Customer = () => {
 const Customer = () => {
   const { TabPane } = Tabs
   const { TabPane } = Tabs
   const formRef = useRef<FormInstance>(null)
   const formRef = useRef<FormInstance>(null)
+  const formRef2 = useRef<FormInstance>(null)
 
 
   const columns: ColumnsType<API.RoleStaffListItem> = [
   const columns: ColumnsType<API.RoleStaffListItem> = [
     {
     {
@@ -66,6 +92,7 @@ const Customer = () => {
     id: '',
     id: '',
     roleStaff: [],
     roleStaff: [],
     rolePermission: {},
     rolePermission: {},
+    dataPermission: {},
     activeKey: ''
     activeKey: ''
   })
   })
   const onSelect = (id: string) => {
   const onSelect = (id: string) => {
@@ -86,7 +113,11 @@ const Customer = () => {
     manual: true,
     manual: true,
     onSuccess: (result: API.GetRolePermissionResultModel) => {
     onSuccess: (result: API.GetRolePermissionResultModel) => {
       const values = { ...formatPermission('init', result.permission) }
       const values = { ...formatPermission('init', result.permission) }
-      setState({ ...state, rolePermission: values })
+      setState({
+        ...state,
+        rolePermission: values,
+        dataPermission: JSON.parse(result.dataPermission)
+      })
     }
     }
   })
   })
 
 
@@ -98,6 +129,9 @@ const Customer = () => {
     if (state.activeKey === '2') {
     if (state.activeKey === '2') {
       formRef.current?.setFieldsValue({ ...state.rolePermission })
       formRef.current?.setFieldsValue({ ...state.rolePermission })
     }
     }
+    if (state.activeKey === '3') {
+      formRef2.current?.setFieldsValue({ ...state.dataPermission })
+    }
   }, [state.id, state.activeKey])
   }, [state.id, state.activeKey])
 
 
   return (
   return (
@@ -202,6 +236,37 @@ const Customer = () => {
                 )}
                 )}
               </div>
               </div>
             </TabPane>
             </TabPane>
+            <TabPane tab="数据权限" key="3">
+              {state.id && (
+                <ProForm
+                  formRef={formRef2}
+                  layout="vertical"
+                  onFinish={async values => {
+                    try {
+                      await updatePermDataByRoleId({
+                        id: state.id,
+                        dataPermission: JSON.stringify(values)
+                      })
+                    } catch (error) {
+                      return message.error(error.toString())
+                    }
+                    message.success('设置成功')
+                    return true
+                  }}>
+                  <FormItem name="access" label="联系人/客户可见" required>
+                    <Radio.Group>
+                      <Space direction="vertical">
+                        {permData.map(item => (
+                          <Radio key={item.value} value={item.value}>
+                            {item.label}
+                          </Radio>
+                        ))}
+                      </Space>
+                    </Radio.Group>
+                  </FormItem>
+                </ProForm>
+              )}
+            </TabPane>
           </Tabs>
           </Tabs>
         </div>
         </div>
       </div>
       </div>

+ 52 - 19
src/pages/Role/System/components/ConnectModal/index.tsx

@@ -1,22 +1,39 @@
 import { useRequest } from 'umi'
 import { useRequest } from 'umi'
 import { Button, Input, message, Modal } from 'antd'
 import { Button, Input, message, Modal } from 'antd'
 import React, { useState, useRef, useEffect } from 'react'
 import React, { useState, useRef, useEffect } from 'react'
-import { addRoleStaff, fetchStaffList } from '@/services/user/api'
-import './index.less'
+import { fetchStaffList } from '@/services/user/api'
 import { LoadingOutlined, MoreOutlined } from '@ant-design/icons'
 import { LoadingOutlined, MoreOutlined } from '@ant-design/icons'
+import { request } from 'umi'
+import './index.less'
 
 
 interface ConnectModalProps {
 interface ConnectModalProps {
-  title: string
-  dataId: string
-  onSelect?: () => void
+  postUrl: string
+  showButton?: boolean
+  title?: string
+  dataId?: string
+  onReload?: () => void
+  show?: boolean
+  onShowChange?: (isShow: boolean) => void
 }
 }
-const ConnectModal: React.FC<ConnectModalProps> = ({ title, dataId, onSelect }) => {
+const ConnectModal: React.FC<ConnectModalProps> = ({
+  title,
+  dataId,
+  onReload,
+  show,
+  onShowChange,
+  postUrl,
+  showButton = true
+}) => {
   const containerRef = useRef<HTMLDivElement>(null)
   const containerRef = useRef<HTMLDivElement>(null)
   const [visible, setVisible] = useState(false)
   const [visible, setVisible] = useState(false)
   const [searchVal, setSearchVal] = useState('')
   const [searchVal, setSearchVal] = useState('')
 
 
-  const { run: tryAddRoleStaff } = useRequest(
-    (params: API.AddRoleStaffParams) => addRoleStaff(params),
+  const { run: tryConnectStaff } = useRequest(
+    (params: API.AddRoleStaffCommonParams) =>
+      request(postUrl, {
+        method: 'POST',
+        data: params
+      }),
     {
     {
       manual: true,
       manual: true,
       onSuccess: () => {
       onSuccess: () => {
@@ -60,25 +77,41 @@ const ConnectModal: React.FC<ConnectModalProps> = ({ title, dataId, onSelect })
 
 
   const { list = [] }: { list: API.StaffItem[] } = data || {}
   const { list = [] }: { list: API.StaffItem[] } = data || {}
   useEffect(() => {
   useEffect(() => {
-    if (visible) {
+    if (show || visible) {
       tryQueryStaffList()
       tryQueryStaffList()
     }
     }
-  }, [visible])
+  }, [show, visible])
 
 
-  const itemSelectHandler = (staffId: string) => {
-    tryAddRoleStaff({ id: dataId, staffId })
-    if (onSelect) {
-      onSelect()
+  const handleOnCancel = () => {
+    if (onShowChange !== undefined) {
+      onShowChange(false)
+    } else {
+      setVisible(false)
+    }
+  }
+
+  const itemSelectHandler = async (staffId: string) => {
+    const params = { staffId }
+    if (dataId) {
+      params.id = dataId
+    }
+    await tryConnectStaff(params)
+    // 动态
+    if (onReload) {
+      await onReload()
     }
     }
+    handleOnCancel()
   }
   }
   return (
   return (
     <>
     <>
-      <Button type="primary" onClick={() => setVisible(true)}>
-        {title}
-      </Button>
+      {showButton && (
+        <Button type="primary" onClick={() => setVisible(true)}>
+          {title}
+        </Button>
+      )}
       <Modal
       <Modal
-        visible={visible}
-        onCancel={() => setVisible(false)}
+        visible={show === undefined ? visible : show}
+        onCancel={handleOnCancel}
         getContainer={false}
         getContainer={false}
         width="60vw"
         width="60vw"
         title={
         title={

+ 23 - 64
src/pages/Role/System/index.tsx

@@ -1,5 +1,5 @@
 import { useModel, useRequest } from 'umi'
 import { useModel, useRequest } from 'umi'
-import { Delete, EveryUser } from '@icon-park/react'
+import { Association, Delete, EveryUser } from '@icon-park/react'
 import ProForm, { ProFormCheckbox, ProFormDependency, ProFormSwitch } from '@ant-design/pro-form'
 import ProForm, { ProFormCheckbox, ProFormDependency, ProFormSwitch } from '@ant-design/pro-form'
 import type { FormInstance } from 'antd'
 import type { FormInstance } from 'antd'
 import { message, Table, Tabs, Popconfirm, Popover } from 'antd'
 import { message, Table, Tabs, Popconfirm, Popover } from 'antd'
@@ -140,7 +140,8 @@ const System = () => {
               <ConnectModal
               <ConnectModal
                 title="关联员工"
                 title="关联员工"
                 dataId={state.id}
                 dataId={state.id}
-                onSelect={() => tryGetRoleStaffList(state.id)}
+                onReload={() => tryGetRoleStaffList(state.id)}
+                postUrl="/role/staff/add"
               />
               />
             )}
             )}
           </div>
           </div>
@@ -169,16 +170,6 @@ const System = () => {
                       })
                       })
                       message.success('设置成功')
                       message.success('设置成功')
                     }}>
                     }}>
-                    {/* <ProFormSwitch
-                  name="showHome"
-                  label={
-                    <span className="flex items-center">
-                      <Icon type="home" className="mr-1" className="flex items-baseline mr-1" />
-                      后台首页
-                    </span>
-                  }
-                /> */}
-
                     <ProFormSwitch
                     <ProFormSwitch
                       name="showSystem"
                       name="showSystem"
                       fieldProps={{
                       fieldProps={{
@@ -213,59 +204,27 @@ const System = () => {
                         />
                         />
                       )}
                       )}
                     </ProFormDependency>
                     </ProFormDependency>
-                    {/* <ProFormSwitch
-                  name="showAudit"
-                  label={
-                    <span className="flex items-center">
-                      <Icon
-                        type="inspection"
-                        className="mr-1"
-                        className="flex items-baseline mr-1"
-                      />
-                      审批流程
-                    </span>
-                  }
-                />
-                <ProFormDependency name={['showAudit']}>
-                  {({ showAudit }) => (
-                    <ProFormCheckbox.Group
-                      wrapperCol={{ offset: 1 }}
-                      name="audit"
-                      options={[
-                        { value: '1', label: '流程角色', disabled: !showAudit },
-                        { value: '2', label: '开票合同', disabled: !showAudit },
-                        { value: '3', label: '财务费用', disabled: !showAudit },
-                        { value: '4', label: '人资管理', disabled: !showAudit },
-                        { value: '5', label: '考勤', disabled: !showAudit }
-                      ]}
-                    />
-                  )}
-                </ProFormDependency>
-                <ProFormSwitch
-                  name="reset"
-                  label={
-                    <span className="flex items-center">
-                      <Icon
-                        type="association"
-                        className="mr-1"
-                        className="flex items-baseline mr-1"
-                      />
-                      业务参数
-                    </span>
-                  }
-                />
-                <ProFormDependency name={['reset']}>
-                  {({ reset }) => (
-                    <ProFormCheckbox.Group
-                      wrapperCol={{ offset: 1 }}
-                      name="audit"
-                      options={[
-                        { value: '1', label: '客户', disabled: !reset },
-                        { value: '2', label: '产品', disabled: !reset }
-                      ]}
+                    <ProFormSwitch
+                      name="showBusiness"
+                      label={
+                        <span className="flex items-center">
+                          <Association className="mr-1" className="flex items-baseline mr-1" />
+                          业务参数
+                        </span>
+                      }
                     />
                     />
-                  )}
-                </ProFormDependency> */}
+                    <ProFormDependency name={['showBusiness']}>
+                      {({ showBusiness }) => (
+                        <ProFormCheckbox.Group
+                          wrapperCol={{ offset: 1 }}
+                          name="business"
+                          options={[
+                            { value: 'attendance', label: '考勤', disabled: !showBusiness },
+                            { value: 'contact', label: '客户', disabled: !showBusiness }
+                          ]}
+                        />
+                      )}
+                    </ProFormDependency>
                   </ProForm>
                   </ProForm>
                 )}
                 )}
               </div>
               </div>

+ 7 - 0
src/services/user/api.ts

@@ -120,5 +120,12 @@ export async function deleteStaff(params: API.DeleteStaff) {
   })
   })
 }
 }
 
 
+/** 角色下更新数据权限 */
+export async function updatePermDataByRoleId(params: API.UpdatePermData) {
+  return request('/role/permission/data/save', {
+    method: 'POST',
+    data: params
+  })
+}
 /** 获得商机组列表 */
 /** 获得商机组列表 */
 export async function getBusinessgroupList() {}
 export async function getBusinessgroupList() {}

+ 8 - 3
src/services/user/typings.d.ts

@@ -163,9 +163,9 @@ declare namespace API {
     IDcardsValidity: string
     IDcardsValidity: string
   }
   }
 
 
-  type AddRoleStaffParams = {
-    id: string
+  type AddRoleStaffCommonParams = {
     staffId: string
     staffId: string
+    id?: string
   }
   }
 
 
   type UpdateRolePermissionParams = {
   type UpdateRolePermissionParams = {
@@ -185,7 +185,7 @@ declare namespace API {
     id: string
     id: string
     applicantStaffId: string
     applicantStaffId: string
     applicantStaffName: string
     applicantStaffName: string
-    staff: { id: string; staff: string }[]
+    staff: { staffId: string; staffName: string }[]
   }
   }
 
 
   type UnlinkAttendance = {
   type UnlinkAttendance = {
@@ -210,4 +210,9 @@ declare namespace API {
     id: string
     id: string
     name: string
     name: string
   }
   }
+
+  type UpdatePermData = {
+    id: string
+    dataPermission: any[]
+  }
 }
 }