<template>
	<div>
		<a-breadcrumb>
			<a-breadcrumb-item class="g_cursor_point" @click="handleGoHome">
				<HomeOutlined />
			</a-breadcrumb-item>
			<a-breadcrumb-item :class="secondTitle ? 'g_cursor_point' : ''" @click="pushFirstPage">
				<span>{{ firstTitle }}</span>
			</a-breadcrumb-item>
			<a-breadcrumb-item v-if="secondTitle">
				<span>{{ secondTitle }}</span>
			</a-breadcrumb-item>
		</a-breadcrumb>
	</div>
</template>

<script setup>
/* 面包屑
 */
import { ref, onMounted, getCurrentInstance, watch, onBeforeUnmount } from "vue";
import { HomeOutlined } from "@ant-design/icons-vue";
const commonJS = getCurrentInstance().appContext.app.config.globalProperties.G;
import { useRouter, useRoute } from "vue-router";
const router = useRouter(); // 应用路由
const route = useRoute();
const firstTitle = ref(""); // 一级
const secondTitle = ref("");
const props = defineProps({});
const initData = ref({});
watch(
	route,
	(val) => {
		initData.value = val;
		console.log("recruit", val);
		console.log("面包屑：", val, " ", initData.value);
		firstTitle.value = val.meta.title;
		secondTitle.value = ""; // 每次路由变化先重置二级页面标题
		if (val.name == "roleManagementDetail") {
			if (val.query.type == "add") {
				secondTitle.value = "添加角色";
			} else if (val.query.type == "edit") {
				secondTitle.value = "编辑角色";
			} else if (val.query.type == "view") {
				secondTitle.value = "角色详情";
			}
			firstTitle.value = "角色管理";
		} else if (val.name == "billDetail") {
			secondTitle.value = "账单详情";
			firstTitle.value = "应收账单";
		} else if (val.name == "shareJobDetail") {
			if (val.query.form == "joblist") {
				// 自有
				secondTitle.value = "共享职位详情";
				firstTitle.value = "我的职位";
			} else {
				// 共享
				secondTitle.value = "共享职位详情";
				firstTitle.value = "共享职位";
			}
		} else if (val.name == "recordJob") {
			secondTitle.value = "职位报名";
			firstTitle.value = "我的职位";
		} else if (val.name == "jobDetail") {
			secondTitle.value = "我的职位详情";
			firstTitle.value = "我的职位";
		} else if (val.name == "jobForm") {
			if (val.query.type == "add") {
				secondTitle.value = "新增职位";
			} else if (val.query.type == "edit") {
				secondTitle.value = "编辑职位";
			}
			firstTitle.value = "我的职位";
		} else if (val.name == "downstreamDetail") {
			secondTitle.value = "发单号详情";
			firstTitle.value = "我的粉丝";
		} else if (val.name == "upstreamDetail") {
			secondTitle.value = "发单号详情";
			firstTitle.value = "我的关注";
		} else if (val.name == "recruit") {
			secondTitle.value = "配置详情";
			firstTitle.value = "小程序配置";
		}
	},
	{
		immediate: true,
	}
);
const handleGoHome = () => {
	router.push("/merchantManagement/homePage");
};
const pushFirstPage = () => {
	if (firstTitle.value == "角色管理") {
		router.push("/merchantManagement/roleManagement");
	} else if (firstTitle.value == "应收账单") {
		router.push("/merchantManagement/mineBill");
	} else if (secondTitle.value == "共享职位详情") {
		if (initData.value.query.form == "joblist") {
			// 自有
			router.push("/merchantManagement/jobList");
		} else {
			// 共享
			router.push("/merchantManagement/shareJob");
		}
	} else if (secondTitle.value == "职位报名") {
		router.push("/merchantManagement/jobList");
	} else if (secondTitle.value == "我的职位详情") {
		router.push("/merchantManagement/jobList");
	} else if (firstTitle.value == "我的职位") {
		router.push("/merchantManagement/jobList");
	} else if (firstTitle.value == "我的关注") {
		router.push("/merchantManagement/upstream");
	} else if (firstTitle.value == "我的粉丝") {
		router.push("/merchantManagement/downstream");
	} else if (firstTitle.value == "小程序配置") {
		router.push("/merchantManagement/miniProgramList");
	}
};
</script>

<style lang="less" scoped></style>
