WechatOwnerService/pages/machine/openDoor.vue

<template>
	<view>
		<view>
			<image :src="topImg" class="heard-location-icon"></image>
		</view>
		<view class="cu-list grid" :class="'col-2'">
			<view class="cu-item" @click="showOpenDoor(item);" v-for="(item,index) in machines" :key="index">
				<view :class="['cuIcon-command','text-red']"></view>
				<text>{{item.machineName}}</text>
			</view>
		</view>

		<view class="cu-modal" :class="openDoorFlag==true?'show':''" >
			<view class="cu-dialog" >
				<view class="cu-bar bg-white justify-end">
					<view class="content">{{curMachine.machineName}}</view>
					<view class="action" @tap="_cancleCall()">
						<text class="cuIcon-close text-red"></text>
					</view>
				</view>
				<view class="padding-xl">
					您确认开门? 开门次数有限,请勿频繁操作！
				</view>
				<view class="cu-bar bg-white justify-end">
					<view class="action margin-0 flex-sub  solid-left" @tap="_cancleOpenDoor()">取消</view>
					<view class="action margin-0 flex-sub  solid-left" v-if="curMachine.monitorId && curMachine.monitorId != '-1'" @tap="_viewDoorVideo()">视频</view>
					<view class="action margin-0 flex-sub text-green solid-left" @tap="_doOpenDoor()">确认开门</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import noDataPage from '@/components/no-data-page/no-data-page.vue';
	import {
		listOwnerMachines,
		openDoor,
		getOwnerAcVideoUrl
	} from '@/api/applicationKey/applicationKeyApi.js'
	import {
		getCurOwner
	} from '../../api/owner/ownerApi.js';
	import {
		autoLogin
	} from '../../api/user/sessionApi.js';
	export default {
		data() {
			return {
				machines: [],
				communityName: '',
				communityId: '',
				openDoorFlag: false,
				curMachine: {},
				memberId: '',
				videoUrl:'',
				topImg: this.imgUrl + '/h5/images/openDoorTop.png'
			};
		},
		components: {
			noDataPage
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			this.vc.onLoad(options);
			autoLogin(options);
			this.loadOwnerMachines();
		},

		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {},
		methods: {
			loadOwnerMachines: function() {
				let _that = this;

				getCurOwner()
					.then((_owner) => {
						let _data = {
							memberId: _owner.memberId,
							communityId: _owner.communityId,
							page:1,
							row:300
						};
						_that.communityName = _owner.communityName;
						_that.communityId = _owner.communityId;
						_that.memberId = _owner.memberId;
						listOwnerMachines(_data)
							.then((_machines) => {
								_that.machines = _machines;
							})
					})
			},
			showOpenDoor: function(_machine) {
				//调用视频播放地址
				this.openDoorFlag = true;
				this.curMachine = _machine;
			},
			_cancleOpenDoor: function() {
				this.openDoorFlag = false;
				this.curMachine = {};
			},
			_viewDoorVideo:function(){
				
				uni.navigateTo({
					url:'/pages/machine/openDoorVideo?machineId='
					+this.curMachine.monitorId
					+"&machineName="+this.curMachine.monitorName
					+"&memberId="+this.memberId
					+"&machineCode="+this.curMachine.machineCode
				});
				this._cancleOpenDoor();
			},
			_doOpenDoor: function() {
				let _that = this;
				wx.showLoading({
					title: '请求中'
				});
				openDoor({
					communityId: this.communityId,
					userRole: 'owner',
					machineCode: _that.curMachine.machineCode,
					memberId: this.memberId
				}).then((res) => {
					wx.hideLoading();
					let data = res.data;
					let msg = '';
					if (data.code == 0) {
						msg = '请求发送至门禁'
					} else {
						msg = data.msg;
					}
					wx.showToast({
						title: msg,
						icon: 'none',
						duration: 2000
					});
					_that._cancleOpenDoor();
				}, (err) => {
					wx.hideLoading();
					wx.showToast({
						title: '开门失败',
						icon: 'none',
						duration: 2000
					});
					_that._cancleOpenDoor();
				})
			}
		}
	};
</script>
<style>
	.heard-location-icon {
		width: 100%;
		height: 300rpx;
	}

	text {
		text-align: center;
	}
</style>