完善我的发票和发票管理

main
wuyize 2023-01-03 14:39:32 +08:00
parent c95fb9ab79
commit 0a522d1fe6
4 changed files with 88 additions and 45 deletions

View File

@ -40,6 +40,8 @@ export class InvoiceSearchOption {
invoiceDateEnd: Nullable<string> invoiceDateEnd: Nullable<string>
invoiceNote: Nullable<string> invoiceNote: Nullable<string>
invoiceUploaderId: Nullable<string> invoiceUploaderId: Nullable<string>
invoiceUploaderIdFuzzy: Nullable<string>
invoiceUploaderNameFuzzy: Nullable<string>
pageNum: number pageNum: number
pageSize: number pageSize: number
@ -60,6 +62,8 @@ export class InvoiceSearchOption {
this.invoiceDateEnd = null this.invoiceDateEnd = null
this.invoiceNote = null this.invoiceNote = null
this.invoiceUploaderId = null this.invoiceUploaderId = null
this.invoiceUploaderIdFuzzy = null
this.invoiceUploaderNameFuzzy = null
this.pageNum = 0 this.pageNum = 0
this.pageSize = 20 this.pageSize = 20
} }

View File

@ -1,5 +1,5 @@
import React, {useEffect, useState} from "react"; import React, {useEffect, useState} from "react";
import {Button, DatePicker, Form, Input, InputNumber, Modal, Select, Typography} from "antd"; import {Button, DatePicker, Form, Input, InputNumber, Modal, Select, Typography, Image} from "antd";
import { import {
InvoiceDetail, InvoiceDetail,
InvoiceIdentifyResponse, InvoiceIdentifyResponse,
@ -7,7 +7,7 @@ import {
invoiceTypeItemsMap, invoiceTypeItemsMap,
invoiceTypeNameMap, invoiceTypeShowItemsMap invoiceTypeNameMap, invoiceTypeShowItemsMap
} from "../../models/Invoice"; } from "../../models/Invoice";
import axiosInstance from "../../utils/axiosInstance"; import axiosInstance, {baseUrl} from "../../utils/axiosInstance";
import TextArea from "antd/es/input/TextArea"; import TextArea from "antd/es/input/TextArea";
import dayjs, {Dayjs} from "dayjs"; import dayjs, {Dayjs} from "dayjs";
import qs from "qs"; import qs from "qs";
@ -50,6 +50,7 @@ function InvoiceDetailModal(props: any) {
key={index} key={index}
name={item} name={item}
label={invoiceItemsMap.get(item)} label={invoiceItemsMap.get(item)}
style={{marginBottom: 10}}
> >
{inputComponent(item)} {inputComponent(item)}
</Form.Item> </Form.Item>
@ -99,17 +100,30 @@ function InvoiceDetailModal(props: any) {
open={props.open} open={props.open}
title="发票详情" title="发票详情"
onCancel={handleCancel} onCancel={handleCancel}
footer={ <Button key="next" type="primary" danger loading={loading} onClick={withDraw} footer={
<div style={{width: '100%', display: "flex", flexDirection: "row", justifyContent: "space-between"}}>
<Text>{props.invoiceDetail?.modified ? '发票信息经过手动修改' : ''}</Text>
<div>
{props.invoiceDetail?.invoiceState === 0 && <Button danger loading={loading} onClick={withDraw}
> >
</Button> } </Button>}
<Button type="primary" href={baseUrl + props.invoiceDetail?.invoiceFileUri} download
> >
{
<Form layout="horizontal" labelCol={{span: 4}} </Button>
</div>
</div>
}
>
<Form layout="horizontal" labelCol={{span: 4}} size={'small'}
> >
<Form.Item <Form.Item
name={`invoiceKind`} name={`invoiceKind`}
label={`发票类型`} label={`发票类型`}
style={{marginBottom: 10, marginTop: 10}}
> >
<Text>{invoiceTypeNameMap.get(props.invoiceDetail?.invoiceKind)}</Text> <Text>{invoiceTypeNameMap.get(props.invoiceDetail?.invoiceKind)}</Text>
</Form.Item> </Form.Item>
@ -117,11 +131,18 @@ function InvoiceDetailModal(props: any) {
<Form.Item <Form.Item
name={`invoiceNote`} name={`invoiceNote`}
label={`备注`} label={`备注`}
style={{marginBottom: 10}}
> >
<Paragraph style={{marginTop: 5}}>{props.invoiceDetail?.invoiceNote}</Paragraph> <Paragraph style={{marginTop: 5}}>{props.invoiceDetail?.invoiceNote}</Paragraph>
</Form.Item> </Form.Item>
</Form> </Form>
} <Image
width={'100%'}
src={baseUrl + props.invoiceDetail?.invoiceFileUri}
/>
{/* <div style={{ position:"absolute", left:0, top: 50, paddingRight: 20,width: '100%', display: "flex", flexDirection: "column", alignItems: "flex-end"}}>
</div>*/}
</Modal> </Modal>
) )

View File

@ -74,7 +74,7 @@ function InvoiceSearch(props: { handleSearchData: any; }) {
const items: MenuProps['items'] = [ const items: MenuProps['items'] = [
{ {
key: '1', key: '1',
label: (<a className="simpleSearchOption" onClick={() => { label: (<a onClick={() => {
invoiceSearchOption.clear(); invoiceSearchOption.clear();
setActivatedOption("发票代码") setActivatedOption("发票代码")
}}> }}>
@ -83,13 +83,33 @@ function InvoiceSearch(props: { handleSearchData: any; }) {
}, },
{ {
key: '2', key: '2',
label: (<a className="simpleSearchOption" onClick={() => { label: (<a onClick={() => {
invoiceSearchOption.clear(); invoiceSearchOption.clear();
setActivatedOption("发票编号") setActivatedOption("发票编号")
}}> }}>
</a>) </a>)
},
{
key: '3',
label: (<a onClick={() => {
invoiceSearchOption.clear();
setActivatedOption("上传者姓名")
}}>
</a>)
},
{
key: '4',
label: (<a onClick={() => {
invoiceSearchOption.clear();
setActivatedOption("上传者工号")
}}>
</a>)
} }
]; ];
const onValuesChange = (changedValues: any, allValues: any) => { const onValuesChange = (changedValues: any, allValues: any) => {
@ -120,12 +140,23 @@ function InvoiceSearch(props: { handleSearchData: any; }) {
if (!complexEnabled) if (!complexEnabled)
invoiceSearchOption.clear() invoiceSearchOption.clear()
console.log(invoiceSearchOption) console.log(invoiceSearchOption)
if (activatedOption === "发票代码") { invoiceSearchOption.invoiceCode = null
invoiceSearchOption.invoiceCode = value; invoiceSearchOption.invoiceNo = null
invoiceSearchOption.invoiceNo = null; invoiceSearchOption.invoiceUploaderNameFuzzy = null
} else { invoiceSearchOption.invoiceUploaderIdFuzzy = null
invoiceSearchOption.invoiceNo = value; switch (activatedOption) {
invoiceSearchOption.invoiceCode = null; case "发票代码":
invoiceSearchOption.invoiceCode = value
break;
case "发票编号":
invoiceSearchOption.invoiceNo = value
break;
case "上传者姓名":
invoiceSearchOption.invoiceUploaderNameFuzzy = value
break;
case "上传者工号":
invoiceSearchOption.invoiceUploaderIdFuzzy = value
break;
} }
props.handleSearchData(invoiceSearchOption) props.handleSearchData(invoiceSearchOption)

View File

@ -1,13 +0,0 @@
.simpleSearchBar{
height:40px;
width:100%;
position: center;
text-align: center;
}
.simpleSearch{
text-align: left;
}
.uploadButton{
}