|
|
@@ -1,20 +1,22 @@
|
|
|
import React, { useCallback, useEffect, useState } from 'react'
|
|
|
import styles from './index.module.scss'
|
|
|
-import { Button, Radio } from 'antd'
|
|
|
+import { Button, Checkbox, Input, Radio } from 'antd'
|
|
|
import TextArea from 'antd/es/input/TextArea'
|
|
|
import MyPopconfirm from '@/components/MyPopconfirm'
|
|
|
import { MessageFu } from '@/utils/message'
|
|
|
import { I4tableType } from '../data'
|
|
|
import { I4_APIgetInfo, I4_APIsave } from '@/store/action/Isystem/I4processSet'
|
|
|
+import { TypeI5Tree } from '../../I5organization/data'
|
|
|
|
|
|
type Props = {
|
|
|
sId: number
|
|
|
closeFu: () => void
|
|
|
succFu: () => void
|
|
|
+ treeData: TypeI5Tree[]
|
|
|
}
|
|
|
|
|
|
-function I4edit({ sId, closeFu, succFu }: Props) {
|
|
|
- const [info, setInfo] = useState({} as I4tableType)
|
|
|
+function I4edit({ sId, closeFu, succFu, treeData }: Props) {
|
|
|
+ const [info, setInfo] = useState((sId > 0 ? {} : { enabled: 1 }) as I4tableType)
|
|
|
|
|
|
const getInfoFu = useCallback(async (id: number) => {
|
|
|
const res = await I4_APIgetInfo(id)
|
|
|
@@ -23,15 +25,18 @@ function I4edit({ sId, closeFu, succFu }: Props) {
|
|
|
setInfo({
|
|
|
...data
|
|
|
})
|
|
|
+ if (data.dictIds) {
|
|
|
+ setCheckIds(data.dictIds.split(','))
|
|
|
+ }
|
|
|
}
|
|
|
}, [])
|
|
|
|
|
|
useEffect(() => {
|
|
|
- getInfoFu(sId)
|
|
|
+ if (sId > 0) getInfoFu(sId)
|
|
|
}, [getInfoFu, sId])
|
|
|
|
|
|
const formChange = useCallback(
|
|
|
- (key: 'enabled' | 'remark', val: any) => {
|
|
|
+ (key: 'enabled' | 'remark' | 'name', val: any) => {
|
|
|
setInfo({
|
|
|
...info,
|
|
|
[key]: val
|
|
|
@@ -40,32 +45,93 @@ function I4edit({ sId, closeFu, succFu }: Props) {
|
|
|
[info]
|
|
|
)
|
|
|
|
|
|
+ // 已经选中的
|
|
|
+ const [checkIds, setCheckIds] = useState<string[]>([])
|
|
|
+
|
|
|
+ const checkFu = useCallback(
|
|
|
+ (id: string) => {
|
|
|
+ if (checkIds.includes(id)) setCheckIds(checkIds.filter(v => v !== id))
|
|
|
+ else setCheckIds([...checkIds, id])
|
|
|
+ },
|
|
|
+ [checkIds]
|
|
|
+ )
|
|
|
+
|
|
|
// 点击确定
|
|
|
const btnOk = useCallback(async () => {
|
|
|
const obj = {
|
|
|
- ...info
|
|
|
+ ...info,
|
|
|
+ id: sId > 0 ? sId : null,
|
|
|
+ dictIds: checkIds.join(',')
|
|
|
}
|
|
|
|
|
|
+ if (!obj.name) return MessageFu.warning('请输入规则名称')
|
|
|
+ if (![0, 1].includes(obj.enabled)) return MessageFu.warning('请选择规则状态')
|
|
|
+
|
|
|
+ // if (1 + 1) {
|
|
|
+ // console.log('-------', obj)
|
|
|
+
|
|
|
+ // return
|
|
|
+ // }
|
|
|
+
|
|
|
const res = await I4_APIsave(obj)
|
|
|
if (res.code === 0) {
|
|
|
MessageFu.success('编辑成功')
|
|
|
succFu()
|
|
|
closeFu()
|
|
|
}
|
|
|
- }, [closeFu, info, succFu])
|
|
|
+ }, [checkIds, closeFu, info, sId, succFu])
|
|
|
+
|
|
|
+ // 全选、反选
|
|
|
+ const allCheck = useCallback(
|
|
|
+ (id1: string, son?: TypeI5Tree[], flag?: boolean) => {
|
|
|
+ const ids = [id1]
|
|
|
+ if (son && son.length) {
|
|
|
+ son.forEach(v => {
|
|
|
+ ids.push(v.id)
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ let data = [...checkIds]
|
|
|
+
|
|
|
+ if (flag) {
|
|
|
+ // 反选
|
|
|
+ data = data.filter(c => !ids.includes(c))
|
|
|
+ } else {
|
|
|
+ // 全选
|
|
|
+ ids.forEach(v => {
|
|
|
+ if (!data.includes(v)) {
|
|
|
+ data.push(v)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ setCheckIds(data)
|
|
|
+ },
|
|
|
+ [checkIds]
|
|
|
+ )
|
|
|
|
|
|
return (
|
|
|
<div className={styles.I4edit}>
|
|
|
<div className='I4main'>
|
|
|
<div className='I4RowBox'>
|
|
|
<div className='I4row'>
|
|
|
- <div className='I4row1'>流程名称:</div>
|
|
|
- <div className='I4row2'>{info.name}</div>
|
|
|
+ <div className='I4row1 I4row1_2'>
|
|
|
+ <span> * </span> 规则名称:
|
|
|
+ </div>
|
|
|
+ <div className='I4row2'>
|
|
|
+ <Input
|
|
|
+ maxLength={30}
|
|
|
+ showCount
|
|
|
+ placeholder='请输入内容'
|
|
|
+ value={info.name}
|
|
|
+ onChange={e => formChange('name', e.target.value.trim())}
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
<div className='I4row'>
|
|
|
<div className='I4row1'>
|
|
|
- <span> * </span> 流程状态:
|
|
|
+ <span> * </span> 规则状态:
|
|
|
</div>
|
|
|
<div className='I4row2'>
|
|
|
<Radio checked={info.enabled === 1} onClick={() => formChange('enabled', 1)}>
|
|
|
@@ -79,7 +145,7 @@ function I4edit({ sId, closeFu, succFu }: Props) {
|
|
|
</div>
|
|
|
|
|
|
<div className='I4row'>
|
|
|
- <div className='I4row1'>流程说明:</div>
|
|
|
+ <div className='I4row1'>规则说明:</div>
|
|
|
<div className='I4row2'>
|
|
|
<TextArea
|
|
|
maxLength={500}
|
|
|
@@ -90,14 +156,53 @@ function I4edit({ sId, closeFu, succFu }: Props) {
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
+
|
|
|
+ <div className='I4box'>
|
|
|
+ <div className='I4box1'>关联业务流程:</div>
|
|
|
+ <div className='I4box2'>
|
|
|
+ {treeData.map(item1 => (
|
|
|
+ <div className='I4box2_row' key={item1.id}>
|
|
|
+ <div className='I4box2_row1'>{item1.name}</div>
|
|
|
+ <div className='I4box2_row2' onClick={() => allCheck(item1.id, item1.children)}>
|
|
|
+ [全选]
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ className='I4box2_row2'
|
|
|
+ onClick={() => allCheck(item1.id, item1.children, true)}
|
|
|
+ >
|
|
|
+ [反选]
|
|
|
+ </div>
|
|
|
+ <Checkbox
|
|
|
+ className='I4box2_rowCheck1'
|
|
|
+ checked={checkIds.includes(item1.id)}
|
|
|
+ onChange={() => checkFu(item1.id)}
|
|
|
+ >
|
|
|
+ 默认流程
|
|
|
+ </Checkbox>
|
|
|
+
|
|
|
+ {item1.children &&
|
|
|
+ item1.children.map(item2 => (
|
|
|
+ <Checkbox
|
|
|
+ key={item2.id}
|
|
|
+ checked={checkIds.includes(item2.id)}
|
|
|
+ onChange={() => checkFu(item2.id)}
|
|
|
+ >
|
|
|
+ {item2.name}
|
|
|
+ </Checkbox>
|
|
|
+ ))}
|
|
|
+ </div>
|
|
|
+ ))}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
{/* 右侧按钮 */}
|
|
|
<div className='I4btn'>
|
|
|
<Button type='primary' onClick={btnOk}>
|
|
|
- 保存
|
|
|
- </Button>{' '}
|
|
|
-  
|
|
|
+ 提交
|
|
|
+ </Button>
|
|
|
+ <br />
|
|
|
+ <br />
|
|
|
<MyPopconfirm txtK='取消' onConfirm={closeFu} />
|
|
|
</div>
|
|
|
</div>
|