<template>
	<SearchBox ref="SearchBoxRef" formName="top" :formData="query" @showPop="showPop" @reset="reset"></SearchBox>

	<ButtonBox @search="handleSearch" @add="handleAdd" @remove="handleRemoveBatch" @edit="handleEditBatch"
		@upload="handleUpload" @download="handleDownload" @import="handleImport" @export="handleExport"></ButtonBox>

	<TableBox ref="TableBoxRef" :tableData="data" @edit="handleEdit" @remove="handleRemove" :page="pageType"
		:paramType="paramType" :url="url" :param="query"></TableBox>

	<FormBox ref="FormBoxRef" formName="input" :formData="form" dialog @save="handleSave" @showUser="showPop"></FormBox>

	<PopupUser ref="PopupUserRef" @receiveFromChild="getUser"></PopupUser>
</template>

<script setup>
	import {
		ref,
		reactive,
		onMounted,
		getCurrentInstance
	} from 'vue'
	const {
		proxy
	} = getCurrentInstance()
	import style from '@/tools/style'
	const cardBodyStyle = ref(style.card)

	import SearchBox from '@/components/SearchBox.vue'
	const SearchBoxRef = ref(null)
	const query = ref({
		name: '',
		birthDate: '',
		age: '',
		contractType: '',
		contractFlag: '',
		addTime: ['', ''],
	})

	onMounted(() => {
		//如果按类型接收   int 必须不能为空
		paramType.value = 'json'
		pageType.value = true

		//分页
		if (pageType) {
			if (paramType.value == 'String') {
				url.value = 'exp/Search/paramStringPage'
			} else {
				url.value = 'exp/Search/paramJsonPage'
			}
		} else { //不分页
			if (paramType.value == 'String') {
				url.value = 'exp/Search/paramString'
			} else {
				url.value = 'exp/Search/paramJson'
			}
		}
	})

	import ButtonBox from '@/components/ButtonBox.vue'
	const ButtonBoxRef = ref(null)

	const reset = () => {
		Object.keys(query.value).map(key => {
			query.value[key] = ''
		})
	}

	const pageType = ref(true)
	const paramType = ref('')
	const url = ref('')

	const handleSearch = () => {


		TableBoxRef.value.search()
	}

	import TableBox from '@/components/TableBox.vue'
	const TableBoxRef = ref(null)


	import FormBox from '@/components/FormBox.vue'
	const FormBoxRef = ref(null)


	const handleAdd = () => {
		FormBoxRef.value.open()
	}
	const form = ref({
		birthDate: '',
		type: '',
		code: '',
		name: '',
		sex: '',
		contractType: '',
		contractFlag: '',
	})

	import PopupUser from '@/components/PopupUser.vue'
	const PopupUserRef = ref(null)
	const showPop = () => {
		PopupUserRef.value.open()
	}
	const getUser = (val) => {
		console.log(val.userDesc)
		query.value.name = val.userDesc
		form.value.name = val.userDesc
	}
 
	const param = ref({
		params: JSON.stringify(query.value)
	})

	const handleEdit = (row) => {
		// console.log(JSON.stringify(row))
		form.value = row
		FormBoxRef.value.open()
	}
	const handleRemove = (row) => {
		console.log(JSON.stringify(row))
	}

	const handleEditBatch = () => {
		if (TableBoxRef.value.multipleSelection.length != 1) {
			ElMessage({
				type: 'warning',
				message: '请选择一条数据编辑!'
			})
			return
		}
		handleEdit(TableBoxRef.value.multipleSelection[0])
	}


	const handleSave = () => {
		console.log(JSON.stringify(FormBoxRef.value.form))
		FormBoxRef.value.close()
	}
</script>

<style>
</style>