<template>
	<a-layout :style="{ overflow: 'hidden' }">
		<a-layout-sider width="200" style="background: #fff">
			<a-menu
				v-model:selectedKeys="selectedKeys2"
				v-model:openKeys="openKeys"
				mode="inline"
				:style="{ height: '100%', borderRight: 0 }"
			>
				<a-sub-menu key="sub1">
					<template #title>
						<span> 询价计划管理 </span>
					</template>
					<a-menu-item key="1">
						<router-link to="/procurementPlanningList"
							>询价计划</router-link
						>
					</a-menu-item>
					<a-menu-item key="3">
						<router-link to="/sourcingProgress"
							>询价进展</router-link
						>
					</a-menu-item>
				</a-sub-menu>
				<!-- <a-sub-menu key="sub2">
					<template #title> 供应商寻源 </template>
					<a-menu-item key="2">
						<router-link to="/sourcingRelease"
							>发布寻源</router-link
						>
					</a-menu-item>
				</a-sub-menu> -->
				<a-sub-menu key="sub3">
					<template #title> 供应商管理 </template>
					<a-menu-item key="6">
						<router-link to="/supplierList">入驻申请</router-link>
					</a-menu-item>
					<a-menu-item key="5">
						<router-link to="/supplierLedger">供应商台账</router-link>
					</a-menu-item>
				</a-sub-menu>
				<a-sub-menu key="sub4">
					<template #title>
						<span> 供应商报价 </span>
					</template>
					<a-menu-item key="8">
						<router-link to="/quotation"
							>材料报价</router-link
						>
					</a-menu-item>
				</a-sub-menu>
			</a-menu>
		</a-layout-sider>
		<a-layout
			style="
				padding: 0 24px 24px;
				position: relative;
				padding-bottom: 70px;
			"
		>
			<a-breadcrumb style="margin: 16px 0">
				<a-breadcrumb-item v-if="parentName">{{
					parentName
				}}</a-breadcrumb-item>
				<a-breadcrumb-item>{{ routeName }}</a-breadcrumb-item>
			</a-breadcrumb>
			<a-layout-content
				:style="{
					background: '#fff',
					padding: '24px',
					margin: 0,
					minHeight: '280px',
					overflow: 'auto',
				}"
			>
				<router-view></router-view>
			</a-layout-content>
		</a-layout>
	</a-layout>
</template>

<script setup>
import { computed, ref } from "vue";
import { useRoute } from "vue-router";

const selectedKeys2 = ref(["1"]);
const openKeys = ref(["sub1"]);
const route = useRoute();
const routeName = computed(() => route.meta?.name);
const parentName = computed(() => route.meta?.parent);
</script>
<style scoped lang="scss" src="./index.scss"></style>
