<template>
	<div>
		<el-dialog v-model="dialogVisible" :close-on-click-modal="false" draggable width="1200px" height="500px">
			<el-card :body-style="cardBodyStyle">
				<el-input v-model="query" style="width: 200px; margin-right: 10px;" placeholder="请输入姓名"></el-input>
				<el-button type="primary" @click="search">查询</el-button>
			</el-card>
			<el-card :body-style="cardBodyStyle">
				<el-table :data="tableData" border highlight-current-row>
					<el-table-column v-for="(item, index) in column" :key="index" :prop="item.prop" :label="item.label"
						header-align="center" align="center" show-overflow-tooltip>
					</el-table-column>
					<el-table-column label="操作" header-align="center" align="center" show-overflow-tooltip
						width="200px">
						<template #default="scope">
							<el-button plain @click="handleSelect(scope.row)">选择</el-button>
						</template>
					</el-table-column>
				</el-table>
			<!-- 	<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="pageSizes"
					:total="totalRows" background="background" layout="total, sizes, prev, pager, next, jumper"
					@size-change="handleSizeChange" @current-change="handleCurrentChange">
				</el-pagination> -->
			</el-card>
		</el-dialog>
	</div>
</template>

<script setup>
	
	import {
		ref,
		getCurrentInstance
	} from 'vue'
	
	const {
		proxy
	} = getCurrentInstance()
	
	import tools from '@/tools'
	const cardBodyStyle = ref(tools.style.card)
	
	const dialogVisible = ref(false)
	const open = () => {
		dialogVisible.value = true 
	}
	const close = () => {
		dialogVisible.value = false 
	}
	 
	const props = defineProps({
		column: { // form查询项
			type: Array,
			default: () => []
		},
		tableData: { // form查询数据
			type: Array,
			default: () => []
		}
	})
	const query =ref('')

	const emit = defineEmits(['receiveFromChild'])
	const handleSelect = (row) => {
		
		emit('receiveFromChild', row)
		close()
	}

	defineExpose({
		open,
		close 
	})
</script>

<style>
</style>