(*) 泵站控制增加权限

web/client/src/sections/bigScreen/components/electrity/realTimeStatus.js

@@ -1,11 +1,14 @@
 import React, { useState, useEffect } from 'react';
 import { connect } from 'react-redux';
-import { Select, Modal, Switch } from 'antd';
+import { Select, Modal, Switch, Input, Button, Form, message } from 'antd';
 
 const RealTimeStatus = (props) => {
    const { dispatch, actions, user, pumpId, pumpList, setPumpId, pumpOne, strucId, siteList, setPumpOne } = props;
    const { bigScreen } = actions;
 
+   const [pwOpen, setPwOpen] = useState(false);
+   const [form] = Form.useForm();
+
    const [isModalOpen, setIsModalOpen] = useState(false);
    const [pumpName, setPumpName] = useState('');
    const [checked, setChecked] = useState({
@@ -19,7 +22,6 @@ const RealTimeStatus = (props) => {
    }, [pumpList])
 
    useEffect(() => {
-      console.log(pumpOne, 'pumpOne')
       if (pumpOne?.data.length) {
          setChecked({
             '模式切换': pumpOne.data[0].cMotor_AUTO,
@@ -30,13 +32,26 @@ const RealTimeStatus = (props) => {
    }, [pumpOne])
 
    const showModal = () => {
-      setIsModalOpen(true);
+      setPwOpen(true);
    };
 
    const handleCancel = () => {
       setIsModalOpen(false);
    };
 
+   const handlePwCancel = () => {
+      setPwOpen(false);
+      form.resetFields();
+   };
+   const handlePwFinish = (values) => {
+      if (values.password !== 'pc123456a') {
+         message.warning('密码错误');
+         return;
+      }
+      handlePwCancel();
+      setIsModalOpen(true);
+   }
+
    const onChange = (label, isChecked) => {
       const nextChecked = { ...checked, [label]: isChecked };
       setChecked(nextChecked);
@@ -225,11 +240,39 @@ const RealTimeStatus = (props) => {
             </div>)
          }
       </Modal>
+      <Modal
+         footer={null} open={pwOpen} onCancel={handlePwCancel}
+         bodyStyle={{
+            background: 'url(/assets/images/electrical/control-bg.png) no-repeat center center',
+            backgroundSize: '100% 100%', padding: '12px 16px', backgroundColor: '#344e6b'
+         }}
+         closeIcon={<img src='/assets/images/electrical/close.svg' style={{ width: 16, height: 16 }} />}
+         width={287}
+      >
+         <div style={{
+            background: 'url(/assets/images/electrical/control-title-bg.svg) no-repeat center center',
+            width: '100%', height: 32, fontFamily: 'YouSheBiaoTiHei', fontSize: 18, color: '#FFF', display: 'flex', alignItems: 'center'
+         }}>
+            <span style={{ marginLeft: '10px' }}>请输入密码</span>
+         </div>
+         <Form onFinish={handlePwFinish} autoComplete="off" form={form} >
+            <Form.Item
+               style={{ marginTop: 24 }}
+               name="password"
+               rules={[{
+                  required: true,
+                  message: '请输入密码',
+               }]}
+            >
+               <Input.Password />
+            </Form.Item>
+            <Button type="primary" htmlType="submit" style={{ width: '30%', marginLeft: '35%' }}>确定</Button>
+         </Form>
+      </Modal>
    </div>
-
 }
 
-function mapStateToProps (state) {
+function mapStateToProps(state) {
    const { auth, global } = state;
    return {
       user: auth.user,