Commit 0dc540a1 authored by 张俊's avatar 张俊
parents 17a00040 b5dd6f33
......@@ -6,33 +6,101 @@
'is-front': isFront,
}">
<!-- LOGO -->
<div @click="gotoPage" class="bg-logo">
<img
style="width: 140px; height: 22px"
:src="systemLogo ? JSON.parse(systemLogo)[0].url : getImageUrl('img_logo.png')" />
<router-link to="/" class="bg-logo">
<img style="width: 140px; height: 22px" src="../assets/imgs/img_logo.png" />
</router-link>
<!-- 菜单 -->
<div class="main-menu">
<!-- 前台菜单 -->
<!-- <div v-if="fontMenu && fontMenu.length" class="font-menu">
<div
v-for="(item, index) in fontMenu"
v-show="item.menuType !== 2"
:key="'font' + index"
class="nav-item"
:style="path == item.path ? { backgroundColor: '#3753a4' } : ''"
@click="menuAction(item, item)">
<span>
{{ item.menuName }}
<bg-icon
v-if="item.children && item.children.length && item.menuType !== 1"
icon="#bg-ic-arrow-down"
style="font-size: 8px; margin-left: 3px" />
</span>
<div class="menu-virtual"></div>
<div v-if="item.children && item.children.length" class="menu-list">
<div
v-for="(it, idx) in item.children"
v-show="it.menuType !== 2"
:key="'font-children' + idx"
class="menu-item text_clip"
@click.stop="childMenuAction(it, item)">
{{ it.menuName }}
</div>
</div>
</div>
</div> -->
<!-- 后管菜单 -->
<div v-if="managerMenu && managerMenu.length" class="manager-menu">
<div
v-for="(item, index) in managerMenu"
v-show="item.menuType !== 2"
:key="'manager' + index"
class="nav-item"
:style="path == item.path ? { backgroundColor: '#3753a4' } : ''"
@click="menuAction(item, item)">
<span>
{{ item.menuName }}
<!-- <bg-icon
v-if="item.children && item.children.length"
icon="#bg-ic-arrow-down"
style="font-size: 8px; margin-left: 3px" /> -->
</span>
<!-- <div class="menu-virtual"></div>
<div v-if="item.children && item.children.length" class="menu-list">
<div
v-for="(it, idx) in item.children"
v-show="it.menuType !== 2"
:key="'manager-children' + idx"
class="menu-item text_clip"
@click.stop="childMenuAction(it, item)">
{{ it.menuName }}
</div>
</div> -->
</div>
</div>
</div>
<div class="person-menu" v-if="userInfo && userInfo.system_id">
<div class="person-menu">
<!-- 用户中心 -->
<div class="user-center nav-item">
<span class="user-icon">
<img
style="width: 24px; height: 24px; border-radius: 50%; vertical-align: middle"
v-if="userInfo && userInfo.logo"
style="width: 24px; height: 24px; border-radius: 50%; vertical-align: middle"
:src="userInfo && userInfo.logo" />
<img
style="width: 24px; height: 24px; border-radius: 50%; vertical-align: middle"
v-else
style="width: 24px; height: 24px; border-radius: 50%; vertical-align: middle"
src="../assets/imgs/home_ic_user.png" />
</span>
<span class="user-name" v-if="userInfo && userInfo.system_id">
<span v-if="userInfo && userInfo.system_id" class="user-name">
{{ userInfo.system_account || userInfo.system_id }}
<bg-icon icon="#bg-ic-arrow-down" style="font-size: 8px; margin-left: 3px"></bg-icon>
<bg-icon icon="#bg-ic-arrow-down" style="font-size: 8px; margin-left: 3px" />
</span>
<span class="user-name" v-else> 请登录 </span>
<span v-else class="user-name" @click.stop="menuAction('login')"> 请登录 </span>
<div class="menu-virtual"></div>
<div v-if="userInfo && userInfo.system_id" class="menu-list">
<div
v-for="(item, index) in systemMenu"
:key="index + 700"
class="menu-item text_clip"
@click.stop="menuAction(item, item)">
{{ item.menuName }}
</div>
<div class="menu-item text_clip" @click.stop="menuAction('logout')">退出登录</div>
</div>
</div>
......@@ -45,7 +113,6 @@ import { mapState, mapMutations } from "vuex";
import { clearCookie } from "../services/cookie.js";
import { resetRouter } from "../router/index";
import { normalizeProps } from "vue-demi";
import { getImageUrl } from "@/services/helper.js";
export default {
name: "BgMenu",
......@@ -58,7 +125,6 @@ export default {
},
data() {
return {
getImageUrl,
documentScrollTop: 0,
cartList: [],
showCart: true,
......@@ -71,6 +137,9 @@ export default {
msgUnreadNum() {
return this.$store.state.msgUnreadNum;
},
subscribeNum() {
return this.$store.state.subscribeNum;
},
nameFlag() {
return this.$store.state.nameFlag;
},
......@@ -90,39 +159,35 @@ export default {
let path = this.$route.path;
return false;
},
systemLogo() {
return this.$store.state.systemLogo;
},
...mapState({
fontMenu(state) {
let temp = [];
// state.menu.forEach(e => {
// if(e.dict_group_id=='2cb4f767-fad7-44f2-afa3-f055e15dd2b6'){//font
// temp.push(e)
// }
// });
state.menu.forEach((e) => {
if (e.dict_group_id == "2cb4f767-fad7-44f2-afa3-f055e15dd2b6") {
//font
temp.push(e);
}
});
return temp;
},
managerMenu(state) {
let temp = [];
// state.menu.forEach(e => {
// if(e.dict_group_id=='64c156e0-bfff-4bfc-a63a-56effe130a25'){//system
// // 暂时处理运营管控中心-调用日志,后期规划位置后修改
// if (e.menuName !== '运营看板') {
// temp.push(e)
// }
// // temp.push(e)
// }
// });
state.menu.forEach((e) => {
if (e.dict_group_id == "64c156e0-bfff-4bfc-a63a-56effe130a25") {
temp.push(e);
}
});
return temp;
},
systemMenu(state) {
const { is_admin } = state.userInfo;
let temp = [];
state.menu.forEach((e) => {
if (e.dict_group_id == "09938937-3db9-47de-b967-7777ea4ebb2d") {
//manager
if (e.dict_group_id == "26d3903a-863e-4efc-b53e-0fb8772ddaa4") {
// 业务系统用户和组织管理员配置了后台管理,将其隐藏
if (is_admin < 3 && e.menuName === "管理中心") {
return;
}
temp.push(e);
}
});
......@@ -149,9 +214,6 @@ export default {
navAction(path) {
this.$router.push(path);
},
gotoPage() {
window.open("/so/manage/ui/#/", "_blank");
},
changezz(item) {
this.$trace.setOptionValue("appID", item.value);
},
......@@ -172,9 +234,9 @@ export default {
},
menuAction(n, parent) {
if (n == "logout") {
this.$axios.post(`/apaas/system/v5/user/logout`).then((res) => {
this.$axios.post("/apaas/system/v5/user/logout").then((res) => {
if (res.data.code == "200") {
window.location.href = `/so/manage/ui/#/login`;
window.location.href = "/apaas/manage/ui/#/login";
this.$store.commit("setUserInfo", null);
clearCookie("bgToken");
this.$message.success("退出成功");
......@@ -185,7 +247,7 @@ export default {
});
} else if (n == "login") {
let path = this.$route.path;
window.location.href = `/so/manage/ui/#/login?redirect=${path}`;
window.location.href = `/apaas/manage/ui/#/login?redirect=${path}`;
} else {
//是否有子路由,有则寻找子路由的第一个进行跳转,无则直接进行跳转
//使用childMenuAction是模拟template中,子路径点击跳转使用childMenuAction,
......@@ -201,7 +263,7 @@ export default {
//最多只有2层目录,childMenuAction已经进入第一层,只需判断是否还有第二层即可
//有第二层则继续找第二层的第一个跳转
//无第二层则直接跳转
if (v.children && v.children.length) {
if (v.menuType !== 1 && v.children && v.children.length) {
for (let index = 0; index < v.children.length; index++) {
const e = v.children[index];
if (e.menuType !== 2) {
......@@ -214,18 +276,33 @@ export default {
}
},
pathToUrl(item, parent) {
//判断是否是外链,是则新开窗口跳转
if (item.path.includes("http")) {
//判断是否是新窗口打开
if (item.new_window) {
window.open(item.path, "_blank");
} else {
//判断是否是新窗口打开
if (item.new_window) {
window.open(item.path, "_blank");
// 当前窗口打开
if (item.path.indexOf("#") > -1) {
// 携带#说明是其它项目,使用window.location.href
window.location.href = item.path;
} else {
// 不携带#说明是本项目,使用router.push
this.$router.push(item.path);
}
}
},
intoCartDetail() {
this.$router.push({ name: "shopCart" });
},
goSubscription() {
window.location.href = "/apaas/portal/ui/#/my-subscription";
},
deleteItem(id) {
this.$api.serviceShop.delShoppingCart([id]).then((response) => {
if (response.data.success == 1) {
this.$store.commit("setCartState");
}
});
},
shopMenuAction() {
this.showShopMenu = false;
},
......@@ -235,9 +312,38 @@ export default {
scrollAction() {
this.documentScrollTop = document.documentElement.scrollTop || 0;
},
getFirstPath(item) {
if (item.path) {
if (item.children) {
if (item.children[0].children) {
if (item.children[0].children[0].children) {
return item.children[0].children[0].children[0].path;
} else {
return item.children[0].children[0].path;
}
} else {
return item.children[0].path;
}
} else {
return item.path;
}
} else {
return "";
}
},
// getSubscriptNum() {
// this.$axios.get("/apaas/service/v5/subscription/list").then((res) => {
// if (res.data.code == 200) {
// let data = res.data.data;
// this.$store.commit("setSubscribeNum", data.total);
// }
// });
// },
},
created() {
// console.log(this.userInfo);
this.getLogo();
// this.getSubscriptNum();
if (this.userInfo) {
// this.getUserDetail(this.userInfo.user_id)
} else {
......@@ -245,11 +351,13 @@ export default {
}
},
mounted() {
// console.log(this.currentMenuIndex);
this.$nextTick(this.scrollAction);
window.addEventListener("scroll", this.scrollAction, true);
window.addEventListener("click", this.shopMenEventListener);
},
destroyed() {
unmounted() {
window.removeEventListener("scroll", this.scrollAction, true);
window.removeEventListener("click", this.shopMenEventListener);
},
......@@ -293,7 +401,7 @@ export default {
}
> .menu-list {
box-shadow: 0px 4px 12px 0px rgba(18, 30, 63, 0.1);
box-shadow: 0 4px 12px 0 rgba(18, 30, 63, 0.1);
background-color: #ffffff;
border-radius: 4px;
overflow: hidden;
......@@ -350,6 +458,36 @@ export default {
}
}
// 超市菜单
> .bg-shop-menu {
height: 100%;
> .shop-menu-btn {
width: 105px;
height: 100%;
background-color: #062a44;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
> span {
font-size: 16px;
line-height: 20px;
color: #ffffff;
margin-left: 10px;
}
}
> .shop-menu {
position: fixed;
top: 56px;
left: 0;
width: 900px;
height: calc(100vh - 56px);
}
}
// LOGO
> .bg-logo {
display: flex;
......@@ -370,6 +508,184 @@ export default {
}
}
// 主菜单
> .main-menu {
height: 100%;
flex-grow: 1;
display: flex;
justify-content: space-between;
align-items: center;
margin-right: 8px;
.font-menu {
height: 100%;
display: flex;
}
.manager-menu {
height: 100%;
display: flex;
}
.nav-item {
font-size: 14px;
height: 56px;
padding: 0 24px;
line-height: 56px;
text-align: center;
position: relative;
> .menu-virtual {
left: 0;
right: auto;
}
> .menu-list {
left: 0;
right: auto;
> .menu-item {
cursor: pointer;
}
}
&:hover {
background-color: #3753a4;
}
}
}
// 分割线
> .shop-line {
width: 1px;
height: 24px;
background-color: #536883;
margin-right: 50px;
}
// 购物车
> .shop-cart {
height: 100%;
position: relative;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
margin-right: 50px;
&:hover {
.cart-detail {
display: block;
}
}
> .cart-info {
display: flex;
justify-content: space-between;
align-items: center;
> span {
min-width: 36px;
height: 18px;
background-color: #ff6a00;
border-radius: 9px;
padding: 0 9px;
box-sizing: border-box;
font-size: 12px;
line-height: 18px;
color: #ffffff;
text-align: center;
margin-left: 5px;
}
}
> .cart-detail {
width: 280px;
background-color: #ffffff;
box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05);
border-radius: 8px;
position: absolute;
top: 56px;
left: -20px;
display: none;
z-index: 3;
padding: 10px 20px;
> .cart-title {
color: #8890a7;
font-size: 14px;
height: 30px;
line-height: 30px;
}
> .cart-list {
height: 80px;
padding: 10px 0;
display: flex;
line-height: 26px;
border-bottom: #f4f7fc 2px solid;
&:nth-last-child(2) {
border-bottom: 0;
}
> .shop_img {
width: 60px;
height: 60px;
border-radius: 8px;
}
> .shop_cell_msgs {
width: calc(100% - 80px);
margin-left: 10px;
> .shop_cell_name {
color: #2d3867;
font-size: 14px;
line-height: 24px;
&:hover {
color: #0d0807;
}
}
> .shop_cell_msg {
color: #8890a7;
font-size: 12px;
line-height: 18px;
}
> .over_one {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
> .cart-action {
width: 100%;
height: 50px;
text-align: right;
padding: 15px 0;
line-height: 30px;
> .el-button {
background-color: #ff6a00;
color: #fcefd6;
}
}
&::before {
content: "";
width: 16px;
height: 16px;
background-color: #fff;
position: absolute;
top: -7px;
left: 38px;
transform: rotate(45deg);
}
}
}
//个人菜单
.person-menu {
height: 100%;
......@@ -379,6 +695,16 @@ export default {
align-items: center;
column-gap: 35px;
&::before {
content: "";
width: 1px;
height: 24px;
background-color: #5c6da4;
position: absolute;
left: 0;
top: 16px;
}
.message {
height: 16px;
line-height: 16px;
......@@ -424,6 +750,7 @@ export default {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
line-height: 20px;
font-size: 14px;
}
}
......
......@@ -82,7 +82,7 @@ function getMenuObj(menu, parentRowPath, menuObj) {
});
}
store.commit("setWhiteList", ["/", "/login", "/register", "/password"]);
Promise.all([getUser(), getMenu("dadb2d3f-e263-48d1-9389-42acb9ea49f8")])
Promise.all([getUser(), getMenu("79a8f214-db78-4db7-9c28-db66276b4be2")])
.then((res) => {
if (res[0].data.code == 200 && res[1].data.code == 200) {
//已登录则记录菜单和用户信息
......
<template>
<div>组织管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>角色管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>用户管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>主机管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>任务历史</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>任务管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>预警列表</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>预警规则管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>字典管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>日志管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>菜单管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>首选项配置</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>访问控制管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>业务工单列表</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>业务工单管理</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>我的业务工单</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
<template>
<div>我的预警工单</div>
</template>
<script setup></script>
<style lang="scss" scoped></style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment