videoMonitor.html 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
  6. <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  7. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  8. <link rel="stylesheet" href="../../css/api.css">
  9. <!--<link rel="stylesheet" href="../../css/aui.css">-->
  10. <link rel="stylesheet" href="../../css/projeck.css">
  11. <title></title>
  12. <style>
  13. .aui-searchbar{
  14. width: 86%;
  15. height: 50px;
  16. margin-left: 40px;
  17. background-color: transparent;
  18. }
  19. .aui-searchbar .aui-searchbar-btn{
  20. color: #fff;
  21. }
  22. #search-input::placeholder{
  23. color: #fff;
  24. }
  25. .search_ico{
  26. width: 16px;
  27. height: 16px;
  28. display: block;
  29. position: absolute;
  30. background: url("../../image/seacrh001.png") no-repeat;
  31. background-size: cover;
  32. top: 7px;
  33. left: 17px;
  34. }
  35. .backBtn{
  36. margin-left: 5px;
  37. }
  38. .aui-searchbar-btn{
  39. font-size: 14px!important;
  40. }
  41. #search-input{
  42. font-size: 14px;
  43. }
  44. </style>
  45. </head>
  46. <body>
  47. <div class="api_layout">
  48. <header class="header-login">
  49. <img class="backBtn" src="../../image/btn_back.png" alt="" onclick="backIndex()">
  50. <p class="api_text">视频监控</p>
  51. <!-- <div class="aui-searchbar" id="search">
  52. <div class="aui-searchbar-input aui-border-radius">
  53. <i class="search_ico"></i>
  54. <form>
  55. <input type="search" id="search-input" placeholder="搜索">
  56. </form>
  57. </div>
  58. <div class="aui-searchbar-cancel aui-searchbar-btn">取消</div>
  59. </div> -->
  60. </header>
  61. </div>
  62. <script src="../../script/api.js"></script>
  63. <script src="../../script/fastclick.min.js"></script>
  64. <script src="../../script/config.js"></script>
  65. <script>
  66. apiready = function(){
  67. $api.fixStatusBar( $api.dom('header'));
  68. openFrameFun();
  69. // fnInitUIInput();
  70. };
  71. // var searchBar = document.querySelector(".aui-searchbar");
  72. // var searchBarInput = document.querySelector(".aui-searchbar input");
  73. // var searchBarBtn = document.querySelector(".aui-searchbar .aui-searchbar-btn");
  74. // if(searchBar){
  75. // searchBarInput.onclick = function(){
  76. // searchBarBtn.style.marginRight = 0;
  77. // }
  78. // searchBarInput.oninput = function(){
  79. // if(this.value.length){
  80. // searchBarBtn.textContent = "搜索";
  81. // }else{
  82. // searchBarBtn.textContent = "取消";
  83. // }
  84. // }
  85. // }
  86. // searchBarBtn.onclick = function(){
  87. // var keywords = searchBarInput.value;
  88. // if(keywords.length){
  89. // searchBarInput.blur();
  90. // }else{
  91. // this.style.marginRight = "-"+this.offsetWidth+"px";
  92. // searchBarInput.value = '';
  93. // searchBarInput.blur();
  94. // }
  95. // };
  96. function openFrameFun() {
  97. api.openFrame({
  98. name: 'monitorList',
  99. url: 'monitorList.html',
  100. rect: {
  101. x: 0,
  102. y: $api.dom('header').offsetHeight,
  103. w: 'auto',
  104. h: 'auto'
  105. },
  106. pageParam: {
  107. name: 'test'
  108. },
  109. bounces: false,
  110. bgColor: 'rgba(0,0,0,0)',
  111. vScrollBarEnabled: true,
  112. hScrollBarEnabled: false,
  113. scrollEnabled:false,
  114. });
  115. };
  116. function backIndex() {
  117. api.closeWin();
  118. }
  119. // input
  120. // function fnInitUIInput() {
  121. // var searchText = $api.byId('search-input');
  122. // var rect = $api.offset(searchText);
  123. // var UIInput = api.require('UIInput');
  124. // UIInput.open({
  125. // rect: {
  126. // x: rect.l,
  127. // y: rect.t+1,
  128. // w: rect.w,
  129. // h: rect.h-1
  130. // },
  131. // styles: {
  132. // bgColor: 'rgba(255, 255, 255, 0.3)',
  133. // size: 14,
  134. // color: '#000',
  135. // placeholder: {
  136. // color: '#fff'
  137. // }
  138. // },
  139. // autoFocus: false,
  140. // maxRows: 1,
  141. // placeholder: '请输入地址',
  142. // keyboardType: 'default',
  143. // fixedOn: api.frameName
  144. // }, function(ret, err) {
  145. // if (ret) {
  146. // var uiInputId = ret.id;
  147. // if (ret.eventType == "change") {
  148. // UIInput.value({
  149. // id: uiInputId
  150. // }, function(ret, err) {
  151. // if (ret) {
  152. // if (ret.status) {
  153. // api.execScript({
  154. // name: 'videoMonitor',
  155. // frameName: 'monitorList',
  156. // script: 'seeMonitorList("","'+ret.msg+'","'+ ret.msg +'");'
  157. // });
  158. // }
  159. // }
  160. // });
  161. // }
  162. // }
  163. // });
  164. // }
  165. </script>
  166. </body>
  167. </html>