jp-xpgj-GA-file/src/projects/business/views/Master/Live/Info.vue

<template>
<div>

	<common @asynCallBack="asynCallBack"></common>
	<top-header :pageTitle="pageTitle"   :routeName="routeName"    ></top-header>

	<div class="mui-content vongi-fklist vongi-spkh" v-if="buystatus&&list.length" >
				<div class="vongi-spkh-title flew">
					<div class="mui-media-body">
						<span class="mui-media-object mui-pull-left">
							<img :src="person_data.faceImageUrl" :alt="person_data.name">
						</span>  {{person_data.name}}
					</div>
					<p class='mui-ellipsis'>有效期至{{endtime}} <a @click="goToPay()" >续期</a></p>
				</div>
				<ul class="mui-table-view openfyy-list">
					<li class="mui-table-view-cell mui-media"  v-for="(mod,index) in list">
						<a @click="goToPlay(mod.id)" >
							<div class="vongi-video-img"><img :src="mod.picUrl"   width="100%"></div>
							<div class="mui-media-body flew">
								{{mod.roomAddress}}
								<p class='mui-ellipsis'>[{{mod.status=='1'?'在线':'离线'}}]</p>
							</div>
						</a>
					</li>
				</ul>
			</div>
			<!--未开通服务状态-->
			 <div class="mui-content vongi-spkh" v-if="!buystatus">
				<div class="vongi-payyes-icon">
					<img src="~$project/assets/img/gkke01.png" width="128" />
					<h2>暂未开通视频看护服务</h2>
				</div>
				<div class="vongi-rec-btn-white">
					<div class="vongi-rec-btn" @click="goToPay()">开通服务</div>
				</div>
			</div>
			<!--已购买尚未开通状态-->
			 <div class="mui-content vongi-spkh" v-if="buystatus&&!list.length" >
				<div class="vongi-payyes-icon">
					<img src="~$project/assets/img/spkh.png" />
					<h2>感谢您购买视频看护服务<br>现已加入安装排期计划</h2>
				</div>
			</div>
			<div class="fyy-footer" v-if="buystatus&&!list.length">
				<div class="fyy-footer-text">
					我们将会通过电话方式与您确定上门安装时间<br>
					请保持联系方式的通讯畅通<br>
					服务咨询电话: 400-8899-619
				</div>
			</div>
	<loading :visible="isLoading"></loading>

</div>
</template>


<script>

	import * as API  from '@/apis/Master/live'
	import Common from '$project/components/Common.vue'
	import Loading from '$project/components/Loading.vue'
	import TopHeader from '$project/components/TopHeader.vue'
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	import {
		currentTimeStamp,
		parseUnixTime
	} from '$project/utils'
	export default {
		name: 'MasterLiveInfo',
		components: {
			Common,
			Loading,
			TopHeader
		},
		data() {
			return {
				pageTitle: '视频看护',

				buystatus: false,
				list: [],
				endtime: null,
				isLoading: false,
				routeName:'Master'

			}
		},
		created() {
 		},
		methods:  {

			goToPlay(cameraId) {
				this.$router.push({
					name: 'MasterLiveRoom',
					query: {
						id: cameraId
					}
				})
			},
			goToPay() {

				this.$router.push({
					name: 'MasterLiveShow',
				})
			},
			queryCameraList() {
				this.isLoading = true;

				API.queryCameraList({
					//currentId:this.student_current_info.id
				}).then(response => {
					this.isLoading = false;

					this.buystatus = response.buystatus;
					if (this.buystatus) {
						this.list = response.list;
						this.endtime = response.endtime;
					}
					if(false){

						this.$router.push({
							name: 'MasterLiveShow',
							query: {
								routeName: "Master"
							}
						})
					}
				}).catch(error => {
					this.isLoading = false;
					mui.toast(error);
				})
			},asynCallBack(){},
		},
		mounted() {
			this.queryCameraList();
		},


		destroyed() {

		},
		computed: {
			...mapGetters({
				openId: 'wx_openid',
				token: 'token',
				person_data: 'person_data',
				person_popedom: 'person_popedom',
			})
		}
	}
</script>

<style scoped src="$project/assets/css/pension.css"></style>
<style scoped src="$project/assets/css/xpwyfyy.css"></style>
<style src="$project/assets/css/iconfont.css"></style>
<style>
</style>