<template>
	<a-row :gutter="20">
		<a-col  span="4">
			<common-left-sider :menu_list="menu_list" :selected_key="selectedKeys"
				@changeKey="changeKey"></common-left-sider>
		</a-col>
		<a-col span="20">
			<div style="width: 100%;background-color: #fff;height: calc(100vh - 100px);padding: 10px;border-radius: 8px;">
				<download v-if="curKey" :key_id="curKey"></download>
			</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, onMounted, computed, watch, onBeforeUnmount } from 'vue';
	import Download from '@/components/download/index.vue'
	let menu_list = ref([{ title: '个人求职', key: 10 },{ title: '企业招聘', key: 11},{ title: '应届毕业生', key: 12},{ title: '人才入户', key: 13},{ title: '其他下载', key: 14}])
	let curKey = ref<Number>(10)
	let selectedKeys = ref<Number[]>([10])
	const changeKey = (data) => {
		curKey.value = data.key;
	}
	
	onMounted(() => {
		if (sessionStorage.getItem('section_id')) {
			selectedKeys.value = [sessionStorage.getItem('section_id')]
		}
	})
	
	onBeforeUnmount(() => {
		sessionStorage.removeItem('section_id')
		sessionStorage.removeItem('acticle_id')
	})
</script>

<style>
</style>