<template>
	<a-form  :model="commomParams.search">
		<a-row :gutter="[10]">
			<a-col span="6">
				<a-form-item>
					<a-select v-model:value="commomParams.search.type_id" @change="typeChange" placeholder="请选择家政类型">
						<a-select-option v-for="item in type_list" :key="item.id"
							:value="item.id">{{item.name}}</a-select-option>
					</a-select>
				</a-form-item>
			</a-col>
			<a-col span="6">
				<a-form-item>
					<a-select v-model:value="commomParams.search.sex" @change="typeChange" placeholder="请选择性别">
						<a-select-option v-for="item in [{name: '男',value: 1}, {name: '女', value: 2}, {name: '不限', value: 3}]" :key="item.value"
							:value="item.value">{{item.name}}</a-select-option>
					</a-select>
				</a-form-item>
			</a-col>
			<a-col span="6">
				<a-form-item>
					<a-xuanze :dict="2006" placeholder="请选择学历" @saveSelect="saveDegree"
						:select_content="commomParams.search.degree"></a-xuanze>
				</a-form-item>
			</a-col>
			<a-col span="6">
				<a-form-item >
					<a-xuanze :dict="2005" placeholder="请选择月薪要求范围" @saveSelect="savePayRange"
						:select_content="commomParams.search.pay_range"></a-xuanze>
				</a-form-item>
			</a-col>
			<a-col>
				<a-form-item>
					<a-button type="primary" @click="getData">
						搜索
					</a-button>
				</a-form-item>
			</a-col>
			<a-col>
				<a-form-item>
					<a-button danger @click="clearSearch">
						清空搜索
					</a-button>
				</a-form-item>
			</a-col>
		</a-row>
	</a-form>
</template>

<script lang="ts" setup>
	import { ref, onMounted, watch, computed } from 'vue';
	import { GetHousekeepingtypeList } from '@/apis/models';
	import { useCommon } from '@/hooks/useCommon';
	let { commomParams } = useCommon();
	let props = defineProps(['search_params']);
	const emit = defineEmits();
	watch(() => props.search_params, (newVal) => {
		console.log(newVal)
	})

	interface listType {
		type_id : Number | String,
		sex: Number | String,
		degree:  Number | 0,
		pay_range: Number | 0,
		status:  Number | 0
	}

	commomParams.value.search = commomParams.value.search as listType;
	commomParams.value.search.type_id = '请选择家政管理';
	commomParams.value.search.sex = '男';
	commomParams.value.search.degree = 0;
	commomParams.value.search.pay_range = 0;
	commomParams.value.search.status = 0;
	
	onMounted(() => {
		getHousekeepingtypeList()
	})
	
	// 家政类型
	let type_list = ref([])
	const getHousekeepingtypeList = (val) => {
		GetHousekeepingtypeList({ keyword: val }).then(res => {
			type_list.value = res.data.housekeepingtypes;
		})
	}
	const typeChange = (val) => {
		commomParams.value.search.type_id = val;
	}
	
	// 学历
	const saveDegree = (data) => {
		commomParams.value.search.degree = data.val.key;
	}
	// 薪资范围
	const savePayRange = (data) => {
		commomParams.value.search.pay_range = data.val.key;
	}
	
	

	const getData = () => {
		emit('searchData', commomParams.value.search)
	}

	// 清空搜索
	const clearSearch = () => {
		commomParams.value.search = {
			page: 1,
			pagesize: 10,
			sort: 'id',
			sortby: 'asc',
			keyword: ''
		}
		emit('clearData', commomParams.value.search)
	}
</script>

<style>
</style>