<template>
	<div class="content-padding-inline" style="margin: 30px 0;">
		<a-row :gutter="[10,10]" type="flex" justify="center">
			<a-col span="18">
				<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); overflow: auto; padding: 10px;border-radius: 10px;">
							<invite-position :job_id="job_id" v-if="curKey == 1"  @send="send"></invite-position>
							<invite-manage v-if="curKey == 2" @toEdit="toEdit"></invite-manage>
							<invite-recycle v-if="curKey == 3"></invite-recycle>
						</div>
					</a-col>
				</a-row>
			</a-col>
		</a-row>
	</div>
</template>

<script setup lang="ts">
	import { ref, computed, onMounted, createVNode } from 'vue';
	import InvitePosition from '@/components/company/invite/position/index.vue'
	import InviteManage from '@/components/company/invite/manage/index.vue'
	import InviteRecycle from '@/components/company/invite/recycle/index.vue'
	import { useCommon } from '@/hooks/useCommon';
	let { store, ExclamationCircleOutlined, Modal } = useCommon();
	let menu_list = ref([{ title: '发布招聘', key: 1 }, { title: '招聘职位管理', key: 2 }, { title: '招聘回收站', key: 3 }])
	let curKey = ref<Number>(1)
	let selectedKeys = ref<Number[]>([1])
	let job_id = ref<Number>(0)


	const changeKey = (data) => {
		if (data.key != 1 && job_id.value != 0) {
			Modal.confirm({
				title: '有内容在进行编辑，是否要退出当前编辑',
				icon: createVNode(ExclamationCircleOutlined),
				content: '当前编辑内容不会保存',
				okText: '退出',
				cancelText: '取消',
				onOk() {
					job_id.value = 0
					curKey.value = data.key;
				},
				onCancel() {
					console.log('Cancel');
				},
			});
		} else {
			curKey.value = data.key;
		}
	}

	const toEdit = (data) => {
		curKey.value = 1;
		selectedKeys.value = [1]
		job_id.value = data.record.id
	}

	const send = () => {
		curKey.value = 2;
		selectedKeys.value = [2]
		job_id.value = 0
	}
</script>

<style>
</style>