feat
parent
b826dac889
commit
2d812ec4fd
|
|
@ -1,5 +1,20 @@
|
|||
import React, { useEffect, useState } from "react";
|
||||
import { Button, Descriptions, Form, Input, InputNumber, message, Modal, Row, Col, Table, Tag, Select, Space } from "antd";
|
||||
import {
|
||||
Button,
|
||||
Descriptions,
|
||||
Form,
|
||||
Input,
|
||||
InputNumber,
|
||||
message,
|
||||
Modal,
|
||||
Row,
|
||||
Col,
|
||||
Table,
|
||||
Tag,
|
||||
Select,
|
||||
Space,
|
||||
} from "antd";
|
||||
import { PlusOutlined } from "@ant-design/icons";
|
||||
import PageLayout from "@cqsjjb/jjb-react-admin-component/PageLayout";
|
||||
import TableAction from "@cqsjjb/jjb-react-admin-component/TableAction";
|
||||
import SearchForm from "@cqsjjb/jjb-react-admin-component/SearchForm";
|
||||
|
|
@ -19,7 +34,11 @@ function EquipInfoPage(props) {
|
|||
const [currentId, setCurrentId] = useState("");
|
||||
const [searchForm] = Form.useForm();
|
||||
const { equipInfo } = props;
|
||||
const { equipInfoList: dataSource, equipInfoTotal: total, equipInfoLoading: loading } = equipInfo || {};
|
||||
const {
|
||||
equipInfoList: dataSource,
|
||||
equipInfoTotal: total,
|
||||
equipInfoLoading: loading,
|
||||
} = equipInfo || {};
|
||||
|
||||
const handleSearch = () => {
|
||||
props.equipInfoList({
|
||||
|
|
@ -57,7 +76,10 @@ function EquipInfoPage(props) {
|
|||
cancelText: "否",
|
||||
onOk: async () => {
|
||||
const nextFlag = enabled ? 2 : 1;
|
||||
const res = await props.equipInfoToggleStatus({ id, enableFlag: nextFlag });
|
||||
const res = await props.equipInfoToggleStatus({
|
||||
id,
|
||||
enableFlag: nextFlag,
|
||||
});
|
||||
if (res?.success !== false) {
|
||||
message.success("操作成功");
|
||||
handleSearch();
|
||||
|
|
@ -69,23 +91,54 @@ function EquipInfoPage(props) {
|
|||
};
|
||||
|
||||
return (
|
||||
<PageLayout title="装备信息管理">
|
||||
<PageLayout
|
||||
title="装备信息管理"
|
||||
extra={
|
||||
<Button
|
||||
type="primary"
|
||||
icon={<PlusOutlined />}
|
||||
onClick={() => {
|
||||
setCurrentId("");
|
||||
setFormModalOpen(true);
|
||||
}}
|
||||
>
|
||||
新增装备
|
||||
</Button>
|
||||
}
|
||||
>
|
||||
<SearchForm
|
||||
style={{ marginBottom: 24 }}
|
||||
form={searchForm}
|
||||
loading={loading}
|
||||
formLine={[
|
||||
<Form.Item key="likeDeviceName" name="likeDeviceName">
|
||||
<ControlWrapper.Input label="设备名称" placeholder="请输入" allowClear />
|
||||
<ControlWrapper.Input
|
||||
label="设备名称"
|
||||
placeholder="请输入"
|
||||
allowClear
|
||||
/>
|
||||
</Form.Item>,
|
||||
<Form.Item key="instrumentType" name="instrumentType">
|
||||
<ControlWrapper.Input label="仪器类型" placeholder="请输入" allowClear />
|
||||
<ControlWrapper.Input
|
||||
label="仪器类型"
|
||||
placeholder="请输入"
|
||||
allowClear
|
||||
/>
|
||||
</Form.Item>,
|
||||
<Form.Item key="deviceType" name="deviceType">
|
||||
<ControlWrapper.Input label="设备类型" placeholder="请输入" allowClear />
|
||||
<ControlWrapper.Input
|
||||
label="设备类型"
|
||||
placeholder="请输入"
|
||||
allowClear
|
||||
/>
|
||||
</Form.Item>,
|
||||
<Form.Item key="enableFlag" name="enableFlag">
|
||||
<ControlWrapper.Select label="设备状态" placeholder="请选择" allowClear style={{ width: "100%" }}>
|
||||
<ControlWrapper.Select
|
||||
label="设备状态"
|
||||
placeholder="请选择"
|
||||
allowClear
|
||||
style={{ width: "100%" }}
|
||||
>
|
||||
<Select.Option value={1}>启用</Select.Option>
|
||||
<Select.Option value={2}>禁用</Select.Option>
|
||||
</ControlWrapper.Select>
|
||||
|
|
@ -103,19 +156,33 @@ function EquipInfoPage(props) {
|
|||
<Table
|
||||
rowKey="id"
|
||||
columns={[
|
||||
{ title: "设备名称", dataIndex: "deviceName", width: 200, ellipsis: true },
|
||||
{
|
||||
title: "设备名称",
|
||||
dataIndex: "deviceName",
|
||||
width: 200,
|
||||
ellipsis: true,
|
||||
},
|
||||
{ title: "设备型号", dataIndex: "deviceModel" },
|
||||
{ title: "仪器类型", dataIndex: "instrumentType" },
|
||||
{ title: "设备类型", dataIndex: "deviceType" },
|
||||
{ title: "厂家", dataIndex: "manufacturer", ellipsis: true, width: 180 },
|
||||
{
|
||||
title: "厂家",
|
||||
dataIndex: "manufacturer",
|
||||
ellipsis: true,
|
||||
width: 180,
|
||||
},
|
||||
{ title: "校准单位", dataIndex: "calibrationUnit" },
|
||||
{ title: "校准初值", dataIndex: "calibrationInitValue", width: 100, },
|
||||
{ title: "校准初值", dataIndex: "calibrationInitValue", width: 100 },
|
||||
{
|
||||
title: "设备状态",
|
||||
width: 90,
|
||||
render: (_, record) => {
|
||||
const enabled = record.enableFlag === 1;
|
||||
return <Tag color={enabled ? "green" : "red"}>{enabled ? "启用" : "禁用"}</Tag>;
|
||||
return (
|
||||
<Tag color={enabled ? "green" : "red"}>
|
||||
{enabled ? "启用" : "禁用"}
|
||||
</Tag>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
|
|
@ -123,16 +190,41 @@ function EquipInfoPage(props) {
|
|||
width: 180,
|
||||
render: (_, record) => (
|
||||
<TableAction>
|
||||
<Button type="link" size="small" onClick={() => { setCurrentId(record.id); setViewModalOpen(true); }}>
|
||||
<Button
|
||||
type="link"
|
||||
size="small"
|
||||
onClick={() => {
|
||||
setCurrentId(record.id);
|
||||
setViewModalOpen(true);
|
||||
}}
|
||||
>
|
||||
查看
|
||||
</Button>
|
||||
<Button type="link" size="small" onClick={() => { setCurrentId(record.id); setFormModalOpen(true); }}>
|
||||
<Button
|
||||
type="link"
|
||||
size="small"
|
||||
onClick={() => {
|
||||
setCurrentId(record.id);
|
||||
setFormModalOpen(true);
|
||||
}}
|
||||
>
|
||||
编辑
|
||||
</Button>
|
||||
<Button type="link" size="small" onClick={() => onToggleStatus(record.id, record)}>
|
||||
<Button
|
||||
type="link"
|
||||
size="small"
|
||||
onClick={() => onToggleStatus(record.id, record)}
|
||||
>
|
||||
{record.enableFlag === 1 ? "禁用" : "启用"}
|
||||
</Button>
|
||||
<Button danger type="link" size="small" onClick={() => onDelete(record.id)}>删除</Button>
|
||||
<Button
|
||||
danger
|
||||
type="link"
|
||||
size="small"
|
||||
onClick={() => onDelete(record.id)}
|
||||
>
|
||||
删除
|
||||
</Button>
|
||||
</TableAction>
|
||||
),
|
||||
},
|
||||
|
|
@ -184,7 +276,13 @@ function EquipInfoPage(props) {
|
|||
}
|
||||
|
||||
function EquipFormModal({
|
||||
open, currentId, equipInfoGet, equipInfoAdd, equipInfoEdit, onCancel, onSuccess,
|
||||
open,
|
||||
currentId,
|
||||
equipInfoGet,
|
||||
equipInfoAdd,
|
||||
equipInfoEdit,
|
||||
onCancel,
|
||||
onSuccess,
|
||||
}) {
|
||||
const [form] = Form.useForm();
|
||||
const [submitting, setSubmitting] = useState(false);
|
||||
|
|
@ -198,14 +296,18 @@ function EquipFormModal({
|
|||
}
|
||||
let cancelled = false;
|
||||
setDetailLoading(true);
|
||||
equipInfoGet({ id: currentId }).then((res) => {
|
||||
equipInfoGet({ id: currentId })
|
||||
.then((res) => {
|
||||
if (cancelled) return;
|
||||
const data = res?.data || {};
|
||||
form.setFieldsValue(data);
|
||||
}).finally(() => {
|
||||
})
|
||||
.finally(() => {
|
||||
if (!cancelled) setDetailLoading(false);
|
||||
});
|
||||
return () => { cancelled = true; };
|
||||
return () => {
|
||||
cancelled = true;
|
||||
};
|
||||
}, [open, currentId]);
|
||||
|
||||
const handleCancel = () => {
|
||||
|
|
@ -217,7 +319,9 @@ function EquipFormModal({
|
|||
try {
|
||||
setSubmitting(true);
|
||||
if (currentId) values.id = currentId;
|
||||
const res = await (currentId ? equipInfoEdit(values) : equipInfoAdd(values));
|
||||
const res = await (currentId
|
||||
? equipInfoEdit(values)
|
||||
: equipInfoAdd(values));
|
||||
if (res?.success !== false) {
|
||||
message.success(currentId ? "编辑成功" : "添加成功");
|
||||
handleCancel();
|
||||
|
|
@ -244,27 +348,47 @@ function EquipFormModal({
|
|||
<Form form={form} layout="vertical" onFinish={handleSubmit}>
|
||||
<Row gutter={16}>
|
||||
<Col span={12}>
|
||||
<Form.Item name="deviceName" label="设备名称" rules={[{ required: true, message: "请输入设备名称" }]}>
|
||||
<Form.Item
|
||||
name="deviceName"
|
||||
label="设备名称"
|
||||
rules={[{ required: true, message: "请输入设备名称" }]}
|
||||
>
|
||||
<Input placeholder="请输入设备名称" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item name="deviceModel" label="型号" rules={[{ required: true, message: "请输入型号" }]}>
|
||||
<Form.Item
|
||||
name="deviceModel"
|
||||
label="型号"
|
||||
rules={[{ required: true, message: "请输入型号" }]}
|
||||
>
|
||||
<Input placeholder="请输入型号" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item name="instrumentType" label="仪器分类" rules={[{ required: true, message: "请选择仪器分类" }]}>
|
||||
<Form.Item
|
||||
name="instrumentType"
|
||||
label="仪器分类"
|
||||
rules={[{ required: true, message: "请选择仪器分类" }]}
|
||||
>
|
||||
<Input placeholder="请输入仪器分类" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item name="deviceType" label="设备类型" rules={[{ required: true, message: "请选择设备类型" }]}>
|
||||
<Form.Item
|
||||
name="deviceType"
|
||||
label="设备类型"
|
||||
rules={[{ required: true, message: "请选择设备类型" }]}
|
||||
>
|
||||
<Input placeholder="请输入设备类型" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item name="manufacturer" label="厂家" rules={[{ required: true, message: "请输入厂家" }]}>
|
||||
<Form.Item
|
||||
name="manufacturer"
|
||||
label="厂家"
|
||||
rules={[{ required: true, message: "请输入厂家" }]}
|
||||
>
|
||||
<Input placeholder="请输入厂家" />
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
|
@ -274,13 +398,27 @@ function EquipFormModal({
|
|||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item name="minFlow" label="最小流量" rules={[positiveNumberRule("最小流量", false)]}>
|
||||
<InputNumber style={{ width: "100%" }} placeholder="请输入最小流量" />
|
||||
<Form.Item
|
||||
name="minFlow"
|
||||
label="最小流量"
|
||||
rules={[positiveNumberRule("最小流量", false)]}
|
||||
>
|
||||
<InputNumber
|
||||
style={{ width: "100%" }}
|
||||
placeholder="请输入最小流量"
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item name="maxFlow" label="最大流量" rules={[positiveNumberRule("最大流量", false)]}>
|
||||
<InputNumber style={{ width: "100%" }} placeholder="请输入最大流量" />
|
||||
<Form.Item
|
||||
name="maxFlow"
|
||||
label="最大流量"
|
||||
rules={[positiveNumberRule("最大流量", false)]}
|
||||
>
|
||||
<InputNumber
|
||||
style={{ width: "100%" }}
|
||||
placeholder="请输入最大流量"
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
|
|
@ -289,8 +427,15 @@ function EquipFormModal({
|
|||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<Form.Item name="calibrationInitValue" label="校准初始值" rules={[positiveNumberRule("校准初始值", false)]}>
|
||||
<InputNumber style={{ width: "100%" }} placeholder="请输入校准初始值" />
|
||||
<Form.Item
|
||||
name="calibrationInitValue"
|
||||
label="校准初始值"
|
||||
rules={[positiveNumberRule("校准初始值", false)]}
|
||||
>
|
||||
<InputNumber
|
||||
style={{ width: "100%" }}
|
||||
placeholder="请输入校准初始值"
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
|
|
@ -303,7 +448,10 @@ function EquipFormModal({
|
|||
<Select
|
||||
allowClear
|
||||
placeholder="请选择"
|
||||
options={[{ label: "是", value: 1 }, { label: "否", value: 0 }]}
|
||||
options={[
|
||||
{ label: "是", value: 1 },
|
||||
{ label: "否", value: 0 },
|
||||
]}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Col>
|
||||
|
|
@ -324,12 +472,16 @@ function EquipViewModal({ open, currentId, equipInfoGet, onCancel }) {
|
|||
}
|
||||
let cancelled = false;
|
||||
setDetailLoading(true);
|
||||
equipInfoGet({ id: currentId }).then((res) => {
|
||||
equipInfoGet({ id: currentId })
|
||||
.then((res) => {
|
||||
if (!cancelled) setInfo(res?.data || {});
|
||||
}).finally(() => {
|
||||
})
|
||||
.finally(() => {
|
||||
if (!cancelled) setDetailLoading(false);
|
||||
});
|
||||
return () => { cancelled = true; };
|
||||
return () => {
|
||||
cancelled = true;
|
||||
};
|
||||
}, [open, currentId]);
|
||||
|
||||
return (
|
||||
|
|
@ -344,21 +496,42 @@ function EquipViewModal({ open, currentId, equipInfoGet, onCancel }) {
|
|||
onCancel={onCancel}
|
||||
>
|
||||
<Descriptions bordered column={2} labelStyle={{ width: 120 }}>
|
||||
<Descriptions.Item label="设备名称">{info.deviceName}</Descriptions.Item>
|
||||
<Descriptions.Item label="设备型号">{info.deviceModel}</Descriptions.Item>
|
||||
<Descriptions.Item label="仪器分类">{info.instrumentType}</Descriptions.Item>
|
||||
<Descriptions.Item label="设备类型">{info.deviceType}</Descriptions.Item>
|
||||
<Descriptions.Item label="设备名称">
|
||||
{info.deviceName}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label="设备型号">
|
||||
{info.deviceModel}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label="仪器分类">
|
||||
{info.instrumentType}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label="设备类型">
|
||||
{info.deviceType}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label="厂家">{info.manufacturer}</Descriptions.Item>
|
||||
<Descriptions.Item label="设备流量说明" span={2}>{info.flowDesc}</Descriptions.Item>
|
||||
<Descriptions.Item label="设备流量说明" span={2}>
|
||||
{info.flowDesc}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label="最小流量">{info.minFlow}</Descriptions.Item>
|
||||
<Descriptions.Item label="最大流量">{info.maxFlow}</Descriptions.Item>
|
||||
<Descriptions.Item label="校准单位">{info.calibrationUnit}</Descriptions.Item>
|
||||
<Descriptions.Item label="校准初始值">{info.calibrationInitValue}</Descriptions.Item>
|
||||
<Descriptions.Item label="现场校验类型">{info.fieldCalibrationType}</Descriptions.Item>
|
||||
<Descriptions.Item label="是否双路">{DUAL_CHANNEL_MAP[info.dualChannelFlag] ?? "-"}</Descriptions.Item>
|
||||
<Descriptions.Item label="校准单位">
|
||||
{info.calibrationUnit}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label="校准初始值">
|
||||
{info.calibrationInitValue}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label="现场校验类型">
|
||||
{info.fieldCalibrationType}
|
||||
</Descriptions.Item>
|
||||
<Descriptions.Item label="是否双路">
|
||||
{DUAL_CHANNEL_MAP[info.dualChannelFlag] ?? "-"}
|
||||
</Descriptions.Item>
|
||||
</Descriptions>
|
||||
</Modal>
|
||||
);
|
||||
}
|
||||
|
||||
export default Connect([NS_EQUIP_INFO], true)(AntdTableFuncControl(EquipInfoPage));
|
||||
export default Connect(
|
||||
[NS_EQUIP_INFO],
|
||||
true,
|
||||
)(AntdTableFuncControl(EquipInfoPage));
|
||||
|
|
|
|||
Loading…
Reference in New Issue