2023年4月1日 完善门户基本架子
This commit is contained in:
parent
6c5617a76e
commit
0dde4fcf7f
|
|
@ -1,5 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<a-card>
|
<div id="siteMain">
|
||||||
|
<!-- <a-card>
|
||||||
<div>
|
<div>
|
||||||
<h1>首页</h1>
|
<h1>首页</h1>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -20,10 +21,54 @@
|
||||||
<RouterLink to="/dashboard/analysis">跳转到首页</RouterLink>
|
<RouterLink to="/dashboard/analysis">跳转到首页</RouterLink>
|
||||||
</div>
|
</div>
|
||||||
</a-card>
|
</a-card>
|
||||||
|
////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// -->
|
||||||
|
<a-layout>
|
||||||
|
<a-layout-header>
|
||||||
|
<span class="topTitle">管理系统</span>
|
||||||
|
<span class="topRight">
|
||||||
|
<a-dropdown>
|
||||||
|
<span class="ant-dropdown-link topRightMenu" @click.prevent>
|
||||||
|
{{ userStore?.getUserInfo?.realname }}
|
||||||
|
<DownOutlined />
|
||||||
|
</span>
|
||||||
|
<template #overlay>
|
||||||
|
<a-menu>
|
||||||
|
<a-menu-item>
|
||||||
|
<!-- <a href="javascript:;">后台管理</a> -->
|
||||||
|
<RouterLink to="/dashboard/analysis">后台管理</RouterLink>
|
||||||
|
</a-menu-item>
|
||||||
|
<a-menu-item>
|
||||||
|
<a href="javascript:;" @click="userStore?.confirmLoginOut();">安全退出</a>
|
||||||
|
</a-menu-item>
|
||||||
|
</a-menu>
|
||||||
|
</template>
|
||||||
|
</a-dropdown>
|
||||||
|
</span>
|
||||||
|
</a-layout-header>
|
||||||
|
<a-layout-content>
|
||||||
|
内容流区域
|
||||||
|
</a-layout-content>
|
||||||
|
<a-layout-footer>
|
||||||
|
<span class="footerLeft">TEL：0431-85099971</span>
|
||||||
|
<span class="footerRight">Copyright 东北师范大学教务处 2023</span>
|
||||||
|
</a-layout-footer>
|
||||||
|
</a-layout>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, reactive, computed, onMounted } from 'vue';
|
import { ref, reactive, computed, onMounted } from 'vue';
|
||||||
|
import { DownOutlined } from '@ant-design/icons-vue';
|
||||||
|
import { useUserStore } from '/@/store/modules/user';
|
||||||
|
|
||||||
|
//用户相关
|
||||||
|
const userStore = useUserStore();
|
||||||
|
|
||||||
|
console.log(`🚀 -----------------------------------------------🚀`);
|
||||||
|
console.log(`🚀 ~ file: index.vue:66 ~ userStore:`, userStore);
|
||||||
|
console.log(`🚀 -----------------------------------------------🚀`);
|
||||||
|
|
||||||
|
|
||||||
// reactive
|
// reactive
|
||||||
let list = reactive({ list: [] });
|
let list = reactive({ list: [] });
|
||||||
//针对基础类型
|
//针对基础类型
|
||||||
|
|
@ -45,3 +90,54 @@
|
||||||
// list.list.push({ key: i.value });
|
// list.list.push({ key: i.value });
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
<style lang="less">
|
||||||
|
#siteMain {
|
||||||
|
//最大宽度
|
||||||
|
max-width: 1100px;
|
||||||
|
//居中
|
||||||
|
margin: 0 auto;
|
||||||
|
.topTitle {
|
||||||
|
font-size: 1.5rem;
|
||||||
|
}
|
||||||
|
.topRight {
|
||||||
|
float: right;
|
||||||
|
.topRightMenu {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.footerRight {
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-layout-header {
|
||||||
|
color: #fff;
|
||||||
|
background: #1ab394;
|
||||||
|
}
|
||||||
|
.ant-layout-footer {
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
.ant-layout-sider {
|
||||||
|
color: #fff;
|
||||||
|
line-height: 120px;
|
||||||
|
background: #3ba0e9;
|
||||||
|
}
|
||||||
|
.ant-layout-content {
|
||||||
|
min-height: 120px;
|
||||||
|
color: #000;
|
||||||
|
line-height: 120px;
|
||||||
|
background: #FFF
|
||||||
|
}
|
||||||
|
}s
|
||||||
|
/**暗黑模式特殊配色*/
|
||||||
|
[data-theme='dark'] #siteMain {
|
||||||
|
.ant-layout-header, .ant-layout-footer {
|
||||||
|
background: #6aa0c7;
|
||||||
|
}
|
||||||
|
.ant-layout-content {
|
||||||
|
background: #107bcb;
|
||||||
|
}
|
||||||
|
.ant-layout-sider {
|
||||||
|
background: #3499ec;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue