<template>
	<!-- 位置信息管理 -->
	<div class="pricemoitorrecord">
		<a-card :bordered="false">
			<div style="cursor: pointer; width: 80px" @click="delCode"><left-outlined />返回</div>
			<br />
			<a-space class="search">
				<div class="silt-title">
					<span style="width: 70px; margin-right: 8px; text-align: right; display: block; line-height: 30px">{{
						'仓房名称'
					}}</span>
					<a-input style="width: 220px" v-model:value="SearchFormDel.cfmc" placeholder="请输入" />
				</div>
				<div class="silt-title">
					<span style="width: 70px; margin-right: 8px; text-align: right; display: block; line-height: 30px">{{
						'品种'
					}}</span>
					<a-input style="width: 220px" v-model:value="SearchFormDel.lspzName" placeholder="请输入" />
				</div>
				<div class="silt-title">
					<span style="width: 70px; margin-right: 8px; text-align: right; display: block; line-height: 30px">{{
						'性质'
					}}</span>
					<a-input style="width: 220px" v-model:value="SearchFormDel.lsxzName" placeholder="请输入" />
				</div>
				<div class="silt-title">
					<span style="width: 70px; margin-right: 8px; text-align: right; display: block; line-height: 30px">{{
						'等级'
					}}</span>
					<a-select style="width: 220px" v-model:value="SearchFormDel.lsdjName">
						<a-select-option :value="'一等'">一等</a-select-option>
						<a-select-option :value="'二等'">二等</a-select-option>
						<a-select-option :value="'三等'">三等</a-select-option>
					</a-select>
				</div>
			</a-space>
			<div class="btnBox">
				<a-button type="primary" class="primarySele" @click="Search"> 查询 </a-button>
				<a-button class="snowy-buttom-left primarySele" @click="onReset"> 重置 </a-button>
			</div>
		</a-card>

		<div class="list" style="margin-top: 10px">
			<a-table :dataSource="tableData" :pagination="pagination" :columns="tableColumns">
				<template #bodyCell="{ column, record }">
					<template v-if="column.key === '操作'">
						<a-button type="link" @click="onView('view', record)">查看</a-button>
					</template>
				</template>
			</a-table>
		</div>
	</div>
</template>
<script setup>
	import business from '@/api/security/index.js'
	import { listPagination } from '@/hook/listlistPagination.js'

	import { reactive, ref, watch } from 'vue'
	import { useRouter, useRoute } from 'vue-router'
	import { defineComponent } from 'vue'
	const formRef = ref(null)
	const router = useRouter()
	const route = useRoute()
	const tableColumns = [
		{
			title: '序号',
			dataIndex: 'Index',
			align: 'center',
			width: '5%',
			customRender: ({ text, record, index }) => {
				return `${index + 1}`
			}
		},
		{ title: '库区名称', align: 'center', dataIndex: 'orgName' },
		{ title: '仓房名称', align: 'center', dataIndex: 'storeHouseName' },
		{ title: '货位名称', align: 'center', dataIndex: 'warehouseName' },
		{ title: '品种', align: 'center', dataIndex: 'pzName' },
		{ title: '性质', align: 'center', dataIndex: 'xzName' },
		{ title: '数量', align: 'center', dataIndex: 'dbsl' },
		{ title: '等级', align: 'center', dataIndex: 'djName' },
		{ title: '操作', width: '20%', align: 'center', key: '操作' }
	]

	const { DEl, change, tableData, onSearch, handlePageChange, pagination, Search, onReset, SearchFormDel } =
		listPagination(
			{ cfmc: '', lspzName: '', lsxzName: '', lsdjName: '' },
			business.TJFXviewPage,
			{},
			{ sortOrder: 'ASCEND', orgId: route.query.orgId },
			'2'
		)
	const delCode = () => {
		router.back()
	}

	// 查看表单数据
	const onView = (record, row) => {
		switch (record) {
			case 'add':
				router.push('/security/tables')
				break
			case 'del':
				DEl(row)
				break
			case 'view':
				router.push(`/security/tables?id=${row.id}&codeOOPP=${true}`)
				break
			case 'edit':
				break
			case 'application':
				application(row)
				break
			default:
				// router.push('/business/personnelDel')
				break
		}
	}
	watch(
		() => route.query.codeAkk,
		async (newVal) => {
			const codeDel = route.query.codeAkk
			if (codeDel == 1) {
				// console.log(3)
			} else if (Boolean(route.query.codeAkk) == true) {
				// console.log(3)
				onSearch({ orgId: route.query.orgId, current: 1, size: 5 })
			} else {
				// console.log(3)
			}
		},
		{ immediate: true, deep: true }
	)
</script>
<style lang="less" scoped>
	.search {
		padding-top: 20px;
		// padding-left: 50px;
		margin-bottom: 32px;
	}
	.btnBox {
		width: 100%;
		display: inline-block;
		display: flex;
		// justify-content: space-around;
		align-items: center;
		.primarySele {
			margin-left: 20px;
			margin-right: 20px;
		}
	}
	.silt-title {
		display: flex;
	}
</style>
