choseDevice.html 5.36 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">
    <title>选择设备</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/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="../css/style.css" />
</head>

<body class="equipment-list-view choseDevice-view">
    <div class="aui-content aui-margin-b-15">
        <header class="aui-bar aui-bar-nav" id="header">
          <a class="aui-btn aui-pull-left" tapmode onclick="closeWin()">
              <span class="aui-iconfont aui-icon-left"></span>
          </a>
            <div class="aui-title">选择设备</div>
            <span class="aui-btn aui-pull-right" tapmode onclick="openCanner(false)">添加设备</span>
        </header>
        <ul class="aui-padded-10" id="devicesList">
            <li tapmode="" class="ld-selected" onclick="choseDevice('867352040586585');"><div><label class="tytx-color-b">设备编号:</label><b>867352040586585</b><i class="iconfont iconxuanze"></i></div><p class="aui-ellipsis-1"><img src="../image/dizhi-s.png"><span>上海市 黄浦区 测试设备地址</span></p></li>
        </ul>
    </div>
</body>

</html>
<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 header = $api.byId('header');
fixStatusBar_API(header);
apiready = function() {
    api.setStatusBarStyle({
        style: 'dark',
        color: 'rgba(0,0,0,0)'
    });
    api.parseTapmode();

    api.addEventListener({
        name: 'add_device'
    }, function(ret, err){
        if( ret ){
             showDeviceList();
        }else{
        }
    });
    showDeviceList();
}

var idList = {};
function showDeviceList() {
    var current = $api.getStorage('defaultDevice');
    var devicesStr = $api.getStorage('devices');
    if (!devicesStr || devicesStr == "") {
        api.toast({
            msg: '暂无设备',
            duration: 4000,
            location: 'bottom'
        });
        setTimeout(function() {
            api.closeWin();
        },
        3000);
        return false;
    }

    var devices = JSON.parse(devicesStr);
    $("#devicesList").empty();
    var devicesHtmlStr = "";
    if (devices && devices.length > 0) {
        for (var i in devices) {
            var dev = devices[i];
            idList[dev.imei] = dev.id
            if(current==dev.imei){
              devicesHtmlStr += '<li class="ld-selected" tapmode onclick="choseDevice(\'' + dev.imei + '\');">' + '<div><label class="tytx-color-b">设备编号:</label><b>' + dev.imei + '</b><i class="iconfont iconxuanze"></i></div>' + '<p class="aui-ellipsis-1"><img src="../image/dizhi-s.png" /><span>' + dev.province + ' ' + dev.city + ' ' + dev.address + '</span></p>' + '</li>';
            }else{
              devicesHtmlStr += '<li tapmode onclick="choseDevice(\'' + dev.imei + '\');">' + '<div><label class="tytx-color-b">设备编号:</label><b>' + dev.imei + '</b></div>' + '<p class="aui-ellipsis-1"><img src="../image/dizhi-s.png" /><span>' + dev.province + ' ' + dev.city + ' ' + dev.address + '</span></p>' + '</li>';
            }

        }
    }
    $("#devicesList").html(devicesHtmlStr);
}

function choseDevice(imei){
console.log($("#devicesList").html())
    var current = $api.getStorage('defaultDevice');
    if(imei == current){
      return false;
    }
    api.confirm({
        title: '设备切换确认',
        msg: '是否切换至设备'+imei,
        buttons: ['确定', '取消']
    }, function(ret, err){
        if( ret && ret.buttonIndex == 1){
             //开始切换设备
             var token = $api.getStorage('userToken');
             api.showProgress({
                 style: 'default',
                 animationType: 'fade',
                 title: '正在切换中...',
                 text: '',
                 modal: true
             });
              var choseId = idList[imei];
             $.ajax({
                 url: HOST + '/iot_api/v1/app/set_device_default',
                 type: 'POST',
                 dataType: 'json',
                 headers: {
                     'Content-Type': 'application/json;charset=utf-8',
                     'token': token
                 },
                 data: JSON.stringify({
                     id: choseId
                 }),
                 complete: function() {
                     api.hideProgress();

                 },
                 success: function(ret) {
                     if (ret) {
                         if (ret.code == 0) {
                             api.sendEvent({
                                 name: 'change_device',
                                 extra: {
                                     imei: imei
                                 }
                             });
                             api.closeWin();

                         }
                     }
                 },
                 error: function() {

                 }
             });

        }
    });

}


</script>