|
|
@@ -10,24 +10,11 @@
|
|
|
</div>
|
|
|
<el-row :class="[{ 'shortnav': isCollapse }, { 'longNav': !isCollapse }]">
|
|
|
<el-col :span="24">
|
|
|
- <el-menu
|
|
|
- :default-active="userLevelDeafult"
|
|
|
- class="el-menu-vertical-demo"
|
|
|
- @open="handleOpen"
|
|
|
- @close="handleClose"
|
|
|
- @select="handleSelect"
|
|
|
- :collapse="isCollapse"
|
|
|
- background-color="#ffffff"
|
|
|
- text-color="#777777"
|
|
|
- active-text-color="#fff"
|
|
|
- router
|
|
|
- >
|
|
|
- <el-menu-item
|
|
|
- :index="nav.clmid"
|
|
|
- :route="nav.clmurl"
|
|
|
- v-for="nav in navs"
|
|
|
- v-if="nav.show == userLevel"
|
|
|
- >
|
|
|
+ <el-menu :default-active="userLevelDeafult" class="el-menu-vertical-demo" @open="handleOpen"
|
|
|
+ @close="handleClose" @select="handleSelect" :collapse="isCollapse" background-color="#ffffff"
|
|
|
+ text-color="#777777" active-text-color="#fff" router>
|
|
|
+ <el-menu-item :index="nav.clmid" :route="nav.clmurl" v-for="nav in navs"
|
|
|
+ v-if="nav.show == userLevel">
|
|
|
<i :class="nav.icon"></i>
|
|
|
<span slot="title">{{ nav.clmname }}</span>
|
|
|
</el-menu-item>
|
|
|
@@ -37,391 +24,407 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
-import Navs from '../api/Navs';
|
|
|
-import {
|
|
|
- ManagerSelfQuery,
|
|
|
- ShopListQuery
|
|
|
-} from '../api/getApiRes.js'
|
|
|
-
|
|
|
-let qs = require('qs');
|
|
|
-export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- wildState: 0,
|
|
|
- navs: [],
|
|
|
- ShopName: '',
|
|
|
- userLevelText: '',
|
|
|
- NavsideClass: 'Navside',
|
|
|
- userLevel: 0,
|
|
|
- userLevelDeafult: "",
|
|
|
- }
|
|
|
- },
|
|
|
- props: ['isCollapse'],
|
|
|
- mounted() {
|
|
|
- this.userLevelDeafult = this.$route.meta.clmid;
|
|
|
- this.getTableQuery();
|
|
|
- this.getManagerSelfQuery();
|
|
|
- if (document.body.clientWidth < 1024) {
|
|
|
- this.NavsideClass = 'NavsideShort'
|
|
|
- } else {
|
|
|
- this.NavsideClass = 'Navside'
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- handleSelect(i, s, t) {
|
|
|
- // this.$emit('TabsAdd', i);//触发事件
|
|
|
+ import Navs from '../api/Navs';
|
|
|
+ import {
|
|
|
+ ManagerSelfQuery,
|
|
|
+ ShopListQuery
|
|
|
+ } from '../api/getApiRes.js'
|
|
|
+
|
|
|
+ let qs = require('qs');
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ wildState: 0,
|
|
|
+ navs: [],
|
|
|
+ ShopName: '',
|
|
|
+ userLevelText: '',
|
|
|
+ NavsideClass: 'Navside',
|
|
|
+ userLevel: 0,
|
|
|
+ userLevelDeafult: "",
|
|
|
+ }
|
|
|
},
|
|
|
- getTableQuery() {
|
|
|
- // 菜单
|
|
|
- this.navs = Navs;
|
|
|
+ props: ['isCollapse'],
|
|
|
+ mounted() {
|
|
|
+ this.userLevelDeafult = this.$route.meta.clmid;
|
|
|
+ this.getTableQuery();
|
|
|
+ this.getManagerSelfQuery();
|
|
|
+ if (document.body.clientWidth < 1024) {
|
|
|
+ this.NavsideClass = 'NavsideShort'
|
|
|
+ } else {
|
|
|
+ this.NavsideClass = 'Navside'
|
|
|
+ }
|
|
|
},
|
|
|
- getManagerSelfQuery() {
|
|
|
- let that = this;
|
|
|
- let param = {
|
|
|
- token: localStorage.token,
|
|
|
- };
|
|
|
- let postdata = qs.stringify(param);
|
|
|
- ManagerSelfQuery(postdata).then(res => {
|
|
|
- let json = res;
|
|
|
- if (json.Code == 0) {
|
|
|
- that.userLevelText = json.Rs.Role.Name;
|
|
|
- // 1 会员 2 系统 3 店铺 4 教练
|
|
|
- switch (parseInt(json.Rs.Role.Id)) {
|
|
|
- case 1:
|
|
|
- that.userLevel = 1;
|
|
|
- break;
|
|
|
- case 2:
|
|
|
- that.userLevel = 2;
|
|
|
- break;
|
|
|
- case 3:
|
|
|
- that.userLevel = 3;
|
|
|
- break;
|
|
|
- case 4:
|
|
|
- that.userLevel = 4;
|
|
|
- break;
|
|
|
+ methods: {
|
|
|
+ handleSelect(i, s, t) {
|
|
|
+ // this.$emit('TabsAdd', i);//触发事件
|
|
|
+ },
|
|
|
+ getTableQuery() {
|
|
|
+ // 菜单
|
|
|
+ this.navs = Navs;
|
|
|
+ },
|
|
|
+ getManagerSelfQuery() {
|
|
|
+ let that = this;
|
|
|
+ let param = {
|
|
|
+ token: localStorage.token,
|
|
|
+ };
|
|
|
+ let postdata = qs.stringify(param);
|
|
|
+ ManagerSelfQuery(postdata).then(res => {
|
|
|
+ let json = res;
|
|
|
+ if (json.Code == 0) {
|
|
|
+ that.userLevelText = json.Rs.Role.Name;
|
|
|
+ // 1 会员 2 系统 3 店铺 4 教练
|
|
|
+ switch (parseInt(json.Rs.Role.Id)) {
|
|
|
+ case 1:
|
|
|
+ that.userLevel = 1;
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ that.userLevel = 2;
|
|
|
+ break;
|
|
|
+ case 3:
|
|
|
+ that.userLevel = 3;
|
|
|
+ break;
|
|
|
+ case 4:
|
|
|
+ that.userLevel = 4;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ localStorage.shopId = json.Rs.ShopId;
|
|
|
+ this.panelSelect(json.Rs.ShopId);
|
|
|
+ } else {
|
|
|
+ if (json.Code == 1010) {
|
|
|
+ that.$message.error(json.Memo + ' 错误码:' + json.Code);
|
|
|
+ that.$router.push({ path: '/login', query: { status: 1 } });
|
|
|
+ return false
|
|
|
+ } else {
|
|
|
+ that.$message.error(json.Memo + ' 错误码:' + json.Code);
|
|
|
+ }
|
|
|
}
|
|
|
- localStorage.shopId = json.Rs.ShopId;
|
|
|
- this.panelSelect(json.Rs.ShopId);
|
|
|
- } else {
|
|
|
- if (json.Code == 1010) {
|
|
|
- that.$message.error(json.Memo + ' 错误码:' + json.Code);
|
|
|
- that.$router.push({ path: '/login', query: { status: 1 } });
|
|
|
- return false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取所属店铺
|
|
|
+ panelSelect(ShopId) {
|
|
|
+ let that = this;
|
|
|
+ let param = {
|
|
|
+ token: localStorage.token,
|
|
|
+ };
|
|
|
+ let postdata = qs.stringify(param);
|
|
|
+ ShopListQuery(postdata).then(res => {
|
|
|
+ let json = res;
|
|
|
+ if (json.Code == 0) {
|
|
|
+ json.Rs.map(function (item) {
|
|
|
+ if (item.ShopID == ShopId) {
|
|
|
+ that.ShopName = item.ShopName;
|
|
|
+ }
|
|
|
+ })
|
|
|
} else {
|
|
|
that.$message.error(json.Memo + ' 错误码:' + json.Code);
|
|
|
}
|
|
|
- }
|
|
|
- })
|
|
|
- },
|
|
|
- // 获取所属店铺
|
|
|
- panelSelect(ShopId) {
|
|
|
- let that = this;
|
|
|
- let param = {
|
|
|
- token: localStorage.token,
|
|
|
- };
|
|
|
- let postdata = qs.stringify(param);
|
|
|
- ShopListQuery(postdata).then(res => {
|
|
|
- let json = res;
|
|
|
- if (json.Code == 0) {
|
|
|
- json.Rs.map(function(item) {
|
|
|
- if (item.ShopID == ShopId) {
|
|
|
- that.ShopName = item.ShopName;
|
|
|
- }
|
|
|
- })
|
|
|
- } else {
|
|
|
- that.$message.error(json.Memo + ' 错误码:' + json.Code);
|
|
|
- }
|
|
|
- })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleOpen(key, keyPath) {
|
|
|
+ // console.log(key, keyPath);
|
|
|
+ },
|
|
|
+ handleClose(key, keyPath) {
|
|
|
+ // console.log(key, keyPath);
|
|
|
+ },
|
|
|
},
|
|
|
- handleOpen(key, keyPath) {
|
|
|
- // console.log(key, keyPath);
|
|
|
+ watch: {
|
|
|
+ $route(to, from) {
|
|
|
+ // this.userLevelDeafult = to.meta.clmid
|
|
|
+ },
|
|
|
},
|
|
|
- handleClose(key, keyPath) {
|
|
|
- // console.log(key, keyPath);
|
|
|
- },
|
|
|
- },
|
|
|
- watch: {
|
|
|
- $route(to, from) {
|
|
|
- this.userLevelDeafult = to.meta.clmid
|
|
|
- },
|
|
|
- },
|
|
|
-}
|
|
|
+ }
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
-/*注释*/
|
|
|
-.Navside {
|
|
|
- width: 100%;
|
|
|
- height: 910px;
|
|
|
- /*height: 100%;*/
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- overflow-y: scroll;
|
|
|
- /*overflow-y: hidden;*/
|
|
|
- background-color: #fff;
|
|
|
- z-index: 4444;
|
|
|
-}
|
|
|
-
|
|
|
-.NavsideShort {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- /*height: 710px;*/
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- /*overflow-y: scroll;*/
|
|
|
- overflow-y: scroll;
|
|
|
- background-color: #fff;
|
|
|
- z-index: 4444;
|
|
|
-}
|
|
|
-
|
|
|
-.Navside::-webkit-scrollbar {
|
|
|
- /*滚动条整体样式*/
|
|
|
-
|
|
|
- width: 3px; /*高宽分别对应横竖滚动条的尺寸*/
|
|
|
-
|
|
|
- height: 1px;
|
|
|
-}
|
|
|
-
|
|
|
-.Navside::-webkit-scrollbar-thumb {
|
|
|
- /*滚动条里面小方块*/
|
|
|
-
|
|
|
- border-radius: 3px;
|
|
|
-
|
|
|
- -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
-
|
|
|
- background: #f5f5f5;
|
|
|
-}
|
|
|
-
|
|
|
-.Navside::-webkit-scrollbar-track {
|
|
|
- /*滚动条里面轨道*/
|
|
|
-
|
|
|
- -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
-
|
|
|
- border-radius: 3px;
|
|
|
-
|
|
|
- background: #f5f5f5;
|
|
|
-}
|
|
|
-
|
|
|
-.NavsideShort::-webkit-scrollbar {
|
|
|
- /*滚动条整体样式*/
|
|
|
-
|
|
|
- width: 3px; /*高宽分别对应横竖滚动条的尺寸*/
|
|
|
-
|
|
|
- height: 1px;
|
|
|
-}
|
|
|
-
|
|
|
-.NavsideShort::-webkit-scrollbar-thumb {
|
|
|
- /*滚动条里面小方块*/
|
|
|
-
|
|
|
- border-radius: 3px;
|
|
|
-
|
|
|
- -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
-
|
|
|
- background: #f5f5f5;
|
|
|
-}
|
|
|
-
|
|
|
-.NavsideShort::-webkit-scrollbar-track {
|
|
|
- /*滚动条里面轨道*/
|
|
|
-
|
|
|
- -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
-
|
|
|
- border-radius: 3px;
|
|
|
-
|
|
|
- background: #f5f5f5;
|
|
|
-}
|
|
|
-
|
|
|
-.logoContainer {
|
|
|
- width: 256px;
|
|
|
- height: 72px;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- background: #3799ff;
|
|
|
-}
|
|
|
-
|
|
|
-.logoContainer img {
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- margin-top: 1px;
|
|
|
-}
|
|
|
-
|
|
|
-.userContainer {
|
|
|
- width: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- margin-bottom: 16px;
|
|
|
- padding-top: 19px;
|
|
|
- padding-bottom: 19px;
|
|
|
- border-bottom: 1px solid #f0f2f5;
|
|
|
- background: #fff;
|
|
|
-}
|
|
|
-
|
|
|
-.userContainer img {
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- margin-bottom: 16px;
|
|
|
-}
|
|
|
-
|
|
|
-.userContainer span {
|
|
|
- width: 100%;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- color: #565656;
|
|
|
- font-size: 16px;
|
|
|
-}
|
|
|
-
|
|
|
-.userContainer em {
|
|
|
- width: 125px;
|
|
|
- height: 26px;
|
|
|
- line-height: 26px;
|
|
|
- text-align: center;
|
|
|
- color: #fff;
|
|
|
- overflow: hidden;
|
|
|
- display: block;
|
|
|
- margin: 0 auto;
|
|
|
- background: #e75296;
|
|
|
- border-radius: 250px;
|
|
|
- font-style: normal;
|
|
|
- margin-top: 8px;
|
|
|
- font-size: 16px;
|
|
|
-}
|
|
|
-
|
|
|
-/deep/ .el-menu {
|
|
|
- border: none;
|
|
|
-}
|
|
|
-
|
|
|
-/deep/ .el-menu-item {
|
|
|
-}
|
|
|
-
|
|
|
-/deep/ .el-menu-item span {
|
|
|
- text-align: left;
|
|
|
- float: left;
|
|
|
- margin-left: 70px;
|
|
|
-}
|
|
|
-
|
|
|
-/deep/ .el-menu-item.is-active {
|
|
|
- background-color: #3799ff !important;
|
|
|
- color: #fff !important;
|
|
|
-}
|
|
|
-
|
|
|
-/deep/ .el-menu-item:hover {
|
|
|
- background-color: #3799ff !important;
|
|
|
- color: #fff !important;
|
|
|
-}
|
|
|
-
|
|
|
-/deep/ .el-menu-item:hover i {
|
|
|
- color: #fff !important;
|
|
|
-}
|
|
|
-
|
|
|
-/deep/ .el-menu-item i {
|
|
|
- position: inherit;
|
|
|
- float: left;
|
|
|
- line-height: 25px;
|
|
|
- left: 0px;
|
|
|
-}
|
|
|
-
|
|
|
-/*ipad only*/
|
|
|
-@media (min-width: 1025px) and (max-width: 1366px) {
|
|
|
- .userContainer {
|
|
|
- width: 80%;
|
|
|
- }
|
|
|
-
|
|
|
- .el-menu-item span {
|
|
|
- text-align: left;
|
|
|
- float: left;
|
|
|
- margin-left: 20px;
|
|
|
- line-height: 40px;
|
|
|
+ /*注释*/
|
|
|
+ .Navside {
|
|
|
+ width: 100%;
|
|
|
+ height: 910px;
|
|
|
+ /*height: 100%;*/
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ overflow-y: scroll;
|
|
|
+ /*overflow-y: hidden;*/
|
|
|
+ background-color: #fff;
|
|
|
+ z-index: 4444;
|
|
|
}
|
|
|
|
|
|
- .userContainer em {
|
|
|
+ .NavsideShort {
|
|
|
width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ /*height: 710px;*/
|
|
|
overflow: hidden;
|
|
|
display: block;
|
|
|
margin: 0 auto;
|
|
|
- font-size: 12px;
|
|
|
+ /*overflow-y: scroll;*/
|
|
|
+ overflow-y: scroll;
|
|
|
+ background-color: #fff;
|
|
|
+ z-index: 4444;
|
|
|
}
|
|
|
|
|
|
- .el-menu-item {
|
|
|
- padding: 0 !important;
|
|
|
- margin: 0;
|
|
|
+ .Navside::-webkit-scrollbar {
|
|
|
+ /*滚动条整体样式*/
|
|
|
+
|
|
|
+ width: 3px;
|
|
|
+ /*高宽分别对应横竖滚动条的尺寸*/
|
|
|
+
|
|
|
+ height: 1px;
|
|
|
}
|
|
|
|
|
|
- .el-menu-item i {
|
|
|
- left: 20px;
|
|
|
- padding: 0;
|
|
|
- margin: 0;
|
|
|
- float: left;
|
|
|
- line-height: 40px;
|
|
|
+ .Navside::-webkit-scrollbar-thumb {
|
|
|
+ /*滚动条里面小方块*/
|
|
|
+
|
|
|
+ border-radius: 3px;
|
|
|
+
|
|
|
+ -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
+
|
|
|
+ background: #f5f5f5;
|
|
|
}
|
|
|
|
|
|
- /deep/ .el-tooltip {
|
|
|
- padding: 0 !important;
|
|
|
+ .Navside::-webkit-scrollbar-track {
|
|
|
+ /*滚动条里面轨道*/
|
|
|
+
|
|
|
+ -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
+
|
|
|
+ border-radius: 3px;
|
|
|
+
|
|
|
+ background: #f5f5f5;
|
|
|
}
|
|
|
|
|
|
- .userContainer span {
|
|
|
- font-size: 12px;
|
|
|
+ .NavsideShort::-webkit-scrollbar {
|
|
|
+ /*滚动条整体样式*/
|
|
|
+
|
|
|
+ width: 3px;
|
|
|
+ /*高宽分别对应横竖滚动条的尺寸*/
|
|
|
+
|
|
|
+ height: 1px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .NavsideShort::-webkit-scrollbar-thumb {
|
|
|
+ /*滚动条里面小方块*/
|
|
|
+
|
|
|
+ border-radius: 3px;
|
|
|
+
|
|
|
+ -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
+
|
|
|
+ background: #f5f5f5;
|
|
|
}
|
|
|
|
|
|
- .el-menu-item,
|
|
|
- .el-submenu__title {
|
|
|
- height: 40px;
|
|
|
+ .NavsideShort::-webkit-scrollbar-track {
|
|
|
+ /*滚动条里面轨道*/
|
|
|
+
|
|
|
+ -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
|
|
|
+
|
|
|
+ border-radius: 3px;
|
|
|
+
|
|
|
+ background: #f5f5f5;
|
|
|
}
|
|
|
-}
|
|
|
-@media (min-width: 960px) and (max-width: 1024px) {
|
|
|
+
|
|
|
.logoContainer {
|
|
|
- height: 40px;
|
|
|
+ width: 256px;
|
|
|
+ height: 72px;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ background: #3799ff;
|
|
|
}
|
|
|
- .el-container.is-vertical {
|
|
|
- left: 60px;
|
|
|
+
|
|
|
+ .logoContainer img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ margin-top: 1px;
|
|
|
}
|
|
|
- .el-menu-item span {
|
|
|
- text-align: left;
|
|
|
- float: left;
|
|
|
- margin-left: 5px;
|
|
|
- line-height: 20px;
|
|
|
- font-size: 12px;
|
|
|
- height: 30px;
|
|
|
- line-height: 30px;
|
|
|
+
|
|
|
+ .userContainer {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ margin-bottom: 16px;
|
|
|
+ padding-top: 19px;
|
|
|
+ padding-bottom: 19px;
|
|
|
+ border-bottom: 1px solid #f0f2f5;
|
|
|
+ background: #fff;
|
|
|
}
|
|
|
- .userContainer em {
|
|
|
+
|
|
|
+ .userContainer img {
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ margin-bottom: 16px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .userContainer span {
|
|
|
width: 100%;
|
|
|
overflow: hidden;
|
|
|
display: block;
|
|
|
margin: 0 auto;
|
|
|
- font-size: 12px;
|
|
|
+ color: #565656;
|
|
|
+ font-size: 16px;
|
|
|
}
|
|
|
- .el-menu-item {
|
|
|
- padding: 0 !important;
|
|
|
- margin: 0;
|
|
|
+
|
|
|
+ .userContainer em {
|
|
|
+ width: 125px;
|
|
|
+ height: 26px;
|
|
|
+ line-height: 26px;
|
|
|
+ text-align: center;
|
|
|
+ color: #fff;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ background: #e75296;
|
|
|
+ border-radius: 250px;
|
|
|
+ font-style: normal;
|
|
|
+ margin-top: 8px;
|
|
|
+ font-size: 16px;
|
|
|
}
|
|
|
|
|
|
- /deep/ .el-tooltip {
|
|
|
- padding: 0 !important;
|
|
|
+ /deep/ .el-menu {
|
|
|
+ border: none;
|
|
|
}
|
|
|
|
|
|
- .userContainer span {
|
|
|
- font-size: 12px;
|
|
|
+ /deep/ .el-menu-item {}
|
|
|
+
|
|
|
+ /deep/ .el-menu-item span {
|
|
|
+ text-align: left;
|
|
|
+ float: left;
|
|
|
+ margin-left: 70px;
|
|
|
}
|
|
|
|
|
|
- .el-menu-item,
|
|
|
- .el-submenu__title {
|
|
|
- height: 30px;
|
|
|
- line-height: 30px;
|
|
|
+ /deep/ .el-menu-item.is-active {
|
|
|
+ background-color: #3799ff !important;
|
|
|
+ color: #fff !important;
|
|
|
}
|
|
|
- .userContainer img {
|
|
|
- display: none;
|
|
|
+
|
|
|
+ /deep/ .el-menu-item:hover {
|
|
|
+ background-color: #3799ff !important;
|
|
|
+ color: #fff !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-menu-item:hover i {
|
|
|
+ color: #fff !important;
|
|
|
}
|
|
|
- /deep/ .el-tooltip i {
|
|
|
+
|
|
|
+ /deep/ .el-menu-item i {
|
|
|
+ position: inherit;
|
|
|
float: left;
|
|
|
- left: 10px;
|
|
|
- line-height: 30px;
|
|
|
+ line-height: 25px;
|
|
|
+ margin-top: 15px;
|
|
|
+ left: 60px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /*ipad only*/
|
|
|
+ @media (min-width: 1025px) and (max-width: 1366px) {
|
|
|
+ .userContainer {
|
|
|
+ width: 80%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-menu-item span {
|
|
|
+ text-align: left;
|
|
|
+ float: left;
|
|
|
+ margin-left: 20px;
|
|
|
+ line-height: 40px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .userContainer em {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-menu-item {
|
|
|
+ padding: 0 !important;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-menu-item i {
|
|
|
+ left: 20px;
|
|
|
+ padding: 0;
|
|
|
+ margin: 0;
|
|
|
+ float: left;
|
|
|
+ line-height: 40px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-tooltip {
|
|
|
+ padding: 0 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .userContainer span {
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-menu-item,
|
|
|
+ .el-submenu__title {
|
|
|
+ height: 40px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ @media (min-width: 960px) and (max-width: 1024px) {
|
|
|
+ .logoContainer {
|
|
|
+ height: 40px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-container.is-vertical {
|
|
|
+ left: 60px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-menu-item span {
|
|
|
+ text-align: left;
|
|
|
+ float: left;
|
|
|
+ margin-left: 5px;
|
|
|
+ line-height: 20px;
|
|
|
+ font-size: 12px;
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .userContainer em {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-menu-item {
|
|
|
+ padding: 0 !important;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-tooltip {
|
|
|
+ padding: 0 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .userContainer span {
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-menu-item,
|
|
|
+ .el-submenu__title {
|
|
|
+ height: 30px;
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .userContainer img {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-tooltip i {
|
|
|
+ float: left;
|
|
|
+ left: 10px;
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-menu-item i {
|
|
|
+ position: inherit;
|
|
|
+ float: left;
|
|
|
+ margin-top: 3px;
|
|
|
+ left: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
-}
|
|
|
-</style>
|
|
|
+</style>
|