|
|
@ -2,7 +2,7 @@ import { useParams, useNavigate, NavLink } from "react-router-dom";
|
|
|
|
import { useEffect, useState, useRef } from "react";
|
|
|
|
import { useEffect, useState, useRef } from "react";
|
|
|
|
import { observer } from "mobx-react";
|
|
|
|
import { observer } from "mobx-react";
|
|
|
|
import { toJS, runInAction } from "mobx";
|
|
|
|
import { toJS, runInAction } from "mobx";
|
|
|
|
import { Row, Col, Space, Button, Typography, Card, Form, Upload, Input, Divider, DatePicker, Select, App, Modal } from "antd";
|
|
|
|
import { Row, Col, Space, Button, Typography, Card, Form, Upload, Input, Divider, DatePicker, Select, App, Descriptions } from "antd";
|
|
|
|
import { useStore } from "@/stores/StoreContext.js";
|
|
|
|
import { useStore } from "@/stores/StoreContext.js";
|
|
|
|
import { PlusOutlined } from "@ant-design/icons";
|
|
|
|
import { PlusOutlined } from "@ant-design/icons";
|
|
|
|
import { isNotEmpty } from "@/utils/commons";
|
|
|
|
import { isNotEmpty } from "@/utils/commons";
|
|
|
@ -182,11 +182,12 @@ function Detail() {
|
|
|
|
//循环生成多次报账信息
|
|
|
|
//循环生成多次报账信息
|
|
|
|
function bindSubmitForm() {
|
|
|
|
function bindSubmitForm() {
|
|
|
|
let submitForm = invoiceZDDetail.map((data, index) => {
|
|
|
|
let submitForm = invoiceZDDetail.map((data, index) => {
|
|
|
|
if (data.GMD_Dealed) { //已审核的直接显示信息即可,无需表单
|
|
|
|
if (data.GMD_Dealed) {
|
|
|
|
|
|
|
|
//已审核的直接显示信息即可,无需表单
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<Row key={data.GMD_SN} gutter={16} style={{ backgroundColor: "#f6f7f9", width: "100%", padding: "20px 40px" }} >
|
|
|
|
<Row key={data.GMD_SN} gutter={16} style={{ backgroundColor: "#f6f7f9", width: "100%", padding: "20px 40px" }}>
|
|
|
|
<Col span={4}></Col>
|
|
|
|
<Col span={4}></Col>
|
|
|
|
<Col span={18} >
|
|
|
|
<Col span={18}>
|
|
|
|
<Divider orientation="left">Invoice {index + 1}</Divider>
|
|
|
|
<Divider orientation="left">Invoice {index + 1}</Divider>
|
|
|
|
<Upload
|
|
|
|
<Upload
|
|
|
|
name="ghhfile"
|
|
|
|
name="ghhfile"
|
|
|
@ -194,45 +195,25 @@ function Detail() {
|
|
|
|
multiple={true}
|
|
|
|
multiple={true}
|
|
|
|
action={config.HT_HOST + `/service-fileServer/FileUpload?GRI_SN=${GSN}&VEI_SN=${authStore.login.travelAgencyId}&FilePathName=invoice&token=${authStore.login.token}`}
|
|
|
|
action={config.HT_HOST + `/service-fileServer/FileUpload?GRI_SN=${GSN}&VEI_SN=${authStore.login.travelAgencyId}&FilePathName=invoice&token=${authStore.login.token}`}
|
|
|
|
fileList={invoicePicList[index]}
|
|
|
|
fileList={invoicePicList[index]}
|
|
|
|
listType="picture-card"
|
|
|
|
listType="picture-card"></Upload>
|
|
|
|
>
|
|
|
|
<Descriptions title={"Detail"}>
|
|
|
|
<div>
|
|
|
|
<Descriptions.Item label="Amount">{data.GMD_Cost}</Descriptions.Item>
|
|
|
|
<PlusOutlined />
|
|
|
|
<Descriptions.Item label="Currency">{data.GMD_Currency}</Descriptions.Item>
|
|
|
|
<div style={{ marginTop: 8 }}>Click to Upload</div>
|
|
|
|
<Descriptions.Item label="Due Dat">{data.GMD_PayDate}</Descriptions.Item>
|
|
|
|
</div>
|
|
|
|
</Descriptions>
|
|
|
|
</Upload>
|
|
|
|
|
|
|
|
<Divider orientation="left">Details</Divider>
|
|
|
|
|
|
|
|
<Row gutter={16}>
|
|
|
|
|
|
|
|
<Col span={8}>
|
|
|
|
|
|
|
|
<Input addonBefore="Amount:" value={data.GMD_Cost} />
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col span={8}>
|
|
|
|
|
|
|
|
Currency: <Select
|
|
|
|
|
|
|
|
placeholder="Select Currency type"
|
|
|
|
|
|
|
|
allowClear
|
|
|
|
|
|
|
|
options={bindCurrency()}
|
|
|
|
|
|
|
|
value={data.GMD_Currency}
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
</Select>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col span={8}>
|
|
|
|
|
|
|
|
<Input addonBefore="Due Dat:" value={data.GMD_PayDate} />
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
{addButton(index + 1 == invoiceZDDetail.length)}
|
|
|
|
{addButton(index + 1 == invoiceZDDetail.length)}
|
|
|
|
</Col>
|
|
|
|
</Col>
|
|
|
|
<Col span={4}></Col>
|
|
|
|
<Col span={4}></Col>
|
|
|
|
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
);
|
|
|
|
)
|
|
|
|
|
|
|
|
} else {
|
|
|
|
} else {
|
|
|
|
// 一个团只能有一个未审核的账单记录
|
|
|
|
// 一个团只能有一个未审核的账单记录
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<Row key={data.GMD_SN} gutter={16} style={{ backgroundColor: "#f6f7f9", width: "100%", padding: "20px 40px" }} >
|
|
|
|
<Row key={data.GMD_SN} gutter={16} style={{ backgroundColor: "#f6f7f9", width: "100%", padding: "20px 40px" }}>
|
|
|
|
<Col span={4}></Col>
|
|
|
|
<Col span={4}></Col>
|
|
|
|
<Col span={18} >
|
|
|
|
<Col span={18}>
|
|
|
|
<Form name="invoice_submit" onFinish={onFinish} labelCol={{ span: 5 }} form={form} style={{backgroundColor:"#fff" , padding:"20px"}}>
|
|
|
|
<Form name="invoice_submit" onFinish={onFinish} labelCol={{ span: 5 }} form={form} style={{ backgroundColor: "#fff", padding: "20px" }}>
|
|
|
|
<Divider orientation="left">Invoice {index + 1}</Divider>
|
|
|
|
<Divider orientation="left">Invoice {index + 1}</Divider>
|
|
|
|
<Form.Item>
|
|
|
|
<Form.Item>
|
|
|
|
<Upload
|
|
|
|
<Upload
|
|
|
@ -252,8 +233,9 @@ function Detail() {
|
|
|
|
</Form.Item>
|
|
|
|
</Form.Item>
|
|
|
|
<Divider orientation="left">Details</Divider>
|
|
|
|
<Divider orientation="left">Details</Divider>
|
|
|
|
<Row gutter={16}>
|
|
|
|
<Row gutter={16}>
|
|
|
|
|
|
|
|
<Col span={8}>
|
|
|
|
<Col span={8}> <Form.Item
|
|
|
|
{" "}
|
|
|
|
|
|
|
|
<Form.Item
|
|
|
|
name="info_money"
|
|
|
|
name="info_money"
|
|
|
|
label="Amount:"
|
|
|
|
label="Amount:"
|
|
|
|
rules={[
|
|
|
|
rules={[
|
|
|
@ -261,11 +243,12 @@ function Detail() {
|
|
|
|
required: true,
|
|
|
|
required: true,
|
|
|
|
message: "Please input your money!",
|
|
|
|
message: "Please input your money!",
|
|
|
|
},
|
|
|
|
},
|
|
|
|
]}
|
|
|
|
]}>
|
|
|
|
>
|
|
|
|
|
|
|
|
<Input />
|
|
|
|
<Input />
|
|
|
|
</Form.Item></Col>
|
|
|
|
</Form.Item>
|
|
|
|
<Col span={8}><Form.Item
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col span={8}>
|
|
|
|
|
|
|
|
<Form.Item
|
|
|
|
name="info_Currency"
|
|
|
|
name="info_Currency"
|
|
|
|
label="Currency:"
|
|
|
|
label="Currency:"
|
|
|
|
rules={[
|
|
|
|
rules={[
|
|
|
@ -273,29 +256,17 @@ function Detail() {
|
|
|
|
required: true,
|
|
|
|
required: true,
|
|
|
|
message: "Please select Currency type!",
|
|
|
|
message: "Please select Currency type!",
|
|
|
|
},
|
|
|
|
},
|
|
|
|
]}
|
|
|
|
]}>
|
|
|
|
>
|
|
|
|
<Select placeholder="Select Currency type" onChange={onCurrencyChange} options={bindCurrency()}></Select>
|
|
|
|
<Select
|
|
|
|
</Form.Item>
|
|
|
|
placeholder="Select Currency type"
|
|
|
|
</Col>
|
|
|
|
onChange={onCurrencyChange}
|
|
|
|
|
|
|
|
allowClear
|
|
|
|
|
|
|
|
options={bindCurrency()}
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
</Select>
|
|
|
|
|
|
|
|
</Form.Item></Col>
|
|
|
|
|
|
|
|
<Col span={8}>
|
|
|
|
<Col span={8}>
|
|
|
|
<Form.Item
|
|
|
|
<Form.Item name="info_date" label="Due Date: ">
|
|
|
|
name="info_date"
|
|
|
|
|
|
|
|
label="Due Date: "
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<DatePicker />
|
|
|
|
<DatePicker />
|
|
|
|
</Form.Item></Col>
|
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
</Row>
|
|
|
|
</Row>
|
|
|
|
<Form.Item
|
|
|
|
<Form.Item name="info_gmdsn" hidden={true}>
|
|
|
|
name="info_gmdsn"
|
|
|
|
|
|
|
|
hidden={true}
|
|
|
|
|
|
|
|
>
|
|
|
|
|
|
|
|
<input />
|
|
|
|
<input />
|
|
|
|
</Form.Item>
|
|
|
|
</Form.Item>
|
|
|
|
<Form.Item>
|
|
|
|
<Form.Item>
|
|
|
@ -303,23 +274,22 @@ function Detail() {
|
|
|
|
Submit
|
|
|
|
Submit
|
|
|
|
</Button>
|
|
|
|
</Button>
|
|
|
|
</Form.Item>
|
|
|
|
</Form.Item>
|
|
|
|
<p>Our Finance Dept makes payment during the last week in each month. So due date can only the last day of each month. If there's urgent payment, please contact the travel advisor and send invoice separately.</p>
|
|
|
|
<p>
|
|
|
|
|
|
|
|
Our Finance Dept makes payment during the last week in each month. So due date can only the last day of each month. If there's urgent payment, please contact the travel advisor and send invoice
|
|
|
|
|
|
|
|
separately.
|
|
|
|
|
|
|
|
</p>
|
|
|
|
</Form>
|
|
|
|
</Form>
|
|
|
|
</Col>
|
|
|
|
</Col>
|
|
|
|
<Col span={4}></Col>
|
|
|
|
<Col span={4}></Col>
|
|
|
|
</Row>
|
|
|
|
</Row>
|
|
|
|
)
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
})
|
|
|
|
|
|
|
|
return submitForm;
|
|
|
|
return submitForm;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<>
|
|
|
|
<>
|
|
|
|
|
|
|
|
|
|
|
|
<Space direction="vertical" style={{ width: "100%" }}>
|
|
|
|
<Space direction="vertical" style={{ width: "100%" }}>
|
|
|
|
<Row gutter={16}>
|
|
|
|
<Row gutter={16}>
|
|
|
|
<Col span={20}>
|
|
|
|
<Col span={20}>
|
|
|
@ -336,10 +306,6 @@ function Detail() {
|
|
|
|
</Space>
|
|
|
|
</Space>
|
|
|
|
</>
|
|
|
|
</>
|
|
|
|
);
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
export default observer(Detail);
|
|
|
|
export default observer(Detail);
|
|
|
|