<template>
	<a-row :gutter="20">
		<a-col  span="4">
			<common-left-sider :menu_list="menu_list" :selected_key="[1]"
				@changeKey="changeKey"></common-left-sider>
		</a-col>
		<a-col span="20">
			<div style="width: 100%;background-color: #fff;height: calc(100vh - 100px);overflow: auto; padding: 10px;border-radius: 8px;">
				<meet-booking v-if="curKey == 1"></meet-booking>
				<meet-method  v-if="curKey == 2"></meet-method>
				<meet-guide  v-if="curKey == 3"></meet-guide>
				<meet-line  v-if="curKey == 4"></meet-line>
				<meet-green  v-if="curKey == 5"></meet-green>
				<meet-contact  v-if="curKey == 6"></meet-contact>
			</div>
		</a-col>
		<!-- <a-col  span="4">
			<a-list size="small" bordered :data-source="data" style="height: 294px">
				<template #renderItem="{ item }">
					<a-list-item>{{ item }}</a-list-item>
				</template>
				<template #header>
					<div>Header</div>
				</template>
			</a-list>
		</a-col> -->
	</a-row>
</template>
<script setup lang="ts">
	import { ref, computed, onMounted } from 'vue';
	import MeetBooking from '@/components/job/meet/booking/index.vue'
	import MeetMethod from '@/components/job/meet/method/index.vue'
	import MeetGuide from '@/components/job/meet/guide/index.vue'
	import MeetLine from '@/components/job/meet/line/index.vue'
	import MeetGreen from '@/components/job/meet/green/index.vue'
	import MeetContact from '@/components/job/meet/contact/index.vue'
	let companyList = ref<object[]>([{}, {}, {}, {}, {}, {}])
	let menu_list = ref([{ title: '招聘会预定', key: 1 },{ title: '企业参会方式', key: 2},{ title: '求职者参会指南', key: 3},{ title: '乘车路线', key: 4},{ title: '绿色通道', key: 5},{ title: '联系方式', key: 6}])
	let curKey = ref<Number>(1)
	const changeKey = (data) => {
		curKey.value = data.key;
	}
</script>

<style>
</style>