feat(): 闸门监控开发

src/service/apiurl.js

@@ -451,6 +451,10 @@ const apiurl = {
     },
     zfzl: {
       list: service_fxdd + "/gateValveReal/list",
+       historypage: service_fxdd + '/gateValveReal/log/page',
+      historyList: service_fxdd + '/gateValveReal/log/loglist',
+      historyPageExport: service_fxdd + '/gateValveReal/log/exp',
+      swInfo:service_fxdd + '/reservoir/water/waterInfo',
       krlist: service_fxdd + "/reservoir/water/data",
       info: service_fxdd + "/attGateValve/detail",
       kgpage: service_fxdd + "/gateValveR/page",

src/views/gcaqjc/gcaqfx/jrx/jrxOptions.js

@@ -232,7 +232,7 @@ export default function jrxOptions(data = {}, type = "1",typeName='1') {
          },
          splitLine: {
             // 网格
-            show: true,
+            show: false,
             lineStyle: {
                color: '#CCCCCC',
                type: 'dashed'

src/views/rcgl/byfz/bypc/index.js

@@ -145,7 +145,8 @@ const Page = () => {
       pageSo: {
         pageNumber: 1,
         pageSize: 99999,
-      }
+      },
+      searchDate:searchVal?.searchDate
     }
     try {
       const res = await httppost2(apiurl.rcgl.byfz.bypc.count, params);
@@ -157,7 +158,7 @@ const Page = () => {
   }
   useEffect(() => {
     getCount();
-  }, [])
+  }, [searchVal])
   useEffect(() => {
     if (searchVal) {
       const params = {

src/views/rcgl/zmjk/ModalContent.js

@@ -4,61 +4,78 @@ import ModalToolBar from './ModalToolBar';
 import { httppost5 } from '../../../utils/request';
 import { exportFile } from '../../../utils/tools';
 import apiurl from '../../../service/apiurl';
-export default function ModalContent() {
+import usePageTable from '../../../components/crud/usePageTable2';
+import { createCrudService } from '../../../components/crud/_';
+export default function ModalContent({zfjkData}) {
   const columns = [
     {
       title: '序号',
       key: 'inx',
+      dataIndex:'inx',
       width: 80,
-      render: (r, i) => <span>{i + 1}</span>
     },
     {
-      title: '闸门名称',
+      title: '闸阀名称',
-      key: 'project',
+      key: 'valveName',
+      dataIndex:'valveName',
       width: 150,
     },
     {
       title: '操作内容',
-      key: 'project',
+      dataIndex:'opContent',
+      key: 'opContent',
       width: 150,
     },
     {
       title: '操作结果',
-      key: 'project',
+      dataIndex:'status',
+      key: 'status',
       width: 150,
-    }
+    },
-    ,
     {
       title: '操作时间',
-      key: 'project',
+      dataIndex:'tm',
+      key: 'tm',
       width: 150,
     }
   ]
   const [searchVal, setSearchVal] = useState(false)
-  
+   // 闸阀弹框更多数据
+    const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.gsxl.zfzl.historypage).find_noCode);
   const exportExcel = () => {
     let params = {
       ...searchVal,
-      // pageSo: {
+      pageSo: {
-      //   pageNumber: tableProps.pagination.current,
+        pageNumber: tableProps.pagination.current,
-      //   pageSize:tableProps.pagination.pageSize
+        pageSize:tableProps.pagination.pageSize
-      // }
+      }
     }
-    httppost5(apiurl.gcaqjc.sjtjcx.ndsytjb.export, params).then(res => {
+    httppost5(apiurl.gsxl.zfzl.historyPageExport, params).then(res => {
       exportFile(`闸门操作记录.xlsx`,res.data)
   })
   }
+  useEffect(() => {
+    if (searchVal) {
+      const params = {
+        search: {
+          ...searchVal,
+        }
+      }
+      search(params)
+    }
+  }, [searchVal])
   return (
     <div>
          <Card className='nonebox'>
             <ModalToolBar
                setSearchVal={setSearchVal}
                exportFile={exportExcel}
+               list={zfjkData}
             />
       </Card>
       
       <div className="ant-card-body" style={{ padding: "20px 0 0 0" }}>
-            <Table columns={columns} rowKey="inx" dataSource={[]} />
+            <Table columns={columns} rowKey="inx" {...tableProps} />
           </div>
     </div>
   )

src/views/rcgl/zmjk/ModalToolBar.js

@@ -4,7 +4,7 @@ import { Form, Input, Button, DatePicker } from 'antd';
 import moment from 'moment';
 import NormalSelect from '../../../components/Form/NormalSelect';
 const { RangePicker } = DatePicker;
-const ToolBar = ({ setSearchVal, exportFile }) => {
+const ToolBar = ({ setSearchVal, exportFile,list }) => {
   const optionsType = [
     {
       label: "今日",
@@ -44,7 +44,7 @@ const ToolBar = ({ setSearchVal, exportFile }) => {
       }
     }
     delete values.tm
-    setSearchVal({ ...values, dateTimeSo });
+    setSearchVal({ ...values, dateTimeRangeSo:dateTimeSo });
   }
 
   const onValuesChange = (e) => {
@@ -70,20 +70,28 @@ const ToolBar = ({ setSearchVal, exportFile }) => {
       
     }
   useEffect(() => {
-    let dateTimeSo = {
+    if (list.length > 0) { 
-      start: moment().subtract(1, "years").format('YYYY-MM-DD 00:00:00'),
+      let dateTimeSo = {
-      end: moment().format('YYYY-MM-DD 00:00:00')
+        start: moment().subtract(7, "days").format('YYYY-MM-DD 00:00:00'),
+        end: moment().format('YYYY-MM-DD 00:00:00')
+      }
+      form.setFieldValue("tm", [moment(dateTimeSo.start), moment(dateTimeSo.end)])
+      form.setFieldValue("valveCode", list[0]?.valveCode)
+      setSearchVal({dateTimeRangeSo:dateTimeSo, valveCode:list[0]?.valveCode})
     }
-    form.setFieldValue("tm", [moment(dateTimeSo.start), moment(dateTimeSo.end)])
+  }, [list])
-    setSearchVal({ dateTimeSo })
-  }, [])
 
   return (
     <>
       <div style={{ display: 'flex', justifyContent: 'space-between' }}>
         <Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish} onValuesChange={onValuesChange}>
-          <Form.Item label="闸门名称" name="maintainType">
+          <Form.Item label="闸门名称" name="valveCode">
-            <NormalSelect allowClear style={{ width: '150px' }} options={types} />
+            <NormalSelect
+              style={{ width: '150px' }}
+              options={list}
+              allowClear={false}
+              fieldNames={{label: 'valveName',value: 'valveCode'}}
+            />
           </Form.Item>
           <Form.Item label="日期范围" name="tm">
             <RangePicker

src/views/rcgl/zmjk/index.js

@@ -13,6 +13,7 @@ import './index.less';
 import { httpget, httpget2, httppost2 } from '../../../utils/request';
 import apiurl from '../../../service/apiurl';
 import ModalContent from './ModalContent';
+
 const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
 const CanvasW = 1080
 const CanvasH = 640
@@ -182,17 +183,20 @@ const Page = () => {
   const jcColumns = [
     {
       title: '项目',
-      key: 'project',
+      key: 'name',
+      dataIndex:'name',
       width: 150,
     },
     {
       title: '实时数据',
-      key: 'project',
+      key: 'realData',
+      dataIndex:'realData',
       width: 150,
     },
     {
       title: '数据采集时间',
-      key: 'project',
+      dataIndex:'tm',
+      key: 'tm',
       width: 150,
     }
   ]
@@ -200,17 +204,20 @@ const Page = () => {
   const zfColumns = [
     {
       title: '闸阀名称',
-      key: 'project',
+      key: 'valveName',
+      dataIndex:'valveName',
       width: 150,
     },
     {
       title: '当前开关状态',
-      key: 'project',
+      key: 'status',
+      dataIndex:'status',
       width: 150,
     },
     {
       title: '数据采集时间',
-      key: 'project',
+      dataIndex:'tm',
+      key: 'tm',
       width: 150,
     }
   ]
@@ -218,22 +225,26 @@ const Page = () => {
   const jlColumns = [
     {
       title: '闸阀名称',
-      key: 'project',
+      key: 'valveName',
+      dataIndex:'valveName',
       width: 150,
     },
     {
       title: '操作内容',
-      key: 'project',
+      dataIndex:'opContent',
+      key: 'opContent',
       width: 150,
     },
     {
       title: '操作结果',
-      key: 'project',
+      dataIndex:'status',
+      key: 'status',
       width: 150,
     },
     {
       title: '操作时间',
-      key: 'project',
+      dataIndex:'tm',
+      key: 'tm',
       width: 150,
     }
   ]
@@ -252,9 +263,9 @@ const Page = () => {
   const pts = contextCoordinates(xunit, hole);
   const eqpnoList = useMemo(() => damList ? new Array(damList.length).fill(0).map((o, index) => index) : [], [damList]);
 
-  useEffect(() => {
+  // useEffect(() => {
-    getList()
+  //   getList()
-  }, [])
+  // }, [])
 
   const getList = async () => {
     const { code, data } = await httppost2(apiurl.zmjk.getList)
@@ -262,8 +273,8 @@ const Page = () => {
       return
     }
     const obj = data[0] || {}
-    getInformation(obj.gateCode)
+    // getInformation(obj.gateCode)
-    getDamData(obj.stcd)
+    // getDamData(obj.stcd)
     getVideo(obj.gateCode)
     setData(obj)
   }
@@ -320,6 +331,95 @@ const Page = () => {
     return num
   }
 
+
+// 闸阀监控列表数据
+  const [zfjkData, setzfjkData] = useState([])
+  const getZfjkData = async () => {
+    try {
+      const res = await httppost2(apiurl.gsxl.zfzl.list)
+      if (res.code == 200) { 
+        setzfjkData(res.data)
+      }
+    } catch (error) {
+      console.log(error);
+      
+    }
+  }
+
+  // 闸阀历史操作
+  const [zfjkHistoryListData, setzfjkHistoryListData] = useState([])
+  const getZfjkHistoryData = async () => {
+    try {
+      const res = await httppost2(apiurl.gsxl.zfzl.historyList)
+      if (res.code == 200) { 
+        setzfjkHistoryListData(res.data)
+      }
+    } catch (error) {
+      console.log(error);
+      
+    }
+  }
+  const swList = [
+    {
+      name: "库水位（m）",
+      realData:'',
+      tm:''
+    },
+    {
+      name: "今日雨量（mm）",
+      realData:'',
+      tm:''
+    },
+    {
+      name: "灌溉发电流量（m³/s）",
+      realData:'',
+      tm:''
+  }
+]
+    // 闸阀历史操作
+  const [zfjkSwData, setzfjkSwData] = useState([])
+    const getZfjkSwData = async () => {
+      try {
+        const res = await httppost2(apiurl.gsxl.zfzl.swInfo)
+        if (res.code == 200) { 
+          const {
+            rz,
+            todayRainNum,
+            outPowerNum,
+            todayRainNumTm,
+            outPowerNumTm,
+            tm
+          } = res.data;
+          const newArr = swList.map(item => {
+            if (item.name == '库水位（m）') {
+              item.realData = rz;
+              item.tm = tm;
+            } else if (item.name == '今日雨量（mm）') {
+              item.realData = todayRainNum;
+              item.tm = todayRainNumTm;
+            } else {
+              item.realData = outPowerNum;
+              item.tm = outPowerNumTm;
+            }
+            return item;
+          })
+          setzfjkSwData(newArr)
+        }
+      } catch (error) {
+        console.log(error);
+        
+      }
+    }
+ 
+
+
+  useEffect(() => {
+    getZfjkData()
+    getZfjkHistoryData()
+    getZfjkSwData()
+  }, [])
+  
+
   return (
     <>
       <div className='content-root clearFloat xybm sg_zmjk' style={{ paddingRight: "0", paddingBottom: "0" }}>
@@ -335,12 +435,12 @@ const Page = () => {
               <div className='sz_left_up_table'>
                 <Table
                   columns={zfColumns}
-                  rowKey={(record) => record.id}
+                  rowKey={(record) => record.tm}
-                  dataSource={[]}
+                  dataSource={zfjkData}
                   pagination={false}
                 />
               </div>
-              <div className='sg_zmjk_left_title' style={{ marginTop: 175,display:'flex',justifyContent:'space-between' }}>
+              <div className='sg_zmjk_left_title' style={{ marginTop: 150,display:'flex',justifyContent:'space-between' }}>
                 <div><Divider type="vertical" style={{ width: 5, background: '#259def', height: 20 }} />
                 最近操作记录</div>
                 <div onClick={() => setOpen(true)}>
@@ -353,8 +453,8 @@ const Page = () => {
               <div className='sz_left_up_table'>
                 <Table
                   columns={jlColumns}
-                  rowKey={(record) => record.id}
+                  rowKey={(record) => record.tm}
-                  dataSource={[]}
+                  dataSource={zfjkHistoryListData}
                   pagination={false}
                 />
               </div>
@@ -439,8 +539,8 @@ const Page = () => {
                 <div style={{ width: '100%', marginTop: 10 }}>
                   <Table
                     columns={jcColumns}
-                    rowKey={(record) => record.id}
+                    rowKey={(record) => record.tm}
-                    dataSource={[]}
+                    dataSource={zfjkSwData}
                     pagination={false}
                   />
                   {/* {
@@ -484,12 +584,13 @@ const Page = () => {
         width={1100}
         title="闸门操作记录"
         footer={null}
+        destroyOnClose
         onCancel={() => {
           setOpen(false)
         }}
       >
         <div style={{ height: '600px' }}>
-          <ModalContent/>
+          <ModalContent zfjkData={zfjkData} />
           {/* <Tabs>
             <Tabs.TabPane tab="基本信息" key="item-1">
               <Descriptions bordered size="small" column={3} >