更新版本库
This commit is contained in:
ajaxfan
210
src/pages/Invoice/Manager/components/ViewInvoiceFormModal.tsx
Normal file
210
src/pages/Invoice/Manager/components/ViewInvoiceFormModal.tsx
Normal file
@ -0,0 +1,210 @@
|
||||
import React, { useEffect,useState } from 'react';
|
||||
import { Collapse,Form, Input, Modal,Col,Row,Divider } from 'antd';
|
||||
import ProTable from "@ant-design/pro-table";
|
||||
|
||||
|
||||
interface ViewInvoiceFormModalProps {
|
||||
modalVisible: boolean;
|
||||
values: any;
|
||||
onCancel:any;
|
||||
}
|
||||
const ViewInvoiceFormModal: React.FC<ViewInvoiceFormModalProps> = (props) => {
|
||||
const {modalVisible, values,onCancel: handleUpdateModalVisible,} = props;
|
||||
|
||||
const [ListData, setListData] = useState<any>([]);
|
||||
|
||||
const layout = {
|
||||
labelCol: { span: 8 },
|
||||
wrapperCol: { span: 16 },
|
||||
};
|
||||
const [form] = Form.useForm();
|
||||
const { Panel } = Collapse;
|
||||
const { TextArea } = Input;
|
||||
|
||||
useEffect(() => {
|
||||
if (values?.id === null || values === undefined) {
|
||||
|
||||
} else {
|
||||
form.setFieldsValue({
|
||||
payerName: values.payerName,
|
||||
payerUserName: values.payerUserName,
|
||||
payerPhone: values.payerPhone,
|
||||
projectName: values.projectName,
|
||||
ebpProjectNumber: values.ebpProjectNumber,
|
||||
commodityDescribe: values.commodityDescribe,
|
||||
reviewerName: values.reviewerName,
|
||||
requestWopayTime: values.requestWopayTime,
|
||||
paymentTime: values.paymentTime,
|
||||
|
||||
|
||||
companyName: values.bidInvoice?.companyName,
|
||||
taxpayerIdentification: values.bidInvoice?.taxpayerIdentification,
|
||||
companyAddress: values.bidInvoice?.companyAddress,
|
||||
companyPhone: values.bidInvoice?.companyPhone,
|
||||
bank: values.bidInvoice?.bank,
|
||||
account: values.bidInvoice?.account,
|
||||
accountOpening: values.bidInvoice?.accountOpening,
|
||||
taxRegistration: values.bidInvoice?.taxRegistration,
|
||||
|
||||
region: values.bidInvoice?.region,
|
||||
address: values.bidInvoice?.address,
|
||||
addressee: values.bidInvoice?.addressee,
|
||||
phone: values.bidInvoice?.phone,
|
||||
});
|
||||
setListData(values.cartList);
|
||||
}
|
||||
}, [values,modalVisible])
|
||||
|
||||
const columns: any = [
|
||||
{
|
||||
title: '费用类别',
|
||||
valueType: 'text',
|
||||
width: 120,
|
||||
dataIndex: 'commodityName',
|
||||
},{
|
||||
title: '费用描述',
|
||||
valueType: 'text',
|
||||
width: 300,
|
||||
ellipsis:true,//自动缩略
|
||||
dataIndex: 'commodityDescribe',
|
||||
},{
|
||||
title: '费用金额',
|
||||
valueType: 'money',
|
||||
width: 200,
|
||||
dataIndex: 'amount',
|
||||
},{
|
||||
title: '下单人名称',
|
||||
valueType: 'text',
|
||||
dataIndex: 'payerUserName',
|
||||
},
|
||||
]
|
||||
|
||||
return (
|
||||
<Modal
|
||||
destroyOnClose
|
||||
title="收入信息查看"
|
||||
visible={modalVisible}
|
||||
onCancel={() => handleUpdateModalVisible()}
|
||||
okText="确定"
|
||||
okButtonProps={{disabled: true}}
|
||||
cancelText="取消"
|
||||
width={1000}
|
||||
>
|
||||
<Form {...layout} name="basic" preserve={false} form={form} size="small">
|
||||
<Row>
|
||||
<Col span={8}>
|
||||
<Form.Item label="缴费单位" name="payerName">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="联系人" name="payerUserName">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="联系电话" name="payerPhone">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Form.Item label="项目名称" name="projectName">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="费用描述" name="commodityDescribe">
|
||||
<TextArea readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Form.Item label="审核人" name="reviewerName">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="付款时间" name="requestWopayTime">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="到账时间" name="paymentTime">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</Form>
|
||||
<Collapse defaultActiveKey={['1', '2','3']} ghost expandIconPosition="right">
|
||||
<Panel header={<span style={{ color: '#980000' }}>增值税专用发票基本信息</span>} key="1">
|
||||
<Form {...layout} name="basic" preserve={false} form={form} size="small">
|
||||
<Row>
|
||||
<Col span={8}>
|
||||
<Form.Item label="公司名称" name="companyName">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="纳税人识别号" name="taxpayerIdentification">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="公司地址" name="companyAddress">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Form.Item label="公司电话" name="companyPhone">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="开户银行" name="bank">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="开户账号" name="account">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={8}>
|
||||
<Form.Item label="开户证明" name="accountOpening">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label={"税务登记证（国税）"} name="taxRegistration">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</Form>
|
||||
</Panel>
|
||||
<Panel header={<span style={{ color: '#980000' }}>发票邮寄地址</span>} key="2">
|
||||
<Form {...layout} name="basic" preserve={false} form={form} size="small">
|
||||
<Row>
|
||||
<Col span={12}>
|
||||
<Form.Item label="所在地区" name="region">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="收件地址" name="address">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item label="收件人" name="addressee">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
<Form.Item label="收件人电话" name="phone">
|
||||
<Input readOnly bordered={false} />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
</Row>
|
||||
</Form>
|
||||
</Panel>
|
||||
<Panel header={<span style={{ color: '#980000' }}>收入明细</span>} key="3">
|
||||
<ProTable
|
||||
rowKey="id"
|
||||
bordered={false}
|
||||
search={false}
|
||||
options={false}
|
||||
columns={columns}
|
||||
dataSource={ListData}
|
||||
pagination={false}
|
||||
/>
|
||||
<Divider orientation="right" style={{ color: '#980000' }}>
|
||||
合计支付金额：{values.amount == undefined ? null : values.amount}（元）
|
||||
</Divider>
|
||||
<p style={{ color: '#980000' }}>【说明】{values.remarks}</p>
|
||||
</Panel>
|
||||
</Collapse>
|
||||
|
||||
|
||||
|
||||
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default ViewInvoiceFormModal;
|
||||
248
src/pages/Invoice/Manager/index.tsx
Normal file
248
src/pages/Invoice/Manager/index.tsx
Normal file
@ -0,0 +1,248 @@
|
||||
import React, { useRef,useState } from 'react';
|
||||
import { Button,Popconfirm } from 'antd';
|
||||
import ProTable, { ProColumns, ActionType } from '@ant-design/pro-table';
|
||||
import FileDown from '@/utils/Download';
|
||||
|
||||
import ViewInvoiceFormModal from './components/ViewInvoiceFormModal';
|
||||
|
||||
import {getAgencyGetPagelist,getInSingleInvoiceRecord,updateInvoiceState,updateMailState,exportInvoiceList} from "./service"
|
||||
|
||||
|
||||
const Invoice: React.FC<any> = (props) => {
|
||||
|
||||
const actionRef = useRef<ActionType>();
|
||||
|
||||
|
||||
|
||||
//查看详情窗口显示
|
||||
const [viewInvoiceFormVisible, setViewInvoiceFormVisible] = useState<any>(false);
|
||||
//查看详情窗口record
|
||||
const [viewInvoiceValues, setViewInvoiceValues] = useState<any>({});
|
||||
|
||||
const viewDetail=(invoiceId:String)=>{
|
||||
getInSingleInvoiceRecord(invoiceId).then((res:any) => {
|
||||
if(res.success===true&&res.data?.id!==null){
|
||||
setViewInvoiceFormVisible(true);
|
||||
setViewInvoiceValues(res.data);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const openInvoice=(invoiceId:String)=>{
|
||||
updateInvoiceState(invoiceId);
|
||||
actionRef.current!.reload();
|
||||
}
|
||||
|
||||
const mailInvoice=(invoiceId:String)=>{
|
||||
updateMailState(invoiceId);
|
||||
actionRef.current!.reload();
|
||||
}
|
||||
|
||||
|
||||
|
||||
const columns: ProColumns<any>[] = [
|
||||
{
|
||||
title: '项目名称',
|
||||
dataIndex: 'projectName',
|
||||
valueType: 'text',
|
||||
hideInTable:true,//列表中不显示，查询条件中显示
|
||||
},
|
||||
{
|
||||
title: '费用名称',
|
||||
dataIndex: 'commodityName',
|
||||
width: 80,
|
||||
valueType: 'text',
|
||||
hideInSearch:true,//列表中显示，查询条件中不显示
|
||||
},
|
||||
{
|
||||
title: '项目业务编号',
|
||||
width: 100,
|
||||
valueType: 'text',
|
||||
hideInSearch:true,//列表中显示，查询条件中不显示
|
||||
dataIndex: 'ebpProjectNumber',
|
||||
},
|
||||
{
|
||||
title: '支付单位',
|
||||
valueType: 'text',
|
||||
width: 200,
|
||||
hideInSearch:true,//列表中显示，查询条件中不显示
|
||||
ellipsis:true,//自动缩略
|
||||
dataIndex: 'payerName',
|
||||
render: (_, record) => {
|
||||
let br=<br></br>
|
||||
return (
|
||||
<div>
|
||||
{record.payerName}{br}{record.payerUserName}{br}{record.payerPhone}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '支付方式',
|
||||
valueType: 'text',
|
||||
hideInSearch:true,//列表中显示，查询条件中不显示
|
||||
dataIndex: 'paymentMethod',
|
||||
valueEnum: {
|
||||
"0": { text: '线上', status: '' },
|
||||
"1": { text: '线下', status: '' },
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '到账时间',
|
||||
valueType: 'dateTime',
|
||||
hideInSearch:true,//列表中显示，查询条件中不显示
|
||||
dataIndex: 'paymentTime',
|
||||
},
|
||||
{
|
||||
title: '付款状态',
|
||||
valueType: 'text',
|
||||
hideInSearch:true,//列表中显示，查询条件中不显示
|
||||
dataIndex: 'payState',
|
||||
valueEnum: {
|
||||
"0": { text: '未支付', status: '' },
|
||||
"1": { text: '支付中', status: '' },
|
||||
"2": { text: '支付成功', status: '' },
|
||||
"3": { text: '到账待审核', status: '' },
|
||||
"4": { text: '确认到账', status: '' },
|
||||
"-1": { text: '已失效', status: '' },
|
||||
"-2": { text: '审核驳回', status: '' },
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '金额',
|
||||
valueType: 'money',
|
||||
hideInSearch:true,//列表中显示，查询条件中不显示
|
||||
dataIndex: 'amount',
|
||||
},
|
||||
{
|
||||
title: '发票状态',
|
||||
valueType: 'select',
|
||||
dataIndex: 'invoiceState',
|
||||
valueEnum: {
|
||||
"0": { text: '未开', status: '' },
|
||||
"1": { text: '已开', status: '' },
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '需要邮寄',
|
||||
valueType: 'text',
|
||||
hideInSearch:true,//列表中显示，查询条件中不显示
|
||||
dataIndex: 'mail',
|
||||
valueEnum: {
|
||||
"0": { text: '不需要', status: '' },
|
||||
"1": { text: '需要', status: '' },
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '邮寄状态',
|
||||
valueType: 'text',
|
||||
dataIndex: 'mailState',
|
||||
valueEnum: {
|
||||
"0": { text: '未邮寄', status: '' },
|
||||
"1": { text: '已邮寄', status: '' },
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '发票类型',
|
||||
dataIndex: 'type',
|
||||
hideInSearch:true,//列表中显示，查询条件中不显示
|
||||
valueType: 'text',
|
||||
width: 120,
|
||||
valueEnum: {
|
||||
"0": { text: '增值税普通发票' },
|
||||
"1": { text: '增值税专用发票' },
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'option',
|
||||
width: 80,
|
||||
valueType: 'option',
|
||||
render: (_, record) => {
|
||||
return (
|
||||
<>
|
||||
<Button size='small' onClick={() => {viewDetail(record.invoiceId)}}>查看</Button>
|
||||
{record.invoiceState==="0"?(
|
||||
<Popconfirm placement="top" title="确定开具此发票？" onConfirm={() => {openInvoice(record.invoiceId)}} okText="确定" cancelText="取消">
|
||||
<Button size='small'>开具发票</Button>
|
||||
</Popconfirm>
|
||||
):null}
|
||||
{record.mailState==="0"?(
|
||||
<Popconfirm placement="top" title="确定邮寄此发票？" onConfirm={() => {mailInvoice(record.invoiceId)}} okText="确定" cancelText="取消">
|
||||
<Button size='small'>邮寄发票</Button>
|
||||
</Popconfirm>
|
||||
):null}
|
||||
</>
|
||||
)
|
||||
}
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
<ProTable
|
||||
rowKey="invoiceId"
|
||||
actionRef={actionRef}//action触发后更新表格
|
||||
search={{
|
||||
defaultCollapsed: false,
|
||||
optionRender: ({ searchText, resetText }, { form }) => {
|
||||
return [
|
||||
<Button
|
||||
key="searchText"
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
form?.submit();
|
||||
}}
|
||||
>
|
||||
{searchText}
|
||||
</Button>,
|
||||
<Button
|
||||
key="resetText"
|
||||
onClick={() => {
|
||||
form?.resetFields();
|
||||
}}
|
||||
>
|
||||
{resetText}
|
||||
</Button>,
|
||||
<FileDown
|
||||
key="downLoad"
|
||||
type="xlsx"
|
||||
apiUrl="/api/biz-service-ebtp-expenses/v1/bizbidinvoice/agencyExportGetlist"
|
||||
fileName="发票列表"
|
||||
btnName="导出"
|
||||
method="GET"
|
||||
form={form}
|
||||
/>,
|
||||
];
|
||||
},
|
||||
}}
|
||||
columns={columns}
|
||||
request={(params) =>
|
||||
getAgencyGetPagelist({...params,pageNo:params.current}).then((res:any) => {
|
||||
const result = {
|
||||
data: res.data?.records,
|
||||
total: res.data?.total,
|
||||
success: res.success,
|
||||
pageSize: res.data?.size,
|
||||
current: res.data?.current
|
||||
}
|
||||
return result;
|
||||
})
|
||||
}
|
||||
/>
|
||||
{viewInvoiceValues?(
|
||||
<ViewInvoiceFormModal
|
||||
modalVisible={viewInvoiceFormVisible}
|
||||
values={viewInvoiceValues}
|
||||
onCancel={() => {
|
||||
setViewInvoiceFormVisible(!viewInvoiceFormVisible);
|
||||
setViewInvoiceValues({});
|
||||
}}
|
||||
>
|
||||
</ViewInvoiceFormModal>
|
||||
):null}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default Invoice;
|
||||
46
src/pages/Invoice/Manager/service.ts
Normal file
46
src/pages/Invoice/Manager/service.ts
Normal file
@ -0,0 +1,46 @@
|
||||
import request from '@/utils/request';
|
||||
|
||||
|
||||
//获取发票列表
|
||||
export async function getAgencyGetPagelist(paramas:any) {
|
||||
return request('/api/biz-service-ebtp-expenses/v1/bizbidinvoice/agencyGetPagelist',{
|
||||
method:'GET' ,
|
||||
params:{
|
||||
...paramas
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//获取单条发票信息
|
||||
export async function getInSingleInvoiceRecord(invoiceId:String) {
|
||||
return request('/api/biz-service-ebtp-expenses/v1/bizbidinvoice/'+invoiceId,{
|
||||
method:'GET' ,
|
||||
})
|
||||
}
|
||||
|
||||
//更改发票状态，由未开设置成已开
|
||||
export async function updateInvoiceState(invoiceId:String) {
|
||||
return request('/api/biz-service-ebtp-expenses/v1/bizbidinvoice/issueInvoice/'+invoiceId,{
|
||||
method:'PUT' ,
|
||||
})
|
||||
}
|
||||
|
||||
//更改邮寄状态，由未邮寄设置成已邮寄
|
||||
export async function updateMailState(invoiceId:String) {
|
||||
return request('/api/biz-service-ebtp-expenses/v1/bizbidinvoice/mailInvoice/'+invoiceId,{
|
||||
method:'PUT' ,
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
//导出发票列表
|
||||
export async function exportInvoiceList(paramas:any) {
|
||||
return request('/api/biz-service-ebtp-expenses/v1/bizbidinvoice/agencyExportGetlist',{
|
||||
method:'GET' ,
|
||||
params:{
|
||||
...paramas
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user