1
0

cargo2_sensor.html 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Aisky-coffee</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  7. <!--新 Bootstrap4 核心 CSS 文件 -->
  8. <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.1.0/css/bootstrap.min.css">
  9. <!--jQuery文件。务必在bootstrap.min.js 之前引入 -->
  10. <script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
  11. <!--popper.min.js 用于弹窗、提示、下拉菜单-->
  12. <script src="https://cdn.bootcss.com/popper.js/1.12.5/umd/popper.min.js"></script>
  13. <!--最新的 Bootstrap4 核心 JavaScript 文件 -->
  14. <script src="https://cdn.bootcss.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
  15. <!--可用來建立使用者小圖示-->
  16. <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  17. <!--引入 echarts.js -->
  18. <script src="https://cdn.staticfile.org/echarts/4.3.0/echarts.min.js"></script>
  19. <script src='https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js'></script>
  20. <script src='https://cdnjs.cloudflare.com/ajax/libs/hammer.js/2.0.8/hammer.js'></script>
  21. <script src="https://cdnjs.cloudflare.com/ajax/libs/chartjs-plugin-zoom/0.3.0/Chart.Zoom.min.js"></script>
  22. <style>
  23. body {
  24. margin: 0;
  25. }
  26. .navbar-dark .navbar-nav .nav-link {
  27. color: white;
  28. cursor: pointer;
  29. text-decoration: none;
  30. width: 110px;
  31. height: 46px;
  32. }
  33. .nav-top {
  34. line-height: 40px;
  35. background-color: #C4C4C4;
  36. }
  37. .website_title {
  38. font-family: Roboto;
  39. font-style: normal;
  40. font-weight: normal;
  41. font-size: 30px;
  42. color: #000000;
  43. }
  44. .navbar-nav>li {
  45. float: none;
  46. display: inline-block;
  47. width: 100px;
  48. margin: 0 auto;
  49. text-align: center;
  50. }
  51. .navbar-nav>li a {
  52. font-size: 20px;
  53. }
  54. .main-page {
  55. margin-top: 200px;
  56. }
  57. .page-title {
  58. font-family: Roboto;
  59. font-style: normal;
  60. font-weight: bold;
  61. font-size: 36px;
  62. color: #000000;
  63. }
  64. .flex {
  65. display: flex;
  66. flex-direction: row;
  67. flex-wrap: wrap;
  68. justify-content: center;
  69. }
  70. .item-title {
  71. display: inline-block;
  72. margin-top: 20px;
  73. margin-left: 20px;
  74. font-family: Roboto;
  75. font-style: normal;
  76. font-weight: bold;
  77. font-size: 24px;
  78. color: #000000;
  79. }
  80. .set-schedule {
  81. width: 200px;
  82. height: 45px;
  83. background: #008CBA;
  84. border: 1px solid #CFCFCF;
  85. box-sizing: border-box;
  86. color: #FFFFFF;
  87. border-radius: 5px;
  88. font-size: 17px;
  89. margin-left: 20px;
  90. }
  91. .set-link {
  92. width: 300px;
  93. height: 100px;
  94. background: #008CBA;
  95. border: 1px solid #CFCFCF;
  96. box-sizing: border-box;
  97. color: #FFFFFF;
  98. border-radius: 5px;
  99. font-size: 36px;
  100. margin-left: 5px;
  101. margin-right: 5px;
  102. }
  103. .sensor_status {
  104. width: 300px;
  105. height: 250px;
  106. background: #FFFFFF;
  107. border: 1px solid #CFCFCF;
  108. box-sizing: border-box;
  109. color: #000000;
  110. border-radius: 5px;
  111. font-size: 24px;
  112. margin: auto;
  113. }
  114. .div_title {
  115. width: 100%;
  116. height: 80px;
  117. font-size: 1em;
  118. font-weight: bold;
  119. color: black;
  120. margin: 0 auto;
  121. display: table;
  122. text-align: center;
  123. transform: translate(0, 10%);
  124. }
  125. .td_in {
  126. font-size: 30px;
  127. margin-top: 10%;
  128. border-radius: 15px;
  129. text-align: center;
  130. background-color: #C4C4C4;
  131. width: 250px;
  132. height: 150px;
  133. margin: auto;
  134. line-height: 150px;
  135. cursor: pointer;
  136. }
  137. .show-info {
  138. position: absolute;
  139. background-color: #FFFFFF;
  140. border: 1px solid #949494;
  141. box-sizing: border-box;
  142. z-index: 3;
  143. left: 8%;
  144. }
  145. .show-info>h1 {
  146. text-align: center;
  147. }
  148. .show-chart {
  149. height: 500px;
  150. border: 2px solid #FFF;
  151. background: #C4C4C4;
  152. }
  153. .btn-input input {
  154. background: #008CBA;
  155. border: 1px solid #CFCFCF;
  156. box-sizing: border-box;
  157. border-radius: 5px;
  158. width: 120px;
  159. height: 58px;
  160. text-align: center;
  161. line-height: 58px;
  162. font-size: 20px;
  163. margin-top: 50px;
  164. color: #FFFFFF;
  165. }
  166. @media(max-width:373px) {
  167. .card {
  168. margin-right: 0px;
  169. }
  170. .col {
  171. padding-left: 0px;
  172. padding-right: 0px;
  173. }
  174. }
  175. @media(max-width:577px) {}
  176. @media(min-width:576px) {}
  177. @media(min-width:768px) {
  178. .navbar-nav>li {
  179. margin-left: 0px;
  180. }
  181. .navbar-nav .li-block {
  182. display: none;
  183. }
  184. }
  185. @media(min-width:991px) {
  186. .navbar-nav>li {
  187. margin-left: 20px;
  188. }
  189. .navbar-nav .li-block {
  190. display: none;
  191. }
  192. }
  193. @media(min-width:1200px) {
  194. .navbar-nav>li {
  195. margin-left: 50px;
  196. }
  197. .navbar-nav .li-block {
  198. display: inline-block;
  199. width: 100px;
  200. }
  201. }
  202. @media(min-width:1400px) {
  203. .navbar-nav .li-block {
  204. display: inline-block;
  205. width: 200px;
  206. }
  207. }
  208. @media(min-width:1689px) {
  209. .navbar-nav>li {
  210. margin-left: 50px;
  211. }
  212. .navbar-nav .li-block {
  213. display: inline-block;
  214. width: 500px;
  215. }
  216. }
  217. </style>
  218. </head>
  219. <body>
  220. <nav class="fixed-top">
  221. <nav class="navbar navbar-expand-md nav-top justify-content-center">
  222. <div>
  223. <span class="website_title">發酵槽{{params.tid}}</span>
  224. </div>
  225. </nav>
  226. <nav class="navbar navbar-expand-md bg-dark navbar-dark nav-bottom">
  227. <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
  228. <span class="navbar-toggler-icon"></span>
  229. </button>
  230. <div class="collapse navbar-collapse" id="collapsibleNavbar">
  231. <ul class="navbar-nav">
  232. <li class="nav-item">
  233. <a class="nav-link" href="/">首頁</a>
  234. </li>
  235. <li class="nav-item">
  236. <a class="nav-link" href="#">關於我們</a>
  237. </li>
  238. <li class="nav-item">
  239. <a class="nav-link" href="#">資訊</a>
  240. </li>
  241. <li class="nav-item">
  242. <a class="nav-link" href="#">聯絡方法</a>
  243. </li>
  244. <li class="nav-item">
  245. <a class="nav-link" href="/cargo_list">咖啡貨櫃</a>
  246. </li>
  247. <li class="nav-item">
  248. <a class="nav-link" href="/video">影像串流</a>
  249. </li>
  250. <li class="li-block"></li>
  251. <li class="nav-item">
  252. <a class="nav-link" href="#"><i class="fa fa-user-o"></i> {{params.username}}</a>
  253. </li>
  254. <li class="nav-item">
  255. <a class="nav-link" href="/logout">Logout</a>
  256. </li>
  257. </ul>
  258. </div>
  259. </nav>
  260. </nav>
  261. <div class="main-page">
  262. <div class="text-center">
  263. <h1>感測器狀態</h1>
  264. </div>
  265. <form method="" action="">
  266. <div class="container-fluid" style="margin-top:100px;">
  267. <div class="row">
  268. <div class="col flex">
  269. <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 col-xs-12"
  270. style="margin-right: 20px ; margin-top:20px; margin-bottom:20px;">
  271. <div class="page-title text-center">
  272. <div class="sensor_status">
  273. <div class="div_title" style="">
  274. <label>溫溼度</label>
  275. </div>
  276. <div class="td_in" style="" onclick="ShowInfo('溫濕度')">{{params.tank_tem.tem}}
  277. &#8451; </div>
  278. </div>
  279. </div>
  280. </div>
  281. <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 col-xs-12"
  282. style="margin-right: 20px ; margin-top:20px; margin-bottom:20px;">
  283. <div class="page-title text-center">
  284. <div class="sensor_status">
  285. <div class="div_title" style="">
  286. <label>二氧化碳</label>
  287. </div>
  288. <div class="td_in" style="" onclick="ShowInfo('二氧化碳')"></div>
  289. </div>
  290. </div>
  291. </div>
  292. <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 col-xs-12"
  293. style="margin-right: 20px ; margin-top:20px; margin-bottom:20px;">
  294. <div class="page-title text-center">
  295. <div class="sensor_status">
  296. <div class="div_title" style="">
  297. <label>酸鹼值</label>
  298. </div>
  299. <div class="td_in" style="" onclick="ShowInfo('酸鹼值')">{{params.tank_ph.ph}}</div>
  300. </div>
  301. </div>
  302. </div>
  303. <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 col-xs-12"
  304. style="margin-right: 20px ; margin-top:20px; margin-bottom:20px;">
  305. <div class="page-title text-center">
  306. <div class="sensor_status">
  307. <div class="div_title" style="">
  308. <label>攝影機</label>
  309. </div>
  310. <div class="td_in" style="" onclick="ShowInfo('攝影機')"></div>
  311. </div>
  312. </div>
  313. </div>
  314. <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 col-xs-12"
  315. style="margin-right: 20px ; margin-top:20px; margin-bottom:20px;">
  316. <div class="page-title text-center">
  317. <div class="sensor_status">
  318. <div class="div_title" style="">
  319. <label>大氣壓力</label>
  320. </div>
  321. <div class="td_in" style="" onclick="ShowInfo('大氣壓力')"></div>
  322. </div>
  323. </div>
  324. </div>
  325. <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 col-xs-12"
  326. style="margin-right: 20px ; margin-top:20px; margin-bottom:20px;">
  327. <div class="page-title text-center">
  328. <div class="sensor_status">
  329. <div class="div_title" style="">
  330. <label>超音波</label>
  331. </div>
  332. <div class="td_in" style="" onclick="ShowInfo('超音波')">{{params.tank_sonic.sonic}}
  333. </div>
  334. </div>
  335. </div>
  336. </div>
  337. <div class="col-xl-3 col-lg-6 col-md-6 col-sm-12 col-xs-12"
  338. style="margin-right: 20px ; margin-top:20px; margin-bottom:20px;">
  339. <div class="page-title text-center">
  340. <div class="sensor_status">
  341. <div class="div_title" style="">
  342. <label>EC值</label>
  343. </div>
  344. <div class="td_in" style="" onclick="ShowInfo('EC值')">{{params.tank_ec.ec}}</div>
  345. </div>
  346. </div>
  347. </div>
  348. <div id="" class="show-info col-xl-10 col-lg-10 col-md-10 col-sm-10 col-xs-10"
  349. style="display: none;">
  350. <br>
  351. <h1></h1>
  352. <center>
  353. 資料類型:
  354. <label><input type="checkbox" name="data-type" value="max">最大值</label>
  355. <label><input type="checkbox" name="data-type" value="avg">平均值</label>
  356. <label><input type="checkbox" name="data-type" value="min">最小值</label>
  357. <br>
  358. 時間間隔:
  359. <select name="time-interval" class="text-right">
  360. <option value="month">逐月</option>
  361. <option value="day">逐日</option>
  362. <option value="hour">逐時</option>
  363. </select>
  364. <span>從</span>
  365. <label for="querydate-start"></label><input id="querydate-start" type="date">
  366. <span>到</span>
  367. <label for="querydate-end"></label><input id="querydate-end" type="date">
  368. <span>為止</span>
  369. <input type="button" value="查詢" onclick="Echart('');">
  370. </center>
  371. <div class="row">
  372. <div class="col-1"></div>
  373. <div class="col-10 show-chart" style="margin-top: 10px;text-align:center;"></div>
  374. <div class="col-1"></div>
  375. </div>
  376. <div class="btn-input" style="text-align:center;">
  377. <input type="button" value="關閉" style="margin-left:0px;" onclick="CloseInfo()">
  378. <input class="" type="button" value="匯出">
  379. </div>
  380. </div>
  381. </div>
  382. </div>
  383. </div>
  384. </form>
  385. </div>
  386. </body>
  387. <script>
  388. var all_datetime = 0;
  389. var all_data = 0;
  390. var data_name = 0;
  391. var xAxis_data = 0;
  392. var max_data = 0;
  393. var min_data = 0;
  394. var avg_data = 0;
  395. // Benson:此段無畫圖表處, 先註解後續再解決 (有 Error)
  396. // Rita: 2021/07/26 研究中
  397. function Echart(evt) {
  398. if (Number({{ params.tid }}) < 10) {
  399. data_name = evt.substring(2);
  400. } else {
  401. data_name = evt.substring(3);
  402. };
  403. //將echarts圖形銷毀
  404. $(".show-chart").removeAttr("_echarts_instance_").empty();
  405. var sensor = evt.substring(2);
  406. if (!$("input[value=avg]").prop('checked') && !$("input[value=min]").prop('checked') && !$("input[value=max]").prop('checked')) {
  407. alert("請至少選擇一種資料類型!");
  408. return false;
  409. };
  410. if ($("#querydate-start").val() == '' || $("#querydate-end").val() == '') {
  411. alert("請選擇日期範圍!");
  412. return false;
  413. };
  414. //基於準備好的dom,初始化echarts例項
  415. var myChart = echarts.init(document.getElementsByClassName('show-chart')[0]); // class="col-10 show-chart"
  416. var date_start = $("#querydate-start").val();
  417. var date_end = $("#querydate-end").val();
  418. var avg = 0;
  419. var max = 0;
  420. var min = 0;
  421. var time_interval = $("select[name=time-interval]").val();
  422. var legend = new Array();
  423. var color = new Array();
  424. var series = new Array();
  425. if ($("input[value=max]").prop('checked')) {
  426. max = 1;
  427. legend.push("最大值");
  428. color.push("#1e88e5"); // 水藍色
  429. };
  430. if ($("input[value=avg]").prop('checked')) {
  431. avg = 1;
  432. legend.push("平均值");
  433. color.push("#43a047"); // 草綠色
  434. };
  435. if ($("input[value=min]").prop('checked')) {
  436. min = 1;
  437. legend.push("最小值");
  438. color.push("#e64a19"); // 橘紅色
  439. };
  440. var json = { 'evt': evt, 'avg': avg, 'max': max, 'min': min, 'time-interval': time_interval, 'date-start': date_start, 'date-end': date_end };
  441. $.get('/history_data', json, function (resText) {
  442. if (resText.max) {
  443. var max_series = { 'name': '最大值',
  444. 'type': 'line',
  445. 'data': resText.max.map(function (item) { return item[1]; }),
  446. 'itemStyle': { 'normal': { 'lineStyle': { 'color': '#1e88e5' } } }, };
  447. series.push(max_series); // 把上面的 dict 加入 series array 內
  448. xAxis_data = resText.max.map(function (item) { return item[0]; });
  449. max_data = resText.max.map(function (item) { return item[1]; });
  450. };
  451. if (resText.avg) {
  452. var avg_series = { 'name': '平均值', 'type': 'line', 'data': resText.avg.map(function (item) { return item[1]; }), 'itemStyle': { 'normal': { 'lineStyle': { 'color': '#43a047' } } }, };
  453. series.push(avg_series);
  454. xAxis_data = resText.avg.map(function (item) { return item[0]; });
  455. // console.log('xAxis_data' + xAxis_data) // 2021-07-09 10:00:00,2021-07-20 09:00:00,2021-07-22 15:00:00,2021-07-26 15:00:00,2021-07-26 16:00:00
  456. avg_data = resText.avg.map(function (item) { return item[1]; });
  457. // console.log('avg_data' + avg_data) // 91.0,98.0,11.0,15.2,30.5
  458. };
  459. if (resText.min) {
  460. var min_series = { 'name': '最小值', 'type': 'line', 'data': resText.min.map(function (item) { return item[1]; }), 'itemStyle': { 'normal': { 'lineStyle': { 'color': '#e64a19' } } }, };
  461. series.push(min_series);
  462. xAxis_data = resText.min.map(function (item) { return item[0]; }); // all
  463. min_data = resText.min.map(function (item) { return item[1]; }); // min
  464. };
  465. //獲取日期內所有數據
  466. all_datetime = resText.all.map(function (item) { return item[0]; }); // all
  467. all_data = resText.all.map(function (item) { return item[1]; });
  468. //指定圖表的配置項和資料
  469. option = {
  470. title: {
  471. text: 'Data History',
  472. left: '1%'
  473. },
  474. tooltip: {
  475. trigger: 'axis'
  476. },
  477. color: color,
  478. legend: {
  479. data: legend,
  480. },
  481. /*
  482. xAxis: {
  483. data: resText.map(function (item) {
  484. return item[0];
  485. })
  486. },
  487. */
  488. xAxis: {
  489. data: xAxis_data,
  490. },
  491. yAxis: {
  492. splitLine: {
  493. show: true,
  494. lineStyle: {
  495. color: ''
  496. }
  497. }
  498. },
  499. toolbox: {
  500. show: true,
  501. feature: {
  502. dataZoom: {
  503. yAxisIndex: 'none'
  504. },
  505. dataView: { readOnly: false },
  506. magicType: { type: ['line', 'bar'] },
  507. restore: {},
  508. saveAsImage: {}
  509. }
  510. },
  511. dataZoom: [{
  512. startValue: '2021-01-01'
  513. }, {
  514. type: 'inside'
  515. }],
  516. series: series,
  517. /*
  518. series: [
  519. {
  520. name: '最大值',
  521. type: 'line',
  522. data: resText.map(function (item) {
  523. return item[1];
  524. }),
  525. itemStyle: {
  526. normal: {
  527. lineStyle: {
  528. color: '#1e88e5'
  529. }
  530. }
  531. },
  532. },
  533. {
  534. name: '平均值',
  535. type: 'line',
  536. data: [20.0, 20.0, 20.0, 20.0, 20.0, 20.0],
  537. itemStyle: {
  538. normal: {
  539. lineStyle: {
  540. color: '#43a047'
  541. }
  542. }
  543. },
  544. },
  545. {
  546. name: '最小值',
  547. type: 'line',
  548. data: [15.0, 15.0, 15.0, 15.0, 15.0, 15.0],
  549. itemStyle: {
  550. normal: {
  551. lineStyle: {
  552. color: '#e64a19'
  553. }
  554. }
  555. }
  556. },
  557. ]
  558. */
  559. };
  560. //使用剛指定的配置項和資料顯示圖表
  561. myChart.setOption(option);
  562. }, 'json');
  563. };
  564. //下載檔案函數
  565. function downloadFile() {
  566. //藉型別陣列建構的 blob 來建立 URL
  567. let fileName = "fileName.csv";
  568. //"\ufeff"解決打開CSV中文亂碼問題
  569. const data = "\ufeff" + getData();
  570. let blob = new Blob([data], {
  571. type: 'text/csv,charset=UTF-8'
  572. });
  573. var href = URL.createObjectURL(blob);
  574. // 從 Blob 取出資料
  575. var link = document.createElement("a");
  576. document.body.appendChild(link);
  577. link.href = href;
  578. link.download = fileName;
  579. link.click();
  580. };
  581. //所有資料函數
  582. function getData() {
  583. var header = "日期," + data_name + "\n";
  584. var data = "";
  585. var length = all_datetime.length;
  586. for (var i = 0; i < length; i++) {
  587. data = data + all_datetime[i] + ',' + all_data[i] + '\n';
  588. };
  589. return header + data;
  590. };
  591. //最大最小平均資料函數
  592. function getData() {
  593. var header = data_name + "\n日期,";
  594. if (max_data) {
  595. console.log(max_data);
  596. header = header + "最大值,";
  597. };
  598. if (avg_data) {
  599. header = header + "平均值,";
  600. };
  601. if (min_data) {
  602. header = header + "最小值,";
  603. };
  604. header = header + "\n";
  605. var data = "";
  606. var length = xAxis_data.length;
  607. for (var i = 0; i < length; i++) {
  608. data = data + xAxis_data[i] + ',';
  609. if (max_data) {
  610. data = data + max_data[i] + ',';
  611. };
  612. if (avg_data) {
  613. data = data + avg_data[i] + ',';
  614. };
  615. if (min_data) {
  616. data = data + min_data[i] + ',';
  617. };
  618. data = data + '\n';
  619. };
  620. return header + data;
  621. };
  622. function ShowInfo(sensor) {
  623. $(".show-info").css('display', 'block');
  624. $(".show-info h1").text(sensor);
  625. $("input[value=查詢]").attr('onclick', 'Echart(\'{{params.tid}}' + '-' + sensor + '\')');
  626. $("input[value=匯出]").attr('class', 'DownloadBtn');
  627. let DownloadBtn = document.querySelector(".DownloadBtn");
  628. DownloadBtn.addEventListener("click", downloadFile);
  629. };
  630. function CloseInfo() {
  631. //將echarts圖形銷毀
  632. $(".show-chart").removeAttr("_echarts_instance_").empty();
  633. //將複選框已選定的移除
  634. $("input[value=avg]").prop('checked', false);
  635. $("input[value=min]").prop('checked', false);
  636. $("input[value=max]").prop('checked', false);
  637. //將時間間隔回到月
  638. $("select[name=time-interval]").val('month');
  639. //將已選好的日期移除
  640. $("#querydate-start").val('');
  641. $("#querydate-end").val('');
  642. $(".show-info").css('display', 'none');
  643. };
  644. </script>
  645. </html>