release
YCC 2 years ago
parent 02fb456681
commit e0c51808e9

@ -13,342 +13,6 @@ const { Title } = Typography;
const { TextArea } = Input; const { TextArea } = Input;
function Detail() { function Detail() {
<<<<<<< HEAD
const navigate = useNavigate();
const { GMDSN, GSN } = useParams();
const { invoiceStore, authStore } = useStore();
const { invoicekImages, invoiceGroupInfo, invoiceProductList, invoiceCurrencyList, invoiceZDDetail } = invoiceStore;
const [form] = Form.useForm();
const [dataLoading, setDataLoading] = useState(false);
const { formCurrency, onCurrencyChange } = useState();
const { notification } = App.useApp();
const [invoicePicList,setInvoicePicList] = useState([]);
useEffect(() => {
console.info("Detail.useEffect: " + GMDSN + "/" + GSN);
defaultShow();
}, [GMDSN, GSN]);
function defaultShow(){
setDataLoading(true);
invoiceStore.fetchInvoiceDetail(GMDSN, GSN)
.then((json) => {
let ZDDetail = json.ZDDetail;
let arrLen = ZDDetail.length;
const formData = ZDDetail.map((data,index)=>{
if (data.GMD_Dealed == false && arrLen == (index+1)){ //
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};
});
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){
form.setFieldsValue(formData[arrLen-1]); //{'info_money':'111','info_Currency':'THB','info_date':''}
}
//
let arrPicList = ZDDetail.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)){
runInAction(() => {
invoiceStore.invoicekImages = picList;
});
}
return picList;
})
setInvoicePicList(arrPicList);
})
.catch(ex => {
notification.error({
message: `Notification`,
description: ex.message,
placement: 'top',
duration: 4,
});
})
.finally(() => {
setDataLoading(false);
});
}
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': 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(fieldVaule.info_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;
})
if (data.errcode == 0 ){
notification.success({
message: `Notification`,
description: "Success Submit!",
placement: "top",
duration: 4,
});
}
});
}
};
const handleChange = info => {
console.log(info);
let newFileList = [...info.fileList];
newFileList = newFileList.map(file => {
if (file.response && file.response.result) {
file.url = file.response.result.file_url;
}
return file;
});
runInAction(() => {
invoiceStore.invoicekImages = newFileList;
});
};
const handRemove = info => {
console.log(info);
invoiceStore.removeFeedbackImages(info.url);
return true;
};
//
function bindCurrency() {
let arr = [];
arr = invoiceCurrencyList.map((data, index) => {
return {
value: data.CRI_Code,
label: data.CRI_Name
};
});
return arr;
}
function addInvoice(){
invoiceStore.postAddInvoice(GSN, "", 0, "", "[]", "").then((data) => {
}).finally(()=>{
defaultShow();
})
}
function addButton(check) {
if (check) {
return (
<Row>
<Divider orientation="left"></Divider>
<Button type="primary" block onClick={() => addInvoice(confirm)}>
ADD New Invoice
</Button>
</Row>
)
}
}
//
function bindSubmitForm() {
let submitForm = invoiceZDDetail.map((data, index) => {
if (data.GMD_Dealed) { //
return (
<Row key={data.GMD_SN} gutter={16} style={{ backgroundColor: "#f6f7f9", width: "100%", padding: "20px 40px" }} >
<Col span={4}></Col>
<Col span={18} >
<Divider orientation="left">Invoice {index + 1}</Divider>
<Upload
name="ghhfile"
accept="image/*"
multiple={true}
action={config.HT_HOST + `/service-fileServer/FileUpload?GRI_SN=${GSN}&VEI_SN=${authStore.login.travelAgencyId}&FilePathName=invoice&token=${authStore.login.token}`}
fileList={invoicePicList[index]}
listType="picture-card"
>
<div>
<PlusOutlined />
<div style={{ marginTop: 8 }}>Click to Upload</div>
</div>
</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)}
</Col>
<Col span={4}></Col>
</Row>
)
} else {
//
return (
<Row key={data.GMD_SN} gutter={16} style={{ backgroundColor: "#f6f7f9", width: "100%", padding: "20px 40px" }} >
<Col span={4}></Col>
<Col span={18} >
<Form name="invoice_submit" onFinish={onFinish} labelCol={{ span: 5 }} form={form} style={{backgroundColor:"#fff" , padding:"20px"}}>
<Divider orientation="left">Invoice {index + 1}</Divider>
<Form.Item>
<Upload
name="ghhfile"
accept="image/*"
multiple={true}
action={config.HT_HOST + `/service-fileServer/FileUpload?GRI_SN=${GSN}&VEI_SN=${authStore.login.travelAgencyId}&FilePathName=invoice&token=${authStore.login.token}`}
fileList={fileList}
listType="picture-card"
onChange={handleChange}
onRemove={handRemove}>
<div>
<PlusOutlined />
<div style={{ marginTop: 8 }}>Click to Upload</div>
</div>
</Upload>
</Form.Item>
<Divider orientation="left">Details</Divider>
<Row gutter={16}>
<Col span={8}> <Form.Item
name="info_money"
label="Amount"
rules={[
{
required: true,
message: "Please input your money!",
},
]}
>
<Input />
</Form.Item></Col>
<Col span={8}><Form.Item
name="info_Currency"
label="Currency"
rules={[
{
required: true,
message: "Please select Currency type!",
},
]}
>
<Select
placeholder="Select Currency type"
onChange={onCurrencyChange}
allowClear
options={bindCurrency()}
>
</Select>
</Form.Item></Col>
<Col span={8}>
<Form.Item
name="info_date"
label="Due Date: "
>
<DatePicker />
</Form.Item></Col>
</Row>
<Form.Item
name="info_gmdsn"
hidden={true}
>
<input />
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit">
Submit
</Button>
</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>
</Form>
</Col>
<Col span={4}></Col>
</Row>
)
}
})
return submitForm;
}
return (
<>
<Space direction="vertical" style={{ width: "100%" }}>
<Row gutter={16}>
<Col span={20}>
<Title level={4}>Reference Number: {invoiceGroupInfo.GRI_No}</Title>
</Col>
<Col span={4}>
<Button type="link" onClick={() => navigate("/invoice")}>
Back
</Button>
</Col>
</Row>
<Title level={5}></Title>
{bindSubmitForm()}
</Space>
</>
);
=======
const navigate = useNavigate(); const navigate = useNavigate();
const { GMDSN, GSN } = useParams(); const { GMDSN, GSN } = useParams();
const { invoiceStore, authStore } = useStore(); const { invoiceStore, authStore } = useStore();
@ -642,7 +306,6 @@ function Detail() {
</Space> </Space>
</> </>
); );
>>>>>>> 7a9dc9e0bb50004a6deb95b2be5388ec5f5ef209
} }
export default observer(Detail); export default observer(Detail);

Loading…
Cancel
Save