zcdsj
/
cma_search
mirror of https://e.coding.net/ctcdevteam/cma_search.git
5
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

record

This commit is contained in:
shijing 2021-10-22 13:02:51 +08:00
parent 1ccd2145c5
commit b457ed73bd
5 changed files with 205 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
client_mp/common/http.api.js
View File

@ -47,7 +47,7 @@ const install = (Vue, vm) => {
let putMyVideoView =(id,params)=>vm.$u.put(`/vod/video/${id}/myview/`,params);//更新本人观看信息
let getMyVideoRecord =(id)=>vm.$u.get(`/vod/video/myview/`);//获取本人观看记录
let getMyVideoRecord =(params)=>vm.$u.get(`/vod/video/myview/`,params);//获取本人观看记录
let getVideoRecord =(id)=>vm.$u.get(`/vod/video/${id}/myview/`);//获取本人观看记录
vm.$u.api = {getUserInfo,
getCode,

41
client_mp/pages/my/videoWatchRecords.vue
View File

@ -1,23 +1,15 @@
<template>
<scroll-view :lower-threshold="80" :refresher-triggered="refreStatus"
@refresherrefresh="handleRefre" :refresher-enabled="true" class="swiper-scroll" scroll-y="true"
@scrolltolower="swiperScrollLower">
@scrolltolower="swiperScrollLower" >
<uni-list>
<uni-list-item :title="item.video_.name" :note="'上次观看时间:'+item.update_time" thumb-size="lg"
rightText="继续观看" v-for="item in dataList" :key="item.id" @click="plauVideo(item)" link></uni-list-item>
<view style="color:gray;text-align: center;margin-top:20upx;">{{loadingText}}</view>
</uni-list>
<!-- <view v-for="item in dataList" style="display: flex ; padding: 24rpx 30rpx;font-size: 28rpx;color: #3b4144;border-bottom: 1px solid #dcdcdc;">
<view class="leftAction" style="flex: 3;">
<view>{{item.video_.name}}</view>
<view style="margin-top: 6rpx; color: #999; font-size: 24rpx;">上次观看进度:</view>
<view style="margin-top: 6rpx; color: #999; font-size: 24rpx;">上次观看时间:{{item.update_time}}</view>
</view>
<view class="rightAction" style="flex: 1; display: flex; flex-direction: column;justify-content: space-around;">
<a class="mui-navigate-right" style=" color: #999; font-size: 24rpx;">继续观看</a><image src="../../static/common/right_err.png"></image>
</view>
</view> -->
<view style="color:gray;text-align: center;margin-top:20upx;">{{loadingText}}</view>
</scroll-view>
</template>
<script>
@ -25,7 +17,9 @@
data() {
return {
page:1,
page_size:10,
dataList: [],
loadingText:'',
refreStatus: false,
}
},
@ -33,10 +27,6 @@
this.page = 1;
this.getLists();
//this.$u.api.getMyVideoRecord({}).then(res => {
// this.dataList = res.data.results;
// console.log(res.data.results)
//})
},
methods: {
plauVideo(item){
@ -51,18 +41,20 @@
this.getLists()
},
swiperScrollLower() {
this.page = this.page + 1;
this.getLists()
},
getLists(){
// debugger;
console.log(this.page)
var params = {
page: this.page
page: this.page,
page_size:10
}
this.$u.api.getMyVideoRecord(params).then(res => {
this.refreStatus = false
let results = res.data.results
let results = res.data.results;
// debugger;
if (this.page == 1) {
if (results == 0) {
this.loadingText = '暂无观看记录'
@ -71,8 +63,11 @@
this.dataList = results
}
} else {
// debugger;
this.loadingText = ''
this.dataList.concat(results)
let a = this.dataList.concat(results);
console.log(a)
this.dataList=a;
}
}).catch(res => {
@ -89,4 +84,8 @@
</script>
<style>
.swiper-scroll {
height: calc(100vh - 40upx);
}
</style>

10
client_mp/pages/vod/video.vue
View File

@ -124,11 +124,11 @@
},
methods: {
videoOpen(video){
// debugger;
// console.log(video)
debugger;
console.log(video)
uni.navigateTo({
url: '/pages/vod/watchPage?id='+video.id
url: '/pages/vod/watchPage?id='+video.id+'&url='+video.mediaurl
});
},
closeVideo(){
@ -245,7 +245,9 @@
}
} else {
this.loadingText = ''
this.list[swiperIndex].content.concat(results)
let a = this.list[swiperIndex].content;
let b= a.concat(results);
this.list[swiperIndex].content=b;
}
}).catch(res => {

187
client_mp/pages/vod/watchPage.vue
View File

@ -1,7 +1,37 @@
<template>
<view>
<video class="video" :src="item.mediaurl" controls object-fit="cover"
<!-- <view v-show="already" class="markBlock" ref="mydom"> -->
<view v-show="already" :style="{height:ReadyHeight+'px'}" class="markBlock">
<view style="">
<view class="">
<view class="spinner">
<view class="spinner-container container1">
<view class="circle1"></view>
<view class="circle2"></view>
<view class="circle3"></view>
<view class="circle4"></view>
</view>
<view class="spinner-container container2">
<view class="circle1"></view>
<view class="circle2"></view>
<view class="circle3"></view>
<view class="circle4"></view>
</view>
<view class="spinner-container container3">
<view class="circle1"></view>
<view class="circle2"></view>
<view class="circle3"></view>
<view class="circle4"></view>
</view>
</view>
</view>
资源缓冲中，请稍后...
</view>
</view>
<video class="video" :src="url" controls object-fit="cover"
id="videoPlayer" :poster="item.coverurl" @play="doPlay($event)"
@loadedmetadata="alreadyLoad"
:initial-time="current" style="width: 100%;" @timeupdate="timeupdate($event)"
@pause="doPlay($event)" @ended="doPlay($event)">
</video>
@ -12,32 +42,45 @@
export default {
data() {
return {
url:'',
item: {},
ReadyHeight:0,
videoId:0,
current:0,
currentTime:0,
already:true,
alreadyPlay:false,
}
},
onLoad(options) {
// debugger;
this.videoId = options.id;
let that=this;
that.videoId = options.id;
that.url = options.url;
if(options.current){
this.current = options.current;
that.current = options.current;
}else{
this.$u.api.getVideoRecord(options.id).then(res => {
this.current = res.data.current;
that.$u.api.getVideoRecord(options.id).then(res => {
that.current = res.data.current;
})
}
this.$u.api.getThisVideo(options.id).then(res => {
this.item = res.data;
// console.log(res.data)
})
that.changeHeight();
},
methods:{
changeHeight(){
let that=this;
let obj = uni.createSelectorQuery().select('.video')
obj.boundingClientRect(function (data) { // data - 各种参数
console.log(data)
that.ReadyHeight=data.height;
}).exec()
},
alreadyLoad(){
this.already = false;
},
doPlay(e) {
if(this.alreadyPlay){}else{
debugger;
// debugger;
this.alreadyPlay =true;
this.$u.api.putMyVideoView(this.videoId).then(res=>{})
}
@ -49,13 +92,133 @@ export default {
},
},
beforeDestroy(){
debugger;
// debugger;
let params = {'current':this.currentTime};
this.$u.api.putMyVideoView(this.item.id,params).then(res => {
this.$u.api.putMyVideoView(this.videoId,params).then(res => {
})
},
}
</script>
<style>
.markBlock{
color:#ffffff;
text-align:center;
width: 100%;
position: fixed;
top: 0;
left: 0;
background: rgba(0,0,0,0.8);
z-index: 100;
}
.spinner {
margin: 200upx auto 80upx;
width: 100upx;
height: 100upx;
position: relative;
}
.container1 > view, .container2 > view, .container3 > view {
width: 20upx;
height: 20upx;
background-color: #fff;
border-radius: 100%;
position: absolute;
-webkit-animation: bouncedelay 1.2s infinite ease-in-out;
animation: bouncedelay 1.2s infinite ease-in-out;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.spinner .spinner-container {
position: absolute;
width: 100%;
height: 100%;
}
.container2 {
-webkit-transform: rotateZ(45deg);
transform: rotateZ(45deg);
}
.container3 {
-webkit-transform: rotateZ(90deg);
transform: rotateZ(90deg);
}
.circle1 { top: 0; left: 0; }
.circle2 { top: 0; right: 0; }
.circle3 { right: 0; bottom: 0; }
.circle4 { left: 0; bottom: 0; }
.container2 .circle1 {
-webkit-animation-delay: -1.1s;
animation-delay: -1.1s;
}
.container3 .circle1 {
-webkit-animation-delay: -1.0s;
animation-delay: -1.0s;
}
.container1 .circle2 {
-webkit-animation-delay: -0.9s;
animation-delay: -0.9s;
}
.container2 .circle2 {
-webkit-animation-delay: -0.8s;
animation-delay: -0.8s;
}
.container3 .circle2 {
-webkit-animation-delay: -0.7s;
animation-delay: -0.7s;
}
.container1 .circle3 {
-webkit-animation-delay: -0.6s;
animation-delay: -0.6s;
}
.container2 .circle3 {
-webkit-animation-delay: -0.5s;
animation-delay: -0.5s;
}
.container3 .circle3 {
-webkit-animation-delay: -0.4s;
animation-delay: -0.4s;
}
.container1 .circle4 {
-webkit-animation-delay: -0.3s;
animation-delay: -0.3s;
}
.container2 .circle4 {
-webkit-animation-delay: -0.2s;
animation-delay: -0.2s;
}
.container3 .circle4 {
-webkit-animation-delay: -0.1s;
animation-delay: -0.1s;
}
@-webkit-keyframes bouncedelay {
0%, 80%, 100% { -webkit-transform: scale(0.0) }
40% { -webkit-transform: scale(1.0) }
}
@keyframes bouncedelay {
0%, 80%, 100% {
transform: scale(0.0);
-webkit-transform: scale(0.0);
} 40% {
transform: scale(1.0);
-webkit-transform: scale(1.0);
}
}
</style>

4
client_mp/video.vue
View File

@ -243,7 +243,9 @@
}
} else {
this.loadingText = ''
this.list[swiperIndex].content.concat(results)
let a = this.list[swiperIndex].content;
let b= a.concat(results);
this.list[swiperIndex].content=b;
}
}).catch(res => {