<template>
	<div class="synthesis-table-container">
		<div class="synthesis-table-header">
			<MOSTY.Assort title="甘肃省烟预警指标明细"></MOSTY.Assort>
			<el-button type="primary" @click="handleConfig">配置</el-button>
		</div>
		<el-table :data="tableData" style="width: 100%;">
			<el-table-column prop="name" label="评估项目" />
			<el-table-column prop="value" label="预警" />
			<el-table-column prop="score" label="指标名称" />
			<el-table-column prop="score" label="得分" />
		</el-table>
		<SynthesisConf v-if="isShowConf" @ok="configOk" @close="configClose" />
	</div>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import SynthesisConf from './synthesisConf.vue';
import { ref } from 'vue';

const isShowConf = ref(false);
const tableData = ref([
	{ name: '评估项目', value: '预警', score: '指标名称', score: '得分' },
	{ name: '评估项目', value: '预警', score: '指标名称', score: '得分' },
	{ name: '评估项目', value: '预警', score: '指标名称', score: '得分' },
	{ name: '评估项目', value: '预警', score: '指标名称', score: '得分' },
]);
const handleConfig = () => {
	console.log('配置');
	isShowConf.value = true;
};
const configOk = () => {
	isShowConf.value = false;
};
const configClose = () => {
	isShowConf.value = false;
};
</script>

<style lang="scss" scoped>
.synthesis-table-container {
	width: 100%;
	height: 100%;
	padding: 0 10px 10px;
	background-color: #fff;

	.synthesis-table-header {
		display: flex;
		align-items: center;
	}
}
</style>
