feat(): 测点信息管理以及断面信息管理开发

src/components/DashboardLayout/TopMenu.tsx

@@ -34,7 +34,7 @@ const TopMenu: React.FC<{
   menu: MenuItem[];
   menuIndexes: string[];
 }> = ({menu, menuIndexes}) => {
-  console.log(menu);
+  console.log('12333333',menu);
   console.log(menuIndexes);
   const dispatch = useDispatch();
 

src/models/auth/index.ts

@@ -34,7 +34,6 @@ export const auth = createModel<RootModel>()({
   effects: {
     async regByToken(token: string): Promise<boolean> {
       const result = await regByToken(token);
-
       if (result) {
         this.setUser(result);
         return true;

src/service/apiurl.js

@@ -78,6 +78,24 @@ const apiurl = {
       wyedit: service_ykz + '/osmoticShiftR/update',
       wydelete: service_ykz + '/osmoticShiftR/del',
       wyexport:service_ykz + '/osmoticShiftR/export'
+    },
+    cdgl: {
+      page: service_ykz + '/osmoticStationInfo/page',
+      save: service_ykz + '/osmoticStationInfo/insert',
+      edit: service_ykz + '/osmoticStationInfo/update',
+      delete: service_ykz + '/osmoticStationInfo/del',
+    },
+    dmgl: {
+      page: service_ykz + '/attDamProfile/page',
+      save: service_ykz + '/attDamProfile/insert',
+      edit: service_ykz + '/attDamProfile/update',
+      delete: service_ykz + '/attDamProfile/del',
+      list:service_ykz + '/attDamProfile/list'
+    },
+    gl: {
+      page: service_ykz + '/osmoticProfileRel/page',
+      save: service_ykz + '/osmoticProfileRel/insert',
+      delete: service_ykz + '/osmoticProfileRel/del',
     }
   },
   sbwh: {

src/views/AppRouters.tsx

@@ -31,6 +31,8 @@ import Yjgzpz from './SafeWatch/WarnRuleConfig'
 import Xjrw from "./Gcyx/xcxj/xjrw"
 import Xjwtcl from "./Gcyx/xcxj/xjwtcl"
 import Xjxpz from "./Gcyx/xcxj/xjxpz"
+import Dmgl from "./SafeWatch/Dmgl"
+import Cdgx from "./SafeWatch/cdgx"
 import TestLine from './TestLine'
 // const HomePage = lazy(() => import('./Home'))
 
@@ -62,6 +64,8 @@ const AppRouters: React.FC = () => {
         { path: 'aqjc/sljc', element: <Sljc /> },
         { path: 'aqjc/yjjl', element: <Yjjl /> },
         { path: 'aqjc/yjgzpz', element: <Yjgzpz /> },
+        { path: 'aqjc/dmgl', element: <Dmgl /> },
+        { path: 'aqjc/dmcdglgl', element: <Cdgx /> },
         // 设备维护
         { path: 'sbwh/wxyhgl/wxfabz', element: <Whfabz /> },
         { path: 'sbwh/wxyhgl/ssgcjl', element: <Ssgcjl /> },

src/views/Home/index.js

@@ -9,11 +9,13 @@ import './index.less'
 import ReactEcharts from 'echarts-for-react';
 import options from './options'
 import clsx from 'clsx';
-import { Select } from 'antd';
+import { Empty } from 'antd';
 import { httpget2, httppost2 } from '../../utils/request';
 import apiurl from '../../service/apiurl';
+import { useDispatch, useSelector } from 'react-redux';
 import HFivePlayer from '../../components/video1Plary';
 import moment from 'moment';
+import {loadMenu,loadRole} from '../../models/auth/_'
 const MenuTitleCard = ({ key, title }) => {
   return (
     <div className='menuItem_style' key={key} title={title}>
@@ -22,33 +24,14 @@ const MenuTitleCard = ({ key, title }) => {
   )
 }
 export default function Home() {
-  const title = [
+  const menu = useSelector((state) => state.auth.menu);
-    {
+  const [title, setTitle] = useState([])
-      title: '首页',
+  // const title = menu.map(item => ({ title: item.menuName, key: item.path || item.redirect }))
-      key: '/home',
+  const jcdType = {
-    },
+    0: "闸后流量",
-    {
+    2: '闸前水位',
-      title: '监测数据',
+    3:'闸后水位'
-      key: '/mgr/jcsj/jcsj',
+  }
-    }, {
-      title: '安全监测',
-      key: '/mgr/aqjc',
-    },
-    {
-      title: '系统管理',
-      key: '/mgr/xtgl/yhxx',
-    },
-    {
-      title: '工程运行',
-      key: '/mgr/gcyx/xxcx/jbqk',
-    },
-    {
-      title: '设备维护',
-      key: '/mgr/sbwh/wxyhgl/wxfabz',
-    },
-
-  ]
-
   const types1 = {
     0: "闸后流量(m³/s)",
     1: '闸前水位(m)',
@@ -159,6 +142,30 @@ export default function Home() {
 
   //报警信息
   const [policeData, setPoliceData] = useState(Array(5).fill(0).map((item, i) => ({ id: i, zd: '闸前水位', watchvalue: "10.23", limit: 0, max: 10, time: '2024-08-15 15:00:00' })))
+  const getPoliceData = async (val) => {
+    const start  = moment().subtract(7,'days').format('YYYY-MM-DD 00:00:00')
+    const end = moment().format('YYYY-MM-DD 23:59:59')
+    let params = {
+      pageSo: {
+        pageSize: 999,
+        pageNumber:1
+        },
+        dateTimeRangeSo:{
+          start,
+          end
+        }
+      }
+      try {
+        const res = await httppost2(apiurl.jcsj.bjgl.bjjl.page,params)
+        if (res.code == 200) {
+          setPoliceData(res.data.records)
+        }
+      } catch (error) {
+        console.log(error);
+      }
+    }
+  
+  
   const navigate = useNavigate();
   const jumpMenu = (item) => {
     navigate(item.key)
@@ -199,6 +206,17 @@ export default function Home() {
     setIndex(idx)
     getVideoSrc(videoList[idx].indexCode)
   }
+
+
+  // 获取菜单
+  const getMenu = async () => {
+    try {
+      const data = await loadMenu();
+      setTitle(data.map(item => ({ title: item.menuName, key: item.path || item.redirect })))
+    } catch (error) {
+      console.log(error);
+    }
+  }
   const [activeOne, setActiveOne] = useState(0)
   useEffect(() => {
     autofit.init({
@@ -210,6 +228,8 @@ export default function Home() {
     getVideoList()
     getRealData()
     getLogData()
+    getPoliceData()
+    getMenu()
   }, [])
 
   return (
@@ -248,11 +268,14 @@ export default function Home() {
               </div>
             ))}
             <div className='run_chart'>
+              {historyList.length > 0 ?
                 <ReactEcharts
                   option={pxOptions || {}}
                   style={{ width: "100%", height: '100%' }}
                   notMerge={true}
                 />
+                :<Empty style={{marginTop:20}}/>
+              }
             </div>
           </div>
         </div>
@@ -271,14 +294,15 @@ export default function Home() {
                   </tr>
                 </thead>
                 <tbody style={{ overflowY: safeData.length > 4 ? 'scroll' : 'hidden' }}>
-                  {safeData.map((item, i) => (
+                  {safeData.length >0 ? safeData.map((item, i) => (
                     <tr style={{ borderBottom: '2px solid #536cc6', textAlign: 'center' }} className={clsx({ 'odd_row': i % 2 })} key={i}>
                       <td>{item.cd}</td>
                       <td>{item.dm}</td>
                       <td>{item.kpa}</td>
                       <td style={{ width: 137 }}>{item.time}</td>
                     </tr>
-                  ))}
+                  )):<Empty  />
+                }
                 </tbody>
 
               </table>
@@ -300,15 +324,16 @@ export default function Home() {
                   <th style={{ width: 137 }}>操作时间</th>
                 </tr>
               </thead>
-              <tbody style={{ height: 170 }}>
+              <tbody style={{ height: 170,overflow: operateData.length > 6 ? 'scroll' : 'hidden'  }}>
-                {operateData.map((item, i) => (
+                {operateData.length > 0 ?operateData.map((item, i) => (
                   <tr style={{ borderBottom: '2px solid #536cc6', textAlign: 'center' }} className={clsx({ 'odd_row': i % 2 })} key={i}>
                     <td>{item.gatePoreCode}</td>
                     <td>{item.opContent}</td>
                     <td>{item.createUserName}</td>
                     <td style={{ width: 137 }}>{item.createTime}</td>
                   </tr>
-                ))}
+                )):<Empty  />
+              }
               </tbody>
 
             </table>
@@ -329,15 +354,16 @@ export default function Home() {
                 </tr>
               </thead>
               <tbody style={{ height: 170, overflow: policeData.length > 6 ? 'scroll' : 'hidden' }} >
-                {policeData.map((item, i) => (
+                {policeData.length > 0 ? policeData.map((item, i) => (
                   <tr style={{ borderBottom: '2px solid #536cc6', textAlign: 'center' }} className={clsx({ 'odd_row': i % 2 })} key={i}>
-                    <td style={{ width: 58 }}>{item.zd}</td>
+                    <td style={{ width: 58 }}>{jcdType[item.type]}</td>
-                    <td>{item.watchvalue}</td>
+                    <td>{item.val}</td>
-                    <td style={{ width: 58 }}>{item.limit}</td>
+                    <td style={{ width: 58 }}>{item.lowerLimit}</td>
-                    <td style={{ width: 58 }}>{item.max}</td>
+                    <td style={{ width: 58 }}>{item.upperLimit}</td>
-                    <td style={{ width: 129 }}>{item.time}</td>
+                    <td style={{ width: 129 }}>{item.warnTime}</td>
                   </tr>
-                ))}
+                )):<Empty  />
+                }
               </tbody>
 
             </table>

src/views/Home/index.less

@@ -56,7 +56,7 @@
             position: absolute;
             top:30px;
             left:500px;
-        }.styles3{
+        }.styles5{
             position: absolute;
             top:30px;
             right:100px;
@@ -64,7 +64,7 @@
             position: absolute;
             top:30px;
             right:300px;
-        }.styles5{
+        }.styles3{
             position: absolute;
             top:30px;
             right:500px;
@@ -120,6 +120,9 @@
                 color: #95f204;
             }
             .run_chart{
+                display: flex;
+                justify-content: center;
+                align-items: center;
                 width: 100%;
                 height: 200px;
             }

src/views/SafeWatch/Dmgl/form.js

@@ -0,0 +1,78 @@
+import React,{useEffect,useState,useMemo,useRef} from 'react';
+import { Form, Button, Input, Row,Upload, Col, Table, DatePicker, InputNumber,message,Image,Modal,Typography ,Popconfirm } from 'antd';
+import { formItemLayout, btnItemLayout } from '../../../components/crud/FormLayoutProps';
+import apiurl from '../../../service/apiurl';
+import NormalSelect from '../../../components/Form/NormalSelect';
+import moment from 'moment';
+
+const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => {
+  const types = [
+    {
+      label: "位移",
+      value: 0,
+    }, 
+    {
+      label: "结构缝",
+      value: 1,
+    }, 
+    {
+      label: "渗压",
+      value: 2,
+    }, 
+  ]
+  const [form] = Form.useForm();
+  const onfinish = (values) => {
+    if (mode === 'edit') {
+      onEdit(apiurl.aqjc.dmgl.edit,{...record,...values})
+    }
+    if (mode === 'save') {
+      onSave(apiurl.aqjc.dmgl.save,values)
+    }
+  }
+ 
+  return (
+    <>
+      <Form
+        form={form}
+        {...formItemLayout}
+        onFinish={onfinish}
+        initialValues={record}
+      >
+      <Row>
+          <Col span={24}>
+              <Form.Item
+                label="断面名称"
+                name="profileName"
+                rules={[{ required: true }]}
+              >
+                 <Input disabled={mode==='view'} style={{width:'100%'}} allowClear />
+              </Form.Item>
+          </Col>
+          <Col span={24}>
+              <Form.Item
+                label="备注"
+                name="remark"
+              >
+                <Input.TextArea disabled={mode==='view'} style={{width:'100%'}} allowClear />
+              </Form.Item>
+          </Col>
+        
+      </Row>
+        {
+        mode==='view'?null:(
+          <>
+          <Form.Item {...btnItemLayout}>
+            <Button type="primary" htmlType="submit">
+              {mode === 'save' ? '提交' : '修改'}
+            </Button>
+          </Form.Item>
+          </>
+        )
+      }
+      </Form>
+   
+    </>
+  );
+}
+
+export default ModalForm;

src/views/SafeWatch/Dmgl/index.js

@@ -0,0 +1,100 @@
+import React, { Fragment, useRef, useMemo,useEffect,useState } from 'react';
+import BasicCrudModal from '../../../components/crud/BasicCrudModal';
+import { Table, Card, Modal, Form, Input, Button, Row,Col, Timeline, message, Tabs,Image } from 'antd';
+import ToolBar from './toolbar';
+import ModalForm from './form';
+import apiurl from '../../../service/apiurl';
+import usePageTable from '../../../components/crud/usePageTable2';
+import { createCrudService } from '../../../components/crud/_';
+import {CrudOpRender_text} from '../../../components/crud/CrudOpRender';
+import { httppost2 } from '../../../utils/request';
+
+const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
+const Page = () => {
+  const types = {
+    0: "位移",
+    1: '结构缝',
+    2: "渗压",
+  }
+  const refModal = useRef();
+  const [searchVal, setSearchVal] = useState(false)
+  const columns = [
+    { title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align:"center" },
+    {
+      title: '断面名称', key: 'profileName', dataIndex: 'profileName', width: 150,
+    },
+    { title: '备注', key: 'remark', dataIndex: 'remark', width: 150},
+
+    {
+      title: '操作', key: 'operation', width: 200, fixed: 'right',align: 'center',
+      render: (value, row, index) => (
+        <CrudOpRender_text
+        edit={ true }
+        del={ true }
+        command={(cmd) => () => command(cmd)(row)} />)
+    },
+  ];
+
+  
+  const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
+  const command = (type) => (params) => {
+    if (type === 'save') {
+      refModal.current.showSave();
+    } else if (type === 'edit') {
+      refModal.current.showEdit({ ...params });
+    } else if (type === 'view') {
+      refModal.current.showView(params);
+    } else if (type === 'del') {
+      refModal.current.onDeleteGet(apiurl.aqjc.dmgl.delete + `/${params.id}`);
+    }
+  }
+  
+ 
+
+  const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.aqjc.dmgl.page).find_noCode);
+
+ /**
+   * @description 处理成功的回调
+   */
+ const successCallback = () => {
+  refresh()
+}  
+
+  useEffect(()=>{
+    const params = {
+      search: {
+        ...searchVal,
+      }
+    };
+    search(params)
+  }, [searchVal])
+  
+  
+  return (
+    <>
+      <div className='content-root clearFloat xybm' style={{paddingBottom:"0"}}>
+        <div className='lf CrudAdcdTreeTableBox' style={{width:"100%",overflowY:"auto"}}>
+          <Card className='nonebox'>
+            <ToolBar
+              setSearchVal={setSearchVal}
+              onSave={command('save')}
+            />
+          </Card>
+          <div className="ant-card-body" style={{ padding: "20px 0 0 0" }}>
+          <Table columns={columns} rowKey="inx" {...tableProps} scroll={{ x: width , y: "calc( 100vh - 400px )"}}/>
+          </div>
+        </div>
+
+        <BasicCrudModal
+          width={800}
+          ref={refModal}
+          title="断面管理"
+          component={ModalForm}
+          onCrudSuccess={successCallback}
+        />
+      </div>
+    </>
+  );
+}
+
+export default Page;

src/views/SafeWatch/Dmgl/toolbar.js

@@ -0,0 +1,60 @@
+import React, { useEffect,useState } from 'react';
+import { Form, Input, Button, DatePicker } from 'antd';
+import NormalSelect from '../../../components/Form/NormalSelect';
+
+import moment from 'moment';
+const { RangePicker } = DatePicker;
+const ToolBar = ({ setSearchVal, onSave, storeData, role }) => {
+  
+  const types = [
+    {
+      label: "位移",
+      value: 0,
+    }, 
+    {
+      label: "结构缝",
+      value: 1,
+    }, 
+    {
+      label: "渗压",
+      value: 2,
+    }, 
+  ]
+  const [form] = Form.useForm();
+
+  const onFinish = (values) => {
+    setSearchVal({...values});
+  }
+
+
+  return (
+    <>
+      <div style={{display:'flex',justifyContent:'space-between'}}>
+        <Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
+          {/* <Form.Item label="测点" name="stationCode">
+           <Input allowClear style={{ width: '150px' }}/>
+          </Form.Item>
+          <Form.Item label="类型" name="type">
+           <NormalSelect allowClear style={{ width: '150px' }} options={types} />
+          </Form.Item> */}
+           <Form.Item>
+            <Button type="primary" htmlType="submit">查询</Button>
+          </Form.Item>
+{/*           
+          <Form.Item>
+            <Button onClick={() => form.resetFields()}>重置</Button>
+          </Form.Item> */}
+          {
+            (onSave) ?
+              <Form.Item>
+                <Button onClick={onSave}>新增</Button>
+              </Form.Item>
+            :null
+          }
+        </Form>
+      </div>
+    </>
+  );
+}
+
+export default ToolBar;

src/views/SafeWatch/WarnRuleConfig/form.js

@@ -4,37 +4,29 @@ import { formItemLayout, btnItemLayout } from '../../../components/crud/FormLayo
 import apiurl from '../../../service/apiurl';
 import NormalSelect from '../../../components/Form/NormalSelect';
 import moment from 'moment';
-const { RangePicker } = DatePicker
-const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
 
 const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => {
   const types = [
     {
-      label: "闸后流量",
+      label: "位移",
       value: 0,
     }, 
     {
-      label: "雨量",
+      label: "结构缝",
       value: 1,
     }, 
     {
-      label: "闸前水位",
+      label: "渗压",
       value: 2,
     }, 
-    {
-      label: "闸后水位",
-      value: 3,
-    },
-    
   ]
   const [form] = Form.useForm();
   const onfinish = (values) => {
-    values.eventsDate = values.eventsDate?moment(values.eventsDate).format("YYYY-MM-DD 00:00:00"):''
     if (mode === 'edit') {
-      onEdit(apiurl.jcsj.bjgl.bjgzpz.edit,{...record,...values})
+      onEdit(apiurl.aqjc.cdgl.edit,{...record,...values})
     }
     if (mode === 'save') {
-      onSave(apiurl.jcsj.bjgl.bjgzpz.save,values)
+      onSave(apiurl.aqjc.cdgl.save,values)
     }
   }
  
@@ -49,42 +41,23 @@ const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => {
       <Row>
           <Col span={12}>
               <Form.Item
-                label="监测项目"
+                label="监测点"
-                name="type"
+                name="stationCode"
                 rules={[{ required: true }]}
-              >
-                <NormalSelect allowClear style={{ width: '100%' }} options={types} />
-              </Form.Item>
-          </Col>
-          <Col span={12}>
-              <Form.Item
-                label="阈值下限"
-                name="upperLimit"
-                rules={[{ required: true }]}
-              >
-                <InputNumber disabled={mode==='view'} style={{width:'100%'}} allowClear />
-              </Form.Item>
-          </Col>
-        
-      </Row>
-      <Row>
-          <Col span={12}>
-              <Form.Item
-                label="阈值上限"
-                name="lowerLimit"
-                rules={[{ required: true }]}
-              >
-                <InputNumber disabled={mode==='view'} style={{width:'100%'}} allowClear />
-              </Form.Item>
-          </Col>
-          <Col span={12}>
-              <Form.Item
-                label="备注"
-                name="remark"
               >
                  <Input disabled={mode==='view'} style={{width:'100%'}} allowClear />
               </Form.Item>
           </Col>
+          <Col span={12}>
+              <Form.Item
+                label="类型"
+                name="type"
+                rules={[{ required: true }]}
+              >
+                <NormalSelect disabled={mode==='view'} style={{width:'100%'}} allowClear options={types} />
+              </Form.Item>
+          </Col>
+        
       </Row>
         {
         mode==='view'?null:(

src/views/SafeWatch/WarnRuleConfig/index.js

@@ -12,57 +12,32 @@ import { httppost2 } from '../../../utils/request';
 const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
 const Page = () => {
   const types = {
-    0: "闸后流量",
+    0: "位移",
-    1: '雨量',
+    1: '结构缝',
-    2: "闸前水位",
+    2: "渗压",
-    3:'闸后水位'
   }
   const refModal = useRef();
   const [searchVal, setSearchVal] = useState(false)
   const columns = [
     { title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align:"center" },
-  
+    { title: '测点', key: 'stationCode', dataIndex: 'stationCode', width: 150},
     {
-      title: '监测点', key: 'type', dataIndex: 'type', width: 150,
+      title: '类型', key: 'type', dataIndex: 'type', width: 150,
       render: (v) => <span>{types[v]}</span>
      },
-    { title: '阈值下限', key: 'upperLimit', dataIndex: 'upperLimit', width: 150},
+
-    { title: '阈值上限', key: 'lowerLimit	', dataIndex: 'lowerLimit', width: 150},
-    {
-      title: '是否启用', key: 'status', dataIndex: 'status', width: 150,
-      render: (v) => <span>{ v == 1 ? '否': v==0?'是':''}</span>
-    },
-    {
-      title: '配置时间', key: 'createTime', dataIndex: 'createTime', width: 150,
-    },
-    {
-      title: '最近报警时间', key: 'eventsDate', dataIndex: 'eventsDate', width: 140,
-    },
     {
       title: '操作', key: 'operation', width: 200, fixed: 'right',align: 'center',
       render: (value, row, index) => (
         <CrudOpRender_text
         edit={ true }
         del={ true }
-        status={{status:row.status,bol:true}}
         command={(cmd) => () => command(cmd)(row)} />)
     },
   ];
 
   
   const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
-
-  const stopStatus = async (params) => {
-    try {
-      const res = await httppost2(apiurl.jcsj.bjgl.bjgzpz.stop, params)
-      if (res.code == 200) {
-        message.success(`${params.status ? '停用':'启用'}成功`)
-        refresh()
-      }
-    } catch (error) {
-      console.log(error);
-    }
-  }
   const command = (type) => (params) => {
     if (type === 'save') {
       refModal.current.showSave();
@@ -71,15 +46,13 @@ const Page = () => {
     } else if (type === 'view') {
       refModal.current.showView(params);
     } else if (type === 'del') {
-      refModal.current.onDeleteGet(apiurl.jcsj.bjgl.bjgzpz.delete + `/${params.id}`);
+      refModal.current.onDeleteGet(apiurl.aqjc.cdgl.delete + `/${params.id}`);
-    } else if (type == 'status') {
-      stopStatus({ id: params.id, status: params.status == 1 ? 0 : params.status == 0 ? 1 : ''})
     }
   }
   
  
 
-  const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.jcsj.bjgl.bjgzpz.page).find_noCode);
+  const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.aqjc.cdgl.page).find_noCode);
 
  /**
    * @description 处理成功的回调
@@ -116,7 +89,7 @@ const Page = () => {
         <BasicCrudModal
           width={1000}
           ref={refModal}
-          title="报警规则"
+          title="测点管理"
           component={ModalForm}
           onCrudSuccess={successCallback}
         />

src/views/SafeWatch/WarnRuleConfig/toolbar.js

@@ -8,21 +8,17 @@ const ToolBar = ({ setSearchVal, onSave, storeData, role }) => {
   
   const types = [
     {
-      label: "闸后流量",
+      label: "位移",
       value: 0,
     }, 
     {
-      label: "雨量",
+      label: "结构缝",
       value: 1,
     }, 
     {
-      label: "闸前水位",
+      label: "渗压",
       value: 2,
     }, 
-    {
-      label: "闸后水位",
-      value: 3,
-    },
   ]
   const [form] = Form.useForm();
 
@@ -35,7 +31,10 @@ const ToolBar = ({ setSearchVal, onSave, storeData, role }) => {
     <>
       <div style={{display:'flex',justifyContent:'space-between'}}>
         <Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
-          <Form.Item label="监测点" name="type">
+          <Form.Item label="测点" name="stationCode">
+           <Input allowClear style={{ width: '150px' }}/>
+          </Form.Item>
+          <Form.Item label="类型" name="type">
            <NormalSelect allowClear style={{ width: '150px' }} options={types} />
           </Form.Item>
            <Form.Item>

src/views/SafeWatch/cdgx/form.js

@@ -0,0 +1,81 @@
+import React,{useEffect,useState,useMemo,useRef} from 'react';
+import { Form, Button, Input, Row,Upload, Col, Table, DatePicker, InputNumber,message,Image,Modal,Typography ,Popconfirm } from 'antd';
+import { formItemLayout, btnItemLayout } from '../../../components/crud/FormLayoutProps';
+import apiurl from '../../../service/apiurl';
+import NormalSelect from '../../../components/Form/NormalSelect';
+import moment from 'moment';
+import { httppost2 } from '../../../utils/request';
+const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => {
+  const [form] = Form.useForm();
+  const onfinish = (values) => {
+    if (mode === 'edit') {
+      onEdit(apiurl.aqjc.dmgl.edit,{...record,...values})
+    }
+    if (mode === 'save') {
+      onSave(apiurl.aqjc.dmgl.save,values)
+    }
+  }
+
+  const [dmList, setDmList] = useState([])
+  const getDmList = async () => {
+    try {
+      const res = await httppost2(apiurl.aqjc.dmgl.list)
+      if (res.code == 200) {
+        setDmList(res.data.map(item => ({label: item.profileName,value: item.id})))
+      }
+    } catch (error) {
+      console.log(error);
+    }
+  }
+
+
+ useEffect(() => {
+  getDmList()
+ }, [])
+ 
+  return (
+    <>
+      <Form
+        form={form}
+        {...formItemLayout}
+        onFinish={onfinish}
+        initialValues={record}
+      >
+      <Row>
+          <Col span={24}>
+              <Form.Item
+                label="断面名称"
+                name="profileId"
+                rules={[{ required: true }]}
+              >
+              <NormalSelect disabled={mode === 'view'} style={{ width: '100%' }} allowClear options={dmList} />
+              </Form.Item>
+          </Col>
+          <Col span={24}>
+              <Form.Item
+                label="测点名称"
+                name="stationCode"
+              >
+                <Input disabled={mode==='view'} style={{width:'100%'}} allowClear />
+              </Form.Item>
+          </Col>
+        
+      </Row>
+        {
+        mode==='view'?null:(
+          <>
+          <Form.Item {...btnItemLayout}>
+            <Button type="primary" htmlType="submit">
+              {mode === 'save' ? '提交' : '修改'}
+            </Button>
+          </Form.Item>
+          </>
+        )
+      }
+      </Form>
+   
+    </>
+  );
+}
+
+export default ModalForm;

src/views/SafeWatch/cdgx/index.js

@@ -0,0 +1,100 @@
+import React, { Fragment, useRef, useMemo,useEffect,useState } from 'react';
+import BasicCrudModal from '../../../components/crud/BasicCrudModal';
+import { Table, Card, Modal, Form, Input, Button, Row,Col, Timeline, message, Tabs,Image } from 'antd';
+import ToolBar from './toolbar';
+import ModalForm from './form';
+import apiurl from '../../../service/apiurl';
+import usePageTable from '../../../components/crud/usePageTable2';
+import { createCrudService } from '../../../components/crud/_';
+import {CrudOpRender_text} from '../../../components/crud/CrudOpRender';
+import { httppost2 } from '../../../utils/request';
+
+const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
+const Page = () => {
+  const types = {
+    0: "位移",
+    1: '结构缝',
+    2: "渗压",
+  }
+  const refModal = useRef();
+  const [searchVal, setSearchVal] = useState(false)
+  const columns = [
+    { title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align:"center" },
+    {
+      title: '断面名称', key: 'profileName', dataIndex: 'profileName', width: 150,
+    },
+    { title: '测点', key: 'stationCode', dataIndex: 'stationCode', width: 150},
+
+    {
+      title: '操作', key: 'operation', width: 200, fixed: 'right',align: 'center',
+      render: (value, row, index) => (
+        <CrudOpRender_text
+        edit={ true }
+        del={ true }
+        command={(cmd) => () => command(cmd)(row)} />)
+    },
+  ];
+
+  
+  const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
+  const command = (type) => (params) => {
+    if (type === 'save') {
+      refModal.current.showSave();
+    } else if (type === 'edit') {
+      // refModal.current.showEdit({ ...params });
+    } else if (type === 'view') {
+      refModal.current.showView(params);
+    } else if (type === 'del') {
+      refModal.current.onDeleteGet(apiurl.aqjc.gl.delete + `/${params.id}`);
+    }
+  }
+  
+ 
+
+  const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.aqjc.gl.page).find_noCode);
+
+ /**
+   * @description 处理成功的回调
+   */
+ const successCallback = () => {
+  refresh()
+}  
+
+  useEffect(()=>{
+    const params = {
+      search: {
+        ...searchVal,
+      }
+    };
+    search(params)
+  }, [searchVal])
+  
+  
+  return (
+    <>
+      <div className='content-root clearFloat xybm' style={{paddingBottom:"0"}}>
+        <div className='lf CrudAdcdTreeTableBox' style={{width:"100%",overflowY:"auto"}}>
+          <Card className='nonebox'>
+            <ToolBar
+              setSearchVal={setSearchVal}
+              onSave={command('save')}
+            />
+          </Card>
+          <div className="ant-card-body" style={{ padding: "20px 0 0 0" }}>
+          <Table columns={columns} rowKey="inx" {...tableProps} scroll={{ x: width , y: "calc( 100vh - 400px )"}}/>
+          </div>
+        </div>
+
+        <BasicCrudModal
+          width={800}
+          ref={refModal}
+          title="断面管理"
+          component={ModalForm}
+          onCrudSuccess={successCallback}
+        />
+      </div>
+    </>
+  );
+}
+
+export default Page;

src/views/SafeWatch/cdgx/toolbar.js

@@ -0,0 +1,61 @@
+import React, { useEffect,useState } from 'react';
+import { Form, Input, Button, DatePicker } from 'antd';
+import NormalSelect from '../../../components/Form/NormalSelect';
+import { httppost2 } from '../../../utils/request';
+import moment from 'moment';
+import apiurl from '../../../service/apiurl';
+const { RangePicker } = DatePicker;
+const ToolBar = ({ setSearchVal, onSave, storeData, role }) => {
+ const [dmList, setDmList] = useState([])
+  const [form] = Form.useForm();
+  
+  const getDmList = async () => {
+    try {
+      const res = await httppost2(apiurl.aqjc.dmgl.list)
+      if (res.code == 200) {
+        setDmList(res.data.map(item => ({label: item.profileName,value: item.id})))
+      }
+    } catch (error) {
+      console.log(error);
+    }
+  }
+  const onFinish = (values) => {
+    setSearchVal({...values});
+  }
+
+ useEffect(() => {
+  getDmList()
+ }, [])
+ 
+  return (
+    <>
+      <div style={{display:'flex',justifyContent:'space-between'}}>
+        <Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
+        <Form.Item label="断面" name="profileId">
+           <NormalSelect allowClear style={{ width: '150px' }} options={dmList} />
+          </Form.Item>
+          <Form.Item label="测点" name="stationCode">
+           <Input allowClear style={{ width: '150px' }}/>
+          </Form.Item>
+        
+           <Form.Item>
+            <Button type="primary" htmlType="submit">查询</Button>
+          </Form.Item>
+          
+          <Form.Item>
+            <Button onClick={() => form.resetFields()}>重置</Button>
+          </Form.Item>
+          {
+            (onSave) ?
+              <Form.Item>
+                <Button onClick={onSave}>新增</Button>
+              </Form.Item>
+            :null
+          }
+        </Form>
+      </div>
+    </>
+  );
+}
+
+export default ToolBar;