dataItem-wv.html 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162
  1. <!DOCTYPE html>
  2. <html lang="zh">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>标题</title>
  7. </head>
  8. <body>
  9. <div id="main" style="width:100%;height:400px;margin:auto"></div>
  10. <script src="./echarts.min.js"></script>
  11. <script type="text/javascript" src="../luckysheet/dist/plugins/js/uni-webview-js0.0.3_index.js"></script>
  12. <script src="../jquery.min.js"></script>
  13. <script src="./cqcyCode.js"></script>
  14. <script>
  15. function GetQueryString(name) {
  16. var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  17. var r = window.location.search.substr(1).match(reg); //获取url中"?"符后的字符串并正则匹配
  18. var context = "";
  19. if (r != null)
  20. context = decodeURIComponent(r[2]);
  21. reg = null;
  22. r = null;
  23. return context == null || context == "" || context == "undefined" ? "" : context;
  24. }
  25. </script>
  26. <script>
  27. var option = {
  28. xAxis: {
  29. type: 'category',
  30. data: [],
  31. axisLabel: {
  32. formatter: function(value) {
  33. return value.substring(11, 19) + "\n" + value.substring(0, 10).split('-').join('')
  34. }
  35. }
  36. },
  37. yAxis: {
  38. type: 'value'
  39. },
  40. legend: {
  41. type: 'scroll',
  42. top: 0
  43. },
  44. tooltip: {
  45. trigger: 'axis',
  46. axisPointer: {
  47. type: 'cross',
  48. lineStyle: {
  49. type: 'dashed'
  50. },
  51. label: {
  52. show: false
  53. }
  54. },
  55. textStyle:{
  56. color:'#ffffff'
  57. },
  58. confine: true,
  59. extraCssText: 'white-space: normal; word-break: break-all;',
  60. backgroundColor: 'rgba(108,106,120,0.9)',
  61. position: 'inside',
  62. // formatter: function(params) {
  63. // let result = ''
  64. // for (let i in params) {
  65. // let value = '--'
  66. // if (params[i].data !== null) {
  67. // value = params[i].data
  68. // }
  69. // result += '<br>' + params[i].seriesName + ':' +
  70. // value
  71. // }
  72. // return result
  73. // }
  74. },
  75. dataZoom: [{
  76. type: 'inside',
  77. start: 90,
  78. end: 100
  79. },
  80. {
  81. type: 'slider',
  82. show: true,
  83. start: 90,
  84. end: 100,
  85. bottom: 10
  86. }
  87. ],
  88. series: []
  89. };
  90. </script>
  91. <script>
  92. document.addEventListener('UniAppJSBridgeReady', function() {
  93. uni.getEnv(function(res) {
  94. const ids = GetQueryString('idList')
  95. const startTime = GetQueryString('startTime')
  96. const endTime = GetQueryString('endTime')
  97. const valueType = GetQueryString('valueType')
  98. const itemReadName = GetQueryString('itemReadName')
  99. const token = window.localStorage.getItem('C_TOKEN')
  100. var service=[], serviceTime
  101. let idList = JSON.parse(ids);
  102. idList = idList.map(temp=>temp).join(',');
  103. let queryParams={
  104. idList: idList,
  105. startTime: startTime,
  106. endTime: endTime,
  107. }
  108. $.ajax({
  109. url: baseUrl + '/itemGroup/getItemListValue',
  110. type: 'GET',
  111. data: queryParams,
  112. beforeSend: function(xhr) {
  113. // this.url =
  114. // `http://192.168.0.12:8081/itemGroup/getItemListValue`
  115. // this.url = window.location.origin +
  116. // `/itemGroup/getItemListValue?id=${id}&startTime=${startTime}&endTime=${endTime}`
  117. xhr.setRequestHeader("Authorization", "Bearer " +
  118. token);
  119. xhr.setRequestHeader("token", token);
  120. },
  121. success: (res) => {
  122. if (res.code === 200) {
  123. let valueList=[],valueTimeList=[];
  124. if(res.data.length>0){
  125. valueTimeList = res.data[0].dataTimeList;
  126. for(let dataList of res.data){
  127. let seriesData = {
  128. type:'line',
  129. name:dataList.describe!=null ? dataList.describe:dataList.itemReadName,
  130. data:dataList.dataValueList
  131. }
  132. service.push(seriesData)
  133. }
  134. option.xAxis.data = valueTimeList
  135. option.series = service
  136. var chart = echarts.init(document.getElementById('main'));
  137. var lastOption = chart.getOption();
  138. if (lastOption != undefined) {
  139. option.dataZoom[0].start = lastOption.dataZoom[0].start
  140. option.dataZoom[0].end = lastOption.dataZoom[0].end
  141. option.dataZoom[1].start = lastOption.dataZoom[1].start
  142. option.dataZoom[1].end = lastOption.dataZoom[1].end
  143. }
  144. chart.setOption(option)
  145. }
  146. }
  147. }
  148. })
  149. })
  150. })
  151. </script>
  152. </body>
  153. </html>