<template>
	<div class="pricemoitorrecord">
		<a-space class="search">
			<div class="silt-title">
				<span style="width: 70px; margin-right: 12px; display: block; line-height: 30px">{{ '站点名称' }}</span>
				<a-input style="width: 220px" v-model:value="tablePage.name" placeholder="请输入" />
			</div>
			<div class="btnBox">
				<a-button type="primary" class="primarySele" @click="onSearch"> 查询 </a-button>
				<a-button class="snowy-buttom-left" @click="onReset"> 重置 </a-button>
			</div>
		</a-space>
		<div class="list">
			<a-table :dataSource="tableData" :pagination="tablePage" :columns="tableColumns" @change="onChangePage">
				<template #bodyCell="{ column, record, index }">
					<template v-if="column.key === 'INDEX'">{{ index + 1 }}</template>
					<template v-else-if="column.key === 'locationSwitch'">
						<a-switch v-model:checked="record['locationSwitch']"
							@change="(ev) => onChangeRowPosSwitch(ev, record)"></a-switch>
					</template>
					<template v-else-if="column.key === '操作'">
						<a-button type="link" @click="onViewRow(record)">查看</a-button>
					</template>
				</template>
			</a-table>
		</div>
	</div>
</template>
<script setup name="positioningManagement">
import { ref } from 'vue'
import { useRouter } from 'vue-router'
import priceMoitorRecordApi from '@/api/basic.info/priceMoitorRecordApi'
onMounted(() => {
	getSearchData()
})
const router = useRouter()
const tableColumns = [
	{ title: '序号', key: 'INDEX' },
	{ title: '监测点名称', dataIndex: 'name' },
	{ title: '监测点地址', dataIndex: 'address' },
	{ title: '操作人', dataIndex: 'createUser' },
	{ title: '操作时间', dataIndex: 'createTime' },
	{ title: '定位开关', key: 'locationSwitch' },
	{ title: '操作', key: '操作' }
]
const tablePage = ref({
	name: '',
	current: 1,
	size: 10
})
const tableData = ref([{ locationSwitch: false }])

const onSearch = () => {
	getSearchData()
}
const onReset = () => {
	tablePage.value.name = ''
	tablePage.value.current = 1
	tablePage.value.size = 10
	getSearchData()
}
// 列表分页
const getSearchData = () => {
	let fd = JSON.parse(JSON.stringify(tablePage.value))
	fd.current = tablePage.value.current
	fd.size = tablePage.value.size
	priceMoitorRecordApi.priceMoitorRecordPage(fd).then((reg) => {
		tableData.value = []
		tableData.value = reg.records.map(item => {
			return {
				...item,
				locationSwitch: item.locationSwitch === 1 ? true : false
			}
		})
		tablePage.total = reg.total
	})
}
// 路由跳转
function onViewRow(val) {
	router.push({
		path: '/basic.info/pricemoitorrecordDetail',
		query: val
	})
}
function onChangePage(ev) {
	Object.assign(tablePage, ev)
	onSearch()
}
function onChangeRowPosSwitch(ev, row) {
	const params = {
		locationSwitch: null,
		priceMonitorId: row.id
	}
	if (ev) {
		params.locationSwitch = 1
	} else {
		params.locationSwitch = 0
	}
	priceMoitorRecordApi.addFrom(params).then((res) => {
		console.log(res, 'aaaa')
	})
	console.log(params, 'params')
}
</script>
<style lang="less" scoped>
.search {
	padding-top: 20px;
	padding-left: 50px;
	margin-bottom: 32px;

	.btnBox {
		display: inline-block;
		width: 200px;
		display: flex;
		justify-content: space-around;
		align-items: center;
	}
}

.silt-title {
	display: flex;
}
</style>
