| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262 |
- <!doctype html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title></title>
- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
- <link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">
- <link rel="stylesheet" href="../css/reset.css" />
- <link href="../css/mui.min.css" rel="stylesheet" />
- <link rel="stylesheet" href="../css/iconfont.css" />
- <script src="../js/base.js" type="text/javascript" charset="utf-8"></script>
- <link href="../css/common.css" rel="stylesheet" />
- <style type="text/css">
- /*body,.mui-content {
- background: #fff;
- }*/
-
- .mui-icon-undo {
- display: none;
- }
-
- .qxMsg {
- margin: 10px 20px;
- /*background: pink;*/
- }
-
- .qxMsg>li {
- margin-bottom: .2rem;
- }
-
- .qxManualitem {
- padding: 6px;
- background: #fff;
- border-radius: 3px;
- /*line-height: 33px;*/
- }
-
- .currName {
- line-height: 33px;
- }
-
- .switchName {
- color: green;
- display: none;
- }
- /*switch*/
-
- .switchParent {
- float: right;
- margin-top: 2px;
- right: 3px;
- }
-
- .mui-switch.mui-active:before {
- content: '开启';
- left: 8px;
- }
-
- .mui-switch:before {
- content: '关闭';
- }
-
- .isonlineicon {
- display: inline-block;
- width: 8px;
- height: 8px;
- border-radius: 50%;
- background: green;
- margin-right: 3px;
- }
-
- .isonlineicon.active {
- background: green;
- animation: 1s ease 0s infinite normal none running myfirst01;
- }
-
- .isonlineicon {
- background: #909090;
- animation: 1s ease 0s infinite normal none running myfirst02;
- }
-
- @keyframes myfirst01 {
- 0% {
- -moz-box-shadow: 0px 0px 6px 1px green;
- box-shadow: 0px 0px 6px 1px green;
- }
- 100% {
- -moz-box-shadow: 0px 0px 6px 1px green;
- box-shadow: 0px 0px 6px 1px green;
- }
- }
-
- @keyframes myfirst02 {
- 0% {
- -moz-box-shadow: 0px 0px 6px 1px #909090;
- box-shadow: 0px 0px 6px 1px #909090;
- }
- 100% {
- -moz-box-shadow: 0px 0px 6px 1px #909090;
- box-shadow: 0px 0px 6px 1px #909090;
- }
- }
- </style>
- </head>
- <body>
- <header class="mui-bar mui-bar-nav">
- <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
- <h1 class="mui-title" id="title">手动控制</h1>
- <a id="setAstrict" class="mui-icon mui-icon-compose mui-pull-right" onclick="showEdit(this)"></a>
- <a id="setAstrict" class="mui-icon mui-icon-undo mui-pull-right" onclick="cantelEdit(this)"></a>
- </header>
- <div class="mui-content">
- <ul class="qxMsg">
- <!--<li class="qxitem">
- <div class="qxManualitem">
- <span class="isonlineicon"></span>
- <span class="currName">施肥机</span>
- <span class="mui-icon mui-icon-compose switchName" onclick="editName(this)"></span>
- <input type="hidden" name="" id="" value="1" />
- <div class="switchParent">
- <div class="mui-switch mui-switch-blue mui-active">
- <div class="mui-switch-handle"></div>
- </div>
- </div>
- </div>
- </li>-->
- </ul>
- </div>
- <script src="../js/jquery-2.1.0.js"></script>
- <script src="../js/mui.min.js"></script>
- <script src="../js/common.js"></script>
- <script type="text/javascript">
- var equipId;
- mui.init();
- var qxz_switch = [];
- var switch_name = [];
- mui.plusReady(function() {
- var self = plus.webview.currentWebview();
- equipId = self.equipId;
- qxz_switch = self.qxz_switch;
- switch_name = eval('('+self.switch_name+')');
- data = self.data
- $('#equipName').html('项目名称:' + qxz_switch);
- var html = '';
- for(var i = 0; i < qxz_switch.length; i++) {
- if(switch_name[i].name) {
- var name = switch_name[i].name;
- } else {
- var name = '开关' + qxz_switch[i].JK;
- }
- if(qxz_switch[i].status == 1) {
- var check = 'mui-active';
- } else {
- var check = '';
- }
- html += '<li class="qxitem"><div class="qxManualitem">' +
- '<span class="isonlineicon"></span><span class="currName">' + name + '</span>' +
- '<span class="mui-icon mui-icon-compose switchName" onclick="editName(this)"></span>' +
- '<input type="hidden" name="" id="" value="' + qxz_switch[i].JK + '" /><div class="switchParent">' +
- '<div class="mui-switch mui-switch-blue ' + check + '">' +
- '<div class="mui-switch-handle"></div></div></div></div></li>';
- if(i == qxz_switch.length - 1) {
- $('.qxMsg').html(html);
- mui('.mui-switch')['switch']();
- mui('.qxMsg').on('toggle', '.mui-switch', function(event) {
- if(event.detail.isActive) {
- console.log("你启动了开关");
- var currStutas = 1;
- } else {
- console.log("你关闭了开关");
- var currStutas = 0;
- }
- var currWay = $(this).parent().prev().val();
- var _this = this;
- $.ajax({
- url: 'http://120.27.222.26/qxz_switch',
- type: 'post',
- data: {
- 'req': 'set',
- 'imei': equipId,
- 'way': currWay,
- 'switch': currStutas
- },
- success: function(data) {
- if(currStutas == 1) {
- $(_this).parents('.qxManualitem').find('.isonlineicon').addClass('active');
- } else {
- $(_this).parents('.qxManualitem').find('.isonlineicon').removeClass('active');
- }
- mui.toast('设置成功');
- },
- error: function(type) {
- mui.toast('设置失败')
- }
- })
- })
- }
- }
- })
- $('body').on('tap', '.aisleName', function() {
- var _this = this;
- $(_this).next().slideToggle(function() {
- if($(this).is(":visible")) {
- $(_this).children().addClass('mui-navigate-top')
- } else {
- $(_this).children().removeClass('mui-navigate-top')
- }
- });
- })
- function showEdit(obj) {
- $(obj).hide();
- $(obj).next().show();
- $('.switchName').show();
- }
- function cantelEdit(obj) {
- $(obj).hide();
- $(obj).prev().show();
- $('.switchName').hide();
- }
- function editName(obj) {
- var title = $(obj).prev().html();
- var currWay = $(obj).next().val();
- mui.prompt('修改开关名称', '输入开关名称', title, ['取消', '确定'], function(e) {
- if(e.index == 1) {
- var text = e.value
- if(text) {
- $.ajax({
- url: 'http://120.27.222.26/qxz_switch_name',
- type: 'post',
- data: {
- 'imei': equipId,
- 'way': currWay,
- 'sw_name': text
- },
- success: function(data) {
- console.log(111111)
- if(data == 0) {
- $(obj).prev().html(text)
- }
- },
- error: function(type) {
-
- }
- })
- }else{
- return false;
- }
- }
- }, 'div')
- }
- </script>
- </body>
- </html>
|