更新预览计划和接机牌

release
Jimmy Liow 3 years ago
parent 902c8a41eb
commit 3cb0e3767e

@ -1,5 +1,6 @@
import { observer } from "mobx-react";
import { Row, Col, Space, Table, Typography, List, Watermark } from 'antd';
import DocViewer, { DocViewerRenderers } from "@cyntler/react-doc-viewer";
import { useStore } from '@/stores/StoreContext.js';
const { Title } = Typography;
@ -7,21 +8,21 @@ const { Title } = Typography;
function NameCard() {
const { reservationStore } = useStore();
const { meetAndGreet } = reservationStore;
const docs = [{ uri: "https://www.chinahighlights.com/public/NameCard.doc" }];
return (
<Watermark content={['Global Highlights', 'Discovery Your Way!']}>
<Space direction="vertical" style={{ width: '100%' }}>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={1}>{meetAndGreet.customerNames}</Title>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={1}>{meetAndGreet.pax}</Title>
</Col>
</Row>
</Space>
<DocViewer
config={{
header: {
disableHeader: true,
disableFileName: false,
retainURLParams: false,
},
}}
documents={docs}
pluginRenderers={DocViewerRenderers}
style={{ height: 750 }} />
</Watermark>
);
}

@ -6,42 +6,10 @@ import { Row, Col, Space, Table, Typography, List, Watermark } from "antd";
import DocViewer, { DocViewerRenderers } from "@cyntler/react-doc-viewer";
import { useStore } from "../../stores/StoreContext.js";
const { Title } = Typography;
const itineraryListColumns = [
{
title: "Day",
dataIndex: "day",
key: "day",
},
{
title: "Place & Transport",
dataIndex: "placeTransport",
key: "placeTransport",
},
{
title: "Todays Activities",
dataIndex: "todayActivities",
key: "todayActivities",
},
{
title: "Accommodation",
dataIndex: "accommodation",
key: "accommodation",
},
{
title: "Meals",
dataIndex: "meals",
key: "meals",
},
];
function Print() {
const navigate = useNavigate();
const { reservationId } = useParams();
const { reservationStore } = useStore();
const { itineraryList, customerList } = reservationStore;
const docs = [{ uri: "https://www.chinahighlights.com/public/reservationW220420009.doc" }, { uri: "https://www.chinahighlights.com/public/SampleSpec.docx" }];
const docs = [{ uri: "https://www.chinahighlights.com/public/reservationW220420009.doc" }];
useEffect(() => {
console.info("Detail.useEffect: " + reservationId);
@ -49,88 +17,17 @@ function Print() {
return (
<Watermark content={["Global Highlights", "Discovery Your Way!"]}>
<Space direction="vertical" style={{ width: "100%" }}>
<Row gutter={{ md: 24 }}>
<Col span={24}>
Stream
<DocViewer documents={docs} pluginRenderers={DocViewerRenderers} style={{ height: 800 }} />
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={3}>Booking for Mr. Prasanna Venkatesa Nathan(United States) trip</Title>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Booking Number: 220629-W220420009</Title>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Customer Names (Full name as it appears on passport):</Title>
</Col>
</Row>
<Row>
<Col span={24}>
<List
itemLayout="horizontal"
dataSource={toJS(customerList)}
renderItem={(item, index) => (
<List.Item>
<List.Item.Meta title={<span>{item.title}</span>} description={item.description} />
</List.Item>
)}
/>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Hotels and Room:</Title>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Guide Language: English</Title>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Notes:</Title>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Itinerary Overview:</Title>
</Col>
</Row>
<Row>
<Col span={24}>
<Table pagination={false} dataSource={toJS(itineraryList)} columns={itineraryListColumns} />
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Detailed Tour Itinerary</Title>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Packaged Price Includes:</Title>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Packaged Price Excludes:</Title>
</Col>
</Row>
<Row gutter={{ md: 24 }}>
<Col span={24}>
<Title level={4}>Asia Highlights Contact:</Title>
</Col>
</Row>
</Space>
<DocViewer
config={{
header: {
disableHeader: true,
disableFileName: false,
retainURLParams: false,
},
}}
documents={docs}
pluginRenderers={DocViewerRenderers}
style={{ height: 750 }} />
</Watermark>
);
}

Loading…
Cancel
Save