zhangjing/sgy-web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

镜子功能发现功能

Browse Source
This commit is contained in:
张冬雪
2023-11-24 16:53:50 +08:00
parent 9051ddace1
commit 8f754aea83
35 changed files with 1796 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
api/interfaces/user.js
View File

@@ -44,6 +44,13 @@ const poster = (data) => req({
url: "agent/poster",
data: data
})
// 获取视频教程
const videos = () => req({
url: "videos"
})
export default ({
userIndex,
userSetup,
@@ -51,5 +58,5 @@ export default ({
invitesCode,
miniShare,
helpsNav,
poster
poster,videos
})

2
app.js
View File

@@ -53,6 +53,7 @@ App({
wx.getSystemInfo({
success: res=>{
this.globalData.barHeight = res.statusBarHeight
this.globalData.safeArea = res.screenHeight - res.safeArea.bottom
}
})
@@ -75,6 +76,7 @@ App({
isUser : false,
userInfo : null,
barHeight : '',
safeArea : '',
inviteText : '', // 邀请好友临时存储
isExperience: '', // 体验官身份
experienceAreaId: '', // 体验官区域

16
app.json
View File

@@ -49,7 +49,12 @@
"pages/order/refundInfo/refundInfo",
"pages/order/refundWrite/refundWrite",
"pages/beautify/coach",
"pages/found/index"
"pages/beautify2/coach",
"pages/found/index",
"pages/found2/index",
"pages/found2/swiper",
"pages/found2/swiper2",
"pages/found2/index2"
],
"window": {
"backgroundTextStyle": "light",
@@ -72,7 +77,7 @@
"selectedIconPath": "/static/tabBarIcon/tabBar_selected_01.png"
},
{
"pagePath": "pages/found/index",
"pagePath": "pages/found2/index2",
"text": "发现",
"iconPath": "/static/tabBarIcon/tabBar_04.png",
"selectedIconPath": "/static/tabBarIcon/tabBar_selected_04.png"
@@ -95,5 +100,10 @@
"borderStyle": "white"
},
"style": "v2",
"sitemapLocation": "sitemap.json"
"sitemapLocation": "sitemap.json",
"permission": {
"scope.camera": {
"desc": "你的摄像头将用于小程序拍照、录像、扫码等效果展示"
}
}
}

124
pages/beautify/coach.js
View File

@@ -2,7 +2,7 @@
Page({
data: {
videos: [{
id: 1,
video_id: 1,
cover: 'https://cdn.shuiganying.com/images/2023/11/14/236a3949c2c0794de850617d4204a159.png',
url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e524b445288836010370038b176a34a1_258.mp4',
steps: [{
@@ -99,62 +99,73 @@ Page({
}
],
selectVideoItem: {
id: 0, // 默认id是否为0
video_id: 0, // 默认id是否为0
playedState: false, // 当前是否是正在播放播放状态
muted: false, // 静音状态
stepsCount: 0, // 默认分几个步骤
currentSteps: 0, // 当前默认是第几步
currentTime: 0, // 当前总时长
remainingTime: '00', // 播放时间
remainingTimeShow: '00:00' // 播放时间展示
},
videoContext: null,
seeAllVideo: true,
openCamera:false, // 是否打开摄像头
openCamera: false, // 是否打开摄像头
userData: {},
// 是否显示摄像头
isCamera: false
},
onShow(){
onShow() {
wx.getSetting({
success:(res)=> {
success: (res) => {
let authSetting = res.authSetting
this.setData({
isCamera: authSetting['scope.camera'] == true?true:false,
openCamera:authSetting['scope.camera'] == true?true:false
isCamera: authSetting['scope.camera'] == true ? true : false,
openCamera: authSetting['scope.camera'] == true ? true : false
})
}
})
this.userInfo()
this.getVideos()
},
onReady(res) {
this.videoContext = wx.createVideoContext('myVideo')
},
bindseekcomplete(e) {
console.log(e)
},
videoPause(e){
console.log('暂停了')
},
// 视频更新事件
videoTimeupdated(e) {
let selectVideoItem = this.data.selectVideoItem
let currentTimeEnd = selectVideoItem.steps[selectVideoItem.currentSteps].endTime
let {
currentTime,duration
currentTime,
duration
} = e.detail
if (currentTime > currentTimeEnd && selectVideoItem.currentSteps < selectVideoItem.stepsCount) {
selectVideoItem.currentSteps++
this.videoContext.pause()
// this.videoContext.pause()
// 倒计时且有提醒
setTimeout(() => {
this.videoContext.play()
}, 3000);
// setTimeout(() => {
// this.videoContext.play()
// }, 3000);
}
let remainingTime = parseInt(duration - currentTime) >= 10 ? parseInt(duration - currentTime) : '0' + parseInt(duration - currentTime)
let remainingTimeShow = parseInt(duration - currentTime) >= 60 ? '01:' + (parseInt(remainingTime - 60) >= 10 ? parseInt(remainingTime - 60) : '0' + parseInt(remainingTime - 60)) : '00:' + remainingTime
selectVideoItem.remainingTime = remainingTime
selectVideoItem.remainingTimeShow = remainingTimeShow
this.setData({
selectVideoItem: selectVideoItem
})
console.log('视频更新事件', selectVideoItem.currentSteps)
},
// 视频播放结束事件
videoEnded() {
console.log('视频播放结束事件')
@@ -162,17 +173,19 @@ Page({
this.setData({
selectVideoItem: {
id: 0
video_id: 0
},
seeAllVideo: true,
})
},
// 点击全部视频
allVideoTab() {
this.setData({
seeAllVideo: !this.data.seeAllVideo
})
},
// 点击暂停视频
videoPauseTab() {
console.log('暂停')
@@ -183,6 +196,7 @@ Page({
})
this.videoContext.pause()
},
// 点击播放视频
videoPlayTab() {
console.log('播放')
@@ -194,16 +208,17 @@ Page({
})
this.videoContext.play()
},
// 轮播图切换
swiperChange(e) {
console.log(e.detail)
},
// 选择视频教程-点击
selectVideo(e) {
let item = e.currentTarget.dataset.item
console.log(this.data.selectVideoItem.id, item.id)
if (this.data.selectVideoItem.id == item.id) return
console.log(this.data.selectVideoItem.video_id, item.video_id)
if (this.data.selectVideoItem.video_id == item.video_id) return
item.playedState = false
item.stepsCount = item.steps.length
@@ -217,6 +232,7 @@ Page({
this.doPlay(0)
}, 300);
},
// 播放视频
doPlay(position) {
console.log(position)
@@ -229,6 +245,7 @@ Page({
// 播放视频
this.videoContext.play()
},
// 静音非经营处理
mutedTab(e) {
console.log(e)
@@ -245,10 +262,12 @@ Page({
selectVideoItem: selectVideoItem
})
},
// 上一段，下一段切换
preTab(e) {
let type = e.target.dataset.type
let selectVideoItem = this.data.selectVideoItem
let stepsLength = this.data.selectVideoItem.steps.length
if (type == 'prev') {
if (selectVideoItem.currentSteps == 0) {
wx.showToast({
@@ -267,12 +286,12 @@ Page({
this.videoContext.play()
selectVideoItem.playedState = true
this.setData({
selectVideoItem:selectVideoItem
selectVideoItem: selectVideoItem
})
}
} else {
if (selectVideoItem.currentSteps == 3) {
if (selectVideoItem.currentSteps == stepsLength) {
wx.showToast({
title: '已经是最后一步',
icon: 'none',
@@ -280,7 +299,7 @@ Page({
})
return
}
if (selectVideoItem.currentSteps < 3) {
if (selectVideoItem.currentSteps < stepsLength) {
selectVideoItem.currentSteps++
let startTime = selectVideoItem.steps[selectVideoItem.currentSteps].startTime
this.videoContext.pause()
@@ -288,24 +307,23 @@ Page({
this.videoContext.play()
selectVideoItem.playedState = true
this.setData({
selectVideoItem:selectVideoItem
selectVideoItem: selectVideoItem
})
}
}
},
openMirror(){
if(this.data.openCamera){
openMirror() {
if (this.data.openCamera) {
this.setData({
openCamera:!this.data.openCamera
openCamera: !this.data.openCamera
})
return
}
console.log(11)
wx.getSetting({
success:(res)=> {
success: (res) => {
let authSetting = res.authSetting
console.log(res)
if(!authSetting['scope.camera'] || authSetting['scope.camera'] == undefined){
if (!authSetting['scope.camera'] || authSetting['scope.camera'] == undefined) {
wx.showModal({
title: '温馨提示',
content: '若不授权使用摄像头，将无法使用镜子功能！',
@@ -313,44 +331,66 @@ Page({
cancelColor: '#999',
confirmText: '授权',
confirmColor: '#1ba9ba',
success:(res)=> {
if (res.confirm) {//允许打开授权页面
success: (res) => {
if (res.confirm) { //允许打开授权页面
//调起客户端小程序设置界面，返回用户设置的操作结果
if(authSetting['scope.camera'] == undefined){
console.log(JSON.stringify(authSetting['scope.camera']), authSetting['scope.camera'] == undefined)
console.log(authSetting['scope.camera'])
if (authSetting['scope.camera'] == undefined) {
wx.authorize({
scope: 'scope.camera',
success: () => {
// 用户已经同意小程序使用摄像头
this.setData({
openCamera:true
openCamera: true,
isCamera: true
})
},
fail: (err) => {
console.log('err',err)
}
})
}else{
} else {
wx.openSetting({
success:(res)=> {
success: (res) => {
console.log('res', res)
res.authSetting = {
"scope.camera": true
}
this.setData({
openCamera:true
openCamera: true
})
},
})
}
} else if (res.cancel) {//拒绝打开授权页面
} else if (res.cancel) { //拒绝打开授权页面
this.setData({
openCamera:false
openCamera: false
})
}
}
})
}else{
} else {
this.setData({
openCamera:!this.data.openCamera
openCamera: !this.data.openCamera
})
}
}
})
}
},
userInfo() {
wx.$api.user.userIndex().then(res => {
this.setData({
userData: res.data,
})
}).catch(err => {})
},
getVideos() {
wx.$api.user.videos().then(res => {
console.log(res)
this.setData({
videos: res.data.data,
})
}).catch(err => {})
},
})

21
pages/beautify/coach.wxml
View File

@@ -8,32 +8,30 @@
<camera device-position="front" wx:if="{{isCamera}}" flash="off"></camera>
</view>
<view class="coach-avatar">
<image src="https://cdn.shuiganying.com/images/2023/11/14/0835381c22b00f574afb34d319cce442.png" mode="aspectFill"/> 张三一
<image src="{{userData.avatar ? userData.avatar: '/static/imgs/userHead.png'}}" mode="aspectFill"/> {{userData.nickname}}
</view>
<view class="coach-top">
<view class="coach-top-video">
<image class="coach-top-cover" wx:if="{{!selectVideoItem.url}}" src="https://cdn.shuiganying.com/images/2023/11/14/aee3a9b218b03f848e90a2093d2ec815.png" mode="widthFix"/>
<video id="myVideo" controls="{{false}}" muted='{{selectVideoItem.muted}}' bindtimeupdate="videoTimeupdated" bindended='videoEnded' show-center-play-btn="{{false}}" class="coach-top-cover" wx:if="{{selectVideoItem.url}}" src="{{selectVideoItem.url}}"></video>
<view class="coach-top-text" wx:if="{{selectVideoItem.id==0}}">请在下方选择视频</view>
<video id="myVideo" controls="{{false}}" muted='{{selectVideoItem.muted}}' bindtimeupdate='videoTimeupdated' bindended='videoEnded' show-center-play-btn="{{false}}" class="coach-top-cover" wx:if="{{selectVideoItem.url}}" src="{{selectVideoItem.url}}"></video>
<view class="coach-top-text" wx:if="{{selectVideoItem.video_id==0}}">请在下方选择视频</view>
</view>
</view>
<view class="coach-bottom">
<view class="steps-cont" wx:if="{{selectVideoItem.id != 0}}">
<view class="steps-time">00:{{selectVideoItem.remainingTime}}</view>
<view class="steps-cont" wx:if="{{selectVideoItem.video_id != 0}}">
<view class="steps-time">{{selectVideoItem.remainingTimeShow}}</view>
<view class="steps-title">{{selectVideoItem.steps[selectVideoItem.currentSteps].title}}</view>
</view>
<block wx:if="{{seeAllVideo}}">
<swiper class="coach-swiper" display-multiple-items='3' bindchange='swiperChange'>
<swiper class="coach-swiper" display-multiple-items='{{videos.length>3?3:videos.length}}' bindchange='swiperChange'>
<swiper-item class="coach-swiper-item" wx:for="{{videos}}" wx:key="item" catch:tap="selectVideo" data-item="{{item}}">
<image class="coach-swiper-item-cover" src="{{item.cover}}" mode="aspectFill"/>
<view class="coach-swiper-item-cover-active" wx:if="{{item.id == selectVideoItem.id}}"></view>
<view class="coach-swiper-item-cover-active" wx:if="{{item.video_id == selectVideoItem.video_id}}"></view>
</swiper-item>
</swiper>
</block>
<view class="video-control" wx:if="{{selectVideoItem.id!=0}}">
<view class="video-control" wx:if="{{selectVideoItem.video_id!=0}}">
<image catch:tap="mutedTab" data-type='close' wx:if="{{!selectVideoItem.muted}}" class="source" src="https://cdn.shuiganying.com/images/2023/11/13/267603acf95fa978764417d7598aa8b0.png" mode="widthFix"/>
<image catch:tap="mutedTab" data-type='open' wx:if="{{selectVideoItem.muted}}" src="https://cdn.shuiganying.com/images/2023/11/13/37fecae5af2faa01f5baba9c1c01affe.png" mode="widthFix"/>
<view class="source-right">
@@ -45,5 +43,4 @@
</view>
</view>
</view>
</view>

6
pages/beautify/coach.wxss
View File

@@ -96,7 +96,7 @@
}
.coach-top-video{
width: 78vw;
width: 600rpx;
height: 720rpx;
display: flex;
flex-direction: column;
@@ -109,6 +109,7 @@
.coach-top-cover{
width: 100%;
height: 100%;
padding-bottom:30rpx ;
}
.coach-top-text{
margin-top: 40rpx;
@@ -138,7 +139,7 @@
}
.coach-swiper-item-cover{
width: calc(100% - 20rpx);
height: 160rpx;
height: 170rpx;
margin-right: 20rpx;
border-radius: 20rpx;
position: relative;
@@ -199,7 +200,6 @@
/* 倒计时和分布展示 */
.steps-cont{
font-size: 28rpx;
color: #000;

BIN
pages/beautify2/.DS_Store vendored Normal file
View File

Binary file not shown.

433
pages/beautify2/coach.js
View File

@@ -1,66 +1,379 @@
// pages/beautify2/coach.js
// pages/beautify/coach.wxss.js
Page({
/**
* 页面的初始数据
*/
data: {
videos: [{
video_id: 1,
cover: 'https://cdn.shuiganying.com/images/2023/11/14/236a3949c2c0794de850617d4204a159.png',
url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e524b445288836010370038b176a34a1_258.mp4',
steps: [{
title: '第一步：在右脸颊处缓慢向上打圈，反复两次',
startTime: 0, // 开始时间
startCountDown: 3, // 开始倒计时（暂时先可不给）
endTime: 7, // 自定义第一段截止到
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
{
title: '第二步：在右脸颊处缓慢向上打圈，反复3次',
startTime: 8,
startCountDown: 11, // 开始倒计时
endTime: 15, // 自定义 20s
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
{
title: '第三步：在右脸颊处缓慢向上打圈，反复4次',
startTime: 16,
startCountDown: 18, // 开始倒计时
endTime: 20, // 自定义 20s
}
],
},
{
id: 2,
cover: 'https://cdn.shuiganying.com/images/2023/11/14/0835381c22b00f574afb34d319cce442.png',
url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e524b445288836010370038b176a34a1_258.mp4',
steps: [{
title: '第一步：在右脸颊处缓慢向上打圈，反复两次',
startTime: 0,
startCountDown: 3, // 开始倒计时
endTime: 7, // 自定义第一段截止到
},
{
title: '第二步：在右脸颊处缓慢向上打圈，反复3次',
startTime: 8,
startCountDown: 11, // 开始倒计时
endTime: 15, // 自定义 20s
},
{
title: '第三步：在右脸颊处缓慢向上打圈，反复4次',
startTime: 16,
startCountDown: 18, // 开始倒计时
endTime: 20, // 自定义 20s
}
],
},
{
id: 3,
cover: 'https://cdn.shuiganying.com/images/2023/11/14/0835381c22b00f574afb34d319cce442.png',
url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e524b445288836010370038b176a34a1_258.mp4',
steps: [{
title: '第一步：在右脸颊处缓慢向上打圈，反复两次',
startTime: 0,
startCountDown: 3, // 开始倒计时
endTime: 7, // 自定义第一段截止到
},
{
title: '第二步：在右脸颊处缓慢向上打圈，反复3次',
startTime: 8,
startCountDown: 11, // 开始倒计时
endTime: 15, // 自定义 20s
},
{
title: '第三步：在右脸颊处缓慢向上打圈，反复4次',
startTime: 16,
startCountDown: 18, // 开始倒计时
endTime: 20, // 自定义 20s
}
],
},
{
id: 4,
cover: 'https://cdn.shuiganying.com/images/2023/11/14/236a3949c2c0794de850617d4204a159.png',
url: 'https://sns-video-bd.xhscdn.com/stream/110/258/01e524b445288836010370038b176a34a1_258.mp4',
steps: [{
title: '第一步：在右脸颊处缓慢向上打圈，反复两次',
startTime: 0,
startCountDown: 3, // 开始倒计时
endTime: 7, // 自定义第一段截止到
},
{
title: '第二步：在右脸颊处缓慢向上打圈，反复3次',
startTime: 8,
startCountDown: 11, // 开始倒计时
endTime: 15, // 自定义 20s
},
{
title: '第三步：在右脸颊处缓慢向上打圈，反复4次',
startTime: 16,
startCountDown: 18, // 开始倒计时
endTime: 20, // 自定义 20s
}
],
}
],
selectVideoItem: {
video_id: 0, // 默认id是否为0
playedState: false, // 当前是否是正在播放播放状态
muted: false, // 静音状态
stepsCount: 0, // 默认分几个步骤
currentSteps: 0, // 当前默认是第几步
currentTime: 0, // 当前总时长
remainingTime: '00', // 播放时间
},
videoContext: null,
seeAllVideo: true,
openCamera:false, // 是否打开摄像头
userData:{},
// 是否显示摄像头
isCamera: false
},
onShow(){
wx.getSetting({
success:(res)=> {
let authSetting = res.authSetting
this.setData({
isCamera: authSetting['scope.camera'] == true?true:false,
openCamera:authSetting['scope.camera'] == true?true:false
})
}
})
this.userInfo()
this.getVideos()
},
onReady(res) {
this.videoContext = wx.createVideoContext('myVideo')
},
// 视频更新事件
videoTimeupdated(e) {
let selectVideoItem = this.data.selectVideoItem
let currentTimeEnd = selectVideoItem.steps[selectVideoItem.currentSteps].endTime
let {
currentTime,duration
} = e.detail
if (currentTime > currentTimeEnd && selectVideoItem.currentSteps < selectVideoItem.stepsCount) {
selectVideoItem.currentSteps++
this.videoContext.pause()
// 倒计时且有提醒
setTimeout(() => {
this.videoContext.play()
}, 3000);
}
let remainingTime = parseInt(duration - currentTime) >= 10 ? parseInt(duration - currentTime) : '0' + parseInt(duration - currentTime)
selectVideoItem.remainingTime = remainingTime
this.setData({
selectVideoItem: selectVideoItem
})
console.log('视频更新事件', selectVideoItem.currentSteps)
},
// 视频播放结束事件
videoEnded() {
console.log('视频播放结束事件')
// 完成弹窗 重置基础数据
this.setData({
selectVideoItem: {
id: 0
},
seeAllVideo: true,
})
},
// 点击全部视频
allVideoTab() {
this.setData({
seeAllVideo: !this.data.seeAllVideo
})
},
// 点击暂停视频
videoPauseTab() {
console.log('暂停')
let selectVideoItem = this.data.selectVideoItem
selectVideoItem.playedState = false
this.setData({
selectVideoItem: selectVideoItem
})
this.videoContext.pause()
},
// 点击播放视频
videoPlayTab() {
console.log('播放')
let selectVideoItem = this.data.selectVideoItem
selectVideoItem.playedState = true
selectVideoItem.muted = false
this.setData({
selectVideoItem: selectVideoItem
})
this.videoContext.play()
},
// 轮播图切换
swiperChange(e) {
console.log(e.detail)
},
// 选择视频教程-点击
selectVideo(e) {
let item = e.currentTarget.dataset.item
console.log(this.data.selectVideoItem.video_id, item.video_id)
if (this.data.selectVideoItem.video_id == item.video_id) return
item.playedState = false
item.stepsCount = item.steps.length
item.currentSteps = 0
this.setData({
selectVideoItem: item,
seeAllVideo: false,
})
// 处理弹窗，且最后在处理视频播放
setTimeout(() => {
this.doPlay(0)
}, 300);
},
// 播放视频
doPlay(position) {
console.log(position)
this.videoContext.seek(position)
let selectVideoItem = this.data.selectVideoItem
selectVideoItem.playedState = true
this.setData({
selectVideoItem: selectVideoItem
})
// 播放视频
this.videoContext.play()
},
// 静音非经营处理
mutedTab(e) {
console.log(e)
let type = e.target.dataset.type
console.log(type)
let selectVideoItem = this.data.selectVideoItem
if (type == 'open') {
selectVideoItem.muted = false
} else {
selectVideoItem.muted = true
}
this.setData({
selectVideoItem: selectVideoItem
})
},
// 上一段，下一段切换
preTab(e) {
let type = e.target.dataset.type
let selectVideoItem = this.data.selectVideoItem
if (type == 'prev') {
if (selectVideoItem.currentSteps == 0) {
wx.showToast({
title: '已经是第一步',
icon: 'none',
mask: true
})
return
}
if (selectVideoItem.currentSteps > 0) {
selectVideoItem.currentSteps--
let startTime = selectVideoItem.steps[selectVideoItem.currentSteps].startTime
this.videoContext.pause()
this.videoContext.seek(startTime)
this.videoContext.play()
selectVideoItem.playedState = true
this.setData({
selectVideoItem:selectVideoItem
})
}
} else {
if (selectVideoItem.currentSteps == 3) {
wx.showToast({
title: '已经是最后一步',
icon: 'none',
mask: true
})
return
}
if (selectVideoItem.currentSteps < 3) {
selectVideoItem.currentSteps++
let startTime = selectVideoItem.steps[selectVideoItem.currentSteps].startTime
this.videoContext.pause()
this.videoContext.seek(startTime)
this.videoContext.play()
selectVideoItem.playedState = true
this.setData({
selectVideoItem:selectVideoItem
})
}
}
},
openMirror(){
if(this.data.openCamera){
this.setData({
openCamera:!this.data.openCamera
})
return
}
wx.getSetting({
success:(res)=> {
let authSetting = res.authSetting
console.log(res)
if(!authSetting['scope.camera'] || authSetting['scope.camera'] == undefined){
wx.showModal({
title: '温馨提示',
content: '若不授权使用摄像头，将无法使用镜子功能！',
cancelText: '不授权',
cancelColor: '#999',
confirmText: '授权',
confirmColor: '#1ba9ba',
success:(res)=> {
if (res.confirm) {//允许打开授权页面
//调起客户端小程序设置界面，返回用户设置的操作结果
if(authSetting['scope.camera'] == undefined){
wx.authorize({
scope: 'scope.camera',
success: () => {
// 用户已经同意小程序使用摄像头
this.setData({
openCamera:true
})
},
})
}else{
wx.openSetting({
success:(res)=> {
res.authSetting = {
"scope.camera": true
}
this.setData({
openCamera:true
})
},
})
}
} else if (res.cancel) {//拒绝打开授权页面
this.setData({
openCamera:false
})
}
}
})
}else{
this.setData({
openCamera:!this.data.openCamera
})
}
}
})
},
userInfo() {
wx.$api.user.userIndex().then(res => {
this.setData({
userData : res.data,
})
}).catch(err => {})
},
getVideos(){
wx.$api.user.videos().then(res => {
console.log(res)
this.setData({
videos : res.data.data,
})
}).catch(err => {})
},
})

4
pages/beautify2/coach.json Normal file
View File

@@ -0,0 +1,4 @@
{
"usingComponents": {},
"navigationBarTitleText": "美肤教程"
}

51
pages/beautify2/coach.wxml
View File

@@ -1,2 +1,49 @@
<!--pages/beautify2/coach.wxml-->
<text>pages/beautify2/coach.wxml</text>
<view class="coach">
<image class="coach-top-covers" src="https://cdn.shuiganying.com/images/2023/11/14/2479e438889445fe4a96199d5a839d20.png" mode="widthFix"/>
<view class="coach-mirror" wx:if="{{!openCamera}}" catch:tap="openMirror">
<image src="https://cdn.shuiganying.com/images/2023/11/14/645ff37d945dc409761df73bb2ce73cd.png" mode="widthFix"/> 镜子
</view>
<view class="coach-camera" wx:if="{{openCamera}}">
<view class="coach-close" catch:tap="openMirror">X</view>
<camera device-position="front" wx:if="{{isCamera}}" flash="off"></camera>
</view>
<view class="coach-avatar">
<image src="{{userData.avatar ? userData.avatar: '/static/imgs/userHead.png'}}" mode="aspectFill"/> {{userData.nickname}}
</view>
<view class="coach-top">
<view class="coach-top-video">
<image class="coach-top-cover" wx:if="{{!selectVideoItem.url}}" src="https://cdn.shuiganying.com/images/2023/11/14/aee3a9b218b03f848e90a2093d2ec815.png" mode="widthFix"/>
<video id="myVideo" controls="{{false}}" muted='{{selectVideoItem.muted}}' bindtimeupdate="videoTimeupdated" bindended='videoEnded' show-center-play-btn="{{false}}" class="coach-top-cover" wx:if="{{selectVideoItem.url}}" src="{{selectVideoItem.url}}"></video>
<view class="coach-top-text" wx:if="{{selectVideoItem.video_id==0}}">请在下方选择视频</view>
</view>
</view>
<view class="coach-bottom">
<view class="steps-cont" wx:if="{{selectVideoItem.video_id != 0}}">
<view class="steps-time">00:{{selectVideoItem.remainingTime}}</view>
<view class="steps-title">{{selectVideoItem.steps[selectVideoItem.currentSteps].title}}</view>
</view>
<block wx:if="{{seeAllVideo}}">
<swiper class="coach-swiper" display-multiple-items='{{videos.length>3?3:videos.length}}' bindchange='swiperChange'>
<swiper-item class="coach-swiper-item" wx:for="{{videos}}" wx:key="item" catch:tap="selectVideo" data-item="{{item}}">
<image class="coach-swiper-item-cover" src="{{item.cover}}" mode="aspectFill"/>
<view class="coach-swiper-item-cover-active" wx:if="{{item.video_id == selectVideoItem.video_id}}"></view>
</swiper-item>
</swiper>
</block>
<view class="video-control" wx:if="{{selectVideoItem.video_id!=0}}">
<image catch:tap="mutedTab" data-type='close' wx:if="{{!selectVideoItem.muted}}" class="source" src="https://cdn.shuiganying.com/images/2023/11/13/267603acf95fa978764417d7598aa8b0.png" mode="widthFix"/>
<image catch:tap="mutedTab" data-type='open' wx:if="{{selectVideoItem.muted}}" src="https://cdn.shuiganying.com/images/2023/11/13/37fecae5af2faa01f5baba9c1c01affe.png" mode="widthFix"/>
<view class="source-right">
<image catch:tap="preTab" data-type='prev' class="prev" src="https://cdn.shuiganying.com/images/2023/11/13/4aaa5694a48601a6a2e199143cbdb565.png" mode="widthFix"/>
<image class="play" wx:if="{{!selectVideoItem.playedState}}" catch:tap="videoPlayTab" src="https://cdn.shuiganying.com/images/2023/11/13/e6402d0956059d7c3ac467d8995649fb.png" mode="widthFix"/>
<image class="play" wx:if="{{selectVideoItem.playedState}}" catch:tap="videoPauseTab" src="https://cdn.shuiganying.com/images/2023/11/13/585e0a8c57cb2824a132c1eefde23370.png" mode="widthFix"/>
<image catch:tap="preTab" data-type='next' class="next" src="https://cdn.shuiganying.com/images/2023/11/13/4aaa5694a48601a6a2e199143cbdb565.png" mode="widthFix"/>
<view class="all-video" catch:tap="allVideoTab">{{!seeAllVideo?'全部视频':'隐藏'}}</view>
</view>
</view>
</view>
</view>

213
pages/beautify2/coach.wxss Normal file
View File

@@ -0,0 +1,213 @@
/* pages/beautify/coach.wxss.wxss */
.coach{
position: relative;
background-color: #f9f0ed;
}
.coach-top-covers{
width: 100%;
height: 100rpx;
}
/* 顶部图片展示 */
.coach-top{
/* height: 100vh; */
width: 100vw;
background-color: #f9f0ed;
position: relative;
z-index: 0;
/* padding-bottom: 40vh; */
padding-top: 0rpx;
position: relative;
top: -30rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.coach-avatar{
position: absolute;
left: 30rpx;
top: 70rpx;
z-index: 100;
border-radius: 30rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
box-sizing: border-box;
color: #111;
font-size: 30rpx;
font-weight: bold;
}
.coach-avatar image{
width: 100rpx;
height: 100rpx;
border-radius: 100rpx;
margin-right: 20rpx;
}
.coach-camera{
position: absolute;
right: 20rpx;
top: 60rpx;
z-index: 100;
border-radius: 30rpx;
border: solid 10rpx #FF898F;
}
.coach .coach-close{
width: 50rpx;
height: 40rpx;
background-color: #FF898F;
text-align: center;
color: #FFF;
position: absolute;
right: 0;
top: 0;
z-index: 1;
border-radius: 0 20rpx 0 20rpx;
}
.coach-camera camera{
width: 220rpx;
height: 260rpx;
border-radius: 20rpx;
position: relative;
/* z-index: 99; */
transform: rotateY(360deg);
}
.coach-mirror{
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
box-sizing: border-box;
position: absolute;
right: 30rpx;
top: 60rpx;
border:solid 1rpx #FF898F;
border-radius: 40rpx;
padding: 10rpx 30rpx;
font-size: 30rpx;
color: #111111;
}
.coach-mirror image{
width: 30rpx;
height: 30rpx;
/* transform: rotate(30deg); */
margin-right: 4rpx;
}
.coach-top-video{
width: 600rpx;
height: 720rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
font-size: 30rpx;
color: #222;
}
.coach-top-cover{
width: 100%;
height: 100%;
padding-bottom:30rpx ;
}
.coach-top-text{
margin-top: 40rpx;
font-size: 32rpx;
color: #111;
font-weight: bold;
}
/* 底部视频列表 */
.coach-bottom{
width: 100vw;
background-color: white;
/* position: fixed; */
/* bottom: 0; */
/* left: 0; */
z-index: 1;
}
.coach-swiper{
padding-top: 40rpx;
padding-left: 20rpx;
padding-bottom: 20rpx;
height: 200rpx;
}
.coach-swiper-item{
position: relative;
}
.coach-swiper-item-cover{
width: calc(100% - 20rpx);
height: 170rpx;
margin-right: 20rpx;
border-radius: 20rpx;
position: relative;
}
.coach-swiper-item-cover-active{
width: calc(100% - 20rpx);
height: 160rpx;
background-color: rgba(0, 0, 0, 0.1);
position: absolute;
top: 0;
left: 0;
z-index: 1;
border-radius: 20rpx;
}
/* 声音播放控制按钮 */
.video-control{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: 20rpx 0 60rpx 30rpx;
/* display: none; */
}
.video-control image{
width: 44rpx;
height: 44rpx;
padding: 10rpx;
}
.video-control .source-right{
flex:1;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
box-sizing: border-box;
}
.video-control .source-right .play{
width: 100rpx;
height: 100rpx;
padding: 0 40rpx;
}
.video-control .source-right .next{
transform: rotate(180deg);
}
.video-control .source-right .all-video{
min-width: 120rpx;
text-align:center;
margin-left: 40rpx;
margin-right: 30rpx;
border-radius: 40rpx;
border: solid 1rpx #FF898F;
color: #FF898F;
padding: 10rpx 20rpx;
font-size: 26rpx;
}
/* 倒计时和分布展示 */
.steps-cont{
font-size: 28rpx;
color: #000;
padding: 30rpx;
}
.steps-time{
font-size: 70rpx;
font-weight: bold;
margin-bottom: 10rpx;
}

161
pages/found2/index.js Normal file
View File

@@ -0,0 +1,161 @@
Page({
data: {
page : 1,
has_more: true,
lists : [],
listsIndex : 0,
share_id : '',
loading : true,
swipers : [],
playId : '',
},
onLoad(e){
this.setData({
share_id : e.share_id || ''
})
getApp().globalData.inviteText = e.invite || ''
this.getList()
},
onShow(){
},
onHide(){
if(this.data.share_id){
this.setData({
share_id:''
})
}
},
swiperChange(e){
let { current } = e.detail
console.log(current)
let swipers = this.data.swipers
let item = swipers[current]
let type = item.type
if(item.type == 'video'){
if(current == 0 || this.data.playId == '' || this.data.playId != item.id){
let id = 'myVideo'+item.id
console.log(id)
let videoContext = wx.createVideoContext(`${id}`)
videoContext.play()
this.setData({
playId:item.id
})
}
// if()
}
},
getList(){
let params = {
page:this.data.page,
share_id:this.data.share_id
}
wx.$api.found.foundIndex(params).then(res => {
let lists = this.data.lists
if(this.data.page == 1){lists = []}
lists = this.data.lists.concat(res.data.data)
if(this.data.swipers.length == 0){
this.setData({
swipers:res.data.data.splice(0,3)
})
}
this.setData({
lists : lists,
has_more: res.data.page.has_more,
})
this.setData({
loading:false
})
setTimeout(()=>{
wx.hideLoading()
wx.stopPullDownRefresh()
},3000)
}).catch(err=>{
wx.showToast({
title: err.message,
icon :'none',
mask :true,
duration:2000
})
setTimeout(()=>{
this.setData({
loading:false
})
},3000)
})
},
onPullDownRefresh(){
this.setData({
page:1,
has_more:true,
lists:[],
loading:true
})
this.getList()
},
onReachBottom(){
if(this.data.has_more){
this.setData({
page:this.data.page +1
})
this.getList()
wx.showLoading({
title: '疯狂加载中..',
})
}else{
wx.showToast({
title: '没有更多',
icon:'none',
mask:true,
duration:2000
})
}
},
// 预览图片
preImg(e){
let current = e.currentTarget.dataset.idx
console.log(current)
let urls = e.currentTarget.dataset.urls
wx.previewImage({
urls,
current:urls[current]
})
},
// 收藏
doSubscribeFavorite(e){
let index= e.currentTarget.dataset.index
let type = e.currentTarget.dataset.type
let item = this.data.lists[index]
let lists = this.data.lists
wx.$api.found.foundSubscribeFavorite(item.id,type).then(res => {
lists[index].is[`${type}`] = res.data.res
lists[index].count[`${type}`] = res.data.count
this.setData({
lists:lists
})
}).catch(err=>{
wx.showToast({
title: err.message,
icon :'none',
mask :true,
duration:2000
})
})
},
onShareAppMessage(e){
let {describe,id,share_cover}= e.target.dataset.obj
return {
title : describe,
imageUrl: share_cover,
path : "/pages/found/index?share_id=" + id + '&invite=' + wx.getStorageSync("invite")
}
},
})

9
pages/found2/index.json Normal file
View File

@@ -0,0 +1,9 @@
{
"usingComponents": {},
"navigationBarTitleText": "发现",
"navigationBarTextStyle": "white",
"navigationBarBackgroundColor": "#5283ea",
"backgroundTextStyle": "dark",
"backgroundColor": "#eeeeee",
"navigationStyle": "custom"
}

54
pages/found2/index.wxml Normal file
View File

@@ -0,0 +1,54 @@
<view class="pack-center pages-hint grey" wx:if="{{loading}}">
<image src="/static/icons/loadingGif.gif"></image>
<view>疯狂加载中</view>
</view>
<block wx:else>
<!-- <view class="found" wx:for="{{lists}}" wx:key="id"> -->
<!-- 用户 -->
<!-- <view class="avatar">
<view class="avatar-left">
<image class="cover" src="{{item.user.avatar ? item.user.avatar: '/static/imgs/userHead.png'}}" mode="aspectFill"/>
<view>{{item.user.name || '未知用户'}}</view>
</view>
<view>{{item.created_at}}</view>
</view> -->
<!-- 文字描述-->
<!-- <view class="des">{{item.describe}}</view> -->
<!-- 主图或视频 -->
<view class="cont">
<swiper class="cont-swiper" bindchange='swiperChange' vertical='{{true}}'>
<swiper-item class="cont-swiper-item" wx:for="{{swipers}}" wx:key="item">
<!-- 图片汇总 -->
<block wx:if="{{item.type == 'pictures'}}">
<swiper class="cont-image-swiper" indicator-dots="{{true}}" interval='{{1500}}' indicator-active-color="rgba(255,255,255,0.8)" indicator-color='rgba(255,255,255,0.3)'>
<swiper-item class="cont-image-swiper-item" wx:for="{{item.pictures}}" wx:key='idx' wx:for-index="idx" wx:for-item="it">
<image catch:tap="preImg" data-idx="{{idx}}" data-urls='{{item.pictures}}' wx:key="it" src="{{it}}" mode="widthFix"/>
</swiper-item>
</swiper>
</block>
<!-- 视频汇总 -->
<block wx:else>
<video class="cont-video" loop="true" enable-progress-gesture="true" object-fit="contain" id="myVideo{{item.id}}" src="{{item.video}}" />
</block>
</swiper-item>
</swiper>
</view>
<!-- 点赞 收藏 分享 -->
<!-- <view class="footer">
<view class="footer-item" catch:tap="doSubscribeFavorite" data-type='favorite' data-index='{{index}}'>
<image src="{{!item.is.favorite?'/static/imgs/icon_un_zan@2x.png':'/static/imgs/icon_zaned@2x.png'}}" mode="widthFix" />{{!item.is.favorite?'点赞':item.count.favorite}}
</view>
<view class="footer-item" catch:tap="doSubscribeFavorite" data-type='subscribe' data-index='{{index}}'>
<image src="{{!item.is.subscribe?'/static/imgs/icon_un_shou@2x.png':'/static/imgs/icon_shoued@2x.png'}}" mode="widthFix" />{{!item.is.subscribe?'收藏':item.count.subscribe}}
</view>
<button class="footer-item" open-type="share" hover-class="none" data-obj='{{item}}'>
<image style="width:28rpx;" src="/static/imgs/icon_share@2x.png" mode="widthFix" />分享
</button>
</view> -->
<!-- </view> -->
</block>

122
pages/found2/index.wxss Normal file
View File

@@ -0,0 +1,122 @@
page {
background-color: #f9f9f9;
padding-bottom: 80rpx;
}
.found{
background-color: #fff;
width: 100vw;
border-radius: 10rpx;
box-sizing: border-box;
margin-bottom: 20rpx;
}
.avatar{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 400;
color: #999999;
padding: 30rpx;
}
.avatar-left {
display: flex;
flex-direction: row;
align-items: center;
justify-content:flex-start;
box-sizing: border-box;
font-size: 36rpx;
font-weight: bold;
color: #111111;
}
.avatar-left .cover{
width: 80rpx;
height: 80rpx;
border-radius: 50%;
margin-right: 30rpx;
border: solid 10rpx rgba(224, 222, 222, 0.1);
}
.des{
font-size: 30rpx;
font-family: PingFang SC;
font-weight: 400;
color: #111111;
padding: 0 30rpx 30rpx 30rpx;
}
.cont{
width: 100vw;
height: 100vh;
}
.cont-swiper{
width: 100%;
height: 100%;
}
.cont-swiper-item{
width: 100%;
height: 100%;
}
.cont-image-swiper{
width: 100%;
height: 100%;
background-color: #000;
}
.cont-image-swiper-item{
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.cont-image-swiper-item image{
width: 100%;
height: 100%;
}
.cont-video{
width: 100%;
height: 100%;
}
.footer{
border-top: solid 1rpx #eee;
font-size: 28rpx!important;
font-family: PingFang SC;
font-weight: 400!important;
color: #666666;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-around;
box-sizing: border-box;
padding: 20rpx 30rpx;
}
.footer-item{
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: 20rpx 20rpx;
flex: 1;
background-color: #fff!important;
}
.footer-item image{
width: 32rpx;
height: 32rpx;
margin-right: 10rpx;
}
.footer button{
font-size: 28rpx;
color: #666666;
font-weight: normal;
}
.footer button:after {
border: none;
}

199
pages/found2/index2.js Normal file
View File

@@ -0,0 +1,199 @@
// pages/found2/index2.js
var startY, endY
Page({
/**
* 页面的初始数据
*/
data: {
page : 1,
has_more: true,
lists : [],
share_id: '',
currentIndex : 0,
safeArea : getApp().globalData.safeArea,
playing : false
},
onLoad(e){
this.setData({
share_id : e.share_id || ''
})
getApp().globalData.inviteText = e.invite || ''
this.getList()
this.videoContext = wx.createVideoContext('found-cont-video')
},
onHide(){
if(this.data.share_id){
this.setData({
share_id:''
})
}
},
getList(){
let params = {
page:this.data.page,
share_id:this.data.share_id
}
wx.$api.found.foundIndex(params).then(res => {
let lists = this.data.lists
if(this.data.page == 1){lists = []}
lists = this.data.lists.concat(res.data.data)
this.setData({
lists : lists,
has_more: res.data.page.has_more,
})
if(this.data.currentIndex == 0){
this.onVideoPlay()
}
}).catch(err=>{
wx.showToast({
title: err.message,
icon :'none',
mask :true,
duration:2000
})
setTimeout(()=>{
this.setData({
loading:false
})
},3000)
})
},
onTouchStart(e) {
let { clientY } = e.changedTouches[0]
startY = clientY
},
onTouchEnd(e) {
let { clientY } = e.changedTouches[0]
endY = clientY
let clientXY = startY - clientY
console.log(clientXY)
if(clientXY>60){
this.onIsDirection('next')
}else if(clientXY < -60){
this.onIsDirection('prev')
}
},
onIsDirection(type){
let {currentIndex,lists} = this.data
if(type == 'next'){
console.log('获取下一个')
if(currentIndex!=lists.length-1){
currentIndex ++
this.setData({
currentIndex:currentIndex
})
this.onVideoPlay()
}else{
if(this.data.has_more){
this.setData({
page:this.data.page+1
})
this.getList()
}else{
wx.showToast({
title: '没有更多了~',
icon:'none',
mask:true
})
}
}
return
}
if(type == 'prev'){
if(currentIndex>0){
currentIndex --
this.setData({
currentIndex:currentIndex
})
this.onVideoPlay()
}else{
wx.showToast({
title: '没有更多了~',
icon:'none',
mask:true
})
}
return
}
},
onVideoPlay(){
if(this.data.lists[this.data.currentIndex].type == 'video'){
setTimeout(() => {
this.videoContext.seek(0)
this.videoContext.play()
this.setData({
playing:true
})
}, 200);
}else{
this.videoContext.pause()
this.videoContext.seek(0)
this.setData({
playing:false
})
}
},
onVideoPause(){
if(this.data.playing){
this.videoContext.pause()
this.setData({
playing:false
})
}else{
this.videoContext.play()
this.setData({
playing:true
})
}
},
// 预览图片
preImg(e){
let current = e.currentTarget.dataset.idx
console.log(current)
let urls = e.currentTarget.dataset.urls
wx.previewImage({
urls,
current:urls[current]
})
},
// 收藏
doSubscribeFavorite(e){
let index= e.currentTarget.dataset.index
let type = e.currentTarget.dataset.type
let item = this.data.lists[index]
let lists = this.data.lists
wx.$api.found.foundSubscribeFavorite(item.id,type).then(res => {
lists[index].is[`${type}`] = res.data.res
lists[index].count[`${type}`] = res.data.count
this.setData({
lists:lists
})
}).catch(err=>{
wx.showToast({
title: err.message,
icon :'none',
mask :true,
duration:2000
})
})
},
onShareAppMessage(e){
let {describe,id,share_cover}= e.target.dataset.obj
return {
title : describe,
imageUrl: share_cover,
path : "/pages/found/index?share_id=" + id + '&invite=' + wx.getStorageSync("invite")
}
},
})

4
pages/found2/index2.json Normal file
View File

@@ -0,0 +1,4 @@
{
"usingComponents": {},
"navigationStyle": "custom"
}

46
pages/found2/index2.wxml Normal file
View File

@@ -0,0 +1,46 @@
<view class="found" bind:touchend="onTouchEnd" bind:touchstart="onTouchStart" capture-bind:touchforcechange="onTouchForChange">
<view class="found-cont">
<video
catch:tap="onVideoPause"
wx:if="{{lists[currentIndex].type=='video'}}"
id="found-cont-video"
src="{{lists[currentIndex].video}}"
loop="{{true}}"
controls="{{false}}"
show-center-play-btn="{{true}}"
enable-play-gesture="{{true}}"
/>
<block wx:if="{{lists[currentIndex].type=='pictures'}}">
<swiper class="swiper" bindchange="nextVideo" indicator-dots="{{true}}" indicator-color="rgba(255, 255, 255, .3)" indicator-active-color="#fff">
<swiper-item class="swiper-item" wx:for="{{lists[currentIndex].pictures}}" wx:key='idx' wx:for-index="idx" wx:for-item="it">
<image src="{{it}}" mode="widthFix" />
</swiper-item>
</swiper>
</block>
<view class="zanting" catch:tap="onVideoPause" wx:if="{{!playing}}">
<image src="/static/imgs/icon-zanting.png" mode="widthFix"/>
</view>
</view>
<view class="right-cont">
<view class="right">
<image class="avatar" src="{{lists[currentIndex].user.avatar}}" mode="aspectFill" />
<view class="right-item" catch:tap="doSubscribeFavorite" data-type='favorite' data-index='{{currentIndex}}'>
<image src="{{!lists[currentIndex].is.favorite?'/static/imgs/icon_un_zan@2x.png':'/static/imgs/icon_zaned@2x.png'}}" mode="widthFix" />
<!-- {{!lists[currentIndex].is.favorite?'点赞':lists[currentIndex].count.favorite}} -->
{{lists[currentIndex].count.favorite}}
</view>
<view class="right-item" catch:tap="doSubscribeFavorite" data-type='subscribe' data-index='{{currentIndex}}'>
<image src="{{!lists[currentIndex].is.subscribe?'/static/imgs/icon_un_shou@2x.png':'/static/imgs/icon_shoued@2x.png'}}" mode="widthFix" />
<!-- {{!lists[currentIndex].is.subscribe?'收藏':lists[currentIndex].count.subscribe}} -->
{{lists[currentIndex].count.subscribe}}
</view>
<button class="right-item" open-type="share" hover-class="none" data-obj='{{lists[currentIndex]}}'>
<image style="width:40rpx;" src="/static/imgs/icon_share@2x.png" mode="widthFix" />分享
</button>
</view>
</view>
<view class="nickname" style="padding-bottom:70rpx;">
<view class="name"><span>@</span>{{lists[currentIndex].user.name}}</view>
<view class="des">{{lists[currentIndex].describe}}</view>
</view>
</view>

154
pages/found2/index2.wxss Normal file
View File

@@ -0,0 +1,154 @@
/* pages/found2/index2.wxss */
.found{
width: 100vw;
height: 100vh;
background-color: #000;
position: relative;
z-index: 1;
box-sizing: border-box;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.found-cont{
width: 100%;
height: 100%;
background-color: #000;
}
.zanting{
width: 100vw;
height: 100vh;
position: absolute;
top: 0;
left: 0;
z-index: 10;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
.zanting image{
width: 100rpx;
height: 100rpx;
opacity: 0.6;
}
#found-cont-video{
position: relative;
width: 100%;
height: 100%;
}
.swiper{
width: 100;
height: 100%;
}
.swiper-item{
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
box-sizing: border-box;
color: white;
}
.swiper-item image{
width: 100%;
height: 100vw;
}
.right-cont{
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: flex-end;
box-sizing: border-box;
padding: 20rpx 30rpx 20rpx 50rpx;
position: fixed;
z-index: 3;
right: 0;
height: 100vh;
background-image: linear-gradient(to left,rgba(0, 0, 0, 0.432),rgba(248, 247, 247, 0.025));
}
.right{
font-size: 34rpx!important;
font-family: PingFang SC;
font-weight: bold!important;
color: #fff;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding-bottom: 14vh;
}
.right .avatar{
width: 100rpx;
height: 100rpx;
border: solid 10rpx rgba(255, 255, 255, 0.2);
border-radius: 120rpx;
margin-bottom: 30rpx;
}
.right-item{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box;
padding: 20rpx 20rpx;
flex: 1;
}
.right-item image{
width: 46rpx;
height: 46rpx;
margin-bottom: 14rpx;
}
.right button{
font-size: 30rpx;
color: #fff;
font-weight: normal;
padding: 0 !important;
background:transparent!important;
width: 100rpx;
margin-top: 30rpx;
}
.right button:after {
border: none;
}
.nickname{
position: fixed;
z-index: 2;
width: 100%;
box-sizing: border-box;
padding: 30rpx 50rpx;
background-image: linear-gradient(to top,rgba(0, 0, 0, 0.432),rgba(248, 247, 247, 0.025));
bottom: 0;
}
.nickname .name{
font-size: 36rpx;
font-weight: bold;
color: white;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
flex-wrap: wrap;
}
.nickname .name span{
font-size: 40rpx;
}
.nickname .des{
margin-top: 20rpx;
font-size: 32rpx;
color: rgba(255, 255, 255, 0.8);
word-break:break-all;
}

91
pages/found2/swiper.js Normal file
View File

@@ -0,0 +1,91 @@
// pages/swiper.js
var startY, endY
Page({
/**
* 页面的初始数据
*/
data: {
isLoop : false,
swiperNumber : 0,
swiperArr : [],
dataArr : [
{ id: 0, type: "text", data: "0" },
{ id: 1, type: "text", data: "1" },
{ id: 2, type: "text", data: "2" },
{ id: 3, type: "text", data: "3" },
{ id: 4, type: "text", data: "4" },
{ id: 5, type: "text", data: "5" }
]
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
let initData = this.data.dataArr.slice(0, 3)
this.setData({
swiperArr: initData
})
},
// 触摸开始
onStart(e){
let { clientY } = e.changedTouches[0]
startY = clientY
},
// 触摸结束
onEnd(e){
let { clientY } = e.changedTouches[0]
endY = clientY
if(startY-endY >50 || endY-startY>50){
this.onIsDirection()
}
},
// 计算前后滚动
onIsDirection(){
let { swiperArr, dataArr, swiperNumber } = this.data
if(startY > endY){
this.setData({
swiperNumber: swiperNumber += 1,
isLoop : true
})
let newNumber = swiperNumber%3 >= 2 ? 0 : swiperNumber%3 + 1
let nextNumber = swiperNumber + 1
if(nextNumber >= dataArr.length){
this.setData({
isLoop: false
})
wx.showToast({
title: '没有更多内容了~',
icon : 'none'
})
return
}
swiperArr[newNumber] = dataArr[nextNumber]
}else{
this.setData({
swiperNumber: swiperNumber > 0 ? swiperNumber -= 1: 0,
isLoop : true
})
let newNumber = swiperNumber%3 <= 0 ? 2 : swiperNumber%3 - 1
let preNumber = swiperNumber >= 0 ? swiperNumber - 1 : 0
if(preNumber < 0){
this.setData({
isLoop: false
})
wx.showToast({
title: '没有更多内容了~',
icon : 'none'
})
return
}
swiperArr[newNumber] = dataArr[preNumber]
}
this.setData({
swiperArr
})
}
})

4
pages/found2/swiper.json Normal file
View File

@@ -0,0 +1,4 @@
{
"usingComponents": {},
"disableScroll": true
}

14
pages/found2/swiper.wxml Normal file
View File

@@ -0,0 +1,14 @@
<swiper
class="swiper"
circular="{{isLoop}}"
current="{{swiperCurrent}}"
vertical
bindchange="onChange"
bindtouchstart="onStart"
bindtouchend="onEnd"
>
<swiper-item wx:if="{{swiperArr.length > 0}}" wx:for="{{swiperArr}}" wx:key="index">
<view class="swiper-text">轮播内容：{{item.data}}</view>
</swiper-item>
</swiper>

5
pages/found2/swiper.wxss Normal file
View File

@@ -0,0 +1,5 @@
.swiper{ width: 100vw; height: 100vh; background: #000011; }
.swiper-text{ color: white; width: 100vw; height: 100vh; display: flex; align-items: center; justify-content: center; }

91
pages/found2/swiper2.js Normal file
View File

@@ -0,0 +1,91 @@
// pages/index5/index5.js
Page({
/**
* 页面的初始数据
*/
data: {
viList: [{
vio: 'https://assets.mixkit.co/videos/preview/mixkit-movement-in-a-large-avenue-at-night-in-timelapse-44688-large.mp4',
avatar: 'https://profile-avatar.csdnimg.cn/6ef2193c2e9649c88356336c626e5777_m0_64944135.jpg',
name: 'xiaoshen',
id:1,
},
{
vio: 'https://sgy-test-cdn.oss-cn-hangzhou.aliyuncs.com/attachments/2023/11/17/de99704d307d216800e08584111ca61f.mp4',
avatar: ' https://profile.csdnimg.cn/7/A/9/1_2201_75886543',
name: 'kami',
id:2,
},
{
vio: 'https://sgy-test-cdn.oss-cn-hangzhou.aliyuncs.com/attachments/2023/11/17/574217650a315865ce8833c31f8d9091.mp4',
avatar: ' https://profile.csdnimg.cn/7/A/9/1_2201_75886543',
name: 'kami',
id:3
},
{
vio: 'https://sgy-test-cdn.oss-cn-hangzhou.aliyuncs.com/attachments/2023/11/16/eb8debf3c9ef26eb6829a533709c08a1.mp4',
avatar: ' https://profile.csdnimg.cn/7/A/9/1_2201_75886543',
name: 'kami',
id:4
},
{
vio: 'https://sgy-test-cdn.oss-cn-hangzhou.aliyuncs.com/attachments/2023/11/17/ecb93a818d0e507b6d1a962ab83490c9.mp4',
avatar: ' https://profile.csdnimg.cn/7/A/9/1_2201_75886543',
name: 'kami',
id:5
}
],
stopIndex:0,
},
onLoad(options) {
// 调用播放视频方法
this.startUp()
},
// 进页面时播放视频
startUp() {
// 获取video节点
let createVideoContext = wx.createVideoContext('video0')
// 播放视频
createVideoContext.play()
},
// 切换视频的时候播放视频
// 注：此方法视频如果过大可能会叠音，所以视频需要压缩，或者可以尝试循环节点关闭视频
nextVideo(e) {
// 播放当前页面视频
let index = 'video' + e.detail.current
this.setData({
stopIndex:e.detail.current
})
this.playVio(index)
// 暂停前一个页面视频
if (e.detail.current - 1 >= 0) {
let index1 = 'video' + (e.detail.current - 1)
this.pauseVio(index1)
}
// 暂停后一个页面视频
if (e.detail.current + 1 < this.data.viList.length) {
let index2 = 'video' + (e.detail.current + 1)
this.pauseVio(index2)
}
},
// 播放视频
playVio(index) {
// 获取video节点
let createVideoContext = wx.createVideoContext(index)
// 播放视频
createVideoContext.play()
},
// 暂停视频
pauseVio(index) {
// 获取video节点
let createVideoContext = wx.createVideoContext(index)
// 暂停视频
createVideoContext.seek(0)
createVideoContext.pause()
}
})

4
pages/found2/swiper2.json Normal file
View File

@@ -0,0 +1,4 @@
{
"usingComponents": {},
"disableScroll": true
}

15
pages/found2/swiper2.wxml Normal file
View File

@@ -0,0 +1,15 @@
<swiper vertical="true" bindchange="nextVideo">
<swiper-item wx:for="{{viList}}">
<video loop="true" enable-progress-gesture="true" object-fit="contain" src="{{item.vio}}" id="video{{index}}" />
<view class="video-right">
<view class="video-right-img" style="margin-bottom: 10rpx; background-image: url({{item.avatar}})" data-user_id="{{item.id}}" bindtap="toOtherUser"></view>
点赞 评论 转发
</view>
<view class="video-btm">
<view class="video-btm-con">
<text>@{{item.name}}</text><text>\t创建时间</text>
<view>标题</view>
</view>
</view>
</swiper-item>
</swiper>

46
pages/found2/swiper2.wxss Normal file
View File

@@ -0,0 +1,46 @@
page{
background-color: #000;
}
swiper{
height: 100vh;
width: 100vw;
}
swiper video{
height: 100vh;
width: 100%;
}
.video-right{
height: 38vh;
width: 80rpx;
position: fixed;
right: 15rpx;
top: 50vh;
color: #fff;
}
.video-right-img{
height: 80rpx;
width: 80rpx;
border-radius: 100rpx;
background-color: aquamarine;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.video-btm{
height: 180rpx;
width: 100vw;
position: fixed;
bottom: 0;
color:#fff;
}
.video-btm-con{
width: 90vw;
margin: 0 auto;
}

2
pages/mall/index.js
View File

@@ -28,5 +28,5 @@ Page({
goodsArr: res.data.goods
})
}).catch(err => { })
},
}
})

4
pages/mall/index.wxml
View File

@@ -17,9 +17,9 @@
</view>
<!-- 美肤教练 -->
<!-- <navigator hover-class="none" url="/pages/beautify/coach" class="nurse" style="padding-bottom: 0!important;">
<navigator hover-class="none" url="/pages/beautify/coach" class="nurse" style="padding-bottom: 0!important;">
<image class="nurse-img" mode="widthFix" src="https://cdn.shuiganying.com/images/2023/11/15/d7f1911c95307c29ea7904bde0f437a8.png"></image>
</navigator> -->
</navigator>
<!-- 使用场景 -->

14
project.private.config.json
View File

@@ -8,6 +8,20 @@
"condition": {
"miniprogram": {
"list": [
{
"name": "",
"pathName": "pages/beautify/coach",
"query": "",
"launchMode": "default",
"scene": null
},
{
"name": "",
"pathName": "pages/found2/index2",
"query": "share_id=14&invite=1",
"launchMode": "default",
"scene": null
},
{
"name": "",
"pathName": "pages/report/detail/detail",

BIN
static/.DS_Store vendored Normal file
View File

Binary file not shown.

BIN
static/imgs/icon-zanting.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 857 B

BIN
static/imgs/icon_share@2x.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 717 B

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
static/imgs/icon_un_shou@2x.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.1 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

BIN
static/imgs/icon_un_zan@2x.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 869 B

After

Width:  |  Height:  |  Size: 2.6 KiB