saas_miniprogram/pages2/msg/detail.vue

<template>
	<view style="padding: 20rpx;">
		<view class="item">
			<view class="title">{{ listData.systemStatus === 2 ? listData.informVo.informName : listData.systemStatus === 1 ? listData.remind : '' }}</view>
			<view class="time">{{ $method.timestampToTime(listData.sendTime, false) }}</view>
			<view v-if="listData.systemStatus === 2" class="content" v-html="listData.informVo.affiche" style="width: 100%;"></view>
			<view v-if="listData.systemStatus === 1" class="content" style="width: 100%;">{{ listData.text }}</view>
			<view class="boxstistyle">
				<view class="lsow" style="border-bottom: 1rpx solid #eee;margin-top: 10rpx;" v-for="(item, index) in listData.informVo.informCourseVo" :key="index">
					<view class="h4">{{ item.goodsName }}</view>
					<view class="h33">
						{{ item.courseName }}{{ item.moduleName ? '/' + item.moduleName : '' }}{{ item.chapterName ? '/' + item.chapterName : '' }}{{ item.sectionName }}
					</view>
					<view style="display: flex;align-items: center;margin:28rpx 0rpx;">
						<image style="width: 35rpx;height: 35rpx;" src="@/static/courseIcon.png" mode=""></image>
						<text class="timeStys">第{{ item.topicNum }}分钟</text>
						<text class="aSty" @click="jumpSection(item)">点击可直接跳转</text>
					</view>
				</view>
				<view class="lsow" style="border-bottom: 1rpx solid #eee;margin-top: 10rpx;" v-for="(item, index) in listData.informVo.informExamVo" :key="index">
					<view class="h4">{{ item.goodsName }}</view>
					<view class="h33">{{ item.moduleName ? '/' + item.moduleName : '' }}{{ item.chapterName ? '/' + item.chapterName : '' }}{{ item.examName }}</view>
					<view style="display: flex;align-items: center;margin:28rpx 0rpx;">
						<image style="width: 35rpx;height: 35rpx;" src="@/static/examIcon.png" mode=""></image>
						<text class="timeStys">第{{ item.topicNum }}道题</text>
						<text class="aSty" @click="jumpSection(item)">点击可直接跳转</text>
					</view>
				</view>
			</view>
		</view>
		<view class="btn1" @click="isOk" v-if="listData.systemStatus === 2 && listData.receiptStatus === 0">我已阅读</view>
		<view class="btn1" v-if="listData.systemStatus === 1 && getNames(listData.remindId) !== ''" @click="jumpFuns(listData)">{{ getNames(listData.remindId) }}</view>
	</view>
</template>

<script>
import { mapGetters } from 'vuex';
export default {
	components: {},
	data() {
		return {
			listData: {},
			id: null,
			img1: '/static/icon/msg_icon1.png',
			img2: '/static/icon/msg_icon2.png'
		};
	},
	onPullDownRefresh() {},
	onLoad(option) {
		this.id = Number(option.id);
		this.getInfo();
	},
	onShow() {
		/* if(this.current === 2 && this.$method.isLogin()){
			this.$refs.refMy.init();
		} */
	},
	onShareAppMessage(res) {
		var self = this;
		return {
			title: '中正',
			path: `/pages/index/index?inviteCode=` + userInfo == null ? '' : userInfo.userAccount
		};
	},
	methods: {
		//跳转页面
		jumpFuns(item) {
			switch (item.remindId) {
				case 1:
				case 3:
				case 5:
				case 6:
				case 7:
				case 19:
				case 21:
				case 22:
					this.$navTo.togo('/pages2/wd/course', {
						id: item.goodsId
					});
					// arsty = '立刻学习';
					break;
				case 2:
				case 4:
					this.$navTo.togo('/pages2/verify/input', {
						id: item.goodsId
					});
					break;
				case 10:
				case 12:
				case 18:
					// arsty = '立即重学';
					break;
				case 11:
				case 13:
					var data = {
						goodsId: item.goodsId,
						gradeId: item.gradeId
					};
					this.$api.getApplysubscribe(data).then(res => {
						if (res.data.code === 500) {
							uni.showModal({
								showCancel: false,
								content: res.data.msg
							});
						}
						if (res.data.code === 200) {
							this.$navTo.togo('/pages2/appointment/index', {
								goodsId: item.goodsId,
								gradeId: item.gradeId
							});
						}
					});
					break;
				case 20:
					// arsty = '重新购买';
					break;
				default:
					break;
			}
		},
		//跳转节视频
		jumpSection(item) {
			console.log(item);
		},
		//跳转题库题目
		jumpExam(item) {
			console.log(item);
		},
		isOk() {
			this.$api.courseappinformUser({ id: this.listData.id, receiptStatus: 1 }).then(res => {
				if (res.data.code === 200) {
					uni.navigateBack({
						delta: 1
					});
				}
			});
		},
		backPage() {
			uni.navigateBack({
				delta: 1
			});
		},
		getInfo() {
			this.$api.getappinformUserId(this.id).then(res => {
				if (res.data.code === 200) {
					if (!res.data.data.receiptStatus) {
						this.$api.courseappinformUser({ id: res.data.data.id, receiptStatus: 1 }).then(res => {
							if (res.data.code === 200) {
							}
						});
					}
					if (res.data.data.informVo && res.data.data.informVo.affiche) {
						res.data.data.informVo.affiche = res.data.data.informVo.affiche.replace(/<img/gi, '<img style="max-width:100%;"');
					}
					this.listData = res.data.data;
				}
			});
		},
		change(index) {
			this.current = index;
		},
		getNames(int) {
			var arsty = '';
			switch (int) {
				case 1:
				case 3:
				case 5:
				case 6:
				case 7:
				case 19:
				case 21:
				case 22:
					arsty = '立刻学习';
					break;
				case 2:
				case 4:
					arsty = '马上填写';
					break;
				case 10:
				case 12:
				case 18:
					arsty = '立即重学';
					break;
				case 11:
					arsty = '立即预约';
					break;
				case 13:
					arsty = '预约考试';
					break;
				case 20:
					arsty = '重新购买';
					break;
				default:
					break;
			}
			return arsty;
		}
	},
	onReachBottom() {},
	computed: { ...mapGetters(['userInfo']) }
};
</script>
<style>
page {
	background: #eaeef1;
}
</style>
<style scoped>
.lsow:last-child {
	border-bottom: none !important;
}
.timeStys {
	margin: 0rpx 6rpx;
	color: #007aff;
	font-size: 28rpx;
	font-weight: bold;
	border-bottom: 1rpx solid #007aff;
}
.h4 {
	color: #333;
	font-size: 28rpx;
	font-weight: bold;
}
.aSty {
	color: #999;
	font-size: 24rpx;
	margin-left: 8rpx;
}
.h33 {
	font-size: 28rpx;
	color: #666;
}
.content {
	font-size: 28rpx;
	color: #666666;
	line-height: 36rpx;
}
.time {
	font-size: 24rpx;
	color: #999999;
	margin: 15rpx 0;
}
.btn1 {
	width: 526rpx;
	height: 80rpx;
	background: #007aff;
	border-radius: 40rpx;
	color: #ffffff;
	font-size: 30rpx;
	font-weight: bold;
	text-align: center;
	line-height: 80rpx;
	margin: 30rpx auto;
}
.item {
	width: 100%;
	background: #ffffff;
	border-radius: 16rpx;
	padding: 15rpx;
}
.title {
	font-size: 30rpx;
	font-weight: bold;
	color: #333333;
}
</style>