<style>
</style>

<template>
	<div class="app-container">
		<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch">
			<el-form-item>
				<el-date-picker v-model="date" align="right" type="date" placeholder="选择日期" value-format="yyyy/mm/dd"
					:clearable="false" :editable="false" @change="handleQuery">
				</el-date-picker>
			</el-form-item>
			<el-form-item>
				<el-time-select v-model="time" step="01:00" placeholder="选择时间" :clearable="false" :editable="false"
					@change="handleQuery">
				</el-time-select>
			</el-form-item>

			<el-form-item>
				<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
			</el-form-item>
		</el-form>


		<el-table border v-loading="loading" :data="hostExistKeyList">
			<el-table-column label="记录时间" align="center" prop="time" width="150px">
				<template #default="scope">
					<span>{{ parseTime(curAnalog.time, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
				</template>
			</el-table-column>
			<el-table-column label="机别" align="center" prop="机别">
				<template #default="scope">
					<span>{{scope.$index+1}}号主机</span>
				</template>
			</el-table-column>
			<el-table-column :label="`${item}（${getAnalogData(curAnalog,item,0).unit}）`" align="center" :prop="item"
				v-for="(item,i) in hostKeys" :key="i">
				<template #default="scope">
					<textValue :value="getAnalogData(curAnalog,item,scope.$index).value" />
				</template>
			</el-table-column>
		</el-table>

		<el-table border v-loading="loading" :data="dynamoExistKeyList" style="margin-top: 50px;">
			<el-table-column label="记录时间" align="center" prop="time" width="150px">
				<template #default="scope">
					<span>{{ parseTime(curAnalog.time, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
				</template>
			</el-table-column>
			<el-table-column label="机别" align="center" prop="机别">
				<template #default="scope">
					<span>{{scope.$index+1}}号发电机</span>
				</template>
			</el-table-column>
			<el-table-column :label="`${item}（${getAnalogData(curAnalog,item,0).unit}）`" align="center" :prop="item"
				v-for="(item,i) in dynamoKeys" :key="i">
				<template #default="scope">
					<textValue :value="getAnalogData(curAnalog,item,scope.$index).value" />
				</template>
			</el-table-column>
		</el-table>

	</div>
</template>

<script setup name="engineLog">
	import {
		ShipAnalog,
		ShipAnalogDescription,
		DynamoAnalog,
		HostAnalog,
		getHostExist,
		getHostName,
		// getDynamoExist,
		// getDynamoName,
		getAnalogData,
	} from "@/utils/analog"
	import {
		computed
	} from "vue";
	const {
		proxy
	} = getCurrentInstance();
	const date = ref(null)
	const time = ref(null)
	const showSearch = ref(true)
	const loading = ref(true)
	const hostExistKeyList = ref([])
	const dynamoExistKeyList = ref([])


	const data = reactive({
		queryParams: {
			sn: null,
			startTime: null,
			endTime: null,
		},
	});
	const {
		queryParams,
	} = toRefs(data);

	const curAnalog = computed(
		() =>
		proxy.$store.state.data.analogList.find(
			(item) => item.sn == proxy.$store.state.data.curAnalogSn
		) || {}
	);
	const hostKeys = computed(() => Object.keys(HostAnalog))

	const hostExist = computed(() => getHostExist(curAnalog.value))

	const dynamoKeys = computed(() => Object.keys(DynamoAnalog))

	const dynamoExist = computed(() => getDynamoExist(curAnalog.value))


	onMounted(() => {
		date.value = proxy.parseTime(new Date(), `{y}/{m}/{d}`);
		time.value = proxy.parseTime(new Date(), `{h}`) + `:00:00`;
		loading.value = false
	})

	const handleQuery = function() {}
</script>