实现发票extrainfo的显示和修改
parent
a8bd7a6faf
commit
ba1fdeb187
|
|
@ -1,6 +1,7 @@
|
|||
import {Staff} from "./Staff";
|
||||
import {Reimbursement} from "./Reimbursement";
|
||||
import {Dayjs} from "dayjs"
|
||||
import {Dayjs} from "dayjs"
|
||||
|
||||
export interface Invoice {
|
||||
invoiceAmount: number;
|
||||
invoiceCode: string;
|
||||
|
|
@ -28,7 +29,7 @@ export interface InvoiceIdentifyResponse {
|
|||
invoiceAmount: number;
|
||||
invoiceCheckCode?: string;
|
||||
invoiceCode: string;
|
||||
invoiceDate: string|Dayjs;
|
||||
invoiceDate: string | Dayjs;
|
||||
invoiceDeparture?: string;
|
||||
invoiceDestination?: string;
|
||||
invoiceExtraInfo: InvoiceExtraInfo[];
|
||||
|
|
@ -46,7 +47,7 @@ export interface InvoiceExtraInfo {
|
|||
value: string;
|
||||
}
|
||||
|
||||
export const invoiceTypeNameMap = new Map ([
|
||||
export const invoiceTypeNameMap = new Map([
|
||||
[0, '出租车发票'],
|
||||
[1, '定额发票'],
|
||||
[2, '火车票'],
|
||||
|
|
@ -77,10 +78,14 @@ export const invoiceItemsMap = new Map([
|
|||
['invoiceName', '发票名称'],
|
||||
])
|
||||
|
||||
export const invoiceTypeItemsMap = new Map ([
|
||||
|
||||
export const invoiceTypeItemsMap = new Map([
|
||||
[3, ['invoiceName', 'invoiceNo', 'invoiceCode', 'invoiceAmount', 'invoiceDate', 'invoiceCheckCode']],
|
||||
[13, ['invoiceName', 'invoiceNo', 'invoiceCode', 'invoiceAmount', 'invoiceDate', 'invoiceDeparture', 'invoiceDestination']],
|
||||
])
|
||||
export const invoiceTypeExtraItemsMap = new Map([
|
||||
[3, ['合计金额','合计税额', '购买方名称', '销售方名称', '收款人']],
|
||||
[13, ['时间']],
|
||||
])
|
||||
|
||||
|
||||
/*
|
||||
|
|
@ -103,4 +108,53 @@ export const invoiceTypeItemsMap = new Map ([
|
|||
"invoiceDeparture": "苏家屯",
|
||||
"invoiceDestination": "灯塔",
|
||||
"invoiceName": "辽宁省高速公路通行费专用发票"
|
||||
}*/
|
||||
}
|
||||
*/
|
||||
|
||||
|
||||
// {
|
||||
// "invoiceFileName": "4e39de8ff42cd6a75df83d554f60853c.jpg",
|
||||
// "invoiceNo": "50070865",
|
||||
// "invoiceCode": "032002200111",
|
||||
// "invoiceAmount": 118.37,
|
||||
// "invoiceDate": "2022-10-27T16:00:00.000Z",
|
||||
// "invoiceKind": 3,
|
||||
// "invoiceCheckCode": "04755931365083087405",
|
||||
// "invoiceRegionCode": "",
|
||||
// "invoiceSellerTaxCode": "",
|
||||
// "invoiceExtraInfo": {
|
||||
// "税额": "-2.37",
|
||||
// "复核": "李思",
|
||||
// "省": "江苏省",
|
||||
// "是否有公司印章": "1",
|
||||
// "单价": "123.01",
|
||||
// "备注": "订单号:255796687815",
|
||||
// "机器编号": "499098825881",
|
||||
// "单位": "个",
|
||||
// "数量": "1",
|
||||
// "销售方地址、电话": "昆山市干灯镇瞿家路555号8号房0512-39915704",
|
||||
// "合计金额": "¥104.75",
|
||||
// "发票类型": "增值税电子普通发票",
|
||||
// "销售方名称": "昆山京东尚信贸易有限公司",
|
||||
// "开票人": "汤丹丹",
|
||||
// "购买方名称": "个人",
|
||||
// "合计税额": "¥13.62",
|
||||
// "货物或应税劳务、服务名称": "*蓄电池*绿联苹果充电宝快充20000毫安时大容量便携移动电源支持PD20W华为22.5W超级快充通用iPh",
|
||||
// "密码区3": "1-1<9987*</7-104+1+*/81*5-4*",
|
||||
// "密码区4": "2/+6>29-24019>2619+56>4+515+",
|
||||
// "销售方开户行及账号": "中国建设银行昆山干灯支行32201986438051511848",
|
||||
// "密码区1": "031<9987*</7-104+1520*>+>*2<",
|
||||
// "规格型号": "20542",
|
||||
// "税率": "13%",
|
||||
// "密码区2": "686>3</014**/287273/34>/895+",
|
||||
// "价税合计(大写)": "壹佰壹拾捌元叁角柒分",
|
||||
// "销售方识别号": "913205830880018839",
|
||||
// "发票消费类型": "服务",
|
||||
// "收款人": "王陆",
|
||||
// "金额": "-18.26"
|
||||
// },
|
||||
// "invoiceNote": null,
|
||||
// "invoiceDeparture": null,
|
||||
// "invoiceDestination": null,
|
||||
// "invoiceName": "江苏增值税电子普通发票"
|
||||
// }
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import type {FormInstance} from 'antd/es/form';
|
|||
import {useAppDispatch} from "../../../models/hooks";
|
||||
import {
|
||||
InvoiceIdentifyResponse,
|
||||
invoiceItemsMap,
|
||||
invoiceItemsMap, invoiceTypeExtraItemsMap,
|
||||
invoiceTypeItemsMap,
|
||||
invoiceTypeNameMap,
|
||||
} from "../../../models/Invoice";
|
||||
|
|
@ -22,7 +22,7 @@ const props: UploadProps = {
|
|||
name: 'file',
|
||||
multiple: false,
|
||||
maxCount: 1,
|
||||
accept: "image/png, image/jpeg, image/jpg",
|
||||
accept: ".png, .jpg, .jpeg",
|
||||
beforeUpload: (file, fileList) => {
|
||||
tempFile = file
|
||||
console.log(file)
|
||||
|
|
@ -102,13 +102,16 @@ function FormModal(props: any) {
|
|||
const [open, setOpen] = useState(false)
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [invoice, setInvoice] = useState({})
|
||||
const [formItems, setFormItems] = useState(undefined)
|
||||
const [form] = Form.useForm();
|
||||
useEffect(() => {
|
||||
setOpen(props.open)
|
||||
console.log(props.invoiceIdentifyResponse)
|
||||
let i = {...props.invoiceIdentifyResponse}
|
||||
setInvoice(i)
|
||||
refreshFormItems(props.invoiceIdentifyResponse?.invoiceKind)
|
||||
form.setFieldsValue(i)
|
||||
|
||||
}, [props]);
|
||||
const handleCancel = () => {
|
||||
setOpen(false);
|
||||
|
|
@ -150,17 +153,6 @@ function FormModal(props: any) {
|
|||
else
|
||||
return <Input/>
|
||||
}
|
||||
let formItems = invoiceTypeItemsMap.get(props.invoiceIdentifyResponse?.invoiceKind)?.map((item, index) => {
|
||||
return (
|
||||
<Form.Item
|
||||
key={index}
|
||||
name={item}
|
||||
label={invoiceItemsMap.get(item)}
|
||||
>
|
||||
{inputComponent(item)}
|
||||
</Form.Item>
|
||||
)
|
||||
})
|
||||
|
||||
const getInvoiceKindOptions = () => {
|
||||
let options: { value: number; label: string; }[] = []
|
||||
|
|
@ -172,6 +164,41 @@ function FormModal(props: any) {
|
|||
})
|
||||
return options
|
||||
}
|
||||
const refreshFormItems = (invoiceKind:number) =>{
|
||||
let items = invoiceTypeItemsMap.get(invoiceKind)?.map((item, index) => {
|
||||
return (
|
||||
<Form.Item
|
||||
key={index}
|
||||
name={item}
|
||||
label={invoiceItemsMap.get(item)}
|
||||
>
|
||||
{inputComponent(item)}
|
||||
</Form.Item>
|
||||
)
|
||||
})
|
||||
let extraItems = invoiceTypeExtraItemsMap.get(invoiceKind)?.map((item, index) => {
|
||||
return (
|
||||
<Form.Item
|
||||
key={index}
|
||||
name={['invoiceExtraInfo',item]}
|
||||
label={item}
|
||||
>
|
||||
{inputComponent(item)}
|
||||
</Form.Item>
|
||||
)
|
||||
})
|
||||
|
||||
// @ts-ignore
|
||||
setFormItems(<>
|
||||
{items}
|
||||
{extraItems}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
const onTypeChange = (value:number) => {
|
||||
refreshFormItems(value)
|
||||
}
|
||||
|
||||
return (
|
||||
<Modal
|
||||
|
|
@ -197,6 +224,7 @@ function FormModal(props: any) {
|
|||
>
|
||||
<Select
|
||||
options={getInvoiceKindOptions()}
|
||||
onChange={onTypeChange}
|
||||
/>
|
||||
</Form.Item>
|
||||
{formItems}
|
||||
|
|
|
|||
Loading…
Reference in New Issue