Haina
/
GHHub
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

账单列表页显示金额和币种

Browse Source
release
YCC 2 years ago
parent 43e4e05bdf
commit 948b12ad33
3 changed files with 305 additions and 352 deletions
Show Stats Download Patch File Download Diff File

2
src/stores/Invoice.js
Unescape Escape View File

@ -70,6 +70,7 @@ class Invoice {
GroupName: data.GroupName, GroupName: data.GroupName,
AllMoney: data.AllMoney, AllMoney: data.AllMoney,
PersonNum: data.PersonNum, PersonNum: data.PersonNum,
GMD_Currency: data.GMD_Currency,
VName: data.VName, VName: data.VName,
FKState: data.FKState, FKState: data.FKState,
}; };
@ -239,6 +240,7 @@ class Invoice {
GMD_FillWorkers_Name: "", GMD_FillWorkers_Name: "",
GroupName: " 中华游230501-CA230402033", GroupName: " 中华游230501-CA230402033",
AllMoney: 3539, AllMoney: 3539,
GMD_Currency: "",
PersonNum: "1大1小", PersonNum: "1大1小",
VName: "", VName: "",
}, },

175
src/views/invoice/Detail.jsx
Unescape Escape View File

@ -1,5 +1,5 @@
import { useParams, useNavigate } from "react-router-dom"; 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, Modal } from "antd";
@ -22,66 +22,63 @@ function Detail() {
const { formCurrency, onCurrencyChange } = useState(); const { formCurrency, onCurrencyChange } = useState();
const { notification } = App.useApp(); const { notification } = App.useApp();
const [invoicePicList,setInvoicePicList] = useState([]); const [invoicePicList, setInvoicePicList] = useState([]);
useEffect(() => { useEffect(() => {
console.info("Detail.useEffect: " + GMDSN + "/" + GSN); console.info("Detail.useEffect: " + GMDSN + "/" + GSN);
defaultShow(); defaultShow();
}, [GMDSN, GSN]); }, [GMDSN, GSN]);
function defaultShow() {
function defaultShow(){
setDataLoading(true); setDataLoading(true);
invoiceStore.fetchInvoiceDetail(GMDSN, GSN) invoiceStore
.then((json) => { .fetchInvoiceDetail(GMDSN, GSN)
.then(json => {
let ZDDetail = json.ZDDetail; let ZDDetail = json.ZDDetail;
let arrLen = ZDDetail.length; let arrLen = ZDDetail.length;
const formData = ZDDetail.map((data,index)=>{ const formData = ZDDetail.map((data, index) => {
if (data.GMD_Dealed == false && arrLen == (index+1)){ //只有最后一条账单未审核通过才显示 if (data.GMD_Dealed == false && arrLen == index + 1) {
//只有最后一条账单未审核通过才显示
runInAction(() => { runInAction(() => {
invoiceStore.invoiceFormData = {'info_money':data.GMD_Cost,'info_Currency':data.GMD_Currency,'info_date':isNotEmpty(data.GMD_PayDate)?dayjs(data.GMD_PayDate):'','info_gmdsn':data.GMD_SN}; invoiceStore.invoiceFormData = { info_money: data.GMD_Cost, info_Currency: data.GMD_Currency, info_date: isNotEmpty(data.GMD_PayDate) ? dayjs(data.GMD_PayDate) : "", info_gmdsn: data.GMD_SN };
}); });
return {'info_money':data.GMD_Cost,'info_Currency':data.GMD_Currency,'info_date':isNotEmpty(data.GMD_PayDate)?dayjs(data.GMD_PayDate):'','info_gmdsn':data.GMD_SN}; return { info_money: data.GMD_Cost, info_Currency: data.GMD_Currency, info_date: isNotEmpty(data.GMD_PayDate) ? dayjs(data.GMD_PayDate) : "", info_gmdsn: data.GMD_SN };
} }
}); });
if (form){ if (form) {
form.setFieldsValue(formData[arrLen-1]); //{'info_money':'111','info_Currency':'THB','info_date':''} form.setFieldsValue(formData[arrLen - 1]); //{'info_money':'111','info_Currency':'THB','info_date':''}
} }
//图片列表 //图片列表
let arrPicList = ZDDetail.map((data,index)=>{ let arrPicList = ZDDetail.map((data, index) => {
const GMD_Pic = data.GMD_Pic; const GMD_Pic = data.GMD_Pic;
let picList = []; let picList = [];
if (isNotEmpty(GMD_Pic)){ if (isNotEmpty(GMD_Pic)) {
let js_Pic = JSON.parse(GMD_Pic) let js_Pic = JSON.parse(GMD_Pic);
picList = js_Pic.map((picData,pic_Index)=>{ picList = js_Pic.map((picData, pic_Index) => {
return { return {
uid: -pic_Index, //用负数，防止添加删除的时候错误 uid: -pic_Index, //用负数，防止添加删除的时候错误
name: '', name: "",
status: "done", status: "done",
url: picData.url, url: picData.url,
} };
}); });
} }
if (data.GMD_Dealed == false && arrLen == (index+1)){ if (data.GMD_Dealed == false && arrLen == index + 1) {
runInAction(() => { runInAction(() => {
invoiceStore.invoicekImages = picList; invoiceStore.invoicekImages = picList;
}); });
} }
return picList; return picList;
});
})
setInvoicePicList(arrPicList); setInvoicePicList(arrPicList);
}) })
.catch(ex => { .catch(ex => {
notification.error({ notification.error({
message: `Notification`, message: `Notification`,
description: ex.message, description: ex.message,
placement: 'top', placement: "top",
duration: 4, duration: 4,
}); });
}) })
@ -96,26 +93,26 @@ function Detail() {
if (isNotEmpty(fileList)) { if (isNotEmpty(fileList)) {
arrimg = fileList.map((data, index) => { arrimg = fileList.map((data, index) => {
return { return {
url: data.url url: data.url,
} };
}); });
} }
const onFinish = values => { const onFinish = values => {
const fieldVaule = { const fieldVaule = {
...values, ...values,
'info_date': isNotEmpty(values['info_date']) ? values['info_date'].format('YYYY-MM-DD') : null, info_date: isNotEmpty(values["info_date"]) ? values["info_date"].format("YYYY-MM-DD") : null,
'info_images': JSON.stringify(arrimg), info_images: JSON.stringify(arrimg),
} };
console.log("Success:", fieldVaule); console.log("Success:", fieldVaule);
//入库 //入库
if (fieldVaule) { if (fieldVaule) {
invoiceStore.postEditInvoiceDetail(fieldVaule.info_gmdsn, fieldVaule.info_Currency, fieldVaule.info_money, fieldVaule.info_date, fieldVaule.info_images, "").then((data) => { invoiceStore.postEditInvoiceDetail(fieldVaule.info_gmdsn, fieldVaule.info_Currency, fieldVaule.info_money, fieldVaule.info_date, fieldVaule.info_images, "").then(data => {
console.log(data); console.log(data);
runInAction(() => { runInAction(() => {
let param = { 'info_money': fieldVaule.info_money, 'info_Currency': fieldVaule.info_Currency, 'info_date': fieldVaule.info_date }; let param = { info_money: fieldVaule.info_money, info_Currency: fieldVaule.info_Currency, info_date: fieldVaule.info_date };
invoiceStore.invoiceFormData = param; invoiceStore.invoiceFormData = param;
}) });
if (data.errcode == 0 ){ if (data.errcode == 0) {
notification.success({ notification.success({
message: `Notification`, message: `Notification`,
description: "Success Submit!", description: "Success Submit!",
@ -125,11 +122,8 @@ function Detail() {
} }
}); });
} }
}; };
const handleChange = info => { const handleChange = info => {
console.log(info); console.log(info);
let newFileList = [...info.fileList]; let newFileList = [...info.fileList];
@ -156,44 +150,44 @@ function Detail() {
arr = invoiceCurrencyList.map((data, index) => { arr = invoiceCurrencyList.map((data, index) => {
return { return {
value: data.CRI_Code, value: data.CRI_Code,
label: data.CRI_Name label: data.CRI_Name,
}; };
}); });
return arr; return arr;
} }
function addInvoice(){ function addInvoice() {
invoiceStore.postAddInvoice(GSN, "", 0, "", "[]", "").then((data) => { invoiceStore
}).finally(()=>{ .postAddInvoice(GSN, "", 0, "", "[]", "")
.then(data => {})
.finally(() => {
defaultShow(); defaultShow();
}) });
} }
function addButton(check) { function addButton(check) {
if (check) { if (check) {
return ( return (
<Row> <Row>
<Divider orientation="left"></Divider> <Divider orientation="left"></Divider>
<Button type="primary" block onClick={() => addInvoice(confirm)}> <Button type="primary" block onClick={() => addInvoice(confirm)}>
ADD New Invoice ADD New Invoice
</Button> </Button>
</Row> </Row>
);
)
} }
} }
//循环生成多次报账信息 //循环生成多次报账信息
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"
@ -201,8 +195,7 @@ 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">
>
<div> <div>
<PlusOutlined /> <PlusOutlined />
<div style={{ marginTop: 8 }}>Click to Upload</div> <div style={{ marginTop: 8 }}>Click to Upload</div>
@ -214,13 +207,7 @@ function Detail() {
<Input addonBefore="Amount：" value={data.GMD_Cost} /> <Input addonBefore="Amount：" value={data.GMD_Cost} />
</Col> </Col>
<Col span={8}> <Col span={8}>
Currency： <Select Currency： <Select placeholder="Select Currency type" allowClear options={bindCurrency()} value={data.GMD_Currency}></Select>
placeholder="Select Currency type"
allowClear
options={bindCurrency()}
value={data.GMD_Currency}
>
</Select>
</Col> </Col>
<Col span={8}> <Col span={8}>
<Input addonBefore="Due Dat:" value={data.GMD_PayDate} /> <Input addonBefore="Due Dat:" value={data.GMD_PayDate} />
@ -229,17 +216,15 @@ function Detail() {
{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
@ -259,8 +244,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={[
@ -268,11 +254,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={[
@ -280,29 +267,17 @@ function Detail() {
required: true, required: true,
message: "Please select Currency type!", message: "Please select Currency type!",
}, },
]} ]}>
> <Select placeholder="Select Currency type" onChange={onCurrencyChange} allowClear 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>
@ -314,27 +289,21 @@ function Detail() {
</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}>
<Title level={4}>Reference Number: {invoiceGroupInfo.VGroupInfo}</Title> <Title level={4}>Reference Number: {invoiceGroupInfo.VGroupInfo}</Title>
</Col> </Col>
<Col span={4}> <Col span={4}>
<Button type="link" onClick={() => navigate("/invoice")}> <NavLink to="/invoice">Back</NavLink>
Back
</Button>
</Col> </Col>
</Row> </Row>
<Title level={5}></Title> <Title level={5}></Title>
@ -342,12 +311,6 @@ function Detail() {
</Space> </Space>
</> </>
); );
} }
export default observer(Detail); export default observer(Detail);

18
src/views/invoice/Index.jsx
Unescape Escape View File

@ -26,14 +26,15 @@ function Index() {
}, },
{ {
title: "Arrival Date", title: "Arrival Date",
key: "LeftGDate", key: "GetGDate",
dataIndex: "LeftGDate", dataIndex: "GetGDate",
render: (text, record) => (isNotEmpty(text) ? formatDate(new Date(text)) : ""), render: (text, record) => (isNotEmpty(text) ? formatDate(new Date(text)) : ""),
}, },
{ {
title: "Total Amount", title: "Total Amount",
key: "AllMoney", key: "AllMoney",
dataIndex: "AllMoney", dataIndex: "AllMoney",
render: (text, record) => (isNotEmpty(record.GMD_Currency) ? record.GMD_Currency + " " + text : text),
}, },
{ {
title: "Status", title: "Status",
@ -43,15 +44,6 @@ function Index() {
]; ];
function BillStatus(text, record) { function BillStatus(text, record) {
// if (record.GMD_Dealed){
// return "已审核";
// }else if (record.GMDFillworkers_SN<1){
// return "未填写";
// }else if (record.VRequestVerify){
// return "未审核";
// }else{
// return "未提交";
// }
let FKState = record.FKState - 1; let FKState = record.FKState - 1;
return ( return (
<Steps <Steps
@ -60,22 +52,18 @@ function Index() {
items={[ items={[
{ {
title: "Submitted", title: "Submitted",
//status: 'finish',
icon: <EditOutlined />, icon: <EditOutlined />,
}, },
{ {
title: "Travel Advisor", title: "Travel Advisor",
// status: 'finish',
icon: <SolutionOutlined />, icon: <SolutionOutlined />,
}, },
{ {
title: "Finance Dept", title: "Finance Dept",
//status: 'process',
icon: <AuditOutlined />, icon: <AuditOutlined />,
}, },
{ {
title: "Paid", title: "Paid",
//status: 'wait',
icon: <SmileOutlined />, icon: <SmileOutlined />,
}, },
]} ]}

Write Preview
Loading…
Cancel
Save