508 lines
18 KiB
JavaScript
508 lines
18 KiB
JavaScript
import React, { useEffect, useState } from "react";
|
||
import {
|
||
Tag,
|
||
Button,
|
||
Card,
|
||
Form,
|
||
Input,
|
||
InputNumber,
|
||
Select,
|
||
DatePicker,
|
||
Row,
|
||
Col,
|
||
Flex,
|
||
message,
|
||
Spin,
|
||
} from "antd";
|
||
import dayjs from "dayjs";
|
||
import { Connect } from "@cqsjjb/jjb-dva-runtime";
|
||
import { NS_SAFETY_EVAL_BUSINESS } from "~/enumerate/namespace";
|
||
import { district } from "~/enumerate/constant";
|
||
import { phoneRule } from "~/utils/validators";
|
||
import { tools } from "@cqsjjb/jjb-common-lib";
|
||
import AttachmentUpload from "~/components/AttachmentUpload";
|
||
|
||
const { router } = tools;
|
||
const { TextArea } = Input;
|
||
|
||
const PROJECT_TYPE_OPTIONS = [
|
||
{ label: "新建项目", value: "NEW" },
|
||
{ label: "续评项目", value: "RENEW" },
|
||
{ label: "变更项目", value: "CHANGE" },
|
||
];
|
||
|
||
const EVAL_TYPE_OPTIONS = [
|
||
{ label: "安全预评价", value: "PRE" },
|
||
{ label: "安全验收评价", value: "ACCEPT" },
|
||
{ label: "安全现状评价", value: "STATUS" },
|
||
];
|
||
|
||
const YES_NO_OPTIONS = [
|
||
{ label: "是", value: 1 },
|
||
{ label: "否", value: 2 },
|
||
];
|
||
|
||
const ContractContent = (props) => {
|
||
const [form] = Form.useForm();
|
||
|
||
const projectId = router.query?.id;
|
||
|
||
const {
|
||
safetyEvalBusiness,
|
||
evalContractGet,
|
||
evalContractSave,
|
||
customerDetail,
|
||
} = props;
|
||
const { contractLoading, contractSaveLoading, evalProjectDetailData } =
|
||
safetyEvalBusiness || {};
|
||
|
||
const fetchData = async () => {
|
||
if (!projectId) return;
|
||
|
||
const res = await evalContractGet({ projectId });
|
||
if (res?.success !== false && res?.data) {
|
||
form.setFieldsValue({
|
||
...res.data,
|
||
scanFileUrl: res.data.scanFileUrl? JSON.parse(res.data.scanFileUrl) :undefined,
|
||
contractStartDate: res.data.contractStartDate
|
||
? dayjs(res.data.contractStartDate)
|
||
: undefined,
|
||
contractEndDate: res.data.contractEndDate
|
||
? dayjs(res.data.contractEndDate)
|
||
: undefined,
|
||
});
|
||
} else {
|
||
const orgInfo = JSON.parse(sessionStorage.getItem("orgInfo"));
|
||
|
||
form.setFieldsValue({
|
||
orgName: orgInfo?.unitName,
|
||
projectName: evalProjectDetailData?.projectName,
|
||
evalTypeCode: evalProjectDetailData?.evalTypeCode,
|
||
projectRegion: evalProjectDetailData?.districtCode,
|
||
});
|
||
const customerRes = await customerDetail({
|
||
id: evalProjectDetailData.customerId,
|
||
});
|
||
if (customerRes?.success && customerRes?.data) {
|
||
form.setFieldsValue({
|
||
enterpriseName: customerRes.data.customerName,
|
||
officeAddress: customerRes.data.businessAddress,
|
||
creditCode: customerRes.data.creditCode,
|
||
legalPerson: customerRes.data.legalRepresentative,
|
||
contactName: customerRes.data.principalName,
|
||
contactPhone: customerRes.data.principalPhone,
|
||
});
|
||
}
|
||
}
|
||
};
|
||
|
||
useEffect(() => {
|
||
if (evalProjectDetailData?.id) {
|
||
fetchData();
|
||
}
|
||
}, [projectId, evalProjectDetailData?.id]);
|
||
|
||
const handleSave = async () => {
|
||
try {
|
||
const values = await form.validateFields();
|
||
const { contractStartDate, contractEndDate, ...rest } = values;
|
||
const res = await evalContractSave({
|
||
...rest,
|
||
projectId,
|
||
contractStartDate: contractStartDate
|
||
? contractStartDate.format("YYYY-MM-DD")
|
||
: undefined,
|
||
contractEndDate: contractEndDate
|
||
? contractEndDate.format("YYYY-MM-DD")
|
||
: undefined,
|
||
scanFileUrl: rest.scanFileUrl? JSON.stringify(rest.scanFileUrl) :undefined,
|
||
});
|
||
if (res?.success !== false) {
|
||
message.success("合同保存成功");
|
||
props.getDetail();
|
||
}
|
||
} finally {
|
||
}
|
||
};
|
||
|
||
return (
|
||
<Spin spinning={contractLoading}>
|
||
<div>
|
||
<div className="pf-permission">
|
||
<Tag color="blue" className="pf-tag">
|
||
机构管理员 / 项目负责人
|
||
</Tag>
|
||
<span className="pf-desc">
|
||
按照已批准的风险分析结论录入项目合同和被评价企业信息，上传PDF格式的正式合同扫描件。
|
||
</span>
|
||
</div>
|
||
<Card title="项目合同信息" styles={{ header: { textAlign: "center" } }}>
|
||
<Form form={form} layout="vertical">
|
||
<Card
|
||
type="inner"
|
||
size="small"
|
||
title="项目合同信息"
|
||
extra={<Tag color="blue">合同基本信息</Tag>}
|
||
className="pf-section"
|
||
>
|
||
<Row gutter={16}>
|
||
<Col span={24}>
|
||
<Form.Item
|
||
label="机构名称"
|
||
name="orgName"
|
||
rules={[{ required: true, message: "请填写机构名称" }]}
|
||
>
|
||
<Input
|
||
placeholder="请输入机构名称"
|
||
maxLength={100}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item
|
||
label="合同编号"
|
||
name="contractNo"
|
||
rules={[{ required: true, message: "请填写合同编号" }]}
|
||
>
|
||
<Input
|
||
placeholder="请输入合同编号"
|
||
maxLength={50}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item
|
||
label="项目名称"
|
||
name="projectName"
|
||
rules={[{ required: true, message: "请填写项目名称" }]}
|
||
>
|
||
<Input
|
||
placeholder="请输入项目名称"
|
||
maxLength={100}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item
|
||
label="项目简介"
|
||
name="projectIntro"
|
||
rules={[{ required: true, message: "请填写项目简介" }]}
|
||
>
|
||
<TextArea
|
||
rows={3}
|
||
maxLength={500}
|
||
showCount
|
||
placeholder="请输入项目简介"
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item label="合同金额(万元)" name="amount">
|
||
<InputNumber style={{width: '100%'}} placeholder="请输入合同金额" min={0} precision={2} max={9999999} />
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item
|
||
label="项目类型"
|
||
name="projectTypeCode"
|
||
rules={[{ required: true, message: "请选择项目类型" }]}
|
||
>
|
||
<Select placeholder="请选择项目类型" allowClear>
|
||
{PROJECT_TYPE_OPTIONS.map((opt) => (
|
||
<Select.Option key={opt.value} value={opt.value}>
|
||
{opt.label}
|
||
</Select.Option>
|
||
))}
|
||
</Select>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item
|
||
label="项目风险分析"
|
||
name="riskSummary"
|
||
rules={[{ required: true, message: "请填写项目风险分析" }]}
|
||
>
|
||
<TextArea
|
||
rows={3}
|
||
maxLength={500}
|
||
showCount
|
||
placeholder="自动带入风险分析结论，可补充说明"
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item
|
||
label="项目所在地"
|
||
name="projectRegion"
|
||
rules={[{ required: true, message: "请填写项目所在地" }]}
|
||
>
|
||
<Select
|
||
placeholder="请选择"
|
||
allowClear
|
||
showSearch
|
||
optionFilterProp="label"
|
||
>
|
||
{district.map((opt) => (
|
||
<Select.Option key={opt.code} value={opt.code}>
|
||
{opt.name}
|
||
</Select.Option>
|
||
))}
|
||
</Select>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item
|
||
label="项目详细地址"
|
||
name="projectAddress"
|
||
rules={[{ required: true, message: "请填写项目详细地址" }]}
|
||
>
|
||
<Input
|
||
placeholder="请输入项目详细地址"
|
||
maxLength={200}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item
|
||
label="合同开始时间"
|
||
name="contractStartDate"
|
||
rules={[{ required: true, message: "请选择合同开始时间" }]}
|
||
>
|
||
<DatePicker className="pf-w-full" allowClear />
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item
|
||
label="合同结束时间"
|
||
name="contractEndDate"
|
||
rules={[{ required: true, message: "请选择合同结束时间" }]}
|
||
>
|
||
<DatePicker className="pf-w-full" allowClear />
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item
|
||
label="评价类型"
|
||
name="evalTypeCode"
|
||
rules={[{ required: true, message: "请选择评价类型" }]}
|
||
>
|
||
<Select placeholder="请选择评价类型" allowClear>
|
||
{EVAL_TYPE_OPTIONS.map((opt) => (
|
||
<Select.Option key={opt.value} value={opt.value}>
|
||
{opt.label}
|
||
</Select.Option>
|
||
))}
|
||
</Select>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item
|
||
label="是否生产剧毒化学品"
|
||
name="toxicFlag"
|
||
rules={[{ required: true, message: "请选择" }]}
|
||
>
|
||
<Select placeholder="请选择" allowClear>
|
||
{YES_NO_OPTIONS.map((opt) => (
|
||
<Select.Option key={opt.value} value={opt.value}>
|
||
{opt.label}
|
||
</Select.Option>
|
||
))}
|
||
</Select>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item
|
||
label="是否生产易制毒化学品"
|
||
name="precursorFlag"
|
||
rules={[{ required: true, message: "请选择" }]}
|
||
>
|
||
<Select placeholder="请选择" allowClear>
|
||
{YES_NO_OPTIONS.map((opt) => (
|
||
<Select.Option key={opt.value} value={opt.value}>
|
||
{opt.label}
|
||
</Select.Option>
|
||
))}
|
||
</Select>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item
|
||
label="是否跨省建设项目"
|
||
name="crossProvinceFlag"
|
||
rules={[{ required: true, message: "请选择" }]}
|
||
>
|
||
<Select placeholder="请选择" allowClear>
|
||
{YES_NO_OPTIONS.map((opt) => (
|
||
<Select.Option key={opt.value} value={opt.value}>
|
||
{opt.label}
|
||
</Select.Option>
|
||
))}
|
||
</Select>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item
|
||
label="项目业务范围"
|
||
name="businessScope"
|
||
rules={[{ required: true, message: "请填写项目业务范围" }]}
|
||
>
|
||
<Input
|
||
placeholder="请输入项目业务范围"
|
||
maxLength={200}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
</Row>
|
||
</Card>
|
||
|
||
<Card
|
||
type="inner"
|
||
size="small"
|
||
title="被评价企业信息"
|
||
extra={<Tag color="blue">合同服务对象</Tag>}
|
||
className="pf-section"
|
||
>
|
||
<Row gutter={16}>
|
||
<Col span={24}>
|
||
<Form.Item
|
||
label="企业名称"
|
||
name="enterpriseName"
|
||
rules={[{ required: true, message: "请填写企业名称" }]}
|
||
>
|
||
<Input
|
||
placeholder="请输入企业名称"
|
||
maxLength={100}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item label="国民经济行业类别" name="industryCategory">
|
||
<TextArea
|
||
rows={2}
|
||
maxLength={200}
|
||
showCount
|
||
placeholder="请输入国民经济行业类别"
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item label="办公地址" name="officeAddress">
|
||
<Input
|
||
placeholder="请输入办公地址"
|
||
maxLength={200}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={24}>
|
||
<Form.Item label="社会统一信用代码" name="creditCode">
|
||
<Input
|
||
placeholder="请输入社会统一信用代码"
|
||
maxLength={18}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item label="邮政编码" name="postCode">
|
||
<Input
|
||
placeholder="请输入邮政编码"
|
||
maxLength={10}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item label="企业电话" name="enterprisePhone"
|
||
rules={[phoneRule("企业电话", false)]}
|
||
>
|
||
<Input
|
||
placeholder="请输入企业电话"
|
||
maxLength={20}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item label="传真" name="fax">
|
||
<Input placeholder="请输入传真" maxLength={20} allowClear />
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item label="法人代表" name="legalPerson">
|
||
<Input
|
||
placeholder="请输入法人代表"
|
||
maxLength={20}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item
|
||
label="联系人"
|
||
name="contactName"
|
||
rules={[{ required: true, message: "请填写联系人" }]}
|
||
>
|
||
<Input
|
||
placeholder="请输入联系人"
|
||
maxLength={20}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item label="联系人电话" name="contactPhone"
|
||
rules={[phoneRule("联系人电话")]}
|
||
>
|
||
<Input
|
||
placeholder="请输入联系人电话"
|
||
maxLength={20}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
<Col span={12}>
|
||
<Form.Item label="职工人数" name="staffCount">
|
||
<Input
|
||
placeholder="请输入职工人数"
|
||
maxLength={10}
|
||
allowClear
|
||
/>
|
||
</Form.Item>
|
||
</Col>
|
||
</Row>
|
||
</Card>
|
||
|
||
<AttachmentUpload
|
||
name="scanFileUrl"
|
||
label="项目合同扫描件"
|
||
accept=".pdf"
|
||
maxCount={10}
|
||
extra="请上传PDF文件，大小不应超过500MB，不超过10个文件。"
|
||
/>
|
||
</Form>
|
||
|
||
<Flex justify="flex-end" gap={8}>
|
||
<Button onClick={() => props.history.goBack()}>取消</Button>
|
||
<Button
|
||
type="primary"
|
||
onClick={handleSave}
|
||
loading={contractSaveLoading}
|
||
>
|
||
完成合同录入并保存
|
||
</Button>
|
||
</Flex>
|
||
</Card>
|
||
</div>
|
||
</Spin>
|
||
);
|
||
};
|
||
|
||
export default Connect([NS_SAFETY_EVAL_BUSINESS], true)(ContractContent);
|