125 lines
3.7 KiB
TypeScript
125 lines
3.7 KiB
TypeScript
import React, { useState, useRef, } from 'react';
|
|
import { message, Button } from 'antd';
|
|
import { PageHeaderWrapper } from '@ant-design/pro-layout';
|
|
import ProTable, { ProColumns, ActionType } from '@ant-design/pro-table';
|
|
import { TableListItem, FormValueType } from './data.d'
|
|
import UpdateForm from './components/updateForm';
|
|
import { updateInv, getList } from './service';
|
|
|
|
|
|
|
|
/**
|
|
* 更新节点
|
|
* @param fields
|
|
*/
|
|
const handleUpdate = async (fields: FormValueType) => {
|
|
const hide = message.loading('正在配置');
|
|
try {
|
|
await updateInv({
|
|
companyName: fields.companyName,
|
|
shibieNo: fields.shibieNo,
|
|
companyAdd: fields.companyAdd,
|
|
companyPhone: fields.companyPhone,
|
|
bank: fields.bank,
|
|
bankNo: fields.bankNo,
|
|
area: fields.area,
|
|
allAdd: fields.allAdd,
|
|
man: fields.man,
|
|
manPh: fields.manPh,
|
|
status: fields.status,
|
|
});
|
|
hide();
|
|
|
|
message.success('配置成功');
|
|
return true;
|
|
} catch (error) {
|
|
hide();
|
|
message.error('配置失败请重试!');
|
|
return false;
|
|
}
|
|
};
|
|
const invoice: React.FC<{}> = () => {
|
|
const actionRef = useRef<ActionType>();
|
|
//修改页面显隐
|
|
const [updateModalVis, handleUpdateModalVis] = useState<boolean>(false);
|
|
//存值
|
|
const [formValues, setFormValues] = useState({});
|
|
|
|
const columns: ProColumns<TableListItem>[] = [
|
|
{ title: '序号', dataIndex: 'index', valueType: 'index', width: 10, },
|
|
{ title: '项目名称', dataIndex: 'proName', width: 300, copyable: true },
|
|
{
|
|
title: '发票类型', dataIndex: 'type', width: 150,
|
|
valueEnum: {
|
|
0: { text: '普通' },
|
|
1: { text: '专用' },
|
|
},
|
|
},
|
|
{
|
|
title: '状态', dataIndex: 'status', width: 100,
|
|
valueEnum: {
|
|
0: { text: '未开', status: 'Processing' },
|
|
1: { text: '已开', status: 'Success' },
|
|
},
|
|
},
|
|
{
|
|
title: '操作', dataIndex: 'option', width: 180,
|
|
valueType: 'option',
|
|
render: (_, record) => {
|
|
return (
|
|
<>
|
|
{record.status == 0 ?
|
|
<Button size='small' onClick={() => { setFormValues(record); handleUpdateModalVis(true); }}>修改</Button>
|
|
: <Button size='small' onClick={() => { setFormValues(record); handleUpdateModalVis(true); }}>查看</Button>
|
|
}
|
|
</>
|
|
)
|
|
}
|
|
},
|
|
];
|
|
return (
|
|
<PageHeaderWrapper>
|
|
<ProTable<any>
|
|
actionRef={actionRef}//action触发后更新表格
|
|
columns={columns}//表格
|
|
search={{ labelWidth: 70, span: 6 }}
|
|
pagination={{ defaultPageSize: 10 }}//默认显示条数
|
|
request={(params, sorter, filter) => getList({ ...params, sorter, filter }).then((res) => {
|
|
console.log(res);
|
|
const result = {
|
|
data: res.data.payVoList,
|
|
total: res.data.total,
|
|
success: res.data.success,
|
|
pageSize: res.data.pageSize,
|
|
current: res.data.current
|
|
};
|
|
return result;
|
|
})}
|
|
bordered
|
|
/>
|
|
{formValues && Object.keys(formValues).length ? (
|
|
//分派界面
|
|
<UpdateForm
|
|
onCancel={() => {
|
|
handleUpdateModalVis(false);
|
|
setFormValues({});
|
|
}}
|
|
onSubmit={async (value) => {
|
|
const success = await handleUpdate(value);
|
|
if (success) {
|
|
handleUpdateModalVis(false);
|
|
setFormValues({});
|
|
if (actionRef.current) {
|
|
actionRef.current.reload();
|
|
}
|
|
}
|
|
}}
|
|
updateModalVis={updateModalVis}
|
|
values={formValues}
|
|
/>
|
|
) : null}
|
|
</PageHeaderWrapper>
|
|
|
|
)
|
|
};
|
|
export default invoice; |