<template>
	<div class="content-padding-inline" style="margin: 30px 0;">
		<a-row :gutter="[20,20]" type="flex" justify="center">
			<a-col span="18">
				<div style="width: 100%; background-color: #fff;border-radius: 8px;">
					<a-list item-layout="vertical">
						<a-list-item>
							<a-list-item-meta>
								<template #title>
									{{basic.seekername}}
									<a-button type="link" @click="toResume" class="main-color">
										<EditOutlined style="color: #4FBE70" />修改简历
									</a-button>
								</template>
								<template #description>
									<div>
										会员编号：{{basic.id}}
									</div>
								</template>
								<template #avatar>
									<a-avatar :src="imageprefix+basic.photo" :size="96" />
								</template>
							</a-list-item-meta>
							<div style="margin-left: 108px;">
								<a-descriptions :column="3">
									<a-descriptions-item
										label="登录账号">{{basic.mobile ? basic.mobile : '未知'}}</a-descriptions-item>
									<a-descriptions-item><a-button @click="detail(basic)" type="link"
											class="main-color">
											<FileSearchOutlined style="color: #4FBE70" />预览简历
										</a-button></a-descriptions-item>
									<a-descriptions-item label="简历是否可见">
										<a-switch @change="changeResumeState" v-model:checked="createForm.hide_resume"
											:checkedValue="1" :unCheckedValue="2" checked-children="开"
											un-checked-children="关"></a-switch>
									</a-descriptions-item>
									<a-descriptions-item label="QQ">
										{{basic.qq ? basic.qq : '未填写'}}
									</a-descriptions-item>
									<a-descriptions-item>
										<a-button type="link" class="main-color" @click="refreshResume">
											<RedoOutlined style="color: #4FBE70" :spin="refreshing" rotate="90" />刷新简历
										</a-button>
									</a-descriptions-item>
									<a-descriptions-item label="简历是否在家政可见">
										<a-switch @change="changeResumeState"
											v-model:checked="createForm.house_keeping_status" :checkedValue="1"
											:unCheckedValue="2" checked-children="开" un-checked-children="关"></a-switch>
									</a-descriptions-item>
									<a-descriptions-item label="电子邮箱">
										{{basic.email ? basic.email : '未填写'}}
									</a-descriptions-item>
									<a-descriptions-item label="简历被查看次数">
										{{seeLength}}次
									</a-descriptions-item>
									<a-descriptions-item label="是否接收面试邀请通知">
										<a-switch @change="changeResumeState"
											v-model:checked="createForm.remind_interview" :checkedValue="1"
											:unCheckedValue="2" checked-children="开" un-checked-children="关"></a-switch>
									</a-descriptions-item>
									<a-descriptions-item :span="3" label="关注公众号，接收面试消息">
										<image-container
											:imgObj="{src: '/images/gongzhonghao.png',width: '50px',height:'50px'}" :need="true"></image-container>
									</a-descriptions-item>
								</a-descriptions>
							</div>
						</a-list-item>
					</a-list>
				</div>
			</a-col>
			<a-col span="18">
				<a-tabs v-model:activeKey="activeKey" @change="activeKeyChange" type="card">
					<a-tab-pane :key="1" tab="面试记录">
						<invite-interview v-if="activeKey == 1"></invite-interview>
					</a-tab-pane>
					<a-tab-pane :key="2" tab="投递记录" force-render>
						<invite-apply v-if="activeKey == 2"></invite-apply>
					</a-tab-pane>
					<a-tab-pane :key="3" tab="谁看过我">
						<invite-seeme v-if="activeKey == 3"></invite-seeme>
					</a-tab-pane>
					<a-tab-pane :key="4" tab="收藏的职位">
						<invite-collect v-if="activeKey == 4"></invite-collect>
					</a-tab-pane>
				</a-tabs>
			</a-col>
		</a-row>
	</div>
	<resume-detail v-if="detail_record" :detail_record="detail_record"></resume-detail>
</template>

<script setup lang="ts">
	import { ref, computed, onMounted, createVNode } from 'vue';
	import InviteInterview from '@/components/jobseeker/invite/interview/index.vue'
	import InviteApply from '@/components/jobseeker/invite/apply/index.vue'
	import InviteSeeme from '@/components/jobseeker/invite/seeme/index.vue'
	import InviteCollect from '@/components/jobseeker/invite/collect/index.vue'
	import ResumeDetail from '@/components/jobseeker/resume/detail/index.vue'
	import { GetJobseekerDetail, GetCompanyRecommentResume, GetViewHistoryList, GetPersonInterviewList, PostJobapplicantUpdate } from '@/apis/models';
	import { warnToast, successToast } from '@/utils/toastHelper';
	import { EditOutlined, FileSearchOutlined, RedoOutlined } from '@ant-design/icons-vue';
	import { useCommon } from '@/hooks/useCommon';
	let { commomParams, ExclamationCircleOutlined, Modal, onMenu, showOtherModal1, imageprefix } = useCommon();
	let jobList = ref<Object[]>([])
	let basic = ref<Object>({})
	let seeLength = ref<Number>(0)
	let activeKey = ref<Number>(1)
	let refreshing = ref<Boolean>(false)

	let createForm = ref<Object>({
		hide_resume: 1,
		house_keeping_status: 2,
		remind_interview: 2
	})


	const toResume = () => {
		onMenu('/jobseeker/resume')
	}

	const refreshResume = () => {
		refreshing.value = true;
		successToast('简历已刷新')
		refreshing.value = false
	}

	const changeResumeState = (val) => {
		createForm.value.id = basic.value.id,
			PostJobapplicantUpdate(createForm.value)
	}

	let detail_record = ref<Object>(null)
	const detail = (record) => {
		detail_record.value = record;
		showOtherModal1()
	}

	onMounted(async () => {
		let res = await GetJobseekerDetail({ customer_id: sessionStorage.getItem('id') })
		basic.value = res.data;
		createForm.value.hide_resume = res.data.hide_resume;
		createForm.value.house_keeping_status = res.data.house_keeping_status;
		createForm.value.remind_interview = res.data.remind_interview;

		if (createForm.value.remind_interview == 1) {
			let res1 = await GetPersonInterviewList({ status: 0 })
			if (res1.data.list.length > 0) {
				Modal.confirm({
					title: `您有${res1.data.list.length}条待查看面试邀请`,
					centered: true,
					icon: createVNode(ExclamationCircleOutlined),
					okText: '前往查看',
					cancelText: '关闭',
					onOk() {

					},
					onCancel() {

					},
				});
			}
		}

		let res2 = GetViewHistoryList()
		seeLength.value = res2.data.viewhistorys ? res2.data.viewhistorys.length : 0


	})
</script>

<style scoped lang="less">
	.talent-box {
		border-radius: 8px;
		background-color: #fff;
	}

	.applyRouteStyles(@routeName) {
		& when (@routeName =company) {
			:deep(.ant-list-item-meta) {
				flex: none !important;
				width: 40% !important;
			}

			:deep(.ant-list-item-action) {
				margin-inline-start: 0 !important;
			}
		}
	}

	// :deep(.ant-list-item-meta) {
	// 	flex: none !important;
	// 	width: 40% !important;
	// }

	// :deep(.ant-list-item-action) {
	// 	margin-inline-start: 0 !important;
	// }
</style>