369 lines
12 KiB
TypeScript
369 lines
12 KiB
TypeScript
![]() |
/*
|
|||
|
* @Author: liqiang
|
|||
|
* @Date: 2021-03-04 17:19:02
|
|||
|
* @LastEditTime: 2021-04-01 14:05:08
|
|||
|
* @LastEditors: Please set LastEditors
|
|||
|
* @Description: In User Settings Edit
|
|||
|
* @FilePath: \ebtp-cloud-frontend\src\utils\IParticipateIn.tsx
|
|||
|
*/
|
|||
|
import { participationSave, participationSaveOther } from '@/pages/Tender/supplier/LookingForBusinessOpportunities/service';
|
|||
|
import ProTable from '@ant-design/pro-table';
|
|||
|
import { Button, Card, Checkbox, Form, Input, message, Modal } from 'antd';
|
|||
|
import React, { useEffect, useState } from 'react';
|
|||
|
import { useHistory } from 'umi';
|
|||
|
import { getBidMethodDictTypeCode, getProTypeCodeByBidMethodDict, isNotEmpty } from './CommonUtils';
|
|||
|
import { queryingPagingData } from './PageUtils';
|
|||
|
|
|||
|
interface IParticipateInItem {
|
|||
|
projectData: any,
|
|||
|
visible: boolean,
|
|||
|
setVisible: (value: boolean) => void
|
|||
|
}
|
|||
|
|
|||
|
/**
|
|||
|
* 获取标段名称
|
|||
|
* @param bidMethodDict
|
|||
|
*/
|
|||
|
function getBsName(bidMethodDict: string) {
|
|||
|
if (bidMethodDict.indexOf("procurement_mode_4") !== -1) {
|
|||
|
return '包件';
|
|||
|
}
|
|||
|
if (bidMethodDict.indexOf("procurement_mode_3") !== -1 || bidMethodDict.indexOf("procurement_mode_5") !== -1) {
|
|||
|
return '采购包';
|
|||
|
}
|
|||
|
return '标段';
|
|||
|
}
|
|||
|
|
|||
|
function getSectionCheckbox(data: any) {
|
|||
|
let value = [];
|
|||
|
let flag = true;
|
|||
|
for (const item of data) {
|
|||
|
if (flag) {
|
|||
|
value.push(
|
|||
|
<Checkbox key={item.bsId} style={{ marginLeft: '8px' }} value={item.bsId}>
|
|||
|
{item.bsName}
|
|||
|
</Checkbox>
|
|||
|
)
|
|||
|
flag = false;
|
|||
|
} else {
|
|||
|
value.push(
|
|||
|
<Checkbox key={item.bsId} value={item.bsId}>
|
|||
|
{item.bsName}
|
|||
|
</Checkbox>
|
|||
|
)
|
|||
|
}
|
|||
|
|
|||
|
}
|
|||
|
return value;
|
|||
|
}
|
|||
|
const modalHeight = innerHeight * 96 / 100;
|
|||
|
/**
|
|||
|
* 我要参与
|
|||
|
* @param props
|
|||
|
*/
|
|||
|
const IParticipateIn: React.FC<IParticipateInItem> = (props) => {
|
|||
|
const { projectData, visible, setVisible } = props;
|
|||
|
const [form] = Form.useForm();
|
|||
|
//保存遮罩
|
|||
|
const [spinningLoading, setSpinningLoading] = useState<boolean>(false);
|
|||
|
//常用联系人模态框
|
|||
|
const [contactsVisible, setContactsVisible] = useState<boolean>(false);
|
|||
|
//标段名称
|
|||
|
const [bsName, setBsName] = useState<string>('');
|
|||
|
//标段多选
|
|||
|
const [sectionCheckbox, setSectionCheckbox] = useState<any[]>();
|
|||
|
//采购方式
|
|||
|
const [bidMethodDict, setBidMethodDict] = useState<string>('');
|
|||
|
const history = useHistory();
|
|||
|
//联系人数据
|
|||
|
const [contactsItem, setContactsItem] = useState<any>(null);
|
|||
|
useEffect(() => {
|
|||
|
if (isNotEmpty(projectData)) {
|
|||
|
setBsName(getBsName(projectData.bidMethodDict));
|
|||
|
setBidMethodDict(projectData.bidMethodDict);
|
|||
|
//标段信息
|
|||
|
let sectionVOList = projectData.sectionVOList;
|
|||
|
if (sectionVOList.length === 0) {
|
|||
|
// 当前项目报名截止!
|
|||
|
message.warning('当前项目报名截止!');
|
|||
|
return;
|
|||
|
}
|
|||
|
setSectionCheckbox(getSectionCheckbox(sectionVOList));
|
|||
|
form.resetFields();
|
|||
|
setContactsItem(null);
|
|||
|
let examinationMethodDict = "";
|
|||
|
if (bidMethodDict.indexOf("procurement_mode_4") > -1) {
|
|||
|
examinationMethodDict = projectData?.examinationMethodDict.replace("recruitment_method_", "")
|
|||
|
}
|
|||
|
form.setFieldsValue({
|
|||
|
recruitType: examinationMethodDict,
|
|||
|
projectId: projectData.id,
|
|||
|
roomType: projectData.roomType
|
|||
|
})
|
|||
|
}
|
|||
|
}, [projectData]);
|
|||
|
|
|||
|
/**
|
|||
|
* 表单提交
|
|||
|
* @param value
|
|||
|
*/
|
|||
|
const formOnFinish = (value: any) => {
|
|||
|
setSpinningLoading(true);
|
|||
|
// value.bizSupplierContact = contactsItem === null ? {
|
|||
|
// contactName: value.contactName,
|
|||
|
// contactTelephone: value.contactTelephone,
|
|||
|
// contactEmail: value.contactEmail,
|
|||
|
// contactAddress: value.contactAddress,
|
|||
|
// fixedLine: value.fixedLine,
|
|||
|
// contactFax: value.contactFax
|
|||
|
// } : contactsItem;
|
|||
|
value.bizSupplierContact = form.getFieldsValue();
|
|||
|
delete value['id'];
|
|||
|
/*招募方式 调用特殊接口 2021 02 08 dqh*/
|
|||
|
if (bidMethodDict.indexOf("procurement_mode_4") > -1) {
|
|||
|
participationSaveOther(value).then(res => {
|
|||
|
if (res.data) {
|
|||
|
message.success('操作成功!', 2, () => {
|
|||
|
history.push(`${getBidMethodDictTypeCode(bidMethodDict)}/Involved`);
|
|||
|
setSpinningLoading(false);
|
|||
|
});
|
|||
|
} else {
|
|||
|
setSpinningLoading(false);
|
|||
|
message.error('操作失败!');
|
|||
|
}
|
|||
|
})
|
|||
|
} else {
|
|||
|
participationSave(value).then(res => {
|
|||
|
if (res.data) {
|
|||
|
message.success('操作成功!', 2, () => {
|
|||
|
history.push(`${getBidMethodDictTypeCode(bidMethodDict)}/Involved`);
|
|||
|
setSpinningLoading(false);
|
|||
|
});
|
|||
|
} else {
|
|||
|
setSpinningLoading(false);
|
|||
|
message.error('操作失败!');
|
|||
|
}
|
|||
|
})
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
/**
|
|||
|
* 常用联系人
|
|||
|
*/
|
|||
|
const contacts = () => {
|
|||
|
const onCancel = () => setContactsVisible(false);
|
|||
|
const select = (data: any) => {
|
|||
|
form.setFieldsValue(data);
|
|||
|
setContactsItem(data);
|
|||
|
setContactsVisible(false);
|
|||
|
}
|
|||
|
|
|||
|
const columns: any[] = [
|
|||
|
{
|
|||
|
title: '序号',
|
|||
|
valueType: 'index',
|
|||
|
width: '7%'
|
|||
|
},
|
|||
|
{
|
|||
|
title: '姓名',
|
|||
|
dataIndex: 'contactName',
|
|||
|
width: '15%'
|
|||
|
},
|
|||
|
{
|
|||
|
title: 'id',
|
|||
|
dataIndex: 'id',
|
|||
|
hideInTable: true,
|
|||
|
},
|
|||
|
{
|
|||
|
title: '手机号码',
|
|||
|
dataIndex: 'contactTelephone',
|
|||
|
search: false,
|
|||
|
width: '15%'
|
|||
|
},
|
|||
|
{
|
|||
|
title: '地址',
|
|||
|
dataIndex: 'contactAddress',
|
|||
|
search: false,
|
|||
|
width: '25%'
|
|||
|
},
|
|||
|
{
|
|||
|
title: '电子邮箱',
|
|||
|
dataIndex: 'contactEmail',
|
|||
|
search: false,
|
|||
|
width: '13%'
|
|||
|
},
|
|||
|
{
|
|||
|
title: '操作',
|
|||
|
valueType: 'option',
|
|||
|
width: '5%',
|
|||
|
render: (_: any, record: any) => [
|
|||
|
<a key="select" onClick={() => select(record)}>选择</a>
|
|||
|
]
|
|||
|
},
|
|||
|
]
|
|||
|
return (
|
|||
|
<>
|
|||
|
<Modal visible={contactsVisible}
|
|||
|
title="选择常用联系人"
|
|||
|
onCancel={onCancel}
|
|||
|
width={900}
|
|||
|
style={{ maxHeight: modalHeight }}
|
|||
|
bodyStyle={{ maxHeight: modalHeight - 107, overflowY: 'auto' }}
|
|||
|
maskClosable={false}
|
|||
|
footer={null}
|
|||
|
centered
|
|||
|
>
|
|||
|
<Card>
|
|||
|
<ProTable
|
|||
|
rowKey="id"
|
|||
|
pagination={{ defaultPageSize: 10 }}
|
|||
|
size="small"
|
|||
|
columns={columns}
|
|||
|
options={false}
|
|||
|
request={params => queryingPagingData('/api/biz-service-ebtp-tender/v1/bizsuppliercontact/getSupplierContactByParam', 'post', params)}
|
|||
|
/>
|
|||
|
</Card>
|
|||
|
</Modal>
|
|||
|
</>
|
|||
|
)
|
|||
|
}
|
|||
|
|
|||
|
|
|||
|
const createForm = () => {
|
|||
|
return (<Form
|
|||
|
labelCol={{ span: 6 }}
|
|||
|
wrapperCol={{ span: 13 }}
|
|||
|
form={form}
|
|||
|
onFinish={formOnFinish}
|
|||
|
>
|
|||
|
<h2 style={{ margin: '0px 0px 20px 0px' }}>
|
|||
|
您即将参与 {projectData?.projectName},请填写下列信息:
|
|||
|
</h2>
|
|||
|
<Form.Item
|
|||
|
name="projectId"
|
|||
|
hidden
|
|||
|
>
|
|||
|
<Input />
|
|||
|
</Form.Item>
|
|||
|
<Form.Item
|
|||
|
name="recruitType"
|
|||
|
hidden
|
|||
|
>
|
|||
|
<Input />
|
|||
|
</Form.Item>
|
|||
|
<Form.Item
|
|||
|
name="id"
|
|||
|
hidden
|
|||
|
>
|
|||
|
<Input />
|
|||
|
</Form.Item>
|
|||
|
<Form.Item
|
|||
|
name="roomType"
|
|||
|
hidden
|
|||
|
>
|
|||
|
<Input />
|
|||
|
</Form.Item>
|
|||
|
|
|||
|
<Form.Item
|
|||
|
label="联系人"
|
|||
|
name="contactName"
|
|||
|
rules={[{ required: true }]}
|
|||
|
>
|
|||
|
<Input maxLength={32} addonAfter={(<a onClick={() => setContactsVisible(true)}>常用联系人</a>)} />
|
|||
|
</Form.Item>
|
|||
|
|
|||
|
<Form.Item
|
|||
|
label="联系电话"
|
|||
|
name="contactTelephone"
|
|||
|
rules={[{ required: true },
|
|||
|
{ pattern: /^[1][3,4,5,6,7,8,9][0-9]{9}$/, message: '请输入正确的电话号码' }
|
|||
|
]}
|
|||
|
extra={<span style={{ color: '#b30000' }}>平台短信提醒功能仅支持联通号段,其他运营商号段暂不支持</span>}
|
|||
|
>
|
|||
|
<Input maxLength={14} />
|
|||
|
</Form.Item>
|
|||
|
|
|||
|
|
|||
|
<Form.Item
|
|||
|
label="邮箱"
|
|||
|
name="contactEmail"
|
|||
|
rules={[{ required: true }, { type: 'email', message: '请输入正确的邮箱格式' }]}
|
|||
|
>
|
|||
|
<Input maxLength={32} />
|
|||
|
</Form.Item>
|
|||
|
|
|||
|
<Form.Item
|
|||
|
label="地址"
|
|||
|
name="contactAddress"
|
|||
|
>
|
|||
|
<Input maxLength={100} />
|
|||
|
</Form.Item>
|
|||
|
|
|||
|
<Form.Item
|
|||
|
label="固定电话"
|
|||
|
name="fixedLine"
|
|||
|
rules={[
|
|||
|
{ pattern: /^(\(\d{3,4}\)|\d{3,4}-|\s)?\d{7,14}$/, message: '请输入正确的固定电话号码' }
|
|||
|
]}
|
|||
|
>
|
|||
|
<Input maxLength={32} />
|
|||
|
</Form.Item>
|
|||
|
|
|||
|
<Form.Item
|
|||
|
label="传真"
|
|||
|
name="contactFax"
|
|||
|
rules={[{ pattern: /^(\d{3,4}-)?\d{7,8}$/, message: '请输入正确的传真格式' }]}
|
|||
|
>
|
|||
|
<Input maxLength={32} />
|
|||
|
</Form.Item>
|
|||
|
|
|||
|
<Form.Item
|
|||
|
label={`选择${bsName}`}
|
|||
|
name="packageIdList"
|
|||
|
rules={[{ required: true }]}
|
|||
|
>
|
|||
|
<Checkbox.Group>
|
|||
|
{sectionCheckbox}
|
|||
|
</Checkbox.Group>
|
|||
|
</Form.Item>
|
|||
|
|
|||
|
</Form>
|
|||
|
)
|
|||
|
}
|
|||
|
/**
|
|||
|
* 我要参与
|
|||
|
*/
|
|||
|
const modalBox = () => {
|
|||
|
const OnOk = (): void => form.submit();
|
|||
|
const onCancel = (): void => setVisible(false);
|
|||
|
return (
|
|||
|
<>
|
|||
|
<Modal visible={visible}
|
|||
|
title="我要参与"
|
|||
|
onOk={OnOk}
|
|||
|
onCancel={onCancel}
|
|||
|
width="40%"
|
|||
|
maskClosable={false}
|
|||
|
centered
|
|||
|
style={{ maxHeight: modalHeight }}
|
|||
|
bodyStyle={{ maxHeight: modalHeight - 107, overflowY: 'auto' }}
|
|||
|
footer={[
|
|||
|
<Button key="back" onClick={onCancel}>
|
|||
|
取消
|
|||
|
</Button>,
|
|||
|
<Button key="submit" type="primary" loading={spinningLoading} onClick={OnOk}>
|
|||
|
保存
|
|||
|
</Button>,
|
|||
|
]}
|
|||
|
>
|
|||
|
{createForm()}
|
|||
|
</Modal>
|
|||
|
{contacts()}
|
|||
|
</>
|
|||
|
)
|
|||
|
}
|
|||
|
|
|||
|
return modalBox();
|
|||
|
}
|
|||
|
|
|||
|
export default IParticipateIn;
|