Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
U
uniapp_vedio
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
android
uniapp_vedio
Commits
019aa62e
Commit
019aa62e
authored
Dec 12, 2024
by
jyx
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
修复推荐剧跳转慢,优化样式
parent
c61de996
Changes
4
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
434 additions
and
448 deletions
+434
-448
App.vue
vedio/App.vue
+6
-15
index.vue
vedio/components/home/index.vue
+418
-422
my.vue
vedio/components/home/my.vue
+4
-3
home.vue
vedio/pages/home.vue
+6
-8
No files found.
vedio/App.vue
View file @
019aa62e
...
...
@@ -52,21 +52,11 @@
// checkUpdate(this);
// #ifdef H5
if
(
window
.
location
.
host
===
'www.baosheji.cn'
)
{
var
icp
=
document
.
createElement
(
'div'
);
icp
.
innerText
=
'京ICP备18032652号'
;
icp
.
style
.
color
=
'white'
;
icp
.
style
.
textAlign
=
'center'
;
icp
.
style
.
position
=
'fixed'
;
icp
.
style
.
bottom
=
'0'
;
icp
.
style
.
left
=
'0'
;
icp
.
style
.
right
=
'0'
;
icp
.
style
.
zIndex
=
'100'
;
document
.
body
.
appendChild
(
icp
);
}
// #endif
uni
.
getSystemInfo
({
success
:
(
res
=>
{
this
.
globalData
.
clientHeight
=
res
.
windowHeight
-
65
})
});
},
onShow
:
function
(
options
)
{
this
.
globalData
.
resetLogin
=
true
...
...
@@ -89,6 +79,7 @@
// baseUrl: 'http://test.mints-id.com/camera-api/miniApi',
// baseUrl: 'http://192.168.110.71:8301/miniApi',
titleButtonWidth
:
38
,
clientHeight
:
0
,
token
:
''
,
userId
:
0
,
inviteUId
:
''
,
...
...
vedio/components/home/index.vue
View file @
019aa62e
<
template
>
<view
class=
"body"
>
<view
v-if=
"showMask"
class=
"show-mask flex-v"
@
click=
"showMask=false"
>
<view
class=
"mt-30"
style=
"width: 90%;text-align: right;"
>
<image
style=
"width: 30rpx;height: 30rpx;padding:6rpx;
border-radius: 40rpx;border: 2px solid darkgray;"
src=
"@/static/index/ic_quit_white.png"
/>
</view>
<text
class=
"mt-10"
style=
"font-size: 46rpx;"
>
如何继续看剧?
</text>
<text
class=
"m-10"
>
找到“薄荷短剧” 小程序
</text>
<image
class=
"mt-30"
mode=
"widthFix"
:src=
"maskImage1"
></image>
<image
:src=
"maskImage2"
mode=
"widthFix"
></image>
</view>
<scroll-view
v-if=
"clientHeight != 0"
scroll-y=
"true"
:style=
"
{'height': clientHeight + 'px'}"
@scroll="onScroll">
<view
class=
"content"
>
<swiper
class=
"banner"
:indicator-dots=
"true"
:autoplay=
"true"
:interval=
"2000"
:duration=
"500"
>
<swiper-item
v-for=
"banner in bannerList"
:key=
"banner.vedioId"
@
click=
"handleBanner(banner)"
>
<image
class=
"banner-img"
:src=
"banner.tabImage"
mode=
"aspectFill"
></image>
</swiper-item>
</swiper>
<view
style=
"display: flex;flex-direction: column;background-color:white;border-radius:10rpx;margin-top: 20rpx;"
>
<view
style=
"font-size: 30rpx;font-weight: 777;margin-left: 12rpx;margin-top: 18rpx;"
>
排行榜
</view>
<scroll-view
scroll-x=
"true"
style=
"white-space: nowrap; margin-top: 18rpx;"
>
<block
v-for=
"(item, index) in topList"
:key=
"item.vedioId"
>
<view
@
click=
"handleTop(item)"
style=
"display:inline-block;background-color:white;border-radius:10rpx;width: 200rpx;margin: 5rpx 10rpx 15rpx 10rpx;"
>
<view
style=
"position: relative;"
>
<view
style=
"position: relative;"
>
<view
style=
"position: absolute;z-index: 10;margin-left: 20rpx;"
>
<view
style=
"position: relative;"
>
<view
style=
"position: absolute;z-index: 10;width: 50rpx;text-align: center;margin-top: 8rpx;font-size: 24rpx;color: white;"
>
{{
index
+
1
}}
</view>
<image
v-if=
"index==0"
style=
"width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/y43.png"
></image>
<image
v-else-if=
"index==1"
style=
"width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/y42.png"
></image>
<image
v-else-if=
"index==2"
style=
"width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/y41.png"
></image>
<image
v-else
style=
"width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/y4.png"
></image>
</view>
</view>
<image
style=
"border-radius:10rpx; width: 200rpx;height: 260rpx;"
:src=
"item.coverImage"
mode=
"aspectFill"
></image>
</view>
<view
style=
"position: absolute;bottom: 10rpx;background-color: black;width: 100%;opacity: 0.5;"
>
<view
style=
"display: flex;align-items: center;margin-left: 10rpx;"
>
<image
style=
"width: 20rpx;height: 20rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/ic_index_play.png"
></image>
<view
style=
"font-size: 22rpx;color: white;"
>
{{
item
.
showNum
}}
</view>
</view>
</view>
</view>
<view
style=
"font-size: 26rpx;margin-top: 10rpx;height: 60rpx;"
>
{{
item
.
title
}}
</view>
<view
class=
"ellipsis"
style=
"font-size: 22rpx;margin-top: 10rpx;"
v-if=
"item.orderTags!=null&&item.orderTags.length>0"
>
<scroll-view
scroll-x=
"true"
>
<block
v-for=
"t in item.orderTags"
:key=
"item.orderTags"
>
<view
style=
"display:inline-block;margin-right: 4rpx;"
>
{{
t
}}
</view>
</block>
</scroll-view>
</view>
</view>
</block>
</scroll-view>
</view>
<view
style=
"font-size: 30rpx;font-weight: 777;margin-top: 20rpx;margin-bottom: 10rpx;margin-left: 4rpx;"
>
推荐
</view>
<view
style=
"column-count: 2;column-gap: 20rpx;margin-top: 20rpx;"
>
<view
class=
"item-wrap"
v-for=
"(item, i) in dataList"
:key=
"i"
v-if=
"i % 2 == 0"
@
click=
"handleInfo(item)"
>
<view
style=
"position: relative;"
>
<image
class=
"img"
:src=
"item.coverImage"
mode=
"aspectFill"
></image>
<view
style=
"position: absolute;bottom: 10rpx;width: 95%;padding: 10rpx;background-color: black;opacity: 0.5;"
>
<view
style=
"display: flex;flex-direction: row;justify-content:space-between;"
>
<view
style=
"display: flex;align-items: center;"
>
<image
style=
"width: 20rpx;height: 20rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/ic_index_play.png"
></image>
<view
style=
"font-size: 22rpx;color: white;"
>
{{
item
.
showNum
}}
</view>
</view>
<view
style=
"font-size: 22rpx;color: white;font-weight: 777;"
>
全
{{
item
.
vedioTotal
}}
集
</view>
</view>
</view>
</view>
<view
style=
"font-size: 30rpx;margin-top: 10rpx;margin-left: 12rpx;"
>
{{
item
.
title
}}
</view>
<!--
<view
style=
"font-size: 22rpx;margin-top: 10rpx;margin-left: 12rpx;"
>
{{
item
.
vedioDesc
}}
</view>
-->
</view>
<view
class=
"item-wrap"
v-for=
"(item, i) in dataList"
:key=
"i"
v-if=
"i % 2 == 1"
@
click=
"handleInfo(item)"
>
<view
style=
"position: relative;"
>
<image
class=
"img"
:src=
"item.coverImage"
mode=
"aspectFill"
></image>
<view
style=
"position: absolute;bottom: 10rpx;width: 95%;padding: 10rpx;background-color: black;opacity: 0.5;"
>
<view
style=
"display: flex;flex-direction: row;justify-content:space-between;"
>
<view
style=
"display: flex;align-items: center;"
>
<image
style=
"width: 20rpx;height: 20rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/ic_index_play.png"
></image>
<view
style=
"font-size: 22rpx;color: white;"
>
{{
item
.
showNum
}}
</view>
</view>
<view
style=
"font-size: 22rpx;color: white;font-weight: 777;"
>
全
{{
item
.
vedioTotal
}}
集
</view>
</view>
</view>
</view>
<view
style=
"font-size: 30rpx;margin-top: 10rpx;margin-left: 12rpx;height: 60rpx;"
>
{{
item
.
title
}}
</view>
</view>
</view>
<u-loadmore
:status=
"loadStatus"
@
loadmore=
"loadMore"
></u-loadmore>
</view>
</scroll-view>
<view
v-if=
"newRecordBean!=null"
style=
"width: 97%;height: 150rpx;margin: 10rpx;opacity: 0.8;background-color: black;z-index: 20;position: absolute;bottom: 0;border-radius:10rpx;"
>
<view
style=
"display: flex;margin-left: 10rpx;"
>
<view
style=
"flex-grow: 2;display: flex;align-items: center;"
>
<image
style=
"border-radius:10rpx; width: 100rpx;height: 130rpx;margin-top: 10rpx;"
:src=
"newRecordBean.coverImage"
mode=
"aspectFill"
></image>
<view
style=
"margin: 20rpx;"
>
<view
style=
"font-size: 30rpx; color: white;"
>
{{
newRecordBean
.
title
}}
</view>
<view
style=
"font-size: 24rpx;margin-top: 6rpx;color: white;"
>
上次观看至第
{{
newRecordBean
.
seeIndex
}}
集
</view>
<view
style=
"font-size: 22rpx;"
v-if=
"newRecordBean.orderTags!=null&&newRecordBean.orderTags.length>0"
>
<scroll-view
scroll-x=
"true"
>
<block
v-for=
"t in newRecordBean.orderTags"
:key=
"newRecordBean.orderTags"
>
<view
style=
"display:inline-block;margin-right: 4rpx;"
>
{{
t
}}
</view>
</block>
</scroll-view>
</view>
</view>
</view>
<view
style=
"display: flex;flex-direction: column;align-items: flex-end;"
>
<image
@
click=
"handleBottomClose()"
style=
"width: 30rpx;height: 30rpx;display: flex;margin: 10rpx;"
src=
"../../static/index/ic_quit_white.png"
mode=
"aspectFill"
></image>
<view
@
click=
"handleBottomPlay(newRecordBean)"
style=
"width: 160rpx;height: 50rpx;margin-top: 8rpx;line-height: 50rpx;color: white;text-align: center;background-color: red;border-radius:30rpx;margin-right: 20rpx;"
>
继续观看
</view>
</view>
</view>
</view>
</view>
</
template
>
<
script
>
import
common
from
'@/mixins/common'
;
import
{
getToLocal
}
from
"@/utils/utils.js"
import
{
gotoVideoPlayerPage
}
from
'@/common/page-route.js'
import
{
navigateTo
,
message
,
alert
,
loading
}
from
'@/utils/fun.js'
;
import
{
openUrl
}
from
'@/utils/app+.js'
;
const
app
=
getApp
();
export
default
{
name
:
'index'
,
mixins
:
[
common
],
data
()
{
return
{
dataList
:
[],
bannerList
:
[],
newRecordBean
:
null
,
topList
:
[],
showMask
:
false
,
maskImage1
:
'https://mints-web.oss-cn-beijing.aliyuncs.com/images/bg_find1.png'
,
maskImage2
:
'https://mints-web.oss-cn-beijing.aliyuncs.com/images/bg_find2.png'
,
clientHeight
:
0
,
page
:
1
,
size
:
10
,
loadStatus
:
'loadmore'
};
},
mounted
()
{
let
that
=
this
uni
.
getSystemInfo
({
success
:
(
res
=>
{
this
.
clientHeight
=
res
.
windowHeight
-
50
;
})
});
// 匹配视频
this
.
showFirstDialog
();
},
methods
:
{
onScroll
(
event
)
{
// 获取scrollview已滚动的高度
const
scrollTop
=
event
.
detail
.
scrollTop
;
// 获取内容的总高度
const
contentHeight
=
event
.
detail
.
scrollHeight
;
// 判断是否滑动到底部(已滚动的高度 + 视图高度 >= 内容高度)
if
((
scrollTop
+
this
.
clientHeight
+
50
)
>=
contentHeight
)
{
this
.
loadMore
()
}
},
showMaskFuc
()
{
let
showFollowMask
=
uni
.
getStorageSync
(
'show-follow-mask'
)
||
''
;
if
(
showFollowMask
==
'1'
)
{
this
.
showMask
=
true
uni
.
setStorage
({
key
:
'show-follow-mask'
,
data
:
'2'
});
}
},
show
()
{
this
.
showMaskFuc
()
// 轮播图
this
.
post
({
url
:
'/vedio/topTabs'
,
showLoading
:
false
,
success
:
({
data
})
=>
{
this
.
bannerList
=
data
.
list
;
}
});
// 排行榜
this
.
post
({
url
:
'/vedio/orders'
,
showLoading
:
false
,
success
:
({
data
})
=>
{
this
.
topList
=
data
.
list
;
}
});
// 最近观看剧
this
.
post
({
url
:
'/vedio/newest'
,
data
:
{},
showLoading
:
false
,
success
:
({
data
})
=>
{
if
(
data
.
vedio
!=
null
)
{
this
.
newRecordBean
=
data
.
vedio
;
}
}
});
this
.
page
=
1
this
.
size
=
10
this
.
loadList
()
},
hide
()
{},
loadList
()
{
// 推荐列表
this
.
post
({
url
:
'/vedio/list'
,
data
:
{
page
:
this
.
page
,
size
:
this
.
size
},
showLoading
:
false
,
success
:
({
data
})
=>
{
this
.
loadStatus
=
data
.
list
.
size
<
this
.
size
?
'nomore'
:
'loadmore'
;
if
(
data
.
list
.
size
<=
10
)
{
this
.
dataList
=
[...
this
.
dataList
,
...
data
.
list
];
return
}
if
(
this
.
page
==
1
)
{
this
.
dataList
=
data
.
list
}
else
{
this
.
dataList
=
[...
this
.
dataList
,
...
data
.
list
];
}
}
});
},
loadMore
()
{
if
(
this
.
loadStatus
===
'loading'
||
this
.
loadStatus
===
'nomore'
)
return
;
this
.
loadStatus
=
'loading'
this
.
page
=
++
this
.
page
this
.
loadList
()
},
handleBanner
(
item
)
{
gotoVideoPlayerPage
(
item
)
},
handleInfo
(
item
)
{
gotoVideoPlayerPage
(
item
)
},
handleTop
(
item
)
{
gotoVideoPlayerPage
(
item
)
},
handleBottomPlay
(
item
)
{
gotoVideoPlayerPage
(
item
)
},
handleBottomClose
()
{
this
.
newRecordBean
=
null
;
this
.
post
({
url
:
'/vedio/colseNewest'
,
data
:
{},
showLoading
:
false
,
success
:
({
data
})
=>
{}
});
},
showFirstDialog
()
{
let
that
=
this
;
let
loadEpisode_id
=
uni
.
getStorageSync
(
'tt_episode_id'
)
||
''
;
let
loadAlbum_id
=
uni
.
getStorageSync
(
'tt_album_id'
)
||
''
;
setTimeout
(()
=>
{
that
.
post
({
url
:
'/vedio/firstVedio/douyin'
,
data
:
{
episode_id
:
loadEpisode_id
,
album_id
:
loadAlbum_id
},
showLoading
:
false
,
success
:
({
data
})
=>
{
if
(
data
.
vedioMsg
!=
null
)
{
gotoVideoPlayerPage
(
data
.
vedioMsg
)
// 重置短视频挂载id
uni
.
setStorage
({
key
:
'tt_album_id'
,
data
:
''
});
uni
.
setStorage
({
key
:
'tt_episode_id'
,
data
:
''
});
}
}
});
},
800
);
}
}
};
</
script
>
<
style
lang=
"scss"
>
.body
{
background-color
:
whitesmoke
;
position
:
relative
;
}
.show-mask
{
width
:
100%
;
height
:
100%
;
background
:
rgba
(
0
,
0
,
0
,
0
.6
);
position
:
absolute
;
z-index
:
999
;
color
:
white
;
align-items
:
center
;
image
{
width
:
90%
;
}
}
.item-wrap
{
width
:
100%
;
border-radius
:
10rpx
;
background-color
:
#fff
;
break-inside
:
avoid
;
margin-bottom
:
20rpx
;
height
:
500rpx
;
}
.img
{
position
:
relative
;
border-radius
:
10rpx
;
width
:
100%
;
height
:
390rpx
;
}
<
template
>
<view
class=
"body"
>
<view
v-if=
"showMask"
class=
"show-mask flex-v"
@
click=
"showMask=false"
>
<view
class=
"mt-30"
style=
"width: 90%;text-align: right;"
>
<image
style=
"width: 30rpx;height: 30rpx;padding:6rpx;
border-radius: 40rpx;border: 2px solid darkgray;"
src=
"@/static/index/ic_quit_white.png"
/>
</view>
<text
class=
"mt-10"
style=
"font-size: 46rpx;"
>
如何继续看剧?
</text>
<text
class=
"m-10"
>
找到“薄荷短剧” 小程序
</text>
<image
class=
"mt-30"
mode=
"widthFix"
:src=
"maskImage1"
></image>
<image
:src=
"maskImage2"
mode=
"widthFix"
></image>
</view>
<scroll-view
style=
"height: 100%;"
scroll-y
@
scroll=
"onScroll"
>
<view
class=
"content"
>
<swiper
class=
"banner"
:indicator-dots=
"true"
:autoplay=
"true"
:interval=
"2000"
:duration=
"500"
>
<swiper-item
v-for=
"banner in bannerList"
:key=
"banner.vedioId"
@
click=
"handleBanner(banner)"
>
<image
class=
"banner-img"
:src=
"banner.tabImage"
mode=
"aspectFill"
></image>
</swiper-item>
</swiper>
<view
style=
"display: flex;flex-direction: column;background-color:white;border-radius:10rpx;margin-top: 20rpx;"
>
<view
style=
"font-size: 30rpx;font-weight: 777;margin-left: 12rpx;margin-top: 18rpx;"
>
排行榜
</view>
<scroll-view
scroll-x=
"true"
style=
"white-space: nowrap; margin-top: 18rpx;"
>
<block
v-for=
"(item, index) in topList"
:key=
"item.vedioId"
>
<view
@
click=
"handleTop(item)"
style=
"display:inline-block;background-color:white;border-radius:10rpx;width: 200rpx;margin: 5rpx 10rpx 15rpx 10rpx;"
>
<view
style=
"position: relative;"
>
<view
style=
"position: relative;"
>
<view
style=
"position: absolute;z-index: 10;margin-left: 20rpx;"
>
<view
style=
"position: relative;"
>
<view
style=
"position: absolute;z-index: 10;width: 50rpx;text-align: center;margin-top: 8rpx;font-size: 24rpx;color: white;"
>
{{
index
+
1
}}
</view>
<image
v-if=
"index==0"
style=
"width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/y43.png"
></image>
<image
v-else-if=
"index==1"
style=
"width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/y42.png"
></image>
<image
v-else-if=
"index==2"
style=
"width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/y41.png"
></image>
<image
v-else
style=
"width: 50rpx;height: 50rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/y4.png"
></image>
</view>
</view>
<image
style=
"border-radius:10rpx; width: 200rpx;height: 260rpx;"
:src=
"item.coverImage"
mode=
"aspectFill"
></image>
</view>
<view
style=
"position: absolute;bottom: 10rpx;background-color: black;width: 100%;opacity: 0.5;"
>
<view
style=
"display: flex;align-items: center;margin-left: 10rpx;"
>
<image
style=
"width: 20rpx;height: 20rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/ic_index_play.png"
></image>
<view
style=
"font-size: 22rpx;color: white;"
>
{{
item
.
showNum
}}
</view>
</view>
</view>
</view>
<view
style=
"font-size: 26rpx;margin-top: 10rpx;height: 60rpx;"
>
{{
item
.
title
}}
</view>
<view
class=
"ellipsis"
style=
"font-size: 22rpx;margin-top: 10rpx;"
v-if=
"item.orderTags!=null&&item.orderTags.length>0"
>
<scroll-view
scroll-x=
"true"
>
<block
v-for=
"t in item.orderTags"
:key=
"item.orderTags"
>
<view
style=
"display:inline-block;margin-right: 4rpx;"
>
{{
t
}}
</view>
</block>
</scroll-view>
</view>
</view>
</block>
</scroll-view>
</view>
<view
style=
"font-size: 30rpx;font-weight: 777;margin-top: 20rpx;margin-bottom: 10rpx;margin-left: 4rpx;"
>
推荐
</view>
<view
style=
"column-count: 2;column-gap: 20rpx;margin-top: 20rpx;"
>
<view
class=
"item-wrap"
v-for=
"(item, i) in dataList"
:key=
"i"
v-if=
"i % 2 == 0"
@
click=
"handleInfo(item)"
>
<view
style=
"position: relative;"
>
<image
class=
"img"
:src=
"item.coverImage"
mode=
"aspectFill"
></image>
<view
style=
"position: absolute;bottom: 10rpx;width: 95%;padding: 10rpx;background-color: black;opacity: 0.5;"
>
<view
style=
"display: flex;flex-direction: row;justify-content:space-between;"
>
<view
style=
"display: flex;align-items: center;"
>
<image
style=
"width: 20rpx;height: 20rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/ic_index_play.png"
></image>
<view
style=
"font-size: 22rpx;color: white;"
>
{{
item
.
showNum
}}
</view>
</view>
<view
style=
"font-size: 22rpx;color: white;font-weight: 777;"
>
全
{{
item
.
vedioTotal
}}
集
</view>
</view>
</view>
</view>
<view
style=
"font-size: 30rpx;margin-top: 10rpx;margin-left: 12rpx;"
>
{{
item
.
title
}}
</view>
<!--
<view
style=
"font-size: 22rpx;margin-top: 10rpx;margin-left: 12rpx;"
>
{{
item
.
vedioDesc
}}
</view>
-->
</view>
<view
class=
"item-wrap"
v-for=
"(item, i) in dataList"
:key=
"i"
v-if=
"i % 2 == 1"
@
click=
"handleInfo(item)"
>
<view
style=
"position: relative;"
>
<image
class=
"img"
:src=
"item.coverImage"
mode=
"aspectFill"
></image>
<view
style=
"position: absolute;bottom: 10rpx;width: 95%;padding: 10rpx;background-color: black;opacity: 0.5;"
>
<view
style=
"display: flex;flex-direction: row;justify-content:space-between;"
>
<view
style=
"display: flex;align-items: center;"
>
<image
style=
"width: 20rpx;height: 20rpx;display: flex;align-items: right;margin-right: 10rpx;"
src=
"../../static/index/ic_index_play.png"
></image>
<view
style=
"font-size: 22rpx;color: white;"
>
{{
item
.
showNum
}}
</view>
</view>
<view
style=
"font-size: 22rpx;color: white;font-weight: 777;"
>
全
{{
item
.
vedioTotal
}}
集
</view>
</view>
</view>
</view>
<view
style=
"font-size: 30rpx;margin-top: 10rpx;margin-left: 12rpx;height: 60rpx;"
>
{{
item
.
title
}}
</view>
</view>
</view>
<u-loadmore
:status=
"loadStatus"
@
loadmore=
"loadMore"
></u-loadmore>
</view>
</scroll-view>
<view
v-if=
"newRecordBean!=null"
style=
"width: 97%;height: 150rpx;margin: 10rpx;opacity: 0.8;background-color: black;z-index: 20;position: absolute;bottom: 0;border-radius:10rpx;"
>
<view
style=
"display: flex;margin-left: 10rpx;"
>
<view
style=
"flex-grow: 2;display: flex;align-items: center;"
>
<image
style=
"border-radius:10rpx; width: 100rpx;height: 130rpx;margin-top: 10rpx;"
:src=
"newRecordBean.coverImage"
mode=
"aspectFill"
></image>
<view
style=
"margin: 20rpx;"
>
<view
style=
"font-size: 30rpx; color: white;"
>
{{
newRecordBean
.
title
}}
</view>
<view
style=
"font-size: 24rpx;margin-top: 6rpx;color: white;"
>
上次观看至第
{{
newRecordBean
.
seeIndex
}}
集
</view>
<view
style=
"font-size: 22rpx;"
v-if=
"newRecordBean.orderTags!=null&&newRecordBean.orderTags.length>0"
>
<scroll-view
scroll-x=
"true"
>
<block
v-for=
"t in newRecordBean.orderTags"
:key=
"newRecordBean.orderTags"
>
<view
style=
"display:inline-block;margin-right: 4rpx;"
>
{{
t
}}
</view>
</block>
</scroll-view>
</view>
</view>
</view>
<view
style=
"display: flex;flex-direction: column;align-items: flex-end;"
>
<image
@
click=
"handleBottomClose()"
style=
"width: 30rpx;height: 30rpx;display: flex;margin: 10rpx;"
src=
"../../static/index/ic_quit_white.png"
mode=
"aspectFill"
></image>
<view
@
click=
"handleBottomPlay(newRecordBean)"
style=
"width: 160rpx;height: 50rpx;margin-top: 8rpx;line-height: 50rpx;color: white;text-align: center;background-color: red;border-radius:30rpx;margin-right: 20rpx;"
>
继续观看
</view>
</view>
</view>
</view>
</view>
</
template
>
<
script
>
import
common
from
'@/mixins/common'
;
import
{
getToLocal
}
from
"@/utils/utils.js"
import
{
gotoVideoPlayerPage
}
from
'@/common/page-route.js'
import
{
navigateTo
,
message
,
alert
,
loading
}
from
'@/utils/fun.js'
;
import
{
openUrl
}
from
'@/utils/app+.js'
;
const
app
=
getApp
();
export
default
{
name
:
'index'
,
mixins
:
[
common
],
data
()
{
return
{
dataList
:
[],
bannerList
:
[],
newRecordBean
:
null
,
topList
:
[],
showMask
:
false
,
maskImage1
:
'https://mints-web.oss-cn-beijing.aliyuncs.com/images/bg_find1.png'
,
maskImage2
:
'https://mints-web.oss-cn-beijing.aliyuncs.com/images/bg_find2.png'
,
clientHeight
:
0
,
page
:
1
,
size
:
100
,
loadStatus
:
'loadmore'
};
},
mounted
()
{
let
that
=
this
uni
.
getSystemInfo
({
success
:
(
res
=>
{
this
.
clientHeight
=
res
.
windowHeight
-
50
;
})
});
// 匹配视频
this
.
showFirstDialog
();
},
methods
:
{
onScroll
(
event
)
{
// 获取scrollview已滚动的高度
const
scrollTop
=
event
.
detail
.
scrollTop
;
// 获取内容的总高度
const
contentHeight
=
event
.
detail
.
scrollHeight
;
// 判断是否滑动到底部(已滚动的高度 + 视图高度 >= 内容高度)
if
((
scrollTop
+
this
.
clientHeight
+
50
)
>=
contentHeight
)
{
this
.
loadMore
()
}
},
showMaskFuc
()
{
let
showFollowMask
=
uni
.
getStorageSync
(
'show-follow-mask'
)
||
''
;
if
(
showFollowMask
==
'1'
)
{
this
.
showMask
=
true
uni
.
setStorage
({
key
:
'show-follow-mask'
,
data
:
'2'
});
}
},
show
()
{
this
.
showMaskFuc
()
// 轮播图
this
.
post
({
url
:
'/vedio/topTabs'
,
showLoading
:
false
,
success
:
({
data
})
=>
{
this
.
bannerList
=
data
.
list
;
}
});
// 排行榜
this
.
post
({
url
:
'/vedio/orders'
,
showLoading
:
false
,
success
:
({
data
})
=>
{
this
.
topList
=
data
.
list
;
}
});
// 最近观看剧
this
.
post
({
url
:
'/vedio/newest'
,
data
:
{},
showLoading
:
false
,
success
:
({
data
})
=>
{
if
(
data
.
vedio
!=
null
)
{
this
.
newRecordBean
=
data
.
vedio
;
}
}
});
this
.
page
=
1
// this.size = 10
this
.
loadList
()
},
hide
()
{},
loadList
()
{
// 推荐列表
this
.
post
({
url
:
'/vedio/list'
,
data
:
{
page
:
this
.
page
,
size
:
this
.
size
},
showLoading
:
false
,
success
:
({
data
})
=>
{
this
.
loadStatus
=
data
.
list
.
size
<
this
.
size
?
'nomore'
:
'loadmore'
;
if
(
data
.
list
.
size
<=
10
)
{
this
.
dataList
=
[...
this
.
dataList
,
...
data
.
list
];
return
}
if
(
this
.
page
==
1
)
{
this
.
dataList
=
data
.
list
}
else
{
this
.
dataList
=
[...
this
.
dataList
,
...
data
.
list
];
}
}
});
},
loadMore
()
{
if
(
this
.
loadStatus
===
'loading'
||
this
.
loadStatus
===
'nomore'
)
return
;
this
.
loadStatus
=
'loading'
this
.
page
=
++
this
.
page
this
.
loadList
()
},
handleBanner
(
item
)
{
gotoVideoPlayerPage
(
item
)
},
handleInfo
(
item
)
{
gotoVideoPlayerPage
(
item
)
},
handleTop
(
item
)
{
gotoVideoPlayerPage
(
item
)
},
handleBottomPlay
(
item
)
{
gotoVideoPlayerPage
(
item
)
},
handleBottomClose
()
{
this
.
newRecordBean
=
null
;
this
.
post
({
url
:
'/vedio/colseNewest'
,
data
:
{},
showLoading
:
false
,
success
:
({
data
})
=>
{}
});
},
showFirstDialog
()
{
let
that
=
this
;
let
loadEpisode_id
=
uni
.
getStorageSync
(
'tt_episode_id'
)
||
''
;
let
loadAlbum_id
=
uni
.
getStorageSync
(
'tt_album_id'
)
||
''
;
that
.
post
({
url
:
'/vedio/firstVedio/douyin'
,
data
:
{
episode_id
:
loadEpisode_id
,
album_id
:
loadAlbum_id
},
showLoading
:
false
,
success
:
({
data
})
=>
{
if
(
data
.
vedioMsg
!=
null
)
{
gotoVideoPlayerPage
(
data
.
vedioMsg
)
// 重置短视频挂载id
uni
.
setStorage
({
key
:
'tt_album_id'
,
data
:
''
});
uni
.
setStorage
({
key
:
'tt_episode_id'
,
data
:
''
});
}
}
});
}
}
};
</
script
>
<
style
lang=
"scss"
>
.body
{
background-color
:
whitesmoke
;
position
:
relative
;
}
.show-mask
{
width
:
100%
;
height
:
100%
;
background
:
rgba
(
0
,
0
,
0
,
0
.6
);
position
:
absolute
;
z-index
:
999
;
color
:
white
;
align-items
:
center
;
image
{
width
:
90%
;
}
}
.item-wrap
{
width
:
100%
;
border-radius
:
10rpx
;
background-color
:
#fff
;
break-inside
:
avoid
;
margin-bottom
:
20rpx
;
height
:
500rpx
;
}
.img
{
position
:
relative
;
border-radius
:
10rpx
;
width
:
100%
;
height
:
390rpx
;
}
</
style
>
\ No newline at end of file
vedio/components/home/my.vue
View file @
019aa62e
<
template
>
<view
class=
"body"
>
<z-paging
style=
"height: 100%;background-color: #f5f5f5;"
>
<view
:style=
"'display: flex;flex-direction: row;align-items: center;margin: 20rpx;padding-left: 10rpx;margin-top:'+10+'px;'"
>
<scroll-view
style=
"height: 100%;"
scroll-y
>
<view
:style=
"'display: flex;flex-direction: row;align-items: center;margin: 20rpx;padding-left: 10rpx;margin-top:'+10+'px;'"
>
<image
class=
"avatar"
src=
"@/static/logo-about.png"
></image>
<view>
<view
style=
"font-size: 32rpx;color: black;margin-left: 20rpx;"
>
用户ID:
{{
userBean
.
idcode
}}
</view>
...
...
@@ -60,7 +61,7 @@
<view
style=
"display: flex;justify-content: center;margin-top: 20rpx;font-size: 26rpx;color: gray;"
>
{{
versionName
}}
</view>
</
z-paging
>
</
scroll-view
>
<coin-popup
:show=
"showAnimate"
@
close=
"showAnimate = false"
@
paySuccess=
"paySuccess"
>
</coin-popup>
<kefu-popup
:show=
"showKefuPop"
@
close=
"showKefuPop = false"
/>
...
...
vedio/pages/home.vue
View file @
019aa62e
<
template
>
<view
class=
"body"
>
<view
style=
"height: 92%;
"
>
<view
:style=
"
{'height': clientHeight + 'px'}
">
<indexPage
v-show=
"currentPage==0"
ref=
"index"
/>
<recommendPage
v-on:showEditBarH=
"showEditBarH"
v-on:changeBottomBarColor=
"changeBottomBarColor"
v-show=
"currentPage==1"
ref=
"recommend"
/>
<userPage
v-show=
"currentPage==2"
ref=
"user"
/>
</view>
<view
v-if=
"!isShowBlackBar"
class=
"tabs-bar"
>
<view
v-if=
"!isShowBlackBar"
class=
"tabs-bar"
style=
"height: 65px;"
>
<view
:class=
"currentPage==0?'tab active': 'tab'"
:style=
"'padding-bottom:' + bottomSafePadding + 'px;'"
@
click=
"tabChange(0)"
>
<view
style=
"margin: 16rpx 0 11rpx;"
>
...
...
@@ -37,7 +37,7 @@
</view>
</view>
<view
v-if=
"isShowBlackBar"
class=
"tabs-bar2"
>
<view
v-if=
"isShowBlackBar"
class=
"tabs-bar2"
style=
"height: 65px;"
>
<view
:class=
"currentPage==0?'tab active': 'tab'"
:style=
"'padding-bottom:' + bottomSafePadding + 'px;'"
@
click=
"tabChange(0)"
>
<view
style=
"margin: 16rpx 0 11rpx;"
>
...
...
@@ -110,7 +110,8 @@
currentPage
:
0
,
showEditBar
:
false
,
isFullChoice
:
false
,
isShowBlackBar
:
false
isShowBlackBar
:
false
,
clientHeight
:
app
.
globalData
.
clientHeight
,
}
},
onLoad
(
options
)
{
...
...
@@ -129,12 +130,9 @@
if
(
wx
.
setVisualEffectOnCapture
)
{
wx
.
setVisualEffectOnCapture
({
visualEffect
:
'hidden'
,
success
:
(
res
)
=>
{
},
success
:
(
res
)
=>
{}
})
}
},
onShow
()
{
try
{
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment