<script setup lang="ts">
import configs from "@@/config"
import VbCommonReport from "@@@/reports/VbCommonReport.vue"
import apis from "@a"

const opts = reactive({
	title: "设备故障统计报表",
	cycleType: "M",
	columns: [
		{
			field: configs.TABLE_INDEX_FIELD,
			name: "序号",
			width: 40,
			visible: true,
			tooltip: true
		},
		{ field: "deviceName", name: "设备名称", width: 120, tooltip: true },
		{ field: "failureDuration", name: "故障时长（时）", width: 120, isSort: true, tooltip: true },
		{ field: "sickDuration", name: "带病时长（时）", width: 120, isSort: true, tooltip: true },
		{ field: "goodDuration", name: "完好时长（时）", width: 120, isSort: true, tooltip: true }
	],
	searchItems: [
		{
			field: "deviceName",
			label: "设备名称",
			class: "w-100",
			required: false,
			placeholder: "请输入设备名称",
			component: "I",
			props: {
				clearable: true
			}
		}
	] as any[],
	queryParams: {
		deviceName: undefined
	},
	tableListFun: apis.device.reportApi.queryFault,
	genReportFun: apis.device.reportApi.generateFault
})
</script>

<template>
	<div class="app-container py-5">
		<VbCommonReport
			:title="opts.title"
			:cycle-type="opts.cycleType as 'Y' | 'Q' | 'M' | 'D' | 'W' | 'ALL'"
			:columns="opts.columns"
			:width="900"
			:search-items="opts.searchItems"
			:search-data="opts.queryParams"
			:table-list-fun="opts.tableListFun"
			:gen-report-fun="opts.genReportFun" />
	</div>
</template>
