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

新增观看次数

This commit is contained in:
caoqianming 2021-07-05 16:55:54 +08:00
parent d1ea031c88
commit ddba9c0b9a
4 changed files with 149 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
client_mp/pages.json
View File

@ -96,7 +96,7 @@
"path" : "pages/inspectrecord/deptreport", "path" : "pages/inspectrecord/deptreport",
"style" : "style" :
{ {
"navigationBarTitleText": "", "navigationBarTitleText": "检查任务",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
@ -105,7 +105,7 @@
"path" : "pages/document/index", "path" : "pages/document/index",
"style" : "style" :
{ {
"navigationBarTitleText": "", "navigationBarTitleText": "手册资料",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
@ -114,7 +114,7 @@
"path" : "pages/vod/index", "path" : "pages/vod/index",
"style" : "style" :
{ {
"navigationBarTitleText": "", "navigationBarTitleText": "云点播",
"enablePullDownRefresh": true, "enablePullDownRefresh": true,
"onReachBottomDistance":100 "onReachBottomDistance":100
} }
@ -124,7 +124,7 @@
"path" : "pages/vod/video", "path" : "pages/vod/video",
"style" : "style" :
{ {
"navigationBarTitleText": "", "navigationBarTitleText": "云点播",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }

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

@ -1,8 +1,8 @@
<template> <template>
<view> <view>
<view style="height: 80upx;"> <!-- <view style="height: 80upx;">
<uni-search-bar @confirm="search"></uni-search-bar> <uni-search-bar @confirm="startSearch" v-model="search"></uni-search-bar>
</view> </view> -->
<scroll-view class="nav-scroll" :enable-flex="true" scroll-with-animation :throttle="false" <scroll-view class="nav-scroll" :enable-flex="true" scroll-with-animation :throttle="false"
:scroll-left="scrollToLeft" scroll-x @scroll="handleScroll"> :scroll-left="scrollToLeft" scroll-x @scroll="handleScroll">
<view class="nav uni-nav"> <view class="nav uni-nav">
@ -21,9 +21,18 @@
@refresherrefresh="handleRefre" :refresher-enabled="true" class="swiper-scroll" scroll-y="true" @refresherrefresh="handleRefre" :refresher-enabled="true" class="swiper-scroll" scroll-y="true"
@scrolltolower="swiperScrollLower"> @scrolltolower="swiperScrollLower">
<view> <view>
<view class="swiper-item-list" v-for="sub_item in item.content" :key="sub_item"> <view class="swiper-item-list" v-for="(video,index) in item.content" :key="video.id">
{{ sub_item }}</view> <video class="video" :src="video.mediaurl" controls object-fit="cover"
:id="'video'+video.id" :poster="video.coverurl" @play="doPlay($event, index)"
@pause="doPlay($event, index)" @ended="doPlay($event, index)">
<view class='video-slot' v-if="video.showTitle" :title="video.name">
<span style="margin-left:6px">{{video.name}}</span>
</view> </view>
</video>
<view style="color:darkblue;margin-left:12upx">{{video.name}}</view>
</view>
</view>
<view style="color:gray;text-align: center;margin-top:20upx;">{{loadingText}}</view>
</scroll-view> </scroll-view>
</swiper-item> </swiper-item>
</swiper> </swiper>
@ -35,6 +44,7 @@
export default { export default {
data() { data() {
return { return {
playingVideoStr: null,
swiperIndex: 0, //当前的swiperindex swiperIndex: 0, //当前的swiperindex
navItemWidth: '', //选中下划线的宽度 navItemWidth: '', //选中下划线的宽度
navItemLeft: 0, //选中下划线的显示位置 navItemLeft: 0, //选中下划线的显示位置
@ -45,9 +55,12 @@
list: [{ list: [{
id: 0, id: 0,
title: '全部', title: '全部',
page: 1,
content: [] content: []
}], }],
refreStatus: false refreStatus: false,
loadingText: "加载中",
search:""
}; };
}, },
computed: { computed: {
@ -66,6 +79,7 @@
let list = [{ let list = [{
id: 0, id: 0,
title: '全部', title: '全部',
page: 1,
content: [] content: []
}] }]
for (var i = 0; i < res.data.length; i++) { for (var i = 0; i < res.data.length; i++) {
@ -74,17 +88,34 @@
id: data.id, id: data.id,
title: data.name, title: data.name,
page: 1, page: 1,
loadingText:'加载中...',
content: [] content: []
}) })
} }
this.list = list this.list = list
this.$nextTick(function() { this.$nextTick(function() {
this.init() this.init()
this.getVideos()
}); });
}) })
}, },
methods: { methods: {
doPlay(e, index) {
if (e.type == 'play') {
var playingVideoStr = e.target.id
this.list[this.swiperIndex].content[index].showTitle = false
//暂停其他视频播放
if(this.playingVideoStr==null){
this.playingVideoStr = playingVideoStr
}
else if (playingVideoStr != this.playingVideoStr) {
var videoContextPrev = uni.createVideoContext(this.playingVideoStr)
videoContextPrev.pause()
this.playingVideoStr = playingVideoStr
}
} else {
this.list[this.swiperIndex].content[index].showTitle = true
}
},
// 获取dom信息 // 获取dom信息
init() { init() {
const query = uni.createSelectorQuery().in(this); const query = uni.createSelectorQuery().in(this);
@ -100,7 +131,6 @@
rect: true, rect: true,
size: true size: true
}, data => { }, data => {
console.log(data)
data.forEach((item, index) => { data.forEach((item, index) => {
if (index == 0) { if (index == 0) {
this.navItemWidth = item.width; this.navItemWidth = item.width;
@ -117,6 +147,9 @@
// 点击导航切换swiper // 点击导航切换swiper
taggleNav(val) { taggleNav(val) {
this.swiperIndex = val; this.swiperIndex = val;
if (this.list[val].content.length == 0) {
this.getVideos()
}
}, },
// 滚动tabs以及移动下划线 // 滚动tabs以及移动下划线
scrollDom() { scrollDom() {
@ -134,6 +167,9 @@
this.swiperIndex = e.detail.current; this.swiperIndex = e.detail.current;
this.scrollDom(); this.scrollDom();
this.$emit('currentIndex', this.swiperIndex); this.$emit('currentIndex', this.swiperIndex);
if (this.list[e.detail.current].content.length == 0) {
this.getVideos()
}
}, },
// tabs-scrollview触底 // tabs-scrollview触底
handleScroll(e) { handleScroll(e) {
@ -141,13 +177,51 @@
}, },
// swiper-ScrollLower触底 // swiper-ScrollLower触底
swiperScrollLower() { swiperScrollLower() {
uni.showToast({ // uni.showToast({
icon: 'none', // icon: 'none',
title: `此时为${this.list[this.swiperIndex].title}触底` // title: `此时为${this.list[this.swiperIndex].title}触底`
}); // });
setTimeout(() => { // setTimeout(() => {
this.getData(); // this.getData();
}, 500); // }, 500);
this.list[this.swiperIndex].page = this.list[this.swiperIndex].page + 1
this.getVideos()
},
getVideos() {
let swiperIndex = this.swiperIndex
let currentData = this.list[swiperIndex]
var params = {
page: currentData.page
}
if (currentData.id == 0) {} else {
params.category = currentData.id
}
this.$u.api.getVideos(params).then(res => {
this.refreStatus = false
let results = res.data.results
for (var i = 0; i < results.length; i++) {
results[i].showTitle = true
}
if (currentData.page == 1) {
if (results == 0) {
this.loadingText = '暂无视频'
} else {
this.loadingText = ''
this.list[swiperIndex].content = results
}
} else {
this.loadingText = ''
this.list[swiperIndex].content.concat(results)
}
}).catch(res => {
this.refreStatus = false
if (res.code == 404) {
this.loadingText = '到底了'
}
})
}, },
// 生成列表数据 // 生成列表数据
getData() { getData() {
@ -167,19 +241,24 @@
// 下拉事件 // 下拉事件
handleRefre() { handleRefre() {
this.refreStatus = true; this.refreStatus = true;
uni.showLoading({ // uni.showLoading({
title: '下拉加载中' // title: '下拉加载中'
}); // });
setTimeout(() => { this.list[this.swiperIndex].page = 1
this.list[this.swiperIndex].content = []; this.getVideos()
for (var i = 0; i < 5; i++) { // setTimeout(() => {
this.list[this.swiperIndex].content.push([this.list[this.swiperIndex].title + '下拉-' + i]); // this.list[this.swiperIndex].content = [];
} // for (var i = 0; i < 5; i++) {
uni.hideLoading(); // this.list[this.swiperIndex].content.push([this.list[this.swiperIndex].title + '下拉-' + i]);
}, 1000); // }
setTimeout(() => { // uni.hideLoading();
this.refreStatus = false; // }, 1000);
}, 1000); // setTimeout(() => {
// this.refreStatus = false;
// }, 1000);
},
startSearch(e){
console.log(e)
} }
} }
}; };
@ -230,28 +309,44 @@
} }
swiper { swiper {
height: calc(100vh - 160upx); height: calc(100vh - 80upx);
} }
swiper-item { // swiper-item {
text-align: center; // text-align: center;
color: #000; // color: #000;
position: relative; // position: relative;
background-color: skyblue; // background-color: skyblue;
color: #fff; // color: #fff;
} // }
.swiper-item { .swiper-item {
overflow-y: scroll; overflow-y: scroll;
} }
.swiper-item-list { .swiper-item-list {
height: 400upx; margin-top:4upx;
// height: 400upx;
border-bottom: 2upx solid pink; border-bottom: 2upx solid pink;
line-height: 400upx; // line-height: 400upx;
} }
.swiper-scroll { .swiper-scroll {
height: 100%; height: 100%;
} }
.video {
width: 100%;
height: 380rpx;
}
.video-slot {
width: 100%;
height: 40px;
line-height: 40px;
font-size: 16px;
color: white;
background-color: black;
opacity: 0.3;
}
</style> </style>

10
server/apps/vod/views.py
View File

@ -57,6 +57,16 @@ class VideoViewSet(PageOrNot, CreateUpdateModelAMixin, ModelViewSet):
serializer = self.get_serializer(queryset, many=True) serializer = self.get_serializer(queryset, many=True)
return Response(serializer.data) return Response(serializer.data)
@action(methods=['post'], detail=True, permission_classes=[IsAuthenticated])
def view(self, request, *args, **kwargs):
"""
新增观看次数
"""
obj = self.get_object()
obj.views = obj.views + 1
obj.save()
return Response()
class VRecordViewSet(ListModelMixin, GenericViewSet): class VRecordViewSet(ListModelMixin, GenericViewSet):
perms_map = {'get':'viewrecord_view'} perms_map = {'get':'viewrecord_view'}