消息与头像显示

src/projects/business/components/NavMenu.vue

@@ -4,9 +4,10 @@
 			<span class="mui-icon iconfont icon-shouye2"></span>
 			<span class="mui-tab-label">首页</span>
 		</router-link>
-		<router-link :to="router[1]" :class="'mui-tab-item '+(routeName==router[1]['name']?'mui-active':'')">
+		<router-link :to="router[1]" :class="'message-nav mui-tab-item '+(routeName==router[1]['name']?'mui-active':'')">
 			<span class="mui-icon iconfont icon-xiaoxi1"></span>
 			<span class="mui-tab-label">消息</span>
+			<i v-show="wd_message_num && wd_message_num>0" v-text="wd_message_num"></i>
 		</router-link>
 		<router-link :to="router[2]" :class="'mui-tab-item '+(routeName==router[2]['name']?'mui-active':'')">
 			<span class="mui-icon iconfont icon-wode1"></span>
@@ -16,6 +17,10 @@
 </template>
 
 <script>
+	import {
+		mapGetters,
+		mapMutations
+	} from 'vuex'
 	export default {
 		name: 'NavMenu',
 		props: {
@@ -51,10 +56,29 @@
 					console.log(newValue)
 				}
 			},
+			...mapGetters({
+				wd_message_num: 'wd_message_num',
+			})
 		}
 	}
 </script>
 
 <style src="$project/assets/css/iconfont.css"></style>
 <style scoped>
+	.message-nav {
+		position: relative;
+	}
+
+	.message-nav i {
+		position: absolute;
+		top: 1px;
+		right: 40px;
+		background-color: red;
+		border-radius: 9px;
+		color: #fff;
+		padding: 0px 6px;
+		font-size: 12px;
+		line-height: 18px;
+		z-index: 99;
+	}
 </style>

src/projects/business/views/Master/Home.vue

@@ -138,6 +138,7 @@
 		mapGetters,
 		mapMutations
 	} from 'vuex'
+	import * as types from '$project/store/mutation-types'
 	export default {
 		name: 'Master',
 		components: {
@@ -206,6 +207,8 @@
 				API_Notice.prefetch().then(response => {
 					this.isLoading = false;
 
+					this.set_wd_message_num(response);
+
 					this.getLastNotice();
 				}).catch(error => {
 					this.isLoading = false;
@@ -229,13 +232,13 @@
 			},
 			//引入图片
 			requirePic(file) {
-                if (file) {
-                    if (file.indexOf('http') == 0) {
-                        return file;
-                    } else {
-                        return require('$project/assets/img/' + file);
-                    }
-                }
+				if (file) {
+					if (file.indexOf('http') == 0) {
+						return file;
+					} else {
+						return require('$project/assets/img/' + file);
+					}
+				}
 			},
 			asynCallBack() {
 				//获取用户角色列表
@@ -243,6 +246,9 @@
 				//获取最新二条通知消息
 				this.prefetchNotice();
 			},
+			...mapMutations({
+				set_wd_message_num: types.SET_WD_MESSAGE_NUM,
+			})
 		},
 		mounted() {
 			var gallery = mui('.mui-slider');

src/projects/home/views/Register/Home.vue

@@ -12,7 +12,7 @@
 					<li v-for="(item,index) in roleList" class="mui-table-view-cell mui-media mui-col-xs-4">
 						<a>
 							<div class="mui-media-object">
-								<img :src="item.faceImagUrl">
+								<img :src="person_data.faceImageUrl">
 							</div>
 							<div class="mui-media-body">
 								{{item.job?item.job:item.personRoleName}}

src/store/getters.js

@@ -27,3 +27,5 @@ export const old_relation_form_data = state => state.old_relation_form_data
 export const wx_pay_back_url = state => state.wx_pay_back_url
 
 export const register_examine_form = state => state.register_examine_form
+
+export const wd_message_num = state => state.wd_message_num

src/store/mutation-types.js

@@ -13,4 +13,5 @@ export const SET_COMMON_MENU_LIST = 'SET_COMMON_MENU_LIST'
 export const SET_PERSION_HOME_MODEL = 'SET_PERSION_HOME_MODEL'
 export const SET_OLD_RELATION_FORM_DATA = 'SET_OLD_RELATION_FORM_DATA'
 export const SET_WX_PAY_BACK_URL = 'SET_WX_PAY_BACK_URL'
-export const SET_REGISTER_EXAMINE_FORM = 'SET_REGISTER_EXAMINE_FORM'
+export const SET_REGISTER_EXAMINE_FORM = 'SET_REGISTER_EXAMINE_FORM'
+export const SET_WD_MESSAGE_NUM = 'SET_WD_MESSAGE_NUM'

src/store/mutations.js

@@ -12,7 +12,8 @@ import {
 	setAppVersion,
 	setPersionHomeModel,
 	setOldRelationFormData,
-	setWxPayBackUrl
+	setWxPayBackUrl,
+	setWdMessageNum
 } from '../utils/storage'
 
 var storage_prefix = process.env.VUE_APP_LOCAL_STORAGE_PREFIX;
@@ -92,10 +93,15 @@ const mutations = {
 		setWxPayBackUrl(storage_prefix, data)
 		state.wx_pay_back_url = data
 	},
-	
+
 	[types.SET_REGISTER_EXAMINE_FORM](state, data) {
 		state.register_examine_form = data
 	},
+
+	[types.SET_WD_MESSAGE_NUM](state, data) {
+		setWdMessageNum(storage_prefix, data)
+		state.wd_message_num = data
+	},
 }
 
 export default mutations

src/store/state.js

@@ -11,7 +11,8 @@ import {
 	getAppVersion,
 	getPersionHomeModel,
 	getOldRelationFormData,
-	getWxPayBackUrl
+	getWxPayBackUrl,
+	getWdMessageNum
 } from '../utils/storage'
 
 var storage_prefix = process.env.VUE_APP_LOCAL_STORAGE_PREFIX;
@@ -34,6 +35,7 @@ const state = {
 	old_relation_form_data: getOldRelationFormData(storage_prefix),
 	wx_pay_back_url: getWxPayBackUrl(storage_prefix),
 	register_examine_form: '',
+	wd_message_num: getWdMessageNum(storage_prefix),
 }
 
 export default state

src/utils/storage.js

@@ -101,3 +101,7 @@ export const getOldRelationFormData = (channel) => get(channel + '_old_relation_
 export const getWxPayBackUrl = (channel) => get(channel + '_wx_pay_back_url')
 
 export const setWxPayBackUrl = (channel, data) => set(channel + '_wx_pay_back_url', data)
+
+export const getWdMessageNum = (channel) => get(channel + '_wd_message_num')
+
+export const setWdMessageNum = (channel, data) => set(channel + '_wd_message_num', data)