|
|
|
@ -4,7 +4,9 @@ |
|
|
|
<image class="animg" src="/static/images/start.png"></image> |
|
|
|
</view> |
|
|
|
<view style="position:relative;width:100%;" :style="{'height':videoHeight+'px'}"> |
|
|
|
<video id="video_play" @click="stopPlay" :src="videoObj.videoUrl" :controls="false" @ended="videoEnded()" @loadedmetadata="onMetadataLoaded" :autoplay="auto" :show-fullscreen-btn="false" :loop="isLoop" style="width: 100%;height: 100%;" object-fit="cover"></video> |
|
|
|
<video id="video_play" @click="stopPlay" :src="videoObj.videoUrl" :controls="false" @ended="videoEnded()" |
|
|
|
@loadedmetadata="onMetadataLoaded" :autoplay="auto" :show-fullscreen-btn="false" :loop="isLoop" |
|
|
|
style="width: 100%;height: 100%;" object-fit="cover"></video> |
|
|
|
<view class="question"></view> |
|
|
|
<view class="popup-layer-back" v-if="!start" v-show="question"> |
|
|
|
<!-- <view class="popup-layer-close" @click="question=false">关闭</view> --> |
|
|
|
@ -14,7 +16,8 @@ |
|
|
|
<image class="animg1" src="/static/videos/skin_bg_v1.png"></image> |
|
|
|
<view class="antxt1">{{ask}}</view> |
|
|
|
</view> |
|
|
|
<view class="anitem" @click="nextQuestion(item.outs[0], item)" v-for="(item, index) in answerList" :key="index"> |
|
|
|
<view class="anitem" @click="nextQuestion(item.outs[0], item)" v-for="(item, index) in answerList" |
|
|
|
:key="index"> |
|
|
|
<image class="animg" src="/static/videos/skin_bg_1a.png"></image> |
|
|
|
<view class="antxt">{{item.channel}}</view> |
|
|
|
<view class="judd jdok" v-show="isOk && item.choose === 'true'"> |
|
|
|
@ -32,14 +35,13 @@ |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
<view class="popup-layer-back" v-show="resCheck"> |
|
|
|
<view><image style="position: absolute; top: 20%; left: 10%;" :src="failUrl"></image></view> |
|
|
|
<view class="popup-layer" @click="toResVideo()"> |
|
|
|
<view class="anitem1"> |
|
|
|
<image class="animg1" src="/static/videos/skin_bg_v1.png"></image> |
|
|
|
<view class="antxt1">重新选择逃生路线</view> |
|
|
|
</view> |
|
|
|
<view class="failed-tip"> |
|
|
|
<image :src="failUrl"></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="popup-layer fullbox" @click="toResVideo()"> |
|
|
|
<view class="btnsty">重新选择逃生路线</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
@ -76,7 +78,7 @@ |
|
|
|
resCheck: false, |
|
|
|
showLayer: false, |
|
|
|
isResVideo: false, |
|
|
|
failUrl: uni.$http.baseUrl +"/profile//images/fail.gif", |
|
|
|
failUrl: uni.$http.baseUrl + "/profile//images/fail.gif", |
|
|
|
innerAudioContext: null, |
|
|
|
}; |
|
|
|
}, |
|
|
|
@ -106,7 +108,7 @@ |
|
|
|
this.videoHeight = res.screenHeight; |
|
|
|
} |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
this.innerAudioContext = uni.createInnerAudioContext(); |
|
|
|
this.innerAudioContext.autoplay = true; |
|
|
|
this.innerAudioContext.src = "/static/videos/supermario.mp3"; |
|
|
|
@ -183,7 +185,7 @@ |
|
|
|
this.innerAudioContext.stop(); |
|
|
|
}, |
|
|
|
onMetadataLoaded(event) { |
|
|
|
if(this.isResVideo) { |
|
|
|
if (this.isResVideo) { |
|
|
|
this.isResVideo = false; |
|
|
|
const duration = event.detail.duration; |
|
|
|
this.videoContext.seek(duration); |
|
|
|
@ -196,7 +198,7 @@ |
|
|
|
this.$api.addQuestionFre({ |
|
|
|
roleId: this.jsonId, |
|
|
|
sceneId: this.sceneId, |
|
|
|
userId : this.userId |
|
|
|
userId: this.userId |
|
|
|
}) |
|
|
|
.then(res => { |
|
|
|
this.questionFreId = res.data; |
|
|
|
@ -207,7 +209,7 @@ |
|
|
|
// 先提交所选答案 |
|
|
|
if (null != obj) { |
|
|
|
// 判断答题是否正确 |
|
|
|
if(this.correct.toUpperCase() == obj.channel.slice(0, 1).toUpperCase()) { |
|
|
|
if (this.correct.toUpperCase() == obj.channel.slice(0, 1).toUpperCase()) { |
|
|
|
// 控制选中答案单条显示对错 |
|
|
|
this.$set(obj, 'choose', 'true'); |
|
|
|
isCorrect = 1 |
|
|
|
@ -247,10 +249,10 @@ |
|
|
|
that.isError = false; |
|
|
|
that.isOk = false; |
|
|
|
that.hasNodeId(outId); |
|
|
|
if(!that.videoObj.videoUrl.includes("http")) { |
|
|
|
if (!that.videoObj.videoUrl.includes("http")) { |
|
|
|
that.videoObj.videoUrl = uni.$http.baseUrl + that.videoObj.videoUrl |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
// 用于记录上一个视频 |
|
|
|
if (null == obj) { |
|
|
|
that.resVideoUrl = that.videoObj.videoUrl; |
|
|
|
@ -328,14 +330,18 @@ |
|
|
|
height: 100%; |
|
|
|
background-color: rgba(0, 0, 0, .35); |
|
|
|
} |
|
|
|
|
|
|
|
.animg { |
|
|
|
position:absolute; |
|
|
|
top:0;left:0;right:0;bottom:0; |
|
|
|
margin:auto; |
|
|
|
position: absolute; |
|
|
|
top: 0; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
bottom: 0; |
|
|
|
margin: auto; |
|
|
|
width: 100px; |
|
|
|
height: 100px; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/* 首先设置背景层 */ |
|
|
|
.popup-layer-back { |
|
|
|
position: absolute; |
|
|
|
@ -343,7 +349,7 @@ |
|
|
|
left: 0; |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
background-color: rgba(0, 0, 0, 0.5); |
|
|
|
background-color: rgba(0, 0, 0, 0.8); |
|
|
|
z-index: 9998; |
|
|
|
} |
|
|
|
|
|
|
|
@ -353,18 +359,14 @@ |
|
|
|
top: 50%; |
|
|
|
left: 50%; |
|
|
|
transform: translate(-50%, -50%); |
|
|
|
/* background-color: #fff; */ |
|
|
|
color: #fff; |
|
|
|
padding: 20px; |
|
|
|
z-index: 9999; |
|
|
|
} |
|
|
|
|
|
|
|
.popup-layer .anitem1 { |
|
|
|
position: relative; |
|
|
|
/* margin: 80rpx; */ |
|
|
|
width: 650rpx; |
|
|
|
height: 200rpx; |
|
|
|
/* text-align: center; */ |
|
|
|
} |
|
|
|
|
|
|
|
.popup-layer .anitem1 .animg1 { |
|
|
|
@ -421,12 +423,48 @@ |
|
|
|
position: absolute; |
|
|
|
top: 50%; |
|
|
|
left: 50%; |
|
|
|
-webkit-transform: translate(-50%, -50%); |
|
|
|
transform: translate(-50%, -50%); |
|
|
|
width: 50%; |
|
|
|
height: 50%; |
|
|
|
} |
|
|
|
|
|
|
|
.failed-tip { |
|
|
|
position: absolute; |
|
|
|
top: 50%; |
|
|
|
left: 50%; |
|
|
|
transform: translate(-50%, -50%); |
|
|
|
width: 560rpx; |
|
|
|
height: 400rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.failed-tip image { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
.fullbox { |
|
|
|
width: 100%; |
|
|
|
height: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
.btnsty { |
|
|
|
position: absolute; |
|
|
|
left: 20%; |
|
|
|
bottom: 10%; |
|
|
|
width: 60%; |
|
|
|
height: 90rpx; |
|
|
|
line-height: 90rpx; |
|
|
|
text-align: center; |
|
|
|
color: #fff; |
|
|
|
font-size: 30rpx; |
|
|
|
border-radius: 50rpx; |
|
|
|
background: rgba(255, 255, 255, 0.2); |
|
|
|
border: 1px solid #1367fe; |
|
|
|
color: #fff; |
|
|
|
white-space: nowrap; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/* 设置关闭按钮 */ |
|
|
|
.popup-layer-close { |
|
|
|
position: absolute; |
|
|
|
|
