Alawn/udf
1
0
Fork 0
mirror of https://gitee.com/wangkang/udf.git synced 2026-10-30 07:45:11 +00:00
Code Issues Releases Wiki Activity

更新

Browse Source
This commit is contained in:
udf_admin@163.com
2020-05-03 00:13:28 +08:00
parent dd229c566e
commit f3befd562f
3 changed files with 101 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin/src/App.vue
+54 -6
View File
@@ -2,8 +2,9 @@
<div id="app" class="app" :style="appStyle">
<el-container :style="mainElContainerStyle">
<el-header :style="mainElHeaderStyle" :height="mainElHeaderStyle.height">
<el-button class="mainMenuBtn" :style="mainMenuBtnStyle" type="text">
<i class="el-icon-menu"></i>
<el-button class="mainMenuBtn" :style="mainMenuBtnStyle" type="text"
@click="mainMenuBtnClick">
<i class="el-icon-menu" @click="mainMenuBtnClick" @mouseover="mainMenuBtnClick"></i>
</el-button>
<a class="mainLogoBtn" href="./" :style="mainLogoBtnStyle">
<span>
@@ -67,7 +68,11 @@
</div>
</el-header>
<el-container :style="mainChildElContainerStyle">
<!--<el-aside v-show="elAsideShow" width="200px">Aside</el-aside>-->
<el-aside v-show="elAsideShow" width="240px">
<el-scrollbar style="height:100%;">
<left-menu></left-menu>
</el-scrollbar>
</el-aside>
<el-container :style="mainChildElContainerStyle">
<el-scrollbar style="height:100%;width: 100%;">
<el-backtop :style="backtopStyle" target=".el-scrollbar__wrap">
@@ -92,6 +97,18 @@
</el-container>
</el-container>
</el-container>
<el-drawer
size="250px"
:with-header="false"
:show-close="false"
:visible.sync="leftMenuDrawerShow"
direction="ltr">
<div :style="leftMenuDrawerStyle">
<el-scrollbar style="height:100%;">
<left-menu></left-menu>
</el-scrollbar>
</div>
</el-drawer>
</div>
</template>
@@ -99,15 +116,19 @@
import glob from "./assets/js/glob";
import api_user from "./api/user";
import leftMenu from "./components/leftMenu";
export default {
name: 'App',
components: {
leftMenu
},
data() {
return {
golbSetting: {
appLogoName: 'ITKK',
copyRight: '© 2019-2020 itkk.org',
appBackground: "#F2F2F2",
appBackground: "#FAFAFA",
headerBackground: "#FFFFFF",
menuBtnColor: "#FFFFFF",
themeBackground: "#FF6A00",
@@ -151,7 +172,9 @@
showSearchInput: false,
searchInputText: null,
userDto: {},
elAsideShow: true
elAsideShow: true,
leftMenuDrawerShow: false,
leftMenuDrawerStyle: {}
}
},
mounted() {
@@ -191,12 +214,15 @@
this.backtopStyle.color = this.golbSetting.themeColor;
this.userDtoBtnStyle.color = this.golbSetting.themeBackground;
this.logoutBtnStyle.color = this.golbSetting.themeBackground;
this.logoutBtnStyle.background = this.golbSetting.appBackground;
},
//resize监听器
resizeListener() {
//设定容器高度
this.appStyle.height = window.innerHeight + 'px';
this.mainElContainerStyle.height = window.innerHeight + 'px';
this.mainChildElContainerStyle.height = (window.innerHeight - 50) + 'px';
this.leftMenuDrawerStyle.height = window.innerHeight + 'px';
//设定框宽度
this.searchInputStyle.width = window.innerWidth - 200 - 10 + 'px';
//判断是否显示菜单栏
@@ -210,11 +236,19 @@
logoutBtnClick() {
const loading = this.$loading({lock: true, text: '操作中'});
api_user.logout().then(response => window.location.href = '/').finally(() => loading.close());
},
//菜单按钮点击
mainMenuBtnClick() {
this.leftMenuDrawerShow = !this.leftMenuDrawerShow;
}
}
}
</script>
<style lang="scss">
.el-drawer {
background-color: #F5F5F5;
}
</style>
<style lang="scss" scoped>
.app {
position: relative;
@@ -329,6 +363,20 @@
}
}
.el-aside {
margin: 0;
padding: 0;
height: 100%;
border-right: solid 1px #e6e6e6;
background: #F5F5F5;
box-shadow: rgba(0, 0, 0, 0.08) 0px 1px 4px 0px;
.el-menu {
border-right: solid 0px #e6e6e6 !important;
height: 100% !important;
}
}
.el-main {
margin: 0;
padding: 0;
admin/src/components/leftMenu.vue
+46
View File
@@ -0,0 +1,46 @@
<template>
<div class="leftMenu">
<el-menu background-color="#F5F5F5">
<el-submenu index="1">
<template slot="title">
<i class="el-icon-location"></i>
<span>导航一</span>
</template>
<el-menu-item-group>
<template slot="title">分组一</template>
<el-menu-item index="1-1">选项1</el-menu-item>
<el-menu-item index="1-2">选项2</el-menu-item>
</el-menu-item-group>
<el-menu-item-group title="分组2">
<el-menu-item index="1-3">选项3</el-menu-item>
</el-menu-item-group>
<el-submenu index="1-4">
<template slot="title">选项4</template>
<el-menu-item index="1-4-1">选项1</el-menu-item>
</el-submenu>
</el-submenu>
<el-menu-item index="2">
<i class="el-icon-menu"></i>
<span slot="title">导航二</span>
</el-menu-item>
<el-menu-item index="3" disabled>
<i class="el-icon-document"></i>
<span slot="title">导航三</span>
</el-menu-item>
<el-menu-item index="4">
<i class="el-icon-setting"></i>
<span slot="title">导航四</span>
</el-menu-item>
</el-menu>
</div>
</template>
<script>
export default {
name: "leftMenu"
}
</script>
<style lang="scss" scoped>
</style>
udf-api/udf-api-server/src/main/resources/templates/common.html
+1 -7
View File
@@ -17,7 +17,7 @@
font-family: 'Microsoft yahei';
font-size: 13px;
font-weight: 400;
background-color: #F2F2F2;
background-color: #FAFAFA;
}
a, a:hover, a:active, a:focus {
@@ -440,22 +440,16 @@
});
//注册按钮点击事件
$('.header-right-bar-registered-div button').on('click', function () {
//打开loading
openLoading();
//跳转注册界面
window.location.href = '/registered.html';
});
//登陆按钮点击事件
$('.header-right-bar-login-div button').on('click', function () {
//打开loading
openLoading();
//跳转登陆界面
window.location.href = '/login.html';
});
//头像按钮点击事件
$('.header-right-bar-user-div').on('click', function () {
//打开loading
openLoading();
//跳转控制台
window.location.href = '/admin';
});