c1b532ad
 梁保满
权限配置，路由基础设置
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
|
<template>
<div id="loyout">
<el-container>
<layoutAside></layoutAside>
<el-container>
<layoutHeader></layoutHeader>
<el-main id="elmain">
<transition name="main" mode="out-in">
<router-view></router-view>
</transition>
</el-main>
<el-footer height="28px">
<Bottom></Bottom>
</el-footer>
</el-container>
</el-container>
</div>
</template>
<script>
import layoutAside from "./aside/aside";
import layoutHeader from "./header/header";
import Bottom from "./Footer/bottom";
import langSelect from "../../components/lang/langSelect";
export default {
name: "layout",
components: {
layoutHeader,
Bottom,
langSelect,
layoutAside,
},
};
</script>
<style>
.main-enter,
.main-leave-to {
opacity: 0;
transform: translateY(30px);
}
.main-enter-active {
transition: all 0.2s;
}
.main-leave-active {
position: absolute;
transition: all 0.3s;
}
</style>
|
|
d4283687
梁保满
首页布局完成，页面顶部返回组件
|
51
|
<style lang="scss" scoped>
|
|
c1b532ad
梁保满
权限配置，路由基础设置
|
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
$top: top;
$bottom: bottom;
$left: left;
$right: right;
$leftright: ($left, $right);
%w100 {
width: 100%;
}
%h100 {
height: 100%;
}
%cursor {
cursor: pointer;
}
|
|
d4283687
梁保满
首页布局完成，页面顶部返回组件
|
68
|
|
|
c1b532ad
梁保满
权限配置，路由基础设置
|
69
70
71
72
73
74
75
76
77
78
79
80
81
82
|
#loyout,
.el-container,
#asideNav,
ul.el-menu {
@extend %h100;
}
@mixin set-value($side, $value) {
@each $prop in $leftright {
#{$side}-#{$prop}: $value;
}
}
#elmain {
|
|
d4283687
梁保满
首页布局完成，页面顶部返回组件
|
83
84
|
background-color: #fff;
padding:0;
|
|
c1b532ad
梁保满
权限配置，路由基础设置
|
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
|
}
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9 !important;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
font-size: 28px;
color: #8c939d;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
.avatar {
width: 178px;
height: 178px;
display: block;
}
</style>
|
