|
@@ -1,5 +1,17 @@
|
|
|
import React, { Fragment, useState, useEffect, useRef, useMemo } from 'react';
|
|
|
-import { Table, Icon, message, Spin, Button, Form, DatePicker, Modal, Divider, Select, Input } from 'antd';
|
|
|
+import {
|
|
|
+ Table,
|
|
|
+ Icon,
|
|
|
+ message,
|
|
|
+ Spin,
|
|
|
+ Button,
|
|
|
+ Form,
|
|
|
+ DatePicker,
|
|
|
+ Modal,
|
|
|
+ Divider,
|
|
|
+ Select,
|
|
|
+ Input,
|
|
|
+} from 'antd';
|
|
|
import { useRequest, useModel } from '@umijs/max';
|
|
|
import FirmModal from './ManufacturerModal';
|
|
|
import dayjs from 'dayjs';
|
|
@@ -11,57 +23,72 @@ import {
|
|
|
queryCreaterList,
|
|
|
editMfr,
|
|
|
deleteMfr,
|
|
|
- saveMfr
|
|
|
-} from '@/services/manufacturer'
|
|
|
+ saveMfr,
|
|
|
+} from '@/services/manufacturer';
|
|
|
function ManufacturerList(props) {
|
|
|
+ const { projectId = 1, data } = props;
|
|
|
const {
|
|
|
- projectId = 1,
|
|
|
- data,
|
|
|
- } = props;
|
|
|
- const { initialState: { user } } = useModel('@@initialState');
|
|
|
+ initialState: { user },
|
|
|
+ } = useModel('@@initialState');
|
|
|
const [visible, setVisible] = useState(false);
|
|
|
const [curItem, setCurItem] = useState(null);
|
|
|
const [formDisabled, setFormDisabled] = useState(false);
|
|
|
const [typeDisabled, setTypeDisabled] = useState(false);
|
|
|
const [total, setTotal] = useState(0);
|
|
|
- const [formData, setFormData] = useState({ start_time: "", end_time: "", project_id: projectId * 1, is_super: user?.IsSuper || false, page: 1, page_size: pageSize });
|
|
|
+ const [formData, setFormData] = useState({
|
|
|
+ start_time: '',
|
|
|
+ end_time: '',
|
|
|
+ project_id: projectId * 1,
|
|
|
+ is_super: user?.IsSuper || false,
|
|
|
+ page: 1,
|
|
|
+ page_size: pageSize,
|
|
|
+ });
|
|
|
const queryMfrListRequest = useRequest(queryMfrList, {
|
|
|
manual: true,
|
|
|
- onSuccess: data => {
|
|
|
+ onSuccess: (data) => {
|
|
|
console.log(data);
|
|
|
- setFormData({ ...formData, page_size: pageSize })
|
|
|
+ setFormData({ ...formData, page_size: pageSize });
|
|
|
setTotal(data.count);
|
|
|
- }
|
|
|
+ },
|
|
|
});
|
|
|
const queryCreaterListRequest = useRequest(queryCreaterList, {});
|
|
|
const saveMfrRequest = useRequest(saveMfr, {
|
|
|
manual: true,
|
|
|
onSuccess: () => {
|
|
|
message.success('新增成功');
|
|
|
- queryList({ ...formData, page: 1 })
|
|
|
- queryCreaterListRequest.run({})
|
|
|
- }
|
|
|
+ queryList({ ...formData, page: 1 });
|
|
|
+ queryCreaterListRequest.run({});
|
|
|
+ },
|
|
|
});
|
|
|
const editMfrRequest = useRequest(editMfr, {
|
|
|
manual: true,
|
|
|
onSuccess: () => {
|
|
|
message.success('编辑成功');
|
|
|
- queryList({ ...formData, page: 1 })
|
|
|
- queryCreaterListRequest.run({})
|
|
|
- }
|
|
|
+ queryList({ ...formData, page: 1 });
|
|
|
+ queryCreaterListRequest.run({});
|
|
|
+ },
|
|
|
});
|
|
|
const deleteMfrRequest = useRequest(deleteMfr, {
|
|
|
manual: true,
|
|
|
onSuccess: () => {
|
|
|
message.success('删除成功');
|
|
|
- queryList({ ...formData, page: 1 })
|
|
|
- queryCreaterListRequest.run({})
|
|
|
- }
|
|
|
+ queryList({ ...formData, page: 1 });
|
|
|
+ queryCreaterListRequest.run({});
|
|
|
+ },
|
|
|
});
|
|
|
const loading = useMemo(() => {
|
|
|
- var loading = queryMfrListRequest.loading || saveMfrRequest.loading || queryCreaterListRequest.loading || editMfrRequest.loading;
|
|
|
- return loading
|
|
|
- }, [queryMfrListRequest.loading, saveMfrRequest.loading, queryCreaterListRequest.loading, editMfrRequest.loading]);
|
|
|
+ var loading =
|
|
|
+ queryMfrListRequest.loading ||
|
|
|
+ saveMfrRequest.loading ||
|
|
|
+ queryCreaterListRequest.loading ||
|
|
|
+ editMfrRequest.loading;
|
|
|
+ return loading;
|
|
|
+ }, [
|
|
|
+ queryMfrListRequest.loading,
|
|
|
+ saveMfrRequest.loading,
|
|
|
+ queryCreaterListRequest.loading,
|
|
|
+ editMfrRequest.loading,
|
|
|
+ ]);
|
|
|
const columns = [
|
|
|
{
|
|
|
title: '供应商(自然人)名称',
|
|
@@ -69,34 +96,34 @@ function ManufacturerList(props) {
|
|
|
},
|
|
|
{
|
|
|
title: '主体类型',
|
|
|
- render: record => {
|
|
|
- if (record.type == 1) return '供应商'
|
|
|
- if (record.type == 4) return '自然人'
|
|
|
+ render: (record) => {
|
|
|
+ if (record.type == 1) return '供应商';
|
|
|
+ if (record.type == 4) return '自然人';
|
|
|
},
|
|
|
- width: '6%'
|
|
|
+ width: '6%',
|
|
|
},
|
|
|
{
|
|
|
title: '证件类型',
|
|
|
- render: record => {
|
|
|
- if (record.id_type == 1) return '身份证'
|
|
|
- if (record.id_type == 2) return '护照'
|
|
|
+ render: (record) => {
|
|
|
+ if (record.id_type == 1) return '身份证';
|
|
|
+ if (record.id_type == 2) return '护照';
|
|
|
},
|
|
|
- width: '6%'
|
|
|
+ width: '6%',
|
|
|
},
|
|
|
{
|
|
|
title: '证件号',
|
|
|
dataIndex: 'id_card',
|
|
|
- width: '12%'
|
|
|
+ width: '12%',
|
|
|
},
|
|
|
{
|
|
|
title: '联系人',
|
|
|
- render: record => record.contact || '-',
|
|
|
- width: '6%'
|
|
|
+ render: (record) => record.contact || '-',
|
|
|
+ width: '6%',
|
|
|
},
|
|
|
{
|
|
|
title: '联系方式',
|
|
|
- render: record => record.phone_number || '-',
|
|
|
- width: '10%'
|
|
|
+ render: (record) => record.phone_number || '-',
|
|
|
+ width: '10%',
|
|
|
// render: (record) => {
|
|
|
// return moment(record.create_time).format('YYYY-MM-DD')
|
|
|
// }
|
|
@@ -104,56 +131,72 @@ function ManufacturerList(props) {
|
|
|
{
|
|
|
title: '银行账号',
|
|
|
dataIndex: 'bank_number',
|
|
|
- width: '12%'
|
|
|
+ width: '12%',
|
|
|
},
|
|
|
{
|
|
|
title: '创建人',
|
|
|
dataIndex: 'created_by',
|
|
|
- width: '6%'
|
|
|
+ width: '6%',
|
|
|
},
|
|
|
{
|
|
|
title: '创建时间',
|
|
|
render: (record) => {
|
|
|
- return dayjs(record.created_on).format('YYYY-MM-DD')
|
|
|
+ return dayjs(record.created_on).format('YYYY-MM-DD');
|
|
|
},
|
|
|
- width: '8%'
|
|
|
+ width: '8%',
|
|
|
},
|
|
|
{
|
|
|
title: '操作',
|
|
|
render: (text, record) => (
|
|
|
<Fragment>
|
|
|
<>
|
|
|
- <a style={{ color: "#4096ff" }} onClick={() => {
|
|
|
- setCurItem(record);
|
|
|
- setFormDisabled(false);
|
|
|
- setTypeDisabled(true);
|
|
|
- setVisible(true);
|
|
|
- }}>编辑</a>
|
|
|
+ <a
|
|
|
+ style={{ color: '#4096ff' }}
|
|
|
+ onClick={() => {
|
|
|
+ setCurItem(record);
|
|
|
+ setFormDisabled(false);
|
|
|
+ setTypeDisabled(true);
|
|
|
+ setVisible(true);
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ 编辑
|
|
|
+ </a>
|
|
|
</>
|
|
|
<>
|
|
|
<Divider type="vertical" />
|
|
|
- <a style={{ color: "#4096ff" }} onClick={() => {
|
|
|
- handleDeleteItem(record);
|
|
|
- }}> 删除</a>
|
|
|
+ <a
|
|
|
+ style={{ color: '#4096ff' }}
|
|
|
+ onClick={() => {
|
|
|
+ handleDeleteItem(record);
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {' '}
|
|
|
+ 删除
|
|
|
+ </a>
|
|
|
</>
|
|
|
<>
|
|
|
<Divider type="vertical" />
|
|
|
- <a style={{ color: "#4096ff" }} onClick={() => {
|
|
|
- setCurItem(record);
|
|
|
- setVisible(true);
|
|
|
- setFormDisabled(true);
|
|
|
- }}>详情</a>
|
|
|
+ <a
|
|
|
+ style={{ color: '#4096ff' }}
|
|
|
+ onClick={() => {
|
|
|
+ setCurItem(record);
|
|
|
+ setVisible(true);
|
|
|
+ setFormDisabled(true);
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ 详情
|
|
|
+ </a>
|
|
|
</>
|
|
|
</Fragment>
|
|
|
),
|
|
|
- width: '12%'
|
|
|
+ width: '12%',
|
|
|
},
|
|
|
];
|
|
|
const onCancel = () => {
|
|
|
- setVisible(false)
|
|
|
+ setVisible(false);
|
|
|
setFormDisabled(false);
|
|
|
- }
|
|
|
- const handleDeleteItem = record => {
|
|
|
+ };
|
|
|
+ const handleDeleteItem = (record) => {
|
|
|
console.log(record);
|
|
|
Modal.confirm({
|
|
|
title: '提醒',
|
|
@@ -161,18 +204,26 @@ function ManufacturerList(props) {
|
|
|
okText: '确认',
|
|
|
cancelText: '取消',
|
|
|
onOk: () => {
|
|
|
- deleteMfrRequest.run({ project_id: 1, id: record.id, deleted_by: user?.CName })
|
|
|
+ deleteMfrRequest.run({
|
|
|
+ project_id: 1,
|
|
|
+ id: record.id,
|
|
|
+ deleted_by: user?.CName,
|
|
|
+ });
|
|
|
},
|
|
|
});
|
|
|
- }
|
|
|
+ };
|
|
|
const handleExportChange = async () => {
|
|
|
const data = {
|
|
|
project_id: 1,
|
|
|
is_super: user?.IsSuper || false,
|
|
|
created_by: formData.created_by || '',
|
|
|
- type: formData.type || undefined
|
|
|
+ type: formData.type || undefined,
|
|
|
};
|
|
|
- window.downloadFile(`/api/supplier/v1/supplier/export?${stringify(data)}`, '供应商列表.xlsx', false);
|
|
|
+ window.downloadFile(
|
|
|
+ `/api/supplier/v1/supplier/export?${stringify(data)}`,
|
|
|
+ '供应商列表.xlsx',
|
|
|
+ false,
|
|
|
+ );
|
|
|
};
|
|
|
const handleSearch = () => {
|
|
|
console.log(formData);
|
|
@@ -185,50 +236,61 @@ function ManufacturerList(props) {
|
|
|
is_super: user?.IsSuper || false,
|
|
|
created_by: formData.created_by || '',
|
|
|
name: formData.name || '',
|
|
|
- type: formData.type * 1 || undefined
|
|
|
- }
|
|
|
+ type: formData.type * 1 || undefined,
|
|
|
+ };
|
|
|
queryList(value);
|
|
|
- }
|
|
|
- const queryList = fieldsValue => {
|
|
|
+ };
|
|
|
+ const queryList = (fieldsValue) => {
|
|
|
console.log(fieldsValue);
|
|
|
setFormData(fieldsValue);
|
|
|
var isSuper = user?.IsSuper || false;
|
|
|
- var created_by = isSuper ? fieldsValue.created_by || '' : user?.CName || undefined
|
|
|
- queryMfrListRequest.run({ ...fieldsValue, created_by })
|
|
|
- }
|
|
|
- const onDateChange = data => {
|
|
|
+ var created_by = isSuper
|
|
|
+ ? fieldsValue.created_by || ''
|
|
|
+ : user?.CName || undefined;
|
|
|
+ queryMfrListRequest.run({ ...fieldsValue, created_by });
|
|
|
+ };
|
|
|
+ const onDateChange = (data) => {
|
|
|
let start_time = '';
|
|
|
let end_time = '';
|
|
|
if (data?.length > 0) {
|
|
|
start_time = dayjs(data[0]).format('YYYY-MM-DD');
|
|
|
end_time = dayjs(data[1]).format('YYYY-MM-DD');
|
|
|
}
|
|
|
- setFormData({ ...formData, start_time: start_time, end_time: end_time })
|
|
|
- }
|
|
|
- const onOk = fieldsValue => {
|
|
|
+ setFormData({ ...formData, start_time: start_time, end_time: end_time });
|
|
|
+ };
|
|
|
+ const onOk = (fieldsValue) => {
|
|
|
console.log(fieldsValue);
|
|
|
setVisible(false);
|
|
|
if (curItem != null)
|
|
|
- editMfrRequest.run({ ...fieldsValue, project_id: 1, updated_by: user?.CName, id: curItem.id })
|
|
|
+ editMfrRequest.run({
|
|
|
+ ...fieldsValue,
|
|
|
+ project_id: 1,
|
|
|
+ updated_by: user?.CName,
|
|
|
+ id: curItem.id,
|
|
|
+ });
|
|
|
else
|
|
|
- saveMfrRequest.run({ ...fieldsValue, project_id: 1, created_by: user?.CName })
|
|
|
- }
|
|
|
- const onChange = name => {
|
|
|
- setFormData({ ...formData, created_by: name })
|
|
|
- }
|
|
|
- const onTypeChange = type => {
|
|
|
- setFormData({ ...formData, type: type })
|
|
|
- }
|
|
|
- const onPaginationChange = pagination => {
|
|
|
- var tempFormData = { ...formData, page: pagination.current }
|
|
|
- setFormData(tempFormData)
|
|
|
+ saveMfrRequest.run({
|
|
|
+ ...fieldsValue,
|
|
|
+ project_id: 1,
|
|
|
+ created_by: user?.CName,
|
|
|
+ });
|
|
|
+ };
|
|
|
+ const onChange = (name) => {
|
|
|
+ setFormData({ ...formData, created_by: name });
|
|
|
+ };
|
|
|
+ const onTypeChange = (type) => {
|
|
|
+ setFormData({ ...formData, type: type });
|
|
|
+ };
|
|
|
+ const onPaginationChange = (pagination) => {
|
|
|
+ var tempFormData = { ...formData, page: pagination.current };
|
|
|
+ setFormData(tempFormData);
|
|
|
queryList(tempFormData);
|
|
|
- }
|
|
|
- const onInputChange = e => {
|
|
|
- setFormData({ ...formData, name: e.target.value })
|
|
|
- }
|
|
|
+ };
|
|
|
+ const onInputChange = (e) => {
|
|
|
+ setFormData({ ...formData, name: e.target.value });
|
|
|
+ };
|
|
|
useEffect(() => {
|
|
|
- queryList({ ...formData })
|
|
|
+ queryList({ ...formData });
|
|
|
}, []);
|
|
|
return (
|
|
|
<>
|
|
@@ -239,30 +301,33 @@ function ManufacturerList(props) {
|
|
|
<RangePicker onChange={onDateChange} />
|
|
|
</Form.Item>
|
|
|
</div>
|
|
|
- {
|
|
|
- user?.IsSuper && <div>
|
|
|
+ {user?.IsSuper && (
|
|
|
+ <div>
|
|
|
<Form.Item label="主体类型:">
|
|
|
<Select
|
|
|
onChange={onTypeChange}
|
|
|
- options={
|
|
|
- [
|
|
|
- { value: 1, label: '供应商' },
|
|
|
- { value: 4, label: '自然人' },
|
|
|
- ]
|
|
|
- }
|
|
|
+ options={[
|
|
|
+ { value: 1, label: '供应商' },
|
|
|
+ { value: 4, label: '自然人' },
|
|
|
+ ]}
|
|
|
style={{ width: 180 }}
|
|
|
allowClear
|
|
|
/>
|
|
|
</Form.Item>
|
|
|
</div>
|
|
|
- }
|
|
|
+ )}
|
|
|
<div style={{ margin: '0 24px' }}>
|
|
|
<Form.Item label="名称:">
|
|
|
- <Input placeholder="请输入供应商名称" onChange={e => { onInputChange(e) }} />
|
|
|
+ <Input
|
|
|
+ placeholder="请输入供应商名称"
|
|
|
+ onChange={(e) => {
|
|
|
+ onInputChange(e);
|
|
|
+ }}
|
|
|
+ />
|
|
|
</Form.Item>
|
|
|
</div>
|
|
|
- {
|
|
|
- user?.IsSuper && <div>
|
|
|
+ {user?.IsSuper && (
|
|
|
+ <div>
|
|
|
<Form.Item label="创建人:">
|
|
|
<Select
|
|
|
onChange={onChange}
|
|
@@ -272,32 +337,51 @@ function ManufacturerList(props) {
|
|
|
/>
|
|
|
</Form.Item>
|
|
|
</div>
|
|
|
- }
|
|
|
+ )}
|
|
|
<div style={{ display: 'flex' }}>
|
|
|
<Form.Item>
|
|
|
- <Button style={{ marginLeft: 24 }} type="primary" onClick={() => { handleSearch() }}>
|
|
|
+ <Button
|
|
|
+ style={{ marginLeft: 24 }}
|
|
|
+ type="primary"
|
|
|
+ onClick={() => {
|
|
|
+ handleSearch();
|
|
|
+ }}
|
|
|
+ >
|
|
|
查询
|
|
|
</Button>
|
|
|
</Form.Item>
|
|
|
- <Button style={{ marginLeft: 10 }} loading={loading} type="primary" onClick={() => {
|
|
|
- setCurItem(null);
|
|
|
- setVisible(true);
|
|
|
- setTypeDisabled(false);
|
|
|
- }}>
|
|
|
+ <Button
|
|
|
+ style={{ marginLeft: 10 }}
|
|
|
+ loading={loading}
|
|
|
+ type="primary"
|
|
|
+ onClick={() => {
|
|
|
+ setCurItem(null);
|
|
|
+ setVisible(true);
|
|
|
+ setTypeDisabled(false);
|
|
|
+ }}
|
|
|
+ >
|
|
|
新增
|
|
|
</Button>
|
|
|
- <Button style={{ marginLeft: 10 }} loading={loading} onClick={() => handleExportChange()} type="primary">
|
|
|
+ <Button
|
|
|
+ style={{ marginLeft: 10 }}
|
|
|
+ loading={loading}
|
|
|
+ onClick={() => handleExportChange()}
|
|
|
+ type="primary"
|
|
|
+ >
|
|
|
导出
|
|
|
</Button>
|
|
|
</div>
|
|
|
</div>
|
|
|
</Form>
|
|
|
<Table
|
|
|
- rowKey='id'
|
|
|
+ rowKey="id"
|
|
|
loading={loading}
|
|
|
columns={columns}
|
|
|
dataSource={queryMfrListRequest?.data?.list}
|
|
|
- pagination={{ current: formData.page, total: total, page_size: pageSize }}
|
|
|
+ pagination={{
|
|
|
+ current: formData.page,
|
|
|
+ total: total,
|
|
|
+ }}
|
|
|
onChange={onPaginationChange}
|
|
|
/>
|
|
|
<FirmModal
|
|
@@ -310,7 +394,7 @@ function ManufacturerList(props) {
|
|
|
typeDisabled={typeDisabled}
|
|
|
></FirmModal>
|
|
|
</>
|
|
|
- )
|
|
|
+ );
|
|
|
}
|
|
|
|
|
|
-export default ManufacturerList;
|
|
|
+export default ManufacturerList;
|