From f479e853f3d4baa5c576917ef0b570e9263c0647 Mon Sep 17 00:00:00 2001
From: zjlnb666 <14659021+zhangjianlong666@user.noreply.gitee.com>
Date: Thu, 30 Oct 2025 15:56:45 +0800
Subject: [PATCH] =?UTF-8?q?=E5=8F=B0=E5=B8=90=E7=BB=B4=E6=8A=A4=E8=AE=B0?=
=?UTF-8?q?=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../Inspectionrecords/inspectionRecords.js | 370 ++++++++++++++++--
.../Inspectionrecords/inspectionRecords.less | 41 ++
2 files changed, 368 insertions(+), 43 deletions(-)
diff --git a/src/pages/inspectiontasks/components/Inspectionrecords/inspectionRecords.js b/src/pages/inspectiontasks/components/Inspectionrecords/inspectionRecords.js
index 55878dd..ea38691 100644
--- a/src/pages/inspectiontasks/components/Inspectionrecords/inspectionRecords.js
+++ b/src/pages/inspectiontasks/components/Inspectionrecords/inspectionRecords.js
@@ -2,7 +2,7 @@
import styles from './inspectionRecords.less'
import titleBg from '@/assets/img/recordTitleBg.png'
import {useEffect, useRef, useState} from "react";
-import {Button, Col, DatePicker, Drawer, Input, Menu, Row, Select, Table, Tag, Tree} from "antd";
+import {Button, Col, DatePicker, Drawer, Form, Input, Menu, Row, Select, Table, Tag, Tree,} from "antd";
import {MenuBg, TablePagination} from "@/pages/inspectiontasks/components/Inspectiontaskplan/InspectionTaskPlan";
import {DownOutlined, PlusOutlined, SearchOutlined, UndoOutlined} from "@ant-design/icons";
import {Title} from "@/pages/inspectiontasks/InspectionTasks";
@@ -14,6 +14,8 @@ import record1 from '@/assets/img/record1.png'
import record2 from '@/assets/img/record2.png'
import record3 from '@/assets/img/record3.png'
+const {RangePicker}=DatePicker
+
const Drawers=(props)=>{
const columns = [
{
@@ -283,7 +285,40 @@ const Drawers1=({open,onClose,row})=>{
)
}
-
+const Drawers2=({open,row,onClose})=>{
+ console.log(row)
+ return(
+
+
+
+ {row.initialCategory}
+ {row.keyEquipment}
+ {row.equipmentNo}
+ {row.equipmentName}
+ {row.equipmentStatus}
+ {row.materialCategory}
+ {row.priceCategory}
+ {row.specialEquipmentCategory}
+ {row.quantity}
+ {row.unit}
+ {row.specification}
+ {row.installationLocation}
+ {row.sort}
+ 暂无
+
+
+
+
+
+
+ )
+}
//巡检记录首页
const InspectionRecordHomepage=()=>{
const [data1,setData1]=useState([])
@@ -298,6 +333,9 @@ const InspectionRecordHomepage=()=>{
let chart2=null
let chart3=null
useEffect(()=>{
+ if (!chartRef.current) {
+ return
+ }
chart=echarts.init(chartRef.current)
const option={
// 坐标轴
@@ -358,6 +396,9 @@ const InspectionRecordHomepage=()=>{
};
},[])
useEffect(()=>{
+ if (!chartRef1.current) {
+ return
+ }
chart1=echarts.init(chartRef1.current)
const option={
legend:{
@@ -394,6 +435,9 @@ const InspectionRecordHomepage=()=>{
}
},[])
useEffect(()=>{
+ if (!chartRef2.current) {
+ return
+ }
chart2=echarts.init(chartRef2.current)
const option={
xAxis:{
@@ -434,6 +478,9 @@ const InspectionRecordHomepage=()=>{
}
},[])
useEffect(()=>{
+ if (!chartRef3.current) {
+ return
+ }
chart3=echarts.init(chartRef3.current)
const option={
legend:{
@@ -1704,97 +1751,143 @@ const InspectionStatusQueryOnTheSameDay=()=>{
//设备台账查询与维护
const EquipmentLedgerQueryAndMaintenance=()=>{
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
+ const [currentPage, setCurrentPage] = useState(1);
+ const [pageSize, setPageSize] = useState(10);
+ const [total, setTotal] = useState(85); // 总条数,实际项目中从接口获取
+ const [open,setOpen]=useState(false)
+ const [row,setRow]=useState({})
// 表格列配置
const columns = [
+ {
+ title: '期初分类',
+ dataIndex: 'initialCategory',
+ key: 'initialCategory',
+ },
+ {
+ title: '重点设备',
+ dataIndex: 'keyEquipment',
+ key: 'keyEquipment',
+ },
{
title: '设备编号',
- dataIndex: 'equipmentCode',
- key: 'equipmentCode',
- width: 120,
+ dataIndex: 'equipmentNo',
+ key: 'equipmentNo',
},
{
title: '设备名称',
dataIndex: 'equipmentName',
key: 'equipmentName',
- width: 100,
},
{
title: '设备状态',
- dataIndex: 'status',
- key: 'status',
- width: 100,
- render: (status) => (
-
- {status}
-
- ),
+ dataIndex: 'equipmentStatus',
+ key: 'equipmentStatus',
},
{
- title: '物资分类',
+ title: '物质分类',
dataIndex: 'materialCategory',
key: 'materialCategory',
- width: 100,
},
{
title: '价格分类',
dataIndex: 'priceCategory',
key: 'priceCategory',
- width: 100,
},
{
title: '特种设备分类',
dataIndex: 'specialEquipmentCategory',
key: 'specialEquipmentCategory',
- width: 120,
},
{
title: '数量',
dataIndex: 'quantity',
key: 'quantity',
- width: 80,
- align: 'center',
},
{
title: '计量单位',
dataIndex: 'unit',
key: 'unit',
- width: 100,
+ },
+ {
+ title: '规格',
+ dataIndex: 'specification',
+ key: 'specification',
+ },
+ {
+ title: '安装位置',
+ dataIndex: 'installationLocation',
+ key: 'installationLocation',
+ },
+ {
+ title: '排序',
+ dataIndex: 'sort',
+ key: 'sort',
+ },
+ {
+ title: '操作',
+ key: 'operation',
+ render: (_,record) => (
+
+ ),
+ align:'center',
},
];
// 表格数据
const dataSource = [
{
key: '1',
- equipmentCode: '60-1611',
- equipmentName: '发电机',
- status: '已启用',
+ initialCategory: '电气系统',
+ keyEquipment: '是',
+ equipmentNo: 'eq-f611',
+ equipmentName: '#1发电机',
+ equipmentStatus: '已使用',
materialCategory: '设备',
- priceCategory: 'ne',
- specialEquipmentCategory: '发电机',
+ priceCategory: '机组',
+ specialEquipmentCategory: '高压电机',
quantity: 1,
unit: '台',
+ specification: 'QFZN',
+ installationLocation: '定子间',
+ sort: 5,
},
{
key: '2',
- equipmentCode: '20-9722',
- equipmentName: '12 ME',
- status: '已启用',
+ initialCategory: '化学系统',
+ keyEquipment: '否',
+ equipmentNo: 'eq-p722',
+ equipmentName: '#2加药泵',
+ equipmentStatus: '备用',
materialCategory: '设备',
- priceCategory: 'me',
- specialEquipmentCategory: '',
- quantity: 5,
- unit: '套',
+ priceCategory: '泵类',
+ specialEquipmentCategory: '离心泵',
+ quantity: 1,
+ unit: '台',
+ specification: '50m³/h',
+ installationLocation: '加药间',
+ sort: 3,
},
{
key: '3',
- equipmentCode: '60-4889',
- equipmentName: 'ROReR',
- status: '已启用',
+ initialCategory: '水处理',
+ keyEquipment: '是',
+ equipmentNo: 'eq-v833',
+ equipmentName: '反渗透装置',
+ equipmentStatus: '已使用',
materialCategory: '设备',
- priceCategory: 'ae',
- specialEquipmentCategory: '',
- quantity: 3,
- unit: '个',
+ priceCategory: '容器',
+ specialEquipmentCategory: '压力容器',
+ quantity: 1,
+ unit: '套',
+ specification: '100t/h',
+ installationLocation: '水处理间',
+ sort: 1,
},
];
const rowSelection = {
@@ -1833,6 +1926,21 @@ const EquipmentLedgerQueryAndMaintenance=()=>{
}
]
+ // 处理页码变化
+ const handlePageChange = (page, pageSize) => {
+ setCurrentPage(page);
+ setPageSize(pageSize);
+ };
+
+ // 处理每页条数变化
+ const handlePageSizeChange = (current, size) => {
+ setPageSize(size);
+ setCurrentPage(1); // 重置到第一页
+ };
+ const onClose=()=>{
+ setOpen(false)
+ }
+
return (
@@ -1860,7 +1968,7 @@ const EquipmentLedgerQueryAndMaintenance=()=>{
-
+
@@ -1904,11 +2012,18 @@ const EquipmentLedgerQueryAndMaintenance=()=>{
dataSource={dataSource}
pagination={false}
rowSelection={rowSelection}
- style={{width:'100%',minHeight:'400px'}}
+ className={styles['recordTable']}
>
+
-
+
@@ -1916,6 +2031,173 @@ const EquipmentLedgerQueryAndMaintenance=()=>{
)
}
+//台账维护记录
+const TheLedgerMaintainsRecords=()=>{
+ const [selectedRowKeys, setSelectedRowKeys] = useState([]);
+ const [currentPage, setCurrentPage] = useState(1);
+ const [pageSize, setPageSize] = useState(10);
+ const [total, setTotal] = useState(85); // 总条数,实际项目中从接口获取
+ const dataSource = [
+ {
+ key: '1',
+ maintenanceRecordId: 'WH-20230519-001',
+ equipmentName: '#1发电机',
+ equipmentCategory: '电气系统',
+ updatedBy: '李婧妍',
+ maintenanceTime: '2023-05-19 10:30:22',
+ maintenanceMethod: '修改',
+ operation: '查看详情'
+ },
+ {
+ key: '2',
+ maintenanceRecordId: 'WH-20230518-002',
+ equipmentName: '手动蝶阀',
+ equipmentCategory: '化学系统',
+ updatedBy: '李密',
+ maintenanceTime: '2023-05-18 09:15:45',
+ maintenanceMethod: '新增',
+ operation: '查看详情'
+ },
+ {
+ key: '3',
+ maintenanceRecordId: 'WH-20230517-003',
+ equipmentName: '气动蝶阀',
+ equipmentCategory: '化学系统',
+ updatedBy: '赵礼义',
+ maintenanceTime: '2023-05-17 14:20:10',
+ maintenanceMethod: '删除',
+ operation: '查看详情'
+ },
+ {
+ key: '4',
+ maintenanceRecordId: 'WH-20230516-004',
+ equipmentName: '手动球阀',
+ equipmentCategory: '化学系统',
+ updatedBy: '孙思达',
+ maintenanceTime: '2023-05-16 11:05:30',
+ maintenanceMethod: '修改导入',
+ operation: '查看详情'
+ },
+ {
+ key: '5',
+ maintenanceRecordId: 'WH-20230515-005',
+ equipmentName: '止回阀',
+ equipmentCategory: '化学系统',
+ updatedBy: '郑岩',
+ maintenanceTime: '2023-05-15 16:40:05',
+ maintenanceMethod: '模板更新',
+ operation: '查看详情'
+ }
+ ];
+ const columns = [
+ {
+ title: '维护记录 ID',
+ dataIndex: 'maintenanceRecordId',
+ key: 'maintenanceRecordId',
+ },
+ {
+ title: '设备名称',
+ dataIndex: 'equipmentName',
+ key: 'equipmentName',
+ },
+ {
+ title: '设备分类',
+ dataIndex: 'equipmentCategory',
+ key: 'equipmentCategory',
+ },
+ {
+ title: '更新人',
+ dataIndex: 'updatedBy',
+ key: 'updatedBy',
+ },
+ {
+ title: '维护时间',
+ dataIndex: 'maintenanceTime',
+ key: 'maintenanceTime',
+ },
+ {
+ title: '维护方式',
+ dataIndex: 'maintenanceMethod',
+ key: 'maintenanceMethod',
+ },
+ {
+ title: '操作',
+ dataIndex: 'operation',
+ key: 'operation',
+ render: (text) => {text}, // 可添加点击事件实现详情查看
+ },
+ ];
+ const rowSelection = {
+ selectedRowKeys,
+ onChange: (newSelectedRowKeys) => {
+ setSelectedRowKeys(newSelectedRowKeys);
+ }
+ };
+ // 处理页码变化
+ const handlePageChange = (page, pageSize) => {
+ setCurrentPage(page);
+ setPageSize(pageSize);
+ };
+
+ // 处理每页条数变化
+ const handlePageSizeChange = (current, size) => {
+ setPageSize(size);
+ setCurrentPage(1); // 重置到第一页
+ };
+ return(
+
+ )
+}
const items = [
{
label: }>,
@@ -1940,6 +2222,7 @@ const items = [
key:'设备台账数据',
children:[
{label:'设备台账查询与维护',key:'设备台账查询与维护'},
+ {label:'台账维护记录',key:'台账维护记录'},
]
},
{
@@ -1958,6 +2241,7 @@ const tabList={
'当前巡检状态查询': ,
'当日巡检状态查询': ,
'设备台账查询与维护': ,
+ '台账维护记录': ,
}
const InspectionRecords=()=>{
const [current,setCurrent]=useState('巡检记录首页')
diff --git a/src/pages/inspectiontasks/components/Inspectionrecords/inspectionRecords.less b/src/pages/inspectiontasks/components/Inspectionrecords/inspectionRecords.less
index 1a43295..37f62e0 100644
--- a/src/pages/inspectiontasks/components/Inspectionrecords/inspectionRecords.less
+++ b/src/pages/inspectiontasks/components/Inspectionrecords/inspectionRecords.less
@@ -167,3 +167,44 @@
color:#4E5856;
}
}
+.recordTable{
+ width:100%;
+ min-height:400px;
+ :global(.ant-table-cell){
+ padding:10px 5px !important;
+ }
+}
+.drawer2{
+ position:relative;
+ label{
+ margin-right: 15px;
+ color:#999;
+ font-size: 14px;
+ }
+ :global(.ant-drawer-header){
+ background-color:#B8E0D833 !important;
+ }
+}
+.Drawer2Btn1,.Drawer2Btn2{
+ border-radius:4px;
+ text-align:center;
+}
+.Drawer2Btn1{
+ background: #B7E5D533;
+ margin-right:10px;
+ border: 1px solid;
+ border-image-source: conic-gradient(from 102.75deg at 50% 52.91%, rgba(249, 249, 249, 0.5) -32.95deg, rgba(140, 160, 156, 0.5) 10.52deg, rgba(140, 160, 156, 0.35) 32.12deg, rgba(255, 255, 255, 0.5) 60.28deg, rgba(255, 255, 255, 0.5) 107.79deg, rgba(140, 160, 156, 0.35) 187.59deg, #F9F9F9 207.58deg, rgba(255, 255, 255, 0.5) 287.31deg, rgba(249, 249, 249, 0.5) 327.05deg, rgba(140, 160, 156, 0.5) 370.52deg);
+ border-image-slice: 1;
+ box-shadow: 0 4px 4px 0 #FFFFFF40 inset;
+ backdrop-filter: blur(8px);
+}
+.Drawer2Btn2{
+ background: #045F5E80;
+ border: 1px solid;
+ border-image-source: linear-gradient(96.54deg, #FFFFFF -0.94%, rgba(255, 255, 255, 0) 25.28%, rgba(0, 143, 142, 0) 59.69%, #008F8E 79.76%);
+ border-image-slice: 1;
+ color:#fff;
+ box-shadow: 1px 2px 5px 0 #00666540;
+ backdrop-filter: blur(3.4000000953674316px);
+ font-size:14px;
+}