singlechart.htm 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>单栋猪舍的数据图表</title>
  6. #include("template/huimv-hkclient-head.vm")
  7. <link rel="stylesheet" href="views/hkclient/css/chart.css">
  8. <style>
  9. html{
  10. padding-top: 0;
  11. }
  12. #zsbj{
  13. width: 100%;
  14. height: 100%;
  15. background: url('views/hkclient/img/bjt.jpg');
  16. background-size: 100% 100%;
  17. background-position: 0;
  18. background-repeat: no-repeat;
  19. background-color: transparent;
  20. position: relative;
  21. overflow: hidden;
  22. }
  23. .searchWrapper {
  24. background-color: transparent;
  25. margin-top: 8px;
  26. }
  27. #chartContainer {
  28. background-color: transparent;
  29. }
  30. .searchWrapper .links ul li {
  31. margin: 0 15px;
  32. }
  33. .searchWrapper .links ul li.active {
  34. background-color: transparent;
  35. background: url('views/hkclient/img/xbk.png');
  36. background-size: contain;
  37. background-position: center;
  38. background-repeat: no-repeat;
  39. box-shadow: none;
  40. }
  41. </style>
  42. <script type="text/javascript">
  43. $(function() {
  44. /**
  45. * 初始化日期
  46. */
  47. $("#dbrq1").datepicker({
  48. language: "en",
  49. maxDate: new Date(new Date("$!nowDate") - 14 * 60 * 60 * 1000), //误差14个小时?
  50. //maxDate: new Date("$!nowDate"),
  51. dateFormat: "yyyy-mm-dd",
  52. clearButton: true,
  53. autoClose: true
  54. });
  55. $("#dbrq2").datepicker({
  56. language: "en",
  57. maxDate: new Date(new Date("$!nowDate") - 14 * 60 * 60 * 1000), //误差14个小时?
  58. //maxDate: new Date("$!nowDate"),
  59. dateFormat: "yyyy-mm-dd",
  60. clearButton: true,
  61. autoClose: true
  62. });
  63. var selectGroup = {};
  64. $("#dbnr").on("click", "li", function () {
  65. $("#dbnr").find(".selected").text($(this).text());
  66. selectGroup.dbnr = $(this).data("value");
  67. });
  68. $("#dbzs").on("click", "li", function () {
  69. $("#dbzs").find(".selected").text($(this).text());
  70. selectGroup.dbzs = $(this).data("value");
  71. });
  72. $(".submit").click(function () {
  73. var dbrq1 = $("#dbrq1").val();
  74. var dbrq2 = $("#dbrq2").val();
  75. var error = "";
  76. if (!selectGroup.dbnr) {
  77. error += "对比内容不能为空!\n";
  78. }
  79. if (!selectGroup.dbzs) {
  80. error += "请选择猪舍!\n";
  81. }
  82. if (dbrq1 == "" || dbrq2 == "") {
  83. error += "请选择对比日期!";
  84. }
  85. if (error == "") {
  86. jQuery.ajax({
  87. type: "get",
  88. url: "hkClientSnCompareTjt.htm",
  89. data: {"dbzs": selectGroup.dbzs,"dbrq1" : dbrq1, "dbrq2" : dbrq2, "dbnr" : selectGroup.dbnr},
  90. dataType: "json",
  91. async: true,
  92. success: function (data) {
  93. if (data) {
  94. getHighchartTjt(data, "chartContainer");
  95. }
  96. }
  97. });
  98. } else {
  99. alert(error);
  100. return;
  101. }
  102. });
  103. });
  104. </script>
  105. </head>
  106. <body>
  107. <div id="zsbj">
  108. <div class="searchWrapper">
  109. <nav class="links">
  110. <ul>
  111. <li class="active"><a href="#">舍内对比</a></li>
  112. <li><a href="multiChartIndex.htm?mcid=$!mcid">舍舍对比</a></li>
  113. </ul>
  114. </nav>
  115. <nav class="btnGroup">
  116. <div id="dbzs" class="btn-group">
  117. <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
  118. <span class="selected">选择猪舍</span><span class="caret"></span>
  119. </button>
  120. <ul class="dropdown-menu">
  121. #foreach ($!obj in $!zsdaList)
  122. <li data-value="$!obj.id"><a href="#">$!obj.zsmc<input type="hidden"/></a></li>
  123. #end
  124. </ul>
  125. </div>
  126. <div id="dbnr" class="btn-group">
  127. <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
  128. <span class="selected">对比内容</span><span class="caret"></span>
  129. </button>
  130. <ul class="dropdown-menu">
  131. <li data-value="wd"><a href="#">温度</a></li>
  132. <li data-value="sd"><a href="#">湿度</a></li>
  133. <li data-value="aq"><a href="#">氨气</a></li>
  134. <li data-value="dn"><a href="#">地暖</a></li>
  135. </ul>
  136. </div>
  137. <div class="btn-group">
  138. <input type="text" id="dbrq1" class="form-control datepicker-here nB100Pre Wdate" readonly="readonly" value="$!dateTool.format('yyyy-MM-dd',$!nowDate)"/>
  139. </div>
  140. <div class="btn-group">
  141. <input type="text" id="dbrq2" class="form-control datepicker-here nB100Pre Wdate" readonly="readonly" value="$!dateTool.format('yyyy-MM-dd',$!nowDate)"/>
  142. </div>
  143. <input class="btn btn-default submit btn-success" type="button" value="对比"></nav>
  144. </div>
  145. <div id="chartContainer"></div>
  146. </div>
  147. </body>
  148. </html>