9.9 修改预约管理页面
This commit is contained in:
@ -194,3 +194,35 @@
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.screen-reserve-table {
|
||||
.ant-table-small .ant-table-thead>tr>th {
|
||||
background-color: #fff
|
||||
}
|
||||
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-content>table>thead>tr>th,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-header>table>thead>tr>th,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-body>table>thead>tr>th,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-content>table>tbody>tr>td,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-header>table>tbody>tr>td,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-body>table>tbody>tr>td,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-content>table>tfoot>tr>th,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-header>table>tfoot>tr>th,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-body>table>tfoot>tr>th,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-content>table>tfoot>tr>td,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-header>table>tfoot>tr>td,
|
||||
.ant-table.ant-table-bordered>.ant-table-container>.ant-table-body>table>tfoot>tr>td {
|
||||
border-right: 1px solid #eaeaea;
|
||||
}
|
||||
|
||||
.ant-table-thead>tr>th,
|
||||
.ant-table-tbody>tr>td {
|
||||
border-bottom: 1px solid #eaeaea;
|
||||
}
|
||||
}
|
||||
|
||||
.screen-reserve-collapse {
|
||||
.ant-collapse-content>.ant-collapse-content-box {
|
||||
padding: 16px 0;
|
||||
}
|
||||
}
|
@ -1,17 +1,19 @@
|
||||
import ProList from '@ant-design/pro-list';
|
||||
import type { ActionType, ProColumns } from '@ant-design/pro-table';
|
||||
import ProTable from '@ant-design/pro-table';
|
||||
import { Button, Card, Space, Tag } from 'antd';
|
||||
import React, { ReactText, useEffect, useState } from 'react';
|
||||
import { Button, Card, Collapse, Space, Tag } from 'antd';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { useRef } from 'react';
|
||||
import MeetingReservation from '@/components/ElecBidEvaluation/MeetingReservation';
|
||||
import { getRecordData, getSiteList } from './service';
|
||||
import { isEmpty } from '@/utils/CommonUtils';
|
||||
|
||||
const orange_bg = { background: '#f59a23', color: '#0000ff', cursor: 'pointer', width: '100%', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' };
|
||||
const green_bg = { background: '#4b7902' };
|
||||
const orange_bg = { background: '#ffbc83', color: '#333333', cursor: 'pointer', width: '100%', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' };
|
||||
const light_orange_bg = { background: '#faf7e5' };
|
||||
const align_middle = { display: 'flex', alignItems: 'center' };
|
||||
const tag_size = { height: '20px', width: '20px' };
|
||||
const panel_title = { fontWeight: 500 };
|
||||
const panel_sub_title = { ...panel_title, color: '#999999' };
|
||||
const { Panel } = Collapse;
|
||||
|
||||
const ScreenTable = (props: { record: any, onCellClick: (id: any) => void, refresh: number }) => {
|
||||
const { record, onCellClick, refresh } = props;
|
||||
@ -27,55 +29,9 @@ const ScreenTable = (props: { record: any, onCellClick: (id: any) => void, refre
|
||||
const columnsSplice = (weeksData: any[]) => {
|
||||
const columns: ProColumns<any>[] = [
|
||||
{
|
||||
title: '评标室名称',
|
||||
dataIndex: 'name',
|
||||
align: 'center',
|
||||
render: (_, record, index) => {
|
||||
return {
|
||||
children: _,
|
||||
props: {
|
||||
rowSpan: index % 24 == 0 ? 24 : 0,
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '可容纳人数(人)',
|
||||
dataIndex: 'rs',
|
||||
align: 'center',
|
||||
render: (_, record, index) => {
|
||||
return {
|
||||
children: _,
|
||||
props: {
|
||||
rowSpan: index % 24 == 0 ? 24 : 0,
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '场次',
|
||||
align: 'center',
|
||||
colSpan: 2,
|
||||
render: (_, record, index) => {
|
||||
return {
|
||||
children: "07:00 ~ 18:00",
|
||||
props: {
|
||||
rowSpan: index % 24 == 0 ? 24 : 0,
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '时段场次',
|
||||
dataIndex: "time",
|
||||
align: 'right',
|
||||
width: '100px',
|
||||
colSpan: 0,
|
||||
},
|
||||
{
|
||||
title: '预约时间',
|
||||
dataIndex: "info_time",
|
||||
valueType: 'date',
|
||||
hideInTable: true,
|
||||
align: 'center',
|
||||
},
|
||||
];
|
||||
for (const ite of weeksData) {
|
||||
@ -86,7 +42,7 @@ const ScreenTable = (props: { record: any, onCellClick: (id: any) => void, refre
|
||||
ellipsis: true,
|
||||
onCell: (record) => {
|
||||
return {
|
||||
style: record[ite.id]?.iskssj ? orange_bg : green_bg,
|
||||
style: record[ite.id]?.iskssj ? orange_bg : light_orange_bg,
|
||||
onClick: record[ite.id]?.iskssj ? () => onCellClick(record[ite.id]?.id) : void 0,
|
||||
}
|
||||
},
|
||||
@ -127,7 +83,8 @@ const ScreenTable = (props: { record: any, onCellClick: (id: any) => void, refre
|
||||
return (
|
||||
<div>
|
||||
{tableData.length > 0 && (
|
||||
<Space style={{ margin: '10px 0' }}>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', paddingBottom: 16 }}>
|
||||
<Space>
|
||||
<Button key="last-week" size='small' type="primary" onClick={() => weekChange("0")}>
|
||||
上一周
|
||||
</Button>
|
||||
@ -135,6 +92,11 @@ const ScreenTable = (props: { record: any, onCellClick: (id: any) => void, refre
|
||||
下一周
|
||||
</Button>
|
||||
</Space>
|
||||
<Space size="middle">
|
||||
<div style={align_middle}><Tag color="#faf7e5" style={tag_size}></Tag>可预约电子评标室</div>
|
||||
<div style={align_middle}><Tag color="#ffbc83" style={tag_size}></Tag>已预约电子评标室</div>
|
||||
</Space>
|
||||
</div>
|
||||
)}
|
||||
<ProTable<any>
|
||||
columns={tableColumns}
|
||||
@ -142,6 +104,7 @@ const ScreenTable = (props: { record: any, onCellClick: (id: any) => void, refre
|
||||
bordered
|
||||
size='small'
|
||||
dataSource={tableData}
|
||||
className="screen-reserve-table"
|
||||
rowKey="time"
|
||||
search={false}
|
||||
pagination={false}
|
||||
@ -158,7 +121,7 @@ export default () => {
|
||||
//评标场所列表数据
|
||||
const [siteListData, setSiteListData] = useState<any[]>([]);
|
||||
//评标场所列表展开
|
||||
const [expandedRowKeys, setExpandedRowKeys] = useState<readonly ReactText[]>([]);
|
||||
const [expandedRowKeys, setExpandedRowKeys] = useState<any[]>([]);
|
||||
//预约状态
|
||||
const [meetStatus, setMeetStatus] = useState<string>("2");
|
||||
//预约id
|
||||
@ -200,8 +163,8 @@ export default () => {
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<Card title="评标室预约情况" bodyStyle={{ padding: '16px 0px 24px', height: window.innerHeight - 120, overflowY: 'auto' }}>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', padding: '0 24px 16px' }}>
|
||||
<Card title="评标室预约情况" bodyStyle={{ padding: '16px 0px', height: window.innerHeight - 120, overflowY: 'auto' }}>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', padding: '0 36px 16px' }}>
|
||||
<Space>
|
||||
<Button key="yuyue" type="primary" onClick={() => createMeet()}>
|
||||
预约
|
||||
@ -210,30 +173,25 @@ export default () => {
|
||||
查看预约详情
|
||||
</Button>
|
||||
</Space>
|
||||
<Space size="middle">
|
||||
<div style={align_middle}><Tag color="#f59a23" style={tag_size}></Tag>已预约</div>
|
||||
<div style={align_middle}><Tag color="#4b7902" style={tag_size}></Tag>未预约</div>
|
||||
</Space>
|
||||
</div>
|
||||
<ProList<any>
|
||||
rowKey="id"
|
||||
expandable={{
|
||||
expandedRowKeys, onExpandedRowsChange: setExpandedRowKeys,
|
||||
}}
|
||||
dataSource={siteListData}
|
||||
toolBarRender={false}
|
||||
metas={{
|
||||
title: {
|
||||
render: (_: any, record: any) => <span onClick={() => setExpandedRowKeys(keys => keys.includes(record.id) ? [] : [record.id])}>{record.areaName}</span>,
|
||||
},
|
||||
subTitle: {
|
||||
render: (_: any, record: any) => `可容纳人数:${isEmpty(record.areaNumber) ? '' : record.areaNumber}人`,
|
||||
},
|
||||
description: {
|
||||
render: (_: any, record: any) => <ScreenTable record={record} onCellClick={viewMeet} refresh={refresh} />,
|
||||
},
|
||||
}}
|
||||
/>
|
||||
<Collapse activeKey={expandedRowKeys} onChange={(value) => setExpandedRowKeys(value as any[])} className="screen-reserve-collapse" style={{ margin: '0 36px' }}>
|
||||
{siteListData.map(item => (
|
||||
<Panel
|
||||
header={<>
|
||||
<span style={panel_title}>{item.areaName}</span>
|
||||
<span style={panel_sub_title}>(可容纳{isEmpty(item.areaNumber) ? '' : item.areaNumber}人)</span>
|
||||
</>}
|
||||
extra={
|
||||
<>
|
||||
<span style={panel_title}>时间:07:00 ~ 18:00</span>
|
||||
</>
|
||||
}
|
||||
key={item.id}
|
||||
>
|
||||
<ScreenTable record={item} onCellClick={viewMeet} refresh={refresh} />
|
||||
</Panel>
|
||||
))}
|
||||
</Collapse>
|
||||
{modalVisible && <MeetingReservation modalVisible={modalVisible} onCancel={() => { setModalVisible(false); getSiteListData("1") }} roomList={siteListData} status={meetStatus} meetId={meetId} onSubmit={() => { setModalVisible(false); setRefresh(refresh => refresh + 1) }} />}
|
||||
</Card >
|
||||
);
|
||||
|
@ -173,7 +173,7 @@ const SitePersonModal: React.FC<SitePersonModalProps> = (props) => {
|
||||
message: '当前项不可为空',
|
||||
},
|
||||
]}>
|
||||
<ExpertPhotoUpload maxSize={60} />
|
||||
<ExpertPhotoUpload maxSize={200} />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Spin>
|
||||
|
@ -1409,7 +1409,7 @@ const JudgingPanel: React.FC<{}> = () => {
|
||||
name="faceId"
|
||||
style={{ display: 'inline-block', width: '60%' }}
|
||||
>
|
||||
<ExpertPhotoUpload maxSize={60} />
|
||||
<ExpertPhotoUpload maxSize={200} />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
style={{ display: 'inline-block', width: '40%', position: "relative", right: '24%' }}
|
||||
|
@ -1289,7 +1289,7 @@ const JudgingPanel: React.FC<{}> = () => {
|
||||
name="faceId"
|
||||
style={{ display: 'inline-block', width: '60%' }}
|
||||
>
|
||||
<ExpertPhotoUpload maxSize={60} />
|
||||
<ExpertPhotoUpload maxSize={200} />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
style={{ display: 'inline-block', width: '40%', position: "relative", right: '24%' }}
|
||||
|
Reference in New Issue
Block a user