family-education/education_uni/subpkg/message_detail/message_detail.vue

<template>
	<view class="container">
		<view class="title">{{msg.msgTitle}}</view>
		<view>
			<text class="text1">{{msg.big}}:</text> 
			<text class="text2" @click="gotoInvite">{{msg.small}}</text>
		</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)
				this.userinfo.count--
				this.updateUserInfo(this.userinfo)
			},
			gotoInvite() {
				if (this.msg.msgTitle === '支付通知') {
					uni.navigateTo({
						url: '/subpkg/order_detail/order_detail?orderId='+encodeURIComponent(this.msg.small)
					})
				} else if (this.msg.msgTitle === '邀请函'){
					uni.navigateTo({
						url: '/subpkg/my_got_invitation_detail/my_got_invitation_detail?item='+encodeURIComponent(this.msg.small)
					})
				} else if (this.msg.msgTitle === '支付成功') {
					uni.navigateTo({
						url: '/subpkg/student_order_detail/student_order_detail?orderId='+encodeURIComponent(this.msg.small)
					})
				} else if (this.msg.msgTitle === '申请退款') {
					uni.navigateTo({
						url: '/subpkg/student_order_detail/student_order_detail?orderId='+encodeURIComponent(this.msg.small)
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
.container {
	border-radius: 15%;
	background-color: #FFF2CC;
	height: 100%;
	
	.title {
		text-align: center;
		font-weight: 500;
		font-size: 40rpx;
		color: darkorange;
		margin-bottom: 20px;
	}
	
	.text1 {
		padding-left: 40px;
		line-height: 30px;
		font-size: 35rpx;
	}
	
	.text2 {
		color: red;
		text-decoration: underline;
	}
}
</style>