CQ_JD
/
read_opc


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
							<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>Document</title>
	</head>
	<body>
		<div id="main" style="width:100%;height:400px;margin:auto"></div>

		<script src="./echarts.min.js"></script>
        <script type="text/javascript" src="../luckysheet/dist/plugins/js/uni-webview-js0.0.3_index.js"></script>
		<script src="../jquery.min.js"></script>
		
		<script>
			function GetQueryString(name) {
				var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
				var r = window.location.search.substr(1).match(reg); //获取url中"?"符后的字符串并正则匹配
				var context = "";
				if (r != null)
					context = decodeURIComponent(r[2]);
				reg = null;
				r = null;
				return context == null || context == "" || context == "undefined" ? "" : context;
			}
		</script>

		<script>
			var option = {
				xAxis: {
					type: 'category',
					data: [],
					axisLabel: {
						formatter: function(value) {
							return value.substring(11, 19) + "\n" + value.substring(0, 10).split('-').join('')
						}
					}
				},
				yAxis: {
					type: 'value'
				},
				legend: {
					type: 'scroll',
					top: 0
				},
				tooltip: {
					trigger: 'axis',
					axisPointer: {
						type: 'cross',
						lineStyle: {
							type: 'dashed'
						},
						label: {
							show: false
						}
					},
					backgroundColor: 'rgba(255,255,255,0.1)', //通过设置rgba调节背景颜色与透明度
					position: 'inside',
					formatter: function(params) {
						let result = ''
						for (let i in params) {
							let value = '--'
							if (params[i].data !== null) {
								value = params[i].data
							}
							result += '<br>' + params[i].seriesName + '：' +
								value
						}
						return result
					}
				},
				dataZoom: [{
						type: 'inside',
						start: 90,
						end: 100
					},
					{
						type: 'slider',
						show: true,
						start: 90,
						end: 100,
						bottom: 10
					}
				],
				series: []
			};
		</script>

		<script>
			document.addEventListener('UniAppJSBridgeReady', function() {
				uni.getEnv(function(res) {
					const id = GetQueryString('id')
					const startTime = GetQueryString('startTime')
					const endTime = GetQueryString('endTime')
					const valueType = GetQueryString('valueType')
					const itemName = GetQueryString('itemName')
					const token = window.localStorage.getItem('C_TOKEN')

					var service, serviceTime

					$.ajax({
						url: '',
						type: 'GET',
						beforeSend: function(xhr) {
							this.url =
								// `http://192.168.0.41:8081/itemGroup/itemDataQuery?id=${id}&startTime=${startTime}&endTime=${endTime}&valueType=${valueType}`
							this.url = window.location.origin +
								`/itemGroup/itemDataQuery?id=${id}&startTime=${startTime}&endTime=${endTime}&valueType=${valueType}` 
							xhr.setRequestHeader("Authorization", "Bearer " +
								token);
							xhr.setRequestHeader("token", token);
						},
						success: (res) => {
							console.log(res)
							if (res.code === 200) {
								const {
									valueList,
									valueTimeList
								} = res.data
								const service = [{
									name: itemName,
									data: valueList,
									type: 'line'
								}]

								option.xAxis.data = valueTimeList
								option.series = service

								var chart = echarts.init(document.getElementById('main'));

								var lastOption = chart.getOption();
								if (lastOption != undefined) {
									option.dataZoom[0].start = lastOption.dataZoom[0].start
									option.dataZoom[0].end = lastOption.dataZoom[0].end
									option.dataZoom[1].start = lastOption.dataZoom[1].start
									option.dataZoom[1].end = lastOption.dataZoom[1].end
								}
console.log(option)
								chart.setOption(option)
							}
						}
					})
				})
			})
		</script>
	</body>
</html>