/*
|
* @Company: hugeInfo
|
* @Author: ldh
|
* @Date: 2022-07-13 17:02:02
|
* @LastEditTime: 2022-11-01 20:08:26
|
* @LastEditors: ldh
|
* @Version: 1.0.0
|
* @Description: 工作流模板管理 - 新增，修改
|
*/
|
import React, { useState, useEffect } from 'react';
|
import { useNavigate, useSearchParams, useLocation } from 'react-router-dom';
|
import { Button, Form, Space, Typography, Row, Col, Input, Radio, Checkbox } from 'antd';
|
import Page from '../../../components/Page';
|
import * as $$ from '../../../utils/utility';
|
|
const { TextArea } = Input;
|
|
const WorkflowTemplateEdit = () => {
|
const navigate = useNavigate();
|
|
const location = useLocation();
|
|
const [searchParams] = useSearchParams();
|
|
// 区别新增 or 修改
|
const editType = searchParams.get('editType') || 'add';
|
|
const [form] = Form.useForm();
|
|
const title = `${editType === 'add' ? '新建' : '修改'}工作流模板`;
|
|
// 表单提交
|
function handleSubmitForm(values) {
|
$$.modalInfo({ title: '工作流模板新建确认', content: `确定建立「婚姻纠纷通用调解流程」吗？`, cancelText: '我再想想', okText: '确定创建' });
|
}
|
|
useEffect(() => {
|
console.log(location.state);
|
}, [editType]);
|
|
return (
|
<Page
|
pageHead={{
|
title: title,
|
subtitle: '新建平台内的工作流模板信息',
|
breadcrumbData: [{ title: '工作流模板管理', url: '/mediate/workflowTemplate' }, { title: title }],
|
handleReturn: () => navigate(-1),
|
}}
|
>
|
<div className="workflowTemplate-detail">
|
<h4>{title}</h4>
|
<div className="workflowTemplate-detail-form">
|
<Form
|
layout="vertical"
|
form={form}
|
requiredMark={false}
|
onFinish={handleSubmitForm}
|
onFinishFailed={({ values, errorFields, outOfDate }) => $$.info({ type: 'error', content: errorFields[0].errors })}
|
>
|
<Row gutter={[16, 16]}>
|
<Col span={24}>
|
<Form.Item
|
name="xxx1"
|
label={
|
<span>
|
流程模板名称<span className="leftRequired">*</span>
|
</span>
|
}
|
rules={[{ required: true, message: '输入流程模板名称' }]}
|
>
|
<Input placeholder="输入流程模板名称" allowClear />
|
</Form.Item>
|
</Col>
|
<Col span={24}>
|
<Form.Item name="xxx2" label="流程模板类型" rules={[{ required: true }]}>
|
<Radio.Group>
|
<Space direction="vertical">
|
<Radio value={1}>纠纷调解</Radio>
|
<Radio value={2}>司法确认</Radio>
|
</Space>
|
</Radio.Group>
|
</Form.Item>
|
</Col>
|
<Col span={24}>
|
<Form.Item
|
name="xxx3"
|
label={
|
<div className="workflowTemplate-detail-formFlex">
|
<span>适用客户</span>
|
<Typography.Link>全选</Typography.Link>
|
</div>
|
}
|
>
|
<Checkbox.Group style={{ width: '100%' }}>
|
<Row>
|
<Col
|
span={24}
|
className={`workflowTemplate-detail-checkbox workflowTemplate-detail-checkboxActive`}
|
style={{ padding: '4px 12px' }}
|
>
|
<Checkbox value={1}>荔湾区政法委</Checkbox>
|
</Col>
|
<Col span={24} className="workflowTemplate-detail-checkbox">
|
<Checkbox value={2}>白云区政法委</Checkbox>
|
</Col>
|
</Row>
|
</Checkbox.Group>
|
</Form.Item>
|
</Col>
|
<Col span={24}>
|
<Form.Item label="流程模板描述" name="xxx4">
|
<TextArea rows={2} placeholder="描述流程模板应用的场景" allowClear />
|
</Form.Item>
|
</Col>
|
</Row>
|
</Form>
|
</div>
|
<div>
|
<Button type="primary" onClick={() => form.submit()}>
|
保存信息
|
</Button>
|
</div>
|
</div>
|
</Page>
|
);
|
};
|
|
export default WorkflowTemplateEdit;
|
