<template>
	<div>
		<el-table :data="props.list" style="width: 100%">
			<el-table-column prop="areaName" label="区县" />
			<el-table-column prop="day" :label="props.month" width="120" />
			<el-table-column label="新建商品房成交套数">
				<el-table-column prop="saleCount" show-overflow-tooltip label="套数" width="90">
					<template #default="scope">
						<div class="nones" :class="scope.row.saleCounttag==1?'redbg':''">
							{{scope.row.saleCount}}
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="saleResCount" show-overflow-tooltip label="其中：住宅" width="110">
					<template #default="scope">
						<div class="nones" :class="scope.row.saleResCounttag==1?'redbg':''">
							{{scope.row.saleResCount}}
						</div>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="新建商品房成交面积">
				<el-table-column prop="saleArea" show-overflow-tooltip label="（㎡）" width="90">
					<template #default="scope">
						<div class="nones" :class="scope.row.saleAreatag==1?'redbg':''">
							{{scope.row.saleArea}}
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="saleResArea" show-overflow-tooltip label="其中：住宅" width="110">
					<template #default="scope">
						<div class="nones" :class="scope.row.saleResAreatag==1?'redbg':''">
							{{scope.row.saleResArea}}
						</div>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="新建商品房成交金额">
				<el-table-column prop="saleAmount" show-overflow-tooltip label="（万元）" width="90">
					<template #default="scope">
						<div class="nones" :class="scope.row.saleAmounttag==1?'redbg':''">
							{{scope.row.saleAmount}}
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="saleResAmount" show-overflow-tooltip label="其中：住宅" width="110">
					<template #default="scope">
						<div class="nones" :class="scope.row.saleResAmounttag==1?'redbg':''">
							{{scope.row.saleResAmount}}
						</div>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="二手房成交套数">
				<el-table-column prop="secondCount" show-overflow-tooltip label="套数" width="90">
					<template #default="scope">
						<div class="nones" :class="scope.row.secondCounttag==1?'redbg':''">
							{{scope.row.secondCount}}
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="secondResCount" show-overflow-tooltip label="其中：住宅" width="110">
					<template #default="scope">
						<div class="nones" :class="scope.row.secondResCounttag==1?'redbg':''">
							{{scope.row.secondResCount}}
						</div>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="二手房成交面积">
				<el-table-column prop="secondArea" show-overflow-tooltip label="（㎡）" width="90">
					<template #default="scope">
						<div class="nones" :class="scope.row.secondAreatag==1?'redbg':''">
							{{scope.row.secondArea}}
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="secondResArea" show-overflow-tooltip label="其中：住宅" width="110">
					<template #default="scope">
						<div class="nones" :class="scope.row.secondResAreatag==1?'redbg':''">
							{{scope.row.secondResArea}}
						</div>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="二手房成交金额">
				<el-table-column prop="secondAmount" show-overflow-tooltip label="（万元）" width="90">
					<template #default="scope">
						<div class="nones" :class="scope.row.secondAmounttag==1?'redbg':''">
							{{scope.row.secondAmount}}
						</div>
					</template>
				</el-table-column>
				<el-table-column prop="secondResAmount" show-overflow-tooltip label="其中：住宅" width="110">
					<template #default="scope">
						<div class="nones" :class="scope.row.secondResAmounttag==1?'redbg':''">
							{{scope.row.secondResAmount}}
						</div>
					</template>
				</el-table-column>
			</el-table-column>
			<el-table-column label="操作" show-overflow-tooltip width="70" fixed="right">
				<template #default="scope">
					<el-button v-if="scope.row.areaCode!='370700'" size="small" @click="remove(scope.row)" text
						type="primary">退回</el-button>
				</template>
			</el-table-column>
		</el-table>
	</div>
</template>

<script setup lang="ts">
	import { defineProps } from 'vue';
	import { getday } from "/@/api/report/day";
	const emit = defineEmits(["removeshow"]);

	const remove = (row : any) => {
		emit("removeshow", row.id);
	}

	const props = defineProps({
		list: {
			type: Array,
			default: [],
		},
		month: {
			type: String,
			default: '',
		}
	});
</script>

<style scoped lang="scss">
	.redbg {
		background-color: #ffaba0;
	}

	.nones {
		text-align: center;
		width: 100%;
		height: 100%;
	}
</style>