dever 4 سال پیش
والد
کامیت
a6700b9b9b
5فایلهای تغییر یافته به همراه168 افزوده شده و 147 حذف شده
  1. 20 9
      lib/dever/components/seat.vue
  2. 37 12
      lib/dever/components/video.nvue
  3. 105 122
      lib/graceUI/components/graceDialog.vue
  4. 4 3
      pages/dream/view/product.vue
  5. 2 1
      pages/dream/view/vodShort.vue

+ 20 - 9
lib/dever/components/seat.vue

@@ -55,7 +55,6 @@
 </template>
 <script>
 	import deverPublish from '@/lib/dever/components/publish.vue';
-	let cycle;
 	export default {
 		props: {
 			type : {
@@ -77,6 +76,7 @@
 		},
 		data() {
 			return {
+				cycle : false,
 				scaleMin:1,//h5端为解决1无法缩小问题,设为0.95
 				boxWidth: 400, //屏幕宽度px
 				space: ' ', //空格
@@ -98,7 +98,7 @@
 				fetch : {
 					user : {},
 					hall : 1,
-					play : false,
+					disabled : true,
 				},
 				show : false,
 				api : 'app/community/?l=api.addTips',
@@ -113,6 +113,9 @@
 				hall_state : false,
 				hall_data : [],
 				hall_index : 0,
+				//手动停止播放
+				setStop : false,
+				
 			};
 		},
 		computed: {
@@ -185,14 +188,21 @@
 				this.seat_table = tips;
 				this.seat_table_id = id;
 				this.show = true;
-				this.$emit('stop');
+				
+				if (this.play) {
+					this.setStop = true;
+					this.$emit('stop');
+				}
 			},
 			hideTips : function() {
 				this.show = false;
-				this.$emit('start');
+				if (this.setStop == true) {
+					this.$emit('start');
+					this.setStop = false;
+				}
 			},
 			setDisabled : function() {
-				this.$emit('setDisabled', this.fetch.play);
+				this.$emit('setDisabled', this.fetch.disabled);
 			},
 			tips : function(id, content) {
 				var id = '#tips_' + this.type_id + '_' + id;
@@ -215,6 +225,7 @@
 			
 			initData: function(hall) {
 				var self = this;
+				this.cycle && (clearInterval(this.cycle));
 				this.Dever.get(this, 'app/user/?l=api.seat', {code:this.Dever.config.code,noloading:1, content_id : this.type_id, hall : hall}, function(t) {
 					self.setDisabled();
 					let arr = t.seat
@@ -275,23 +286,23 @@
 				if (!this.play) {
 					return;
 				}
-				cycle && (clearInterval(cycle));
+				this.cycle && (clearInterval(this.cycle));
 				var i = 0;
 				var len = items.length;
 				this.tips(items[i]['type_id'], items[i]['content']);
 				i++;
-				cycle = setInterval(() => {
+				this.cycle = setInterval(() => {
 					var time = 5;
 					// #ifndef H5
 					time = Math.ceil(Math.floor(Math.random() * (this.maxTime - this.minTime + 1) + this.minTime));
 					// #endif
 					if (!this.play) {
-						clearInterval(cycle);
+						clearInterval(this.cycle);
 					} else if (i < len) {
 						this.tips(items[i]['type_id'], items[i]['content']);
 						i++;
 					} else {
-						clearInterval(cycle);
+						clearInterval(this.cycle);
 					}
 				}, 1000)
 			},

+ 37 - 12
lib/dever/components/video.nvue

@@ -4,7 +4,8 @@
 			<video
 				:src="src"
 				preload
-				autoplay
+				:autoplay="false"
+				:show-mute-btn="true"
 				:muted="muted"
 				:show-play-btn="true"
 				:show-center-play-btn="false"
@@ -20,11 +21,14 @@
 				x-webkit-airplay="allow"
 				x5-video-player-type="h5-page"
 				:page-gesture="false"
-				@timeupdate="timeUpdate"
+				@timeupdate="timeUpdate"
+				@play="onPlay"
+				@pause="onPause"
+				@ended="onPause"
 				>
 			</video>
 		</view>
-		<view class="control" @click="open">
+		<view class="control" @click="open" :style="control_style">
 			<cover-image v-if="poster && pic" class="poster" :src="pic">
 			</cover-image>
 			
@@ -115,7 +119,8 @@ export default {
 			poster : true,
 			video : false,
 			showInfo : false,
-			time : {},
+			time : {},
+			control_style : '',
 		};
 	},
 	mounted() {
@@ -131,19 +136,34 @@ export default {
 		//获取video_id
 		id : function()  {
 			return 'video_' + this.vid + '_' + this.index;
+		},
+		onPlay : function() {
+			if (this.control) {
+				this.control_style = 'height:0%;width:0%';
+				this.setStart();
+			}
+		},
+		onPause : function() {
+			if (this.control) {
+				this.control_style = 'height:100%;width:100%';
+				this.stop(true);
+			}
+		},
+		setStart : function() {
+			this.$emit('update:load', true);
+			this.$emit('play', 'start');
+			this.poster = false;
+			this.play = true;
+			this.playButton = true;
+			this.muted = false;
 		},
 		start : function()  {
-			if (!this.disabled) {
-				this.Dever.alert('无权限播放');
+			if (this.disabled) {
+				this.Dever.alert('无权限播放,请先购买座位');
 				return;
 			}
-			this.$emit('update:load', true);
-			this.$emit('play', 'start');
-			this.poster = false;
+			this.setStart();
 			this.video.play();
-			this.play = true;
-			this.playButton = true;
-			this.muted = false;
 		},
 		stop : function(state) {
 			var self = this;
@@ -189,6 +209,8 @@ export default {
 				if (!this.time[currentTime]) {
 					this.time[currentTime] = currentTime;
 					this.$emit('play', 'time', currentTime);
+					//记录播放进度
+					this.Dever.data('video_' + this.item.id, this.hall);
 				}
 			}
 		}
@@ -233,6 +255,9 @@ export default {
 	background-color: transparent;
 	z-index: 1;
 }
+.uni-video-bar {
+	z-index:10;
+}
 .poster{
 	background-size: cover;
 	position: absolute;

+ 105 - 122
lib/graceUI/components/graceDialog.vue

@@ -1,123 +1,106 @@
-<template>
-	<view class="grace-dialog-shade" @tap.stop="closeDialogByShade" @touchmove.stop.prevent="stopFun" 
-	:style="{backgroundColor:background, zIndex:zIndex, height:showIn ?'100%':'0px'}">
-		<view class="grace-dialog"  :class="[showIn ? 'grace-shade-in' : 'grace-shade-out']" @tap.stop="stopFun" 
-		:style="{width:width, borderRadius:borderRadius}">
-			<view class="grace-dialog-title" v-if="isTitle" 
-			:style="{
-				fontSize:titleSize, color:titleColor, fontWeight:titleWeight?'bold':'', 
-				background:titleBg, lineHeight:titleHeight}">{{title}}</view>
-			<view class="grace-dialog-content" @tap.stop="stopFun"><slot name="content"></slot></view>
-			<view class="grace-dialog-close-btn" 
-			:style="{color:closeBtnColor, zIndex:zIndex+1}" v-if="isCloseBtn" @tap.stop="closeDialog"></view>
-			<view v-if="isBtns"><slot name="btns"></slot></view>
-		</view>
-	</view>
-</template>
-<script>
-export default {
-	name: "graceDialog",
-	props: {
-		show : {
-			type : Boolean,
-			default : false
-		},
-		width : {
-			type : String,
-			default : '580rpx'
-		},
-		isCloseBtn: {
-			type : Boolean,
-			default : true
-		},
-		closeBtnColor : {
-			type : String,
-			default : '#FF0036'
-		},
-		isTitle : {
-			type : Boolean,
-			default : true
-		},
-		title : {
-			type : String,
-			default : ''
-		},
-		titleBg : {
-			type : String,
-			default : ''
-		},
-		titleHeight : {
-			type : String,
-			default : '100rpx'
-		},
-		titleWeight : {
-			type : Boolean,
-			default : true
-		},
-		titleSize : {
-			type : String,
-			default : '28rpx'
-		},
-		titleColor : {
-			type : String,
-			default : '#333333'
-		},
-		isBtns : {
-			type : Boolean,
-			default : true
-		},
-		background:{
-			type : String,
-			default : 'rgba(0, 0, 0, 0.5)'
-		},
-		borderRadius : {
-			type : String,
-			default : '6rpx'
-		},
-		zIndex : {
-			type : Number,
-			default : 99
-		},
-		canCloseByShade:{
-			type : Boolean,
-			default : true
-		}
-	},
-	data() {
-		return {
-			showIn : false
-		}
-	},
-	created:function(){
-		this.showIn = this.show;
-	},
-	watch:{
-		show:function (val) {
-			if(val){this.open();}else{this.hide();}
-		}
-	},
-	methods:{
-		closeDialogByShade:function(){
-			if(this.canCloseByShade){this.closeDialog();}
-		},
-		closeDialog : function(){
-			this.$emit('closeDialog');
-		},
-		stopFun : function(){},
-		open:function () {this.showIn = true;},
-		hide:function () {this.showIn = false;}
-	}
-}
-</script>
-<style scoped>
-.grace-dialog-shade{position:fixed; width:100%; height:100%; overflow:hidden; left:0; top:0; bottom:0; z-index:9991; display:flex; justify-content:center; align-items:center;}
-.grace-dialog{width:580rpx; background:#FFFFFF; position:relative; transition:all 200ms linear 0s;}
-.grace-dialog-title{line-height:100rpx; font-size:30rpx; text-align:center;}
-.grace-dialog-content{transition:all 200ms linear 0s;}
-.grace-dialog-close-btn{position:absolute; z-index:9993; right:0px; top:0px; font-size:30rpx; width:80rpx; height:80rpx; line-height:80rpx; text-align:center; font-family:"grace-iconfont";}
-.grace-dialog-close-btn:before{content:"\e632";}
-.grace-shade-in{animation:grace-shade-in-a 200ms linear forwards;}
-@keyframes grace-shade-in-a{0%{transform: scale(0.1); opacity:0;} 100%{transform: scale(1); opacity:1;}}
-.grace-shade-out{animation:grace-shade-out-a 200ms ease-out forwards;}
-@keyframes grace-shade-out-a{0%{transform: scale(1); opacity:1;} 100%{transform: scale(0.1); opacity:0;}}
+<template>
+	<view class="grace-dialog-shade" v-if="show" @tap.stop="closeDialogByShade" @touchmove.stop.prevent="stopFun" :style="{backgroundColor:background, zIndex:zIndex}">
+		<view class="grace-dialog gdFadeIn" @tap.stop="stopFun" :style="{width:width, borderRadius:borderRadius}">
+			<view class="grace-dialog-title" v-if="isTitle" 
+			:style="{fontSize:titleSize, color:titleColor, fontWeight:titleWeight?'bold':'', background:titleBg, lineHeight:titleHeight}">{{title}}</view>
+			<view class="grace-dialog-content" @tap.stop="stopFun"><slot name="content"></slot></view>
+			<view class="grace-dialog-close-btn" :style="{color:closeBtnColor, zIndex:zIndex+1}" v-if="isCloseBtn" @tap.stop="closeDialog"></view>
+			<view v-if="isBtns"><slot name="btns"></slot></view>
+		</view>
+	</view>
+</template>
+<script>
+export default {
+	name: "graceDialog",
+	props: {
+		show : {
+			type : Boolean,
+			default : false
+		},
+		width : {
+			type : String,
+			default : '580rpx'
+		},
+		isCloseBtn: {
+			type : Boolean,
+			default : true
+		},
+		closeBtnColor : {
+			type : String,
+			default : '#FF0036'
+		},
+		isTitle : {
+			type : Boolean,
+			default : true
+		},
+		title : {
+			type : String,
+			default : ''
+		},
+		titleBg : {
+			type : String,
+			default : ''
+		},
+		titleHeight : {
+			type : String,
+			default : '100rpx'
+		},
+		titleWeight : {
+			type : Boolean,
+			default : true
+		},
+		titleSize : {
+			type : String,
+			default : '28rpx'
+		},
+		titleColor : {
+			type : String,
+			default : '#333333'
+		},
+		isBtns : {
+			type : Boolean,
+			default : true
+		},
+		background:{
+			type : String,
+			default : 'rgba(0, 0, 0, 0.5)'
+		},
+		borderRadius : {
+			type : String,
+			default : '6rpx'
+		},
+		zIndex : {
+			type : Number,
+			default : 999
+		},
+		canCloseByShade:{
+			type : Boolean,
+			default : true
+		}
+	},
+	data() {
+		return {
+			
+		}
+	},
+	methods:{
+		closeDialogByShade:function(){
+			if(this.canCloseByShade){this.closeDialog();}
+		},
+		closeDialog : function(){
+			this.$emit('closeDialog');
+		},
+		stopFun : function(){}
+	}
+}
+</script>
+<style scoped>
+@keyframes gdFadeIn{ from { opacity: 0; } 100% { opacity: 1; }}
+.gdFadeIn {animation:gdFadeIn 200ms linear;}
+.grace-dialog-shade{position:fixed; width:100%; height:100%; left:0; top:0; bottom:0; z-index:9991; display:flex; justify-content:center; align-items:center;}
+.grace-dialog{width:580rpx; background:#FFFFFF; position:relative;}
+.grace-dialog-title{line-height:100rpx; font-size:30rpx; text-align:center;}
+.grace-dialog-content{}
+.grace-dialog-close-btn{position:absolute; z-index:9993; right:0px; top:0px; font-size:30rpx; width:80rpx; height:80rpx; line-height:80rpx; text-align:center; font-family:"grace-iconfont";}
+.grace-dialog-close-btn:before{content:"\e632";}
 </style>

+ 4 - 3
pages/dream/view/product.vue

@@ -121,7 +121,7 @@
 					</view>
 				</form>
 			</graceBottomDialog>
-			<graceDialog ref="graceDialog" :isTitle="true" :isCloseBtn="false" :title="`收货地址`" v-on:closeDialog="closeDialog">
+			<graceDialog ref="graceDialog" :isTitle="true" :isCloseBtn="false" :show="address_state" :title="`收货地址`" v-on:closeDialog="closeDialog">
 				<view class="content2" slot="content">
 					<form class="grace-form grace-margin-top">
 						<view class="grace-form-item grace-border-b">
@@ -226,6 +226,7 @@ export default {
 			old_freight_price : 0,
 			graceAddressPickerShow : false,
 			address_default : [],
+			address_state : false,
 		}
 	},
 	created() {
@@ -457,11 +458,11 @@ export default {
 			}
 		},
 		openDialog : function() {
-			this.$refs.graceDialog.open();
+			this.address_state = true;
 		}, 
 		
 		closeDialog : function() {
-			this.$refs.graceDialog.hide();
+			this.address_state = false;
 		},
 		
 		setAddress : function() {

+ 2 - 1
pages/dream/view/vodShort.vue

@@ -7,7 +7,8 @@
 				:pic="v.pic" 
 				:index="k" 
 				:vid="v.id"
-				:type="v.type"
+				:type="v.type"
+				:disabled="false"
 				:position_item="v.text"
 				:position_save="v.is_button"
 				:load.sync="load"