diff --git a/src/stores/Invoice.js b/src/stores/Invoice.js index 4c0b2a7..59da0fe 100644 --- a/src/stores/Invoice.js +++ b/src/stores/Invoice.js @@ -1,8 +1,10 @@ import { makeAutoObservable,runInAction } from "mobx"; -import { fetchJSON } from "@/utils/request"; +import { fetchJSON,postForm} from "@/utils/request"; import { prepareUrl,isNotEmpty } from '@/utils/commons'; import { HT_HOST } from "@/config"; import { json } from "react-router-dom"; +import * as config from "@/config"; +import dayjs from "dayjs"; class Invoice { constructor(root) { @@ -13,8 +15,11 @@ class Invoice { invoiceList = []; //账单列表 invoicekImages = []; //图片列表 invoiceGroupInfo= {}; //账单详细 - invocieProductList=[];//账单细项 - invocieCurrencyList=[];//币种 + invoiceProductList=[];//账单细项 + invoiceZDDetail = []; //报账信息 + invoiceCurrencyList=[];//币种 + invoicePicList = []; //多账单图片列表数组 + invoiceFormData = {'info_money':0,'info_Currency':'','info_date':''}; //存储form数据 @@ -23,7 +28,7 @@ class Invoice { const totalNum = current == 1 ? 0 : this.invoicePage.total; //组合param const fetchUrl = prepareUrl(HT_HOST + '/service-cusservice/PTSearchGMBPageList') - .append('VEI_SN', '628') //this.root.authStore.login.travelAgencyId + .append('VEI_SN', this.root.authStore.login.travelAgencyId) // .append('OrderType',OrderType) .append('GroupNo',GroupNo) .append('DateStart',DateStart) @@ -86,7 +91,7 @@ class Invoice { fetchInvoiceDetail(GMDSN,GSN){ const fetchUrl = prepareUrl(HT_HOST + '/service-cusservice/PTGetZDDetail') - .append('VEI_SN', '628') //this.root.authStore.login.travelAgencyId + .append('VEI_SN', this.root.authStore.login.travelAgencyId) // .append('GRI_SN',GSN) .append('GMD_SN',GMDSN) .append('LGC',1) @@ -98,8 +103,12 @@ class Invoice { runInAction(()=>{ if(json.errcode==0){ this.invoiceGroupInfo = json.GroupInfo[0]; - this.invocieProductList = json.ProductList; - this.invocieCurrencyList = json.CurrencyList; + this.invoiceProductList = json.ProductList; + this.invoiceCurrencyList = json.CurrencyList; + this.invoiceZDDetail = json.ZDDetail; + //循环获取图片列表 + this.getInvoicekImages_fromData(json.ZDDetail); + this.getFormData(json.ZDDetail); }else{ throw new Error(json.errmsg + ': ' + json.errcode); } @@ -112,7 +121,7 @@ class Invoice { //获取供应商提交的图片 getInvoicekImages(VEI_SN, GRI_SN) { let url = `/service-fileServer/ListFile`; - url += `?GRI_SN=${GRI_SN}&VEI_SN=${VEI_SN}`; + url += `?GRI_SN=${GRI_SN}&VEI_SN=${VEI_SN}&FilePathName=invoice`; fetch(config.HT_HOST + url) .then(response => response.json()) .then(json => { @@ -133,6 +142,42 @@ class Invoice { }); } + //从数据库获取图片列表 + getInvoicekImages_fromData(jsonData){ + let arrLen = jsonData.length; + const arrPicList = jsonData.map((data,index)=>{ + const GMD_Pic = data.GMD_Pic; + let picList = []; + if (isNotEmpty(GMD_Pic)){ + let js_Pic = JSON.parse(GMD_Pic) + picList = js_Pic.map((picData,pic_Index)=>{ + return { + uid: -pic_Index, //用负数，防止添加删除的时候错误 + name: '', + status: "done", + url: picData.url, + } + }); + } + if (data.GMD_Dealed == false && arrLen == (index+1)){ + this.invoicekImages = picList; + } + return picList; + + }) + this.invoicePicList = arrPicList; + } + + //获取数据库的表单默认数据回填。 + getFormData(jsonData){ + let arrLen = jsonData.length; + return jsonData.map((data,index)=>{ + if (data.GMD_Dealed == false && arrLen == (index+1)){ //只有最后一条账单未审核通过才显示 + this.invoiceFormData = {'info_money':data.GMD_Cost,'info_Currency':data.GMD_Currency,'info_date':isNotEmpty(data.GMD_PayDate)?dayjs(data.GMD_PayDate):''}; + } + }); + } + removeFeedbackImages(fileurl) { let url = `/service-fileServer/FileDelete`; @@ -149,6 +194,25 @@ class Invoice { } + postEditInvoiceDetail(GMD_SN,Currency,Cost,PayDate,Pic,Memo){ + let postUrl = HT_HOST + '/service-cusservice/EditSupplierFK'; + let formData = new FormData(); + formData.append('LMI_SN', this.root.authStore.login.userId); + formData.append('GMD_SN', GMD_SN); + formData.append('Currency', Currency); + formData.append('Cost', Cost); + formData.append('PayDate', isNotEmpty(PayDate)?PayDate:'' ); + formData.append('Pic', Pic); + formData.append('Memo', Memo); + + return postForm(postUrl,formData) + .then(json=>{ + console.info(json); + return json; + }); + } + + invoicePage = { current:1, size:10, diff --git a/src/views/invoice/Detail.jsx b/src/views/invoice/Detail.jsx index 54ee211..3d4999b 100644 --- a/src/views/invoice/Detail.jsx +++ b/src/views/invoice/Detail.jsx @@ -2,27 +2,37 @@ import { useParams, useNavigate } from "react-router-dom"; import { useEffect, useState } from "react"; import { observer } from "mobx-react"; import { toJS, runInAction } from "mobx"; -import { Row, Col, Space, Button, Typography, Card, Form, Upload, Input, Divider, DatePicker, Select } from "antd"; +import { Row, Col, Space, Button, Typography, Card, Form, Upload, Input, Divider, DatePicker, Select, App, Modal } from "antd"; import { useStore } from "@/stores/StoreContext.js"; import { PlusOutlined } from "@ant-design/icons"; +import { isNotEmpty } from "@/utils/commons"; import * as config from "@/config"; +import dayjs from "dayjs"; + const { Title } = Typography; +const { TextArea } = Input; function Detail() { const navigate = useNavigate(); const { GMDSN, GSN } = useParams(); const { invoiceStore, authStore } = useStore(); - const { invoicekImages, invoiceGroupInfo, invocieProductList, invocieCurrencyList } = invoiceStore; + const { invoicekImages, invoiceGroupInfo, invoiceProductList, invoiceCurrencyList, invoiceZDDetail, invoicePicList } = invoiceStore; const [form] = Form.useForm(); const [dataLoading, setDataLoading] = useState(false); - const { formDate, onDateChange } = useState(); const { formCurrency, onCurrencyChange } = useState(); + const { notification } = App.useApp(); + + const [isModalOpen, setIsModalOpen] = useState(false); + const [confirmLoading, setConfirmLoading] = useState(false); useEffect(() => { console.info("Detail.useEffect: " + GMDSN + "/" + GSN); setDataLoading(true); invoiceStore.fetchInvoiceDetail(GMDSN, GSN) + .then(() => { + form.setFieldsValue(invoiceStore.invoiceFormData); //{'info_money':'111','info_Currency':'THB','info_date':''} + }) .catch(ex => { notification.error({ message: `Notification`, @@ -38,13 +48,34 @@ function Detail() { }, [GMDSN, GSN]); const fileList = toJS(invoicekImages); + //图片列表 + let arrimg = []; + if (isNotEmpty(fileList)) { + arrimg = fileList.map((data, index) => { + return { + url: data.url + } + }); + } const onFinish = values => { const fieldVaule = { ...values, - 'info_date': values['info_date'].format('YYYY-MM-DD'), - 'info_images': fileList, + 'info_date': isNotEmpty(values['info_date']) ? values['info_date'].format('YYYY-MM-DD') : null, + 'info_images': JSON.stringify(arrimg), } console.log("Success:", fieldVaule); + //入库 + if (fieldVaule) { + invoiceStore.postEditInvoiceDetail(GMDSN, fieldVaule.info_Currency, fieldVaule.info_money, fieldVaule.info_date, fieldVaule.info_images, "").then((data) => { + console.log(data); + runInAction(() => { + let param = { 'info_money': fieldVaule.info_money, 'info_Currency': fieldVaule.info_Currency, 'info_date': fieldVaule.info_date }; + invoiceStore.invoiceFormData = param; + }) + }); + } + + }; const handleChange = info => { console.log(info); @@ -66,126 +97,301 @@ function Detail() { return true; }; + //币种 function bindCurrency() { let arr = []; - arr = invocieCurrencyList.map((data, index) => { + arr = invoiceCurrencyList.map((data, index) => { return { value: data.CRI_Code, label: data.CRI_Name }; - - // (); }); return arr; } + function addButton(check) { + if (check) { + return ( - return ( - - - - Reference Number: {invoiceGroupInfo.VGroupInfo} - - - - - - 基础信息 - - - -

CHINA HIGHLIGHTS

- - - - -

{invoiceGroupInfo.WLFirstName} {invoiceGroupInfo.WLLastName}    Email: {invoiceGroupInfo.WLEmail}

- - - - -

{invoiceGroupInfo.County}

- - - - 报账信息 - - - -
- 上传照片 - + + + + ) + } + } + + //循环生成多次报账信息 + function bindSubmitForm() { + let submitForm = invoiceZDDetail.map((data, index) => { + if (data.GMD_Dealed) { //已审核的直接显示信息即可，无需表单 + return ( + + + + 第 {index + 1} 次报账 + >
Click to Upload
 + 提交信息 + + + + + + 金额币种： + + + + + + {addButton(index + 1 == invoiceZDDetail.length)} + + + + + + ) + } else { + // 一个团只能有一个未审核的账单记录 + return ( + + + + + 上传照片 + + +
+ +
Click to Upload
+
+ + + 提交信息 + + + + + + + + + + + + + + + + + + + + + + ) + } + + }) + + // console.info(invoiceStore.invoiceFormData) + + return submitForm; + } + + + //#region Modal + const showConfirmModal = (confirm) => { + setIsModalOpen(true); + // setConfirmText(confirm.PCI_ConfirmText); + //reservationStore.editConfirmation(confirm); + }; + + const handleOk = () => { + setConfirmLoading(true); + // reservationStore.submitConfirmation(confirmText) + // .finally(() => { + // setIsModalOpen(false); + // setConfirmLoading(false); + // }); + }; + const handleCancel = () => { + setIsModalOpen(false); + }; + + //#endregion + + + + return ( + <> + + Add New Invoice +
+ 上传照片 + + +
+ +
Click to Upload
+
+ + + 提交信息 + + + + - 提交信息 - - - + - - - - - - - - - - - - + -
- - -
+ + + + - + + + + + + Reference Number: {invoiceGroupInfo.VGroupInfo} + + + + + + 基础信息 + + + +

CHINA HIGHLIGHTS

+ + + + +

{invoiceGroupInfo.WLFirstName} {invoiceGroupInfo.WLLastName}    Email: {invoiceGroupInfo.WLEmail}

+ + + + +

{invoiceGroupInfo.County}

+ + + + 报账信息 + {bindSubmitForm()} + + ); diff --git a/src/views/invoice/Index.jsx b/src/views/invoice/Index.jsx index 6be1c18..37f6342 100644 --- a/src/views/invoice/Index.jsx +++ b/src/views/invoice/Index.jsx @@ -35,7 +35,8 @@ function Index() { { title: '接团时间', key: 'LeftGDate', - dataIndex: 'LeftGDate' + dataIndex: 'LeftGDate', + render:(text,record) => isNotEmpty(text)?formatDate(new Date(text)):"" }, { title: '人数',