huxiaofeng666/jwl-applet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

提交

Browse Source
This commit is contained in:
脆皮鸭
2023-08-29 00:24:24 +08:00
parent f762ca430d
commit dc340c7f4d
6 changed files with 99 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/pages/questionBank/baseOperate.vue
View File

@@ -71,6 +71,7 @@
arr = arr.map(item => {
return {
...item,
subDesc:this.allVideoList[0].description,
projectId:item.videoId,
videoTime:this.formateTime(item.videoTime)
}

100
src/pages/questionBank/videoDetail.vue
View File

@@ -1,12 +1,11 @@
<template>
<view>
<sunny-video style="width: 100%" videoHeight="422rpx" ref="sunny-video"
:src="videoList[currentIndex].videoUrl" />
<sunny-video style="width: 100%" videoHeight="422rpx" ref="sunny-video" :src="videoList[currentIndex].videoUrl" />
<view class="p14tb bc-fff">
<view class="skill-sequence-panel-content-wrapper pr14" v-if="videoType=='test'">
<scroll-view class="skill-sequence-panel-content" scroll-x>
<view class="skill-sequence-skill-wrapper tab_iem" :class="videoIndex===item.value?'checked_tab':''" v-for="(item,index) of testList"
:key="index" @tap="checkTest(item.value)">{{item.label}}</view>
<view class="skill-sequence-skill-wrapper tab_iem" :class="videoIndex===item.value?'checked_tab':''"
v-for="(item,index) of testList" :key="index" @tap="checkTest(item.value)">{{item.label}}</view>
</scroll-view>
</view>
<view class="flex ai-c jc-sb mt10 wp100 p14">
@@ -22,19 +21,22 @@
</view>
<view class="bc-fff pl14 pb10">
<view class="skill-sequence-panel-content-wrapper">
<scroll-view class="skill-sequence-panel-content" scroll-x :scroll-left="164*currentIndex">
<scroll-view class="skill-sequence-panel-content" scroll-x :scroll-left="getScrollLeft">
<view class="skill-sequence-skill-wrapper" v-for="(item, index) in videoList" :key="index"
@tap="checkVideo(item.projectId)">
<view>
<view class="mb10 relative">
<view class="contain-box" style="overflow: hidden;">
<image class="contain-box" mode="widthFix" :src="item.videoUrl+'?x-oss-process=video/snapshot,t_0,f_jpg'"></image>
<image class="contain-box" mode="widthFix"
:src="item.videoUrl+'?x-oss-process=video/snapshot,t_0,f_jpg'"></image>
</view>
<view v-if="projectId==item.projectId" class="playLogo">播放中</view>
<image class="play_btn" src="../../static/image/index/play.png" />
<text style="position: absolute;right: 8rpx;bottom: 8rpx;color:#fff">{{item.videoTime}}</text>
</view>
<text :style="{color:projectId==item.projectId?'#FF6E02':'#333'}">{{item.description}}</text>
<view class="topic_cont_text" :style="{color:projectId==item.projectId?'#FF6E02':'#333'}">
{{item.description}}
</view>
</view>
</view>
</scroll-view>
@@ -55,7 +57,7 @@
</view>
<view class="ml10">
<text class="fs16 cor-000 fw600">{{item.description}}</text>
<view class="fs14 mt5 cor-666">上车、下车的方法</view>
<view class="fs14 mt5 cor-666">{{item.subDesc}}</view>
</view>
</view>
</view>
@@ -71,8 +73,8 @@
export default {
data() {
return {
title:'',
currentIndex:0,
title: '',
currentIndex: 0,
videoIndex: 0,
testList: [{
label: "八一考场",
@@ -123,35 +125,41 @@
time: '13:14',
id: 5
}],
projectId:undefined,
param:{}
projectId: undefined,
param: {}
}
},
onLoad(op) {
if (op.type) {
this.videoType = op.type
}
if(op.projectId){
this.projectId=op.projectId
if (op.projectId) {
this.projectId = op.projectId
}
if(op.subject){
this.param.subject=op.subject
if (op.subject) {
this.param.subject = op.subject
}
if(op.type){
this.param.type=op.type
if (op.type) {
this.param.type = op.type
}
if(op.type=='1'){
if(this.param.subject=='2'){
this.title='科二基础项目讲解'
}else{
this.title='科三基础项目讲解'
if (op.type == '1') {
if (this.param.subject == '2') {
this.title = '科二基础项目讲解'
} else {
this.title = '科三基础项目讲解'
}
}else{
this.title='基础操作讲解'
} else {
this.title = '基础操作讲解'
}
if(op.videoList){
this.videoList=JSON.parse(op.videoList)
this.currentIndex=this.videoList.findIndex(item=>item.projectId==this.projectId)
if (op.videoList) {
this.videoList = JSON.parse(op.videoList)
this.currentIndex = this.videoList.findIndex(item => item.projectId == this.projectId)
}
},
computed: {
getScrollLeft() {
const index = this.currentIndex - 1 < 0 ? 0 : this.currentIndex - 1
return 164 * index
}
},
methods: {
@@ -159,9 +167,9 @@
this.videoIndex = val
},
checkVideo(val) {
this.popupShow=false
this.popupShow = false
this.projectId = val
this.currentIndex=this.videoList.findIndex(item=>item.projectId==this.projectId)
this.currentIndex = this.videoList.findIndex(item => item.projectId == this.projectId)
}
}
}
@@ -175,6 +183,21 @@
border-radius: 8rpx;
}
.topic_cont_text {
width: 260rpx;
height:45rpx;
overflow: hidden;
word-break: break-all;
/* break-all(允许在单词内换行。) */
text-overflow: ellipsis;
/* 超出部分省略号 */
/* display: -webkit-box; */
white-space: nowrap;
-webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
-webkit-line-clamp:1; /** 显示的行数 **/
}
.playLogo {
width: 90rpx;
height: 40rpx;
@@ -226,18 +249,21 @@
background: linear-gradient(90deg, #11DF20 0%, #01B74F 100%);
color: #fff
}
/*scroll-view外层*/
.skill-sequence-panel-content-wrapper{
position: relative;
white-space:nowrap;
.skill-sequence-panel-content-wrapper {
position: relative;
white-space: nowrap;
}
/*scroll-view本身*/
.skill-sequence-panel-content{
min-width:100%;
.skill-sequence-panel-content {
min-width: 100%;
}
/*scroll-view内层*/
.skill-sequence-skill-wrapper{
display: inline-block;
.skill-sequence-skill-wrapper {
display: inline-block;
margin-right: 15px;
}
</style>