useScripts.tsx 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. import MemberItem from '../components/MemberItem'
  2. import consts from '@/utils/consts'
  3. import { useState } from 'react'
  4. import { useRequest } from 'ahooks'
  5. import { addExecutor, delExecutor, queryExecutorList, updateExecutor } from '@/services/api/business'
  6. import { ApprovalType, ExecutorSetType } from '@/enums/gc'
  7. import { QuestionCircleFilled } from '@ant-design/icons'
  8. import { Form, message, Tooltip } from 'antd'
  9. import ProForm, { ProFormDependency, ProFormRadio, ProFormSelect, ProFormText } from '@ant-design/pro-form'
  10. import type { ModalAction } from '@/components/Modal'
  11. import { useDispatch } from '@umijs/max'
  12. const setTypeOptions = [
  13. {
  14. label: (
  15. <div>
  16. <span className="mr-1">预置成员</span>
  17. <Tooltip title="审批用户为该角色绑定成员">
  18. <QuestionCircleFilled style={{ color: 'orange' }} />
  19. </Tooltip>
  20. </div>
  21. ),
  22. value: ExecutorSetType.PRESET_MEMBER
  23. },
  24. {
  25. label: (
  26. <div>
  27. <span className="mr-1">步骤设置</span>
  28. <Tooltip title="审批用户为该角色动态配置">
  29. <QuestionCircleFilled style={{ color: 'orange' }} />
  30. </Tooltip>
  31. </div>
  32. ),
  33. value: ExecutorSetType.STEP_SETTING
  34. }
  35. ]
  36. type iState = {
  37. total: number
  38. }
  39. export default function useScripts(modal: ModalAction) {
  40. const dispatch = useDispatch()
  41. const [state, seState] = useState<iState>({
  42. total: 0
  43. })
  44. const {
  45. run: query,
  46. refresh,
  47. loading
  48. } = useRequest(queryExecutorList, {
  49. manual: true,
  50. onSuccess: (result, params) => {
  51. const { subjectID, businessType } = params[0]
  52. seState({ total: result.data.total })
  53. dispatch({
  54. type: 'business/updateProcessMap',
  55. payload: {
  56. ID: `${subjectID}_${businessType}`,
  57. process: result.data.items
  58. }
  59. })
  60. }
  61. })
  62. const addOrEdit = (mode: 'add' | 'edit', initialValues?: API.ExecutorItem) => {
  63. const text = mode === 'add' ? '新增执行者' : '编辑执行者'
  64. modal.open({
  65. title: text,
  66. okText: '确定',
  67. cancelText: '取消',
  68. type: 'form',
  69. initialValues: initialValues ?? {
  70. setType: ExecutorSetType.PRESET_MEMBER,
  71. approvalType: ApprovalType.TARGET
  72. },
  73. children: (
  74. <ProForm submitter={false} layout="horizontal" labelCol={{ span: 5 }} isKeyPressSubmit>
  75. <ProFormText hidden name="ID" />
  76. <ProFormText
  77. label="执行者名称"
  78. name="name"
  79. rules={[{ required: true, message: '请输入' }]}
  80. placeholder="请输入"
  81. />
  82. <ProFormRadio.Group
  83. label="配置方式"
  84. name="setType"
  85. options={setTypeOptions}
  86. rules={[{ required: true, message: '请选择' }]}
  87. />
  88. <ProFormDependency name={['setType']}>
  89. {({ name }) => {
  90. if (name === ExecutorSetType.PRESET_MEMBER)
  91. return (
  92. <Form.Item label="成员" name="members" rules={[{ required: true, message: '请选择' }]}>
  93. <MemberItem />
  94. </Form.Item>
  95. )
  96. return <ProFormSelect name="" label="范围选择" />
  97. }}
  98. </ProFormDependency>
  99. </ProForm>
  100. ),
  101. onOk: async (values: API.ExecutorItem) => {
  102. let requestFn: Nullable<() => Promise<viod>> = null
  103. if (mode === 'add') {
  104. requestFn = addExecutor
  105. values.businessType = business
  106. } else {
  107. requestFn = updateExecutor
  108. }
  109. try {
  110. await requestFn?.(values)
  111. refresh()
  112. modal.close()
  113. message.success(text + '成功')
  114. } catch (error) {}
  115. }
  116. })
  117. }
  118. const del = (ID: string) => {
  119. modal.open({
  120. title: '删除执行者',
  121. okText: '确定',
  122. cancelText: '取消',
  123. children: <div>确定删除该执行者吗?</div>,
  124. onOk: async () => {
  125. try {
  126. const { code = -1 } = await delExecutor({ ID })
  127. if (code === consts.RET_CODE.SUCCESS) {
  128. refresh()
  129. modal.close()
  130. message.success('删除成功')
  131. }
  132. } catch (error) {}
  133. }
  134. })
  135. }
  136. return { query, total: state.total, loading, addOrEdit, del }
  137. }