diff --git a/IndexMain.vue b/IndexMain.vue new file mode 100644 index 0000000..7deb69b --- /dev/null +++ b/IndexMain.vue @@ -0,0 +1,124 @@ +<template> + <el-main> + <bread-crumbs :title="title" class="bread-crumbs"></bread-crumbs> + <router-view class="router-view"></router-view> + </el-main> +</template> +<script> + import menu from "@/utils/menu"; + export default { + data() { + return { + menuList: [], + role: "", + currentIndex: -2, + itemMenu: [], + title: '' + }; + }, + mounted() { + let menus = menu.list(); + this.menuList = menus; + this.role = this.$storage.get("role"); + }, + methods: { + menuHandler(menu) { + this.$router.push({ + name: menu.tableName + }); + this.title = menu.menu; + }, + titleChange(index, menus) { + this.currentIndex = index + this.itemMenu = menus; + console.log(menus); + }, + homeChange(index) { + this.itemMenu = []; + this.title = "" + this.currentIndex = index + this.$router.push({ + name: 'home' + }); + }, + centerChange(index) { + this.itemMenu = [{ + "buttons": ["新增", "查看", "修改", "删除"], + "menu": "修改密码", + "tableName": "updatePassword" + }, { + "buttons": ["新增", "查看", "修改", "删除"], + "menu": "个人信息", + "tableName": "center" + }]; + this.title = "" + this.currentIndex = index + this.$router.push({ + name: 'home' + }); + } + } + }; +</script> +<style lang="scss" scoped> + a { + text-decoration: none; + color: #555; + } + + a:hover { + background: #00c292; + } + + .nav-list { + width: 100%; + margin: 0 auto; + text-align: left; + margin-top: 20px; + + .nav-title { + display: inline-block; + font-size: 15px; + color: #333; + padding: 15px 25px; + border: none; + } + + .nav-title.active { + color: #555; + cursor: default; + background-color: #fff; + } + } + + .nav-item { + margin-top: 20px; + background: #FFFFFF; + padding: 15px 0; + + .menu { + padding: 15px 25px; + } + } + + .el-main { + background-color: #F6F8FA; + padding: 0 24px; + // padding-top: 60px; + } + + .router-view { + padding: 10px; + margin-top: 10px; + background: #FFFFFF; + box-sizing: border-box; + } + + .bread-crumbs { + width: 100%; + // border-bottom: 1px solid #e9eef3; + // border-top: 1px solid #e9eef3; + margin-top: 10px; + box-sizing: border-box; + } +</style>