823 lines
28 KiB
TypeScript
823 lines
28 KiB
TypeScript
import { connect } from "umi";
|
||
import type { CurrentUser } from "umi";
|
||
import type { ConnectState } from "@/models/connect";
|
||
import React, { useRef, useState } from "react";
|
||
import ProCard from "@ant-design/pro-card";
|
||
import { FileSearchOutlined, MenuFoldOutlined, PlusOutlined } from "@ant-design/icons";
|
||
import type { FormInstance } from "antd";
|
||
import { Popconfirm } from "antd";
|
||
import { Button, message, Modal, Space, Spin, Tree } from "antd";
|
||
import useRequest from "@ahooksjs/use-request";
|
||
import { getFieldEnumTree, getServerpartTree } from "@/services/options";
|
||
import type { ActionType } from "@ant-design/pro-table";
|
||
import ProTable from "@ant-design/pro-table";
|
||
import ReactHTMLTableToExcel from "react-html-table-to-excel";
|
||
import { ModalForm, ProFormRadio, ProFormSelect, ProFormText, ProFormTreeSelect } from "@ant-design/pro-form";
|
||
import {
|
||
handleDeleteAPPROVALROUTE,
|
||
handleDeleteBUSINESSAPPROVAL,
|
||
handleGetAPPROVALROUTEList, handleGetUSERList,
|
||
handleSynchroAPPROVALROUTE
|
||
} from "@/pages/Setting/serviceConfig/service";
|
||
import moment from "moment";
|
||
import { getUserList, getUserTypeTree } from "@/pages/Setting/Users/service";
|
||
import ChosePlayers from "@/pages/Setting/serviceConfig/component/ChosePlayers";
|
||
import Draggable from "react-draggable";
|
||
import session from "@/utils/session";
|
||
|
||
|
||
const ServiceConfig: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
||
const { currentUser } = props
|
||
// 选择参与人的
|
||
const choseDetail = useRef()
|
||
const downloadBtnRef = useRef<any>()
|
||
const actionRef = useRef<ActionType>();
|
||
const formRef = useRef<FormInstance>();
|
||
const addFormRef = useRef<FormInstance>();
|
||
const [reqDetailList, setReqDetailList] = useState<any>(); // 合计项数据源
|
||
const [printOut, setPrintOut] = useState<any>(); // 打印数据的内容
|
||
const [collapsible, setCollapsible] = useState<boolean>(false)
|
||
// const [treeView,setTreeView] = useState<any>()
|
||
// 业务类型的选择器内容
|
||
// const [serviceType,setServiceType] = useState<any>()
|
||
// 业务类型的obj格式
|
||
// const [serviceTypeObj,setServiceTypeObj] = useState<any>()
|
||
const serviceTypeObj = session.get('PROCESS_TYPEObj')
|
||
const serviceType = session.get('PROCESS_TYPEList')
|
||
const treeView = session.get('PROCESS_TYPETree')
|
||
// 选择的角色类型
|
||
const [selectRoleType, setSelectRoleType] = useState<number>(0)
|
||
// 选择的角色类别id
|
||
const [selectRoleTypeId, setSelectRoleTypeId] = useState<any>()
|
||
|
||
// 加载服务区树
|
||
// const { loading: treeLoading, data: treeViews } = useRequest(async () => {
|
||
// const data = await getFieldEnumTree({ FieldExplainField: 'PROCESS_TYPE', sessionName: 'PROCESS_TYPE' })
|
||
// setTreeView(data)
|
||
// const list: any = []
|
||
// const obj: any = {}
|
||
// if (data && data.length>0){
|
||
// data.forEach((item: any)=>{
|
||
// list.push({label:item.label,value: item.value})
|
||
// obj[item.value] = item.label
|
||
// })
|
||
// }
|
||
// setServiceType(list)
|
||
// setServiceTypeObj(obj)
|
||
// // return data
|
||
// })
|
||
// 显示悬浮抽屉
|
||
const [modalVisible, setModalVisible] = useState<boolean>(false)
|
||
// 树相关的属性和方法
|
||
const [selectedId, setSelectedId] = useState<string>()
|
||
// 导出的加载效果
|
||
const [showLoading, setShowLoading] = useState<boolean>(false)
|
||
// 是否显示打印的表格
|
||
const [showExportTable, setShowExportTable] = useState<boolean>(false)
|
||
// 业务状态选择
|
||
const [businessTypeState, setBussinessTypeState] = useState<any>([
|
||
// 1000,2000,2010,2020,2030,2040,2050,2060,2070,2080,2090
|
||
{ label: '1000', value: 1000 },
|
||
{ label: '2000', value: 2000 },
|
||
{ label: '2010', value: 2010 },
|
||
{ label: '2020', value: 2020 },
|
||
{ label: '2030', value: 2030 },
|
||
{ label: '2040', value: 2040 },
|
||
{ label: '2050', value: 2050 },
|
||
{ label: '2060', value: 2060 },
|
||
{ label: '2070', value: 2070 },
|
||
{ label: '2080', value: 2080 },
|
||
{ label: '2090', value: 2090 },
|
||
// {label:'商户确认审核',value:2000},
|
||
// {label:'服务区经理审核',value:2010},
|
||
// {label:'片区中心审核',value:2020},
|
||
// {label:'经发部审核',value:2030},
|
||
// {label:'财务部审核',value:2040},
|
||
])
|
||
const [nextBusinessTypeState, setNextBusinessTypeState] = useState<any>([
|
||
// 2000,2010,2020,2030,2040,2050,2060,2070,2080,2090,9000
|
||
{ label: '2000', value: 2000 },
|
||
{ label: '2010', value: 2010 },
|
||
{ label: '2020', value: 2020 },
|
||
{ label: '2030', value: 2030 },
|
||
{ label: '2040', value: 2040 },
|
||
{ label: '2050', value: 2050 },
|
||
{ label: '2060', value: 2060 },
|
||
{ label: '2070', value: 2070 },
|
||
{ label: '2080', value: 2080 },
|
||
{ label: '2090', value: 2090 },
|
||
{ label: '9000', value: 9000 },
|
||
// {label:'商户确认审核',value:2000},
|
||
// {label:'服务区经理审核',value:2010},
|
||
// {label:'片区中心审核',value:2020},
|
||
// {label:'经发部审核',value:2030},
|
||
// {label:'财务部审核',value:2040},
|
||
])
|
||
// 显示参与人的悬浮框
|
||
const [showChosePlayer, setShowChosePlayer] = useState<boolean>(false)
|
||
// 参与人列表
|
||
const [playerList, setPlayerList] = useState<any>()
|
||
const [playDefaulterList, setPlayDefaulterList] = useState<any>()
|
||
// 点击的行的详情数据
|
||
const [currentRow, setCurrentRow] = useState<any>()
|
||
// 默认的人
|
||
const [defaultPerson, setDefaultPerson] = useState<any>()
|
||
const draggleRef = React.createRef<any>()
|
||
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
|
||
const [bounds, setBounds] = useState<{ left: number, right: number, top: number, bottom: number }>() // 移动的位置
|
||
const onDraggaleStart = (event, uiData) => {
|
||
const { clientWidth, clientHeight } = window.document.documentElement;
|
||
const targetRect = draggleRef.current?.getBoundingClientRect();
|
||
if (!targetRect) {
|
||
return;
|
||
}
|
||
setBounds({
|
||
left: -targetRect.left + uiData.x,
|
||
right: clientWidth - (targetRect.right - uiData.x),
|
||
top: -targetRect.top + uiData.y,
|
||
bottom: clientHeight - (targetRect.bottom - uiData.y),
|
||
});
|
||
};
|
||
|
||
const columns: any = [
|
||
{
|
||
title: '环节名称',
|
||
dataIndex: 'APPROVALROUTE_NAME',
|
||
hideInSearch: true
|
||
},
|
||
{
|
||
title: '业务状态',
|
||
dataIndex: 'APPROVALROUTE_STATE',
|
||
sorter: (a, b) => a.APPROVALROUTE_STATE - b.APPROVALROUTE_STATE,
|
||
defaultSortOrder: 'ascend',
|
||
// valueType: 'select',
|
||
// 暂时只支持业务类型为11的商户对账审批
|
||
// valueEnum:{
|
||
// 2000:'商户确认审核',
|
||
// 2010:'服务区经理审核',
|
||
// 2020:'片区中心审核',
|
||
// 2030:'经发部审核',
|
||
// 2040:'财务部审核',
|
||
// }
|
||
},
|
||
{
|
||
title: '业务类型',
|
||
dataIndex: 'OPERATION_TYPE',
|
||
valueType: 'select',
|
||
hideInSearch: true,
|
||
valueEnum: serviceTypeObj
|
||
},
|
||
{
|
||
title: '下一业务状态',
|
||
dataIndex: 'NEXT_STATE',
|
||
// valueType: 'select',
|
||
hideInSearch: true,
|
||
// valueEnum:{
|
||
// 2000:'商户确认审核',
|
||
// 2010:'服务区经理审核',
|
||
// 2020:'片区中心审核',
|
||
// 2030:'经发部审核',
|
||
// 2040:'财务部审核',
|
||
// }
|
||
},
|
||
{
|
||
title: '参与人',
|
||
dataIndex: 'APPROVALSTAFF_NAME',
|
||
width: 200,
|
||
ellipsis: true,
|
||
hideInSearch: true,
|
||
},
|
||
{
|
||
title: '生成时间',
|
||
dataIndex: 'RECORD_DATE',
|
||
hideInSearch: true,
|
||
render: (_, record) => {
|
||
return record?.RECORD_DATE ? moment(record?.RECORD_DATE).format('YYYY-MM-DD') : ''
|
||
}
|
||
},
|
||
{
|
||
title: '业主单位',
|
||
width: 120,
|
||
dataIndex: 'PROVINCE_CODE',
|
||
hideInSearch: true,
|
||
},
|
||
{
|
||
dataIndex: 'option',
|
||
title: '操作',
|
||
width: 120,
|
||
valueType: 'option',
|
||
align: 'center',
|
||
fixed: 'right',
|
||
hideInSearch: true,
|
||
render: (_, record) => {
|
||
return (
|
||
<Space>
|
||
<a onClick={() => {
|
||
console.log('record', record)
|
||
setSelectRoleType(record?.USER_PATTERN)
|
||
setCurrentRow(record)
|
||
setModalVisible(true)
|
||
}}>编辑</a>
|
||
<Popconfirm
|
||
title="确认删除?"
|
||
onConfirm={async () => {
|
||
const req: any = {
|
||
APPROVALROUTEId: record?.APPROVALROUTE_ID
|
||
}
|
||
const data = await handleDeleteAPPROVALROUTE(req)
|
||
if (data.Result_Code === 100) {
|
||
message.success('删除成功')
|
||
actionRef.current?.reload()
|
||
} else {
|
||
message.error(data.Result_Desc)
|
||
}
|
||
}}
|
||
>
|
||
<a>删除</a>
|
||
</Popconfirm>
|
||
</Space>
|
||
)
|
||
}
|
||
}
|
||
|
||
]
|
||
|
||
|
||
const exportTable = (e) => {
|
||
e.stopPropagation(); // 防止Collapse组件收起
|
||
const main = document.getElementsByClassName('saleReportHideBox')[0]
|
||
const thead = main.querySelector('thead').cloneNode(true); // 深克隆DOM节点
|
||
const tbody = main.querySelector('tbody').cloneNode(true); // 深克隆DOM节点
|
||
const container = document.querySelector('#hiddenBox');
|
||
|
||
const tempTable = document.createElement('table');
|
||
tempTable.appendChild(thead);
|
||
tempTable.appendChild(tbody);
|
||
|
||
tempTable.setAttribute('id', 'table-to-xls-saleRankReport'); // 给table添加id,值与按钮上的table字段对应
|
||
|
||
container.appendChild(tempTable); // 把创建的节点添加到页面容器中
|
||
|
||
setShowLoading(false)
|
||
|
||
downloadBtnRef.current.handleDownload();
|
||
setShowExportTable(false)
|
||
tempTable.remove() // 防止重复打印一个内容
|
||
}
|
||
// 查询的条件
|
||
const [searchParams, setSearchParams] = useState<any>()
|
||
|
||
return (
|
||
<div ref={(el) => {
|
||
// 打印报表
|
||
if (!reqDetailList || reqDetailList.length === 0) return;
|
||
setPrintOut(el);
|
||
}} >
|
||
|
||
{
|
||
showLoading ?
|
||
<div
|
||
style={{
|
||
width: '100%',
|
||
height: '100%',
|
||
background: 'rgba(0,0,0,0.1)',
|
||
position: 'fixed',
|
||
zIndex: 5,
|
||
display: 'flex',
|
||
alignItems: 'center',
|
||
justifyContent: 'center'
|
||
}}
|
||
>
|
||
<div style={{
|
||
display: 'flex',
|
||
alignItems: 'center',
|
||
justifyContent: 'center',
|
||
padding: '15px 20px 10px',
|
||
background: '#fff',
|
||
borderRadius: '8px',
|
||
width: '200px'
|
||
}}>
|
||
<Spin />
|
||
<span style={{ marginLeft: '5px' }}>数据导出中...</span>
|
||
</div>
|
||
</div> : ''
|
||
}
|
||
|
||
<div className={'saleReportHideBox'} style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }}>
|
||
{
|
||
showExportTable && reqDetailList && reqDetailList.length > 0 ?
|
||
<ProTable
|
||
columns={columns}
|
||
dataSource={reqDetailList}
|
||
pagination={false}
|
||
expandable={{
|
||
defaultExpandAllRows: true
|
||
}}
|
||
/> : ''
|
||
}
|
||
</div>
|
||
<div id='hiddenBox' style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }} />
|
||
|
||
<div style={{ backgroundColor: '#fff', display: 'flex' }}>
|
||
<ProCard
|
||
style={{ width: !collapsible ? "300px" : "60px" }}
|
||
className="pageTable-leftnav"
|
||
bodyStyle={{ padding: 0, paddingTop: 20, paddingLeft: 20, width: !collapsible ? "300px" : "60px" }}
|
||
extra={<MenuFoldOutlined onClick={() => {
|
||
setCollapsible(!collapsible)
|
||
}} />}
|
||
colSpan={!collapsible ? "300px" : "60px"}
|
||
title={!collapsible ? "请选择业务类型" : ""}
|
||
headerBordered
|
||
collapsed={collapsible}
|
||
>
|
||
{treeView && treeView.length > 0 ? <Tree
|
||
checkable
|
||
treeData={[{
|
||
label: '全部',
|
||
value: 0,
|
||
key: '0-0',
|
||
children: treeView
|
||
}]}
|
||
fieldNames={{
|
||
title: "label",
|
||
key: "key"
|
||
}}
|
||
blockNode
|
||
defaultExpandedKeys={['0-0']}
|
||
onCheck={(checkedKeys: React.Key[] | any, info) => {
|
||
const selectedIds = info.checkedNodes.filter(n => n?.type === 2)
|
||
setSelectedId(selectedIds.map(n => n?.value)?.toString() || '')
|
||
// actionRef?.current?.reload()
|
||
// getData(selectedIds.map(n => n?.value)?.toString() || '')
|
||
}}
|
||
// switcherIcon={<PlusOutlined />}
|
||
/> : ''}
|
||
</ProCard>
|
||
<div style={{
|
||
width: !collapsible ? 'calc(100% - 300px)' : 'calc(100% - 60px)',
|
||
paddingTop: 0,
|
||
paddingBottom: 0,
|
||
paddingRight: 0
|
||
}}>
|
||
<ProTable
|
||
actionRef={actionRef}
|
||
formRef={formRef}
|
||
columns={columns}
|
||
bordered
|
||
expandable={{
|
||
expandRowByClick: true
|
||
}}
|
||
headerTitle={'业务配置'}
|
||
search={{ span: 6 }}
|
||
request={async (params) => {
|
||
if (!selectedId) {
|
||
return
|
||
}
|
||
const req: any = {
|
||
SearchParameter: {
|
||
OPERATION_TYPES: selectedId || '11',
|
||
APPROVALROUTE_VALID: 1,
|
||
APPROVALROUTE_STATES: params?.APPROVALROUTE_STATE || '',
|
||
},
|
||
|
||
PageIndex: 1,
|
||
PageSize: 999999
|
||
}
|
||
setSearchParams(params)
|
||
const data = await handleGetAPPROVALROUTEList(req)
|
||
if (data && data.length > 0) {
|
||
return { data, success: true }
|
||
}
|
||
return { data: [], success: true }
|
||
}}
|
||
toolbar={{
|
||
actions: [
|
||
<Button
|
||
key="new"
|
||
icon={<PlusOutlined />}
|
||
type="primary"
|
||
onClick={(e) => {
|
||
setModalVisible(true)
|
||
}}
|
||
>
|
||
新增环节
|
||
</Button>
|
||
]
|
||
}}
|
||
/>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<ModalForm
|
||
formRef={addFormRef}
|
||
title={currentRow ? "编辑环节" : "新建环节"}
|
||
visible={modalVisible}
|
||
layout={"horizontal"}
|
||
wrapperCol={{ span: 16 }}
|
||
labelCol={{ span: 6 }}
|
||
labelAlign="right"
|
||
width={600}
|
||
onVisibleChange={async (value) => {
|
||
if (!value) {
|
||
addFormRef.current?.resetFields();
|
||
setSelectRoleType(0)
|
||
setPlayerList([])
|
||
setDefaultPerson([])
|
||
setCurrentRow(undefined)
|
||
setNextBusinessTypeState([
|
||
{ label: '2000', value: 2000 },
|
||
{ label: '2010', value: 2010 },
|
||
{ label: '2020', value: 2020 },
|
||
{ label: '2030', value: 2030 },
|
||
{ label: '2040', value: 2040 },
|
||
{ label: '2050', value: 2050 },
|
||
{ label: '2060', value: 2060 },
|
||
{ label: '2070', value: 2070 },
|
||
{ label: '2080', value: 2080 },
|
||
{ label: '2090', value: 2090 },
|
||
{ label: '9000', value: 9000 },
|
||
])
|
||
} else {
|
||
if (currentRow) {
|
||
setSelectRoleTypeId(currentRow.SYSTEMROLEIDS)
|
||
if (currentRow?.APPROVALROUTE_STATE) {
|
||
const list: any = [{ label: '2000', value: 2000 },
|
||
{ label: '2010', value: 2010 },
|
||
{ label: '2020', value: 2020 },
|
||
{ label: '2030', value: 2030 },
|
||
{ label: '2040', value: 2040 },
|
||
{ label: '2050', value: 2050 },
|
||
{ label: '2060', value: 2060 },
|
||
{ label: '2070', value: 2070 },
|
||
{ label: '2080', value: 2080 },
|
||
{ label: '2090', value: 2090 },
|
||
{ label: '9000', value: 9000 }]
|
||
list.forEach((item: any) => {
|
||
if (item.value <= Number(currentRow?.APPROVALROUTE_STATE)) {
|
||
item.disabled = true
|
||
}
|
||
})
|
||
setNextBusinessTypeState(list)
|
||
}
|
||
else {
|
||
const list: any = [{ label: '2000', value: 2000 },
|
||
{ label: '2010', value: 2010 },
|
||
{ label: '2020', value: 2020 },
|
||
{ label: '2030', value: 2030 },
|
||
{ label: '2040', value: 2040 },
|
||
{ label: '2050', value: 2050 },
|
||
{ label: '2060', value: 2060 },
|
||
{ label: '2070', value: 2070 },
|
||
{ label: '2080', value: 2080 },
|
||
{ label: '2090', value: 2090 },
|
||
{ label: '9000', value: 9000 }]
|
||
list.forEach((item: any) => {
|
||
item.disabled = false
|
||
})
|
||
setNextBusinessTypeState(list)
|
||
}
|
||
addFormRef.current?.setFieldsValue({
|
||
...currentRow,
|
||
APPROVALSTAFF_ID: currentRow?.APPROVALSTAFF_ID.split(',')
|
||
})
|
||
|
||
const req: any = {
|
||
SearchParameter: {
|
||
USER_IDS: currentRow?.APPROVALSTAFF_ID
|
||
},
|
||
PageIndex: 1,
|
||
PageSize: 999999
|
||
}
|
||
const data = await handleGetUSERList(req)
|
||
if (data && data.length > 0) {
|
||
const list: any = []
|
||
data.forEach((item: any) => {
|
||
list.push({ label: item.USER_NAME, value: item.USER_ID.toString() })
|
||
})
|
||
setPlayerList(list)
|
||
setPlayDefaulterList(list)
|
||
}
|
||
}
|
||
}
|
||
}}
|
||
onFinish={() => {
|
||
addFormRef.current.validateFields().then(async (res: any) => {
|
||
if (res) {
|
||
let req: any = {}
|
||
if (currentRow) {
|
||
req = {
|
||
APPROVALROUTE_ID: currentRow?.APPROVALROUTE_ID,
|
||
APPROVALROUTE_NAME: res?.APPROVALROUTE_NAME || '',
|
||
APPROVALROUTE_STATE: res?.APPROVALROUTE_STATE || '',
|
||
OPERATION_TYPE: res?.OPERATION_TYPE || '',
|
||
USER_PATTERN: res?.USER_PATTERN,
|
||
APPROVALSTAFF_ID: res?.APPROVALSTAFF_ID ? res?.APPROVALSTAFF_ID.toString() : null,
|
||
APPROVALROUTE_VALID: 1,
|
||
// RECORD_DATE:moment().format('YYYY-MM-DD'),
|
||
NEXT_STATE: res?.NEXT_STATE
|
||
}
|
||
} else {
|
||
req = {
|
||
APPROVALROUTE_NAME: res?.APPROVALROUTE_NAME || '',
|
||
APPROVALROUTE_STATE: res?.APPROVALROUTE_STATE || '',
|
||
OPERATION_TYPE: res?.OPERATION_TYPE || '',
|
||
USER_PATTERN: res?.USER_PATTERN,
|
||
APPROVALSTAFF_ID: res?.APPROVALSTAFF_ID ? res?.APPROVALSTAFF_ID.toString() : null,
|
||
APPROVALROUTE_VALID: 1,
|
||
// RECORD_DATE:moment().format('YYYY-MM-DD'),
|
||
NEXT_STATE: res?.NEXT_STATE
|
||
}
|
||
}
|
||
|
||
const data = await handleSynchroAPPROVALROUTE(req)
|
||
if (data.Result_Code === 100) {
|
||
message.success('新增成功')
|
||
addFormRef.current?.resetFields();
|
||
setCurrentRow(undefined)
|
||
actionRef.current?.reload()
|
||
setModalVisible(false)
|
||
return true
|
||
}
|
||
message.error(data.Result_Desc)
|
||
|
||
}
|
||
})
|
||
|
||
}}
|
||
modalProps={{
|
||
modalRender: (modal) => {
|
||
return <Draggable
|
||
disabled={disabled}
|
||
bounds={bounds}
|
||
onStart={(event, uiData) => onDraggaleStart(event, uiData)}
|
||
>
|
||
<div ref={draggleRef}>{modal}</div>
|
||
</Draggable>
|
||
},
|
||
onCancel: () => {
|
||
setModalVisible(false)
|
||
},
|
||
}}
|
||
>
|
||
|
||
<ProFormTreeSelect
|
||
label={'业务类型'}
|
||
name={'OPERATION_TYPE'}
|
||
request={async (params) => {
|
||
if (treeView && treeView.length > 0) {
|
||
treeView.forEach((item: any) => {
|
||
item.disabled = true
|
||
})
|
||
}
|
||
return treeView
|
||
}}
|
||
fieldProps={{
|
||
treeDefaultExpandAll: true
|
||
// options: treeView || []
|
||
}}
|
||
rules={[
|
||
{
|
||
required: true,
|
||
message: '请选择业务类型',
|
||
},
|
||
]}
|
||
/>
|
||
<ProFormText
|
||
label={'环节名称'}
|
||
name={'APPROVALROUTE_NAME'}
|
||
rules={[
|
||
{
|
||
required: true,
|
||
message: '请输入环节名称',
|
||
},
|
||
]}
|
||
/>
|
||
|
||
<ProFormSelect
|
||
label={'业务状态'}
|
||
name={'APPROVALROUTE_STATE'}
|
||
fieldProps={{
|
||
options: businessTypeState || [],
|
||
onChange: (e) => {
|
||
if (e) {
|
||
const list: any = [{ label: '2000', value: 2000 },
|
||
{ label: '2010', value: 2010 },
|
||
{ label: '2020', value: 2020 },
|
||
{ label: '2030', value: 2030 },
|
||
{ label: '2040', value: 2040 },
|
||
{ label: '2050', value: 2050 },
|
||
{ label: '2060', value: 2060 },
|
||
{ label: '2070', value: 2070 },
|
||
{ label: '2080', value: 2080 },
|
||
{ label: '2090', value: 2090 },
|
||
{ label: '9000', value: 9000 }]
|
||
list.forEach((item: any) => {
|
||
if (item.value <= e) {
|
||
// if (item.value===e){
|
||
item.disabled = true
|
||
}
|
||
})
|
||
setNextBusinessTypeState(list)
|
||
} else {
|
||
const list: any = [{ label: '2000', value: 2000 },
|
||
{ label: '2010', value: 2010 },
|
||
{ label: '2020', value: 2020 },
|
||
{ label: '2030', value: 2030 },
|
||
{ label: '2040', value: 2040 },
|
||
{ label: '2050', value: 2050 },
|
||
{ label: '2060', value: 2060 },
|
||
{ label: '2070', value: 2070 },
|
||
{ label: '2080', value: 2080 },
|
||
{ label: '2090', value: 2090 },
|
||
{ label: '9000', value: 9000 }]
|
||
list.forEach((item: any) => {
|
||
item.disabled = false
|
||
})
|
||
setNextBusinessTypeState(list)
|
||
}
|
||
}
|
||
}}
|
||
rules={[
|
||
{
|
||
required: true,
|
||
message: '请选择业务状态',
|
||
},
|
||
]}
|
||
/>
|
||
|
||
<ProFormRadio.Group
|
||
label={'角色类型'}
|
||
name={'USER_PATTERN'}
|
||
options={[
|
||
{
|
||
label: "业主",
|
||
value: 1000,
|
||
},
|
||
{
|
||
label: "商户",
|
||
value: 2000,
|
||
}
|
||
]}
|
||
fieldProps={{
|
||
onChange: (e: any) => {
|
||
setSelectRoleType(Number(e.target.value))
|
||
}
|
||
}}
|
||
rules={[
|
||
{
|
||
required: true,
|
||
message: '请选择业务状态',
|
||
},
|
||
]}
|
||
>
|
||
</ProFormRadio.Group>
|
||
|
||
<ProFormSelect
|
||
label={'下一个业务状态'}
|
||
name={'NEXT_STATE'}
|
||
fieldProps={{
|
||
options: nextBusinessTypeState || []
|
||
}}
|
||
rules={[
|
||
{
|
||
required: true,
|
||
message: '请选择下一个业务状态',
|
||
},
|
||
]}
|
||
/>
|
||
|
||
|
||
{
|
||
selectRoleType === 2000 ? '' :
|
||
<ProFormSelect
|
||
label={'参与人'}
|
||
name={'APPROVALSTAFF_ID'}
|
||
fieldProps={{
|
||
options: playerList || [],
|
||
mode: 'multiple'
|
||
}}
|
||
// rules={[
|
||
// {
|
||
// required: true,
|
||
// message: '请选择参与人',
|
||
// },
|
||
// ]}
|
||
// disabled
|
||
addonAfter={
|
||
<Button type="primary" icon={<FileSearchOutlined />}
|
||
onClick={() => {
|
||
const res = addFormRef.current?.getFieldValue('APPROVALSTAFF_ID')
|
||
if (res && res.length > 0) {
|
||
const list: any = []
|
||
res.forEach((item: any) => {
|
||
list.push(Number(item))
|
||
})
|
||
setDefaultPerson(list)
|
||
} else {
|
||
setDefaultPerson([])
|
||
setPlayerList([])
|
||
}
|
||
setShowChosePlayer(true)
|
||
}}>
|
||
选择
|
||
</Button>}
|
||
/>
|
||
}
|
||
</ModalForm>
|
||
|
||
|
||
<Modal
|
||
title={'选择参与人'}
|
||
open={showChosePlayer}
|
||
width={1400}
|
||
// destroyOnClose={!modalVisible}
|
||
destroyOnClose
|
||
afterClose={() => {
|
||
}}
|
||
onCancel={() => {
|
||
setShowChosePlayer(false)
|
||
setDefaultPerson([])
|
||
}}
|
||
onOk={async () => {
|
||
const rowDetailList = choseDetail.current?.selectModalRowList
|
||
const rowList = choseDetail.current?.selectedModalOrderRowKeys
|
||
const chosePlaySelectId = choseDetail.current?.selectedId
|
||
setSelectRoleTypeId(chosePlaySelectId)
|
||
addFormRef.current?.setFieldsValue({
|
||
APPROVALSTAFF_ID: rowList
|
||
})
|
||
setDefaultPerson([])
|
||
if (rowDetailList && rowDetailList.length > 0) {
|
||
console.log('rowDetailList', rowDetailList)
|
||
// 去重
|
||
const indexList: any = []
|
||
// 去重后的list
|
||
const deduplicationList: any = []
|
||
rowDetailList.forEach((item: any) => {
|
||
if (indexList && indexList.length > 0) {
|
||
if (indexList.indexOf(item.value) === -1) {
|
||
indexList.push(item.value)
|
||
deduplicationList.push(item)
|
||
}
|
||
} else {
|
||
indexList.push(item.value)
|
||
deduplicationList.push(item)
|
||
}
|
||
})
|
||
console.log('deduplicationList', deduplicationList)
|
||
setPlayerList(deduplicationList)
|
||
} else {
|
||
const req: any = {
|
||
SearchParameter: {
|
||
USER_IDS: rowList && rowList.length > 0 ? rowList.toString() : ''
|
||
},
|
||
PageIndex: 1,
|
||
PageSize: 999999
|
||
}
|
||
const data = await handleGetUSERList(req)
|
||
if (data && data.length > 0) {
|
||
const list: any = []
|
||
data.forEach((item: any) => {
|
||
list.push({ label: item.USER_NAME, value: Number(item.USER_ID) })
|
||
})
|
||
setPlayerList(list)
|
||
setPlayDefaulterList(list)
|
||
}
|
||
}
|
||
|
||
setShowChosePlayer(false)
|
||
setDefaultPerson([])
|
||
// // 去重
|
||
// const newList: any = []
|
||
// if (rowDetailList && rowDetailList.length>0){
|
||
// const indexList: any = []
|
||
// rowDetailList.forEach((item: any)=>{
|
||
// if (indexList.indexOf(Number(item.value))===-1){
|
||
// newList.push(item)
|
||
// indexList.push(Number(item.value))
|
||
// }
|
||
// })
|
||
// }
|
||
// setPlayerList(newList)
|
||
// addFormRef.current?.setFieldsValue({
|
||
// APPROVALSTAFF_ID: rowList
|
||
// })
|
||
// setShowChosePlayer(false)
|
||
// setDefaultPerson([])
|
||
}}
|
||
>
|
||
<ChosePlayers playerList={playerList} defaultPerson={defaultPerson} currentRow={currentRow} modalVisible={modalVisible}
|
||
onRef={choseDetail} showChosePlayer={showChosePlayer} currentUser={currentUser} selectRoleTypeId={selectRoleTypeId} />
|
||
</Modal>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export default connect(({
|
||
user
|
||
}: ConnectState) => ({
|
||
currentUser: user.currentUser
|
||
}))(ServiceConfig);
|