main.htm 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>慧养殖</title>
  5. #include("template/huimv-wx-head.vm")
  6. <style type="text/css">
  7. *{
  8. margin:0;
  9. padding:0;
  10. }
  11. html{
  12. height:100%;
  13. }
  14. body{
  15. min-height:100%;
  16. position:relative;
  17. }
  18. #mainMobileBody{
  19. padding:0px;
  20. }
  21. #sideToggle{
  22. display:none;
  23. }
  24. .menuShow1{
  25. z-index:1;
  26. left:0px;
  27. opacity:1;
  28. }
  29. .menuShow2{
  30. z-index:0;
  31. }
  32. aside{
  33. position:absolute;
  34. left:-400px;
  35. right:0;
  36. top:37px;
  37. width:130px;
  38. transition:0.2s ease-out;
  39. -webkit-transition:0.2s ease-out;
  40. }
  41. #sideMenuControl{
  42. margin-left: 10px;
  43. margin-top: 5px;
  44. float: left;
  45. border: none;
  46. background: transparent;
  47. display:inline-block;
  48. box-shadow: none;
  49. -webkit-box-shadow: none;
  50. }
  51. #mainZsSelect{
  52. line-height: 15px;
  53. position: absolute;
  54. width: 50%;
  55. margin-left:30%;
  56. margin-right:30%;
  57. }
  58. .contCenter{
  59. background-color:rgb(9,143,189);
  60. height: 35px;
  61. line-height: 35px;
  62. color: white;
  63. text-align: center;
  64. }
  65. .alphaFrame{
  66. left: 0px;
  67. top: 0px;
  68. opacity: 0;
  69. background: #C5C0C0;
  70. overflow: hidden;
  71. position: fixed;
  72. height: 100%;
  73. width: 100%;
  74. z-index: 1;
  75. }
  76. </style>
  77. <script type="text/javascript">
  78. $(function() {
  79. loadMainMenuPanel();
  80. //loadMainBodyPanel();
  81. //loadMainFootPanel();
  82. $("#sideToggle").attr("checked", false);
  83. });
  84. function backMain() {
  85. //loadMainBodyPanel();
  86. //loadMainFootPanel();
  87. //$("#mainTopTitle").show();
  88. //$("#mainZsSelect").hide();
  89. menuLiClick("zns");
  90. menuLiClick("yzgk","hide","ztgk");
  91. $("#zns").show();
  92. if ($("#sideToggle").attr("checked")) {
  93. selectMenu();
  94. }
  95. }
  96. // 加载主页面菜单
  97. function loadMainMenuPanel() {
  98. huimvMobile.loadMobilePage("mainMobileMenu", "mainMobileMenu.htm");
  99. }
  100. //加载中间内容页
  101. function loadMainBodyPanel() {
  102. huimvMobile.loadMobilePage("mainMobileBody", "mainMobileBody.htm");
  103. }
  104. //加载底部内容页
  105. function loadMainFootPanel() {
  106. huimvMobile.loadMobilePage("mainMobileFoot", "mainMobileFoot.htm");
  107. }
  108. function selectMenu() {
  109. //document.getElmentById("mainMobileMenu").height=height;
  110. //$("#mainMobileMenu").attr("height",height);
  111. $("#mainMobileMenu").height(560);
  112. if ($("#sideToggle").attr("checked")) {
  113. $("#sideToggle").attr("checked", false);
  114. $("#alphaFrame").hide(); // 隐藏透明层
  115. $("#page1").removeClass("menuShow2");
  116. $("aside").removeClass("menuShow1");
  117. $("#mainMobileBody").css("opacity","1");
  118. } else {
  119. $("#sideToggle").attr("checked", true);
  120. $("#alphaFrame").show(); // 显示透明层
  121. $("#page1").addClass("menuShow2");
  122. $("aside").addClass("menuShow1");
  123. $("#mainMobileBody").css("opacity","0.2");
  124. }
  125. }
  126. //栏期变更
  127. function selectedZsid() {
  128. var type = $("#type").val();
  129. switch (type) {
  130. //养殖概况
  131. case "ztgk":
  132. case "lrb":
  133. case "clyc":
  134. case "ssjk":
  135. //群体生长
  136. case "tzfb":
  137. case "pjtz":
  138. case "rzz":
  139. case "rzzr":
  140. case "rcscs":
  141. case "scscs":
  142. //饲料消耗
  143. case "mtxh":
  144. case "qcxh":
  145. //舍内环境
  146. case "snwd":
  147. case "snwdr":
  148. case "snsd":
  149. case "snsdr":
  150. case "qtzb":
  151. case "qtzbr":
  152. loadZnsMain(type);
  153. break;
  154. }
  155. }
  156. function ztgkSelect(val){
  157. $("#mobileZsid").val(val);
  158. var s = $("select:[id='mobileZsid']").val();
  159. if (s != undefined && s != null && s!= "") {
  160. $("#mobileZsid").selectmenu("refresh", true);
  161. }
  162. loadMain("zns","ztgk","hide");
  163. }
  164. function hideLeftMenu() {
  165. if ($("#sideToggle").attr("checked")) {
  166. selectMenu();
  167. }
  168. }
  169. //当不在选中区域隐藏菜单
  170. /*
  171. $(document).ready(function(){
  172. $("#mainMobileMenu").live("mouseleave",function(){
  173. selectMenu();
  174. });
  175. });
  176. */
  177. </script>
  178. </head>
  179. <body>
  180. <input type='checkbox' id='sideToggle'>
  181. <div id="page1">
  182. <aside style="z-index:2;">
  183. <div id="mainMobileMenu"></div>
  184. </aside>
  185. <div id="alphaFrame" class="alphaFrame" style="display:none;" onclick="hideLeftMenu()"></div>
  186. <div >
  187. <a id='sideMenuControl' onclick="selectMenu()" ><img src="css/jqm/images/search_list1.png" width="25px" height="25px"/></a>
  188. <div class="contCenter">
  189. <label id="mainTopTitle"><div>$!mcmc $!obj.dqlq</div></label>
  190. <div id="mainZsSelect" style="display:none;">
  191. #if($!zsdaList.size() == 1)
  192. #foreach($!obj in $!zsdaList)
  193. $!obj.zsmc
  194. <input type="hidden" id="mobileZsid" value="$!obj.dqlq"/>
  195. #end
  196. #else
  197. <select id="mobileZsid" onchange="selectedZsid()">
  198. #foreach($!obj in $!zsdaList)
  199. <option value="$!obj.dqlq">$!obj.zsmc</option>
  200. #end
  201. </select>
  202. #end
  203. </div>
  204. </div>
  205. <!-- <a href="#" class="ui-btn-right" onclick="javascript:backMain();"><img src="css/jqm/images/home-black.png" width="25px" height="25px"/></a> -->
  206. </div>
  207. <div class="content">
  208. <div id="mainMobileBody"></div>
  209. </div>
  210. <div data-role="footer">
  211. <div id="mainMobileFoot"></div>
  212. </div>
  213. </div>
  214. </body>
  215. </html>