<template>
	<div class="layout-footer">
		<div class="layout-footer-warp">
			<span class="mr20"> 管理运营：{{ themeConfig.operate }} </span>
			<span class="mr20"> 技术支撑：{{ themeConfig.techSupport }} </span>
			<span>
				备案号：
				<el-link href="https://beian.miit.gov.cn/" target="_blank" :underline="props.underline" :type="props.type">{{ themeConfig.recordNumber }}</el-link>
			</span>
		</div>
	</div>
</template>

<script setup lang="ts" name="layoutFooter">
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '@/stores/themeConfig';

const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const props = defineProps({
	underline: {
		type: Boolean,
		default: true,
	},
	type: {
		type: String,
		default: 'primary',
	},
});
</script>

<style scoped lang="scss">
.layout-footer {
	width: 100%;
	padding-bottom: 5px;
	color: var(--el-text-color-primary);
	&-warp {
		display: flex;
		align-items: center;
		justify-content: center;
		animation: error-num 0.3s ease;
		span {
			display: flex;
			align-items: center;
		}
	}
}
</style>
