const bkChange = (name, value) => {
const bkTaskList = form.getFieldValue("bkTaskList");
const bkTaskListValue = JSON.parse(JSON.stringify(bkTaskList));
bkTaskListValue.map((i, index) => {
i.time = bkTaskList?.[index]?.time;
});
if (value.indexOf(2) !== -1) {
if (bkTaskListValue[name]) {
bkTaskListValue[name].jobType = [value.pop()];
}
}
form.setFieldsValue({
bkTaskList: bkTaskListValue
});
};
const cxChange = (name, value) => {
const searchTaskList = form.getFieldValue("searchTaskList");
const searchTaskListValue = JSON.parse(JSON.stringify(searchTaskList));
searchTaskListValue.map((i, index) => {
i.time = searchTaskList?.[index]?.time;
});
if (value.indexOf(5) !== -1) {
if (searchTaskListValue[name]) {
searchTaskListValue[name].jobType = [value.pop()];
}
}
form.setFieldsValue({
searchTaskList: searchTaskListValue,
});
};
const changePlaceholder = (name, key) => {
const jobType = form.getFieldValue(name)[key]?.jobType;
if (name === 'searchTaskList') {
if (jobType && jobType.indexOf(5) !== -1) {
return "请输入群id(cid)";
}
return "填写查询群ID/查询个人ID";
}
if (name === 'bkTaskList') {
if (jobType && jobType.indexOf(2) !== -1) {
return "请输入群id(cid)";
}
return "填写查询群ID/查询个人ID";
}
};
const pattern = (name, key) => (changePlaceholder(name, key) === "请输入群id(cid)" ? new RegExp(/^cid\d+(,cid\d+)*$/g) : null);
const validate = (formField, key) => {
if (formField === 'bk') {
form.getFieldValue(['bkTaskList', key, 'bkId']) && form.validateFields(['bkTaskList', key], { recursive: true })
}
if (formField === 'search') {
form.getFieldValue(['searchTaskList', key, 'searchId']) && form.validateFields(['searchTaskList', key], { recursive: true })
}
}
return (
<>
<Form
form={form}
name="basic"
labelCol={{ span: 8 }}
wrapperCol={{ span: 12 }}
initialValues={{ remember: true }}
onFinish={checkWhiteList}
>
<Row>
<Col span={12}>
<Form.Item
label="文书ID"
name="docName"
{...formItemLayout}
rules={[{ required: true, message: '请输入文书ID' },
]}
>
<Input placeholder="文书ID" />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label="文书名称"
{...formItemLayout}
name="jobName"
rules={[{ required: true, message: '请输入文书名称' },
]}
>
<Input placeholder="文书名称" />
</Form.Item>
</Col>
</Row>
<Row>
<Col span={12}>
<Form.Item
label="任务类型"
name="jobType"
{...formItemLayout}
rules={[{ required: true, message: '任务类型' },
]}
>
<Select onChange={changeJobType} mode="multiple" allowClear placeholder="任务类型">
<Option value="BK">BK</Option>
<Option value="查询">查询</Option>
</Select>
</Form.Item>
</Col>
</Row>
{form.getFieldValue('jobType')?.indexOf('BK') >= 0 &&
<Form.List
name="bkTaskList"
initialValue={[{}]}
>
{(fields, { add, remove }) => (
<>
{fields.map(({ key, name, ...restField }) => (
<div className="formListWrap">
<div className="formListItem">
<Form.Item
{...restField}
label={`布控任务配置-组 ${name + 1}`}
name={[name, 'jobType']}
{...formListLayout}
rules={[{ required: true, message: '请选择详细类型' }]}
>
<Select
allowClear
className="type"
placeholder="选择详细类型"
onChange={(value) => { bkChange(name, value); validate('bk', key) }}
mode="multiple"
>
<Option value={1}>私聊BK</Option>
<Option value={2}>群聊BK</Option>
<Option value={3}>手机号群聊BK</Option>
</Select>
</Form.Item>
<Form.Item
{...restField}
name={[name, 'bkId']}
rules={[{
required: true,
message: changePlaceholder('bkTaskList', key),
pattern: pattern('bkTaskList', key)
}]}
>
<Input.TextArea autoSize={{ minRows: 2, maxRows: 10 }} placeholder={changePlaceholder('bkTaskList', key)} className="searchId" />
</Form.Item>
<Form.Item
{...restField}
name={[name, 'time']}
rules={[{ required: true, message: '请选择日期' }]}
initialValue={moment().add(30, "day")}
>
<DatePicker
format="YYYY-MM-DD HH:mm:ss"
disabledDate={disabledDateB}
showNow={false}
className="time"
placeholder='结束时间'
/>
</Form.Item>
</div>
{(name !== 0) && <DeleteTwoTone twoToneColor="red" className="delIcon" onClick={() => remove(name)} />}
</div>
))}
<div className="add">
<span onClick={() => add()}>新增一组布控配置</span>
</div>
</>
)}
</Form.List>}
{form.getFieldValue('jobType')?.indexOf('查询') >= 0 &&
<Form.List
name="searchTaskList"
initialValue={[{}]}
>
{(fields, { add, remove }) => (
<>
{fields.map(({ key, name, ...restField }) => (
<div className="formListWrap">
<div className="formListItem">
<Form.Item
{...restField}
label={`查询任务配置-组 ${name + 1}`}
name={[name, 'jobType']}
{...formListLayout}
rules={[{ required: true, message: '请选择详细类型' }]}
>
<Select
allowClear
placeholder="选择详细类型"
className="type"
mode="multiple"
onChange={(value) => { cxChange(name, value); validate('search', key) }}
>
<Option value={1} >注册</Option>
<Option value={2} >登录</Option>
<Option value={3} >好友</Option>
<Option value={4} >账号加入群</Option>
<Option value={5} >群成员</Option>
</Select>
</Form.Item>
<Form.Item
{...restField}
name={[name, 'searchId']}
rules={[{
required: true,
message: changePlaceholder('searchTaskList', key),
pattern: pattern('searchTaskList', key)
}]}
>
<Input.TextArea autoSize={{ minRows: 2, maxRows: 10 }} placeholder={changePlaceholder('searchTaskList', key)} className="searchId" />
</Form.Item>
<Form.Item
{...restField}
name={[name, 'time']}
rules={[{ required: true, message: '请选择日期' }]}
initialValue={[
moment(moment().startOf('d'), 'YYYY/MM/DD HH:mm:ss'),
moment(moment().endOf('d'), 'YYYY/MM/DD HH:mm:ss'),
]}
>
<RangePicker
disabledDate={disabledDate}
showTime={{
defaultValue: [moment('00:00:00', 'HH:mm:ss'), moment('23:59:59', 'HH:mm:ss')]
}}
className="time"
/>
</Form.Item>
</div>
{(name !== 0) && <DeleteTwoTone twoToneColor="red" className="delIcon" onClick={() => remove(name)} />}
</div>
))}
<div className="add">
<span onClick={() => add()}>新增一组查询配置</span>
</div>
</>
)}
</Form.List>}
<Row>
<Col span={24}>
<Form.Item
name="docContent"
label="文书内容"
labelCol={{ span: 3 }}
wrapperCol={{ span: 20 }}
rules={[{ required: true, message: '任务类型' }]}
>
<Input.TextArea placeholder="文书内容" />
</Form.Item>
<Form.Item wrapperCol={{ ...layout.wrapperCol, offset: 10 }} className="but">
<Space>
<Button type="primary" htmlType="submit">
创建
</Button>
<Button type="primary" onClick={cancle}>
取消
</Button>
</Space>
</Form.Item>
</Col>
</Row>
</Form>
</>
);