<template>
    <div class="padding-sm">
        <el-form ref="queryForm" :inline="true">
			<el-form-item label="查询时间：" style="margin-bottom: 10px;">
				<el-date-picker
					v-model="searhDate"
					type="date"
					format="YYYY-MM-DD"
					value-format="YYYY-MM-DD"
					:clearable="false">
				</el-date-picker>
			</el-form-item>
			<el-form-item style="margin-bottom: 10px;">
				<el-button type="primary" class="margin-left-xs" @click="handleQuery">查询</el-button>
			</el-form-item>
        </el-form>
		<el-row :gutter="10" :loading="loading">
			<el-col :span="24">
				<el-card shadow="never" :body-style="{padding: '10px'}">
					<div class="text-center text-bold text-sm margin-bottom-xs">运行状态</div>
					<runTimeBar height="calc(30vh - 140px)" name="incinerator.state" :data="stateData"/>
				</el-card>
			</el-col>
			<template v-for="(item,index) in hisCharts" :key="index">
				<el-col :span="12" :xs="24" class="margin-top-sm">
					<el-card shadow="never" :body-style="{padding: '10px'}">
						<div class="text-center text-bold text-sm margin-bottom-xs">{{ item.data[0].name }}</div>
						<lineChart height="calc(35vh - 85px)" :name="item.data[0].key" :data="item"/>
					</el-card>
				</el-col>
			</template>
		</el-row>
    </div>
</template>

<script setup name="historyLog">
import { listSensor, getSensorHistoryData,  } from "@/api/Incinerator/sensorApi";
import { listHistoryLog } from "@/api/Incinerator/historyLogApi";
import lineChart from "@/components/Echarts/lineChart";
import runTimeBar from "@/components/Echarts/runTimeBar";
const { proxy } = getCurrentInstance();
const loading = ref(false);
const sensorList = ref([]);
const alarmLogList = ref([]);
const hisCharts = ref([]);
const stateData = ref([]);
const stateXais = ref([]);
const data = reactive({
	incineratorIn: {},
	searhDate: '2024-05-07',
	checkList: ["0a6"]
});
const { searhDate, checkList, incineratorIn } = toRefs(data);
/** 搜索按钮操作 */
function handleQuery() {
    getState();
    getHist();
}
// 根据焚烧炉查询传感器列表
function getSensor(){
	listSensor({
		incineratorSn: incineratorIn.value.incineratorSn
	}).then(response => {
		sensorList.value = response.rows;
		getState();
		getHist();
	});
}
function getHist(){    
	loading.value = true;
	hisCharts.value = [];
	if(sensorList.value.length){
		sensorList.value.forEach(item => {
			if(item.sensorName.indexOf("状态") == -1&&item.sensorName.indexOf("经纬度") == -1){
				getSensorHistoryData({
					startTime: searhDate.value + " 00:00:00",
					endTime: searhDate.value + " 23:59:59",
					sensorPath: item.sensorFullPath
				}).then(response => {
					let _measurements = JSON.parse(item.measurements);
					let _measurementsDescription = JSON.parse(item.measurementsDescription);
					let _unit = (item.unit != null&&item.unit.indexOf("[") != -1?JSON.parse(item.unit):[]);
					let _obja = response.data;
					for(let d=0;d<_measurements.length;d++){
						let _xAxis = [], _yAxis = [];
						if(_obja.length){
							_obja.forEach(hitem => {
								_xAxis.push(proxy.parseTime(hitem.timestamp,`{h}:{i}:{s}`));
								_yAxis.push(hitem.fields[d].stringValue);
							})
						}
						let _objPush = [{
							xAxis: _xAxis,
							name: "",
							unit: _unit[d],
							data: [{
								name: _measurementsDescription[d],
								data: _yAxis, 
								key: _measurements[d],
								type: 'line',
								smooth: true,
								color: "#55aaff",
								areaStyle: {}
							}]
						}];
						hisCharts.value = [...hisCharts.value, ..._objPush];
					}
				});
			}
		})
		loading.value = false;
	}
}
function getState(){
	let _nowT = parseInt(new Date(searhDate.value + " 00:00:00").getTime()/1000);
	listHistoryLog({
		pageNum: 1,
		pageSize: 999,
		orderByColumn: "usageStartTime",
		isAsc: "ascending",
		incineratorId: incineratorIn.value.id,
		usageStartTime: searhDate.value + " 00:00:00",
		usageEndTime: searhDate.value + " 23:59:59"
	}).then(response => {
		if(response.rows.length){
			let _obj = response.rows;
			let _arr = [];
			for(let i=0;i<(_obj.length-1);i++){
				let _stime = parseInt(new Date(_obj[i].usageStartTime).getTime()/1000);
				let _etime = parseInt(new Date(_obj[i].usageEndTime).getTime()/1000);
				let _stimei = parseInt(new Date(_obj[i+1].usageStartTime).getTime()/1000);
				let _etimei = parseInt(new Date(_obj[i+1].usageEndTime).getTime()/1000);
				if(i == 0&&_nowT<_stime){
					_arr.push({
						name: '停机',
						value: [0, _nowT, _stime, _stime - _nowT],
						itemStyle: {
							color: "#d80000"
						}
					});
				}
				_arr.push({
					name: '运行',
					value: [0, _stime, _etime, _etime - _stime],
					itemStyle: {
						color: "#37986c"
					}
				},{
					name: '停机',
					value: [0, _etime, _stimei, _stimei - _etime],
					itemStyle: {
						color: "#d80000"
					}
				});
			}
			getArr(_obj[_obj.length-1], _arr)
		}else{
			stateData.value = [{
				name: '停机',
				value: [0,0, 0,0],
				itemStyle: {
					color: "#d80000"
				}
			}];
		}
	});
}
function getArr(_row, _list){
	let _stime = parseInt(new Date(_row.usageStartTime).getTime()/1000);
	let _etime = parseInt(new Date(_row.usageEndTime).getTime()/1000);
	let _ymd = proxy.parseTime(new Date(),`{y}{m}{d}`);
	let _sd = searhDate.value.replace(/-/g,"");
	let _lastT = parseInt((_ymd == _sd?new Date().getTime():new Date(searhDate.value + " 23:59:59").getTime())/1000);
	_list.push({
		name: '运行',
		value: [0, _stime, _etime, _etime - _stime],
		itemStyle: {
			color: "#37986c"
		}
	});
	if(_etime != _lastT){
		_list.push({
			name: '停机',
			value: [0, _etime, _lastT, _lastT - _etime],
			itemStyle: {
				color: "#d80000"
			}
		});
	}
	stateData.value = _list;
}
function initialData() {
	searhDate.value = proxy.parseTime(new Date(),`{y}-{m}-{d}`);
	let _list = proxy.$store.state.data.analogList.filter(item => item.sn == proxy.$store.state.data.curAnalogSn);
	incineratorIn.value = _list.length?_list[0]:{};
	getSensor();
}
initialData();
watch(proxy.$store.state.data.curAnalogSn, (newValue) => {
	initialData();
});
</script>

