8.26
This commit is contained in:
jl-zhoujl2
249
src/components/ElecBidEvaluation/BidEvalAppointment.tsx
Normal file
249
src/components/ElecBidEvaluation/BidEvalAppointment.tsx
Normal file
@ -0,0 +1,249 @@
|
||||
import React, { useEffect, useRef, useState } from 'react';
|
||||
import { Col, DatePicker, Form, Input, message, Modal, Row } from 'antd';
|
||||
import ProTable, { ActionType, ProColumns } from '@ant-design/pro-table';
|
||||
import { getBidEvalRoom } from './service';
|
||||
import { dateFormat, disabledDate, disabledDateTime, validateMessages } from './MeetingReservation';
|
||||
import moment from 'moment';
|
||||
import { dateTimeFormatter } from '@/utils/DateUtils';
|
||||
|
||||
interface BidEvalAppointmentProps {
|
||||
modalVisible: boolean;
|
||||
onCancel: () => void;
|
||||
onSubmit: (value: any) => void;
|
||||
values: any;
|
||||
}
|
||||
|
||||
export const proviceEnum = {
|
||||
"0011": "北京",
|
||||
"0012": "天津",
|
||||
"0013": "河北",
|
||||
"0014": "山西",
|
||||
"0015": "内蒙古",
|
||||
"0021": "辽宁",
|
||||
"0022": "吉林",
|
||||
"0023": "黑龙江",
|
||||
"0031": "上海",
|
||||
"0032": "江苏",
|
||||
"0033": "浙江",
|
||||
"0034": "安徽",
|
||||
"0035": "福建",
|
||||
"0036": "江西",
|
||||
"0037": "山东",
|
||||
"0041": "河南",
|
||||
"0042": "湖北",
|
||||
"0043": "湖南",
|
||||
"0044": "广东",
|
||||
"0045": "广西",
|
||||
"0046": "海南",
|
||||
"0050": "重庆",
|
||||
"0051": "四川",
|
||||
"0052": "贵州",
|
||||
"0053": "云南",
|
||||
"0054": "西藏",
|
||||
"0061": "陕西",
|
||||
"0062": "甘肃",
|
||||
"0063": "青海",
|
||||
"0064": "宁夏",
|
||||
"0065": "新疆",
|
||||
"001000": "集团"
|
||||
}
|
||||
|
||||
const modalHeight = window.innerHeight * 96 / 100;
|
||||
|
||||
const BidEvalAppointment: React.FC<BidEvalAppointmentProps> = (props) => {
|
||||
const { modalVisible, onCancel, onSubmit, values } = props;
|
||||
const actionRef = useRef<ActionType>();
|
||||
const [form] = Form.useForm();
|
||||
//当前选择行areaId
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
|
||||
//当前选择行数据
|
||||
const [selectedRecord, setSelectedRecord] = useState<any>();
|
||||
const columns: ProColumns<any>[] = [
|
||||
{
|
||||
valueType: 'index',
|
||||
width: 48,
|
||||
},
|
||||
{
|
||||
title: '评标室名称',
|
||||
dataIndex: 'areaName',
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '服务省分',
|
||||
dataIndex: 'provinceDictId',
|
||||
ellipsis: true,
|
||||
valueEnum: proviceEnum,
|
||||
hideInSearch: true,
|
||||
},
|
||||
{
|
||||
title: '详细地址',
|
||||
dataIndex: 'areaAddress',
|
||||
ellipsis: true,
|
||||
hideInSearch: true,
|
||||
},
|
||||
{
|
||||
title: '可容纳人数',
|
||||
dataIndex: 'areaNumber',
|
||||
ellipsis: true,
|
||||
hideInSearch: true,
|
||||
},
|
||||
{
|
||||
title: '联系人',
|
||||
dataIndex: 'contactName',
|
||||
ellipsis: true,
|
||||
hideInSearch: true,
|
||||
}, {
|
||||
title: '联系电话',
|
||||
dataIndex: 'contactTel',
|
||||
ellipsis: true,
|
||||
hideInSearch: true,
|
||||
},
|
||||
];
|
||||
|
||||
const onOk = () => {
|
||||
if (selectedRowKeys.length == 0) {
|
||||
message.info("请选择评标室");
|
||||
return;
|
||||
}
|
||||
form.validateFields().then(value => {
|
||||
if (value.reserveStartDate < moment().format(dateTimeFormatter)) {
|
||||
message.info("开始时间不可早于当前时间");
|
||||
return;
|
||||
}
|
||||
value["areaId"] = selectedRecord.id;
|
||||
value["placeId"] = selectedRecord.placeId;
|
||||
value["evalLocation"] = selectedRecord.areaName;
|
||||
onSubmit(value);
|
||||
})
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (values) {
|
||||
if (values?.areaId) {
|
||||
setSelectedRowKeys([values.areaId])
|
||||
setSelectedRecord({
|
||||
...values,
|
||||
id: values.areaId,
|
||||
})
|
||||
}
|
||||
form.setFieldsValue({
|
||||
...values,
|
||||
})
|
||||
}
|
||||
return () => {
|
||||
setSelectedRowKeys([]);
|
||||
setSelectedRecord(void 0);
|
||||
}
|
||||
}, [values])
|
||||
|
||||
return (
|
||||
<Modal
|
||||
destroyOnClose
|
||||
title="选择评标室"
|
||||
visible={modalVisible}
|
||||
maskClosable={false}
|
||||
onCancel={() => onCancel()}
|
||||
onOk={() => onOk()}
|
||||
okText="确认"
|
||||
width={"70%"}
|
||||
style={{ maxHeight: modalHeight }}
|
||||
bodyStyle={{ maxHeight: modalHeight - 107, overflowY: 'auto', }}
|
||||
className="confirm table-no-alert"
|
||||
centered
|
||||
>
|
||||
<ProTable<any>
|
||||
columns={columns}
|
||||
actionRef={actionRef}
|
||||
bordered={false}
|
||||
request={async (params: any) => {
|
||||
return await getBidEvalRoom(params).then(res => {
|
||||
if (res?.code == 200) {
|
||||
return {
|
||||
data: res?.data.records,
|
||||
success: res?.success,
|
||||
total: res?.data.total,
|
||||
}
|
||||
} else {
|
||||
return {
|
||||
data: [],
|
||||
success: false,
|
||||
total: 0,
|
||||
}
|
||||
}
|
||||
})
|
||||
}}
|
||||
rowKey="id"
|
||||
search={{
|
||||
labelWidth: 'auto',
|
||||
}}
|
||||
options={false}
|
||||
pagination={{
|
||||
size: "small",
|
||||
defaultPageSize: 10,
|
||||
showSizeChanger: true,
|
||||
}}
|
||||
rowSelection={{
|
||||
type: "radio",
|
||||
selectedRowKeys,
|
||||
onChange: (selectedRowKeys, selectedRows) => {
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
setSelectedRecord(selectedRows[0]);
|
||||
},
|
||||
}}
|
||||
dateFormatter="string"
|
||||
toolBarRender={false}
|
||||
/>
|
||||
<Form
|
||||
name="basic"
|
||||
form={form}
|
||||
labelCol={{ span: 8 }}
|
||||
wrapperCol={{ span: 16 }}
|
||||
preserve={false}
|
||||
validateMessages={validateMessages}
|
||||
>
|
||||
{selectedRowKeys.length > 0 && (
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="预计评标开始时间"
|
||||
name="reserveStartDate"
|
||||
rules={[{ required: true, message: '请选择' }]}
|
||||
>
|
||||
<DatePicker showTime={{ defaultValue: moment().hour(7) }} showNow={false} disabledDate={disabledDate} disabledTime={disabledDateTime} showMinute={false} showSecond={false} format={dateFormat} style={{ width: '100%' }} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="预计评标结束时间"
|
||||
name="reserveEndDate"
|
||||
rules={[{ required: true, message: '请选择' }]}
|
||||
>
|
||||
<DatePicker showTime={{ defaultValue: moment().hour(7) }} showNow={false} disabledDate={disabledDate} disabledTime={disabledDateTime} showMinute={false} showSecond={false} format={dateFormat} style={{ width: '100%' }} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="预约人"
|
||||
name="reserveBy"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Input maxLength={20} placeholder="预约人姓名" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item
|
||||
label="预约人联系方式"
|
||||
name="reserveContactNumber"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Input type="number" maxLength={20} placeholder="预约人手机号" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
)}
|
||||
</Form>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default BidEvalAppointment;
|
||||
Reference in New Issue
Block a user