paramController_frm.html 17.9 KB
<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>设备参数_frm</title>
      <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
      <link rel="stylesheet" type="text/css" href="../../css/aui.css"/>
      <link rel="stylesheet" type="text/css" href="../../css/paramSet/paramSet.css"/>
      <style>
        html,
        body{
          background-color: #F4F6F9;
        }
      </style>

  </head>
  <body>
    <div class="param-title">
      <div style="margin-left:15px;margin-right:15.5px;">
        <div class="aui-row aui-row-flex top-14">
          <div class="aui-col aui-col-span-1" style="margin-top: 1rem;">
            <div class="title-sign"></div>
          </div>
          <div class="aui-col aui-col-span-15">
            <span class="device-name" id="device_imei">设备编号:000000000000000</span>
          </div>
          <div class="aui-col aui-col-span-8 aui-row-flex-end">
            <div id="show_logs"  class="show-logs" tapmode onclick="showLogs();">查看日志</div>  <!--not-click-->
          </div>
        </div>
      </div>
    </div>

    <div class="info-panel">
     <div class="info-inside-panel">
       <div class="aui-row aui-row-flex padding-top-21">
         <div class="aui-col aui-col-span-17 aui-row-flex-start">
           <span class="param-obj">过载电流动作值</span><span class="param-obj-extra aui-hide" style="margin-left:0.3rem;" >(<span id="gzdl_range"></span > A)</span>
         </div>
         <div class="aui-col aui-col-span-5 aui-row-flex-end">
           <input id="gzdl" class="aui-input param-input" readonly type="number" style="height:1.26rem;margin-right:-0.2rem;text-align:right;font-family:DINPro-Medium;font-weight:500;color:rgba(91,127,248,1);font-size:16px;" >
         </div>
         <div class="aui-col aui-col-span-2 aui-row-flex-start">
           <span class="num-value num-unit">A</span>
         </div>
       </div>
       <div class="panel-line margin-top-21"></div>
       <div class="aui-row aui-row-flex margin-top-21">
         <div class="aui-col aui-col-span-17 aui-row-flex-start">
           <span class="param-obj">过载时间动作值</span><span class="param-obj-extra aui-hide" style="margin-left:0.3rem;" >(<span id="gzsj_range"></span > s)</span>
         </div>
         <div class="aui-col aui-col-span-5 aui-row-flex-end">
           <input id="gzsj" class="aui-input param-input" readonly type="number" style="height:1.26rem;margin-right:-0.2rem;text-align:right;font-family:DINPro-Medium;font-weight:500;color:rgba(91,127,248,1);font-size:16px;" >
         </div>
         <div class="aui-col aui-col-span-2 aui-row-flex-start">
           <span class="num-value num-unit">s</span>
         </div>
       </div>
       <div class="panel-line margin-top-21"></div>
       <div class="aui-row aui-row-flex margin-top-21">
         <div class="aui-col aui-col-span-17 aui-row-flex-start">
           <span class="param-obj">短路电流动作值</span><span class="param-obj-extra aui-hide" style="margin-left:0.3rem;" >(<span id="dldl_range"></span > A)</span>
         </div>
         <div class="aui-col aui-col-span-5 aui-row-flex-end">
           <input id="dldl" class="aui-input param-input" readonly type="number" style="height:1.26rem;margin-right:-0.2rem;text-align:right;margin-right:-0.2rem;font-family:DINPro-Medium;font-weight:500;color:rgba(91,127,248,1);font-size:16px;" >
         </div>
         <div class="aui-col aui-col-span-2 aui-row-flex-start">
           <span class="num-value num-unit">A</span>
         </div>
       </div>
       <div class="panel-line margin-top-21"></div>
       <div class="aui-row aui-row-flex margin-top-21">
         <div class="aui-col aui-col-span-17 aui-row-flex-start">
           <span class="param-obj">漏电电流动作值</span><span class="param-obj-extra aui-hide" style="margin-left:0.3rem;" >(<span id="lddl_range"></span > mA)</span>
         </div>
         <div class="aui-col aui-col-span-5 aui-row-flex-end">
           <input id="lddl" class="aui-input param-input" readonly type="number" style="height:1.26rem;margin-right:0.5rem;text-align:right;font-family:DINPro-Medium;font-weight:500;color:rgba(91,127,248,1);font-size:16px;" >
         </div>
         <div class="aui-col aui-col-span-2 aui-row-flex-start">
           <span class="num-value num-unit" style="margin-left:-0.2rem;">mA</span>
         </div>
       </div>
       <div class="panel-line margin-top-21"></div>
       <div class="aui-row aui-row-flex margin-top-21">
         <div class="aui-col aui-col-span-17 aui-row-flex-start">
           <span class="param-obj">过压报警值</span><span class="param-obj-extra aui-hide" style="margin-left:0.3rem;" >(<span id="gybj_range"></span > V)</span>
         </div>
         <div class="aui-col aui-col-span-5 aui-row-flex-end">
           <input id="gybj" class="aui-input param-input" readonly type="number" style="height:1.26rem;margin-right:-0.2rem;text-align:right;font-family:DINPro-Medium;font-weight:500;color:rgba(91,127,248,1);font-size:16px;" >
         </div>
         <div class="aui-col aui-col-span-2 aui-row-flex-start">
           <span class="num-value num-unit">V</span>
         </div>
       </div>
       <div class="panel-line margin-top-21"></div>
       <div class="aui-row aui-row-flex margin-top-21">
         <div class="aui-col aui-col-span-17 aui-row-flex-start">
           <span class="param-obj">欠压报警值</span><span class="param-obj-extra aui-hide" style="margin-left:0.3rem;" >(<span id="qybj_range"></span > V)</span>
         </div>
         <div class="aui-col aui-col-span-5 aui-row-flex-end">
           <input id="qybj" class="aui-input param-input" readonly type="number" style="height:1.26rem;margin-right:-0.2rem;text-align:right;font-family:DINPro-Medium;font-weight:500;color:rgba(91,127,248,1);font-size:16px;" >
         </div>
         <div class="aui-col aui-col-span-1 aui-row-flex-start">
           <span class="num-value num-unit" style="margin-left:0.5rem;">V</span>
         </div>
       </div>
       <div class="panel-line margin-top-21"></div>
       <div class="aui-row aui-row-flex margin-top-21">
         <div class="aui-col aui-col-span-17 aui-row-flex-start">
           <span class="param-obj">超温报警值</span><span class="param-obj-extra aui-hide" style="margin-left:0.3rem;" >(<span id="cwbj_range"></span > ℃)</span>
         </div>
         <div class="aui-col aui-col-span-5 aui-row-flex-end">
           <!-- <input class="num-value" style="background-color:red;" id="cwbj">0</input> -->
           <input id="cwbj" class="aui-input param-input" readonly type="number" style="height:1.26rem;margin-right:-0.2rem;text-align:right;font-family:DINPro-Medium;font-weight:500;color:rgba(91,127,248,1);font-size:16px;" >
         </div>
         <div class="aui-col aui-col-span-2 aui-row-flex-start">
           <span class="num-value num-unit" style="margin-left:0.2rem;"></span>
         </div>
       </div>
       <div style="height:21px;"></div>
     </div>
   </div>
  </body>
  <script type="text/javascript" src="../../script/api.js"></script>
  <script type="text/javascript" src="../../script/common.js"></script>
  <script type="text/javascript" src="../../script/jquery-3.3.1.min.js"></script>
  <script type="text/javascript">
    var defaultImei;
    var token;
    var userId;
    // var over_current_,over_duration_,over_short_current_,over_rest_current_,over_high_voltage_,over_low_voltage_,over_temp_;
    var originVal = [];
      apiready = function(){
        api.parseTapmode();
        defaultImei = $api.getStorage('defaultDevice');
        token = $api.getStorage('userToken');
        userId = $api.getStorage('userID');
        $api.html($api.byId("device_imei"), '设备编号:'+ defaultImei);

        api.addEventListener({
            name: 'handleEdit'
        }, function(ret, err){
            if( ret ){
              if (ret.value.isEdit) { //打开编辑  1.日志不可点 2.显示参数范围 3.input可操作
                $api.addCls($api.byId('show_logs'), 'not-click');
                //---移除dom中的所有aui-hide
                var allDom = $api.domAll('.param-obj-extra');
                for (var i = 0; i < allDom.length; i++) {
                  $api.removeCls(allDom[i], 'aui-hide');
                }
                //------
                //移除readonly  $api.removeAttr(el, 'data')
                var inputDom = $api.domAll('.param-input');
                for (var j = 0; j < inputDom.length; j++) {
                  $api.removeAttr(inputDom[j], 'readonly');
                  if (j == 3) {
                    inputDom[j].style = "height:1.26rem;text-align:right;margin-right:0.5rem;font-family:DINPro-Medium;font-weight:500;color:rgba(174,184,206,1);font-size:16px;";
                  }else {
                    inputDom[j].style = "height:1.26rem;text-align:right;margin-right:-0.2rem;font-family:DINPro-Medium;font-weight:500;color:rgba(174,184,206,1);font-size:16px;";
                  }
                }
                //----
                //---移除dom中的所有num-unit
                var unitDom = $api.domAll('.num-value');
                for (var k = 0; k < unitDom.length; k++) {
                  $api.removeCls(unitDom[k], 'num-unit');
                }
                //------

              }else {      //完成编辑,1.日志可点击 2.隐藏参数范围 3.input不可操作 设置参数
                $api.removeCls($api.byId('show_logs'), 'not-click');
                //---添加dom中的所有aui-hide
                var allDom = $api.domAll('.param-obj-extra');
                for (var i = 0; i < allDom.length; i++) {
                  $api.addCls(allDom[i], 'aui-hide');
                }
                //------
                //添加readonly  $api.removeAttr(el, 'data')
                var inputDom = $api.domAll('.param-input');
                for (var j = 0; j < inputDom.length; j++) {
                  inputDom[j].readOnly=true;
                  if (j == 3) {
                    inputDom[j].style = "height:1.26rem;text-align:right;margin-right:0.5rem;font-family:DINPro-Medium;font-weight:500;color:rgba(91,127,248,1);font-size:16px;";
                  }else {
                    inputDom[j].style = "height:1.26rem;text-align:right;margin-right:-0.2rem;font-family:DINPro-Medium;font-weight:500;color:rgba(91,127,248,1);font-size:16px;";
                  }
                }
                //----
                //---添加dom中的所有num-unit
                var unitDom = $api.domAll('.num-value');
                for (var k = 0; k < unitDom.length; k++) {
                  $api.addCls(unitDom[k], 'num-unit');
                }
                //------
                //----设置参数
                cmd();
                //----------
              }
            }
        });


        getDeviceInfos();
      };

      function getDeviceInfos() {

            //获取设备信息
            $.ajax({
                url: HOST + '/iot_api/v1/app/device?imei='+defaultImei,
                type: 'GET',
                dataType: 'json',
                headers: {
                    'Content-Type': 'application/json;charset=utf-8',
                    'token': token
                },
                success: function(ret) {
                  if (ret.code == 0) {
                    var info = ret.data.device;
                    originVal = [];
                    originVal.push(info.over_current);
                    originVal.push(info.over_duration);
                    originVal.push(info.over_short_current);
                    originVal.push(info.over_rest_current);
                    originVal.push(info.over_high_voltage);
                    originVal.push(info.over_low_voltage);
                    originVal.push(info.over_temp);
                    $api.val($api.byId("gzdl"),originVal[0]);
                    $api.val($api.byId("gzsj"),originVal[1]);
                    $api.val($api.byId("dldl"),originVal[2]);
                    $api.val($api.byId("lddl"),originVal[3]);
                    $api.val($api.byId("gybj"),originVal[4]);
                    $api.val($api.byId("qybj"),originVal[5]);
                    $api.val($api.byId("cwbj"),originVal[6]);

                    // $api.html($api.byId("cwbj"), info.over_temp);
                  }else {
                    api.toast({msg: '参数请求失败',duration: 2000,location: 'bottom'});
                  }
                },
                error: function() {
                  api.toast({msg: ERR_MSG,duration: 2000,location: 'bottom'});
                }
            });
            //-------
            // 获取参数范围
            $.ajax({
                url: HOST + '/iot_api/v1/app/get_param_range?imei='+defaultImei,
                type: 'GET',
                dataType: 'json',
                headers: {
                    'Content-Type': 'application/json;charset=utf-8',
                    'token': token
                },
                success: function(ret) {
                  if (ret.code == 0) {
                    var ranges = ret.data;
                    $api.html($api.byId('gzdl_range') , ranges.over_current_min+'-'+ranges.over_current_max);
                    $api.html($api.byId('gzsj_range') , ranges.over_duration_min+'-'+ranges.over_duration_max);
                    $api.html($api.byId('dldl_range') , ranges.over_short_current_min+'-'+ranges.over_short_current_max);
                    $api.html($api.byId('lddl_range') , ranges.over_rest_current_min+'-'+ranges.over_rest_current_max);
                    $api.html($api.byId('gybj_range') , ranges.over_high_voltage_min+'-'+ranges.over_high_voltage_max);
                    $api.html($api.byId('qybj_range') , ranges.over_low_voltage_min+'-'+ranges.over_low_voltage_max);
                    $api.html($api.byId('cwbj_range') , ranges.over_temp_min+'-'+ranges.over_temp_max);
                  }else {
                    api.toast({msg: '参数范围请求失败',duration: 2000,location: 'bottom'});
                  }
                },
                error: function() {
                  api.toast({msg: ERR_MSG,duration: 2000,location: 'bottom'});
                }
            });
      }

      function cmd() {
        var gzdlDom = $api.byId('gzdl');  gzdlDom.blur();  //取消input焦点
        var gzsjDom = $api.byId('gzsj');  gzsjDom.blur();  //取消input焦点
        var dldlDom = $api.byId('dldl');  dldlDom.blur();  //取消input焦点
        var lddlDom = $api.byId('lddl');  lddlDom.blur();  //取消input焦点
        var gybjDom = $api.byId('gybj');  gybjDom.blur();  //取消input焦点
        var qybjDom = $api.byId('qybj');  qybjDom.blur();  //取消input焦点
        var cwbjDom = $api.byId('cwbj');  cwbjDom.blur();  //取消input焦点
        var paramList = [{'gzdl':"&S2+"},{'gzsj':"&S3+"},{'dldl':"&S4+"},{'lddl':"&S5+"},{'gybj':"&S6+"},{'qybj':"&S7+"},{'cwbj':"&S8+"}];
        var count = 0;
        for (var i = 0; i < paramList.length; i++) {
          for(var key in paramList[i]){
            var dom_ = eval(key + 'Dom');
            var paramVal = $api.val(dom_);
            if ( parseFloat(originVal[i]) == paramVal ) {
              continue;
            }

            if (!(parseFloat($api.html($api.byId(key+'_range')).split('-')[0]) <= paramVal && paramVal <= parseFloat($api.html($api.byId(key +'_range')).split('-')[1]))) {
              api.toast({msg: '请输入有效参数范围',duration: 2000,location: 'bottom'});
              return;
            }
            //处理-->修改
            api.showProgress({
              style: 'default',
              animationType: 'fade',
              title: '操作中...',
              text: '正在设置参数',
              modal: true
            });
            $.ajax({
                url: HOST + '/iot_api/v1/app/set_device',
                type: 'POST',
                dataType: 'json',
                headers:{
                    'Content-Type':'application/json;charset=utf-8',
                    'token': token
                },
                data: JSON.stringify({
                  imei:defaultImei,
                  command:paramList[i][key],
                  value: paramVal.toString(),
                  user_id:userId
                }),
                success: function(ret) {
                  if (ret.code == 0) {
                    count++;
                    $.ajax({
                        url: HOST + '/iot_api/v1/app/sync_device',
                        type: 'POST',
                        dataType: 'json',
                        headers:{
                            'Content-Type':'application/json;charset=utf-8',
                            'token': token
                        },
                        data: JSON.stringify({
                            imei:defaultImei,
                        }),
                        success: function(ret) {
                          if (i == 7) {
                            api.hideProgress();
                            api.toast({msg: '设置完毕!',duration: 3000,location: 'bottom'});
                            getDeviceInfos();
                          }
                        },
                        error: function() {
                          api.toast({msg: ERR_MSG,duration: 2000,location: 'bottom'});
                        }
                    });

                  }else {
                    api.toast({msg: '编辑失败,请稍后再试',duration: 2000,location: 'bottom'});
                    return;
                  }
                },
                error: function() {
                  api.toast({msg: ERR_MSG,duration: 2000,location: 'bottom'});
                }
            });

         }
        }
      }

      function showLogs() {
        api.openWin({
            name: 'operaterLog_win',
            url: '../operaterLog/operaterLog_win.html',
            slidBackEnabled: true,
            pageParam: {
                name: 'fromParamSetPage'
            }
        });

      }
  </script>
  </html>