12-23-上传master
This commit is contained in:
xingsy
@ -0,0 +1,122 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import { Form, Input, Modal, Spin } from 'antd';
|
||||
|
||||
interface NewInvoiceProps {
|
||||
modalVisible: boolean;
|
||||
onCancel: () => void;
|
||||
onSubmit: (value: any) => void;
|
||||
title: string;
|
||||
values: any;
|
||||
loading: any;
|
||||
}
|
||||
|
||||
const layout = {
|
||||
labelCol: { span: 7 },
|
||||
wrapperCol: { span: 12 },
|
||||
};
|
||||
|
||||
const validateMessages = {
|
||||
required: '请填写${label}',
|
||||
types: {
|
||||
email: '输入的${label}不正确',
|
||||
},
|
||||
};
|
||||
|
||||
const NewInvoice: React.FC<NewInvoiceProps> = (props) => {
|
||||
const { modalVisible, onCancel, title, onSubmit, values, loading } = props;
|
||||
const [form] = Form.useForm();
|
||||
|
||||
useEffect(() => {
|
||||
if (JSON.stringify(values) != '{}') {
|
||||
form.setFieldsValue({
|
||||
id: values.id,
|
||||
companyName: values.companyName,
|
||||
taxpayerIdentification: values.taxpayerIdentification,
|
||||
companyAddress: values.companyAddress,
|
||||
companyPhone: values.companyPhone,
|
||||
bank: values.bank,
|
||||
account: values.account,
|
||||
});
|
||||
}
|
||||
}, [values, modalVisible]);
|
||||
|
||||
const onOk = () => {
|
||||
form.submit();
|
||||
};
|
||||
|
||||
const onFinish = (values: any) => {
|
||||
onSubmit(values);
|
||||
form.resetFields();
|
||||
};
|
||||
return (
|
||||
<Modal
|
||||
destroyOnClose
|
||||
title={title}
|
||||
visible={modalVisible}
|
||||
onCancel={onCancel}
|
||||
onOk={onOk}
|
||||
okText="保存"
|
||||
cancelText="取消"
|
||||
width={800}
|
||||
>
|
||||
<Spin spinning={loading} delay={300}>
|
||||
<Form
|
||||
{...layout}
|
||||
name="nest-messages"
|
||||
form={form}
|
||||
onFinish={onFinish}
|
||||
validateMessages={validateMessages}
|
||||
preserve={false}
|
||||
>
|
||||
<Form.Item name="companyName" label="公司名称" rules={[{ required: true }]}>
|
||||
<Input placeholder="请填写公司名称" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="taxpayerIdentification"
|
||||
label="纳税人识别号"
|
||||
rules={[{ required: true }]}
|
||||
>
|
||||
<Input placeholder="请填写纳税人识别号" />
|
||||
</Form.Item>
|
||||
<Form.Item name="companyAddress" label="公司地址" rules={[{ required: true }]}>
|
||||
<Input placeholder="请填写公司地址" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="companyPhone"
|
||||
label="公司电话"
|
||||
rules={[
|
||||
{ required: true },
|
||||
{
|
||||
pattern: /(^[1][3,4,5,6,7,8,9][0-9]{9}$)|(^(([0\+]\d{2,3}-)?(0\d{2,3})-)(\d{7,8})(-(\d{3,}))?$)/,
|
||||
message: '输入的电话号码不正确',
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input placeholder="请填写公司电话（手机号或固定电话）" />
|
||||
</Form.Item>
|
||||
<Form.Item name="bank" label="开户银行" rules={[{ required: true }]}>
|
||||
<Input placeholder="请填写开户银行" />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
name="account"
|
||||
label="开户账号"
|
||||
rules={[
|
||||
{ required: true },
|
||||
{
|
||||
pattern: /^[1-9]\d{9,29}$/,
|
||||
message: '输入的银行号码不正确',
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input placeholder="请填写开户账号" />
|
||||
</Form.Item>
|
||||
<Form.Item name="id" label="id" hidden>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Spin>
|
||||
</Modal>
|
||||
);
|
||||
};
|
||||
|
||||
export default NewInvoice;
|
||||
189
src/pages/CommonInfo/Supplier/InvoiceInformation/index.tsx
Normal file
189
src/pages/CommonInfo/Supplier/InvoiceInformation/index.tsx
Normal file
@ -0,0 +1,189 @@
|
||||
import ProTable, { ActionType, ProColumns } from '@ant-design/pro-table';
|
||||
import { Button, Card, message, Popconfirm } from 'antd';
|
||||
import React, { useState } from 'react';
|
||||
import { useRef } from 'react';
|
||||
import NewInvoice from './components/NewInvoice';
|
||||
import { deleteInvoice, getInvoiceList } from './service';
|
||||
import { handleAdd, handleUpdate } from './utils';
|
||||
/**
|
||||
* 供应商信息管理-常用发票信息管理
|
||||
*/
|
||||
|
||||
const InvoiceInformation: React.FC<{}> = () => {
|
||||
//表格控制
|
||||
const actionRef = useRef<ActionType>();
|
||||
//新建&修改发票弹窗控制
|
||||
const [InvoiceVisible, setInvoiceVisible] = useState<boolean>(false);
|
||||
//存储行数据
|
||||
const [invoiceLineData, setInvoiceLineData] = useState<any>({});
|
||||
//存储修改和删除弹窗标题
|
||||
const [invoiceModalTitle, setInvoiceModalTitle] = useState<any>('');
|
||||
//弹窗的访问遮罩
|
||||
const [spinLoading, setSpinLoading] = useState<boolean>(false);
|
||||
const columns: ProColumns<any>[] = [
|
||||
{
|
||||
title: '序号',
|
||||
dataIndex: 'key',
|
||||
key: 'key',
|
||||
width: 80,
|
||||
},
|
||||
{
|
||||
title: '公司名称',
|
||||
dataIndex: 'companyName',
|
||||
key: 'companyName',
|
||||
},
|
||||
{
|
||||
title: '纳税人识别号',
|
||||
dataIndex: 'taxpayerIdentification',
|
||||
key: 'taxpayerIdentification',
|
||||
},
|
||||
{
|
||||
title: '公司地址',
|
||||
dataIndex: 'companyAddress',
|
||||
key: 'companyAddress',
|
||||
},
|
||||
{
|
||||
title: '公司电话',
|
||||
dataIndex: 'companyPhone',
|
||||
key: 'companyPhone',
|
||||
},
|
||||
{
|
||||
title: '开户银行',
|
||||
dataIndex: 'bank',
|
||||
key: 'bank',
|
||||
},
|
||||
{
|
||||
title: '开户账号',
|
||||
dataIndex: 'account',
|
||||
key: 'account',
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
valueType: 'option',
|
||||
width: 140,
|
||||
render: (_, record) => [
|
||||
<a
|
||||
key="editable"
|
||||
onClick={() => {
|
||||
setInvoiceLineData(record);
|
||||
setInvoiceModalTitle('编辑发票信息');
|
||||
setInvoiceVisible(true);
|
||||
}}
|
||||
>
|
||||
编辑
|
||||
</a>,
|
||||
<Popconfirm
|
||||
title="确定要删除吗？"
|
||||
onConfirm={() => toDelete(record)}
|
||||
okText="确定"
|
||||
cancelText="取消"
|
||||
key="del"
|
||||
>
|
||||
<a key="view">删除</a>
|
||||
</Popconfirm>,
|
||||
],
|
||||
},
|
||||
];
|
||||
const toDelete = async (value: any) => {
|
||||
if (value != undefined) {
|
||||
const success = await deleteInvoice(value.id);
|
||||
if (success) {
|
||||
message.success('删除成功');
|
||||
if (actionRef.current) {
|
||||
actionRef.current.reload();
|
||||
}
|
||||
} else {
|
||||
message.success('删除失败');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
return (
|
||||
<Card bodyStyle={{ padding: '12px 12px' }}>
|
||||
<Button
|
||||
type="primary"
|
||||
style={{ float: 'right', marginBottom: 10, zIndex: 99 }}
|
||||
onClick={() => {
|
||||
setInvoiceModalTitle('新建发票信息');
|
||||
setInvoiceVisible(true);
|
||||
}}
|
||||
key="1"
|
||||
>
|
||||
新建发票信息
|
||||
</Button>
|
||||
|
||||
<ProTable<any>
|
||||
columns={columns}
|
||||
actionRef={actionRef}
|
||||
search={false}
|
||||
options={false}
|
||||
params={{
|
||||
companyId: '9527',
|
||||
}}
|
||||
//调用分页方法
|
||||
request={async (params) => {
|
||||
let value = {
|
||||
data: [],
|
||||
success: false,
|
||||
total: 0,
|
||||
pageSize: 10,
|
||||
current: 1,
|
||||
};
|
||||
await getInvoiceList(params).then((res) => {
|
||||
value.data = res.data.records;
|
||||
value.success = res.success;
|
||||
value.total = res.data.total;
|
||||
value.pageSize = res.data.size;
|
||||
value.current = res.data.current;
|
||||
value.data.forEach((element: any, index: any) => {
|
||||
if (res.data.current == 1) {
|
||||
element.key = index + 1;
|
||||
} else {
|
||||
element.key = res.data.size * (res.data.current - 1) + index + 1;
|
||||
}
|
||||
});
|
||||
});
|
||||
return value;
|
||||
}}
|
||||
rowKey="id"
|
||||
pagination={{
|
||||
pageSize: 10,
|
||||
}}
|
||||
dateFormatter="string"
|
||||
/>
|
||||
<NewInvoice
|
||||
title={invoiceModalTitle}
|
||||
onCancel={() => {
|
||||
setInvoiceLineData({});
|
||||
setInvoiceVisible(false)
|
||||
}}
|
||||
onSubmit={async (value) => {
|
||||
setSpinLoading(true)
|
||||
let param = {
|
||||
...value,
|
||||
companyId: '9527',
|
||||
};
|
||||
let success;
|
||||
if (value.id == undefined || value.id == "") {
|
||||
success = await handleAdd(param);
|
||||
} else {
|
||||
success = await handleUpdate(param);
|
||||
}
|
||||
if (success) {
|
||||
setSpinLoading(false)
|
||||
setInvoiceLineData({});
|
||||
setInvoiceVisible(false);
|
||||
if (actionRef.current) {
|
||||
actionRef.current.reload();
|
||||
}
|
||||
}
|
||||
}}
|
||||
modalVisible={InvoiceVisible}
|
||||
values={invoiceLineData}
|
||||
loading={spinLoading}
|
||||
/>
|
||||
</Card>
|
||||
);
|
||||
};
|
||||
export default InvoiceInformation;
|
||||
39
src/pages/CommonInfo/Supplier/InvoiceInformation/service.ts
Normal file
39
src/pages/CommonInfo/Supplier/InvoiceInformation/service.ts
Normal file
@ -0,0 +1,39 @@
|
||||
import { request } from 'umi';
|
||||
|
||||
/**
|
||||
* 获取列表
|
||||
* @param params
|
||||
*/
|
||||
export async function getInvoiceList(params: any) {
|
||||
return request(
|
||||
`/api/biz-service-ebtp-expenses/v1/bizbidinvoicecommon/list`,
|
||||
{
|
||||
method: 'GET',
|
||||
params:{
|
||||
companyId:params.companyId,
|
||||
pageNo:params.current,
|
||||
pageSize:params.pageSize
|
||||
}
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* 新增和修改操作
|
||||
* @param params
|
||||
*/
|
||||
export async function addAndUpdateInvoice(params: any) {
|
||||
return request('/api/biz-service-ebtp-expenses/v1/bizbidinvoicecommon', {
|
||||
method: 'PUT',
|
||||
data: params,
|
||||
});
|
||||
}
|
||||
/**
|
||||
* 删除
|
||||
* @param params
|
||||
*/
|
||||
export async function deleteInvoice(params: any) {
|
||||
return request(`/api/biz-service-ebtp-expenses/v1/bizbidinvoicecommon/deleteById/${params}`, {
|
||||
method: 'POST',
|
||||
});
|
||||
}
|
||||
33
src/pages/CommonInfo/Supplier/InvoiceInformation/utils.ts
Normal file
33
src/pages/CommonInfo/Supplier/InvoiceInformation/utils.ts
Normal file
@ -0,0 +1,33 @@
|
||||
import { message } from 'antd';
|
||||
import { addAndUpdateInvoice } from './service';
|
||||
/**
|
||||
* 编辑操作
|
||||
* @param fields
|
||||
*/
|
||||
|
||||
export const handleUpdate = async (fields: any) => {
|
||||
try {
|
||||
await addAndUpdateInvoice({ ...fields });
|
||||
message.success('编辑成功');
|
||||
return true;
|
||||
} catch (error) {
|
||||
message.error('编辑失败');
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* 新增操作
|
||||
* @param fields
|
||||
*/
|
||||
|
||||
export const handleAdd = async (fields: any) => {
|
||||
try {
|
||||
await addAndUpdateInvoice({ ...fields });
|
||||
message.success('新建成功');
|
||||
return true;
|
||||
} catch (error) {
|
||||
message.error('新建失败');
|
||||
return false;
|
||||
}
|
||||
};
|
||||
Reference in New Issue
Block a user