family-education/education_uni/subpkg/my/message/my_message_detail.vue

<template>
	<view class="container">
		<view class="title">{{msg.msgTitle}}</view>
		<view class="text1">{{msg.big}}</view>
		<view class="text2"  @click="gotoInvite" >{{msg.small}}</view>
	</view>
</template>

<script>
	import { mapMutations, mapState } from 'vuex'
	export default {
		computed: {
			...mapState('m_user', ['userinfo'])
		},
		data() {
			return {
				msg: {}
			};
		},
		onLoad(option) {
			this.msg = JSON.parse(decodeURIComponent(option.item))
			let arr = this.msg.msgContent.split("：")
			this.msg.big = arr[0]
			this.msg.small = arr[1]
			
			if (this.msg.status == '未读') { 
				this.updateStatus(this.msg.id)
			}
		},
		methods: {
			...mapMutations('m_user', ['updateUserInfo']),
			updateStatus(id) {
				const query = {
					id
				}
				uni.$http.get('/education/mp-inner-msg/updateMsg', query)
				
				if (this.userinfo.count > 0) {
					this.userinfo.count--
					this.updateUserInfo(this.userinfo)
				}
			},
			gotoInvite() {
				if (this.msg.msgTitle === '支付通知') {
					uni.navigateTo({
						url: '/subpkg/my/order/my_order_detail?orderId='+encodeURIComponent(this.msg.small)
					})
				} else if (this.msg.msgTitle === '邀请函'){
					uni.navigateTo({
						url: '/subpkg/my/invitation/my_invitation_receive_detail?id='+encodeURIComponent(this.msg.small)
					})
				} else if (this.msg.msgTitle === '支付成功') {
					uni.navigateTo({
						url: '/subpkg/student/order/student_order_detail?orderId='+encodeURIComponent(this.msg.small)
					})
				} else if (this.msg.msgTitle === '申请退款') {
					uni.navigateTo({
						url: '/subpkg/student/order/student_order_detail?orderId='+encodeURIComponent(this.msg.small)
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.container {
	border-radius: 40rpx;
	background-color: #fff;
	height: 40%;
	margin-left: 20rpx;
	margin-right: 20rpx;
    padding: 20px 20px;
	flex-wrap: wrap;
}

.title {
	text-align: center;
	font-weight: bold;
	font-size: 35rpx;
	color: #6d6d6d;
	padding-bottom: 20px;
	//margin-bottom: 20px;
}
	
.text1 {
	//padding-left: 40px;
	text-align: center;
	line-height: 30px;
	font-size: 35rpx;
}
	
.text2 {
	text-align: center;
	color: blue;
	text-decoration: underline;
	padding-top: 40px;
}
</style>