厂商信息管理完成

dev
陈博文 3 years ago
parent 008dd0f51c
commit c717620e0a

@ -1,5 +1,17 @@
import styles from './index.less';
import { Button, Select, Row, Modal, Form, message, Empty, Table } from 'antd';
import {
Button,
Select,
Row,
Modal,
Form,
message,
Empty,
Table,
InputNumber,
Input,
Col,
} from 'antd';
import Fetch from '@/utils/fetch';
import { useEffect, useState, FC, useRef } from 'react';
import { downLoadLink } from '@/utils/download';
@ -12,10 +24,13 @@ const Page: FC<PageProps> = () => {
const [data, setData] = useState<any>([]);
const [loading, setLoading] = useState<boolean>(true);
const [total, setTotal] = useState<number>(0);
const [visible, setVisible] = useState<boolean>(false);
const [form] = Form.useForm();
const [params, setParams] = useState<any>({
pageNumber: 1,
pageSize: 20,
});
const editId = useRef(null);
useEffect(() => {
getData(params);
@ -91,13 +106,15 @@ const Page: FC<PageProps> = () => {
align: 'center',
fixed: 'right',
width: 110,
render: () => (
render: (v: any, r: any) => (
<span>
<i
onClick={() => handleEdit(r)}
title="修改"
className={'iconfont icon-xiugaikucundixian ' + styles.action}
/>
<i
onClick={() => handleDelete(r.id)}
title="删除"
className={'iconfont icon-shanchuzhuangbeixinghao ' + styles.action}
/>
@ -113,6 +130,51 @@ const Page: FC<PageProps> = () => {
getData(params);
};
const handleFinish = async (v: any) => {
const res = await Fetch(`/openi/producer/editOrAdd`, {
method: 'post',
data: {
...v,
id: editId.current,
},
});
if (res.result === 'success') {
params.pageNumber = 1;
setParams({ ...params });
getData(params);
setVisible(false);
}
};
const handleEdit = (param: any) => {
form.setFieldsValue({ ...param });
editId.current = param.id;
setVisible(true);
};
const handleDelete = (id: any) => {
Modal.confirm({
title: '提示',
okText: '确认',
cancelText: '取消',
content: '确认删除吗?',
onOk: async () => {
const res = await Fetch(`/openi/producer/delete/${id}`, {
method: 'post',
});
if (res.result === 'success') {
const page =
1 === data.length && params.pageNumber > 1
? params.pageNumber - 1
: params.pageNumber;
params.pageNumber = page;
setParams({ ...params });
getData(params);
}
},
});
};
return (
<div className={styles.page}>
<div className={styles.title}>
@ -123,7 +185,12 @@ const Page: FC<PageProps> = () => {
/>
</div>
<Row justify="end" className={styles.btn}>
<Button icon={<i className="iconfont icon-tianjia" />}></Button>
<Button
onClick={() => setVisible(true)}
icon={<i className="iconfont icon-tianjia" />}
>
</Button>
{/* <Button icon={<i className='iconfont icon-daorushuju2' />} className='ml10'>导出厂商信息</Button> */}
</Row>
<Table
@ -140,11 +207,177 @@ const Page: FC<PageProps> = () => {
total: total,
current: params.page,
showQuickJumper: true,
hideOnSinglePage: true,
hideOnSinglePage: false,
position: ['bottomCenter'],
// showTotal: total => <span className="mr10">共<span>{total}</span>条数据</span>
}}
/>
<Modal
centered
title="厂商信息注册"
visible={visible}
okText="保存"
width={924}
afterClose={() => {
form.resetFields();
editId.current = null;
}}
cancelText="取消"
onOk={() => {
form.submit();
}}
onCancel={() => {
setVisible(false);
}}
>
<Form
form={form}
colon={false}
layout="horizontal"
onFinish={handleFinish}
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
>
<Row align="middle">
<Col span={12}>
<Form.Item
label="生产厂商代号"
name="producerNumber"
rules={[
{
required: true,
message: `请输入生产厂商代号`,
},
]}
>
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label="生产厂商全名"
name="name"
rules={[
{
required: true,
message: `请输入生产厂商全名`,
},
]}
>
<Input />
</Form.Item>
</Col>
</Row>
<Row align="middle">
<Col span={12}>
<Form.Item label="生产厂商简称" name="simpleName">
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label="生产厂商地址"
name="address"
rules={[
{
required: true,
message: `请输入生产厂商地址`,
},
]}
>
<Input />
</Form.Item>
</Col>
</Row>
<Row align="middle">
<Col span={12}>
<Form.Item
label="联系人1姓名"
name="contacts1"
rules={[
{
required: true,
message: `请输入联系人1姓名`,
},
]}
>
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label="联系人1电话"
name="tel1"
rules={[
{
required: true,
message: `请输入联系人1电话`,
},
]}
>
<Input />
</Form.Item>
</Col>
</Row>
<Row align="middle">
<Col span={12}>
<Form.Item
label="联系人1手机"
name="phone1"
rules={[
{
required: true,
message: `请输入联系人1手机`,
},
]}
>
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="联系人1邮箱" name="email1">
<Input />
</Form.Item>
</Col>
</Row>
<Row align="middle">
<Col span={12}>
<Form.Item label="联系人2姓名" name="contacts2">
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="联系人2电话" name="tel2">
<Input />
</Form.Item>
</Col>
</Row>
<Row align="middle">
<Col span={12}>
<Form.Item label="联系人2手机" name="phone2">
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="联系人2邮箱" name="email2">
<Input />
</Form.Item>
</Col>
</Row>
<Row align="middle">
<Col span={24}>
<Form.Item
labelCol={{ span: 4 }}
wrapperCol={{ span: 20 }}
label="详情备注"
name="remarks"
>
<Input.TextArea />
</Form.Item>
</Col>
</Row>
</Form>
</Modal>
</div>
);
};

Loading…
Cancel
Save