开发票
This commit is contained in:
lyp
parent
458ae8efaf
commit
f59ab1d7c4
File diff suppressed because it is too large
Load Diff
@ -1,22 +1,27 @@
|
||||
import { Button, Dropdown, Flex, MenuProps, Modal, Popconfirm, Space, Table, TableProps, Tag } from "antd";
|
||||
import { Button, Dropdown, Flex, MenuProps, Modal, Popconfirm, Space, Table, TableProps, Tag, Spin } from "antd";
|
||||
import { PlusOutlined } from "@ant-design/icons";
|
||||
import {
|
||||
useEffect,
|
||||
// useRef,
|
||||
useState
|
||||
useState,
|
||||
useContext
|
||||
} from "react";
|
||||
import { get, put } from "../../util/AjaxUtils.ts";
|
||||
import { IListPage } from "../../interfaces/listpage/IListPage.ts";
|
||||
import { getInvoiceRecordList,cancelInvoice } from "../../request/api.ts";
|
||||
import {downloadInvoice} from '../../request/request.ts'
|
||||
import { GlobalContext } from "../../context/GlobalContext.ts";
|
||||
// import { get, put } from "../../util/AjaxUtils.ts";
|
||||
// import { IListPage } from "../../interfaces/listpage/IListPage.ts";
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import InvoiceSave from "./InvoiceSave.tsx";
|
||||
import InvoiceEdit from "./InvoiceEdit.tsx";
|
||||
// import InvoiceSave from "./InvoiceSave.tsx";
|
||||
import InvoiceSave from "./NewInvoiceSave.tsx";
|
||||
import InvoiceEdit from "./NewInvoiceEdit.tsx";
|
||||
import InvoiceShow from "./InvoiceShow.tsx";
|
||||
|
||||
enum InvoiceStatusEnum {
|
||||
PENDING = 'PENDING',
|
||||
COMPLETE = 'COMPLETE',
|
||||
FAILED = 'FAILED',
|
||||
CANCEL = 'CANCEL',
|
||||
PENDING = '1',
|
||||
COMPLETE = '2',
|
||||
FAILED = '0',
|
||||
CANCEL = '-1',
|
||||
}
|
||||
|
||||
type DataType = {
|
||||
@ -38,6 +43,8 @@ type DataType = {
|
||||
invoiceStatus: InvoiceStatusEnum;
|
||||
invoiceTitle: string;
|
||||
orderIds: string[];
|
||||
invoiceRechargeId: string;
|
||||
invoiceFile: string;
|
||||
}
|
||||
|
||||
export default function InvoiceList() {
|
||||
@ -49,57 +56,80 @@ export default function InvoiceList() {
|
||||
const [isEditModalOpen, setIsEditModalOpen] = useState(false);
|
||||
const [isShowModalOpen, setIsShowModalOpen] = useState(false);
|
||||
// const invoiceId = useRef('');
|
||||
const [invoiceId, setInvoiceId] = useState('');
|
||||
// const [invoiceId, setInvoiceId] = useState('');
|
||||
|
||||
const [status, setStatus] = useState(''); //状态
|
||||
const [invoiceRechargeId, setInvoiceRechargeId] = useState(''); //查看订单主键
|
||||
// const [invdataArray,setInvDataArray] = useState<any[]>([]);
|
||||
//点击取消
|
||||
const cancel = async(value:string) => {
|
||||
try{
|
||||
await cancelInvoice(value)
|
||||
getData()
|
||||
messageApi.open({
|
||||
type: 'success',
|
||||
content: '取消成功',
|
||||
})
|
||||
}catch(error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
const columns: TableProps<DataType>['columns'] = [
|
||||
{
|
||||
title: '名称',
|
||||
dataIndex: 'invoiceTitle',
|
||||
dataIndex: 'invoiceName',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '纳税人识别号',
|
||||
dataIndex: 'invoiceNo',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '地址',
|
||||
dataIndex: 'invoiceAddress',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '电话',
|
||||
dataIndex: 'invoicePhone',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '开户行',
|
||||
dataIndex: 'invoiceBank',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '开户行账号',
|
||||
dataIndex: 'invoiceAccount',
|
||||
dataIndex: 'invoiceNumber',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
// {
|
||||
// title: '地址',
|
||||
// dataIndex: 'invoiceOrgaddress',
|
||||
// align: 'center',
|
||||
// width: 180
|
||||
// },
|
||||
// {
|
||||
// title: '电话',
|
||||
// dataIndex: 'invoiceOrgtel',
|
||||
// align: 'center',
|
||||
// width: 180
|
||||
// },
|
||||
// {
|
||||
// title: '开户行',
|
||||
// dataIndex: 'invoiceBank',
|
||||
// align: 'center',
|
||||
// width: 180
|
||||
// },
|
||||
// {
|
||||
// title: '开户行账号',
|
||||
// dataIndex: 'invoiceBanknumber',
|
||||
// align: 'center',
|
||||
// width: 180
|
||||
// },
|
||||
{
|
||||
title: '金额',
|
||||
dataIndex: 'invoiceAmount',
|
||||
dataIndex: 'invoiceRechargeMoney',
|
||||
align: 'center',
|
||||
width: 160,
|
||||
render: (value) => {
|
||||
return (value / 100).toFixed(2)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'invoiceNote',
|
||||
dataIndex: 'invoiceRecord',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
@ -114,7 +144,7 @@ export default function InvoiceList() {
|
||||
dataIndex: 'invoiceStatus',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
fixed: 'right',
|
||||
// fixed: 'right',
|
||||
render: (value) => {
|
||||
if (value === InvoiceStatusEnum.PENDING) {
|
||||
return <Tag color="magenta">待审核</Tag>
|
||||
@ -123,11 +153,12 @@ export default function InvoiceList() {
|
||||
return <Tag color="green">已开票</Tag>
|
||||
}
|
||||
if (value === InvoiceStatusEnum.FAILED) {
|
||||
return <Tag color="red">失败</Tag>
|
||||
return <Tag color="red">未通过</Tag>
|
||||
}
|
||||
if (value === InvoiceStatusEnum.CANCEL) {
|
||||
return <Tag color="cyan">已取消</Tag>
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
{
|
||||
@ -135,7 +166,7 @@ export default function InvoiceList() {
|
||||
dataIndex: 'operate',
|
||||
align: 'center',
|
||||
width: 120,
|
||||
fixed: 'right',
|
||||
// fixed: 'right',
|
||||
render: (_value, record) => {
|
||||
if (record.invoiceStatus === InvoiceStatusEnum.PENDING) {
|
||||
return <Flex justify="center">
|
||||
@ -146,7 +177,8 @@ export default function InvoiceList() {
|
||||
}} onClick={() => {
|
||||
// invoiceId.current = record.invoiceId;
|
||||
// console.log(record.invoiceId);
|
||||
setInvoiceId(record.invoiceId);
|
||||
// setInvoiceId(record.invoiceId);
|
||||
setInvoiceRechargeId(record.invoiceRechargeId);
|
||||
setIsShowModalOpen(true);
|
||||
}}>查看</Button>
|
||||
<Popconfirm
|
||||
@ -161,14 +193,15 @@ export default function InvoiceList() {
|
||||
}
|
||||
}}
|
||||
onConfirm={() => {
|
||||
put<any>({
|
||||
messageApi,
|
||||
url: `/api/invoice/update-cancel/${record.invoiceId}`,
|
||||
onSuccess() {
|
||||
messageApi.success('取消成功');
|
||||
getData();
|
||||
}
|
||||
})
|
||||
// put<any>({
|
||||
// messageApi,
|
||||
// url: `/api/invoice/update-cancel/${record.invoiceId}`,
|
||||
// onSuccess() {
|
||||
// messageApi.success('取消成功');
|
||||
// getData();
|
||||
// }
|
||||
// })
|
||||
cancel(record.invoiceRechargeId);
|
||||
}}
|
||||
>
|
||||
<Button type="link" danger style={{
|
||||
@ -179,23 +212,47 @@ export default function InvoiceList() {
|
||||
</Space>
|
||||
</Flex>
|
||||
}
|
||||
if (record.invoiceStatus === InvoiceStatusEnum.CANCEL) {
|
||||
if (record.invoiceStatus === InvoiceStatusEnum.CANCEL||record.invoiceStatus === InvoiceStatusEnum.FAILED ) {
|
||||
return <Button type="link" style={{
|
||||
padding: '0'
|
||||
}} onClick={() => {
|
||||
// invoiceId.current = record.invoiceId;
|
||||
console.log(record.invoiceId);
|
||||
setInvoiceId(record.invoiceId);
|
||||
// console.log(record.invoiceId);
|
||||
// setInvoiceId(record.invoiceId);
|
||||
setStatus(record.invoiceStatus )
|
||||
setInvoiceRechargeId(record.invoiceRechargeId);
|
||||
setIsEditModalOpen(true);
|
||||
}}>编辑</Button>
|
||||
}
|
||||
// if (record.invoiceStatus === InvoiceStatusEnum.FAILED ) {
|
||||
|
||||
// return <Button type="link" style={{
|
||||
// padding: '0'
|
||||
// }} onClick={() => {
|
||||
// // invoiceId.current = record.invoiceId;
|
||||
// // console.log(record.invoiceId);
|
||||
// // setInvoiceId(record.invoiceId);
|
||||
// setInvoiceRechargeId(record.invoiceRechargeId);
|
||||
// setIsEditModalOpen(true);
|
||||
// // setFailed(true)
|
||||
// }}>编辑</Button>
|
||||
// }
|
||||
if (record.invoiceStatus == InvoiceStatusEnum.COMPLETE) {
|
||||
const items: MenuProps['items'] = [];
|
||||
record.invoiceFileList.forEach((item, index) => {
|
||||
const arr = record.invoiceFile.split(',');
|
||||
// record.invoiceFileList.forEach((item, index) => {
|
||||
// items.push({
|
||||
// key: index,
|
||||
// label: (
|
||||
// <a href={item} download target="_blank">下载发票{index + 1}</a>
|
||||
// )
|
||||
// });
|
||||
// })
|
||||
arr.forEach((item, index) => {
|
||||
items.push({
|
||||
key: index,
|
||||
label: (
|
||||
<a href={item} download target="_blank">下载发票{index + 1}</a>
|
||||
<a href={downloadInvoice(item)} download target="_blank">下载发票{index + 1}</a>
|
||||
)
|
||||
});
|
||||
})
|
||||
@ -208,23 +265,47 @@ export default function InvoiceList() {
|
||||
}
|
||||
},
|
||||
]
|
||||
const globalContext = useContext(GlobalContext);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const getData = async () => {
|
||||
try {
|
||||
setLoading(true);
|
||||
const res: any = await getInvoiceRecordList(globalContext.user.userId, { page: page, rows: 20 })
|
||||
setLoading(false);
|
||||
// console.log(res);
|
||||
setPage(res.page);
|
||||
setTotal(res.total);
|
||||
setDataArray(res.rows);
|
||||
} catch (error: any) {
|
||||
|
||||
const getData = () => {
|
||||
get<IListPage<DataType>>({
|
||||
messageApi,
|
||||
url: '/api/invoice/listpage/self',
|
||||
config: {
|
||||
params: {
|
||||
page: page,
|
||||
rows: 20
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
},
|
||||
onSuccess({ data }) {
|
||||
setPage(data.page);
|
||||
setTotal(data.total);
|
||||
setDataArray(data.rows);
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
// get<IListPage<DataType>>({
|
||||
// messageApi,
|
||||
// url: '/api/invoice/listpage/self',
|
||||
// config: {
|
||||
// params: {
|
||||
// page: page,
|
||||
// rows: 20
|
||||
// }
|
||||
// },
|
||||
// onSuccess({ data }) {
|
||||
// setPage(data.page);
|
||||
// setTotal(data.total);
|
||||
// setDataArray(data.rows);
|
||||
// }
|
||||
// })
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
@ -240,6 +321,7 @@ export default function InvoiceList() {
|
||||
setIsSaveModalOpen(true);
|
||||
}}><PlusOutlined /> 新增</Button>
|
||||
</div>
|
||||
<Spin tip="正在处理，请稍后..." size="small" spinning={loading}>
|
||||
<Table columns={columns} dataSource={dataArray} pagination={
|
||||
{
|
||||
pageSize: 20,
|
||||
@ -248,7 +330,8 @@ export default function InvoiceList() {
|
||||
setPage(currentPage);
|
||||
},
|
||||
}
|
||||
} scroll={{ y: 500 }} bordered key="dataTable" rowKey="invoiceId" />
|
||||
} scroll={{ y:500}} bordered key="dataTable" rowKey="invoiceRechargeId" />
|
||||
</Spin>
|
||||
</div>
|
||||
</div>
|
||||
<Modal open={isSaveModalOpen}
|
||||
@ -279,8 +362,9 @@ export default function InvoiceList() {
|
||||
destroyOnClose
|
||||
>
|
||||
<InvoiceEdit
|
||||
invoiceId={invoiceId}
|
||||
// invoiceId={invoiceId}
|
||||
// invdataArray={invdataArray}
|
||||
invoiceRechargeId={invoiceRechargeId}
|
||||
handleOk={() => {
|
||||
getData();
|
||||
setIsEditModalOpen(false);
|
||||
@ -288,6 +372,7 @@ export default function InvoiceList() {
|
||||
handleCancel={() => {
|
||||
setIsEditModalOpen(false);
|
||||
}}
|
||||
status={status}
|
||||
/>
|
||||
</Modal>
|
||||
<Modal open={isShowModalOpen}
|
||||
@ -299,7 +384,8 @@ export default function InvoiceList() {
|
||||
>
|
||||
{/* {invoiceId.current} */}
|
||||
<InvoiceShow
|
||||
invoiceId={invoiceId}
|
||||
invoiceRechargeId={invoiceRechargeId}
|
||||
// invoiceId={invoiceId}
|
||||
/>
|
||||
</Modal>
|
||||
{messageContext}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,27 +1,28 @@
|
||||
import { Button, Divider, Modal } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import { get } from "../../util/AjaxUtils.ts";
|
||||
// import { get } from "../../util/AjaxUtils.ts";
|
||||
import {getInvoiceInfoById} from '../../request/api.ts'
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import InvoiceInfoSelectedList from "./order/InvoiceOrderSelectedList.tsx"
|
||||
|
||||
type DataType = {
|
||||
invoiceTitle: string;
|
||||
invoiceNo: string;
|
||||
invoiceAddress: string;
|
||||
invoicePhone: string;
|
||||
invoiceAccount: string;
|
||||
invoiceName: string;
|
||||
invoiceNumber: string;
|
||||
invoiceOrgaddress: string;
|
||||
invoiceOrgtel: string;
|
||||
invoiceBanknumber: string;
|
||||
invoiceBank: string;
|
||||
content: string;
|
||||
rate: string;
|
||||
type: string;
|
||||
invoicePurpose: string;
|
||||
invoiceTaxrate: string;
|
||||
invoiceClassify: string;
|
||||
orderIds: string[];
|
||||
invoiceNote: string;
|
||||
invoiceRecord: string;
|
||||
isSaveInvoiceInfo: boolean;
|
||||
invoiceAmount: number;
|
||||
}
|
||||
|
||||
type ShowProps = {
|
||||
invoiceId: string;
|
||||
invoiceRechargeId: string;
|
||||
}
|
||||
|
||||
export default function InvoiceShow(props: ShowProps) {
|
||||
@ -29,23 +30,44 @@ export default function InvoiceShow(props: ShowProps) {
|
||||
const [isInvoiceOrderListOpen, setIsInvoiceOrderListOpen] = useState(false);
|
||||
const [invoiceData, setInvoiceData] = useState<DataType | null>(null);
|
||||
const [orderAmount, setOrderAmount] = useState('0');
|
||||
|
||||
const getData = async () => {
|
||||
try {
|
||||
const res: any = await getInvoiceInfoById(props.invoiceRechargeId)
|
||||
console.log('数据', res);
|
||||
setInvoiceData({ ...res })
|
||||
setOrderAmount(res.invoiceRechargeMoney )
|
||||
} catch(error:any){
|
||||
if (error.response) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
useEffect(() => {
|
||||
|
||||
|
||||
if (!props.invoiceId) {
|
||||
if (!props.invoiceRechargeId) {
|
||||
return;
|
||||
}
|
||||
get<DataType>({
|
||||
messageApi,
|
||||
url: `/api/invoice/get/${props.invoiceId}`,
|
||||
onSuccess({ data }) {
|
||||
setInvoiceData({
|
||||
...data
|
||||
});
|
||||
setOrderAmount((data.invoiceAmount / 100).toFixed(2));
|
||||
}
|
||||
})
|
||||
|
||||
// get<DataType>({
|
||||
// messageApi,
|
||||
// url: `/api/invoice/get/${props.invoiceId}`,
|
||||
// onSuccess({ data }) {
|
||||
// setInvoiceData({
|
||||
// ...data
|
||||
// });
|
||||
// setOrderAmount((data.invoiceAmount / 100).toFixed(2));
|
||||
// }
|
||||
// })
|
||||
getData();
|
||||
|
||||
}, []);
|
||||
|
||||
@ -61,39 +83,39 @@ export default function InvoiceShow(props: ShowProps) {
|
||||
<tbody>
|
||||
<tr>
|
||||
<td className="table-label">公司名称 *</td>
|
||||
<td>{invoiceData?.invoiceTitle}</td>
|
||||
<td>{invoiceData?.invoiceName}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">纳税人识别号 *</td>
|
||||
<td>{invoiceData?.invoiceNo}</td>
|
||||
<td>{invoiceData?.invoiceNumber}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">公司地址 *</td>
|
||||
<td>{invoiceData?.invoiceAddress}</td>
|
||||
<td>{invoiceData?.invoiceOrgaddress}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">联系电话 *</td>
|
||||
<td>{invoiceData?.invoicePhone}</td>
|
||||
<td>{invoiceData?.invoiceOrgtel}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">开户行 *</td>
|
||||
<td>{invoiceData?.invoiceAccount}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">开户行账号 *</td>
|
||||
<td>{invoiceData?.invoiceBank}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">开户行账号 *</td>
|
||||
<td>{invoiceData?.invoiceBanknumber}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">开票内容 *</td>
|
||||
<td>{invoiceData?.content}</td>
|
||||
<td>{invoiceData?.invoicePurpose}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">开票税率 *</td>
|
||||
<td>{invoiceData?.rate}</td>
|
||||
<td>{invoiceData?.invoiceTaxrate}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">发票类型 *</td>
|
||||
<td>{invoiceData?.type}</td>
|
||||
<td>{invoiceData?.invoiceClassify}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
@ -112,24 +134,24 @@ export default function InvoiceShow(props: ShowProps) {
|
||||
<span style={{ fontSize: '20px', fontWeight: 'bold' }}>{orderAmount}</span>
|
||||
<Button type="link" size="small" onClick={() => {
|
||||
setIsInvoiceOrderListOpen(true);
|
||||
}}>查看开票的订单</Button>
|
||||
}}>查看开票的充值记录</Button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="table-label">开票备注</td>
|
||||
<td>{invoiceData?.invoiceNote}</td>
|
||||
<td>{invoiceData?.invoiceRecord}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<Modal open={isInvoiceOrderListOpen}
|
||||
centered
|
||||
title="开票订单"
|
||||
title="开票的充值记录"
|
||||
width={1000}
|
||||
footer={false}
|
||||
onCancel={() => setIsInvoiceOrderListOpen(false)}
|
||||
>
|
||||
<InvoiceInfoSelectedList invoiceId={props.invoiceId} />
|
||||
<InvoiceInfoSelectedList invoiceRechargeId={props.invoiceRechargeId} />
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
|
||||
424
src/components/invoice/NewInvoiceEdit.tsx
Normal file
424
src/components/invoice/NewInvoiceEdit.tsx
Normal file
@ -0,0 +1,424 @@
|
||||
import { Button, Flex, Form, Input, Modal, Radio, Space } from "antd";
|
||||
import { useEffect, useState } from "react";
|
||||
import { listDictionary, IDictionary } from "../../util/AjaxUtils.ts";
|
||||
import { getInvoiceInfoByinvoiceRechargeId, getInvoiceRechargeList, updateInvoiceInfoByinvoiceRechargeId } from '../../request/api.ts'
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import InvoiceInfoList from "./info/InvoiceInfoList.tsx";
|
||||
import InvoiceOrderList from "./order/InvoiceOrderList.tsx";
|
||||
import useModal from "antd/es/modal/useModal";
|
||||
|
||||
type FormFieldType = {
|
||||
invoiceName: string;
|
||||
invoiceNumber: string;
|
||||
invoiceOrgaddress: string;
|
||||
invoiceOrgtel: string;
|
||||
invoiceBank: string;
|
||||
invoiceBanknumber: string;
|
||||
invoicePurpose: string;
|
||||
invoiceTaxrate: string;
|
||||
invoiceClassify: string;
|
||||
accountRechargeIds: string[];
|
||||
invoiceRecord: string;
|
||||
isSaveInvoiceInfo: boolean;
|
||||
}
|
||||
|
||||
type EditProps = {
|
||||
invoiceRechargeId: string;
|
||||
handleOk: () => void;
|
||||
handleCancel: () => void;
|
||||
// invdataArray: any[];
|
||||
// isEditModalOpen: boolean;
|
||||
showFailed?: boolean;
|
||||
status?: string;
|
||||
}
|
||||
|
||||
export default function InvoiceEdit(props: EditProps) {
|
||||
const [selectedOrders, setSelectedOrders] = useState<any[]>([]); //被选择的数组
|
||||
const [invoiceId, setInvoiceId] = useState(''); // 开票信息id
|
||||
|
||||
|
||||
const [messageApi, messageContext] = useMessage();
|
||||
const [modal, modalContext] = useModal();
|
||||
const [form] = Form.useForm<FormFieldType>();
|
||||
const [contentArray, setContentArray] = useState<IDictionary[]>([]);
|
||||
const [rateArray, setRateArray] = useState<IDictionary[]>([]);
|
||||
const [typeArray, setTypeArray] = useState<IDictionary[]>([]);
|
||||
const [isInvoiceInfoListOpen, setIsInvoiceInfoListOpen] = useState(false);
|
||||
const [isInvoiceOrderListOpen, setIsInvoiceOrderListOpen] = useState(false);
|
||||
const [orderAmount, setOrderAmount] = useState('0');
|
||||
const [invoiceFinalRecord, setInvoiceFinalRecord] = useState(''); //未通过原因
|
||||
const getData = async () => {
|
||||
try {
|
||||
const res: any = await getInvoiceInfoByinvoiceRechargeId(props.invoiceRechargeId)
|
||||
// console.log(res);
|
||||
form.setFieldsValue(res)
|
||||
setInvoiceId(res.invoiceId)
|
||||
setInvoiceFinalRecord(res.invoiceFinalRecord)
|
||||
form.setFieldValue('accountRechargeIds', res.invoiceRechargeIds);
|
||||
setOrderAmount(res.invoiceRechargeMoney)
|
||||
} catch (error: any) {
|
||||
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
const getSelect = async () => {
|
||||
try {
|
||||
const res: any = await getInvoiceRechargeList(props.invoiceRechargeId, { page: 1, rows: 1000 })
|
||||
// console.log(res);
|
||||
setSelectedOrders(res.rows);
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
const upData = async () => {
|
||||
console.log(form.getFieldsValue())
|
||||
|
||||
try {
|
||||
const res: any = await updateInvoiceInfoByinvoiceRechargeId(props.invoiceRechargeId, {
|
||||
...form.getFieldsValue(),
|
||||
invoiceType: '企业',
|
||||
invoiceRechargeId: props.invoiceRechargeId,
|
||||
invoiceId: invoiceId,
|
||||
// invoiceId:
|
||||
|
||||
})
|
||||
console.log(res);
|
||||
props.handleOk()
|
||||
messageApi.success('提交成功');
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
useEffect(() => {
|
||||
// console.log(props.invoiceRechargeId);
|
||||
|
||||
if (!props.invoiceRechargeId) {
|
||||
return;
|
||||
}
|
||||
// 开票内容
|
||||
listDictionary('e0251d55-cd52-4f57-be92-b2bef8a6dd62', messageApi).then((data) => {
|
||||
setContentArray([...data]);
|
||||
})
|
||||
// 开票税率
|
||||
listDictionary('b67d5208-db1d-4d0e-99de-cc22d9d50041', messageApi).then((data) => {
|
||||
setRateArray([...data]);
|
||||
})
|
||||
// 开票类型
|
||||
listDictionary('e4808c45-64ee-42fa-a413-a470fbdc0aea', messageApi).then((data) => {
|
||||
setTypeArray([...data]);
|
||||
})
|
||||
getData()
|
||||
getSelect()
|
||||
// get<FormFieldType>({
|
||||
// messageApi,
|
||||
// url: `/api/invoice/get/${props.invoiceId}`,
|
||||
// onSuccess({data}) {
|
||||
// form.setFieldsValue(data);
|
||||
// setOrderAmount((data.invoiceAmount / 100).toFixed(2));
|
||||
// }
|
||||
// })
|
||||
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
{messageContext}
|
||||
{modalContext}
|
||||
<Form
|
||||
name="basic"
|
||||
initialValues={{ isSaveInvoiceInfo: 0 }}
|
||||
form={form}
|
||||
onFinish={() => {
|
||||
modal.confirm({
|
||||
title: '提示',
|
||||
centered: true,
|
||||
content: '确定提交吗？',
|
||||
okText: '确定',
|
||||
cancelText: '取消',
|
||||
okButtonProps: {
|
||||
style: {
|
||||
backgroundColor: 'val(--color-primary)'
|
||||
}
|
||||
},
|
||||
onOk: () => {
|
||||
upData()
|
||||
|
||||
// put<any>({
|
||||
// messageApi,
|
||||
// url: `/api/invoice/update/${props.invoiceId}`,
|
||||
// body: values,
|
||||
// onSuccess() {
|
||||
// messageApi.success('提交成功');
|
||||
// props.handleOk();
|
||||
// }
|
||||
// })
|
||||
}
|
||||
});
|
||||
}}
|
||||
>
|
||||
|
||||
<div className="payBox">
|
||||
<div>
|
||||
<div className="payTitle">开票信息</div>
|
||||
<div style={{
|
||||
marginTop: '20px',
|
||||
}}>
|
||||
{/* <Button type="link"
|
||||
onClick={() => {
|
||||
setIsInvoiceInfoListOpen(true);
|
||||
}}>选择开票信息</Button> */}
|
||||
</div>
|
||||
<div className="payRow">
|
||||
<div className="payRowL" style={{
|
||||
position: 'relative',
|
||||
}}>
|
||||
<div className="payName">选择开票信息<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="invoiceName"
|
||||
rules={[{ required: true, message: '请选择开票信息' }]}
|
||||
>
|
||||
<Input style={{
|
||||
width: '300px'
|
||||
}} placeholder="请选择开票信息" />
|
||||
</Form.Item>
|
||||
<div style={{
|
||||
position: 'absolute',
|
||||
height: '32px',
|
||||
width: '300px',
|
||||
// backgroundColor: 'pink',
|
||||
top: 0,
|
||||
left: 105,
|
||||
cursor: 'pointer'
|
||||
}}
|
||||
onClick={() => {
|
||||
setIsInvoiceInfoListOpen(true);
|
||||
}}
|
||||
>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className="payRowR">
|
||||
<div className="payName">发票类型<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="invoiceClassify"
|
||||
rules={[{ required: true, message: '请选择发票类型' }]}
|
||||
>
|
||||
<Radio.Group>
|
||||
<div style={{
|
||||
width: '300px',
|
||||
}}>
|
||||
{typeArray.map(item => <Radio value={item.dataName}
|
||||
key={item.dataId}>{item.dataName}</Radio>)}
|
||||
</div>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div className="payRow" >
|
||||
<div className="payRowL">
|
||||
<div className="payName">开票内容<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="invoicePurpose"
|
||||
rules={[{ required: true, message: '请选择开票内容' }]}
|
||||
>
|
||||
<Radio.Group>
|
||||
<div style={{
|
||||
width: '300px',
|
||||
}}>
|
||||
{contentArray.map(item => <Radio value={item.dataName}
|
||||
key={item.dataId}>{item.dataName}</Radio>)}
|
||||
</div>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
</div>
|
||||
<div className="payRowR">
|
||||
<div className="payName">开票税率<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="invoiceTaxrate"
|
||||
rules={[{ required: true, message: '请选择开票税率' }]}
|
||||
>
|
||||
<Radio.Group>
|
||||
<div style={{
|
||||
width: '300px',
|
||||
}}>
|
||||
{rateArray.map(item => <Radio value={item.dataName}
|
||||
key={item.dataId}>{item.dataName}</Radio>)}
|
||||
</div>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<div className="payTitle"
|
||||
|
||||
>开票内容</div>
|
||||
<div style={{
|
||||
marginTop: '10px',
|
||||
position: 'relative',
|
||||
}}>
|
||||
<div style={{
|
||||
position: 'absolute',
|
||||
right: 90,
|
||||
top: 5,
|
||||
fontSize: '16px',
|
||||
fontWeight: 'bold',
|
||||
color: 'red',
|
||||
display: props.status == '0' ? 'block' : 'none'
|
||||
}}>失败原因 : {invoiceFinalRecord}</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
}}>
|
||||
<div className="payName" style={{
|
||||
marginTop: '2px',
|
||||
}}>开票金额<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="accountRechargeIds"
|
||||
rules={[{ required: true, message: '请选择开票金额' }]}
|
||||
>
|
||||
<div>
|
||||
<span>￥</span>
|
||||
<span style={{ fontSize: '20px', fontWeight: 'bold' }}>{orderAmount}</span>
|
||||
<Button type="link" size="small" onClick={() => {
|
||||
setIsInvoiceOrderListOpen(true);
|
||||
}}>请选择需要开票的充值记录</Button>
|
||||
</div>
|
||||
</Form.Item>
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
}}>
|
||||
<div className="payName" style={{
|
||||
marginTop: '2px',
|
||||
}}>开票备注</div>
|
||||
<Form.Item
|
||||
name="invoiceRecord"
|
||||
>
|
||||
<Input.TextArea placeholder="请输入开票备注"
|
||||
style={{
|
||||
resize: 'none',
|
||||
width: '820px',
|
||||
height: '100px',
|
||||
}}
|
||||
/>
|
||||
</Form.Item>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Form.Item style={{ marginBottom: '0' }}>
|
||||
<Flex justify="center" style={{ marginTop: '15px' }}>
|
||||
<Space>
|
||||
<Button type="primary" htmlType="submit" style={{
|
||||
backgroundColor: 'var(--color-primary)'
|
||||
}}>提交</Button>
|
||||
<Button type="default" onClick={() => {
|
||||
props.handleCancel();
|
||||
}}>返回</Button>
|
||||
</Space>
|
||||
</Flex>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
<Modal open={isInvoiceInfoListOpen}
|
||||
centered
|
||||
title="开票信息"
|
||||
width={1000}
|
||||
footer={false}
|
||||
destroyOnClose
|
||||
onCancel={() => setIsInvoiceInfoListOpen(false)}
|
||||
>
|
||||
<InvoiceInfoList
|
||||
handleOk={(selectedInvoice) => {
|
||||
setInvoiceId(selectedInvoice.invoiceId);
|
||||
form.setFieldsValue({
|
||||
invoiceName: selectedInvoice.invoiceName,
|
||||
invoiceNumber: selectedInvoice.invoiceNumber,
|
||||
invoiceOrgaddress: selectedInvoice.invoiceOrgaddress,
|
||||
invoiceOrgtel: selectedInvoice.invoiceOrgtel,
|
||||
invoiceBank: selectedInvoice.invoiceBank,
|
||||
invoiceBanknumber: selectedInvoice.invoiceBanknumber
|
||||
});
|
||||
setIsInvoiceInfoListOpen(false);
|
||||
}}
|
||||
handleCancel={() => {
|
||||
setIsInvoiceInfoListOpen(false);
|
||||
}}
|
||||
/>
|
||||
</Modal>
|
||||
<Modal open={isInvoiceOrderListOpen}
|
||||
title="开票订单"
|
||||
width={1000}
|
||||
footer={false}
|
||||
destroyOnClose
|
||||
onCancel={() => setIsInvoiceOrderListOpen(false)}
|
||||
centered
|
||||
|
||||
>
|
||||
<InvoiceOrderList
|
||||
// selectedOrderIds={form.getFieldValue('accountRechargeIds')}
|
||||
handleOk={(selectedArr) => {
|
||||
// let totalAmount = 0;
|
||||
// const orderIds: string[] = [];
|
||||
// selectedOrders.forEach((item) => {
|
||||
// totalAmount += item.totalAmount;
|
||||
// orderIds.push(item.orderId);
|
||||
// });
|
||||
// setOrderAmount((totalAmount / 100).toFixed(2));
|
||||
// setIsInvoiceOrderListOpen(false);
|
||||
// form.setFieldValue('orderIds', orderIds);
|
||||
|
||||
setSelectedOrders(selectedArr);
|
||||
let totalAmount = 0;
|
||||
const orderIds: string[] = [];
|
||||
selectedArr.forEach((item) => {
|
||||
totalAmount += item.rechargeMoney;
|
||||
orderIds.push(item.accountRechargeId);
|
||||
});
|
||||
const orderIdsString = orderIds.join(',');
|
||||
setOrderAmount(String(totalAmount.toFixed(2)));
|
||||
setIsInvoiceOrderListOpen(false);
|
||||
form.setFieldValue('accountRechargeIds', orderIdsString);
|
||||
}}
|
||||
handleCancel={() => {
|
||||
setIsInvoiceOrderListOpen(false);
|
||||
}}
|
||||
selectedOrders={selectedOrders}
|
||||
setSelectedOrders={setSelectedOrders}
|
||||
/>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
||||
357
src/components/invoice/NewInvoiceSave.tsx
Normal file
357
src/components/invoice/NewInvoiceSave.tsx
Normal file
@ -0,0 +1,357 @@
|
||||
import { Button, Flex, Form, Input, Modal, Radio, Space } from "antd";
|
||||
import { useEffect, useState, useContext } from "react";
|
||||
import { GlobalContext } from "../../context/GlobalContext.ts";
|
||||
import {
|
||||
listDictionary, IDictionary,
|
||||
// post
|
||||
} from "../../util/AjaxUtils.ts";
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import InvoiceInfoList from "./info/InvoiceInfoList.tsx";
|
||||
import InvoiceOrderList from "./order/InvoiceOrderList.tsx";
|
||||
import useModal from "antd/es/modal/useModal";
|
||||
import { submitInvoiceApply } from "../../request/api.ts"
|
||||
import './InvoiceSave.css'
|
||||
type FormFieldType = {
|
||||
invoiceName: string;
|
||||
invoiceNumber: string;
|
||||
invoiceOrgaddress: string;
|
||||
invoiceOrgtel: string;
|
||||
invoiceBank: string;
|
||||
invoiceBanknumber: string;
|
||||
invoicePurpose: string;
|
||||
invoiceTaxrate: string;
|
||||
invoiceClassify: string;
|
||||
accountRechargeIds: string[];
|
||||
invoiceRecord: string;
|
||||
isSaveInvoiceInfo: boolean;
|
||||
}
|
||||
|
||||
type SaveProps = {
|
||||
handleOk: () => void;
|
||||
handleCancel: () => void;
|
||||
}
|
||||
|
||||
export default function InvoiceSave(props: SaveProps) {
|
||||
const [messageApi, messageContext] = useMessage();
|
||||
// const [selectedOrderIds, setSelectedOrderIds] = useState<string[]>([]); // 选中的订单id数组
|
||||
const [modal, modalContext] = useModal();
|
||||
const [form] = Form.useForm<FormFieldType>();
|
||||
const [contentArray, setContentArray] = useState<IDictionary[]>([]);
|
||||
const [rateArray, setRateArray] = useState<IDictionary[]>([]);
|
||||
const [typeArray, setTypeArray] = useState<IDictionary[]>([]);
|
||||
const [isInvoiceInfoListOpen, setIsInvoiceInfoListOpen] = useState(false);
|
||||
const [isInvoiceOrderListOpen, setIsInvoiceOrderListOpen] = useState(false);
|
||||
const [orderAmount, setOrderAmount] = useState('0');
|
||||
const [invoiceId, setInvoiceId] = useState(''); // 开票信息id
|
||||
const globalContext = useContext(GlobalContext);
|
||||
const [selectedOrders, setSelectedOrders] = useState<any[]>([]); //被选择的数组
|
||||
|
||||
const submitInvoice = async (values: any) => {
|
||||
try {
|
||||
await submitInvoiceApply(globalContext.user.userId, values)
|
||||
messageApi.success('提交成功');
|
||||
props.handleOk();
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
// const [selectedOrders, setSelectedOrders] = useState<any[]>([]); //被选择的数组
|
||||
useEffect(() => {
|
||||
// 开票内容
|
||||
listDictionary('e0251d55-cd52-4f57-be92-b2bef8a6dd62', messageApi).then((data) => {
|
||||
setContentArray([...data]);
|
||||
})
|
||||
// 开票税率
|
||||
listDictionary('b67d5208-db1d-4d0e-99de-cc22d9d50041', messageApi).then((data) => {
|
||||
setRateArray([...data]);
|
||||
})
|
||||
// 开票类型
|
||||
listDictionary('e4808c45-64ee-42fa-a413-a470fbdc0aea', messageApi).then((data) => {
|
||||
setTypeArray([...data]);
|
||||
})
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<>
|
||||
{messageContext}
|
||||
{modalContext}
|
||||
<Form
|
||||
name="basic"
|
||||
initialValues={{ isSaveInvoiceInfo: 0 }}
|
||||
form={form}
|
||||
|
||||
onFinish={(values) => {
|
||||
modal.confirm({
|
||||
title: '提示',
|
||||
content: '确定提交吗？',
|
||||
okText: '确定',
|
||||
cancelText: '取消',
|
||||
centered: true,
|
||||
okButtonProps: {
|
||||
style: {
|
||||
backgroundColor: 'val(--color-primary)'
|
||||
}
|
||||
},
|
||||
onOk: () => {
|
||||
console.log(values);
|
||||
|
||||
submitInvoice(
|
||||
{
|
||||
invoiceId,
|
||||
invoiceTaxrate: values.invoiceTaxrate,
|
||||
invoicePurpose: values.invoicePurpose,
|
||||
invoiceClassify: values.invoiceClassify,
|
||||
accountRechargeIds: values.accountRechargeIds,
|
||||
invoiceRecord: values.invoiceRecord,
|
||||
// invoiceRechargeMoney: orderAmount,
|
||||
})
|
||||
// console.log(values);
|
||||
|
||||
// post<any>({
|
||||
// messageApi,
|
||||
// url: '/api/invoice/save',
|
||||
// body: values,
|
||||
// onSuccess() {
|
||||
// messageApi.success('提交成功');
|
||||
// props.handleOk();
|
||||
// }
|
||||
// })
|
||||
}
|
||||
});
|
||||
}}
|
||||
>
|
||||
|
||||
<div className="payBox">
|
||||
<div>
|
||||
<div className="payTitle">开票信息</div>
|
||||
<div style={{
|
||||
marginTop: '20px',
|
||||
}}>
|
||||
{/* <Button type="link"
|
||||
onClick={() => {
|
||||
setIsInvoiceInfoListOpen(true);
|
||||
}}>选择开票信息</Button> */}
|
||||
</div>
|
||||
<div className="payRow">
|
||||
<div className="payRowL" style={{
|
||||
position: 'relative',
|
||||
}}>
|
||||
<div className="payName">选择开票信息<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="invoiceName"
|
||||
rules={[{ required: true, message: '请选择开票信息' }]}
|
||||
>
|
||||
<Input style={{
|
||||
width: '300px'
|
||||
}} placeholder="请选择开票信息" />
|
||||
</Form.Item>
|
||||
<div style={{
|
||||
position: 'absolute',
|
||||
height: '32px',
|
||||
width: '300px',
|
||||
// backgroundColor: 'pink',
|
||||
top: 0,
|
||||
left: 105,
|
||||
cursor: 'pointer'
|
||||
}}
|
||||
onClick={() => {
|
||||
setIsInvoiceInfoListOpen(true);
|
||||
}}
|
||||
>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className="payRowR">
|
||||
<div className="payName">发票类型<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="invoiceClassify"
|
||||
rules={[{ required: true, message: '请选择发票类型' }]}
|
||||
>
|
||||
<Radio.Group>
|
||||
<div style={{
|
||||
width: '300px',
|
||||
}}>
|
||||
{typeArray.map(item => <Radio value={item.dataName}
|
||||
key={item.dataId}>{item.dataName}</Radio>)}
|
||||
</div>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div className="payRow" >
|
||||
<div className="payRowL">
|
||||
<div className="payName">开票内容<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="invoicePurpose"
|
||||
rules={[{ required: true, message: '请选择开票内容' }]}
|
||||
>
|
||||
<Radio.Group>
|
||||
<div style={{
|
||||
width: '300px',
|
||||
}}>
|
||||
{contentArray.map(item => <Radio value={item.dataName}
|
||||
key={item.dataId}>{item.dataName}</Radio>)}
|
||||
</div>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
</div>
|
||||
<div className="payRowR">
|
||||
<div className="payName">开票税率<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="invoiceTaxrate"
|
||||
rules={[{ required: true, message: '请选择开票税率' }]}
|
||||
>
|
||||
<Radio.Group>
|
||||
<div style={{
|
||||
width: '300px',
|
||||
}}>
|
||||
{rateArray.map(item => <Radio value={item.dataName}
|
||||
key={item.dataId}>{item.dataName}</Radio>)}
|
||||
</div>
|
||||
</Radio.Group>
|
||||
</Form.Item>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div className="payRow" style={{
|
||||
|
||||
}}>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div className="payTitle">开票内容</div>
|
||||
<div style={{
|
||||
marginTop: '10px',
|
||||
}}>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
}}>
|
||||
<div className="payName" style={{
|
||||
marginTop: '2px',
|
||||
}}>开票金额<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item
|
||||
name="accountRechargeIds"
|
||||
rules={[{ required: true, message: '请选择开票金额' }]}
|
||||
>
|
||||
<div>
|
||||
<span>￥</span>
|
||||
<span style={{ fontSize: '20px', fontWeight: 'bold' }}>{orderAmount}</span>
|
||||
<Button type="link" size="small" onClick={() => {
|
||||
setIsInvoiceOrderListOpen(true);
|
||||
}}>请选择需要开票的充值记录</Button>
|
||||
</div>
|
||||
</Form.Item>
|
||||
</div>
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
}}>
|
||||
<div className="payName" style={{
|
||||
marginTop: '2px',
|
||||
}}>开票备注</div>
|
||||
<Form.Item
|
||||
name="invoiceRecord"
|
||||
>
|
||||
<Input.TextArea placeholder="请输入开票备注"
|
||||
style={{
|
||||
resize: 'none',
|
||||
width: '820px',
|
||||
height: '100px',
|
||||
}}
|
||||
/>
|
||||
</Form.Item>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Form.Item style={{ marginBottom: '0' }}>
|
||||
<Flex justify="center" style={{ marginTop: '15px' }}>
|
||||
<Space>
|
||||
<Button type="primary" htmlType="submit" style={{
|
||||
backgroundColor: 'var(--color-primary)'
|
||||
}}>提交</Button>
|
||||
<Button type="default" onClick={() => {
|
||||
props.handleCancel();
|
||||
}}>返回</Button>
|
||||
</Space>
|
||||
</Flex>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
<Modal open={isInvoiceInfoListOpen}
|
||||
destroyOnClose
|
||||
centered
|
||||
title="开票信息"
|
||||
width={1000}
|
||||
footer={false}
|
||||
onCancel={() => {
|
||||
setIsInvoiceInfoListOpen(false);
|
||||
}}
|
||||
>
|
||||
<InvoiceInfoList
|
||||
handleOk={(selectedInvoice) => {
|
||||
// console.log(selectedInvoice.invoiceId);
|
||||
setInvoiceId(selectedInvoice.invoiceId);
|
||||
form.setFieldsValue({
|
||||
invoiceName: selectedInvoice.invoiceName,
|
||||
invoiceNumber: selectedInvoice.invoiceNumber,
|
||||
invoiceOrgaddress: selectedInvoice.invoiceOrgaddress,
|
||||
invoiceOrgtel: selectedInvoice.invoiceOrgtel,
|
||||
invoiceBank: selectedInvoice.invoiceBank,
|
||||
invoiceBanknumber: selectedInvoice.invoiceBanknumber
|
||||
});
|
||||
setIsInvoiceInfoListOpen(false);
|
||||
}}
|
||||
handleCancel={() => {
|
||||
setIsInvoiceInfoListOpen(false);
|
||||
}}
|
||||
|
||||
/>
|
||||
</Modal>
|
||||
<Modal open={isInvoiceOrderListOpen}
|
||||
title="需要开票的充值记录"
|
||||
width={1000}
|
||||
footer={false}
|
||||
onCancel={() => setIsInvoiceOrderListOpen(false)}
|
||||
destroyOnClose
|
||||
centered
|
||||
>
|
||||
<InvoiceOrderList
|
||||
handleOk={(selectedArr) => {
|
||||
setSelectedOrders(selectedArr);
|
||||
let totalAmount = 0;
|
||||
const orderIds: string[] = [];
|
||||
selectedArr.forEach((item) => {
|
||||
totalAmount += item.rechargeMoney;
|
||||
orderIds.push(item.accountRechargeId);
|
||||
});
|
||||
const orderIdsString = orderIds.join(',');
|
||||
setOrderAmount(String(totalAmount.toFixed(2)));
|
||||
setIsInvoiceOrderListOpen(false);
|
||||
form.setFieldValue('accountRechargeIds', orderIdsString);
|
||||
|
||||
}}
|
||||
handleCancel={() => {
|
||||
setIsInvoiceOrderListOpen(false);
|
||||
}}
|
||||
|
||||
selectedOrders={selectedOrders}
|
||||
setSelectedOrders={setSelectedOrders}
|
||||
/>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@ -1,7 +1,7 @@
|
||||
import { Button, Flex, Form, Input, Space } from "antd";
|
||||
import { useForm } from "antd/es/form/Form";
|
||||
import useModal from "antd/es/modal/useModal";
|
||||
import {get, post} from "../../../util/AjaxUtils.ts";
|
||||
// import { get, post } from "../../../util/AjaxUtils.ts";
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import { useEffect } from "react";
|
||||
|
||||
@ -15,28 +15,71 @@ type FormDataType = {
|
||||
}
|
||||
|
||||
interface EditProps {
|
||||
invoiceInfoId: string;
|
||||
invoiceId: string;
|
||||
handleOk: () => void;
|
||||
handleCancel: () => void;
|
||||
}
|
||||
|
||||
import { getInvoiceInfo, updateInvoiceInfo } from '../../../request/api.ts'
|
||||
export default function InvoiceInfoSave(props: EditProps) {
|
||||
const [messageApi, messageContext] = useMessage();
|
||||
const [modal, modalContext] = useModal();
|
||||
const [form] = useForm<FormDataType>()
|
||||
const getInfoData = async () => {
|
||||
try {
|
||||
const res: any = await getInvoiceInfo(props.invoiceId)
|
||||
// console.log(res);
|
||||
|
||||
form.setFieldsValue(res)
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
const upInfoData = async () => {
|
||||
try {
|
||||
|
||||
await updateInvoiceInfo(props.invoiceId, { ...form.getFieldsValue(), invoiceType: '企业' });
|
||||
|
||||
messageApi.success('保存成功');
|
||||
|
||||
props.handleOk();
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
useEffect(() => {
|
||||
if (!props.invoiceInfoId) {
|
||||
if (!props.invoiceId) {
|
||||
return;
|
||||
}
|
||||
get<FormDataType>({
|
||||
messageApi,
|
||||
url: `/api/invoice-info/get/${props.invoiceInfoId}`,
|
||||
onSuccess({data}) {
|
||||
form.setFieldsValue(data);
|
||||
}
|
||||
})
|
||||
}, [props.invoiceInfoId]);
|
||||
getInfoData();
|
||||
|
||||
// get<FormDataType>({
|
||||
// messageApi,
|
||||
// url: `/api/invoice-info/get/${props.invoiceInfoId}`,
|
||||
// onSuccess({data}) {
|
||||
// form.setFieldsValue(data);
|
||||
// }
|
||||
// })
|
||||
|
||||
}, [props.invoiceId]);
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -44,8 +87,9 @@ export default function InvoiceInfoSave(props: EditProps) {
|
||||
name="basic"
|
||||
layout="vertical"
|
||||
form={form}
|
||||
onFinish={(values) => {
|
||||
onFinish={() => {
|
||||
modal.confirm({
|
||||
centered: true,
|
||||
title: '提示',
|
||||
content: '确定保存吗',
|
||||
okText: '确定',
|
||||
@ -56,58 +100,59 @@ export default function InvoiceInfoSave(props: EditProps) {
|
||||
}
|
||||
},
|
||||
onOk: () => {
|
||||
post<any>({
|
||||
messageApi,
|
||||
url: `/api/invoice-info/update/${props.invoiceInfoId}`,
|
||||
body: values,
|
||||
onSuccess() {
|
||||
messageApi.success('保存成功');
|
||||
props.handleOk();
|
||||
}
|
||||
})
|
||||
// post<any>({
|
||||
// messageApi,
|
||||
// url: `/api/invoice-info/update/${props.invoiceInfoId}`,
|
||||
// body: values,
|
||||
// onSuccess() {
|
||||
// messageApi.success('保存成功');
|
||||
// props.handleOk();
|
||||
// }
|
||||
// })
|
||||
upInfoData()
|
||||
}
|
||||
})
|
||||
}}
|
||||
>
|
||||
<Form.Item
|
||||
label="公司名称"
|
||||
name="invoiceTitle"
|
||||
name="invoiceName"
|
||||
rules={[{ required: true, message: '请输入公司名称' }]}
|
||||
>
|
||||
<Input placeholder="请输入公司名称" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="纳税人识别号"
|
||||
name="invoiceNo"
|
||||
name="invoiceNumber"
|
||||
rules={[{ required: true, message: '请输入纳税人识别号' }]}
|
||||
>
|
||||
<Input placeholder="请输入纳税人识别号" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="公司地址"
|
||||
name="invoiceAddress"
|
||||
rules={[{required: true, message: '请输入公司地址'}]}
|
||||
name="invoiceOrgaddress"
|
||||
rules={[{ required: false, message: '请输入公司地址' }]}
|
||||
>
|
||||
<Input placeholder="请输入公司地址" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="公司电话"
|
||||
name="invoicePhone"
|
||||
rules={[{required: true, message: '请输入公司电话'}]}
|
||||
name="invoiceOrgtel"
|
||||
rules={[{ required: false, message: '请输入公司电话' }]}
|
||||
>
|
||||
<Input placeholder="请输入公司电话" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="开户行"
|
||||
name="invoiceBank"
|
||||
rules={[{required: true, message: '请输入开户行'}]}
|
||||
rules={[{ required: false, message: '请输入开户行' }]}
|
||||
>
|
||||
<Input placeholder="请输入开户行" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="开户行账号"
|
||||
name="invoiceAccount"
|
||||
rules={[{required: true, message: '请输入开户行账号'}]}
|
||||
name="invoiceBanknumber"
|
||||
rules={[{ required: false, message: '请输入开户行账号' }]}
|
||||
>
|
||||
<Input placeholder="请输入开户行账号" />
|
||||
</Form.Item>
|
||||
|
||||
@ -1,22 +1,21 @@
|
||||
import {Button, Flex, Modal, Popconfirm, Space, Table, TableProps} from "antd";
|
||||
import { Empty,Button, Flex, Modal, Popconfirm, Space, Table, TableProps } from "antd";
|
||||
import { DeleteOutlined, EditOutlined, PlusOutlined } from "@ant-design/icons";
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import {useEffect, useRef, useState} from "react";
|
||||
import {del, get} from "../../../util/AjaxUtils.ts";
|
||||
import {IListPage} from "../../../interfaces/listpage/IListPage.ts";
|
||||
import { useEffect, useRef, useState, useContext } from "react";
|
||||
// import { del, get } from "../../../util/AjaxUtils.ts";
|
||||
// import { IListPage } from "../../../interfaces/listpage/IListPage.ts";
|
||||
import InvoiceInfoSave from "./InvoiceInfoSave.tsx";
|
||||
import InvoiceInfoEdit from "./InvoiceInfoEdit.tsx";
|
||||
|
||||
import { getInvoiceList, deleteInvoiceInfo } from '../../../request/api.ts'
|
||||
import { GlobalContext } from "../../../context/GlobalContext.ts";
|
||||
type DataType = {
|
||||
invoiceTitle: string;
|
||||
invoicePhone: string;
|
||||
invoiceNo: string;
|
||||
invoiceInfoId: string;
|
||||
invoiceName: string;
|
||||
invoiceNumber: string;
|
||||
invoiceOrgaddress: string;
|
||||
invoiceOrgtel: string;
|
||||
invoiceBank: string;
|
||||
invoiceAddress: string;
|
||||
invoiceAccount: string;
|
||||
gmtCreate: number;
|
||||
creator: string;
|
||||
invoiceBanknumber: string;
|
||||
invoiceId: string;
|
||||
}
|
||||
|
||||
interface ListProps {
|
||||
@ -37,52 +36,52 @@ export default function InvoiceInfoList(props: ListProps) {
|
||||
const columns: TableProps<DataType>['columns'] = [
|
||||
{
|
||||
title: '公司名称',
|
||||
dataIndex: 'invoiceTitle',
|
||||
dataIndex: 'invoiceName',
|
||||
align: 'center',
|
||||
width: 180,
|
||||
fixed: 'left'
|
||||
},
|
||||
{
|
||||
title: '纳税人识别号',
|
||||
dataIndex: 'invoiceNo',
|
||||
dataIndex: 'invoiceNumber',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '公司地址',
|
||||
dataIndex: 'invoiceAddress',
|
||||
dataIndex: 'invoiceOrgaddress',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '联系电话',
|
||||
dataIndex: 'invoicePhone',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '开户行',
|
||||
dataIndex: 'invoiceBank',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '开户行账号',
|
||||
dataIndex: 'invoiceAccount',
|
||||
dataIndex: 'invoiceOrgtel',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
// {
|
||||
// title: '开户行',
|
||||
// dataIndex: 'invoiceBank',
|
||||
// align: 'center',
|
||||
// width: 180
|
||||
// },
|
||||
// {
|
||||
// title: '开户行账号',
|
||||
// dataIndex: 'invoiceBanknumber',
|
||||
// align: 'center',
|
||||
// width: 180
|
||||
// },
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'option',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
fixed: 'right',
|
||||
// fixed: 'right',
|
||||
render: (_value, record) => {
|
||||
return (
|
||||
<Space size={5}>
|
||||
<Button type="primary" size="small" onClick={() => {
|
||||
editInvoiceInfoId.current = record.invoiceInfoId;
|
||||
editInvoiceInfoId.current = record.invoiceId;
|
||||
setIsInvoiceInfoEditOpen(true);
|
||||
}}><EditOutlined /></Button>
|
||||
<Popconfirm
|
||||
@ -92,14 +91,15 @@ export default function InvoiceInfoList(props: ListProps) {
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
onConfirm={() => {
|
||||
del<any>({
|
||||
messageApi,
|
||||
url: `/api/invoice-info/remove/${record.invoiceInfoId}`,
|
||||
onSuccess() {
|
||||
messageApi.success('删除成功');
|
||||
getData();
|
||||
}
|
||||
})
|
||||
deleteInvoice(record.invoiceId);
|
||||
// del<any>({
|
||||
// messageApi,
|
||||
// url: `/api/invoice-info/remove/${record.invoiceId}`,
|
||||
// onSuccess() {
|
||||
// messageApi.success('删除成功');
|
||||
// getData();
|
||||
// }
|
||||
// })
|
||||
}}
|
||||
>
|
||||
<Button type="primary" size="small" danger><DeleteOutlined /></Button>
|
||||
@ -109,29 +109,63 @@ export default function InvoiceInfoList(props: ListProps) {
|
||||
}
|
||||
},
|
||||
]
|
||||
const globalContext = useContext(GlobalContext);
|
||||
const getData = async () => {
|
||||
|
||||
const getData = () => {
|
||||
get<IListPage<DataType>>({
|
||||
messageApi,
|
||||
url: '/api/invoice-info/listpage/self',
|
||||
config: {
|
||||
params: {
|
||||
page: page,
|
||||
rows: 20
|
||||
try {
|
||||
const res: any = await getInvoiceList(globalContext.user.userId, { page: page, rows: 20 })
|
||||
// console.log(res);
|
||||
setTotal(res.total)
|
||||
setDataArray(res.rows)
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
// get<IListPage<DataType>>({
|
||||
// messageApi,
|
||||
// url: '/api/invoice-info/listpage/self',
|
||||
// config: {
|
||||
// params: {
|
||||
// page: page,
|
||||
// rows: 20
|
||||
// }
|
||||
// },
|
||||
// onSuccess({data}) {
|
||||
// setPage(data.page);
|
||||
// setTotal(data.total);
|
||||
// setDataArray(data.rows);
|
||||
// }
|
||||
// })
|
||||
}
|
||||
const deleteInvoice = async (id: string) => {
|
||||
try {
|
||||
await deleteInvoiceInfo(id)
|
||||
// console.log(res);
|
||||
messageApi.success('删除成功');
|
||||
getData();
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
},
|
||||
onSuccess({data}) {
|
||||
setPage(data.page);
|
||||
setTotal(data.total);
|
||||
setDataArray(data.rows);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
}, [page]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="invoice-list-container">
|
||||
@ -141,14 +175,20 @@ export default function InvoiceInfoList(props: ListProps) {
|
||||
setIsInvoiceInfoSaveOpen(true);
|
||||
}}><PlusOutlined /> 新增</Button>
|
||||
</div>
|
||||
<Table rowSelection={
|
||||
{dataArray.length > 0
|
||||
? <>
|
||||
<Table
|
||||
rowSelection={
|
||||
{
|
||||
type: 'radio',
|
||||
onChange: (_selectedRowKeys, selectedRows) => {
|
||||
selectedInvoice.current = selectedRows[0];
|
||||
},
|
||||
|
||||
}
|
||||
} columns={columns} dataSource={dataArray} pagination={
|
||||
}
|
||||
|
||||
columns={columns} dataSource={dataArray} pagination={
|
||||
{
|
||||
pageSize: 20,
|
||||
total: total,
|
||||
@ -156,7 +196,40 @@ export default function InvoiceInfoList(props: ListProps) {
|
||||
setPage(currentPage);
|
||||
}
|
||||
}
|
||||
} scroll={{y: 500}} bordered key="dataTable" rowKey="invoiceInfoId"/>
|
||||
} scroll={{ y: 500 }} bordered key="dataTable" rowKey="invoiceId"
|
||||
|
||||
/>
|
||||
</> :
|
||||
<>
|
||||
<div style={{
|
||||
width: '100%', height: '200px', display: 'flex', justifyContent: 'center', alignItems: 'center', fontSize: '20px'
|
||||
}}>
|
||||
<Empty description='暂无开票信息,请添加' />
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
{/* <Table
|
||||
rowSelection={
|
||||
{
|
||||
type: 'radio',
|
||||
onChange: (_selectedRowKeys, selectedRows) => {
|
||||
selectedInvoice.current = selectedRows[0];
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
columns={columns} dataSource={dataArray} pagination={
|
||||
{
|
||||
pageSize: 20,
|
||||
total: total,
|
||||
onChange: (currentPage) => {
|
||||
setPage(currentPage);
|
||||
}
|
||||
}
|
||||
} scroll={{ y: 500 }} bordered key="dataTable" rowKey="invoiceId"
|
||||
|
||||
/> */}
|
||||
</div>
|
||||
<Flex justify="center">
|
||||
<Space size={5}>
|
||||
@ -182,6 +255,7 @@ export default function InvoiceInfoList(props: ListProps) {
|
||||
onCancel={() => {
|
||||
setIsInvoiceInfoSaveOpen(false)
|
||||
}}
|
||||
destroyOnClose
|
||||
>
|
||||
<InvoiceInfoSave
|
||||
handleOk={() => {
|
||||
@ -201,7 +275,7 @@ export default function InvoiceInfoList(props: ListProps) {
|
||||
}}
|
||||
>
|
||||
<InvoiceInfoEdit
|
||||
invoiceInfoId={editInvoiceInfoId.current}
|
||||
invoiceId={editInvoiceInfoId.current}
|
||||
handleOk={() => {
|
||||
getData();
|
||||
setIsInvoiceInfoEditOpen(false);
|
||||
|
||||
@ -1,8 +1,11 @@
|
||||
import { Button, Flex, Form, Input, Space } from "antd";
|
||||
import { useForm } from "antd/es/form/Form";
|
||||
import useModal from "antd/es/modal/useModal";
|
||||
import {post} from "../../../util/AjaxUtils.ts";
|
||||
// import { post } from "../../../util/AjaxUtils.ts";
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import { addInvoiceInfo } from '../../../request/api.ts'
|
||||
import { GlobalContext } from "../../../context/GlobalContext.ts";
|
||||
import { useContext } from "react";
|
||||
|
||||
type FormDataType = {
|
||||
invoiceTitle: string;
|
||||
@ -22,7 +25,7 @@ export default function InvoiceInfoSave(props: SaveProps) {
|
||||
const [messageApi, messageContext] = useMessage();
|
||||
const [modal, modalContext] = useModal();
|
||||
const [form] = useForm<FormDataType>()
|
||||
|
||||
const globalContext = useContext(GlobalContext);
|
||||
return (
|
||||
<>
|
||||
<Form
|
||||
@ -31,6 +34,7 @@ export default function InvoiceInfoSave(props: SaveProps) {
|
||||
form={form}
|
||||
onFinish={(values) => {
|
||||
modal.confirm({
|
||||
centered: true,
|
||||
title: '提示',
|
||||
content: '确定保存吗',
|
||||
okText: '确定',
|
||||
@ -40,59 +44,78 @@ export default function InvoiceInfoSave(props: SaveProps) {
|
||||
backgroundColor: 'var(--color-primary)'
|
||||
}
|
||||
},
|
||||
onOk: () => {
|
||||
post<any>({
|
||||
messageApi,
|
||||
url: '/api/invoice-info/save',
|
||||
body: values,
|
||||
onSuccess() {
|
||||
messageApi.success('保存成功');
|
||||
props.handleOk();
|
||||
}
|
||||
onOk: async () => {
|
||||
// console.log(values);
|
||||
try {
|
||||
await addInvoiceInfo(globalContext.user.userId, {
|
||||
...values,
|
||||
invoiceType: '企业'
|
||||
})
|
||||
props.handleOk();
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
// post<any>({
|
||||
// messageApi,
|
||||
// url: '/api/invoice-info/save',
|
||||
// body: values,
|
||||
// onSuccess() {
|
||||
// messageApi.success('保存成功');
|
||||
// props.handleOk();
|
||||
// }
|
||||
// })
|
||||
}
|
||||
})
|
||||
}}
|
||||
>
|
||||
<Form.Item
|
||||
label="公司名称"
|
||||
name="invoiceTitle"
|
||||
name="invoiceName"
|
||||
rules={[{ required: true, message: '请输入公司名称' }]}
|
||||
>
|
||||
<Input placeholder="请输入公司名称" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="纳税人识别号"
|
||||
name="invoiceNo"
|
||||
name="invoiceNumber"
|
||||
rules={[{ required: true, message: '请输入纳税人识别号' }]}
|
||||
>
|
||||
<Input placeholder="请输入纳税人识别号" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="公司地址"
|
||||
name="invoiceAddress"
|
||||
rules={[{required: true, message: '请输入公司地址'}]}
|
||||
name="invoiceOrgaddress"
|
||||
rules={[{ required: false, message: '请输入公司地址' }]}
|
||||
>
|
||||
<Input placeholder="请输入公司地址" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="公司电话"
|
||||
name="invoicePhone"
|
||||
rules={[{required: true, message: '请输入公司电话'}]}
|
||||
name="invoiceOrgtel"
|
||||
rules={[{ required: false, message: '请输入公司电话' }]}
|
||||
>
|
||||
<Input placeholder="请输入公司电话" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="开户行"
|
||||
name="invoiceBank"
|
||||
rules={[{required: true, message: '请输入开户行'}]}
|
||||
rules={[{ required: false, message: '请输入开户行' }]}
|
||||
>
|
||||
<Input placeholder="请输入开户行" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label="开户行账号"
|
||||
name="invoiceAccount"
|
||||
rules={[{required: true, message: '请输入开户行账号'}]}
|
||||
name="invoiceBanknumber"
|
||||
rules={[{ required: false, message: '请输入开户行账号' }]}
|
||||
>
|
||||
<Input placeholder="请输入开户行账号" />
|
||||
</Form.Item>
|
||||
|
||||
@ -1,172 +1,139 @@
|
||||
import {Button, Flex, Space, Table, TableProps, Tooltip} from "antd";
|
||||
import {
|
||||
Button, Flex, Space, Table, TableProps,Empty
|
||||
} from "antd";
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import {useEffect, useRef, useState} from "react";
|
||||
import {get} from "../../../util/AjaxUtils.ts";
|
||||
import {IListPage} from "../../../interfaces/listpage/IListPage.ts";
|
||||
import { useEffect, useState, useContext } from "react";
|
||||
|
||||
import { getRechargeRecordList } from '../../../request/api.ts'
|
||||
import { GlobalContext } from "../../../context/GlobalContext.ts";
|
||||
|
||||
type DetailDataType = [{
|
||||
productType: string;
|
||||
quantity: number;
|
||||
unitPrice: number;
|
||||
notes: string;
|
||||
productDescription: string;
|
||||
}]
|
||||
|
||||
type DataType = {
|
||||
orderId: string;
|
||||
orderNo: string;
|
||||
totalAmount: number;
|
||||
orderDetails: DetailDataType;
|
||||
orderStatus: string;
|
||||
gmtCreate: string;
|
||||
rechargeMoney: number;
|
||||
thirdParty: string;
|
||||
reconciliationTime: string;
|
||||
rechargeFinalTime: string;
|
||||
accountRechargeId: string;
|
||||
}
|
||||
|
||||
interface ListProps {
|
||||
selectedOrderIds?: string[];
|
||||
handleOk: (selectedOrders: DataType[]) => void;
|
||||
handleCancel: () => void;
|
||||
selectedOrders?: any;
|
||||
setSelectedOrders?: React.Dispatch<React.SetStateAction<any[]>>;
|
||||
// isInvoiceInfoListOpen?: any;
|
||||
}
|
||||
|
||||
export default function InvoiceInfoList(props: ListProps) {
|
||||
const {
|
||||
selectedOrders,
|
||||
setSelectedOrders,
|
||||
} = props;
|
||||
const [messageApi, messageContext] = useMessage();
|
||||
const [page, setPage] = useState(1);
|
||||
const [total, setTotal] = useState(0);
|
||||
const [dataArray, setDataArray] = useState<DataType[]>([]);
|
||||
const selectedOrders = useRef<DataType[] | null>(null);
|
||||
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([]);
|
||||
const [applyOrders, setApplyOrders] = useState<DataType[]>(selectedOrders);
|
||||
|
||||
const columns: TableProps<DataType>['columns'] = [
|
||||
|
||||
{
|
||||
title: '订单号',
|
||||
dataIndex: 'orderNo',
|
||||
title: '充值金额',
|
||||
dataIndex: 'rechargeMoney',
|
||||
align: 'center',
|
||||
width: 250,
|
||||
fixed: 'left'
|
||||
width: 80,
|
||||
|
||||
},
|
||||
{
|
||||
title: '总金额',
|
||||
dataIndex: 'totalAmount',
|
||||
title: '充值方式',
|
||||
dataIndex: 'thirdParty',
|
||||
align: 'center',
|
||||
width: 80,
|
||||
|
||||
},
|
||||
{
|
||||
title: '充值时间',
|
||||
dataIndex: 'reconciliationTime',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
fixed: 'left',
|
||||
render: (value) => {
|
||||
return (value / 100).toFixed(2)
|
||||
}
|
||||
|
||||
},
|
||||
{
|
||||
title: '订单状态',
|
||||
dataIndex: 'orderStatus',
|
||||
title: '充值到账时间',
|
||||
dataIndex: 'rechargeFinalTime',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
render: (value) => {
|
||||
if(value === 'COMPLETE') {
|
||||
return '完成';
|
||||
}
|
||||
if(value === 'CHARGEBACK') {
|
||||
return '已退款';
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'gmtCreate',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '产品类型',
|
||||
dataIndex: 'orderDetails.productType',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
render: (_value, record) => {
|
||||
if(record.orderDetails[0].productType === 'PROJ') {
|
||||
return '项目创建'
|
||||
}
|
||||
if(record.orderDetails[0].productType === 'AGENT') {
|
||||
return '项目代理'
|
||||
}
|
||||
return record.orderDetails[0].productType
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '数量',
|
||||
dataIndex: 'detail.quantity',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
render: (_value, record) => {
|
||||
return record.orderDetails[0].quantity
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '单价',
|
||||
dataIndex: 'detail.unitPrice',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
render: (_value, record) => {
|
||||
return (record.orderDetails[0].unitPrice / 100).toFixed(2)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '订单备注',
|
||||
dataIndex: 'detail.notes',
|
||||
align: 'center',
|
||||
width: 300,
|
||||
render: (_value, record) => {
|
||||
return record.orderDetails[0].notes
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '描述',
|
||||
dataIndex: 'detail.productDescription',
|
||||
align: 'center',
|
||||
width: 300,
|
||||
ellipsis: {
|
||||
showTitle: false,
|
||||
},
|
||||
render: (_value, record) => {
|
||||
return <Tooltip placement="top" title={record.orderDetails[0].productDescription}>{record.orderDetails[0].productDescription}</Tooltip>
|
||||
}
|
||||
},
|
||||
|
||||
]
|
||||
const globalContext = useContext(GlobalContext);
|
||||
const getData = async () => {
|
||||
try {
|
||||
const res: any = await getRechargeRecordList(globalContext.user.userId, { page: page, rows: 20 })
|
||||
// console.log('数据', res);
|
||||
setPage(res.page);
|
||||
setTotal(res.total);
|
||||
setDataArray(res.rows);
|
||||
|
||||
const getData = () => {
|
||||
get<IListPage<DataType>>({
|
||||
messageApi,
|
||||
url: '/api/order/listpage/complete/no-invoiced/self',
|
||||
config: {
|
||||
params: {
|
||||
page: page,
|
||||
rows: 20
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
},
|
||||
onSuccess({data}) {
|
||||
console.log('数据',data.rows);
|
||||
|
||||
setPage(data.page);
|
||||
setTotal(data.total);
|
||||
setDataArray(data.rows);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getData();
|
||||
if(props.selectedOrderIds && props.selectedOrderIds.length > 0) {
|
||||
setSelectedRowKeys(props.selectedOrderIds)
|
||||
}
|
||||
}, [page]);
|
||||
|
||||
useEffect(() => {
|
||||
// console.log('11', applyOrders);
|
||||
if (applyOrders) {
|
||||
const selectedIds = applyOrders.map((order: DataType) => order.accountRechargeId);
|
||||
setSelectedRowKeys(selectedIds);
|
||||
}
|
||||
}, [applyOrders])
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="invoice-list-container">
|
||||
<div className="mod-list">
|
||||
{dataArray.length > 0 ?
|
||||
<>
|
||||
<Table rowSelection={
|
||||
{
|
||||
selectedRowKeys,
|
||||
onChange: (selectedRowKeys, selectedRows) => {
|
||||
setSelectedRowKeys(selectedRowKeys);
|
||||
selectedOrders.current = selectedRows;
|
||||
onSelect: (data) => {
|
||||
const isSelect = applyOrders?.some((item: DataType) => item.accountRechargeId === data.accountRechargeId)
|
||||
// console.log('onSelect', data, isSelect);
|
||||
if (!isSelect) {
|
||||
setApplyOrders?.([...applyOrders, data])
|
||||
} else {
|
||||
setApplyOrders?.(applyOrders?.filter((item: DataType) => item.accountRechargeId !== data.accountRechargeId))
|
||||
}
|
||||
},
|
||||
onSelectAll: (isAll) => {
|
||||
if (isAll) {
|
||||
const newSelectedOrders = dataArray.filter((item: DataType) => !applyOrders?.some((order: DataType) => order.accountRechargeId === item.accountRechargeId));
|
||||
// const setectSelectedOrders = applyOrders?.filter((item: DataType) => !dataArray?.some((order: DataType) => order.accountRechargeId === item.accountRechargeId));
|
||||
// console.log('newSelectedOrders', newSelectedOrders, setectSelectedOrders);
|
||||
setApplyOrders?.([...applyOrders, ...newSelectedOrders])
|
||||
} else {
|
||||
const setectSelectedOrders = applyOrders?.filter((item: DataType) => !dataArray?.some((order: DataType) => order.accountRechargeId === item.accountRechargeId));
|
||||
// console.log('setectSelectedOrders', setectSelectedOrders);
|
||||
setApplyOrders?.([...setectSelectedOrders])
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
} columns={columns} dataSource={dataArray} pagination={
|
||||
{
|
||||
@ -177,21 +144,70 @@ export default function InvoiceInfoList(props: ListProps) {
|
||||
setPage(currentPage);
|
||||
}
|
||||
}
|
||||
} scroll={{y: 500}} bordered key="dataTable" rowKey="orderId"/>
|
||||
} scroll={{ y: 500 }} bordered key="dataTable" rowKey="accountRechargeId" />
|
||||
</> :
|
||||
<>
|
||||
<div style={{
|
||||
width: '100%', height: '200px', display: 'flex', justifyContent: 'center', alignItems: 'center', fontSize: '20px'
|
||||
}}>
|
||||
<Empty description='暂无信息' />
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
{/* <Table rowSelection={
|
||||
{
|
||||
selectedRowKeys,
|
||||
onSelect: (data) => {
|
||||
const isSelect = applyOrders?.some((item: DataType) => item.accountRechargeId === data.accountRechargeId)
|
||||
// console.log('onSelect', data, isSelect);
|
||||
if (!isSelect) {
|
||||
setApplyOrders?.([...applyOrders, data])
|
||||
} else {
|
||||
setApplyOrders?.(applyOrders?.filter((item: DataType) => item.accountRechargeId !== data.accountRechargeId))
|
||||
}
|
||||
},
|
||||
onSelectAll: (isAll) => {
|
||||
if (isAll) {
|
||||
const newSelectedOrders = dataArray.filter((item: DataType) => !applyOrders?.some((order: DataType) => order.accountRechargeId === item.accountRechargeId));
|
||||
// const setectSelectedOrders = applyOrders?.filter((item: DataType) => !dataArray?.some((order: DataType) => order.accountRechargeId === item.accountRechargeId));
|
||||
// console.log('newSelectedOrders', newSelectedOrders, setectSelectedOrders);
|
||||
setApplyOrders?.([...applyOrders, ...newSelectedOrders])
|
||||
} else {
|
||||
const setectSelectedOrders = applyOrders?.filter((item: DataType) => !dataArray?.some((order: DataType) => order.accountRechargeId === item.accountRechargeId));
|
||||
// console.log('setectSelectedOrders', setectSelectedOrders);
|
||||
setApplyOrders?.([...setectSelectedOrders])
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
} columns={columns} dataSource={dataArray} pagination={
|
||||
{
|
||||
pageSize: 20,
|
||||
total: total,
|
||||
showSizeChanger: false,
|
||||
onChange: (currentPage) => {
|
||||
setPage(currentPage);
|
||||
}
|
||||
}
|
||||
} scroll={{ y: 500 }} bordered key="dataTable" rowKey="accountRechargeId" /> */}
|
||||
</div>
|
||||
<Flex justify="center">
|
||||
<Space size={5}>
|
||||
<Button type="primary"
|
||||
style={{ backgroundColor: 'var(--color-primary)' }}
|
||||
onClick={() => {
|
||||
if (!selectedOrders.current) {
|
||||
// console.log('onok', applyOrders);
|
||||
if (!applyOrders || applyOrders?.length === 0) {
|
||||
messageApi.error('请选择开票订单');
|
||||
return;
|
||||
}
|
||||
props.handleOk(selectedOrders.current);
|
||||
// setSelectedOrders?.(applyOrders);
|
||||
setSelectedOrders?.(applyOrders);
|
||||
props.handleOk(applyOrders);
|
||||
}}
|
||||
>确定</Button>
|
||||
<Button type="default" onClick={() => {
|
||||
setSelectedOrders?.(selectedOrders);
|
||||
props.handleCancel();
|
||||
}}>关闭</Button>
|
||||
</Space>
|
||||
|
||||
@ -1,10 +1,14 @@
|
||||
import {Table, TableProps,
|
||||
Tooltip} from "antd";
|
||||
import {
|
||||
Table, TableProps,
|
||||
// Tooltip
|
||||
} from "antd";
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import { useEffect, useState } from "react";
|
||||
import { get } from "../../../util/AjaxUtils.ts";
|
||||
import { IListPage } from "../../../interfaces/listpage/IListPage.ts";
|
||||
|
||||
import { getInvoiceRechargeList } from "../../../request/api.ts"
|
||||
|
||||
// type DetailDataType = {
|
||||
// productType: string;
|
||||
// quantity: number;
|
||||
@ -14,16 +18,15 @@ import {IListPage} from "../../../interfaces/listpage/IListPage.ts";
|
||||
// }
|
||||
|
||||
type DataType = {
|
||||
orderId: string;
|
||||
orderNo: string;
|
||||
totalAmount: number;
|
||||
orderDetails: any;
|
||||
orderStatus: string;
|
||||
gmtCreate: string;
|
||||
rechargeMoney: number;
|
||||
thirdParty: string;
|
||||
reconciliationTime: string;
|
||||
rechargeFinalTime: string;
|
||||
accountRechargeId: string;
|
||||
}
|
||||
|
||||
interface ListProps {
|
||||
invoiceId: string;
|
||||
invoiceRechargeId: string;
|
||||
}
|
||||
|
||||
export default function InvoiceInfoSelectedList(props: ListProps) {
|
||||
@ -32,124 +35,181 @@ export default function InvoiceInfoSelectedList(props: ListProps) {
|
||||
const [total, setTotal] = useState(0);
|
||||
const [dataArray, setDataArray] = useState<DataType[]>([]);
|
||||
|
||||
const columns: TableProps<DataType>['columns'] = [
|
||||
{
|
||||
title: '订单号',
|
||||
dataIndex: 'orderNo',
|
||||
align: 'center',
|
||||
width: 250,
|
||||
fixed: 'left'
|
||||
},
|
||||
{
|
||||
title: '总金额',
|
||||
dataIndex: 'totalAmount',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
fixed: 'left',
|
||||
render: (value) => {
|
||||
return (value / 100).toFixed(2)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '订单状态',
|
||||
dataIndex: 'orderStatus',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
render: (value) => {
|
||||
if(value === 'COMPLETE') {
|
||||
return '完成';
|
||||
}
|
||||
if(value === 'CHARGEBACK') {
|
||||
return '已退款';
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'gmtCreate',
|
||||
align: 'center',
|
||||
width: 180
|
||||
},
|
||||
{
|
||||
title: '产品类型',
|
||||
dataIndex: 'orderDetails.0.productType',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
render: (_value, record) => {
|
||||
if(record.orderDetails[0].productType === 'PROJ') {
|
||||
return '项目创建'
|
||||
}
|
||||
if(record.orderDetails[0].productType === 'AGENT') {
|
||||
return '项目代理'
|
||||
}
|
||||
return record.orderDetails[0].productType
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '数量',
|
||||
dataIndex: 'orderDetails.0.quantity',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
render: (_value, record) => {
|
||||
return record.orderDetails[0].quantity
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '单价',
|
||||
dataIndex: 'orderDetails.0.unitPrice',
|
||||
align: 'center',
|
||||
width: 100,
|
||||
render: (_value, record) => {
|
||||
return (record.orderDetails[0].unitPrice / 100).toFixed(2)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '订单备注',
|
||||
dataIndex: 'orderDetails.0.notes',
|
||||
align: 'center',
|
||||
width: 120,
|
||||
render: (_value, record) => {
|
||||
return record.orderDetails[0].notes
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '描述',
|
||||
dataIndex: 'orderDetails.0.productDescription',
|
||||
align: 'center',
|
||||
width: 200,
|
||||
ellipsis: {
|
||||
showTitle: false,
|
||||
},
|
||||
render: (_value, record) => {
|
||||
return <Tooltip placement="top" title={record.orderDetails[0].productDescription}>{record.orderDetails[0].productDescription}</Tooltip>
|
||||
}
|
||||
},
|
||||
]
|
||||
// const columns: TableProps<DataType>['columns'] = [
|
||||
// {
|
||||
// title: '订单号',
|
||||
// dataIndex: 'orderNo',
|
||||
// align: 'center',
|
||||
// width: 250,
|
||||
// fixed: 'left'
|
||||
// },
|
||||
// {
|
||||
// title: '总金额',
|
||||
// dataIndex: 'totalAmount',
|
||||
// align: 'center',
|
||||
// width: 100,
|
||||
// fixed: 'left',
|
||||
// render: (value) => {
|
||||
// return (value / 100).toFixed(2)
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// title: '订单状态',
|
||||
// dataIndex: 'orderStatus',
|
||||
// align: 'center',
|
||||
// width: 100,
|
||||
// render: (value) => {
|
||||
// if(value === 'COMPLETE') {
|
||||
// return '完成';
|
||||
// }
|
||||
// if(value === 'CHARGEBACK') {
|
||||
// return '已退款';
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// title: '创建时间',
|
||||
// dataIndex: 'gmtCreate',
|
||||
// align: 'center',
|
||||
// width: 180
|
||||
// },
|
||||
// {
|
||||
// title: '产品类型',
|
||||
// dataIndex: 'orderDetails.0.productType',
|
||||
// align: 'center',
|
||||
// width: 100,
|
||||
// render: (_value, record) => {
|
||||
// if(record.orderDetails[0].productType === 'PROJ') {
|
||||
// return '项目创建'
|
||||
// }
|
||||
// if(record.orderDetails[0].productType === 'AGENT') {
|
||||
// return '项目代理'
|
||||
// }
|
||||
// return record.orderDetails[0].productType
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// title: '数量',
|
||||
// dataIndex: 'orderDetails.0.quantity',
|
||||
// align: 'center',
|
||||
// width: 100,
|
||||
// render: (_value, record) => {
|
||||
// return record.orderDetails[0].quantity
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// title: '单价',
|
||||
// dataIndex: 'orderDetails.0.unitPrice',
|
||||
// align: 'center',
|
||||
// width: 100,
|
||||
// render: (_value, record) => {
|
||||
// return (record.orderDetails[0].unitPrice / 100).toFixed(2)
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// title: '订单备注',
|
||||
// dataIndex: 'orderDetails.0.notes',
|
||||
// align: 'center',
|
||||
// width: 120,
|
||||
// render: (_value, record) => {
|
||||
// return record.orderDetails[0].notes
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// title: '描述',
|
||||
// dataIndex: 'orderDetails.0.productDescription',
|
||||
// align: 'center',
|
||||
// width: 200,
|
||||
// ellipsis: {
|
||||
// showTitle: false,
|
||||
// },
|
||||
// render: (_value, record) => {
|
||||
// return <Tooltip placement="top" title={record.orderDetails[0].productDescription}>{record.orderDetails[0].productDescription}</Tooltip>
|
||||
// }
|
||||
// },
|
||||
// ]
|
||||
|
||||
// const columns = []
|
||||
useEffect(() => {
|
||||
get<IListPage<DataType>>({
|
||||
messageApi,
|
||||
url: `/api/order/listpage/complete/self?invoiceId=${props.invoiceId}`,
|
||||
config: {
|
||||
params: {
|
||||
page: page,
|
||||
rows: 20
|
||||
}
|
||||
const columns: TableProps<DataType>['columns'] = [
|
||||
|
||||
{
|
||||
title: '充值金额',
|
||||
dataIndex: 'rechargeMoney',
|
||||
align: 'center',
|
||||
width: 150,
|
||||
key: 'accountRechargeId',
|
||||
|
||||
},
|
||||
onSuccess({data}) {
|
||||
setPage(data.page);
|
||||
setTotal(data.total);
|
||||
setDataArray(data.rows);
|
||||
{
|
||||
title: '充值方式',
|
||||
dataIndex: 'thirdParty',
|
||||
align: 'center',
|
||||
width: 150,
|
||||
key: 'thirdParty',
|
||||
},
|
||||
{
|
||||
title: '充值时间',
|
||||
dataIndex: 'reconciliationTime',
|
||||
align: 'center',
|
||||
// width: 150,
|
||||
key: 'reconciliationTime',
|
||||
|
||||
},
|
||||
{
|
||||
title: '充值到账时间',
|
||||
dataIndex: 'rechargeFinalTime',
|
||||
align: 'center',
|
||||
// width: 150,
|
||||
key:'rechargeFinalTime',
|
||||
},
|
||||
|
||||
]
|
||||
const getData = async () => {
|
||||
try {
|
||||
const res: any = await getInvoiceRechargeList(props.invoiceRechargeId, { page: page, rows: 20 })
|
||||
console.log('数据', res);
|
||||
setPage(res.page);
|
||||
setTotal(res.total);
|
||||
setDataArray(res.rows);
|
||||
} catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
useEffect(() => {
|
||||
getData()
|
||||
// get<IListPage<DataType>>({
|
||||
// messageApi,
|
||||
// url: `/api/order/listpage/complete/self?invoiceId=${props.invoiceId}`,
|
||||
// config: {
|
||||
// params: {
|
||||
// page: page,
|
||||
// rows: 20
|
||||
// }
|
||||
// },
|
||||
// onSuccess({data}) {
|
||||
// setPage(data.page);
|
||||
// setTotal(data.total);
|
||||
// setDataArray(data.rows);
|
||||
// }
|
||||
// })
|
||||
}, [page]);
|
||||
|
||||
return (
|
||||
<>
|
||||
{messageContext}
|
||||
<div className="invoice-list-container">
|
||||
|
||||
<div className="mod-list">
|
||||
<Table columns={columns} dataSource={dataArray} pagination={
|
||||
<Table columns={columns} dataSource={dataArray}
|
||||
pagination={
|
||||
{
|
||||
pageSize: 20,
|
||||
total: total,
|
||||
@ -159,7 +219,8 @@ export default function InvoiceInfoSelectedList(props: ListProps) {
|
||||
}
|
||||
|
||||
}
|
||||
} scroll={{y: 500}} bordered key="dataTable" rowKey="orderId"/>
|
||||
} scroll={{ y: 500 }} bordered key="accountRechargeId" rowKey="accountRechargeId"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@ -80,9 +80,9 @@ export default function ListProj() {
|
||||
rows: 10,
|
||||
keywords: keywords,
|
||||
// charge: type,
|
||||
chargeType: type,
|
||||
chargeAdditionals: chargeAdditionals,
|
||||
tagDataId: part1,
|
||||
chargeType: type, //类型
|
||||
chargeAdditionals: chargeAdditionals, //拓展收费
|
||||
tagDataId: part1, //标签
|
||||
projRemindId: projRemindId,
|
||||
authorId: authorId,
|
||||
payStatus: payStatus,
|
||||
|
||||
@ -854,12 +854,24 @@ export default function Head() {
|
||||
|
||||
}, [])
|
||||
const loginFlag = async () => {
|
||||
// await getLoginflag(globalContext.user.userId)
|
||||
|
||||
await getLoginflag(globalContext.user.userId);
|
||||
|
||||
try {
|
||||
await getLoginflag(globalContext.user.userId)
|
||||
sessionStorage.setItem('isLoggedIn', 'true');
|
||||
|
||||
}
|
||||
catch (error: any) {
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
useEffect(() => {
|
||||
if (globalContext.user.userId) {
|
||||
@ -1319,9 +1331,10 @@ export default function Head() {
|
||||
<Modal open={isInvoiceModalOpen}
|
||||
centered
|
||||
title="发票管理"
|
||||
width={1100}
|
||||
width={1300}
|
||||
footer={false}
|
||||
onCancel={() => setIsInvoiceModalOpen(false)}
|
||||
destroyOnClose
|
||||
>
|
||||
<InvoiceList />
|
||||
</Modal>
|
||||
|
||||
@ -1,4 +1,30 @@
|
||||
import request from './request'
|
||||
// 获取登录标志
|
||||
export const getLoginflag = (userId:string) => request.get(`/operator-plugin/app/contentcensusrelease/log?requestUrl=网页USER${userId}`)
|
||||
// 获取开票记录列表
|
||||
export const getInvoiceRecordList = (userId:string,params: any) => request.get(`/operator-plugin/api/invoicerecharge/listpage/${userId}`,{params})
|
||||
// 获取开票信息数组
|
||||
export const getInvoiceList = (userId:string,params: any) => request.get(`/operator-plugin/api/invoice-config/listpage/${userId}`,{params})
|
||||
|
||||
// 新增开票信息
|
||||
export const addInvoiceInfo = (userId:string,params:any) => request.post(`/operator-plugin/api/invoice-config/save/${userId}`,params)
|
||||
// 获取开票信息
|
||||
export const getInvoiceInfo = (invoiceId: string) => request.get(`/operator-plugin/api/invoice-config/get/${invoiceId}`)
|
||||
//更新开票信息
|
||||
export const updateInvoiceInfo = (invoiceId: string,params:any) => request.put(`/operator-plugin/api/invoice-config/update/${invoiceId}`,params)
|
||||
// 删除开票信息
|
||||
export const deleteInvoiceInfo = (invoiceId: string) => request.delete(`/operator-plugin/api/invoice-config/remove/${invoiceId}`)
|
||||
// 获取可申请开票的充值记录列表
|
||||
export const getRechargeRecordList = (userId:string,params: any) => request.get(`/operator-plugin/api/invoicerecharge/recharge-listpage/${userId}/not`,{params})
|
||||
//获取开票的充值记录(点击查看开票的充值记录)
|
||||
export const getInvoiceRechargeList = (invoiceRechargeId:string,params:any) => request.get(`/operator-plugin/api/invoicerecharge/listpage-byid/${invoiceRechargeId}`,{params})
|
||||
// 提交开票申请
|
||||
export const submitInvoiceApply = (userId:string,params:any) => request.post(`/operator-plugin/api/invoicerecharge/save/${userId}`,params)
|
||||
// 查看开票信息
|
||||
export const getInvoiceInfoById = (invoiceRechargeId: string) => request.get(`/operator-plugin/api/invoicerecharge/get/${invoiceRechargeId}`)
|
||||
// 取消开票
|
||||
export const cancelInvoice = (invoiceRechargeId: string) => request.put(`/operator-plugin/api/invoicerecharge/cancel/${invoiceRechargeId}`)
|
||||
// 获取开票信息
|
||||
export const getInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string) => request.get(`/operator-plugin/api/invoicerecharge/get/${invoiceRechargeId}`)
|
||||
// 修改开票信息
|
||||
export const updateInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string,params:any) => request.put(`/operator-plugin/api/invoicerecharge/update/${invoiceRechargeId}`,params)
|
||||
@ -1,5 +1,6 @@
|
||||
import axios from "axios";
|
||||
const baseURL = 'https://www.aimzhu.com';
|
||||
const baseURL = 'http://192.168.0.115:8099';
|
||||
// const baseURL = 'https://www.aimzhu.com';
|
||||
const request = axios.create({
|
||||
baseURL: baseURL,
|
||||
timeout: 5000,
|
||||
@ -23,5 +24,9 @@ request.interceptors.response.use(
|
||||
(err) => Promise.reject(err)
|
||||
);
|
||||
|
||||
// 下载发票
|
||||
export const downloadInvoice = (id: string) => {
|
||||
return `${baseURL}/operator-plugin/route/file/download/false/${id}`
|
||||
};
|
||||
|
||||
export default request
|
||||
Loading…
Reference in New Issue
Block a user