diff --git a/src/App.vue b/src/App.vue
index fd0a6058e0c37592ada243bd055bc6de763fa764..0238e892d05a083cf686935aff017fbba1db5da2 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -10,7 +10,7 @@ import bdMenu from "./components/menu";
export default {
data: () => ({}),
components: {
- bdMenu
+ bdMenu,
},
methods: {
getCurrentUser() {
@@ -24,11 +24,26 @@ export default {
console.log(data.errMsg);
}
});
- }
+ },
+ getMessage() {
+ this.$http
+ .get("/apaas/service/v3/mymsg/unread", {
+ params: {
+ size: 10,
+ page: 1,
+ },
+ })
+ .then(({ data }) => {
+ if (data.success === 1) {
+ this.setUnreadMessageCount(data.data.total || 0);
+ }
+ });
+ },
},
created() {
this.getCurrentUser();
- }
+ this.getMessage();
+ },
};
diff --git a/src/components/menu.vue b/src/components/menu.vue
index cce92cb2540a8d9590dfb20917c15315dc08e3f6..85536b56adb51596739e366ab460350c7bddf02e 100644
--- a/src/components/menu.vue
+++ b/src/components/menu.vue
@@ -12,10 +12,8 @@
class="user"
>{{ userInfo.user_name }}
请登录
-
+
+
退出登录
@@ -89,7 +90,9 @@
@mouseleave.stop="change_now_hover(-1)"
@mouseenter.stop="change_now_hover(indexs)"
@click.stop="gotoChildPage(v, item.visit_url)"
- >{{ v.menu_name }}
+ >
+ {{ v.menu_name }}
+
@@ -127,7 +130,10 @@ export default {
},
userInfo() {
return this.$store.state.userInfo || {};
- }
+ },
+ unreadMessageCount() {
+ return this.$store.state.unreadMessageCount;
+ },
},
watch: {
getMenuCartState(newVal) {
@@ -308,7 +314,7 @@ export default {
left: calc(50% - 12px);
}
.user_menu {
- width: 135px;
+ /* width: 135px; */
background-color: #ffffff;
box-shadow: 0px 3px 6px 0px rgba(15, 19, 65, 0.05);
border-radius: 8px;
@@ -350,10 +356,11 @@ export default {
display: block;
}
.user_menu div {
- width: 135px;
+ /* width: 135px; */
height: 44px;
line-height: 44px;
- text-align: center;
+ padding: 0 30px;
+ text-align: left;
color: #0d1847;
}
.user_menu div:hover {
@@ -435,6 +442,34 @@ export default {
text-overflow: ellipsis;
white-space: nowrap;
}
+.width_num {
+ display: inline-block;
+ vertical-align: middle;
+ min-width: 30px;
+ background-color: #e56600;
+ font-size: 10px;
+ line-height: 16px;
+ color: #fff;
+ padding: 0 8px;
+ margin-left: 5px;
+ box-sizing: border-box;
+ border-radius: 8px;
+ text-align: center;
+ overflow: hidden;
+}
+.user_menu div:hover .width_num {
+ background-color: #fcefd6;
+ color: #e56600;
+}
+.has_msg {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ background-color: #e56600;
+ position: absolute;
+ top: 23px;
+ left: 15px;
+}