pu428f3pz
/
datacenter
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

配发管理完成

Browse Source
dev
陈博文 4 years ago
parent 04282bcf03
commit 24e0fda473
4 changed files with 616 additions and 1 deletions
Show Stats Download Patch File Download Diff File

4
.umirc.ts
Unescape View File

@ -84,6 +84,10 @@ export default defineConfig({
path: '/manager/basicManager/manufacturer',
component: '@/pages/Manager/BasicManager/List/Manufacturer',
},
{
path: '/manager/basicManager/allotment',
component: '@/pages/Manager/BasicManager/List/Allotment',
},
],
},
],

34
src/pages/Manager/BasicManager/List/Allotment/index.less
Unescape View File

@ -0,0 +1,34 @@
.page {
.title {
height: 36px;
background: #e3effc;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20px;
font-weight: 500;
color: #464f66;
i {
cursor: pointer;
}
}
.btn {
padding: 13px 20px;
i {
font-size: 14px;
margin-right: 5px;
}
}
}
.action {
cursor: pointer;
color: #6b758b;
padding: 0 10px;
&:hover {
color: @primary-color;
}
}

577
src/pages/Manager/BasicManager/List/Allotment/index.tsx
Unescape View File

@ -0,0 +1,577 @@
import styles from './index.less';
import {
Button,
Select,
Row,
Modal,
Form,
message,
Empty,
Table,
DatePicker,
Input,
Col,
} from 'antd';
import Fetch from '@/utils/fetch';
import { useEffect, useState, FC, useRef } from 'react';
import { downLoadLink } from '@/utils/download';
import url from '@/utils/url';
import moment from 'moment';
import { ColumnsType } from 'antd/lib/table';
const RangePicker: any = DatePicker.RangePicker;
interface PageProps {}
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 [modalData, setModalData] = useState<any>([]);
const [selectKey, setSelectKey] = useState<any>([]);
//选择设备弹框
const [facilityVisible, setFacilityVisible] = useState<boolean>(false);
const [facilityData, setFacilityData] = useState<any>([]);
const [facilityKey, setFacilityKey] = useState<any>([]);
const [facilityKeyData, setFacilityKeyData] = useState<any>([]);
const [form] = Form.useForm();
const [formInquire] = Form.useForm();
const [formFacility] = Form.useForm();
let [params, setParams] = useState<any>({
pageNumber: 1,
pageSize: 20,
type: '2',
status: '',
time: '',
startDate: '',
endDate: '',
});
const editId = useRef(null);
useEffect(() => {
getData(params);
}, []);
const getFacilityData = async (record: any) => {
setLoading(true);
const res = await Fetch('/openi/device/page', {
method: 'get',
params: {
pageNumber: 1,
pageSize: 100000,
...record,
},
});
if (res.result === 'success') {
setFacilityData(res?.data?.[0]?.list);
}
};
const getData = async (record: any) => {
setLoading(true);
const { time, ...sendData } = record;
const res = await Fetch('/openi/deviceDistribution/page', {
method: 'get',
params: sendData,
});
if (res.result === 'success') {
setData(res?.data?.[0]?.list);
setTotal(res?.data?.[0]?.total);
}
setLoading(false);
};
const columns: ColumnsType<any> = [
{
title: '序号',
align: 'center',
dataIndex: 'index',
render: (text: string, record: any, index: number) =>
params.pageSize * (params.pageNumber - 1) + index + 1,
},
{
width: 220,
title: '调拨单编号',
dataIndex: 'number',
},
{
width: 220,
title: '调拨单时间',
dataIndex: 'beginTime',
},
{
title: '调拨单节点',
dataIndex: 'sendNode',
},
{
title: '状态',
dataIndex: 'status',
render: (v: any, r: any) =>
v === '1' ? (
<span style={{ color: 'green' }}>已同步</span>
) : (
<span>未同步</span>
),
},
{
title: '依据',
dataIndex: 'basis',
},
{
title: '设备数量/(台)',
dataIndex: 'deviceCount',
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
fixed: 'right',
width: 110,
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}
/>
</span>
),
},
];
const modalColumns: ColumnsType<any> = [
{
title: '序号',
align: 'center',
width: 90,
dataIndex: 'index',
render: (_: string, __: any, index: number) => index + 1,
},
{
title: '装备型号',
dataIndex: 'type',
},
{
title: '装备名称',
dataIndex: 'name',
},
{
title: '铭牌编号',
dataIndex: 'deviceId',
},
{
title: '管理标识',
dataIndex: 'producerNumber4',
},
{
title: '生产厂商',
dataIndex: 'producer',
render: (v: any) => v.name,
},
{
title: '生产厂商',
dataIndex: 'producer',
render: (v: any) => v.name,
},
{
title: '操作',
dataIndex: 'action',
align: 'center',
render: (v: any, r: any) => (
<span>
<i
onClick={() => {
setSelectKey(selectKey.filter((e: any) => e !== r.id));
setModalData(modalData.filter((e: any) => e.id !== r.id));
}}
title="删除"
className={'iconfont icon-shanchuzhuangbeixinghao ' + styles.action}
/>
</span>
),
},
];
const handleChangePage = (param: any) => {
params.pageNumber = param?.current;
params.pageSize = param?.pageSize;
setParams({ ...params });
getData(params);
};
const handleFinish = async (v: any) => {
if (selectKey.length === 0) {
message.warn('请选择配发设备');
return;
}
const res = await Fetch(`/openi/deviceDistribution/editOrAdd`, {
method: 'post',
data: {
...v,
type: '2',
deviceList: selectKey.map((e: any) => ({ id: e })),
id: editId.current,
},
});
if (res.result === 'success') {
params.pageNumber = 1;
setParams({ ...params });
getData(params);
setVisible(false);
}
};
//按钮查询
const handleInquire = async (v: any) => {
params = { ...params, ...v };
if (v.time) {
params.startDate = moment(v?.time?.[0]).format('YYYY-MM-DD HH:mm:ss');
params.endDate = moment(v?.time?.[1]).format('YYYY-MM-DD HH:mm:ss');
}
console.log(v, params, 222);
setParams({ ...params });
getData(params);
};
const handleFacility = async (v: any) => {
getFacilityData(v);
};
const handleEdit = (param: any) => {
form.setFieldsValue({ ...param });
setSelectKey(param?.deviceList.map((e: any) => e.id));
setModalData(param?.deviceList);
editId.current = param.id;
setVisible(true);
};
const handleDelete = (id: any) => {
Modal.confirm({
title: '提示',
okText: '确认',
cancelText: '取消',
content: '确认删除吗？',
onOk: async () => {
const res = await Fetch(`/openi/deviceDistribution/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}>
<span>调拨单列表</span>
<i
onClick={() => getData(params)}
className="iconfont icon-a-shuaxin2"
/>
</div>
<Row justify="end" className={styles.btn}>
<Button
onClick={() => setVisible(true)}
icon={<i className="iconfont icon-tianjia" />}
>
新建调拨单
</Button>
</Row>
<Form
form={formInquire}
colon={false}
layout="inline"
onFinish={handleInquire}
initialValues={{
status: '',
time: '',
}}
style={{ padding: '0 20px 20px 20px' }}
>
{/* <Form.Item
label="类型"
name="type"
className='mr20'
>
<Select style={{ width: 100 }}>
<Select.Option key={''}>所有</Select.Option>
<Select.Option key={'1'}>配发</Select.Option>
<Select.Option key={'2'}>调拨</Select.Option>
</Select>
</Form.Item> */}
<Form.Item label="时间" name="time" className="mr20">
<RangePicker format="YYYY-MM-DD HH:mm:ss" showTime />
</Form.Item>
<Form.Item label="状态" name="status" className="mr20">
<Select style={{ width: 100 }}>
<Select.Option key={''}>所有</Select.Option>
<Select.Option key={'1'}>已同步</Select.Option>
<Select.Option key={'0'}>未同步</Select.Option>
</Select>
</Form.Item>
<Form.Item>
<Button
onClick={() => {
formInquire.resetFields();
params = {
...params,
status: '',
time: '',
startDate: '',
endDate: '',
};
setParams({ ...params });
getData(params);
}}
>
重置
</Button>
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit">
查询
</Button>
</Form.Item>
</Form>
<Table
dataSource={data}
bordered={false}
rowKey="id"
columns={columns}
scroll={{ x: 1200 }}
loading={loading}
className="pr20 pl20"
onChange={handleChangePage}
pagination={{
pageSize: params.per_page,
total: total,
current: params.page,
showQuickJumper: 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;
setSelectKey([]);
setModalData([]);
}}
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="sendNode"
rules={[
{
required: true,
message: `请输入发往节点`,
},
]}
>
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label="配发依据"
name="basis"
rules={[
{
required: true,
message: `请输入配发依据`,
},
]}
>
<Input />
</Form.Item>
</Col>
</Row>
<Row align="middle">
<Col span={12}>
<Form.Item
label="领用人"
name="userName"
rules={[
{
required: true,
message: `请输入领用人`,
},
]}
>
<Input />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label="联系方式"
name="phone"
rules={[
{
required: true,
message: `请输入联系方式`,
},
]}
>
<Input />
</Form.Item>
</Col>
</Row>
</Form>
<Row align="middle" justify="end">
<Button type="primary">导入设备</Button>
<Button className="ml10 mr10" type="primary">
下载模板
</Button>
<Button
onClick={() => {
getFacilityData({});
setFacilityVisible(true);
setSelectKey([]);
setFacilityKey(modalData.map((e: any) => e.id));
setFacilityKeyData(modalData);
}}
type="primary"
>
选择设备
</Button>
</Row>
<Table
rowSelection={{
type: 'checkbox',
selectedRowKeys: selectKey,
onChange: (selectedRowKeys: any[], selectedRows: any[]) => {
setSelectKey(selectedRowKeys);
},
}}
dataSource={modalData}
bordered={false}
rowKey="id"
columns={modalColumns}
scroll={{ y: 400 }}
className="mt20"
pagination={false}
/>
</Modal>
{/* 选择设备弹框 */}
<Modal
centered
title="选择设备"
visible={facilityVisible}
okText="确认"
width={924}
afterClose={() => {
formFacility.resetFields();
setFacilityKey([]);
setFacilityKeyData([]);
}}
cancelText="取消"
onOk={() => {
setModalData(facilityKeyData);
setFacilityVisible(false);
}}
onCancel={() => {
setFacilityVisible(false);
}}
>
<Form
form={formFacility}
colon={false}
layout="inline"
onFinish={handleFacility}
labelCol={{ span: 8 }}
wrapperCol={{ span: 16 }}
>
<Row align="middle">
<Col span={12}>
<Form.Item label="装备代号" name="type">
<Input style={{ width: 200 }} />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item label="铭牌编号" name="deviceId">
<Input style={{ width: 200 }} />
</Form.Item>
</Col>
</Row>
<Form.Item>
<Button
className="ml20"
onClick={() => {
formFacility.resetFields();
getFacilityData({});
}}
>
重置
</Button>
</Form.Item>
<Form.Item>
<Button type="primary" htmlType="submit">
查询
</Button>
</Form.Item>
</Form>
<Table
dataSource={facilityData}
rowSelection={{
type: 'checkbox',
selectedRowKeys: facilityKey,
onChange: (selectedRowKeys: any[], selectedRows: any[]) => {
setFacilityKey(selectedRowKeys);
setFacilityKeyData(selectedRows);
},
}}
bordered={false}
rowKey="id"
columns={modalColumns.filter((e: any) => e.dataIndex !== 'action')}
scroll={{ y: 400 }}
className="mt20"
pagination={false}
/>
</Modal>
</div>
);
};
export default Page;

2
src/pages/Manager/BasicManager/index.tsx
Unescape View File

@ -34,7 +34,7 @@ const Page = ({ ...props }) => {
<div
key={e.key}
className={pathname?.includes(e.key) ? styles.active : ''}
onClick={() => history.push(e.key)}
onClick={() => history.push(`/manager/basicManager${e.key}`)}
>
<b />
<i className={e.icon} />

Write Preview
Loading…
Cancel
Save