dtu_devices_frm.html 16.1 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"/>
      <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
      <meta name="referrer" content="no-referrer">
      <title>DTU设备</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/home.css"/>
      <link rel="stylesheet" type="text/css" href="../../css/element.css"/>
      <link rel="stylesheet" type="text/css" href="../../css/style.css"/>

      <style>
          html,
          body{
            background-color: #F4F6F9;
          }
      </style>
  </head>
  <body>
    <div id="app">
      <template>
        <div class="device-list-outside">
          <div class="device-list-area">
            <div class="device-info-card my-device-card-bg" style="margin-top: 10px;" v-for="(bind_list_d, bind_list_i) in bind_list_data">
              <div class="device-info-card-inside my-device-card-inside-bg">
                <el-row :gutter="10">
                  <el-col :span=5>
                    <div class="card-img">
                      <img :src="bind_list_d.pic_url"/>
                      <span class="ms">{{ bind_list_d.name }}</span>
                    </div>
                  </el-col>
                  <el-col :span=17 :offset=2>
                    <el-row>
                      <el-col :span=24 style="margin-top: 0rem;">
                        <span v-if="bind_list_d.storename != null && bind_list_d.storename != ''" class="my-device-title">{{ bind_list_d.storename }}</span>
                        <span v-else class="my-device-title">{{ bind_list_d.imei }}</span>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span=24 style="margin-top: 0rem;">
                        <span class="my-device-code-and-position">设备编号: {{ bind_list_d.imei }}</span>
                      </el-col>
                    </el-row>
                    <el-row>
                      <el-col :span=24 style="margin-top: 0rem;">
                        <span class="my-device-code-and-position">设备位置: {{ bind_list_d.location }}</span>
                      </el-col>
                    </el-row>
                  </el-col>
                </el-row>
              </div>
              <div class="my-device-btn-area">
                <el-row>
                  <el-col :span=24>
                    <div v-if="userType === 1" class="my-device-btn-delete" @click="removeDevice(bind_list_d.imei, bind_list_d.id)">删除设备</div>
                    <div v-if="userType === 1" class="my-device-btn-reset-pwd" @click="resetDevice(bind_list_d.imei)">重置密码</div>
                  </el-col>
                </el-row>
              </div>
            </div>

          </div>
        </div>
      </template>
    </div>
  </body>
  <script type="text/javascript" src="../../script/api.js"></script>
  <script type="text/javascript" src="../../script/jquery-3.3.1.min.js"></script>
  <script type="text/javascript" src="../../script/vue.min.js"></script>
  <script type="text/javascript" src="../../script/common.js"></script>
  <script type="text/javascript" src="../../script/element.js"></script>
  <script type="text/javascript" src="../../script/ctrl.js"></script>
  <script type="text/javascript" src="../../script/fastclick.js "></script>
  <script type="text/javascript">
      var vm, inputDialogJSON, that;
      apiready = function(){
        api.parseTapmode();
        inputDialogJSON = returnInputDialogJSON()
        $(function() {
          FastClick.attach(document.body);
        }); 

        //---------初始化vue
        vm = new Vue({
          el: '#app',
          data: {
            bind_list: {
              user_id: api.getPrefs({sync: true,key: 'userID'}),
              group_id: '',
              params: {},
              type: '',
              limit: 20,
              page: 1,
              imei: '',
              dtu_imei: api.pageParam.imei,
            },
            bind_list_data: [],
            userType: Number(api.getPrefs({sync: true,key: 'userType'})),
            token: api.getPrefs({sync: true,key: 'userToken'}),
            user_id: api.getPrefs({sync: true,key: 'userID'}),
          },
           mounted() {
            //window.chooseProduct = this.chooseProduct;
          },
          created() {
            that = this
            api.setRefreshHeaderInfo({
              bgColor: '#F4F6F9',
              textColor: 'rgba(55,57,78,1)',
              textDown: '下拉刷新设备列表...',
              textUp: '松开刷新...'
            }, function(ret, err) {
              that.initDeviceList(true)
            });
            this.initDeviceList(true)
          },
          methods: {
            async initDeviceList(bol) {
              api.showProgress({
                  style: 'default',
                  animationType: 'fade',
                  title: '加载中...',
                  text: '',
                  modal: false
              });
              if (bol) {
                this.bind_list_data = []
                this.online_count = 0
                this.offline_count = 0
              }
              var user_perference = await get_product_perference(this.user_id)
              this.userPreferenceList = user_perference.data
              for (let i = 0; i < this.userPreferenceList.length; i++) {
                const productPref = JSON.parse(this.userPreferenceList[i]);
                const prefList = []
                productPref.data_index.forEach(d => {
                  prefList.push('"'+d+'"')
                });
                eval('this.bind_list.params["' + productPref.name +'"]=[' + prefList + ']')
              }
              // this.bind_list.dtu_imei = this.row.imei
              let bind_list_data_ = []
              if (this.userType === 1) {
                bind_list_data_ = await get_bind_list_data(this.bind_list)  
              }else {
                bind_list_data_ = await get_enterprise_group_store(this.bind_list)
              }
              api.hideProgress();
              api.refreshHeaderLoadDone();
              let props_ = api.getPrefs({sync: true,key: 'props'})
              let props =  eval('(' + props_ + ')');
              list_rows = bind_list_data_.data.list.rows
              list_rows.forEach(d => {
                if (d.store != null) {
                  if (d.store.storeType.id === '01001') {
                    d.type = '01001'
                    let deviceInfos = {
                      pic_url: d.store.storeType.pic_url,
                      imei: d.imei,
                      name: d.store.storeType.name,
                      storename: d.storename,
                      indexParams: [{name: "电流", type: "etc_current", value: d.store.etc_current+"A"},
                                    {name: "剩余电流", type: "etc_rest_current", value: d.store.etc_rest_current+"mA"},
                                    {name: "电压", type: "etc_voltage", value: d.store.etc_voltage+"V"},
                                    {name: "频率", type:"etc_rate", value: d.store.etc_rate+"Hz"},
                                    {name: "线缆温度", type:"etc_line_temp", value: d.store.etc_line_temp+"℃"},
                                    {name: "内部温度", type:"etc_temp1", value: d.store.etc_temp1+"℃"}],
                      status: d.online,
                    }
                    if (d.store.gate_status === "1") {
                      deviceInfos.gate_status = true
                    }else if (d.store.gate_status === "0") {
                      deviceInfos.gate_status = false
                    }else{
                      deviceInfos.gate_status = null
                    }
                    deviceInfos.storeType = '01001'
                    this.bind_list_data.push(deviceInfos)
                  }
                }
                if (d.type != '01001') {
                  var indexParams_ = []
                  var normalInfos = {}
                  if (d.type === '05001') {
                    normalInfos = {
                      pic_url: 'http://iot.uccc.cc:9090/product/05001.png',
                      imei: d.imei,
                      name: 'TY-140',
                      storename: d.imei,
                      indexParams: [],
                      // status: d.online,
                      location: d.location,
                      storeType: d.type
                    }
                  }else {
                    var json_ = eval('d.store.store' + d.store.storeType.id)

                    for(var key in json_){
                      props.forEach(p => {
                        if (d.store.storeType.id === p.type_id && key === p.col_name) {
                          var v_ = eval('d.store.store' + d.store.storeType.id + '.' + key)
                          indexParams_.push({name: p.title, type: key, value: v_ + p.unit})
                        }
                      });
                    }
                    if (this.userType === 1) {
                      d.storename = d.storename
                      d.location = d.province+d.city+d.address
                    }else if (this.userType === 2) {
                      d.storename = d.imei
                      d.location = d.location
                    }
                    normalInfos = {
                      pic_url: d.store.storeType.pic_url,
                      imei: d.imei,
                      name: d.store.storeType.name,
                      storename: d.storename,
                      indexParams: indexParams_,
                      status: d.online,
                      location: d.location,
                      storeType: d.store.storeType.id,
                      id: d.id
                    }
                    
                    if (d.store.storeType.id != '05001' && d.store.storeType.id != '01001') {
                      const gate_status = eval('d.store.store' + d.store.storeType.id + '.switch')
                      normalInfos.gate_status = gate_status
                    }
                    //--- indexParams排序
                    var _indexParams_ = jsonSort(normalInfos.indexParams)
                    normalInfos.indexParams = _indexParams_
                    //--- 
                  }
                  if (normalInfos.status) {
                    this.online_count ++;
                  }else {
                    this.offline_count++;
                  }
                  if (normalInfos.storename) {
                    
                  }
                  this.bind_list_data.push(normalInfos)
                }
              });
              this.hasNext = bind_list_data_.data.next
              api.hideProgress();
              api.refreshHeaderLoadDone();
            },
            removeDevice(imei, deviceId) {
              console.log(deviceId);
              var dialogBox = api.require('dialogBox');
              dialogBox.alert({
                  texts: {
                      title: '确认移除设备',
                      content: '设备编号:' + imei,
                      leftBtnTitle: '取消',
                      rightBtnTitle: '确认'
                  },
                  styles: {
                      bg: '#fff',
                      w: 300,
                      corner:6,
                      title: {
                          marginT: 30,
                          icon: '',
                          iconSize: 40,
                          titleSize: 16,
                          titleColor: '#37394e'
                      },
                      content: {
                          color: '#818295',
                          size: 14
                      },
                      left: {
                          marginB: 7,
                          marginL: 20,
                          w: 130,
                          h: 35,
                          corner: 10,
                          bg: '#5B7FF8',
                          color: '#FFFFFF',
                          size: 12
                      },
                      right: {
                          marginB: 7,
                          marginL: 10,
                          w: 130,
                          h: 35,
                          corner: 10,
                          bg: '#5B7FF8',
                          color: '#FFFFFF',
                          size: 12
                      }
                  }
              },async function(ret) {
                  if (ret.eventType == 'left') {
                    dialogBox.close({
                        dialogName: 'alert'
                    });
                  }else if (ret.eventType == 'right') {
                    let unbindParams = {
                      token: that.token,
                      deviceId: deviceId,
                    }
                    let unbindRes = await unbind_device(unbindParams)
                    if (unbindRes.code == 0) {
                      //删除设备同步推送
                      var ajpush = api.require('ajpush')
                      initAndListenPush(ajpush, false)
                      that.initDeviceList(true)
                      api.toast({
                          msg: '移除设备成功!',
                          duration: 2000,
                          location: 'bottom'
                      })
                      dialogBox.close({
                        dialogName: 'alert'
                      });
                    }
                  }
              });
            },
            async resetDevice(imei) {
              const getPwdParams = {
                token: this.token,
                userId: this.bind_list.user_id,
                imei: imei,
              }
              let getPwd = await get_device_info_by_user(getPwdParams)
              let curPwd = getPwd.data.device.password
              if (curPwd == null) {
                inputDialogJSON.texts.title = "此设备未设置过密码!"
              }else {
                inputDialogJSON.texts.title = "原密码:" + curPwd
              }
              inputDialogJSON.texts.placeholder = "请输入新密码"
              inputDialogJSON.styles.title.color = '#37394E'
              let dialogBox = api.require('dialogBox')
              dialogBox.input(inputDialogJSON, async function(ret) {
                if (ret.eventType == 'left') {
                    var dialogBox = api.require('dialogBox');
                    dialogBox.close({
                        dialogName: 'input'
                    });
                }else if (ret.eventType == "right") {
                  // if (curPwd == null) {
                  //   api.toast({msg: '该设备无法设置密码!'});
                  //   return;
                  // }
                  let regularRes = /^\d+$/.test(ret.text);
                  if (regularRes && ret.text.length <= 6 && ret.text.length > 0) {
                    const updatePwdParams = {
                      token: api.getPrefs({sync: true,key: 'userToken'}),
                      old_pwd: curPwd,
                      new_pwd: ret.text,
                      imei: imei
                    }
                    let updatePwdRes = await post_update_device_pwd(updatePwdParams)
                    if ( updatePwdRes.code == 0 ) {
                      var dialogBox = api.require('dialogBox');
                      dialogBox.close({
                          dialogName: 'input'
                      });
                      that.initDeviceList(true)
                      api.toast({msg: '设备密码已重置!'});
                    }else {
                      api.toast({
                          msg: "更新失败," + ajaxCodeCheck(ret.code, ret.msg, '请稍后再试')
                      });
                    }
                  }else {
                    api.toast({msg: '请输入6位以内数字'});
                    return;
                  }
                }
              });
            },
          }
        })
      };
  </script>
</html>