first commit
This commit is contained in:
GYJ
BIN
pages/.DS_Store
vendored
Normal file
BIN
pages/.DS_Store
vendored
Normal file
Binary file not shown.
476
pages/chasingDrama/chasingDrama.vue
Normal file
476
pages/chasingDrama/chasingDrama.vue
Normal file
@@ -0,0 +1,476 @@
|
||||
<template>
|
||||
<view style="padding-bottom: 100rpx;">
|
||||
<view class="title flex align-center justify-center">
|
||||
<view class="title-box">
|
||||
<view class="title-box-title flex align-center justify-between">
|
||||
<view class="title-box-title-l">
|
||||
你已连续签到
|
||||
<text style="color: #ff7581;margin: 0 10rpx;">{{day}}</text>
|
||||
天
|
||||
</view>
|
||||
<view v-if="isQd" class="title-box-title-r flex align-center justify-center">
|
||||
今日已签到
|
||||
</view>
|
||||
<view v-else class="title-box-title-r flex align-center justify-center" @click="signIn()">
|
||||
立即签到
|
||||
</view>
|
||||
</view>
|
||||
<view class="title-box-tishi">
|
||||
签到领积分，新剧抢先看。连续签到7天领惊喜礼包
|
||||
</view>
|
||||
<view class="title-box-day flex align-center justify-center">
|
||||
<view class="title-box-day-item flex" v-for="(item,index) in numList" :key="index">
|
||||
<view>
|
||||
<view v-if="index == 0 && isErQd"
|
||||
class="title-box-day-item-num flex align-center justify-center"
|
||||
style="background-color: #ff7581;border: none;">
|
||||
<image src="../../static/images/index/qd_.png" mode="">
|
||||
</image>
|
||||
</view>
|
||||
<view v-else-if="index == 1 && isQd" style="background-color: #ff7581;border: none;"
|
||||
class="title-box-day-item-num flex align-center justify-center">
|
||||
<image src="../../static/images/index/qd_.png" mode="">
|
||||
</image>
|
||||
</view>
|
||||
<view v-else class="title-box-day-item-num flex align-center justify-center">
|
||||
<image src="../../static/images/index/qd.png" mode="">
|
||||
</image>
|
||||
</view>
|
||||
<view class="title-box-day-item-day">
|
||||
{{index==1?'今日':item}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="title-box-day-item-lin" v-if="index < numList.length-1"></view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="list.length>0" class="itemTitle flex align-center justify-center">
|
||||
<view class="itemTitle-box flex align-center justify-between">
|
||||
<view class="itemTitle-box-l">
|
||||
最近观看
|
||||
</view>
|
||||
<view class="itemTitle-box-r" @click="goNav('/me/jilu/jilu')">
|
||||
更多
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="list.length>0" class="zuijin flex align-center justify-center">
|
||||
<view class="zuijin-box flex justify-between">
|
||||
<view class="zuijin-box-item" @click="goCourse(item.courseId,item.courseDetailsId)"
|
||||
v-for="(item,index) in list" :key="index">
|
||||
<view class="zuijin-box-item-img">
|
||||
<image :src="item.titleImg" mode="aspectFill"></image>
|
||||
<view class="zuijin-box-item-img-t" v-if="item.courseDetailsName">
|
||||
{{item.courseDetailsName}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="zuijin-box-item-txt flex align-center flex-wrap">
|
||||
<view class="zuijin-box-item-txt-t">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="zuijin-box-item-txt-l" v-if="item.courseLabel">
|
||||
{{item.courseLabel}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="zhuiju.length>0" class="itemTitle flex align-center justify-center">
|
||||
<view class="itemTitle-box flex align-center justify-between">
|
||||
<view class="itemTitle-box-l">
|
||||
我的追剧
|
||||
</view>
|
||||
<view class="itemTitle-box-r" @click="goNav('/me/jilu/histor')">
|
||||
更多
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="zhuiju.length>0" class="zuijin flex align-center justify-center">
|
||||
<view class="zuijin-box flex justify-between">
|
||||
<view @click="goCourse(item.courseId,item.courseDetailsId)" class="zuijin-box-item"
|
||||
v-for="(item,index) in zhuiju" :key="index">
|
||||
<view class="zuijin-box-item-img">
|
||||
<image :src="item.titleImg" mode="aspectFill"></image>
|
||||
<view class="zuijin-box-item-img-t" v-if="item.courseDetailsName">
|
||||
{{item.courseDetailsName}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="zuijin-box-item-txt flex align-center flex-wrap">
|
||||
<view class="zuijin-box-item-txt-t">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="zuijin-box-item-txt-l" v-if="item.courseLabel">
|
||||
{{item.courseLabel}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isErQd: false, //昨天是否签到
|
||||
isQd: false, //今日是否已签到
|
||||
day: 0, //签到天数
|
||||
numList: this.getThisWeekDates(),
|
||||
list: [],
|
||||
zhuiju: [],
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
|
||||
},
|
||||
onShow() {
|
||||
if (uni.getStorageSync('token')) {
|
||||
this.newLook()
|
||||
this.myVideo()
|
||||
this.myQianInfo()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 跳转资源详情
|
||||
goCourse(e, courseDetailsId) {
|
||||
if (uni.getStorageSync('token')) {
|
||||
uni.navigateTo({
|
||||
url: '/me/detail/detail?id=' + e + '&courseDetailsId=' + courseDetailsId
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/login'
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
//获取签到信息
|
||||
myQianInfo() {
|
||||
let data = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
this.$Request.getT('/app/integral/selectIntegralDay', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data.nowIntegral) { //判断今天是否签到
|
||||
this.day = res.data.nowIntegral.day
|
||||
this.isQd = true
|
||||
}
|
||||
if (res.data.yesterdayIntegral) { //判断昨天是否签到
|
||||
if (!this.day) {
|
||||
this.day = res.data.yesterdayIntegral.day
|
||||
}
|
||||
this.isErQd = true
|
||||
}
|
||||
if (res.data.nowIntegral == null && res.data.yesterdayIntegral == null) {
|
||||
this.day = 0
|
||||
this.isQd = false
|
||||
this.isErQd = false
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
//跳转
|
||||
goNav(url) {
|
||||
if (uni.getStorageSync('token')) {
|
||||
uni.navigateTo({
|
||||
url: url
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/login'
|
||||
})
|
||||
}
|
||||
},
|
||||
//我的追剧
|
||||
myVideo() {
|
||||
let data = {
|
||||
page: 1,
|
||||
limit: 2,
|
||||
classify: 1, //1收藏 2点赞 3历史记录
|
||||
}
|
||||
this.$Request.getT('/app/courseCollect/selectByUserId', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.zhuiju = res.data.records
|
||||
}
|
||||
})
|
||||
},
|
||||
//最近观看
|
||||
newLook() {
|
||||
let data = {
|
||||
page: 1,
|
||||
limit: 2,
|
||||
classify: 3, //1收藏 2点赞 3历史记录
|
||||
}
|
||||
this.$Request.getT('/app/courseCollect/selectByUserId', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.list = res.data.records
|
||||
this.$nextTick(() => {
|
||||
this.videPage = 1
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
//签到
|
||||
signIn() {
|
||||
if (uni.getStorageSync('token')) {
|
||||
this.$Request.getT('/app/integral/signIn').then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title: '今日已签到'
|
||||
})
|
||||
this.myQianInfo()
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/login'
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
//获取这一周的日期，如果如期相同则替换为今日
|
||||
getThisWeekDates() {
|
||||
// const result = [];
|
||||
// const today = new Date();
|
||||
// const startDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() - today.getDay() + 1);
|
||||
|
||||
// for (let i = 0; i < 7; i++) {
|
||||
// const currentDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate() + i);
|
||||
// let dateString = currentDate.toLocaleDateString('en-US', {
|
||||
// month: '2-digit',
|
||||
// day: '2-digit'
|
||||
// });
|
||||
|
||||
// if (currentDate.toDateString() === today.toDateString()) {
|
||||
// dateString = "今日";
|
||||
// }
|
||||
// let obj = {
|
||||
// name: dateString
|
||||
// }
|
||||
// result.push(obj);
|
||||
// }
|
||||
|
||||
// return result;
|
||||
const result = [];
|
||||
const today = new Date();
|
||||
const yesterday = new Date(today.getFullYear(), today.getMonth(), today.getDate() - 1);
|
||||
|
||||
result.push(this.formatDate(yesterday));
|
||||
|
||||
let i = 1;
|
||||
while (i < 7) {
|
||||
const currentDate = new Date(yesterday.getFullYear(), yesterday.getMonth(), yesterday.getDate() + i);
|
||||
result.push(this.formatDate(currentDate));
|
||||
i++;
|
||||
}
|
||||
return result;
|
||||
},
|
||||
formatDate(date) {
|
||||
const year = date.getFullYear();
|
||||
const month = this.padNumber(date.getMonth() + 1);
|
||||
const day = this.padNumber(date.getDate());
|
||||
return `${month}/${day}`;
|
||||
},
|
||||
padNumber(number) {
|
||||
return number < 10 ? '0' + number : number;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #F5F7FF;
|
||||
}
|
||||
|
||||
.itemTitle {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-top: 46rpx;
|
||||
|
||||
.itemTitle-box {
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
|
||||
.itemTitle-box-l {
|
||||
color: #333333;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.itemTitle-box-r {
|
||||
color: #999999;
|
||||
font-size: 28rpx;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.zuijin {
|
||||
width: 100%;
|
||||
margin-top: 26rpx;
|
||||
|
||||
.zuijin-box {
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
|
||||
.zuijin-box-item {
|
||||
width: calc((686rpx - 20rpx) / 2);
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.zuijin-box-item-img {
|
||||
width: 100%;
|
||||
height: 204rpx;
|
||||
border-radius: 24rpx 24rpx 0 0;
|
||||
position: relative;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 24rpx 24rpx 0 0;
|
||||
}
|
||||
|
||||
.zuijin-box-item-img-t {
|
||||
position: absolute;
|
||||
bottom: 10rpx;
|
||||
right: 0;
|
||||
max-width: 80%;
|
||||
border-radius: 10rpx;
|
||||
background-color: rgba(51, 51, 51, 0.7);
|
||||
color: #FFFFFF;
|
||||
font-size: 22rpx;
|
||||
padding: 10rpx;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.zuijin-box-item-txt {
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 0 0 24rpx 24rpx;
|
||||
align-content: center;
|
||||
}
|
||||
|
||||
.zuijin-box-item-txt-t {
|
||||
width: 100%;
|
||||
padding: 0 20rpx;
|
||||
color: #333333;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
|
||||
}
|
||||
|
||||
.zuijin-box-item-txt-l {
|
||||
width: 100%;
|
||||
padding: 0 20rpx;
|
||||
color: #999999;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.title {
|
||||
width: 100%;
|
||||
padding-top: 30rpx;
|
||||
|
||||
.title-box {
|
||||
width: 686rpx;
|
||||
background-color: rgba(255, 117, 129, 0.1);
|
||||
border-radius: 24rpx;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.title-box-title {
|
||||
font-size: 36rpx;
|
||||
font-weight: 700;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.title-box-title-r {
|
||||
background-color: #ff7581;
|
||||
font-size: 26rpx;
|
||||
color: #ffffff;
|
||||
font-weight: 500;
|
||||
border-radius: 40rpx;
|
||||
padding: 20rpx 0;
|
||||
width: 166rpx;
|
||||
}
|
||||
|
||||
.title-box-tishi {
|
||||
font-size: 24rpx;
|
||||
margin-top: 20rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.title-box-day {
|
||||
width: 100%;
|
||||
margin-top: 30rpx;
|
||||
|
||||
.title-box-day-item-lin {
|
||||
width: 30rpx;
|
||||
height: 4rpx;
|
||||
background: #bfbfbf;
|
||||
margin: 0 4rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.title-box-day-item-num {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border-radius: 50%;
|
||||
// border: 1px solid #999999;
|
||||
color: #999999;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.title-box-day-item-day {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.title-box-btn {
|
||||
margin-top: 30rpx;
|
||||
width: 100%;
|
||||
border-radius: 44rpx;
|
||||
background-color: #ff7581;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
padding: 22rpx 0;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
269
pages/index/course/courseList.vue
Normal file
269
pages/index/course/courseList.vue
Normal file
@@ -0,0 +1,269 @@
|
||||
<template>
|
||||
<view class="">
|
||||
<u-sticky :enable="enable">
|
||||
<view class="search-box">
|
||||
<u-search bg-color="#f2f2f2" style="width: 100%;" placeholder="搜索更多资源" v-model="keyword"
|
||||
:show-action="false" :animation="true" @search="getCourseList()"></u-search>
|
||||
</view>
|
||||
</u-sticky>
|
||||
<view class="swiper flex align-center justify-center">
|
||||
<view class="swiper-box">
|
||||
<swiper :indicator-dots="true" class="swiper " :autoplay="true" interval="5000" duration="500"
|
||||
:circular="true" style="width: 100%;height: 350rpx;">
|
||||
<swiper-item v-for="(item,index) in swiperList" :key='index' @tap="goPage(item.url)">
|
||||
<image :src="item.imageUrl" mode="scaleToFill"
|
||||
style="width: 100%;height: 100%;border-radius: 24rpx;"></image>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
<view class="padding-lr">
|
||||
<view class="" v-if="courseList.length">
|
||||
<!-- <view class="vidoList flex align-center justify-between flex-wrap">
|
||||
<view class="vidoList-item" @click="goCourse(item.courseId,item.courseDetailsId)"
|
||||
v-for="(item, index) in courseList" :key="index">
|
||||
<view class="vidoList-item-img">
|
||||
<image :src="item.titleImg" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="vidoList-item-title">
|
||||
{{item.title}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="vidoList-item" style="height: 0;"></view>
|
||||
<view class="vidoList-item" style="height: 0;"></view>
|
||||
</view> -->
|
||||
<videoList @success="posterSuccess" :list="courseList" />
|
||||
</view>
|
||||
<empty title="暂无视频" :isShow='false' v-else></empty>
|
||||
<u-loadmore v-if="courseList.length > 0" :status="status" />
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import videoList from '../../../components/videoList/videoList.vue'
|
||||
import empty from '@/components/empty.vue'
|
||||
export default {
|
||||
components: {
|
||||
empty,
|
||||
videoList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
enable: true,
|
||||
status: 'loadmore',
|
||||
swiperList: [], //轮播图列表
|
||||
courseList: [], //资源列表
|
||||
page: 1,
|
||||
limit: 10,
|
||||
id: '',
|
||||
|
||||
datalist: [{
|
||||
id: 1,
|
||||
name: '综合'
|
||||
}, {
|
||||
id: 2,
|
||||
name: '人气'
|
||||
}, {
|
||||
id: 3,
|
||||
name: '价格',
|
||||
label: '0'
|
||||
}],
|
||||
dataIndex: 0,
|
||||
sort: '',
|
||||
count: 0,
|
||||
keyword: '',
|
||||
isPrice: '', //是否免费 2:免费
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.enable = true
|
||||
this.getCourseList()
|
||||
},
|
||||
onHide() {
|
||||
this.enable = false
|
||||
},
|
||||
onLoad(option) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: option.title
|
||||
})
|
||||
this.getBannerList()
|
||||
if (option.sort) {
|
||||
this.sort = option.sort
|
||||
}
|
||||
if (option.isPrice) {
|
||||
this.isPrice = option.isPrice
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
goPage(url) {
|
||||
uni.navigateTo({
|
||||
url: url
|
||||
})
|
||||
},
|
||||
//点击回调
|
||||
posterSuccess(item) {
|
||||
uni.navigateTo({
|
||||
url: '/me/detail/detail?id=' + item.courseId + '&courseDetailsId=' + item.courseDetailsId
|
||||
})
|
||||
},
|
||||
//最新热播
|
||||
getCourseList() {
|
||||
let data = {
|
||||
limit: this.limit,
|
||||
page: this.page,
|
||||
sort: this.sort ? this.sort : '',
|
||||
title: this.keyword,
|
||||
}
|
||||
// #ifdef MP-WEIXIN
|
||||
data.wxShow = 1
|
||||
// #endif
|
||||
// #ifdef MP-TOUTIAO
|
||||
data.dyShow = 1
|
||||
// #endif
|
||||
if (this.isPrice) {
|
||||
data.isPrice = this.isPrice
|
||||
}
|
||||
this.$u.api.courseList(data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.pages = res.data.totalPage
|
||||
if (this.page < this.pages) {
|
||||
this.status = 'loadmore'
|
||||
} else {
|
||||
this.status = 'nomore'
|
||||
}
|
||||
// res.data.list.forEach(ret => {
|
||||
// ret.courseLabel = ret.courseLabel ? ret.courseLabel.split(',') : []
|
||||
// })
|
||||
if (this.page == 1) {
|
||||
this.courseList = res.data.list
|
||||
} else {
|
||||
this.courseList = [...this.courseList, ...res.data.list]
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
uni.stopPullDownRefresh();
|
||||
|
||||
})
|
||||
},
|
||||
// 获取轮播图列表
|
||||
getBannerList() {
|
||||
this.$u.api.bannerList({
|
||||
classify: '1'
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
res.data.forEach(d => {
|
||||
if (d.state == 1) {
|
||||
this.swiperList.push(d)
|
||||
}
|
||||
})
|
||||
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
},
|
||||
onReachBottom: function() {
|
||||
if (this.page < this.pages) {
|
||||
this.page += 1
|
||||
this.status = 'loading'
|
||||
this.getCourseList()
|
||||
|
||||
} else {
|
||||
this.status = 'nomore'
|
||||
}
|
||||
|
||||
},
|
||||
onPullDownRefresh: function() {
|
||||
this.page = 1;
|
||||
this.getCourseList()
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.search-box {
|
||||
width: 100%;
|
||||
padding: 15upx 2.5%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.vidoList {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.vidoList-item {
|
||||
width: calc((100% - 40rpx) / 3);
|
||||
height: 356rpx;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 24rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.vidoList-item-img {
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
border-radius: 24rpx 24rpx 0 0;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 24rpx 24rpx 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.vidoList-item-title {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 0 0 24rpx 24rpx;
|
||||
padding: 20rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis; //溢出用省略号显示
|
||||
white-space: nowrap; // 默认不换行；
|
||||
}
|
||||
}
|
||||
|
||||
.swiper {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-bottom: 10rpx;
|
||||
margin-top: 10rpx;
|
||||
|
||||
.swiper-box {
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #5074FF;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 150upx;
|
||||
height: 60upx;
|
||||
background: #5074FF;
|
||||
border-radius: 30upx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
</style>
|
||||
397
pages/index/course/orderDet.vue
Normal file
397
pages/index/course/orderDet.vue
Normal file
@@ -0,0 +1,397 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="bg-white padding-sm margin flex" style="border-radius: 24rpx;">
|
||||
<u-image width="200rpx" height="200rpx" border-radius="10rpx" :src="courseList.titleImg">
|
||||
</u-image>
|
||||
<view class="flex flex-direction justify-between margin-left-sm" style="width:420rpx;">
|
||||
<view class="text-bold text-black margin-top-xs u-line-1 text-lg">{{courseList.title}}
|
||||
</view>
|
||||
<!-- <view class="text-gray text-26 margin-top">最近在学{{courseList.payNum}}</view> -->
|
||||
<view class="flex justify-between ">
|
||||
<view class=" text-bold " style="color: #FF8211;">¥<text
|
||||
style="font-size: 42rpx;">{{courseList.price}}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="popup_pay">
|
||||
<view class="text-lg text-bold">支付方式</view>
|
||||
<view class="flex align-center justify-between" style="height: 100upx;" v-for="(item,index) in openLists"
|
||||
:key='index'>
|
||||
<image :src="item.image" style="width: 55upx;height: 55upx;border-radius: 50upx;">
|
||||
</image>
|
||||
<view style="font-size: 30upx;margin-left: 20upx;width: 70%;">
|
||||
{{item.text}}
|
||||
</view>
|
||||
<radio-group name="openWay" style="margin-left: 45upx;" @tap.stop='selectWay(item)'>
|
||||
<label class="tui-radio">
|
||||
<radio color="red" :checked="openWay === item.id ? true : false" />
|
||||
</label>
|
||||
</radio-group>
|
||||
</view>
|
||||
<!-- <view class="pay_btn" @click="pay()">确认支付</view> -->
|
||||
</view>
|
||||
|
||||
<view class="taber">
|
||||
<view class="flex align-center" style="color: #FF8211;">
|
||||
<text style="color: #333;">实付款：</text>
|
||||
<view class=" text-bold " style="color: #FF8211;">¥<text
|
||||
style="font-size: 42rpx;">{{courseList.price}}</text></view>
|
||||
</view>
|
||||
<view class="btn" @click="pay">确定并支付</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
courseId: '',
|
||||
courseList: [],
|
||||
|
||||
openLists: [],
|
||||
openWay: 1,
|
||||
flag: true
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
// #ifdef APP
|
||||
this.openLists = [{
|
||||
image: '../../../static/images/index/weixin.png',
|
||||
text: '微信支付',
|
||||
id: 1
|
||||
}, {
|
||||
image: '../../../static/images/index/zhifubao.png',
|
||||
text: '支付宝',
|
||||
id: 2
|
||||
}],
|
||||
this.openWay = 1;
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
this.openLists = [{
|
||||
image: '../../../static/images/index/weixin.png',
|
||||
text: '微信支付',
|
||||
id: 1
|
||||
}],
|
||||
this.openWay = 1;
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
let ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.indexOf('micromessenger') !== -1) {
|
||||
this.openLists = [{
|
||||
image: '../../../static/images/index/weixin.png',
|
||||
text: '微信支付',
|
||||
id: 1
|
||||
}, {
|
||||
image: '../../../static/images/index/zhifubao.png',
|
||||
text: '支付宝',
|
||||
id: 2
|
||||
}],
|
||||
this.openWay = 1;
|
||||
} else {
|
||||
this.openLists = [{
|
||||
image: '../../../static/images/index/zhifubao.png',
|
||||
text: '支付宝',
|
||||
id: 2
|
||||
}],
|
||||
this.openWay = 2;
|
||||
}
|
||||
// this.openLists = [{
|
||||
// image: '../../../static/images/index/zhifubao.png',
|
||||
// text: '支付宝',
|
||||
// id: 2
|
||||
// }],
|
||||
// this.openWay = 2;
|
||||
// #endif
|
||||
if (option.courseId) {
|
||||
this.courseId = option.courseId
|
||||
this.getDataList(this.courseId)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
selectWay(e) {
|
||||
this.openWay = e.id;
|
||||
},
|
||||
// 资源详情
|
||||
getDataList(id) {
|
||||
let data = {
|
||||
id
|
||||
}
|
||||
this.$u.api.courseDet(data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.courseList = res.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 1500,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
pay() {
|
||||
let that = this
|
||||
if (that.flag) {
|
||||
that.flag = false
|
||||
let data = {
|
||||
courseId: that.courseList.courseId
|
||||
}
|
||||
that.$u.api.courseOrder(data).then(res => {
|
||||
if (res.code == 0 && res.data.flag == 1) {
|
||||
uni.showToast({
|
||||
title: '已获取资源',
|
||||
icon: 'success'
|
||||
})
|
||||
that.getDataList(that.courseId);
|
||||
} else if (res.code == 0 && res.data.flag == 2) {
|
||||
uni.showLoading({
|
||||
title: '支付中...'
|
||||
})
|
||||
if (that.openWay == 1) {
|
||||
// #ifdef MP-WEIXIN
|
||||
that.$u.post('app/wxPay/wxPayJsApiOrder?orderId=' + res.data.orders.ordersId, {})
|
||||
.then(
|
||||
ret => {
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay',
|
||||
timeStamp: ret.data.timestamp,
|
||||
nonceStr: ret.data.noncestr,
|
||||
package: ret.data.package,
|
||||
signType: ret.data.signType,
|
||||
paySign: ret.data.sign,
|
||||
success: function(suc) {
|
||||
console.log('success:' + JSON.stringify(suc));
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'none'
|
||||
})
|
||||
setTimeout(function() {
|
||||
uni.navigateTo({
|
||||
url: '/me/order/index'
|
||||
})
|
||||
}, 1000)
|
||||
},
|
||||
fail: function(err) {
|
||||
uni.hideLoading();
|
||||
console.log('fail:' + JSON.stringify(err));
|
||||
uni.showToast({
|
||||
title: '支付失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
});
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
let ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.indexOf('micromessenger') !== -1) {
|
||||
that.$u.post('/app/wxPay/wxPayMpOrder?orderId=' + res.data.orders.ordersId)
|
||||
.then(
|
||||
res => {
|
||||
if (res.code === 0) {
|
||||
that.callPay(res.data);
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '支付失败!'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
// #ifdef APP
|
||||
console.log(res.data.orders.ordersId,
|
||||
'res.data.orders.ordersIdres.data.orders.ordersId')
|
||||
// let data = {
|
||||
// orderId: res.data.orders.ordersId,
|
||||
// }
|
||||
that.$u.post('/app/wxPay/payAppOrder?orderId=' + res.data.orders.ordersId).then(
|
||||
rea => {
|
||||
console.log(rea)
|
||||
if (rea.code == 0) {
|
||||
that.isCheckPay(rea.code, 'wxpay', JSON.stringify(rea.data));
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
} else if (that.openWay == 2) {
|
||||
// #ifdef H5
|
||||
that.$u.post('/app/aliPay/payOrder?orderId=' + res.data.orders.ordersId +
|
||||
'&classify=2').then(
|
||||
res => {
|
||||
if (res.code === 0) {
|
||||
uni.hideLoading();
|
||||
const div = document.createElement('div')
|
||||
div.innerHTML = res.data //此处form就是后台返回接收到的数据
|
||||
document.body.appendChild(div)
|
||||
document.forms[0].submit()
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '支付失败!'
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// #ifdef APP
|
||||
console.log('---------', res.data.orders.ordersId)
|
||||
// let data = {
|
||||
// orderId: res.data.orders.ordersId,
|
||||
// classify:1
|
||||
// }
|
||||
that.$u.post('/app/aliPay/payOrder?orderId=' + res.data.orders.ordersId +
|
||||
'&classify=1').then(
|
||||
rea => {
|
||||
console.log('---------', rea)
|
||||
that.setPayment('alipay', rea.data);
|
||||
});
|
||||
// #endif
|
||||
}
|
||||
|
||||
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none',
|
||||
// duration: 1500
|
||||
})
|
||||
// that.getDataList(that.courseId);
|
||||
}
|
||||
})
|
||||
setTimeout(() => {
|
||||
that.flag = true
|
||||
}, 1500)
|
||||
|
||||
}
|
||||
|
||||
},
|
||||
isCheckPay(code, name, order) {
|
||||
if (code == 0) {
|
||||
console.log('999999999999')
|
||||
this.setPayment(name, order);
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '支付信息有误'
|
||||
});
|
||||
}
|
||||
},
|
||||
setPayment(name, order) {
|
||||
console.log(777777777, name, order)
|
||||
uni.requestPayment({
|
||||
provider: name,
|
||||
orderInfo: order, //微信、支付宝订单数据
|
||||
success: function(res) {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'none'
|
||||
})
|
||||
setTimeout(function() {
|
||||
uni.navigateTo({
|
||||
url: '/me/order/index'
|
||||
})
|
||||
}, 1000)
|
||||
},
|
||||
fail: function(err) {
|
||||
uni.hideLoading();
|
||||
},
|
||||
complete() {
|
||||
uni.hideLoading();
|
||||
}
|
||||
});
|
||||
},
|
||||
callPay: function(response) {
|
||||
if (typeof WeixinJSBridge === "undefined") {
|
||||
if (document.addEventListener) {
|
||||
document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(response), false);
|
||||
} else if (document.attachEvent) {
|
||||
document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(response));
|
||||
document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(response));
|
||||
}
|
||||
} else {
|
||||
this.onBridgeReady(response);
|
||||
}
|
||||
},
|
||||
onBridgeReady: function(response) {
|
||||
let that = this;
|
||||
if (!response.package) {
|
||||
return;
|
||||
}
|
||||
console.log("response)))):" + JSON.stringify(response))
|
||||
WeixinJSBridge.invoke(
|
||||
'getBrandWCPayRequest', {
|
||||
"appId": response.appid, //公众号名称，由商户传入
|
||||
"timeStamp": response.timestamp, //时间戳，自1970年以来的秒数
|
||||
"nonceStr": response.noncestr, //随机串
|
||||
"package": response.package,
|
||||
"signType": response.signType, //微信签名方式：
|
||||
"paySign": response.sign //微信签名
|
||||
},
|
||||
function(res) {
|
||||
if (res.err_msg === "get_brand_wcpay_request:ok") {
|
||||
// 使用以上方式判断前端返回,微信团队郑重提示：
|
||||
//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
|
||||
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'none'
|
||||
})
|
||||
uni.navigateTo({
|
||||
url: '/me/order/index'
|
||||
})
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
}
|
||||
WeixinJSBridge.log(response.err_msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background: #F5F5F5;
|
||||
}
|
||||
|
||||
.popup_pay {
|
||||
background: #FFFFFF;
|
||||
border-radius: 24rpx;
|
||||
margin: 30rpx 30rpx;
|
||||
padding: 30rpx 30rpx 20rpx 30rpx;
|
||||
}
|
||||
|
||||
.taber {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 99;
|
||||
background: #FFFFFF;
|
||||
padding: 10rpx 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 260rpx;
|
||||
height: 78rpx;
|
||||
background: #5074FF;
|
||||
border-radius: 39rpx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
line-height: 78rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
</style>
|
||||
1002
pages/index/index copy.vue
Normal file
1002
pages/index/index copy.vue
Normal file
File diff suppressed because it is too large
Load Diff
1190
pages/index/index.vue
Normal file
1190
pages/index/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
456
pages/index/search/index.vue
Normal file
456
pages/index/search/index.vue
Normal file
@@ -0,0 +1,456 @@
|
||||
<template>
|
||||
<view class="content">
|
||||
<u-sticky :enable="enable">
|
||||
<view class="search-box">
|
||||
<u-search bg-color="#f2f2f2" style="width: 100%;" placeholder="搜索更多资源" :focus="true" v-model="keyword" :show-action="true"
|
||||
:animation="true" action-text="取消" @custom="goBack()" @search="doSearch(false)"></u-search>
|
||||
</view>
|
||||
</u-sticky>
|
||||
<view class="search-keyword" v-if="isSearch">
|
||||
<view class="keyword-block" v-if="hotKeywordList.length !=0">
|
||||
<view class="keyword-list-header">
|
||||
<view>热搜</view>
|
||||
<view>
|
||||
<image @tap="hotToggle" :src="'/static/images/index/attention'+forbid+'.png'"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="keyword" v-if="forbid==''">
|
||||
<view v-for="(keyword,index) in hotKeywordList" @tap="doSearchs(keyword)" :key="index"
|
||||
v-if="keyword">
|
||||
{{keyword}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="hide-hot-tis" v-else>
|
||||
<view>当前搜热已隐藏</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="keyword-block" v-if="oldKeywordList.length>0">
|
||||
<view class="keyword-list-header">
|
||||
<view>历史记录</view>
|
||||
<view>
|
||||
<image @tap="oldDelete" src="/static/images/index/delete.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="keyword">
|
||||
<view v-for="(keyword,index) in oldKeywordList" @tap="doSearch(keyword)" :key="index"
|
||||
v-if="keyword">
|
||||
{{keyword}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="search-list flex align-center justify-center" v-else>
|
||||
<view class="search-list-box flex align-center justify-between flex-wrap">
|
||||
<swiper class="swiper" :indicator-dots="true" :autoplay="true" interval="5000" duration="500"
|
||||
:circular="true" style="width: 100%;height: 350rpx;margin-bottom: 20rpx;">
|
||||
<swiper-item v-for="(item,index) in swiperList" :key='index' @tap="goPage(item.url)">
|
||||
<image :src="item.imageUrl" mode="scaleToFill"
|
||||
style="width: 100%;height: 100%;border-radius: 24rpx;"></image>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<videoList @success="posterSuccess" :list="keywordList" />
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<empty title="暂无视频" v-if="isSearch == false && keywordList.length==0" />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import videoList from '../../../components/videoList/videoList.vue'
|
||||
import empty from '../../../components/empty.vue'
|
||||
export default {
|
||||
components: {
|
||||
empty,
|
||||
videoList
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
swiperList: [], //轮播图列表
|
||||
enable: true,
|
||||
defaultKeyword: "",
|
||||
keyword: "",
|
||||
oldKeywordList: [], //历史记录
|
||||
hotKeywordList: [], //热搜
|
||||
keywordList: [], //搜索列表
|
||||
forbid: '',
|
||||
isShowKeywordList: false,
|
||||
limit: 10,
|
||||
page: 1,
|
||||
noData: true,
|
||||
count: 0,
|
||||
isSearch: true,
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.enable = true
|
||||
if (uni.getStorageSync('moreSearch')) {
|
||||
this.hotKeywordList = (uni.getStorageSync('moreSearch')).split(',')
|
||||
} else {
|
||||
this.hotKeywordList = []
|
||||
}
|
||||
},
|
||||
onHide() {
|
||||
this.enable = false
|
||||
},
|
||||
onLoad() {
|
||||
// this.init();
|
||||
// this.getSearchList()
|
||||
this.getBannerList()
|
||||
},
|
||||
methods: {
|
||||
//点击回调
|
||||
posterSuccess(item) {
|
||||
let userId = uni.getStorageSync('userId')
|
||||
if (userId) {
|
||||
uni.navigateTo({
|
||||
url: '/me/detail/detail?id=' + item.courseId + '&courseDetailsId=' + item.courseDetailsId +
|
||||
'&tt_album_id=' + item.dyCourseId + '&tt_episode_id=' + item
|
||||
.dyEpisodeId
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
},
|
||||
doSearchs(keyWord) {
|
||||
this.keyword = keyWord
|
||||
this.doSearch(false)
|
||||
},
|
||||
// 跳转资源详情
|
||||
goCourse(e) {
|
||||
let userId = uni.getStorageSync('userId')
|
||||
if (userId) {
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/index/course/courseDet?id=' + e
|
||||
// });
|
||||
uni.navigateTo({
|
||||
url: '/me/detail/detail?id=' + e
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
},
|
||||
getBannerList() {
|
||||
this.$u.api.bannerList({
|
||||
classify: '1'
|
||||
}).then(res => {
|
||||
if (res.code == 0) {
|
||||
res.data.forEach(d => {
|
||||
if (d.state == 1) {
|
||||
this.swiperList.push(d)
|
||||
}
|
||||
})
|
||||
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
// 获取搜索历史
|
||||
getSearchList() {
|
||||
this.$u.api.SearchList().then(res => {
|
||||
if (res.code == 0) {
|
||||
this.hotKeywordList = res.data.allSerchName
|
||||
this.oldKeywordList = res.data.userSearchName
|
||||
}
|
||||
})
|
||||
},
|
||||
//清除历史搜索
|
||||
oldDelete() {
|
||||
uni.showModal({
|
||||
content: '确定清除历史搜索记录？',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
console.log('用户点击确定');
|
||||
this.$u.api.SearchDet().then(res => {
|
||||
if (res.code == 0) {
|
||||
this.getSearchList()
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消');
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
//执行搜索
|
||||
doSearch(keyword) {
|
||||
this.isSearch = false
|
||||
this.isShowKeywordList = true;
|
||||
this.noData = true
|
||||
let data = {
|
||||
title: this.keyword,
|
||||
limit: this.limit,
|
||||
page: this.page,
|
||||
}
|
||||
// #ifdef MP-WEIXIN
|
||||
data.wxShow = 1
|
||||
// #endif
|
||||
// #ifdef MP-TOUTIAO
|
||||
data.dyShow = 1
|
||||
// #endif
|
||||
let token = uni.getStorageSync('token')
|
||||
if (token) {
|
||||
this.$u.api.search(data).then(res => {
|
||||
uni.stopPullDownRefresh()
|
||||
if (res.code == 0) {
|
||||
this.count = res.data.totalPage
|
||||
if (this.page == 1) {
|
||||
this.keywordList = res.data.list
|
||||
} else {
|
||||
this.keywordList = [...this.keywordList, ...res.data.list]
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$u.api.searchs(data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.count = res.data.totalPage
|
||||
if (this.page == 1) {
|
||||
this.keywordList = res.data.list
|
||||
} else {
|
||||
this.keywordList = [...this.keywordList, ...res.data.list]
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
// 点击取消返回首页
|
||||
goBack() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
//热门搜索开关
|
||||
hotToggle() {
|
||||
this.forbid = this.forbid ? '' : '_forbid';
|
||||
},
|
||||
|
||||
|
||||
},
|
||||
onReachBottom: function() {
|
||||
if (this.page < this.count) {
|
||||
this.page += 1
|
||||
this.doSearch();
|
||||
}
|
||||
},
|
||||
onPullDownRefresh: function() {
|
||||
this.page = 1;
|
||||
this.doSearch();
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.search-box {
|
||||
width: 100%;
|
||||
/* background-color: rgb(242, 242, 242); */
|
||||
padding: 15upx 2.5%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
// position: sticky;
|
||||
// top: 0;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.search-box .mSearch-input-box {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.search-box .input-box {
|
||||
width: 85%;
|
||||
flex-shrink: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.search-box .search-btn {
|
||||
width: 15%;
|
||||
margin: 0 0 0 2%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-shrink: 0;
|
||||
font-size: 28upx;
|
||||
color: #ffffff;
|
||||
background: linear-gradient(to right, #ff9801, #ff570a);
|
||||
border-radius: 60upx;
|
||||
}
|
||||
|
||||
.search-box .input-box>input {
|
||||
width: 100%;
|
||||
height: 60upx;
|
||||
font-size: 32upx;
|
||||
border: 0;
|
||||
border-radius: 60upx;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
padding: 0 3%;
|
||||
margin: 0;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.placeholder-class {
|
||||
color: #9e9e9e;
|
||||
}
|
||||
|
||||
.search-keyword {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.search-list {
|
||||
width: 100%;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.search-list-box {
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.keyword-list-box {
|
||||
height: calc(100vh - 110upx);
|
||||
padding-top: 10upx;
|
||||
/* border-radius: 20upx 20upx 0 0; */
|
||||
/* background-color: #fff; */
|
||||
}
|
||||
|
||||
.keyword-entry-tap {
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
.keyword-entry {
|
||||
width: 94%;
|
||||
height: 80upx;
|
||||
margin: 0 3%;
|
||||
font-size: 30upx;
|
||||
color: #333;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
border-bottom: solid 1upx #e7e7e7;
|
||||
}
|
||||
|
||||
.keyword-entry image {
|
||||
width: 60upx;
|
||||
height: 60upx;
|
||||
}
|
||||
|
||||
.keyword-entry .keyword-text,
|
||||
.keyword-entry .keyword-img {
|
||||
height: 80upx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.keyword-entry .keyword-text {
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.keyword-entry .keyword-img {
|
||||
width: 10%;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
.keyword-block {
|
||||
padding: 10upx 0;
|
||||
}
|
||||
|
||||
.keyword-block .keyword-list-header {
|
||||
width: 94%;
|
||||
padding: 10upx 3%;
|
||||
font-size: 27upx;
|
||||
color: #333;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.keyword-block .keyword-list-header image {
|
||||
width: 40upx;
|
||||
height: 40upx;
|
||||
}
|
||||
|
||||
.keyword-block .keyword {
|
||||
width: 94%;
|
||||
padding: 3px 3%;
|
||||
display: flex;
|
||||
flex-flow: wrap;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.keyword-block .hide-hot-tis {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
font-size: 28upx;
|
||||
color: #6b6b6b;
|
||||
}
|
||||
|
||||
.keyword-block .keyword>view {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
border-radius: 60upx;
|
||||
padding: 0 20upx;
|
||||
margin: 10upx 20upx 10upx 0;
|
||||
height: 60upx;
|
||||
font-size: 28upx;
|
||||
// background-color: rgb(242, 242, 242);
|
||||
background: #E6EBFF;
|
||||
color: #6b6b6b;
|
||||
}
|
||||
|
||||
.centre {
|
||||
text-align: center;
|
||||
margin: 200rpx auto;
|
||||
font-size: 32rpx;
|
||||
|
||||
image {
|
||||
width: 360rpx;
|
||||
height: 360rpx;
|
||||
// margin-bottom: 20rpx;
|
||||
margin: 0 auto 20rpx;
|
||||
// border: 1px dotted #000000;
|
||||
}
|
||||
|
||||
.tips {
|
||||
font-size: 34rpx;
|
||||
color: #5074FF;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 80rpx auto;
|
||||
width: 600rpx;
|
||||
border-radius: 32rpx;
|
||||
line-height: 90rpx;
|
||||
color: #ffffff;
|
||||
font-size: 34rpx;
|
||||
background: #5074FF;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
66
pages/index/webView.vue
Normal file
66
pages/index/webView.vue
Normal file
@@ -0,0 +1,66 @@
|
||||
<template>
|
||||
<view style="width: 100%;">
|
||||
<web-view :src="url" style="width: 100%;"></web-view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
url: null, //要打开的外部链接
|
||||
viewerUrl: '/hybrid/html/web/viewer.html',
|
||||
webviewStyles: {
|
||||
width: '750px',
|
||||
height: '100%',
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
onReady() {
|
||||
uni.setNavigationBarTitle({
|
||||
title:'预览'
|
||||
})
|
||||
// #ifdef APP-PLUS
|
||||
console.log('App plus2')
|
||||
var currentWebview = this.$mp.page.$getAppWebview() //获取当前页面的webview对象
|
||||
setTimeout(function() {
|
||||
wv = currentWebview.children()[0]
|
||||
wv.setStyle({
|
||||
scalable: true
|
||||
})
|
||||
}, 1000); //如果是页面初始化调用时，需要延时一下
|
||||
// #endif
|
||||
},
|
||||
onLoad: function(option) {
|
||||
this.url = option.url
|
||||
// this.url="https://jiaoyu.xianmxkj.com/file/uploadPath/2023/03/08/b6c0dd4821cc9ce70c897adca3ad22c2.pdf"
|
||||
// h5，使用h5访问的时候记得跨域
|
||||
// #ifdef H5
|
||||
// this.url="https://jiaoyu.xianmxkj.com/file/uploadPath/2023/03/08/b6c0dd4821cc9ce70c897adca3ad22c2.pdf"
|
||||
// this.url = `${this.viewerUrl}?file=${encodeURIComponent(option.url)}`;
|
||||
// this.url = `${this.viewerUrl}?file=${'https://jiaoyu.xianmxkj.com/file/uploadPath/2023/03/08/b6c0dd4821cc9ce70c897adca3ad22c2.pdf'}`;
|
||||
// #endif
|
||||
|
||||
// 在安卓和ios手机上
|
||||
// 判断是手机系统：安卓，使用pdf.js
|
||||
// #ifdef APP-PLUS
|
||||
// if(plus.os.name === 'Android') {
|
||||
// this.url = `${this.viewerUrl}?file=${encodeURIComponent(option.url)}`;
|
||||
// }
|
||||
// // ios，直接访问pdf所在路径
|
||||
// else {
|
||||
// this.url = encodeURIComponent(option.url);
|
||||
// }
|
||||
// #endif
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.webview {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
637
pages/learn/index.vue
Normal file
637
pages/learn/index.vue
Normal file
@@ -0,0 +1,637 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="wrap">
|
||||
<view class="head">
|
||||
<scroll-view scroll-x class="bg nav bg-white u-border-bottom">
|
||||
<view class="flex text-center">
|
||||
<view class="cu-item flex-sub text-bold" :class="item.name==TabCur?' cur ':'text-black'"
|
||||
v-for="(item,index) in tabList" :key="index" :data-id="item.name" @tap="tabSelect">
|
||||
{{item.name}}
|
||||
<view v-if="item.name==TabCur"
|
||||
style="width: 64rpx;height: 8rpx;;background: #5074FF;margin: -20rpx auto;border-radius: 10rpx;">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="headlen">
|
||||
<view v-if="TabCur == tabList[0].name">
|
||||
<view class="page-box" v-if="latelyCourseList.length && userId">
|
||||
<view class="order" v-for="(item, index) in latelyCourseList" :key="index"
|
||||
@click="goCourseDet(item)">
|
||||
<view class="item">
|
||||
<view class="left">
|
||||
<image :src="item.titleImg" mode="aspectFill"
|
||||
style="border-radius: 10rpx;width: 180rpx;height: 180rpx;"></image>
|
||||
</view>
|
||||
<view class="flex-sub content flex flex-direction justify-between"
|
||||
style="width:420rpx;">
|
||||
<view class="text-bold text-black margin-top-xs u-line-1 text-lg">{{item.title}}
|
||||
</view>
|
||||
<view class="text-gray text-26 margin-top">最近{{item.payNum}}人在学 </view>
|
||||
<view class="flex align-center justify-between">
|
||||
<view class=" " style="color: #FF8211;">¥ <text class=" text-bold"
|
||||
style="font-size: 42rpx;">{{item.price}}</text></view>
|
||||
<view class="btn">马上学习</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 空数据 -->
|
||||
<empty v-else-if="!latelyCourseList.length && userId"></empty>
|
||||
<noLogin v-if="userId === ''"></noLogin>
|
||||
</view>
|
||||
<view v-if="TabCur == tabList[1].name">
|
||||
<view class="page-box" v-if="selectCourseList.length && userId">
|
||||
<view class="order" v-for="(item, index) in selectCourseList" :key="index"
|
||||
@click="goCourseDet(item)">
|
||||
<view class="item">
|
||||
<view class="left">
|
||||
<image :src="item.titleImg" mode="aspectFill"
|
||||
style="border-radius: 10rpx;width: 180rpx;height: 180rpx;"></image>
|
||||
</view>
|
||||
<view class="flex-sub content flex flex-direction justify-between"
|
||||
style="width:420rpx;">
|
||||
<view class="text-bold text-black margin-top-xs u-line-1 text-lg">{{item.title}}
|
||||
</view>
|
||||
<view class="text-gray text-26 margin-top">最近{{item.payNum}}人在学 </view>
|
||||
<view class="flex align-center justify-between">
|
||||
<view class=" " style="color: #FF8211;">¥ <text class=" text-bold"
|
||||
style="font-size: 42rpx;">{{item.price}}</text></view>
|
||||
<view class="btn">马上学习</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 空数据 -->
|
||||
<empty v-else-if="!selectCourseList.length && userId"></empty>
|
||||
<noLogin v-if="userId === ''"></noLogin>
|
||||
</view>
|
||||
<view v-if="TabCur == tabList[2].name">
|
||||
<view class="page-box" v-if="collectList.length && userId">
|
||||
<view class="order" v-for="(item,index) in collectList" :key='index' @click="goCourseDet(item)">
|
||||
<view class="item">
|
||||
<view class="left">
|
||||
<image :src="item.titleImg" mode="aspectFill"
|
||||
style="border-radius: 10rpx;width: 180rpx;height: 180rpx;"></image>
|
||||
</view>
|
||||
<view class="flex-sub content flex flex-direction justify-between"
|
||||
style="width:420rpx;">
|
||||
<view class="text-bold text-black margin-top-xs u-line-1 text-lg">{{item.title}}
|
||||
</view>
|
||||
<view class="text-gray text-26 margin-top">最近{{item.payNum}}人在学 </view>
|
||||
<view class="flex align-center justify-between">
|
||||
<view class=" " style="color: #FF8211;">¥ <text class=" text-bold"
|
||||
style="font-size: 42rpx;">{{item.price}}</text></view>
|
||||
<view class="btn">马上学习</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 空数据 -->
|
||||
<empty v-else-if="!collectList.length && userId" content="去添加"></empty>
|
||||
<noLogin v-if="userId === ''"></noLogin>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import empty from '@/components/empty.vue'
|
||||
import noLogin from '@/components/noLogin.vue'
|
||||
export default {
|
||||
components: {
|
||||
empty,
|
||||
noLogin
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
TabCur: '最近学习',
|
||||
orderList: [
|
||||
[],
|
||||
[],
|
||||
[]
|
||||
],
|
||||
tabList: [{
|
||||
name: '最近学习'
|
||||
},
|
||||
{
|
||||
name: '已购资源'
|
||||
},
|
||||
{
|
||||
name: '收藏资源'
|
||||
}
|
||||
],
|
||||
current: 0,
|
||||
swiperCurrent: 0,
|
||||
tabsHeight: 0,
|
||||
dx: 0,
|
||||
loadStatus: ['loadmore', 'loadmore', 'loadmore', 'loadmore'],
|
||||
userId: '',
|
||||
|
||||
limit: 10,
|
||||
latelyCourseList: [], //最近学习
|
||||
latelyCoursePage: 1,
|
||||
selectCourseList: [], //已购资源
|
||||
selectCoursePage: 1,
|
||||
collectList: [], //收藏资源
|
||||
collectPage: 1,
|
||||
totalCount: 0
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
onShow() {
|
||||
console.log(this.latelyCourseList)
|
||||
this.userId = uni.getStorageSync('userId') ? uni.getStorageSync('userId') : ''
|
||||
if (this.userId) {
|
||||
// this.latelyCourseList = []
|
||||
// this.selectCourseList = []
|
||||
// this.collectList = []
|
||||
this.getLatelyCourse()
|
||||
this.getSelectCourse()
|
||||
this.getCollectList()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
tabSelect(e) {
|
||||
// console.log(e.currentTarget.dataset)
|
||||
this.TabCur = e.currentTarget.dataset.id;
|
||||
this.userId = uni.getStorageSync('userId') ? uni.getStorageSync('userId') : ''
|
||||
// console.log("this.userId____:" + this.userId)
|
||||
if (this.userId) {
|
||||
switch (this.TabCur) {
|
||||
case '最近学习': //最近学习
|
||||
this.latelyCoursePage = 1
|
||||
this.getLatelyCourse()
|
||||
break;
|
||||
case '已购资源': //已购资源
|
||||
this.selectCoursePage = 1
|
||||
this.getSelectCourse()
|
||||
break;
|
||||
case '收藏资源': //已购资源
|
||||
this.collectPage = 1;
|
||||
this.getCollectList()
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
// 最近学习
|
||||
getLatelyCourse() {
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
})
|
||||
let data = {
|
||||
userId: this.userId,
|
||||
page: this.latelyCoursePage,
|
||||
limit: this.limit,
|
||||
}
|
||||
this.$u.api.latelyCourse(data).then(res => {
|
||||
uni.hideLoading()
|
||||
uni.stopPullDownRefresh();
|
||||
if (res.code == 0) {
|
||||
res.data.list.forEach(ret => {
|
||||
if (ret.avatar) {
|
||||
ret.avatar = ret.avatar.split(',')
|
||||
}
|
||||
})
|
||||
this.totalCount = res.data.totalCount
|
||||
if (this.latelyCoursePage == 1) {
|
||||
this.latelyCourseList = res.data.list;
|
||||
} else {
|
||||
this.latelyCourseList = [...this.latelyCourseList, ...res.data.list]
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
},
|
||||
// 已购资源
|
||||
getSelectCourse() {
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
})
|
||||
let data = {
|
||||
userId: this.userId,
|
||||
page: this.selectCoursePage,
|
||||
limit: this.limit,
|
||||
}
|
||||
this.$u.api.selectCourse(data).then(res => {
|
||||
uni.hideLoading()
|
||||
uni.stopPullDownRefresh();
|
||||
if (res.code == 0) {
|
||||
res.data.list.forEach(ret => {
|
||||
if (ret.avatar) {
|
||||
ret.avatar = ret.avatar.split(',')
|
||||
}
|
||||
})
|
||||
this.totalCount = res.data.totalCount
|
||||
if (this.selectCoursePage == 1) {
|
||||
this.selectCourseList = res.data.list;
|
||||
} else {
|
||||
this.selectCourseList = [...this.selectCourseList, ...res.data.list]
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
// 获取收藏信息
|
||||
getCollectList() {
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
})
|
||||
let data = {
|
||||
userId: this.userId,
|
||||
page: this.collectPage,
|
||||
limit: this.limit,
|
||||
}
|
||||
this.$u.api.collectList(data).then(res => {
|
||||
uni.hideLoading()
|
||||
uni.stopPullDownRefresh();
|
||||
if (res.code == 0) {
|
||||
this.totalCount = res.data.totalCount
|
||||
if (this.collectPage == 1) {
|
||||
this.collectList = res.data.records;
|
||||
} else {
|
||||
this.collectList = [...this.collectList, ...res.data.records]
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
// 查看资源详情
|
||||
goCourseDet(e) {
|
||||
let userId = uni.getStorageSync('userId')
|
||||
if (userId) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/index/course/courseDet?id=' + e.courseId
|
||||
});
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
},
|
||||
computed: {
|
||||
// 价格整数
|
||||
priceInt() {
|
||||
return val => {
|
||||
// if (val !== parseInt(val)) return val.split('.')[0];
|
||||
// else return val;
|
||||
return val
|
||||
};
|
||||
}
|
||||
},
|
||||
onReachBottom: function() {
|
||||
this.userId = uni.getStorageSync('userId') ? uni.getStorageSync('userId') : ''
|
||||
if (this.userId) {
|
||||
if (this.TabCur == '最近学习') { //最近学习
|
||||
if (this.totalCount == this.latelyCourseList.length) {
|
||||
uni.showToast({
|
||||
title: '已经到底了~',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
} else {
|
||||
this.latelyCoursePage = this.latelyCoursePage + 1;
|
||||
this.getLatelyCourse()
|
||||
}
|
||||
} else if (this.TabCur == '已购资源') { //已购资源
|
||||
if (this.totalCount == this.selectCourseList.length) {
|
||||
uni.showToast({
|
||||
title: '已经到底了~',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
} else {
|
||||
this.selectCoursePage = this.selectCoursePage + 1;
|
||||
this.getSelectCourse()
|
||||
}
|
||||
} else if (this.TabCur == '收藏资源') { //收藏资源
|
||||
if (this.totalCount == this.collectList.length) {
|
||||
uni.showToast({
|
||||
title: '已经到底了~',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
} else {
|
||||
this.collectPage = this.collectPage + 1;
|
||||
this.getCollectList()
|
||||
}
|
||||
}
|
||||
// switch (this.TabCur) {
|
||||
// case '最近学习': //最近学习
|
||||
// this.latelyCoursePage = this.latelyCoursePage + 1;
|
||||
// this.getLatelyCourse()
|
||||
// break;
|
||||
// case '已购资源': //已购资源
|
||||
// this.selectCoursePage = this.selectCoursePage + 1;
|
||||
// this.getSelectCourse()
|
||||
// break;
|
||||
// case '收藏资源': //评论
|
||||
// this.collectPage = this.collectPage + 1;
|
||||
// this.getCollectList()
|
||||
// break;
|
||||
// }
|
||||
}
|
||||
},
|
||||
onPullDownRefresh: function() {
|
||||
this.userId = uni.getStorageSync('userId') ? uni.getStorageSync('userId') : ''
|
||||
if (this.userId) {
|
||||
if (this.TabCur == '最近学习') { //最近学习
|
||||
if (this.totalCount == this.latelyCourseList.length) {
|
||||
uni.showToast({
|
||||
title: '已经到底了~',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
} else {
|
||||
this.latelyCoursePage = 1
|
||||
this.getLatelyCourse()
|
||||
}
|
||||
} else if (this.TabCur == '已购资源') { //已购资源
|
||||
if (this.totalCount == this.selectCourseList.length) {
|
||||
uni.showToast({
|
||||
title: '已经到底了~',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
} else {
|
||||
this.selectCoursePage = 1
|
||||
this.getSelectCourse()
|
||||
}
|
||||
} else if (this.TabCur == '收藏资源') { //收藏资源
|
||||
if (this.totalCount == this.collectList.length) {
|
||||
uni.showToast({
|
||||
title: '已经到底了~',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
} else {
|
||||
this.collectPage = 1
|
||||
this.getCollectList()
|
||||
}
|
||||
}
|
||||
// switch (this.TabCur) {
|
||||
// case '最近学习': //最近学习
|
||||
// this.latelyCoursePage = 1
|
||||
// // this.latelyCourseList = []
|
||||
// this.getLatelyCourse()
|
||||
// break;
|
||||
// case '已购资源': //已购资源
|
||||
// this.selectCoursePage = 1
|
||||
// // this.selectCourseList = []
|
||||
// this.getSelectCourse()
|
||||
// break;
|
||||
// case '收藏资源': //已购资源
|
||||
// this.collectPage = 1;
|
||||
// // this.collectList = []
|
||||
// this.getCollectList()
|
||||
// break;
|
||||
// }
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* #ifndef H5 */
|
||||
page {
|
||||
height: 100%;
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
</style>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.head {
|
||||
position: fixed;
|
||||
/* #ifdef H5 */
|
||||
top: 0rpx;
|
||||
/* #endif */
|
||||
/* #ifndef H5 */
|
||||
top: 0;
|
||||
/* #endif */
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.headlen {
|
||||
/* #ifdef H5 */
|
||||
margin-top: 80rpx;
|
||||
/* #endif */
|
||||
/* #ifndef H5 */
|
||||
margin-top: 90rpx;
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.page-box {
|
||||
padding-bottom: 100px;
|
||||
}
|
||||
|
||||
.order {
|
||||
width: 700rpx;
|
||||
background-color: #ffffff;
|
||||
margin: 20rpx auto;
|
||||
border-radius: 20rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
.left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.store {
|
||||
margin: 0 10rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
color: $u-type-warning-dark;
|
||||
}
|
||||
}
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
|
||||
.left {
|
||||
margin-right: 20rpx;
|
||||
|
||||
image {
|
||||
width: 280rpx;
|
||||
height: 240rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
.title {
|
||||
font-size: 16px;
|
||||
line-height: 50rpx;
|
||||
font-weight: bold;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.buttom {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #E6E6E6;
|
||||
|
||||
.price {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: #FF8211;
|
||||
}
|
||||
|
||||
.number {
|
||||
font-size: 14px;
|
||||
color: #999999;
|
||||
line-height: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.head1 {
|
||||
position: relative;
|
||||
left: -5px;
|
||||
}
|
||||
|
||||
.head2 {
|
||||
position: relative;
|
||||
left: -10px;
|
||||
}
|
||||
|
||||
.number {
|
||||
line-height: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.total {
|
||||
margin-top: 20rpx;
|
||||
text-align: right;
|
||||
font-size: 24rpx;
|
||||
|
||||
.total-price {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
margin-top: 40rpx;
|
||||
padding: 0 10rpx;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.btn {
|
||||
line-height: 52rpx;
|
||||
width: 160rpx;
|
||||
border-radius: 26rpx;
|
||||
border: 2rpx solid $u-border-color;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
color: $u-type-info-dark;
|
||||
}
|
||||
|
||||
.evaluate {
|
||||
color: $u-type-warning-dark;
|
||||
border-color: $u-type-warning-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.centre {
|
||||
text-align: center;
|
||||
margin: 200rpx auto;
|
||||
font-size: 32rpx;
|
||||
|
||||
image {
|
||||
width: 360rpx;
|
||||
height: 360rpx;
|
||||
// margin-bottom: 20rpx;
|
||||
margin: 0 auto 20rpx;
|
||||
border: 1px dotted #000000;
|
||||
}
|
||||
|
||||
.tips {
|
||||
font-size: 40rpx;
|
||||
color: #5074FF;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.btn {
|
||||
margin: 80rpx auto;
|
||||
width: 600rpx;
|
||||
border-radius: 32rpx;
|
||||
line-height: 90rpx;
|
||||
color: #ffffff;
|
||||
font-size: 34rpx;
|
||||
background: #5074FF;
|
||||
}
|
||||
}
|
||||
|
||||
.wrap {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100vh - var(--window-top));
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
.swiper-box {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swiper-item {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 150upx;
|
||||
height: 60upx;
|
||||
background: #5074FF;
|
||||
border-radius: 30upx;
|
||||
color: #FFFFFF;
|
||||
text-align: center;
|
||||
line-height: 60rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
</style>
|
||||
267
pages/login/appEq.vue
Normal file
267
pages/login/appEq.vue
Normal file
@@ -0,0 +1,267 @@
|
||||
<template>
|
||||
<view
|
||||
style="background-image: url(https://renwu.xiansqx.com/img/20210809/71fcac577b1945a7aeb724c8bd12a171.png);background-size: 100%;">
|
||||
<view style="text-align: center;">
|
||||
<image
|
||||
style="width: 160upx;height: 160upx;margin-top: 200upx;border-radius:20upx;border: 2px solid #FFFFFF;"
|
||||
src="../../static/images/logo.png"></image>
|
||||
<view style="font-size: 46upx;margin-top: 20upx;color: #FFFFFF;font-weight: 500;">短剧APP</view>
|
||||
<view style="font-size: 28upx;margin-top: 8upx;color: #FFFFFF;font-weight: 300;">{{message}}</view>
|
||||
<button class="confirm-btn" @click="taobaoLogin">下载短剧APP</button>
|
||||
<view style="margin-top: 300upx;text-align: center"><text
|
||||
style="color: #666666;font-size: 32upx;font-weight: 400;"></text></view>
|
||||
<view style="color: #333333;margin-top: 20upx;font-weight: 600;font-size: 38upx;"></view>
|
||||
<view style="margin-top: 40upx;background: #FF0223;height: 10upx;width: 60upx;margin-left: 46%;"></view>
|
||||
</view>
|
||||
<view id="shareit" v-if="show_share" @tap="closeShare">
|
||||
<image class="arrow" src="https://renwu.xiansqx.com/img/20210813/9aa484db4c60458f86deb2a8ab6fe400.png">
|
||||
</image>
|
||||
<view id="follow">点击右上角按钮，选择浏览器打开下载！</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
mobile: '',
|
||||
code: '',
|
||||
message: '',
|
||||
show_share: false,
|
||||
openShare: false,
|
||||
openShares: false,
|
||||
relationId: '',
|
||||
sending: false,
|
||||
};
|
||||
},
|
||||
onLoad(e) {
|
||||
|
||||
|
||||
},
|
||||
methods: {
|
||||
closeShare() {
|
||||
this.show_share = false;
|
||||
},
|
||||
taobaoLogin() {
|
||||
uni.setClipboardData({
|
||||
data: this.relationId,
|
||||
success: r => {
|
||||
// this.$queue.showToast('邀请码复制成功');
|
||||
}
|
||||
});
|
||||
var u = navigator.userAgent;
|
||||
if (u.indexOf('Android') > -1 || u.indexOf('Adr') > -1) {
|
||||
this.$Request.get('/app/common/type/49').then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data && res.data.value) {
|
||||
if (this.openShare) {
|
||||
let ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.indexOf('micromessenger') === -1) {
|
||||
this.show_share = false;
|
||||
// #ifndef H5
|
||||
plus.runtime.openURL(res.data.value, function(res) {
|
||||
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
window.location.href = res.data.value;
|
||||
// #endif
|
||||
} else {
|
||||
this.show_share = true;
|
||||
}
|
||||
} else {
|
||||
// #ifndef H5
|
||||
plus.runtime.openURL(res.data.value, function(res) {
|
||||
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
window.location.href = res.data.value;
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.$Request.get('/app/common/type/50').then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data && res.data.value) {
|
||||
if (this.openShares) {
|
||||
let ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.indexOf('micromessenger') === -1) {
|
||||
this.show_share = false;
|
||||
// #ifndef H5
|
||||
plus.runtime.openURL(res.data.value, function(res) {
|
||||
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
window.location.href = res.data.value;
|
||||
// #endif
|
||||
} else {
|
||||
this.show_share = true;
|
||||
}
|
||||
} else {
|
||||
// #ifndef H5
|
||||
plus.runtime.openURL(res.data.value, function(res) {
|
||||
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
window.location.href = res.data.value;
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
#shareit {
|
||||
-webkit-user-select: none;
|
||||
position: fixed;
|
||||
/*width: 100%;*/
|
||||
height: 2000px;
|
||||
background: rgba(0, 0, 0, 0.85);
|
||||
text-align: center;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
#shareit img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
width: 100px;
|
||||
height: 150px;
|
||||
position: absolute;
|
||||
right: 5%;
|
||||
top: 1%;
|
||||
}
|
||||
|
||||
#follow {
|
||||
margin-right: 60px;
|
||||
margin-left: 30px;
|
||||
width: 90%;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
text-align: left;
|
||||
text-decoration: none;
|
||||
font-size: 18px;
|
||||
color: white;
|
||||
float: left;
|
||||
margin-top: 160px;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding-left: 140upx;
|
||||
margin-top: 32upx;
|
||||
font-size: 24upx;
|
||||
color: #666666;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.send-msg {
|
||||
border-radius: 30px;
|
||||
color: black;
|
||||
background: white;
|
||||
height: 30px;
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
.container {
|
||||
top: 0;
|
||||
padding-top: 50px;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
z-index: 90;
|
||||
background: #fff;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
|
||||
.right-top-sign {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
right: -15px;
|
||||
z-index: 95;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
display: block;
|
||||
content: '';
|
||||
width: 20px;
|
||||
height: 40px;
|
||||
background: #e10a07;
|
||||
}
|
||||
|
||||
&:before {
|
||||
transform: rotate(50deg);
|
||||
border-radius: 0 50px 0 0;
|
||||
}
|
||||
|
||||
&:after {
|
||||
position: absolute;
|
||||
right: -198px;
|
||||
top: 0;
|
||||
transform: rotate(-50deg);
|
||||
border-radius: 50px 0 0 0;
|
||||
/* background: pink; */
|
||||
}
|
||||
}
|
||||
|
||||
.left-bottom-sign {
|
||||
position: absolute;
|
||||
left: -270px;
|
||||
bottom: -320px;
|
||||
/*border: 100upx solid #d0d1fd;*/
|
||||
border-radius: 50%;
|
||||
padding: 90px;
|
||||
}
|
||||
|
||||
.welcome {
|
||||
position: relative;
|
||||
left: 30px;
|
||||
top: -55px;
|
||||
font-size: 28px;
|
||||
color: #555;
|
||||
text-shadow: 1px 0px 1px rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.input-content {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
.confirm-btn {
|
||||
width: 500upx;
|
||||
height: 100upx;
|
||||
line-height: 100upx;
|
||||
margin-top: 200upx;
|
||||
color: #FE0122;
|
||||
font-size: 38upx;
|
||||
font-weight: 500;
|
||||
|
||||
// &:after {
|
||||
// border-radius: 60px;
|
||||
// }
|
||||
}
|
||||
</style>
|
||||
192
pages/login/bind.vue
Normal file
192
pages/login/bind.vue
Normal file
@@ -0,0 +1,192 @@
|
||||
<template>
|
||||
<view class="container1">
|
||||
<view class="cu-form-group"
|
||||
style="margin: 30upx;border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<view class="title">手机号</view>
|
||||
<input type="number" :value="mobile" placeholder="请输入手机号" maxlength="11" data-key="mobile"
|
||||
@input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group"
|
||||
style="margin: 30upx;border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<text class="title">验证码</text>
|
||||
<input type="number" :value="code" placeholder="请输入验证码" maxlength="6" data-key="code" @input="inputChange"
|
||||
@confirm="toLogin" />
|
||||
<button class="send-msg" @click="sendMsg" :disabled="sending">{{ sendTime }}</button>
|
||||
</view>
|
||||
|
||||
<button class="confirm-btn" @click="toLogin" :disabled="logining">立即绑定</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import listCell from '@/components/com-input';
|
||||
export default {
|
||||
components: {
|
||||
listCell
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
mobile: '',
|
||||
code: '',
|
||||
logining: false,
|
||||
sending: false,
|
||||
sendTime: '获取验证码',
|
||||
count: 60,
|
||||
type: '',
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
if (option.type) {
|
||||
this.type = option.type
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
inputChange(e) {
|
||||
const key = e.currentTarget.dataset.key;
|
||||
this[key] = e.detail.value;
|
||||
},
|
||||
navBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
countDown() {
|
||||
const {
|
||||
count
|
||||
} = this;
|
||||
if (count === 1) {
|
||||
this.count = 60;
|
||||
this.sending = false;
|
||||
this.sendTime = '获取验证码'
|
||||
} else {
|
||||
this.count = count - 1;
|
||||
this.sending = true;
|
||||
this.sendTime = count - 1 + '秒后重新获取';
|
||||
setTimeout(this.countDown.bind(this), 1000);
|
||||
}
|
||||
},
|
||||
sendMsg() {
|
||||
const {
|
||||
mobile
|
||||
} = this;
|
||||
if (!mobile) {
|
||||
this.$queue.showToast("请输入手机号");
|
||||
} else if (mobile.length !== 11) {
|
||||
this.$queue.showToast("请输入正确的手机号");
|
||||
} else {
|
||||
this.$queue.showLoading("正在发送验证码...");
|
||||
this.$Request.getT('/app/Login/sendMsg/' + mobile + '/gzg').then(res => {
|
||||
if (res.code === 0) {
|
||||
this.sending = true;
|
||||
this.$queue.showToast('验证码发送成功请注意查收');
|
||||
this.countDown();
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '短信发送失败',
|
||||
content: res.msg ? res.msg : '请一分钟后再获取验证码'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
toLogin() {
|
||||
const {
|
||||
mobile,
|
||||
code
|
||||
} = this;
|
||||
let userId = this.$queue.getData("userId");
|
||||
if (!mobile) {
|
||||
this.$queue.showToast("请输入手机号");
|
||||
} else if (mobile.length !== 11) {
|
||||
this.$queue.showToast("请输入正确的手机号");
|
||||
} else if (!code) {
|
||||
this.$queue.showToast("请输入验证码");
|
||||
} else {
|
||||
this.$queue.showLoading("正在绑定中...");
|
||||
let openId = this.$queue.getData('openId') ? this.$queue.getData('openId') : '';
|
||||
let openidnickname = this.$queue.getData('openidnickname') ? this.$queue.getData('openidnickname') :
|
||||
'';
|
||||
let openidheadimgurl = this.$queue.getData('openidheadimgurl') ? this.$queue.getData(
|
||||
'openidheadimgurl') : '';
|
||||
let invitation = this.$queue.getData('inviterCode') ? this.$queue.getData('inviterCode') : '';
|
||||
let userId = this.$queue.getData('userId') ? this.$queue.getData('userId') : '';
|
||||
this.$Request.post(`/app/Login/registerCode`, {
|
||||
phone: mobile,
|
||||
wxId: openId,
|
||||
userId: userId,
|
||||
inviterCode: invitation,
|
||||
avatar: openidheadimgurl,
|
||||
userName: openidnickname,
|
||||
msg: code
|
||||
}).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$queue.setData("token", res.token);
|
||||
this.$queue.setData('userId', res.user.userId);
|
||||
this.$queue.setData('userName', res.user.userName);
|
||||
this.$queue.setData('phone', res.user.phone);
|
||||
this.$queue.setData('avatar', res.user.avatar ? res.user.avatar :
|
||||
'../../static/logo.png');
|
||||
this.$queue.showToast('绑定成功');
|
||||
setTimeout(function() {
|
||||
uni.navigateBack()
|
||||
}, 1000)
|
||||
} else {
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '绑定失败',
|
||||
content: res.msg,
|
||||
});
|
||||
}
|
||||
uni.hideLoading();
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
page {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.send-msg {
|
||||
border-radius: 30px;
|
||||
color: white;
|
||||
height: 30px;
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
background: #557EFD;
|
||||
}
|
||||
|
||||
.container1 {
|
||||
top: 0;
|
||||
padding-top: 32upx;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.confirm-btn {
|
||||
width: 600upx;
|
||||
height: 80upx;
|
||||
line-height: 80upx;
|
||||
border-radius: 60upx;
|
||||
margin-top: 32upx;
|
||||
background: #557EFD;
|
||||
color: #ffffff;
|
||||
font-size: 32upx;
|
||||
|
||||
&:after {
|
||||
border-radius: 60px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
235
pages/login/forgetPwd.vue
Normal file
235
pages/login/forgetPwd.vue
Normal file
@@ -0,0 +1,235 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="wrapper">
|
||||
<view class="input-content">
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<view class="title">手机号</view>
|
||||
<input type="number" :value="mobile" placeholder="请输入手机号" maxlength="11" data-key="mobile"
|
||||
@input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<text class="title">验证码</text>
|
||||
<input type="number" :value="code" placeholder="请输入验证码" maxlength="6" data-key="code"
|
||||
@input="inputChange" @confirm="toLogin" />
|
||||
<button class="send-msg" @click="sendMsg" :disabled="sending">{{sendTime}}</button>
|
||||
</view>
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<text class="title">设置密码</text>
|
||||
<input type="password" :value="password" placeholder="请设置新密码" placeholder-class="input-empty"
|
||||
maxlength="20" minlength="6" data-key="password" @input="inputChange" @confirm="toLogin" />
|
||||
</view>
|
||||
</view>
|
||||
<button class="confirm-btn" @click="toLogin">立即重置</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
code: '',
|
||||
mobile: '',
|
||||
password: '',
|
||||
sending: false,
|
||||
sendTime: '获取验证码',
|
||||
count: 60,
|
||||
logining: false
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
sendMsg() {
|
||||
const {
|
||||
mobile
|
||||
} = this;
|
||||
if (!mobile) {
|
||||
uni.showToast({
|
||||
title: '请输入手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else if (mobile.length !== 11) {
|
||||
uni.showToast({
|
||||
title: '请输入正确的手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else {
|
||||
uni.showLoading({
|
||||
title: '正在发送验证码...'
|
||||
})
|
||||
this.$u.get('/app/Login/sendMsg/' + mobile + '/forget').then(res => {
|
||||
if (res.code === 0) {
|
||||
this.sending = true;
|
||||
uni.showToast({
|
||||
title: '验证码发送成功请注意查收',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
this.countDown();
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '短信发送失败',
|
||||
content: res.msg ? res.msg : '请一分钟后再获取验证码'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
countDown() {
|
||||
const {
|
||||
count
|
||||
} = this;
|
||||
if (count === 1) {
|
||||
this.count = 60;
|
||||
this.sending = false;
|
||||
this.sendTime = '获取验证码'
|
||||
} else {
|
||||
this.count = count - 1;
|
||||
this.sending = true;
|
||||
this.sendTime = count - 1 + '秒后重新获取';
|
||||
setTimeout(this.countDown.bind(this), 1000);
|
||||
}
|
||||
},
|
||||
inputChange(e) {
|
||||
const key = e.currentTarget.dataset.key;
|
||||
this[key] = e.detail.value;
|
||||
},
|
||||
navBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
|
||||
|
||||
navTo(url) {
|
||||
uni.navigateTo({
|
||||
url
|
||||
})
|
||||
},
|
||||
toLogin() {
|
||||
const {
|
||||
mobile,
|
||||
password,
|
||||
code
|
||||
} = this;
|
||||
if (!mobile) {
|
||||
// this.$queue.showToast("请输入手机号");
|
||||
uni.showToast({
|
||||
title: '请输入手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else if (!code) {
|
||||
// this.$queue.showToast("密码位数必须大于六位");
|
||||
uni.showToast({
|
||||
title: '请输入验证码',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else if (!password) {
|
||||
// this.$queue.showToast("请设置密码");
|
||||
uni.showToast({
|
||||
title: '请输入密码',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else {
|
||||
this.logining = true;
|
||||
// this.$queue.showLoading("正在修改密码中...");
|
||||
uni.showLoading({
|
||||
title: '正在修改密码中...'
|
||||
})
|
||||
this.$u.post('/app/Login/forgetPwd?pwd=' + password + '&phone=' + mobile + '&msg=' + code).then(
|
||||
res => {
|
||||
// this.$Request.postJson("/appLogin/forgetPwd",{
|
||||
// pwd: password,
|
||||
// phone: mobile,
|
||||
// msg: code
|
||||
// }).then(res => {
|
||||
uni.hideLoading();
|
||||
if (res.code === 0) {
|
||||
uni.showToast({
|
||||
title: '密码找回成功',
|
||||
icon: 'none'
|
||||
});
|
||||
setTimeout(function() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/login'
|
||||
});
|
||||
}, 1000)
|
||||
|
||||
} else {
|
||||
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '密码找回失败',
|
||||
content: res.msg,
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
page {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.send-msg {
|
||||
border-radius: 30px;
|
||||
color: white;
|
||||
height: 30px;
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
background: #ff7581;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding-top: 32upx;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
z-index: 90;
|
||||
background: #ffffff;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
|
||||
.input-content {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.confirm-btn {
|
||||
width: 300px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
border-radius: 30px;
|
||||
margin-top: 40px;
|
||||
background: #ff7581;
|
||||
/* background: linear-gradient(to left, #3a55b9 0, #5074FF 100%); */
|
||||
color: #ffffff;
|
||||
font-size: 32rpx;
|
||||
|
||||
&:after {
|
||||
border-radius: 60px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
326
pages/login/iosmobile.vue
Normal file
326
pages/login/iosmobile.vue
Normal file
@@ -0,0 +1,326 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="wrapper">
|
||||
<view class="input-content">
|
||||
<view class="cu-form-group" style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;">
|
||||
<view class="title text-black">手机号</view>
|
||||
<input type="number" :value="phone" placeholder="请输入手机号" maxlength="11" data-key="phone"
|
||||
@input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group padding-right-xs"
|
||||
style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;">
|
||||
<text class="title text-black">验证码</text>
|
||||
<input type="number" :value="code" placeholder="请输入验证码" maxlength="6" data-key="code"
|
||||
@input="inputChange" @confirm="startReg" />
|
||||
<button class="send-msg" @click="sendMsg" :disabled="sending">{{ sendTime }}</button>
|
||||
</view>
|
||||
|
||||
<view class="cu-form-group" style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;">
|
||||
<text class="title text-black">设置密码</text>
|
||||
<input type="password" :value="password" placeholder="请设置密码" placeholder-class="input-empty"
|
||||
maxlength="20" minlength="6" data-key="password" @input="inputChange" @confirm="startReg" />
|
||||
</view>
|
||||
<view class="cu-form-group" style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;"
|
||||
v-if="required == '是'">
|
||||
<text class="title text-black">邀请码</text>
|
||||
<input type="" maxlength="6" :value="invitation" placeholder="请填写邀请码(必填)" data-key="invitation"
|
||||
@input="inputChange" @confirm="startReg" />
|
||||
</view>
|
||||
<view class="cu-form-group" style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;"
|
||||
v-if="required == '否'">
|
||||
<text class="title text-black">邀请码</text>
|
||||
<input type="" maxlength="6" :value="invitation" placeholder="请填写邀请码(选填)" data-key="invitation"
|
||||
@input="inputChange" @confirm="startReg" />
|
||||
</view>
|
||||
</view>
|
||||
<button class="confirm-btn" @click="startReg">立即注册</button>
|
||||
<view class="footer">
|
||||
<text @tap="isShowAgree" class="cuIcon"
|
||||
:class="showAgree ? 'cuIcon-radiobox' : 'cuIcon-round'">同意</text>
|
||||
<!-- 协议地址 -->
|
||||
<navigator url="/me/setting/mimi" open-type="navigate">《隐私政策》</navigator>
|
||||
和
|
||||
<navigator url="/me/setting/xieyi" open-type="navigate">《用户服务协议》</navigator>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
var _this;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userName: '',
|
||||
showAgree: false,
|
||||
code: '',
|
||||
phone: '',
|
||||
password: '',
|
||||
required: '否',
|
||||
sending: false,
|
||||
sendTime: '获取验证码',
|
||||
count: 60,
|
||||
relation: "",
|
||||
state: '',
|
||||
invitation: '',
|
||||
platform: 'app',
|
||||
sysPhone: 1
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
let a = this.$queue.getData("isEnable")
|
||||
if (a) {
|
||||
this.isEnable = a;
|
||||
}
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
switch (uni.getSystemInfoSync().platform) {
|
||||
case 'android':
|
||||
break;
|
||||
case 'ios':
|
||||
this.sysPhone = 2;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
|
||||
mounted() {
|
||||
_this = this;
|
||||
},
|
||||
methods: {
|
||||
showMa() {
|
||||
//查询官方邀请码
|
||||
this.$Request.getT('/app/common/type/4').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.invitationCode = res.data.value;
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
// 注册邀请码必填
|
||||
invitationMa() {
|
||||
this.$Request.getT('/app/common/type/3').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.required = res.data.value;
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
inputChange(e) {
|
||||
const key = e.currentTarget.dataset.key;
|
||||
this[key] = e.detail.value;
|
||||
},
|
||||
navBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
countDown() {
|
||||
const {
|
||||
count
|
||||
} = this;
|
||||
if (count === 1) {
|
||||
this.count = 60;
|
||||
this.sending = false;
|
||||
this.sendTime = '获取验证码';
|
||||
} else {
|
||||
this.count = count - 1;
|
||||
this.sending = true;
|
||||
this.sendTime = count - 1 + '秒后重新获取';
|
||||
setTimeout(this.countDown.bind(this), 1000);
|
||||
}
|
||||
},
|
||||
sendMsg() {
|
||||
const {
|
||||
phone
|
||||
} = this;
|
||||
if (!phone) {
|
||||
this.$queue.showToast("请输入手机号");
|
||||
} else if (phone.length !== 11) {
|
||||
this.$queue.showToast("请输入正确的手机号");
|
||||
} else {
|
||||
this.$queue.showLoading("正在发送验证码...");
|
||||
this.$Request.getT("/app/Login/sendMsg/" + phone + "/bindIos").then(res => {
|
||||
if (res.code === 0) {
|
||||
this.sending = true;
|
||||
this.$queue.showToast('验证码发送成功请注意查收');
|
||||
this.countDown();
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
console.log(JSON.stringify(res))
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '短信发送失败',
|
||||
content: res.msg ? res.msg : '请一分钟后再获取验证码',
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
isShowAgree() {
|
||||
//是否选择协议
|
||||
_this.showAgree = !_this.showAgree;
|
||||
},
|
||||
startReg() {
|
||||
if (this.phone.length != 11) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
position: 'bottom',
|
||||
title: '手机号不正确'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.code.length != 6) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
position: 'bottom',
|
||||
title: '验证码不正确'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.password) {
|
||||
this.$queue.showToast('请设置密码');
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.password.length < 6) {
|
||||
this.$queue.showToast('密码位数必须大于六位');
|
||||
return false;
|
||||
}
|
||||
if (!_this.invitation && this.required == '是') {
|
||||
this.$queue.showToast('请填写邀请码');
|
||||
return false;
|
||||
}
|
||||
this.$queue.showLoading('登陆中...')
|
||||
_this.isRotate = true;
|
||||
console.error(_this.$queue.getData('appleId'))
|
||||
let qdCodeion = '';
|
||||
if (uni.getStorageSync('qdCodeion')) {
|
||||
qdCodeion = uni.getStorageSync('qdCodeion')
|
||||
}
|
||||
this.$Request.postT("/app/Login/iosBindMobile", {
|
||||
password: _this.password,
|
||||
phone: _this.phone,
|
||||
code: _this.code,
|
||||
inviterCode: _this.invitation,
|
||||
qdCode: qdCodeion,
|
||||
platform: 'app',
|
||||
sysPhone: _this.sysPhone,
|
||||
appleId: _this.$queue.getData("appleId")
|
||||
}).then(res => {
|
||||
console.log(JSON.stringify(res))
|
||||
if (res.code === 0) {
|
||||
this.$queue.setData("mobile", _this.phone);
|
||||
this.$queue.setData("token", res.token);
|
||||
this.$queue.setData("userId", res.user.userId);
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
} else {
|
||||
_this.isRotate = false;
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '绑定失败',
|
||||
content: res.msg,
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
getUserInfo(userId, token) {
|
||||
this.$Request.get("/app/user/selectUserById").then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.setStorageSync('token', token)
|
||||
uni.setStorageSync('userId', res.data.userId)
|
||||
uni.setStorageSync('avatar', res.data.avatar)
|
||||
uni.setStorageSync('invitationCode', res.data.invitationCode)
|
||||
uni.setStorageSync('zhiFuBao', res.data.zhiFuBao)
|
||||
uni.setStorageSync('zhiFuBaoName', res.data.zhiFuBaoName)
|
||||
this.$Request.get("/app/UserVip/isUserVip").then(res => {
|
||||
if (res.code == 0 && res.data && res.data.isVip == 2) {
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
});
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
} else {
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '登录失败',
|
||||
content: res.msg
|
||||
});
|
||||
this.$queue.logout();
|
||||
}
|
||||
uni.hideLoading();
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
page {
|
||||
height: 100%;
|
||||
background: #FFFFFF !important;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding-left: 140upx;
|
||||
margin-top: 32upx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.send-msg {
|
||||
border-radius: 30px;
|
||||
color: white;
|
||||
height: 30px;
|
||||
font-size: 10px;
|
||||
line-height: 30px;
|
||||
background: #5E81F9;
|
||||
}
|
||||
|
||||
|
||||
.container {
|
||||
padding-top: 32upx;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
z-index: 90;
|
||||
background: #FFFFFF;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
|
||||
.input-content {
|
||||
padding: 32upx 80upx;
|
||||
}
|
||||
|
||||
|
||||
.confirm-btn {
|
||||
width: 600upx;
|
||||
height: 80upx;
|
||||
line-height: 80upx;
|
||||
border-radius: 60upx;
|
||||
margin-top: 32upx;
|
||||
background: #5E81F9;
|
||||
|
||||
color: #fff;
|
||||
font-size: 32upx;
|
||||
|
||||
&:after {
|
||||
border-radius: 60px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
1290
pages/login/login.vue
Normal file
1290
pages/login/login.vue
Normal file
File diff suppressed because it is too large
Load Diff
620
pages/login/loginPhone.vue
Normal file
620
pages/login/loginPhone.vue
Normal file
@@ -0,0 +1,620 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<!-- 小程序状态下登录 -->
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view class="mp_wxBox">
|
||||
<view>
|
||||
<view class="headers">
|
||||
<image src="../../static/images/logo.png" style="border-radius: 50%;"></image>
|
||||
</view>
|
||||
<view class="content">
|
||||
<view>申请获取以下权限</view>
|
||||
<text>获得你的公开信息(昵称，头像、地区等)</text>
|
||||
</view>
|
||||
<button v-show="weixinPhone" style="background: #ff7581;color: #FFFFFF;" class="bottom"
|
||||
open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
|
||||
授权手机号
|
||||
</button>
|
||||
<button v-show="!weixinPhone" style="background: #ff7581;color: #FFFFFF;" class='bottom'
|
||||
bindtap="getUserProfile" @tap="wxGetUserInfo">
|
||||
授权登录
|
||||
</button>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<view class="wrapper">
|
||||
<view class="input-content">
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<view class="title">手机号</view>
|
||||
<input type="number" :value="mobile" placeholder="请输入手机号" maxlength="11" data-key="mobile"
|
||||
@input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group" style="border: 2upx solid whitesmoke;border-radius: 30px">
|
||||
<view class="title">密
|
||||
<text style="margin-left: 30rpx;">码</text>
|
||||
</view>
|
||||
<input type="password" placeholder="请输入密码" maxlength="20" :value="code" data-key="code"
|
||||
@input="inputChange" @confirm="toLogin" />
|
||||
<text class="send-msg" @click="forget">忘记密码</text>
|
||||
</view>
|
||||
</view>
|
||||
<button class="confirm-btn" @click="toLogin">登录</button>
|
||||
|
||||
<view style="margin-top: 32px;text-align: center">
|
||||
<view>
|
||||
没有账号？
|
||||
<text style="color: #ff7581" @click="register()">立即注册</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
|
||||
<!-- #ifdef MP -->
|
||||
<view class="footer">
|
||||
<u-checkbox-group>
|
||||
<u-checkbox v-model="checked" label-size='24upx' shape="circle" @change="radioChange"></u-checkbox>
|
||||
</u-checkbox-group>
|
||||
<view>同意</view>
|
||||
<!-- 协议地址 -->
|
||||
<navigator url="/me/setting/mimi" open-type="navigate">《隐私政策》</navigator>
|
||||
和
|
||||
<navigator url="/me/setting/xieyi" open-type="navigate">《用户服务协议》</navigator>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
mobile: '',
|
||||
code: '',
|
||||
sessionkey: '',
|
||||
flag: '1',
|
||||
weixinPhone: false,
|
||||
sending: false,
|
||||
sendDataList: {},
|
||||
phone: '',
|
||||
sendTime: '获取验证码',
|
||||
count: 60,
|
||||
checked: false
|
||||
};
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 注册
|
||||
register() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/register'
|
||||
});
|
||||
},
|
||||
// 忘记密码
|
||||
forget() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/forgetPwd'
|
||||
});
|
||||
},
|
||||
inputChange(e) {
|
||||
const key = e.currentTarget.dataset.key;
|
||||
this[key] = e.detail.value;
|
||||
},
|
||||
radioChange(e) {
|
||||
console.log(e);
|
||||
},
|
||||
//第一授权获取用户信息===》按钮触发
|
||||
wxGetUserInfo(e) {
|
||||
let that = this;
|
||||
if (this.checked) {
|
||||
|
||||
|
||||
wx.getUserProfile({
|
||||
desc: '业务需要',
|
||||
success: infoRes => {
|
||||
console.log("infoRes.encryptedData__________:" + JSON.stringify(infoRes.userInfo))
|
||||
let nickName = infoRes.userInfo.nickName; //昵称
|
||||
let avatarUrl = infoRes.userInfo.avatarUrl; //头像
|
||||
let sex = infoRes.userInfo.gender; //头像
|
||||
try {
|
||||
that.login(nickName, avatarUrl, sex);
|
||||
} catch (e) {}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '请同意隐私政策和用户服务协议',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
},
|
||||
//登录
|
||||
login(nickName, avatarUrl, sex) {
|
||||
let that = this;
|
||||
// 1.wx获取登录用户code
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
success: function(loginRes) {
|
||||
let data = {
|
||||
code: loginRes.code
|
||||
}
|
||||
that.$u.api.wxLogin(data).then(res => {
|
||||
if (res.code == 0 && res.data) {
|
||||
uni.setStorageSync('openId', res.data.open_id)
|
||||
uni.setStorageSync('unionId', res.data.unionId)
|
||||
that.sessionkey = res.data.session_key;
|
||||
|
||||
let invitationCode = '';
|
||||
if (uni.getStorageSync('invitation')) {
|
||||
invitationCode = uni.getStorageSync('invitation')
|
||||
}
|
||||
let sendData = {
|
||||
openId: uni.getStorageSync('openId'),
|
||||
unionId: uni.getStorageSync('unionId'),
|
||||
userName: nickName,
|
||||
avatar: avatarUrl,
|
||||
sex: sex, //性别
|
||||
inviterCode: invitationCode //别人登录进来携带你的邀请码
|
||||
};
|
||||
that.sendDataList = sendData;
|
||||
that.flag = res.data.flag;
|
||||
if (that.flag == '1') {
|
||||
that.weixinPhone = true;
|
||||
} else {
|
||||
that.getWeixinInfo(sendData);
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: res.msg,
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
//小程序微信登录后获取手机号
|
||||
getPhoneNumber: function(e) {
|
||||
if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
|
||||
console.log('用户拒绝提供手机号');
|
||||
} else {
|
||||
console.log('用户同意提供手机号');
|
||||
this.setPhoneByInsert(e.detail.encryptedData, e.detail.iv);
|
||||
}
|
||||
},
|
||||
//小程序微信登录后获取手机号
|
||||
setPhoneByInsert(decryptData, iv) {
|
||||
let data = {
|
||||
decryptData: decryptData,
|
||||
key: this.sessionkey,
|
||||
iv: iv
|
||||
};
|
||||
|
||||
this.$u.api.selectPhone(data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.phone = res.data.phoneNumber;
|
||||
this.getWeixinInfo(this.sendDataList);
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
countDown() {
|
||||
const {
|
||||
count
|
||||
} = this;
|
||||
if (count === 1) {
|
||||
this.count = 60;
|
||||
this.sending = false;
|
||||
this.sendTime = '获取验证码'
|
||||
} else {
|
||||
this.count = count - 1;
|
||||
this.sending = true;
|
||||
this.sendTime = count - 1 + '秒后重新获取';
|
||||
setTimeout(this.countDown.bind(this), 1000);
|
||||
}
|
||||
},
|
||||
sendMsg() {
|
||||
const {
|
||||
mobile
|
||||
} = this;
|
||||
console.log(mobile)
|
||||
if (!mobile) {
|
||||
uni.showToast({
|
||||
title: '请输入手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else if (mobile.length !== 11) {
|
||||
uni.showToast({
|
||||
title: '请输入正确的手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else {
|
||||
uni.showLoading({
|
||||
title: '正在发送验证码...'
|
||||
})
|
||||
this.$u.get('/app/Login/sendMsg/' + mobile + '/login').then(res => {
|
||||
// this.$Request.getT('/appLogin/sendMsg/' + mobile + '/bind').then(res => {
|
||||
if (res.code === 0) {
|
||||
this.sending = true;
|
||||
uni.showToast({
|
||||
title: '验证码发送成功请注意查收',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
this.countDown();
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '短信发送失败',
|
||||
content: res.msg ? res.msg : '请一分钟后再获取验证码'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
toLogin() {
|
||||
// this.$queue.loginClear();
|
||||
// let openid = this.$queue.getData('openid');
|
||||
let openid = uni.getStorageSync('openId')
|
||||
const {
|
||||
mobile,
|
||||
code
|
||||
} = this;
|
||||
if (!mobile) {
|
||||
// this.$queue.showToast('请输入手机号');
|
||||
uni.showToast({
|
||||
title: '请输入手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else if (mobile.length != 11) {
|
||||
// this.$queue.showToast('请输入手机号');
|
||||
uni.showToast({
|
||||
title: '请输入正确的手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else if (!code) {
|
||||
// this.$queue.showToast('请输入密码');
|
||||
uni.showToast({
|
||||
title: '请输入密码',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else {
|
||||
uni.showLoading({
|
||||
title: '正在登录中...',
|
||||
})
|
||||
this.$u.post('/app/Login/registerCode?password=' + code + '&phone=' + mobile).then(res => {
|
||||
if (res.code === 0) {
|
||||
uni.setStorageSync('token', res.token)
|
||||
uni.setStorageSync('userId', res.user.userId)
|
||||
uni.setStorageSync('userName', res.user.userName)
|
||||
uni.setStorageSync('avatar', res.user.avatar ? res.user.avatar :
|
||||
'../../static/images/logo.png')
|
||||
uni.setStorageSync('phone', res.user.phone)
|
||||
uni.setStorageSync('invitationCode', res.user.invitationCode)
|
||||
uni.setStorageSync('sex', res.user.sex)
|
||||
uni.setStorageSync('userId', res.user.userId)
|
||||
//设置渠道码
|
||||
if (res.user.qdCode) {
|
||||
uni.setStorageSync('qdCode', res.user.qdCode)
|
||||
}
|
||||
// uni.setStorageSync('openId', res.user.openId)
|
||||
// this.getWeixinInfo(this.sendDataList);
|
||||
uni.showToast({
|
||||
title: '登录成功',
|
||||
icon: 'none'
|
||||
})
|
||||
uni.navigateBack({
|
||||
delta: 2
|
||||
})
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
//获取个人信息
|
||||
getWeixinInfo(sendData) {
|
||||
let that = this;
|
||||
uni.showLoading({
|
||||
title: '登录中...'
|
||||
});
|
||||
let postData = {
|
||||
openId: sendData.openId, //小程序openId
|
||||
unionId: sendData.unionId, //unionId
|
||||
userName: sendData.userName, //微信名称
|
||||
avatar: sendData.avatar, //头像
|
||||
sex: sendData.sex, //性别
|
||||
phone: that.phone,
|
||||
inviterCode: sendData.inviterCode
|
||||
};
|
||||
that.$u.api.insertWxUser(postData).then(res => {
|
||||
uni.hideLoading();
|
||||
if (res.code == 0) {
|
||||
uni.setStorageSync('token', res.token)
|
||||
uni.setStorageSync('userName', res.user.userName)
|
||||
uni.setStorageSync('avatar', res.user.avatar)
|
||||
uni.setStorageSync('phone', res.user.phone)
|
||||
uni.setStorageSync('invitationCode', res.user.invitationCode)
|
||||
uni.setStorageSync('sex', res.user.sex)
|
||||
uni.setStorageSync('userId', res.user.userId)
|
||||
uni.setStorageSync('openId', res.user.openId)
|
||||
let data = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
that.$u.api.userVip(data).then(res => {
|
||||
if (res.code == 0 && res.data && res.data.isVip == 2) {
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
})
|
||||
uni.navigateBack();
|
||||
} else {
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '登录失败',
|
||||
content: res.msg,
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.headers {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.headers>image {
|
||||
width: 400upx;
|
||||
height: 400upx;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding-left: 150rpx;
|
||||
margin-top: 32upx;
|
||||
font-size: 24upx;
|
||||
color: #666666;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
page {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.send-msg {
|
||||
border-radius: 30px;
|
||||
color: black;
|
||||
background: white;
|
||||
height: 30px;
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
}
|
||||
|
||||
.container {
|
||||
top: 0;
|
||||
padding-top: 32upx;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
|
||||
.mp_wxBox {
|
||||
.headers {
|
||||
margin: 35% auto 50rpx;
|
||||
text-align: center;
|
||||
border-radius: 60rpx;
|
||||
width: 650rpx;
|
||||
height: 300rpx;
|
||||
line-height: 450rpx;
|
||||
|
||||
image {
|
||||
width: 300rpx;
|
||||
height: 300rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
text {
|
||||
display: block;
|
||||
color: #9d9d9d;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
line-height: 80upx;
|
||||
border-radius: 80upx;
|
||||
margin: 70rpx 50rpx;
|
||||
height: 80upx;
|
||||
font-size: 35rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
z-index: 90;
|
||||
background: #ffffff;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
// .back-btn {
|
||||
// position: absolute;
|
||||
// left: 20px;
|
||||
// z-index: 9999;
|
||||
// padding-top: var(--status-bar-height);
|
||||
// top: 20px;
|
||||
// font-size: 20px;
|
||||
// color: $font-color-dark;
|
||||
// }
|
||||
|
||||
// .left-top-sign {
|
||||
// font-size: 80px;
|
||||
// color: $page-color-base;
|
||||
// position: relative;
|
||||
// }
|
||||
|
||||
// .right-top-sign {
|
||||
// position: absolute;
|
||||
// top: 40px;
|
||||
// right: -15px;
|
||||
// z-index: 95;
|
||||
|
||||
// &:before,
|
||||
// &:after {
|
||||
// display: block;
|
||||
// content: '';
|
||||
// width: 20px;
|
||||
// height: 40px;
|
||||
// background: #e10a07;
|
||||
// }
|
||||
|
||||
// &:before {
|
||||
// transform: rotate(50deg);
|
||||
// border-radius: 0 50px 0 0;
|
||||
// }
|
||||
|
||||
// &:after {
|
||||
// position: absolute;
|
||||
// right: -198px;
|
||||
// top: 0;
|
||||
// transform: rotate(-50deg);
|
||||
// border-radius: 50px 0 0 0;
|
||||
// /* background: pink; */
|
||||
// }
|
||||
// }
|
||||
|
||||
// .left-bottom-sign {
|
||||
// position: absolute;
|
||||
// left: -270px;
|
||||
// bottom: -320px;
|
||||
// /*border: 100upx solid #d0d1fd;*/
|
||||
// border-radius: 50%;
|
||||
// padding: 90px;
|
||||
// }
|
||||
|
||||
// .welcome {
|
||||
// position: relative;
|
||||
// left: 30px;
|
||||
// top: -55px;
|
||||
// font-size: 28px;
|
||||
// color: #555;
|
||||
// text-shadow: 1px 0px 1px rgba(0, 0, 0, 0.3);
|
||||
// }
|
||||
|
||||
.input-content {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
// .input-item {
|
||||
// display: flex;
|
||||
// flex-direction: column;
|
||||
// align-items: flex-start;
|
||||
// justify-content: center;
|
||||
// padding: 0 30px;
|
||||
// background: $page-color-light;
|
||||
// height: 64px;
|
||||
// border-radius: 4px;
|
||||
// margin-bottom: 30px;
|
||||
|
||||
// &:last-child {
|
||||
// margin-bottom: 0;
|
||||
// }
|
||||
|
||||
// .tit {
|
||||
// height: 30px;
|
||||
// line-height: 28px;
|
||||
// font-size: $font-sm + 2upx;
|
||||
// color: $font-color-base;
|
||||
// }
|
||||
|
||||
// input {
|
||||
// height: 40px;
|
||||
// font-size: $font-base + 2upx;
|
||||
// color: $font-color-dark;
|
||||
// width: 100%;
|
||||
// }
|
||||
// }
|
||||
|
||||
.confirm-btn {
|
||||
width: 300px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
border-radius: 30px;
|
||||
margin-top: 40px;
|
||||
// background: linear-gradient(to left, #3f5ecb 0, #5074FF 100%);
|
||||
background: #ff7581;
|
||||
color: #ffffff;
|
||||
// font-size: $font-lg;
|
||||
|
||||
&:after {
|
||||
border-radius: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
// .confirm-btn1 {
|
||||
// width: 300px;
|
||||
// height: 42px;
|
||||
// line-height: 42px;
|
||||
// border-radius: 30px;
|
||||
// margin-top: 40px;
|
||||
// background: whitesmoke;
|
||||
// color: grey;
|
||||
// font-size: $font-lg;
|
||||
|
||||
// &:after {
|
||||
// border-radius: 60px;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .forget-section {
|
||||
// font-size: $font-sm + 2upx;
|
||||
// color: $font-color-spec;
|
||||
// text-align: center;
|
||||
// margin-top: 40px;
|
||||
// }
|
||||
|
||||
// .register-section {
|
||||
// left: 0;
|
||||
// margin-top: 30px;
|
||||
// bottom: 30px;
|
||||
// width: 100%;
|
||||
// font-size: $font-sm + 2upx;
|
||||
// color: $font-color-base;
|
||||
// text-align: center;
|
||||
|
||||
// text {
|
||||
// color: $font-color-spec;
|
||||
// margin-left: 10px;
|
||||
// }
|
||||
// }
|
||||
</style>
|
||||
305
pages/login/phonebind.vue
Normal file
305
pages/login/phonebind.vue
Normal file
@@ -0,0 +1,305 @@
|
||||
<template>
|
||||
<view class="register">
|
||||
<view class="wrapper">
|
||||
<view class="input-content">
|
||||
<view class="cu-form-group" style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;">
|
||||
<view class="title">手机号</view>
|
||||
<input type="number" :disabled="true" :value="phone" placeholder="请输入手机号" maxlength="11" data-key="phone" @input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group" style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;">
|
||||
<text class="title">设置密码</text>
|
||||
<input type="password" :value="password" placeholder="请设置密码" placeholder-class="input-empty" maxlength="20"
|
||||
minlength="6" data-key="password" @input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group" style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;" v-if="required == '是'">
|
||||
<text class="title">邀请码</text>
|
||||
<input type="number" maxlength="6" :value="invitation" placeholder="请填写邀请码(必填)" data-key="invitation" @input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group" style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;" v-if="required == '否'">
|
||||
<text class="title">邀请码</text>
|
||||
<input type="number" maxlength="6" :value="invitation" placeholder="请填写邀请码(选填)" data-key="invitation" @input="inputChange" />
|
||||
</view>
|
||||
</view>
|
||||
<button class="confirm-btn" @click="startReg">绑定手机号</button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
var _this;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userName: '',
|
||||
showAgree: false,
|
||||
code: '',
|
||||
phone: '',
|
||||
password: '',
|
||||
required: '否',
|
||||
sending: false,
|
||||
sendTime: '获取验证码',
|
||||
count: 60,
|
||||
relation: "",
|
||||
state: '',
|
||||
invitation: '',
|
||||
platform: 'app',
|
||||
sysPhone:1
|
||||
}
|
||||
},
|
||||
onLoad(d) {
|
||||
console.log(d.phone)
|
||||
if(d.phone){
|
||||
this.phone = d.phone;
|
||||
}
|
||||
this.invitationMa();
|
||||
let a = this.$queue.getData("isEnable")
|
||||
if (a) {
|
||||
this.isEnable = a;
|
||||
}
|
||||
// #ifdef APP-PLUS
|
||||
switch (uni.getSystemInfoSync().platform) {
|
||||
case 'android':
|
||||
break;
|
||||
case 'ios':
|
||||
this.sysPhone = 2;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
|
||||
mounted() {
|
||||
_this = this;
|
||||
},
|
||||
methods: {
|
||||
showMa() {
|
||||
//查询官方邀请码
|
||||
this.$Request.getT('/app/common/type/4').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.invitationCode = res.data.value;
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
// 注册邀请码必填
|
||||
invitationMa() {
|
||||
this.$Request.getT('/app/common/type/3').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.required = res.data.value;
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
inputChange(e) {
|
||||
const key = e.currentTarget.dataset.key;
|
||||
this[key] = e.detail.value;
|
||||
},
|
||||
navBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
countDown() {
|
||||
const {
|
||||
count
|
||||
} = this;
|
||||
if (count === 1) {
|
||||
this.count = 60;
|
||||
this.sending = false;
|
||||
this.sendTime = '获取验证码';
|
||||
} else {
|
||||
this.count = count - 1;
|
||||
this.sending = true;
|
||||
this.sendTime = count - 1 + '秒后重新获取';
|
||||
setTimeout(this.countDown.bind(this), 1000);
|
||||
}
|
||||
},
|
||||
sendMsg() {
|
||||
const {
|
||||
phone
|
||||
} = this;
|
||||
if (!phone) {
|
||||
this.$queue.showToast("请输入手机号");
|
||||
} else if (phone.length !== 11) {
|
||||
this.$queue.showToast("请输入正确的手机号");
|
||||
} else {
|
||||
this.$queue.showLoading("正在发送验证码...");
|
||||
this.$Request.getT("/msg/sendMsg/" + phone + "/weixin").then(res => {
|
||||
if (res.code === 0) {
|
||||
this.sending = true;
|
||||
this.$queue.showToast('验证码发送成功请注意查收');
|
||||
this.countDown();
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
console.log(JSON.stringify(res))
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '短信发送失败',
|
||||
content: res.msg ? res.msg : '请一分钟后再获取验证码',
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
isShowAgree() {
|
||||
//是否选择协议
|
||||
_this.showAgree = !_this.showAgree;
|
||||
},
|
||||
startReg() {
|
||||
if (this.phone.length != 11) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
position: 'bottom',
|
||||
title: '手机号不正确'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!this.password) {
|
||||
this.$queue.showToast('请设置密码');
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.password.length < 6) {
|
||||
this.$queue.showToast('密码位数必须大于六位');
|
||||
return false;
|
||||
}
|
||||
|
||||
if (!_this.invitation && this.required == '是') {
|
||||
this.$queue.showToast('请填写邀请码');
|
||||
return false;
|
||||
}
|
||||
this.$queue.showLoading('登陆中...')
|
||||
_this.isRotate = true;
|
||||
let qdCodeion = '';
|
||||
if (uni.getStorageSync('qdCodeion')) {
|
||||
qdCodeion = uni.getStorageSync('qdCodeion')
|
||||
}
|
||||
this.$Request.postT("/app/Login/bindMobile", {
|
||||
password: _this.password,
|
||||
phone: _this.phone,
|
||||
inviterCode: _this.invitation,
|
||||
qdCode: qdCodeion,
|
||||
sysPhone:_this.sysPhone
|
||||
}).then(res => {
|
||||
console.log(JSON.stringify(res))
|
||||
if (res.code === 0) {
|
||||
this.$queue.setData("mobile", _this.phone);
|
||||
this.$queue.setData("token", res.token);
|
||||
this.$queue.setData("userId", res.user.userId);
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
} else {
|
||||
_this.isRotate = false;
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '绑定失败',
|
||||
content: res.msg,
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
getUserInfo(userId, token) {
|
||||
this.$Request.get("/app/user/selectUserById").then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.setStorageSync('token', token)
|
||||
uni.setStorageSync('userId', res.data.userId)
|
||||
uni.setStorageSync('avatar', res.data.avatar)
|
||||
uni.setStorageSync('invitationCode', res.data.invitationCode)
|
||||
uni.setStorageSync('zhiFuBao', res.data.zhiFuBao)
|
||||
uni.setStorageSync('zhiFuBaoName', res.data.zhiFuBaoName)
|
||||
this.$Request.get("/app/UserVip/isUserVip").then(res => {
|
||||
if (res.code == 0 && res.data && res.data.isVip == 2) {
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
});
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
} else {
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '登录失败',
|
||||
content: res.msg
|
||||
});
|
||||
this.$queue.logout();
|
||||
}
|
||||
uni.hideLoading();
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
|
||||
page {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding-left: 140upx;
|
||||
margin-top: 32upx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.send-msg {
|
||||
border-radius: 30px;
|
||||
color: white;
|
||||
height: 30px;
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
background: #5074FF;
|
||||
}
|
||||
|
||||
.send-msgs {
|
||||
border-radius: 30px;
|
||||
color: #999999;
|
||||
height: 30px;
|
||||
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding-top: 32upx;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
z-index: 90;
|
||||
background: #ffffff;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.input-content {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
|
||||
.confirm-btn {
|
||||
width: 300px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
border-radius: 30px;
|
||||
margin-top: 40px;
|
||||
background: #5074FF;
|
||||
color: #ffffff;
|
||||
font-size: 32rpx;
|
||||
|
||||
&:after {
|
||||
border-radius: 60px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
409
pages/login/register.vue
Normal file
409
pages/login/register.vue
Normal file
@@ -0,0 +1,409 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="wrapper">
|
||||
<view class="input-content">
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<view class="title">手机号</view>
|
||||
<input type="number" :value="mobile" placeholder="请输入手机号" maxlength="11" data-key="mobile"
|
||||
@input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<text class="title">验证码</text>
|
||||
<input type="number" :value="code" placeholder="请输入验证码" maxlength="6" data-key="code"
|
||||
@input="inputChange" @confirm="toLogin" />
|
||||
<button class="send-msg" @click="sendMsg" :disabled="sending">{{ sendTime }}</button>
|
||||
</view>
|
||||
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<text class="title">设置密码</text>
|
||||
<input type="password" :value="password" placeholder="请设置新密码" placeholder-class="input-empty"
|
||||
maxlength="20" minlength="6" data-key="password" @input="inputChange" @confirm="toLogin" />
|
||||
</view>
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<text class="title">邀请码</text>
|
||||
<input type="text" v-if="registerCode == '是'" :value="invitation" placeholder="请填写邀请码"
|
||||
data-key="invitation" maxlength="20" @input="inputChange" @confirm="toLogin" />
|
||||
<input type="text" v-if="registerCode == '否'" :value="invitation" placeholder="请填写邀请码(选填)"
|
||||
data-key="invitation" maxlength="20" @input="inputChange" @confirm="toLogin" />
|
||||
</view>
|
||||
</view>
|
||||
<button class="confirm-btn" @click="toLogin">立即注册</button>
|
||||
<view class="footer">
|
||||
<text @tap="isShowAgree" class="cuIcon"
|
||||
:class="showAgree ? 'cuIcon-radiobox' : 'cuIcon-round'">同意</text>
|
||||
<!-- 协议地址 -->
|
||||
<navigator url="/me/setting/mimi" open-type="navigate">《隐私政策》</navigator>
|
||||
和
|
||||
<navigator url="/me/setting/xieyi" open-type="navigate">《用户协议》</navigator>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
showAgree: false,
|
||||
code: '',
|
||||
mobile: '',
|
||||
password: '',
|
||||
sending: false,
|
||||
sendTime: '获取验证码',
|
||||
count: 60,
|
||||
relation: "",
|
||||
invitation: '',
|
||||
registerCode: '',
|
||||
qdCodeion: '', //渠道码
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
if (uni.getStorageSync('qdCodeion')) {
|
||||
this.qdCodeion = uni.getStorageSync('qdCodeion')
|
||||
}
|
||||
let relation = uni.getStorageSync('invitation')
|
||||
if (relation) {
|
||||
this.relation = relation;
|
||||
this.invitation = relation;
|
||||
}
|
||||
this.$u.get('/app/common/type/3').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.registerCode = res.data.value
|
||||
}
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
isShowAgree() {
|
||||
//是否选择协议
|
||||
this.showAgree = !this.showAgree;
|
||||
},
|
||||
showMa() {
|
||||
//查询官方邀请码
|
||||
this.$Request.getT('/common/type/88').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.invitation = res.data.value;
|
||||
}
|
||||
});
|
||||
},
|
||||
sendMsg() {
|
||||
const {
|
||||
mobile
|
||||
} = this;
|
||||
if (!mobile) {
|
||||
uni.showToast({
|
||||
title: '请输入手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else if (mobile.length !== 11) {
|
||||
uni.showToast({
|
||||
title: '请输入正确的手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else {
|
||||
uni.showLoading({
|
||||
title: '正在发送验证码...'
|
||||
})
|
||||
this.$u.get('/app/Login/sendMsg/' + mobile + '/login').then(res => {
|
||||
if (res.code === 0) {
|
||||
this.sending = true;
|
||||
uni.showToast({
|
||||
title: '验证码发送成功请注意查收',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
this.countDown();
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '短信发送失败',
|
||||
content: res.msg ? res.msg : '请一分钟后再获取验证码'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
countDown() {
|
||||
const {
|
||||
count
|
||||
} = this;
|
||||
if (count === 1) {
|
||||
this.count = 60;
|
||||
this.sending = false;
|
||||
this.sendTime = '获取验证码';
|
||||
} else {
|
||||
this.count = count - 1;
|
||||
this.sending = true;
|
||||
this.sendTime = count - 1 + '秒后重新获取';
|
||||
setTimeout(this.countDown.bind(this), 1000);
|
||||
}
|
||||
},
|
||||
inputChange(e) {
|
||||
const key = e.currentTarget.dataset.key;
|
||||
this[key] = e.detail.value;
|
||||
},
|
||||
navBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
|
||||
navTo(url) {
|
||||
uni.navigateTo({
|
||||
url
|
||||
});
|
||||
},
|
||||
toLogin() {
|
||||
const {
|
||||
mobile,
|
||||
password,
|
||||
code,
|
||||
showAgree,
|
||||
invitation,
|
||||
registerCode,
|
||||
qdCodeion
|
||||
} = this;
|
||||
if (!mobile) {
|
||||
uni.showToast({
|
||||
title: '请输入账号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!code) {
|
||||
uni.showToast({
|
||||
title: '请输入验证码',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!password) {
|
||||
uni.showToast({
|
||||
title: '请设置密码',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (password.length < 6) {
|
||||
uni.showToast({
|
||||
title: '密码位数必须大于六位',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (invitation.length == 0 && registerCode == '是') {
|
||||
uni.showToast({
|
||||
title: '请输入邀请码',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!showAgree) {
|
||||
uni.showToast({
|
||||
title: '请先同意《隐私政策》和《用户协议》',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
this.logining = true;
|
||||
uni.showLoading({
|
||||
title: '注册中...'
|
||||
})
|
||||
let platform = ''
|
||||
// #ifdef APP
|
||||
platform = 'app'
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
platform = 'h5'
|
||||
// #endif
|
||||
this.$u.post('/app/Login/registerCode?password=' + password + '&phone=' + mobile + '&msg=' + code +
|
||||
'&inviterCode=' + invitation + '&platform=' + platform + '&qdCode=' + qdCodeion).then(res => {
|
||||
if (res.code === 0) {
|
||||
// this.$queue.remove('invitation');
|
||||
uni.setStorageSync('token', res.token)
|
||||
uni.setStorageSync('userId', res.user.userId)
|
||||
uni.setStorageSync('phone', res.user.phone)
|
||||
uni.setStorageSync('invitationCode', res.user.invitationCode)
|
||||
//设置渠道码
|
||||
if (res.user.qdCod) {
|
||||
uni.setStorageSync('qdCod', res.user.qdCod)
|
||||
}
|
||||
|
||||
uni.showToast({
|
||||
title: '注册成功',
|
||||
icon: 'none'
|
||||
})
|
||||
setTimeout(function() {
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
}, 1000)
|
||||
// this.getUserInfo(res.userId, res.token);
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '注册失败',
|
||||
content: res.msg
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
getUserInfo(userId, token) {
|
||||
this.$u.api.userinfo().then(res => {
|
||||
if (res.code === 0) {
|
||||
// #ifdef APP-PLUS
|
||||
if (uni.getSystemInfoSync().platform == "android") {
|
||||
let clientid = plus.push.getClientInfo().clientid;
|
||||
this.$Request.postT('/appLogin/updateClientId?clientId=' + clientid + '&userId=' +
|
||||
userId).then(res => {
|
||||
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
uni.setStorageSync('image_url', res.data.imageUrl ? res.data.imageUrl :
|
||||
'/static/img/common/logo.jpg')
|
||||
uni.setStorageSync('relation_id', res.data.relationId)
|
||||
uni.setStorageSync('relation', res.data.invitationCode)
|
||||
uni.setStorageSync('grade', res.data.grade)
|
||||
uni.setStorageSync('phone', res.data.phone)
|
||||
uni.setStorageSync('token', res.token)
|
||||
uni.setStorageSync('userId', res.data.userId)
|
||||
uni.setStorageSync('isInvitation', res.data.isInvitation)
|
||||
uni.setStorageSync('userName', res.data.userName ? res.data.userName : res.data.phone)
|
||||
|
||||
// this.$queue.setData('image_url', res.data.imageUrl ? res.data.imageUrl : '/static/img/common/logo.jpg');
|
||||
// this.$queue.setData('relation_id', res.data.relationId);
|
||||
// this.$queue.setData('relation', res.data.invitationCode);
|
||||
// this.$queue.setData('grade', res.data.grade);
|
||||
// this.$queue.setData('mobile', res.data.mobile);
|
||||
// this.$queue.setData('isInvitation', res.data.isInvitation);
|
||||
// this.$queue.setData('nickName', res.data.nickName ? res.data.nickName : res.data.phone);
|
||||
// this.$queue.setData('gender', parseInt(res.data.gender));
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
} else {
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '登录失败',
|
||||
content: res.msg
|
||||
});
|
||||
this.$queue.logout();
|
||||
}
|
||||
uni.hideLoading();
|
||||
})
|
||||
// this.$Request.postJson('/app/selectUserById?userId=' + userId).then(res => {
|
||||
// if (res.code === 0) {
|
||||
// // #ifdef APP-PLUS
|
||||
// if (uni.getSystemInfoSync().platform == "android") {
|
||||
// let clientid = plus.push.getClientInfo().clientid;
|
||||
// this.$Request.postT('/appLogin/updateClientId?clientId=' + clientid + '&userId=' + userId).then(res => {
|
||||
|
||||
// });
|
||||
// }
|
||||
// // #endif
|
||||
// this.$queue.setData('image_url', res.data.imageUrl ? res.data.imageUrl : '/static/img/common/logo.jpg');
|
||||
// this.$queue.setData('relation_id', res.data.relationId);
|
||||
// this.$queue.setData('relation', res.data.invitationCode);
|
||||
// this.$queue.setData('grade', res.data.grade);
|
||||
// this.$queue.setData('mobile', res.data.mobile);
|
||||
// this.$queue.setData('isInvitation', res.data.isInvitation);
|
||||
// this.$queue.setData('nickName', res.data.nickName ? res.data.nickName : res.data.phone);
|
||||
// this.$queue.setData('gender', parseInt(res.data.gender));
|
||||
// uni.switchTab({
|
||||
// url: '/pages/index/index'
|
||||
// });
|
||||
// } else {
|
||||
// uni.showModal({
|
||||
// showCancel: false,
|
||||
// title: '登录失败',
|
||||
// content: res.msg
|
||||
// });
|
||||
// this.$queue.logout();
|
||||
// }
|
||||
// uni.hideLoading();
|
||||
// });
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding-left: 140upx;
|
||||
margin-top: 32upx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.send-msg {
|
||||
border-radius: 30px;
|
||||
color: white;
|
||||
height: 30px;
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
background: #ff7581;
|
||||
}
|
||||
|
||||
.send-msgs {
|
||||
border-radius: 30px;
|
||||
color: #999999;
|
||||
height: 30px;
|
||||
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding-top: 32upx;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
z-index: 90;
|
||||
background: #ffffff;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.input-content {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
|
||||
.confirm-btn {
|
||||
width: 300px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
border-radius: 30px;
|
||||
margin-top: 40px;
|
||||
background: #ff7581;
|
||||
color: #ffffff;
|
||||
font-size: 32rpx;
|
||||
|
||||
&:after {
|
||||
border-radius: 60px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
407
pages/login/registerApp.vue
Normal file
407
pages/login/registerApp.vue
Normal file
@@ -0,0 +1,407 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="wrapper">
|
||||
<view class="input-content">
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<view class="title">手机号</view>
|
||||
<input type="number" :value="mobile" placeholder="请输入手机号" maxlength="11" data-key="mobile"
|
||||
@input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<text class="title">验证码</text>
|
||||
<input type="number" :value="code" placeholder="请输入验证码" maxlength="6" data-key="code"
|
||||
@input="inputChange" @confirm="toLogin" />
|
||||
<button class="send-msg" @click="sendMsg" :disabled="sending">{{ sendTime }}</button>
|
||||
</view>
|
||||
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<text class="title">设置密码</text>
|
||||
<input type="password" :value="password" placeholder="请设置新密码" placeholder-class="input-empty"
|
||||
maxlength="20" minlength="6" data-key="password" @input="inputChange" @confirm="toLogin" />
|
||||
</view>
|
||||
<view class="cu-form-group"
|
||||
style="border: 2upx solid whitesmoke;margin-bottom: 20px;border-radius: 30px">
|
||||
<text class="title">邀请码</text>
|
||||
<input type="text" v-if="registerCode == '是'" :value="invitation" placeholder="请填写邀请码"
|
||||
data-key="invitation" maxlength="20" @input="inputChange" @confirm="toLogin" />
|
||||
<input type="text" v-if="registerCode == '否'" :value="invitation" placeholder="请填写邀请码(选填)"
|
||||
data-key="invitation" maxlength="20" @input="inputChange" @confirm="toLogin" />
|
||||
</view>
|
||||
</view>
|
||||
<button class="confirm-btn" @click="toLogin">立即注册</button>
|
||||
<view class="footer">
|
||||
<text @tap="isShowAgree" class="cuIcon"
|
||||
:class="showAgree ? 'cuIcon-radiobox' : 'cuIcon-round'">同意</text>
|
||||
<!-- 协议地址 -->
|
||||
<navigator url="/me/setting/mimi" open-type="navigate">《隐私政策》</navigator>
|
||||
和
|
||||
<navigator url="/me/setting/xieyi" open-type="navigate">《用户协议》</navigator>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
showAgree: false,
|
||||
code: '',
|
||||
mobile: '',
|
||||
password: '',
|
||||
sending: false,
|
||||
sendTime: '获取验证码',
|
||||
count: 60,
|
||||
relation: "",
|
||||
invitation: '',
|
||||
registerCode: '',
|
||||
qdCodeion: '',
|
||||
};
|
||||
},
|
||||
onLoad(e) {
|
||||
let relation = e.invitation
|
||||
if (relation) {
|
||||
this.relation = relation;
|
||||
this.invitation = relation;
|
||||
}
|
||||
if (e.qdCode) {
|
||||
this.qdCodeion = e.qdCode
|
||||
}
|
||||
this.$u.get('/app/common/type/3').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.registerCode = res.data.value
|
||||
}
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
isShowAgree() {
|
||||
//是否选择协议
|
||||
this.showAgree = !this.showAgree;
|
||||
},
|
||||
showMa() {
|
||||
//查询官方邀请码
|
||||
this.$Request.getT('/common/type/88').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.invitation = res.data.value;
|
||||
}
|
||||
});
|
||||
},
|
||||
sendMsg() {
|
||||
const {
|
||||
mobile
|
||||
} = this;
|
||||
if (!mobile) {
|
||||
uni.showToast({
|
||||
title: '请输入手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else if (mobile.length !== 11) {
|
||||
uni.showToast({
|
||||
title: '请输入正确的手机号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
} else {
|
||||
uni.showLoading({
|
||||
title: '正在发送验证码...'
|
||||
})
|
||||
this.$u.get('/app/Login/sendMsg/' + mobile + '/login').then(res => {
|
||||
if (res.code === 0) {
|
||||
this.sending = true;
|
||||
uni.showToast({
|
||||
title: '验证码发送成功请注意查收',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
this.countDown();
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '短信发送失败',
|
||||
content: res.msg ? res.msg : '请一分钟后再获取验证码'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
countDown() {
|
||||
const {
|
||||
count
|
||||
} = this;
|
||||
if (count === 1) {
|
||||
this.count = 60;
|
||||
this.sending = false;
|
||||
this.sendTime = '获取验证码';
|
||||
} else {
|
||||
this.count = count - 1;
|
||||
this.sending = true;
|
||||
this.sendTime = count - 1 + '秒后重新获取';
|
||||
setTimeout(this.countDown.bind(this), 1000);
|
||||
}
|
||||
},
|
||||
inputChange(e) {
|
||||
const key = e.currentTarget.dataset.key;
|
||||
this[key] = e.detail.value;
|
||||
},
|
||||
navBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
|
||||
navTo(url) {
|
||||
uni.navigateTo({
|
||||
url
|
||||
});
|
||||
},
|
||||
toLogin() {
|
||||
const {
|
||||
mobile,
|
||||
password,
|
||||
code,
|
||||
showAgree,
|
||||
invitation,
|
||||
registerCode,
|
||||
qdCodeion
|
||||
} = this;
|
||||
if (!mobile) {
|
||||
uni.showToast({
|
||||
title: '请输入账号',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!code) {
|
||||
uni.showToast({
|
||||
title: '请输入验证码',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!password) {
|
||||
uni.showToast({
|
||||
title: '请设置密码',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (password.length < 6) {
|
||||
uni.showToast({
|
||||
title: '密码位数必须大于六位',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (invitation.length == 0 && registerCode == '是') {
|
||||
uni.showToast({
|
||||
title: '请输入邀请码',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!showAgree) {
|
||||
uni.showToast({
|
||||
title: '请先同意《隐私政策》和《用户协议》',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
})
|
||||
return
|
||||
}
|
||||
this.logining = true;
|
||||
uni.showLoading({
|
||||
title: '注册中...'
|
||||
})
|
||||
let platform = ''
|
||||
// #ifdef APP
|
||||
platform = 'app'
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
platform = 'h5'
|
||||
// #endif
|
||||
this.$u.post('/app/Login/registerCode?password=' + password + '&phone=' + mobile + '&msg=' + code +
|
||||
'&inviterCode=' + invitation + '&platform=' + platform + '&qdCode=' + qdCodeion).then(res => {
|
||||
if (res.code === 0) {
|
||||
// this.$queue.remove('invitation');
|
||||
uni.setStorageSync('token', res.token)
|
||||
uni.setStorageSync('userId', res.user.userId)
|
||||
uni.setStorageSync('phone', res.user.phone)
|
||||
uni.setStorageSync('invitationCode', res.user.invitationCode)
|
||||
//设置渠道码
|
||||
if (res.user.qdCode) {
|
||||
uni.setStorageSync('qdCode', res.user.qdCode)
|
||||
}
|
||||
uni.showToast({
|
||||
title: '注册成功',
|
||||
icon: 'none'
|
||||
})
|
||||
setTimeout(function() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/appEq'
|
||||
})
|
||||
}, 1000)
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '注册失败',
|
||||
content: res.msg
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
getUserInfo(userId, token) {
|
||||
this.$u.api.userinfo().then(res => {
|
||||
if (res.code === 0) {
|
||||
// #ifdef APP-PLUS
|
||||
if (uni.getSystemInfoSync().platform == "android") {
|
||||
let clientid = plus.push.getClientInfo().clientid;
|
||||
this.$Request.postT('/appLogin/updateClientId?clientId=' + clientid + '&userId=' +
|
||||
userId).then(res => {
|
||||
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
uni.setStorageSync('image_url', res.data.imageUrl ? res.data.imageUrl :
|
||||
'/static/img/common/logo.jpg')
|
||||
uni.setStorageSync('relation_id', res.data.relationId)
|
||||
uni.setStorageSync('relation', res.data.invitationCode)
|
||||
uni.setStorageSync('grade', res.data.grade)
|
||||
uni.setStorageSync('phone', res.data.phone)
|
||||
uni.setStorageSync('token', res.token)
|
||||
uni.setStorageSync('userId', res.data.userId)
|
||||
uni.setStorageSync('isInvitation', res.data.isInvitation)
|
||||
uni.setStorageSync('userName', res.data.userName ? res.data.userName : res.data.phone)
|
||||
|
||||
// this.$queue.setData('image_url', res.data.imageUrl ? res.data.imageUrl : '/static/img/common/logo.jpg');
|
||||
// this.$queue.setData('relation_id', res.data.relationId);
|
||||
// this.$queue.setData('relation', res.data.invitationCode);
|
||||
// this.$queue.setData('grade', res.data.grade);
|
||||
// this.$queue.setData('mobile', res.data.mobile);
|
||||
// this.$queue.setData('isInvitation', res.data.isInvitation);
|
||||
// this.$queue.setData('nickName', res.data.nickName ? res.data.nickName : res.data.phone);
|
||||
// this.$queue.setData('gender', parseInt(res.data.gender));
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
} else {
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '登录失败',
|
||||
content: res.msg
|
||||
});
|
||||
this.$queue.logout();
|
||||
}
|
||||
uni.hideLoading();
|
||||
})
|
||||
// this.$Request.postJson('/app/selectUserById?userId=' + userId).then(res => {
|
||||
// if (res.code === 0) {
|
||||
// // #ifdef APP-PLUS
|
||||
// if (uni.getSystemInfoSync().platform == "android") {
|
||||
// let clientid = plus.push.getClientInfo().clientid;
|
||||
// this.$Request.postT('/appLogin/updateClientId?clientId=' + clientid + '&userId=' + userId).then(res => {
|
||||
|
||||
// });
|
||||
// }
|
||||
// // #endif
|
||||
// this.$queue.setData('image_url', res.data.imageUrl ? res.data.imageUrl : '/static/img/common/logo.jpg');
|
||||
// this.$queue.setData('relation_id', res.data.relationId);
|
||||
// this.$queue.setData('relation', res.data.invitationCode);
|
||||
// this.$queue.setData('grade', res.data.grade);
|
||||
// this.$queue.setData('mobile', res.data.mobile);
|
||||
// this.$queue.setData('isInvitation', res.data.isInvitation);
|
||||
// this.$queue.setData('nickName', res.data.nickName ? res.data.nickName : res.data.phone);
|
||||
// this.$queue.setData('gender', parseInt(res.data.gender));
|
||||
// uni.switchTab({
|
||||
// url: '/pages/index/index'
|
||||
// });
|
||||
// } else {
|
||||
// uni.showModal({
|
||||
// showCancel: false,
|
||||
// title: '登录失败',
|
||||
// content: res.msg
|
||||
// });
|
||||
// this.$queue.logout();
|
||||
// }
|
||||
// uni.hideLoading();
|
||||
// });
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding-left: 140upx;
|
||||
margin-top: 32upx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.send-msg {
|
||||
border-radius: 30px;
|
||||
color: white;
|
||||
height: 30px;
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
background: #5074FF;
|
||||
}
|
||||
|
||||
.send-msgs {
|
||||
border-radius: 30px;
|
||||
color: #999999;
|
||||
height: 30px;
|
||||
|
||||
font-size: 14px;
|
||||
line-height: 30px;
|
||||
background: white;
|
||||
}
|
||||
|
||||
.container {
|
||||
padding-top: 32upx;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
z-index: 90;
|
||||
background: #fff;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.input-content {
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
|
||||
.confirm-btn {
|
||||
width: 300px;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
border-radius: 30px;
|
||||
margin-top: 40px;
|
||||
background: #5074FF;
|
||||
color: #fff;
|
||||
font-size: 32rpx;
|
||||
|
||||
&:after {
|
||||
border-radius: 60px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
334
pages/login/wxmobile.vue
Normal file
334
pages/login/wxmobile.vue
Normal file
@@ -0,0 +1,334 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="wrapper">
|
||||
<view class="input-content">
|
||||
<view class="cu-form-group"
|
||||
style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;">
|
||||
<view class="title text-black">手机号</view>
|
||||
<input type="number" :value="phone" placeholder="请输入手机号" maxlength="11" data-key="phone"
|
||||
@input="inputChange" />
|
||||
</view>
|
||||
<view class="cu-form-group padding-right-xs"
|
||||
style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;">
|
||||
<text class="title text-black">验证码</text>
|
||||
<input type="number" :value="code" placeholder="请输入验证码" maxlength="6" data-key="code"
|
||||
@input="inputChange" @confirm="startReg" />
|
||||
<button class="send-msg" @click="sendMsg" :disabled="sending">{{ sendTime }}</button>
|
||||
</view>
|
||||
|
||||
<view class="cu-form-group"
|
||||
style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;">
|
||||
<text class="title text-black">设置密码</text>
|
||||
<input type="password" :value="password" placeholder="请设置密码" placeholder-class="input-empty"
|
||||
maxlength="20" minlength="6" data-key="password" @input="inputChange" @confirm="startReg" />
|
||||
</view>
|
||||
<view class="cu-form-group"
|
||||
style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;"
|
||||
v-if="required == '是'">
|
||||
<text class="title text-black">邀请码</text>
|
||||
<input type="" maxlength="6" :value="invitation" placeholder="请填写邀请码(必填)" data-key="invitation"
|
||||
@input="inputChange" @confirm="startReg" />
|
||||
</view>
|
||||
<view class="cu-form-group"
|
||||
style="border-bottom: 2upx solid whitesmoke;margin-bottom: 20px;"
|
||||
v-if="required == '否'">
|
||||
<text class="title text-black">邀请码</text>
|
||||
<input type="" maxlength="6" :value="invitation" placeholder="请填写邀请码(选填)" data-key="invitation"
|
||||
@input="inputChange" @confirm="startReg" />
|
||||
</view>
|
||||
</view>
|
||||
<button class="confirm-btn" @click="startReg">立即注册</button>
|
||||
<view class="footer">
|
||||
<text @tap="isShowAgree" class="cuIcon"
|
||||
:class="showAgree ? 'cuIcon-radiobox' : 'cuIcon-round'">同意</text>
|
||||
<!-- 协议地址 -->
|
||||
<navigator url="/me/setting/mimi" open-type="navigate">《隐私政策》</navigator>
|
||||
和
|
||||
<navigator url="/me/setting/xieyi" open-type="navigate">《用户服务协议》</navigator>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script>
|
||||
var _this;
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userName: '',
|
||||
showAgree: false,
|
||||
code: '',
|
||||
phone: '',
|
||||
password: '',
|
||||
required: '否',
|
||||
sending: false,
|
||||
sendTime: '获取验证码',
|
||||
count: 60,
|
||||
relation: "",
|
||||
state: '',
|
||||
invitation: '',
|
||||
platform: 'app',
|
||||
sysPhone:1
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
let a = this.$queue.getData("isEnable")
|
||||
if (a) {
|
||||
this.isEnable = a;
|
||||
}
|
||||
this.invitationMa();
|
||||
// #ifdef APP-PLUS
|
||||
switch (uni.getSystemInfoSync().platform) {
|
||||
case 'android':
|
||||
break;
|
||||
case 'ios':
|
||||
this.sysPhone = 2;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
|
||||
mounted() {
|
||||
_this = this;
|
||||
},
|
||||
methods: {
|
||||
showMa() {
|
||||
//查询官方邀请码
|
||||
this.$Request.getT('/app/common/type/4').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.invitationCode = res.data.value;
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
// 注册邀请码必填
|
||||
invitationMa() {
|
||||
this.$Request.getT('/app/common/type/3').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.required = res.data.value;
|
||||
|
||||
}
|
||||
});
|
||||
},
|
||||
inputChange(e) {
|
||||
const key = e.currentTarget.dataset.key;
|
||||
this[key] = e.detail.value;
|
||||
},
|
||||
navBack() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
countDown() {
|
||||
const {
|
||||
count
|
||||
} = this;
|
||||
if (count === 1) {
|
||||
this.count = 60;
|
||||
this.sending = false;
|
||||
this.sendTime = '获取验证码';
|
||||
} else {
|
||||
this.count = count - 1;
|
||||
this.sending = true;
|
||||
this.sendTime = count - 1 + '秒后重新获取';
|
||||
setTimeout(this.countDown.bind(this), 1000);
|
||||
}
|
||||
},
|
||||
sendMsg() {
|
||||
const {
|
||||
phone
|
||||
} = this;
|
||||
if (!phone) {
|
||||
this.$queue.showToast("请输入手机号");
|
||||
} else if (phone.length !== 11) {
|
||||
this.$queue.showToast("请输入正确的手机号");
|
||||
} else {
|
||||
this.$queue.showLoading("正在发送验证码...");
|
||||
this.$Request.getT("/app/Login/sendMsg/" + phone + "/bindWx").then(res => {
|
||||
if (res.code === 0) {
|
||||
this.sending = true;
|
||||
this.$queue.showToast('验证码发送成功请注意查收');
|
||||
this.countDown();
|
||||
uni.hideLoading();
|
||||
} else {
|
||||
console.log(JSON.stringify(res))
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '短信发送失败',
|
||||
content: res.msg ? res.msg : '请一分钟后再获取验证码',
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
isShowAgree() {
|
||||
//是否选择协议
|
||||
_this.showAgree = !_this.showAgree;
|
||||
},
|
||||
startReg() {
|
||||
if (this.phone.length != 11) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
position: 'bottom',
|
||||
title: '手机号不正确'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.code.length != 6) {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
position: 'bottom',
|
||||
title: '验证码不正确'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (!this.password) {
|
||||
this.$queue.showToast('请设置密码');
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.password.length < 6) {
|
||||
this.$queue.showToast('密码位数必须大于六位');
|
||||
return false;
|
||||
}
|
||||
if (!_this.invitation && this.required == '是') {
|
||||
this.$queue.showToast('请填写邀请码');
|
||||
return false;
|
||||
}
|
||||
this.$queue.showLoading('登陆中...')
|
||||
_this.isRotate = true;
|
||||
let qdCodeion = '';
|
||||
if (uni.getStorageSync('qdCodeion')) {
|
||||
qdCodeion = uni.getStorageSync('qdCodeion')
|
||||
}
|
||||
console.error(_this.$queue.getData('weixinToken'))
|
||||
console.error(_this.$queue.getData('unionid'))
|
||||
console.error(_this.$queue.getData('weixinOpenid'))
|
||||
this.$Request.postT("/app/Login/wxBindMobile", {
|
||||
password: _this.password,
|
||||
phone: _this.phone,
|
||||
code: _this.code,
|
||||
platform: _this.platform,
|
||||
inviterCode: _this.invitation,
|
||||
qdCode: qdCodeion,
|
||||
sysPhone:_this.sysPhone,
|
||||
token: _this.$queue.getData('weixinToken'),
|
||||
unionid: _this.$queue.getData('unionid'),
|
||||
wxOpenId: _this.$queue.getData("weixinOpenid")
|
||||
}).then(res => {
|
||||
console.log(JSON.stringify(res))
|
||||
if (res.code === 0) {
|
||||
this.$queue.setData("mobile", _this.phone);
|
||||
this.$queue.setData("token", res.token);
|
||||
this.$queue.setData("userId", res.user.userId);
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
} else {
|
||||
_this.isRotate = false;
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '绑定失败',
|
||||
content: res.msg,
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
getUserInfo(userId, token) {
|
||||
this.$Request.get("/app/user/selectUserById").then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.setStorageSync('token', token)
|
||||
uni.setStorageSync('userId', res.data.userId)
|
||||
uni.setStorageSync('avatar', res.data.avatar)
|
||||
uni.setStorageSync('invitationCode', res.data.invitationCode)
|
||||
uni.setStorageSync('zhiFuBao', res.data.zhiFuBao)
|
||||
uni.setStorageSync('zhiFuBaoName', res.data.zhiFuBaoName)
|
||||
this.$Request.get("/app/UserVip/isUserVip").then(res => {
|
||||
if (res.code == 0 && res.data && res.data.isVip == 2) {
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
});
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
} else {
|
||||
uni.showModal({
|
||||
showCancel: false,
|
||||
title: '登录失败',
|
||||
content: res.msg
|
||||
});
|
||||
this.$queue.logout();
|
||||
}
|
||||
uni.hideLoading();
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
page {
|
||||
height: 100%;
|
||||
background: #FFFFFF !important;
|
||||
}
|
||||
|
||||
.footer {
|
||||
padding-left: 140upx;
|
||||
margin-top: 32upx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.send-msg {
|
||||
border-radius: 30px;
|
||||
color: white;
|
||||
height: 30px;
|
||||
font-size: 10px;
|
||||
line-height: 30px;
|
||||
background: #5E81F9;
|
||||
}
|
||||
|
||||
|
||||
.container {
|
||||
padding-top: 32upx;
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
position: relative;
|
||||
z-index: 90;
|
||||
background: #FFFFFF;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
|
||||
.input-content {
|
||||
padding: 32upx 80upx;
|
||||
}
|
||||
|
||||
|
||||
.confirm-btn {
|
||||
width: 600upx;
|
||||
height: 80upx;
|
||||
line-height: 80upx;
|
||||
border-radius: 60upx;
|
||||
margin-top: 32upx;
|
||||
background: #5E81F9;
|
||||
|
||||
color: #fff;
|
||||
font-size: 32upx;
|
||||
|
||||
&:after {
|
||||
border-radius: 60px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
83
pages/me/erweimaRegister.vue
Normal file
83
pages/me/erweimaRegister.vue
Normal file
@@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<view>
|
||||
<!-- <u-navbar :title-bold="true" :title="$t('order.wxts')"> -->
|
||||
<!-- <view class="slot-wrap margin-right" slot="right">全部已读</view> -->
|
||||
<!-- </u-navbar> -->
|
||||
<view style="text-align: center;height: 100%;position: absolute;width:100%;background: #F8F8F8;">
|
||||
<image style="width: 60px;height: 60px;margin-top: 20px;border-radius:10px" src="/static/images/logo.png">
|
||||
</image>
|
||||
<view style="font-size: 18px;margin-top: 8px;font-weight: 600;padding: 0rpx 30rpx;">{{content}}</view>
|
||||
<image style="margin-top: 40px" mode="aspectFit" :src="erweima">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isWeiXin: false,
|
||||
name: '',
|
||||
content: '',
|
||||
erweima: '',
|
||||
webviewStyles: {
|
||||
progress: {
|
||||
color: '#FF3333'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
//pc展示用户端二维码 854
|
||||
this.$Request.getT("/app/common/type/854").then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data && res.data.value) {
|
||||
this.erweima = res.data.value;
|
||||
}
|
||||
}
|
||||
});
|
||||
//pc展示用户端文字 853
|
||||
this.$Request.getT("/app/common/type/853").then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data && res.data.value) {
|
||||
this.content = res.data.value;
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
onPullDownRefresh: function() {
|
||||
uni.stopPullDownRefresh(); // 停止刷新
|
||||
},
|
||||
onShow() {
|
||||
//#ifdef H5
|
||||
this.follow()
|
||||
//#endif
|
||||
},
|
||||
methods: {
|
||||
|
||||
follow() {
|
||||
if (this.$queue.getData("openid")) {
|
||||
this.$Request.get("/tao/wx/follow/" + this.$queue.getData("openid")).then(res => {
|
||||
if (res === true) {
|
||||
window.location.replace(this.$queue.publicYuMing());
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
rests() {
|
||||
uni.showToast({
|
||||
title: "已刷新请再次长按识别",
|
||||
mask: false,
|
||||
duration: 1500,
|
||||
icon: "none"
|
||||
});
|
||||
window.location.reload();
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
847
pages/me/index.vue
Normal file
847
pages/me/index.vue
Normal file
@@ -0,0 +1,847 @@
|
||||
<template>
|
||||
<view style="padding-bottom: 40rpx;">
|
||||
<u-navbar :background="background" :is-back="false" :title="title" :border-bottom="false">
|
||||
</u-navbar>
|
||||
<!-- 登录信息 -->
|
||||
<view class="info flex align-center justify-center">
|
||||
<view class="info-box">
|
||||
<view @click="token?goNav('/pages/me/userinfo'):goNav('/pages/login/login')"
|
||||
class="info-box-c flex align-center justify-between">
|
||||
<view class="info-box-c-l flex align-center">
|
||||
<view class="info-box-c-l-avatar">
|
||||
<image :src="avatar?avatar:'../../static/images/logo.png'" mode=""></image>
|
||||
</view>
|
||||
<view class="info-box-c-l-name">
|
||||
<view class="info-box-c-l-name-t">
|
||||
{{userName?userName:'未登录'}}
|
||||
</view>
|
||||
<view class="info-box-c-l-name-b" v-if="invitationCode">
|
||||
ID:{{invitationCode}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="info-box-c-r">
|
||||
<u-icon name="arrow-right" color="#F6F6F6" size="28"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 统计 -->
|
||||
<view class="statistics flex align-center justify-center">
|
||||
<view class="statistics-box flex align-center justify-between">
|
||||
<view class="statistics-box-item" @click="goNav('/me/jilu/myLove')">
|
||||
<view class="statistics-box-item-top">
|
||||
{{myLoveNum}}
|
||||
</view>
|
||||
<view class="statistics-box-item-btn">
|
||||
我的喜欢
|
||||
</view>
|
||||
</view>
|
||||
<view class="statistics-box-item" @click="goNav('/me/jilu/histor')">
|
||||
<view class="statistics-box-item-top">
|
||||
{{myZhui}}
|
||||
</view>
|
||||
<view class="statistics-box-item-btn">
|
||||
我的追剧
|
||||
</view>
|
||||
</view>
|
||||
<view class="statistics-box-item" @click="goNav('/me/jifen/jifen')">
|
||||
<view class="statistics-box-item-top">
|
||||
{{jifen}}
|
||||
</view>
|
||||
<view class="statistics-box-item-btn">
|
||||
我的积分
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="isVips == '是' && isWxIosPay == true" class="vip flex align-center justify-center">
|
||||
<view class="vip-box flex align-center justify-between">
|
||||
<view class="vip-box-l">
|
||||
<view class="vip-box-l-l flex align-center">
|
||||
{{isVIP?'会员用户':'开通会员'}}
|
||||
<image src="../../static/images/me/Vips.png" mode=""></image>
|
||||
</view>
|
||||
|
||||
<view class="vip-box-l-r" v-if="isVIP">
|
||||
{{endTime?endTime+'到期':'您是尊贵的永久会员'}}
|
||||
</view>
|
||||
<view class="vip-box-l-r" v-else>
|
||||
{{endTime?endTime+'到期':'升级VIP，省更多钱'}}
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="!isVIP" @click="goNav('/pages/me/vip/index')"
|
||||
class="vip-box-r flex align-center justify-center">
|
||||
立即开通
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 钱包 -->
|
||||
<view class="money flex align-center justify-center" v-if="isWxIosPay == true">
|
||||
<view class="money-box flex align-center justify-between">
|
||||
<view class="">
|
||||
<view class="money-box-title flex align-center">
|
||||
<view class="money-box-title-l">
|
||||
金豆余额
|
||||
</view>
|
||||
<view @click="isShoMoney = !isShoMoney" class="money-box-title-r" style="margin-left: 12rpx;">
|
||||
<u-icon :name="isShoMoney?'eye':'eye-off'" color="#5A4A32" size="40"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="money-box-price">
|
||||
<block v-if="isShoMoney">
|
||||
{{formatNumber(moneyNum)}}
|
||||
</block>
|
||||
<block v-else>
|
||||
****
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<view class="money-box-btn" @click="goNav('/me/wallet/wallet')">
|
||||
立即充值
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 常用工具 -->
|
||||
<view class="tool flex align-center justify-center">
|
||||
<view class="tool-box">
|
||||
<view class="tool-box-content flex align-center justify-between flex-wrap">
|
||||
<!-- #ifdef MP-TOUTIAO -->
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap"
|
||||
@click="goNav('/me/wallet/mingxi')">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/mingxi.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
钱包明细
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view v-if="kmPaySel != '否'" @click="openKaMiShow()"
|
||||
class="tool-box-content-item flex align-center justify-center flex-wrap">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/kami.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
卡密兑换
|
||||
</view>
|
||||
</view>
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap"
|
||||
@click="goNav('/me/invite/index')">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/vfx.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
分享好友
|
||||
</view>
|
||||
</view>
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap"
|
||||
@click="goNav('/me/message/index')">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/messige.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
消息中心
|
||||
</view>
|
||||
<u-badge :offset="[0,20]" type="error" :count="numCount"></u-badge>
|
||||
</view>
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap"
|
||||
@click="goNav('/me/jilu/jilu')">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/vlishi.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
观看历史
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="rate>0" class="tool-box-content-item flex align-center justify-center flex-wrap"
|
||||
@click="goNav('/me/invite/inviteDet')">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/vtd.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
我的团队
|
||||
</view>
|
||||
</view>
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap" @click="goMsg()">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/vkf.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
联系客服
|
||||
</view>
|
||||
</view>
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap"
|
||||
@click="goNav('/me/feedbackIndex/feedbackIndex')">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/bangzhu.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
帮助中心
|
||||
</view>
|
||||
</view>
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap"
|
||||
@click="goNav('/me/feedback/index')">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/yijian.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
意见反馈
|
||||
</view>
|
||||
</view>
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap"
|
||||
@click="goNav('/me/setting/index')">
|
||||
<view class="tool-box-content-item-img">
|
||||
<image src="../../static/images/me/setting.png" mode=""></image>
|
||||
</view>
|
||||
<view class="tool-box-content-item-txt">
|
||||
设置中心
|
||||
</view>
|
||||
</view>
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap" style="height: 0;">
|
||||
</view>
|
||||
<view class="tool-box-content-item flex align-center justify-center flex-wrap" style="height: 0;">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 卡密兑换弹窗 -->
|
||||
<u-popup @close="kami = ''" v-model="showCard" mode="center" border-radius="14" :closeable="true">
|
||||
<view class="kami">
|
||||
<view class="kami-title">
|
||||
卡密兑换
|
||||
</view>
|
||||
<view class="kami-input">
|
||||
<u-input v-model="kami" placeholder="请输入卡密" type="text" :border="true" />
|
||||
</view>
|
||||
<view @click="exchangeKaMi()" class="kami-btn flex align-center justify-center">
|
||||
确认兑换
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<!-- 抖音im客服 -->
|
||||
<ttMsg />
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ttMsg from '../../components/ttMsg/ttMsg.vue'
|
||||
export default {
|
||||
components: {
|
||||
ttMsg
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
title: '',
|
||||
background: {
|
||||
backgroundImage: 'linear-gradient(to right, #FFE5EA 0%, #E4F5FB 49%, #FFF0EE 100%)'
|
||||
},
|
||||
kami: '', //卡密
|
||||
isShoMoney: false, //是否显示余额
|
||||
avatar: '../../static/images/logo.png',
|
||||
img: '../../static/images/me/huiyuan.png',
|
||||
swiperList: [{
|
||||
imageUrl: '../../static/images/me/banner.png',
|
||||
}],
|
||||
isLogin: false,
|
||||
userName: '未登录',
|
||||
isVIP: false,
|
||||
invitationCode: '',
|
||||
token: '',
|
||||
endTime: '', //会员到期时间
|
||||
moneyNum: 0, //余额
|
||||
jifen: 0, //积分
|
||||
isVips: '否', //是否显示会员
|
||||
myLoveNum: 0, //我的喜欢个数
|
||||
myZhui: 0, //我的追剧数量
|
||||
showCard: false,
|
||||
numCount: 0,
|
||||
rate: 0,
|
||||
kmPaySel: '否',
|
||||
isWxIosPay: true, //微信下是否显示支付功能
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getBannerList()
|
||||
},
|
||||
onShow() {
|
||||
this.isWxIosPay = uni.getStorageSync('isWxIosPay')
|
||||
this.kmPaySel = this.$queue.getData('kmPaySel');
|
||||
this.numCount = uni.getStorageSync('numCount')
|
||||
this.isVips = uni.getStorageSync('isVips') ? uni.getStorageSync('isVips') : '否'
|
||||
this.token = uni.getStorageSync('token')
|
||||
if (this.token) {
|
||||
this.getMyMoney()
|
||||
this.getJifen()
|
||||
this.$u.api.userinfo().then(res => {
|
||||
if (res.code == 0 && res.data) {
|
||||
uni.setStorageSync('zhiFuBao', res.data.zhiFuBao)
|
||||
uni.setStorageSync('zhiFuBaoName', res.data.zhiFuBaoName)
|
||||
uni.setStorageSync('userName', res.data.userName)
|
||||
uni.setStorageSync('avatar', res.data.avatar)
|
||||
this.userName = res.data.userName
|
||||
this.avatar = res.data.avatar
|
||||
this.invitationCode = res.data.invitationCode
|
||||
if (res.data.rate) {
|
||||
this.rate = (Number(res.data.rate) * 100).toFixed(0)
|
||||
} else {
|
||||
this.rate = 0
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
let data = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
this.$u.api.userVip(data).then(res => {
|
||||
if (res.code == 0 && res.data && res.data.isVip == 2) {
|
||||
this.isVIP = true;
|
||||
this.endTime = res.data.endTime
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
this.isVIP = false;
|
||||
this.endTime = ''
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
})
|
||||
|
||||
this.isLogin = true
|
||||
this.userName = uni.getStorageSync('userName')
|
||||
this.isVIP = uni.getStorageSync('isVIP')
|
||||
this.getMyLoveNum()
|
||||
this.getMyZhuiNum()
|
||||
} else {
|
||||
this.isLogin = false
|
||||
this.isVIP = false
|
||||
this.endTime = '' //会员到期时间
|
||||
this.moneyNum = 0 //余额
|
||||
this.jifen = 0 //积分
|
||||
this.userName = '未登录'
|
||||
this.invitationCode = ''
|
||||
this.myLoveNum = 0
|
||||
this.myZhui = 0
|
||||
this.rate = 0
|
||||
}
|
||||
this.avatar = uni.getStorageSync('avatar') ? uni.getStorageSync('avatar') : '../../static/images/logo.png'
|
||||
},
|
||||
methods: {
|
||||
//兑换卡密
|
||||
exchangeKaMi() {
|
||||
if (!this.kami) {
|
||||
uni.showToast({
|
||||
title: '请输入卡密',
|
||||
icon: 'none'
|
||||
})
|
||||
return
|
||||
}
|
||||
let data = {
|
||||
sdkContent: this.kami
|
||||
}
|
||||
this.$Request.postT('/app/sdkInfo/sdkExchange', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
uni.showToast({
|
||||
title: '兑换成功'
|
||||
})
|
||||
this.showCard = false
|
||||
let datas = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
this.$u.api.userVip(datas).then(rest => {
|
||||
if (rest.code == 0 && rest.data && rest.data.isVip == 2) {
|
||||
this.isVIP = true;
|
||||
this.endTime = rest.data.endTime
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
this.isVIP = false;
|
||||
this.endTime = ''
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
openKaMiShow() {
|
||||
if (uni.getStorageSync('token')) {
|
||||
this.showCard = true
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
//获取我喜欢的数量
|
||||
getMyLoveNum() {
|
||||
let data = {
|
||||
page: 1,
|
||||
limit: 1,
|
||||
classify: 2
|
||||
}
|
||||
this.$Request.getT('/app/courseCollect/selectByUserId', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.myLoveNum = res.data.total
|
||||
} else {
|
||||
this.myLoveNum = 0
|
||||
}
|
||||
})
|
||||
},
|
||||
//获取我追剧的数量
|
||||
getMyZhuiNum() {
|
||||
let data = {
|
||||
page: 1,
|
||||
limit: 1,
|
||||
classify: 1
|
||||
}
|
||||
this.$Request.getT('/app/courseCollect/selectByUserId', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.myZhui = res.data.total
|
||||
} else {
|
||||
this.myZhui = 0
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 获取积分
|
||||
*/
|
||||
getJifen() {
|
||||
this.$Request.getT('/app/integral/selectByUserId').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.jifen = res.data.integralNum
|
||||
} else {
|
||||
this.jifen = 0
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* @param {Number} num
|
||||
* @param 保留两位小数
|
||||
*/
|
||||
formatNumber(num) {
|
||||
// 判断是否为整数
|
||||
if (Number.isInteger(num)) {
|
||||
return num.toFixed(2);
|
||||
} else {
|
||||
return num.toFixed(2).replace(/\.?0+$/, '');
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 获取余额
|
||||
*/
|
||||
getMyMoney() {
|
||||
this.$Request.getT('/app/moneyDetails/selectUserMoney').then(res => {
|
||||
if (res.code == 0) {
|
||||
this.moneyNum = res.data.money
|
||||
// this.$Request.getT('/app/invite/selectInviteMoney').then(ret => {
|
||||
// if (ret.code == 0) {
|
||||
// if (ret.data.inviteMoney && ret.data.inviteMoney.money) {
|
||||
// this.moneyNum = Number(res.data.money) + Number(ret.data.inviteMoney
|
||||
// .money)
|
||||
// } else {
|
||||
// this.moneyNum = Number(res.data.money)
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
} else {
|
||||
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
goPage(url) {
|
||||
if (url) {
|
||||
if (url.indexOf('/pages/') !== -1 || url.indexOf('/me/') !== -1) {
|
||||
uni.navigateTo({
|
||||
url
|
||||
});
|
||||
} else {
|
||||
//#ifndef H5
|
||||
uni.navigateTo({
|
||||
url: '/pages/index/webView?url=' + url
|
||||
});
|
||||
//#endif
|
||||
//#ifdef H5
|
||||
window.location.href = url;
|
||||
//#endif
|
||||
}
|
||||
}
|
||||
},
|
||||
goMsg() {
|
||||
let kefu = uni.getStorageSync('kefu'); // 用户端联系方式 1 手机号 2企业微信
|
||||
let kefuPhone = uni.getStorageSync('kefuPhone');
|
||||
if (kefu == 1) {
|
||||
uni.navigateTo({
|
||||
url: '/me/setting/kefu'
|
||||
})
|
||||
} else if (kefu == 3) {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: kefuPhone //仅为示例
|
||||
});
|
||||
} else if (kefu == 2) {
|
||||
// #ifdef MP-WEIXIN
|
||||
let that = this
|
||||
try {
|
||||
wx.openCustomerServiceChat({
|
||||
extInfo: {
|
||||
url: uni.getStorageSync('kefuUrl')
|
||||
},
|
||||
corpId: uni.getStorageSync('kefuAppId'),
|
||||
success(res) {},
|
||||
fail(res) {
|
||||
console.error(res)
|
||||
}
|
||||
})
|
||||
} catch (error) {
|
||||
console.error("catchcatch" + error)
|
||||
uni.showToast({
|
||||
title: '请更新至微信最新版本'
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
// #ifndef MP-WEIXIN
|
||||
let url = uni.getStorageSync('kefuUrl');
|
||||
if (url.indexOf('/pages/') !== -1 || url.indexOf('/my/') !== -1) {
|
||||
uni.navigateTo({
|
||||
url
|
||||
});
|
||||
} else {
|
||||
//#ifndef H5
|
||||
uni.navigateTo({
|
||||
url: '/pages/index/webView?url=' + url
|
||||
});
|
||||
//#endif
|
||||
//#ifdef H5
|
||||
window.location.href = url;
|
||||
//#endif
|
||||
}
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
goNav(e) {
|
||||
console.log(e)
|
||||
let token = uni.getStorageSync('token')
|
||||
if (token) {
|
||||
uni.navigateTo({
|
||||
url: e
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
// 获取轮播图列表
|
||||
getBannerList() {
|
||||
this.$u.api.bannerList({
|
||||
classify: '3'
|
||||
}).then(res => {
|
||||
if (res.code == 0 && res.data) {
|
||||
let arr = []
|
||||
res.data.forEach(ret => {
|
||||
if (ret.state == 1) {
|
||||
arr.push(ret)
|
||||
}
|
||||
})
|
||||
this.swiperList = arr
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #F5F7FF;
|
||||
}
|
||||
|
||||
/deep/.u-navbar-inner {
|
||||
/* #ifdef H5 */
|
||||
background: linear-gradient(to right, #FFE5EA 0%, #E4F5FB 49%, #FFF0EE 100%);
|
||||
/* #endif */
|
||||
}
|
||||
|
||||
.kami {
|
||||
width: 500rpx;
|
||||
height: auto;
|
||||
background-color: #FFFFFF;
|
||||
|
||||
.kami-title {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 30rpx;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.kami-input {
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.kami-btn {
|
||||
width: calc(100% - 60rpx);
|
||||
height: 80rpx;
|
||||
margin: 0 auto;
|
||||
background-color: #ff7581;
|
||||
border-radius: 44rpx;
|
||||
color: #FFFFFF;
|
||||
margin-top: 10rpx;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.info::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: linear-gradient(to right, #FFE5EA 0%, #E4F5FB 49%, #FFF0EE 100%);
|
||||
z-index: 1;
|
||||
/* 确保在垂直渐变之上 */
|
||||
}
|
||||
|
||||
.info::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background: linear-gradient(to bottom, transparent, #F5F7FF);
|
||||
/* 垂直渐变，结束颜色为透明 */
|
||||
z-index: 2;
|
||||
/* 确保在水平渐变之上 */
|
||||
}
|
||||
|
||||
.info {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
// height: 400rpx;
|
||||
background: #F5F7FF;
|
||||
position: relative;
|
||||
border-radius: 0 0 80rpx 80rpx;
|
||||
|
||||
.info-box {
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.info-box-c {
|
||||
width: 100%;
|
||||
height: 94rpx;
|
||||
// margin-top: 60rpx;
|
||||
margin-bottom: 140rpx;
|
||||
}
|
||||
|
||||
.info-box-c-l-avatar {
|
||||
width: 94rpx;
|
||||
height: 94rpx;
|
||||
border-radius: 50%;
|
||||
|
||||
image {
|
||||
width: 94rpx;
|
||||
height: 94rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.info-box-c-l-name {
|
||||
margin-left: 16rpx;
|
||||
|
||||
.info-box-c-l-name-t {
|
||||
color: #333333;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.info-box-c-l-name-b {
|
||||
color: #333333;
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.statistics {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-top: -100rpx;
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
|
||||
.statistics-box {
|
||||
width: 686rpx;
|
||||
// height: 184rpx;
|
||||
// background-color: #FFFFFF;
|
||||
border-radius: 24rpx;
|
||||
}
|
||||
|
||||
.statistics-box-item {
|
||||
// width: calc(100% / 3);
|
||||
// height: 100%;
|
||||
}
|
||||
|
||||
.statistics-box-item-top {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #333333;
|
||||
font-size: 38rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.statistics-box-item-btn {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
// margin-top: 20rpx
|
||||
}
|
||||
}
|
||||
|
||||
.vip {
|
||||
width: 100%;
|
||||
// height: 84rpx;
|
||||
margin-top: 30rpx;
|
||||
|
||||
.vip-box {
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
background: linear-gradient(90deg, #FEF5E4 0%, #FBECD7 100%);
|
||||
border-radius: 24rpx;
|
||||
padding: 26rpx 30rpx;
|
||||
}
|
||||
|
||||
.vip-box-l {
|
||||
image {
|
||||
width: 24rpx;
|
||||
height: 22rpx;
|
||||
margin-left: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.vip-box-l-l {
|
||||
font-size: 32rpx;
|
||||
font-weight: 800;
|
||||
color: #5A4A32;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
|
||||
.vip-box-l-r {
|
||||
color: #817858;
|
||||
font-size: 26rpx;
|
||||
margin-top: 6rpx;
|
||||
}
|
||||
|
||||
.vip-box-r {
|
||||
width: 130rpx;
|
||||
height: 50rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0rpx -3rpx 9rpx 0rpx rgba(255, 255, 255, 0.46);
|
||||
border-radius: 25rpx;
|
||||
color: #5A4A32;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.money {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.money-box {
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
border-radius: 24rpx;
|
||||
background: #ffffff;
|
||||
padding: 30rpx;
|
||||
}
|
||||
|
||||
.money-box-btn {
|
||||
background: linear-gradient(90deg, #FF7581 0%, #F8A5AF 100%);
|
||||
border-radius: 44rpx;
|
||||
padding: 18rpx 30rpx;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.money-box-title-l {
|
||||
color: #333333;
|
||||
font-size: 28rpx;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.money-box-price {
|
||||
color: #333333;
|
||||
font-size: 48rpx;
|
||||
font-weight: 800;
|
||||
margin-top: 20rpx;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
.tool {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.tool-box {
|
||||
width: 686rpx;
|
||||
height: 100%;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 24rpx;
|
||||
}
|
||||
|
||||
.tool-box-content {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
padding: 30rpx 30rpx 0 30rpx;
|
||||
}
|
||||
|
||||
.tool-box-content-item {
|
||||
width: 130rpx;
|
||||
height: auto;
|
||||
margin-bottom: 46rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.tool-box-content-item-img {
|
||||
width: 66rpx;
|
||||
height: 66rpx;
|
||||
|
||||
image {
|
||||
width: 66rpx;
|
||||
height: 66rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.tool-box-content-item-txt {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 10rpx;
|
||||
color: #333333;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
475
pages/me/userinfo.vue
Normal file
475
pages/me/userinfo.vue
Normal file
@@ -0,0 +1,475 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="usermain">
|
||||
<view class="usermain-item u-border-bottom">
|
||||
<view>头像</view>
|
||||
<view>
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<button open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
|
||||
<image style="width: 111rpx;height: 111rpx;border-radius: 50%"
|
||||
:src="headImg?headImg:'../../static/images/logo.png'"></image>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<image :src="headImg?headImg:'../../static/images/logo.png'" mode="" @click="uploadImg"
|
||||
style="width: 111rpx;height: 111rpx;border-radius: 50%;"></image>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="usermain-item item-padding u-border-bottom">
|
||||
<view>用户名</view>
|
||||
<view>
|
||||
<view class="cu-form-group">
|
||||
<input type="nickname" v-model="userName" placeholder="请输入用户名" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="usermain-item item-padding">
|
||||
<view >姓名</view>
|
||||
<view class="cu-form-group">
|
||||
<input v-model="realName" placeholder="请填写您的真实姓名" />
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<view class="usermain-item item-padding u-border-bottom">
|
||||
<view>手机</view>
|
||||
<view>
|
||||
<!-- #ifndef MP-WEIXIN -->
|
||||
<view class="cu-form-group">
|
||||
<input v-if="phone" disabled v-model="phone" placeholder="请输入联系电话" />
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<view class="cu-form-group">
|
||||
<input v-if="phone" disabled v-model="phone" placeholder="请输入联系电话" />
|
||||
<button v-else
|
||||
style="background-color: #ff7581 !important;color: #FFFFFF;font-size: 22rpx;padding: 10rpx 20rpx;"
|
||||
class="bottom" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
|
||||
授权手机号
|
||||
</button>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="usermain-item item-padding" @click="goMyAddress">
|
||||
|
||||
<view >地址管理</view>
|
||||
<view>
|
||||
<view class="cu-form-group" >
|
||||
<image src="../static/right.png" style="width: 12rpx; height: 19rpx;margin-left: 10rpx;" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="footer-btn">
|
||||
<view class="usermain-btn" @click="messagebtn()">保存</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import configdata from '../../common/config.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
phone: '',
|
||||
headImg: '../../static/images/logo.png',
|
||||
userName: '',
|
||||
nickName: '',
|
||||
userId: '',
|
||||
realName: '',
|
||||
weChatId: "",
|
||||
password: '',
|
||||
platform: '',
|
||||
createTime: '',
|
||||
money: '',
|
||||
jiFen: '',
|
||||
status: '',
|
||||
zhiFuBao: '',
|
||||
zhiFuBaoName: ''
|
||||
};
|
||||
},
|
||||
onLoad(e) {
|
||||
this.getUserInfo()
|
||||
},
|
||||
methods: {
|
||||
getMyPhone(code) {
|
||||
let data = {
|
||||
code: code
|
||||
}
|
||||
this.$Request.postT('/app/Login/wxPhone', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.phone = res.data.phone_info.purePhoneNumber;
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '获取手机号失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
//获取小程序手机号授权
|
||||
getPhoneNumber: function(e) {
|
||||
console.log(e.detail, '1111111111')
|
||||
// #ifdef MP-TOUTIAO
|
||||
if (e.detail.encryptedData && e.detail.iv) {
|
||||
console.log('用户同意提供手机号');
|
||||
|
||||
// console.log('用户拒绝提供手机号');
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '获取手机号失败',
|
||||
icon: 'none'
|
||||
})
|
||||
// this.setPhoneByInsert(e.detail.encryptedData, e.detail.iv);
|
||||
}
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
if (e.detail.code) {
|
||||
this.getMyPhone(e.detail.code)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '获取手机号失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
// if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
|
||||
// console.log('用户拒绝提供手机号');
|
||||
// } else {
|
||||
// console.log('用户同意提供手机号');
|
||||
// this.setPhoneByInsert(e.detail.encryptedData, e.detail.iv);
|
||||
// }
|
||||
// #endif
|
||||
// #ifdef MP-KUAISHOU
|
||||
|
||||
// #endif
|
||||
|
||||
},
|
||||
goMyAddress() {
|
||||
uni.navigateTo({
|
||||
url: '../jifen/myaddress'
|
||||
});
|
||||
},
|
||||
//微信填写能力获取头像
|
||||
onChooseAvatar(e) {
|
||||
console.log(e.detail.avatarUrl)
|
||||
let that = this;
|
||||
let url = ''
|
||||
let token = uni.getStorageSync('token');
|
||||
uni.showLoading({
|
||||
title: '上传中...'
|
||||
});
|
||||
uni.uploadFile({
|
||||
url: configdata.APIHOST + '/alioss/upload',
|
||||
// url: 'https://jiaoyu.xianmxkj.com/sqx_fast/alioss/upload', //仅为示例，非真实的接口地址
|
||||
filePath: e.detail.avatarUrl,
|
||||
// filePath: res.tempFilePaths[0],
|
||||
header: {
|
||||
token: token
|
||||
},
|
||||
name: 'file',
|
||||
success: uploadFileRes => {
|
||||
url = JSON.parse(uploadFileRes.data);
|
||||
|
||||
that.headImg = url.data
|
||||
uni.hideLoading();
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
uploadImg() {
|
||||
let token = uni.getStorageSync('token')
|
||||
|
||||
if (!token) {
|
||||
this.goLoginInfo();
|
||||
return;
|
||||
}
|
||||
let that = this;
|
||||
var url = null;
|
||||
uni.showActionSheet({
|
||||
// itemList按钮的文字接受的是数组
|
||||
itemList: ["查看头像", "从相册选择图片"],
|
||||
success(e) {
|
||||
var index = e.tapIndex
|
||||
if (index === 0) {
|
||||
// 用户点击了预览当前图片
|
||||
// 可以自己实现当前头像链接的读取
|
||||
let url = that.headImg;
|
||||
let arr = []
|
||||
arr.push(url)
|
||||
uni.previewImage({
|
||||
// 预览功能图片也必须是数组的
|
||||
urls: arr
|
||||
})
|
||||
} else if (index === 1) {
|
||||
uni.chooseImage({
|
||||
count: 1, //默认9
|
||||
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
|
||||
sourceType: ['album'], //从相册选择
|
||||
success: function(res) {
|
||||
uni.showLoading({
|
||||
title: '上传中...'
|
||||
});
|
||||
let token = uni.getStorageSync('token');
|
||||
let userId = uni.getStorageSync('userId');
|
||||
uni.uploadFile({
|
||||
url: configdata.APIHOST + '/alioss/upload',
|
||||
// url: 'https://jiaoyu.xianmxkj.com/sqx_fast/alioss/upload', //仅为示例，非真实的接口地址
|
||||
filePath: res.tempFilePaths[0],
|
||||
name: 'file',
|
||||
success: uploadFileRes => {
|
||||
url = JSON.parse(uploadFileRes.data);
|
||||
console.log(url)
|
||||
that.headImg = url.data
|
||||
uni.hideLoading();
|
||||
// that.$u.post('/app/user/updateUsers',{
|
||||
// headImg: url.data
|
||||
// },{
|
||||
// header: "application/json"
|
||||
// }).then(res => {
|
||||
// uni.showToast({
|
||||
// title: '更新成功',
|
||||
// icon: "none"
|
||||
// })
|
||||
// that.getUserInfo();
|
||||
// })
|
||||
// uni.request({
|
||||
// url: 'https://jiaoyu.xianmxkj.com/sqx_fast/app/user/updateUsers',
|
||||
// data: data,
|
||||
// method: "POST",
|
||||
// header: {
|
||||
// "content-type": header,
|
||||
// "token": token
|
||||
// },
|
||||
// success: function (result) {
|
||||
// console.error(result);
|
||||
// succ.call(self, result.data)
|
||||
// },
|
||||
// fail: function (e) {
|
||||
// error.call(self, e)
|
||||
// }
|
||||
// })
|
||||
|
||||
// that.$Request.postJson('/user/update',{
|
||||
// userId: userId,
|
||||
// headImg:url.data
|
||||
// }).then(res => {
|
||||
// uni.hideLoading();
|
||||
// if (res.status === 0) {
|
||||
// that.$queue.showToast("更新成功");
|
||||
// that.getUserInfo(userId);
|
||||
// }
|
||||
// });
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
config: function(name) {
|
||||
var info = null;
|
||||
if (name) {
|
||||
var name2 = name.split("."); //字符分割
|
||||
if (name2.length > 1) {
|
||||
info = configdata[name2[0]][name2[1]] || null;
|
||||
} else {
|
||||
info = configdata[name] || null;
|
||||
}
|
||||
if (info == null) {
|
||||
let web_config = cache.get("web_config");
|
||||
if (web_config) {
|
||||
if (name2.length > 1) {
|
||||
info = web_config[name2[0]][name2[1]] || null;
|
||||
} else {
|
||||
info = web_config[name] || null;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return info;
|
||||
},
|
||||
getUserInfo() {
|
||||
let userId = uni.getStorageSync('userId')
|
||||
this.$u.api.userinfo().then(res => {
|
||||
if (res.code == 0) {
|
||||
this.userName = res.data.userName;
|
||||
this.phone = res.data.phone;
|
||||
this.phones = res.data.phone
|
||||
this.headImg = res.data.avatar;
|
||||
}
|
||||
})
|
||||
// this.$Request.getT('/user/find?id=' + userId).then(res => {
|
||||
// if (res.status === 0) {
|
||||
// this.userName = res.data.userName;
|
||||
// this.phone = res.data.phone;
|
||||
// this.headImg = res.data.headImg;
|
||||
// this.realName = res.data.realName;
|
||||
// this.nickName = res.data.nickName;
|
||||
// this.userId = res.data.userId;
|
||||
// this.password = res.data.password;
|
||||
// this.createTime = res.data.createTime;
|
||||
// this.money = res.data.money;
|
||||
// this.platform = res.data.platform;
|
||||
|
||||
// this.jiFen = res.data.jiFen;
|
||||
// this.weChatId=res.data.weChatId;
|
||||
// this.status = res.data.status;
|
||||
// this.zhiFuBao = res.data.zhiFuBao;
|
||||
// this.zhiFuBaoName = res.data.zhiFuBaoName;
|
||||
// } else {
|
||||
// uni.showModal({
|
||||
// showCancel: false,
|
||||
// title: '未知错误',
|
||||
// content: res.msg
|
||||
// });
|
||||
// this.$queue.logout();
|
||||
// }
|
||||
// uni.hideLoading();
|
||||
// });
|
||||
},
|
||||
//根据正则验证手机号是否正确包括校验长度
|
||||
checkPhone(phone) {
|
||||
return /^1[3456789]\d{9}$/.test(phone);
|
||||
},
|
||||
// 保存
|
||||
messagebtn() {
|
||||
if (!this.userName) {
|
||||
uni.showToast({
|
||||
title: "用户名不能为空",
|
||||
icon: "none"
|
||||
})
|
||||
return
|
||||
}
|
||||
// #ifdef MP-WEIXIN
|
||||
if (!this.phone) {
|
||||
uni.showToast({
|
||||
title: "手机号不能空",
|
||||
icon: "none"
|
||||
})
|
||||
return
|
||||
}
|
||||
if (this.checkPhone(this.phone) == false) {
|
||||
uni.showToast({
|
||||
title: "手机号格式不正确",
|
||||
icon: "none"
|
||||
})
|
||||
return
|
||||
}
|
||||
// #endif
|
||||
|
||||
uni.showModal({
|
||||
title: '温馨提示',
|
||||
content: '确定保存信息',
|
||||
confirmColor: '#ff7581',
|
||||
success: e => {
|
||||
if (e.confirm) {
|
||||
this.$u.post("/app/user/updateUsers", {
|
||||
userName: this.userName,
|
||||
avatar: this.headImg,
|
||||
phone: this.phone,
|
||||
}).then(res => {
|
||||
if (res.code === 0) {
|
||||
uni.showToast({
|
||||
title: '保存成功',
|
||||
icon: "none"
|
||||
})
|
||||
setTimeout(function() {
|
||||
uni.navigateBack()
|
||||
}, 1000)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: "none"
|
||||
})
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
// userphone(){
|
||||
// uni.navigateTo({
|
||||
// url:'/pages/my/userphone'
|
||||
// })
|
||||
// }
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
button::after {
|
||||
border: none;
|
||||
background-color: none;
|
||||
}
|
||||
|
||||
button {
|
||||
position: relative;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-left: 0px;
|
||||
padding-right: 0px;
|
||||
box-sizing: border-box;
|
||||
text-decoration: none;
|
||||
line-height: 1.35;
|
||||
overflow: hidden;
|
||||
color: #666666;
|
||||
/* background-color: #fff; */
|
||||
background-color: rgba(255, 255, 255, 0) !important;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.usermain {
|
||||
background: #FFFFFF;
|
||||
}
|
||||
|
||||
.usermain-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 40rpx;
|
||||
padding: 30rpx 40rpx 30rpx 0;
|
||||
justify-content: space-between;
|
||||
/* border-bottom: 2rpx solid #f2f2f2; */
|
||||
}
|
||||
|
||||
.usermain-item.item-padding {
|
||||
padding: 0 40rpx 0 0;
|
||||
}
|
||||
|
||||
.cu-form-group {
|
||||
padding: 0;
|
||||
background: #FFFFFF;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.cu-form-group input {
|
||||
background: #FFFFFF;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
|
||||
}
|
||||
|
||||
.footer-btn {
|
||||
margin-top: 150rpx;
|
||||
}
|
||||
|
||||
.footer-btn .usermain-btn {
|
||||
color: #FFFFFF;
|
||||
background: #ff7581;
|
||||
text-align: center;
|
||||
width: 450rpx;
|
||||
height: 80rpx;
|
||||
font-size: 28rpx;
|
||||
line-height: 80rpx;
|
||||
margin: 0 auto;
|
||||
border-radius: 40rpx;
|
||||
}
|
||||
</style>
|
||||
916
pages/me/vip/index.vue
Normal file
916
pages/me/vip/index.vue
Normal file
@@ -0,0 +1,916 @@
|
||||
<!-- 会员中心 -->
|
||||
<template>
|
||||
<view>
|
||||
<view class="margin-top margin-lr radius u-relative"
|
||||
style="overflow: hidden;height: 260rpx;border-radius: 40rpx;">
|
||||
<u-image src="../../../static/images/me/beijing@2x.png" width="100%" height="400rpx"></u-image>
|
||||
<view class="u-abso margin" style="top: 0;">
|
||||
<view class="text-bold u-font-40">{{userName}}</view>
|
||||
<view class="margin-top-sm" style="color: #604320;" v-if="!isVIP">购买会员所有资源免费看</view>
|
||||
<view class="margin-top-sm" style="color: #604320;" v-else>会员到期：{{vipData}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="margin-lr padding bg-white"
|
||||
style="border-radius: 40rpx;position: relative;top: -80rpx;color: #000;">
|
||||
<view class="u-font-16 text-bold margin-bottom">开通会员</view>
|
||||
<view class="flex justify-between margin-bottom" v-for="(item, index) in VIPlist" :key="index">
|
||||
<view>
|
||||
<view class="u-font-40">
|
||||
{{item.money}}<text style="font-size: 22rpx;margin-right: 16rpx;">金豆</text>
|
||||
<!-- #ifdef MP-TOUTIAO -->
|
||||
/ {{item.payDiamond}}<text style="font-size: 22rpx;">钻石</text>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<view class="" style="color: #7F8299;">{{item.type}}卡 •
|
||||
{{item.money}}金豆/
|
||||
<!-- #ifdef MP-TOUTIAO -->
|
||||
{{item.payDiamond}}钻石/
|
||||
<!-- #endif -->
|
||||
{{item.type}}/{{item.vipNameType==0?'30天':(item.vipNameType==1?'90天':'365天')}}
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="btn-bg" @click="bugVIP(item.id)">购买</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="illustrate flex align-center justify-center">
|
||||
<view class="illustrate-box flex align-center">
|
||||
<u-checkbox active-color="#ff7581" v-model="checked" shape="circle"></u-checkbox>
|
||||
<text @click="checked = !checked">
|
||||
我已经阅读并同意
|
||||
</text>
|
||||
<view @click="goXieyi()" class="illustrate-box-txt">
|
||||
《付费须知说明》
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-popup v-model="showPay" mode="bottom" border-radius="14" :closeable="true">
|
||||
<view
|
||||
style="width: 100%;text-align: center;font-size:38rpx;font-weight: bold;margin-top:15rpx;margin-bottom: 80rpx;">
|
||||
选择支付方式
|
||||
</view>
|
||||
<view @click="goMoney" class="flex align-center justify-end" style="margin-right: 20rpx;color: #ff7581;">
|
||||
<view class="" style="color: #666666;">
|
||||
金豆不足？
|
||||
</view>
|
||||
去充值
|
||||
</view>
|
||||
<view style="display: flex;height: 100upx;align-items: center;padding: 20upx 30rpx;"
|
||||
v-for="(item,index) in openLists" :key='index' @tap='selectWay(item.id)'>
|
||||
<view style="display: flex;width:80%;align-items: center;">
|
||||
<image :src="item.image" style="width: 55upx;height: 55upx;"></image>
|
||||
<view style="font-size: 30upx;margin-left: 20upx;width: 70%;">{{item.text}}
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 20%;display: flex;justify-content: flex-end;">
|
||||
<radio-group name="openWay" style="margin-left: 20upx;">
|
||||
<label class="tui-radio">
|
||||
<radio color="#ff7581" :checked="openWay === item.id ? true : false" />
|
||||
</label>
|
||||
</radio-group>
|
||||
</view>
|
||||
</view>
|
||||
<view
|
||||
style="width: 690rpx;height: 80rpx;background:#ff7581;color:#FFFFFF;text-align: center;line-height: 80rpx;border-radius: 50rpx;margin: 30rpx;"
|
||||
@tap="pay()">确认支付</view>
|
||||
</u-popup>
|
||||
|
||||
<!-- 会员助力 -->
|
||||
<u-popup v-model="showjl" :closeable="true" close-icon-color="#ffffff" mode="center">
|
||||
<view class="zl" @click="goZl()">
|
||||
<image class="zl-bg"
|
||||
src="https://duanju.xianmxkj.com/file/uploadPath/2023/12/14/adf37beca97826d44970d20118f88e29.png"
|
||||
mode=""></image>
|
||||
<view class="zl-title">
|
||||
会员免费领
|
||||
</view>
|
||||
<view class="zl-titlef">
|
||||
免费领会员
|
||||
</view>
|
||||
<view class="zl-titlef2">
|
||||
助力中...
|
||||
</view>
|
||||
<view class="zl-titlebtn">
|
||||
立即领取
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
<u-toast ref="uToast" />
|
||||
<!-- 抖音im客服 -->
|
||||
<ttMsg />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ttMsg from '../../../components/ttMsg/ttMsg.vue'
|
||||
export default {
|
||||
components: {
|
||||
ttMsg
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
userName: '匿名',
|
||||
VIPlist: '',
|
||||
showPay: false,
|
||||
openWay: 0,
|
||||
openLists: [],
|
||||
vipId: '',
|
||||
vipData: '',
|
||||
isVIP: false,
|
||||
showjl: false,
|
||||
checked: false,
|
||||
osName: ''
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
// #ifdef MP-WEIXIN || MP-TOUTIAO || MP-KUAISHOU
|
||||
this.osName = uni.getSystemInfoSync().osName;
|
||||
// #endif
|
||||
|
||||
// #ifdef APP
|
||||
if (plus.os.name.toLowerCase() === 'android') {
|
||||
this.openLists = [{
|
||||
image: '/static/images/pay/weixin.png',
|
||||
text: '微信',
|
||||
id: 1
|
||||
}, {
|
||||
image: '/static/images/pay/zhifubao.png',
|
||||
text: '支付宝',
|
||||
id: 2
|
||||
}, {
|
||||
image: '/static/images/pay/lingqian.png',
|
||||
text: '金豆支付',
|
||||
id: 3
|
||||
}]
|
||||
this.openWay = 1;
|
||||
} else {
|
||||
let checkIosPay = this.$queue.getData('checkIosPay');
|
||||
if (checkIosPay === '是') {
|
||||
this.openLists = [{
|
||||
image: '/static/images/pay/lingqian.png',
|
||||
text: '金豆支付',
|
||||
id: 3
|
||||
}];
|
||||
this.openWay = 3;
|
||||
} else {
|
||||
this.openLists = [{
|
||||
image: '/static/images/pay/weixin.png',
|
||||
text: '微信',
|
||||
id: 1
|
||||
}, {
|
||||
image: '/static/images/pay/zhifubao.png',
|
||||
text: '支付宝',
|
||||
id: 2
|
||||
}, {
|
||||
image: '/static/images/pay/lingqian.png',
|
||||
text: '金豆支付',
|
||||
id: 3
|
||||
}];
|
||||
this.openWay = 1;
|
||||
}
|
||||
}
|
||||
|
||||
// #endif
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
this.openLists = [
|
||||
// {
|
||||
// image: '/static/images/pay/weixin.png',
|
||||
// text: '微信',
|
||||
// id: 1
|
||||
// },
|
||||
{
|
||||
image: '/static/images/pay/lingqian.png',
|
||||
text: '金豆支付',
|
||||
id: 3
|
||||
}
|
||||
],
|
||||
this.openWay = 3;
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
let ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.indexOf('micromessenger') !== -1) {
|
||||
this.openLists = [{
|
||||
image: '/static/images/pay/weixin.png',
|
||||
text: '微信',
|
||||
id: 1
|
||||
}, {
|
||||
image: '/static/images/pay/lingqian.png',
|
||||
text: '金豆支付',
|
||||
id: 3
|
||||
}],
|
||||
this.openWay = 1;
|
||||
} else {
|
||||
this.openLists = [{
|
||||
image: '/static/images/pay/zhifubao.png',
|
||||
text: '支付宝',
|
||||
id: 2
|
||||
}, {
|
||||
image: '/static/images/pay/lingqian.png',
|
||||
text: '金豆支付',
|
||||
id: 3
|
||||
}],
|
||||
this.openWay = 2;
|
||||
}
|
||||
|
||||
// #endif
|
||||
// #ifdef MP-TOUTIAO
|
||||
this.openLists = [{
|
||||
image: '/static/images/pay/zhifubao.png',
|
||||
text: '抖音支付',
|
||||
id: 4
|
||||
}, {
|
||||
image: '/static/images/pay/lingqian.png',
|
||||
text: '金豆支付',
|
||||
id: 3
|
||||
}]
|
||||
this.openWay = 4;
|
||||
// #endif
|
||||
// #ifdef MP-KUAISHOU
|
||||
if (this.osName != 'ios') { //安卓
|
||||
this.openLists = [{
|
||||
image: '/static/images/pay/zhifubao.png',
|
||||
text: '快手支付',
|
||||
id: 5
|
||||
}, {
|
||||
image: '/static/images/pay/lingqian.png',
|
||||
text: '金豆支付',
|
||||
id: 3
|
||||
}]
|
||||
this.openWay = 5
|
||||
} else {
|
||||
this.openLists = [{
|
||||
image: '/static/images/pay/lingqian.png',
|
||||
text: '金豆支付',
|
||||
id: 3
|
||||
}]
|
||||
this.openWay = 3
|
||||
}
|
||||
// #endif
|
||||
if (uni.getStorageSync('token')) {
|
||||
this.$Request.get('/app/common/type/813').then(res => {
|
||||
if (res.code == 0 && res.data.value) {
|
||||
if (res.data.value == '是') {
|
||||
this.getActivity()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
this.userName = uni.getStorageSync('userName')
|
||||
this.getVIPDet()
|
||||
this.getvipdata()
|
||||
},
|
||||
methods: {
|
||||
//去付费须知说明
|
||||
goXieyi() {
|
||||
uni.navigateTo({
|
||||
url: '/me/setting/payXieYi'
|
||||
})
|
||||
},
|
||||
goMoney() {
|
||||
uni.navigateTo({
|
||||
url: '/me/wallet/wallet'
|
||||
})
|
||||
},
|
||||
// 获取活动等级
|
||||
getActivity() {
|
||||
this.$Request.getT('/app/invite/selectInviteAwardByUserId').then(res => {
|
||||
if (res.code == 0) {
|
||||
if (res.data) {
|
||||
this.showjl = true
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
//去助力页面
|
||||
goZl() {
|
||||
uni.navigateTo({
|
||||
url: '/me/assistance/assistance'
|
||||
})
|
||||
this.showjl = false
|
||||
},
|
||||
getvipdata() {
|
||||
let data = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
this.$u.api.userVip(data).then(res => {
|
||||
if (res.code == 0 && res.data && res.data.isVip == 2) {
|
||||
this.isVIP = true;
|
||||
this.vipData = res.data.endTime
|
||||
} else {
|
||||
this.isVIP = false
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
selectWay: function(id) {
|
||||
this.openWay = id;
|
||||
},
|
||||
getVIPDet() {
|
||||
this.$u.api.vipDet().then(res => {
|
||||
if (res.code == 0) {
|
||||
res.data.forEach(ret => {
|
||||
switch (ret.vipNameType) {
|
||||
case 0:
|
||||
ret.type = '月'
|
||||
break;
|
||||
case 1:
|
||||
ret.type = '季'
|
||||
break;
|
||||
case 2:
|
||||
ret.type = '年'
|
||||
break;
|
||||
}
|
||||
})
|
||||
this.VIPlist = res.data
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
duration: 1000,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
bugVIP(e) {
|
||||
if (this.checked == false) {
|
||||
this.$refs.uToast.show({
|
||||
title: '请阅读并同意《付费须知说明》',
|
||||
duration: 1500
|
||||
})
|
||||
return
|
||||
}
|
||||
this.vipId = e
|
||||
this.showPay = true
|
||||
// // #ifdef MP-TOUTIAO
|
||||
// this.toutiaoPay()
|
||||
// // #endif
|
||||
// // #ifndef MP-TOUTIAO
|
||||
// this.showPay = true
|
||||
// // #endif
|
||||
|
||||
},
|
||||
//头条支付
|
||||
toutiaoPay() {
|
||||
let that = this
|
||||
let data = {
|
||||
vipDetailsId: this.vipId
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
title: '支付中...'
|
||||
})
|
||||
this.$Request.getT('/app/order/insertVipOrders', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
let dats = {
|
||||
orderId: res.data.ordersId
|
||||
}
|
||||
if (this.osName == 'ios') {
|
||||
dats.ios = 1
|
||||
}
|
||||
this.$Request.postT('/app/dyPay/payVirtualAppOrder', dats).then(ret => {
|
||||
if (ret.code == 0) {
|
||||
// console.log(JSON.parse(ret.data))
|
||||
let options = {
|
||||
data: JSON.stringify(ret.data.data),
|
||||
byteAuthorization: JSON.stringify(ret.data.byteAuthorization)
|
||||
}
|
||||
tt.requestOrder({
|
||||
data: JSON.stringify(ret.data.data), // 请勿在前端对data做任何处理
|
||||
byteAuthorization: ret.data
|
||||
.byteAuthorization, // 请勿在前端对byteAuthorization做任何处理
|
||||
success(redd) {
|
||||
console.log(JSON.stringify(redd))
|
||||
tt.getOrderPayment({
|
||||
orderId: redd.orderId,
|
||||
success(reee) {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: '支付成功',
|
||||
})
|
||||
setTimeout(d => {
|
||||
let data = {
|
||||
userId: uni
|
||||
.getStorageSync(
|
||||
'userId')
|
||||
}
|
||||
that.$u.api.userVip(data).then(
|
||||
res => {
|
||||
if (res.code ==
|
||||
0 && res
|
||||
.data && res
|
||||
.data
|
||||
.isVip ==
|
||||
2) {
|
||||
uni.setStorageSync(
|
||||
'isVIP',
|
||||
true)
|
||||
} else {
|
||||
uni.setStorageSync(
|
||||
'isVIP',
|
||||
false)
|
||||
}
|
||||
})
|
||||
setTimeout(d => {
|
||||
let data = {
|
||||
flag: true
|
||||
}
|
||||
uni.$emit('back',
|
||||
data)
|
||||
uni.navigateBack(1)
|
||||
}, 1000);
|
||||
}, 2000)
|
||||
},
|
||||
fail(ee) {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: '支付失败，请重试',
|
||||
icon: 'none'
|
||||
})
|
||||
console.log(ee)
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
fail(e) {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: '支付失败，请重试',
|
||||
icon: 'none'
|
||||
})
|
||||
console.log(e)
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: res.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
pay() {
|
||||
let that = this
|
||||
if (that.openWay == 4) { //抖音支付
|
||||
that.toutiaoPay()
|
||||
} else if (that.openWay == 5) { //快手支付
|
||||
uni.showLoading({
|
||||
title: '支付中...'
|
||||
})
|
||||
let data = {
|
||||
vipDetailsId: that.vipId
|
||||
}
|
||||
this.$Request.getT('/app/order/insertVipOrders', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.$Request.postT('/app/ksPay/payAppOrder', {
|
||||
orderId: res.data.ordersId
|
||||
}).then(ree => {
|
||||
if (ree.code == 0) {
|
||||
ks.pay({
|
||||
serviceId: '1', //服务类型id（固定值为‘1’）
|
||||
orderInfo: ree.data,
|
||||
success(succ) {
|
||||
uni.hideLoading()
|
||||
uni.showToast({
|
||||
title: '支付成功'
|
||||
})
|
||||
let data = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
that.$u.api.userVip(data).then(res => {
|
||||
if (res.code == 0 && res.data && res.data
|
||||
.isVip ==
|
||||
2) {
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
})
|
||||
setTimeout(d => {
|
||||
let data = {
|
||||
flag: true
|
||||
}
|
||||
uni.$emit('back', data)
|
||||
uni.navigateBack(1)
|
||||
}, 1000);
|
||||
},
|
||||
fail(err) {
|
||||
uni.hideLoading()
|
||||
that.$refs.uToast.show({
|
||||
title: '支付失败，请重试!',
|
||||
duration: 1500
|
||||
})
|
||||
},
|
||||
})
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
this.$refs.uToast.show({
|
||||
title: ree.msg,
|
||||
duration: 1500
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.hideLoading()
|
||||
this.$refs.uToast.show({
|
||||
title: res.msg,
|
||||
duration: 1500
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
} else {
|
||||
let data = {
|
||||
vipDetailsId: that.vipId
|
||||
}
|
||||
let userId = uni.getStorageSync('userId')
|
||||
that.$u.api.VipOrders(data).then(res => {
|
||||
if (that.openWay == 1) {
|
||||
// #ifdef MP-WEIXIN
|
||||
that.$u.post('app/wxPay/wxPayJsApiOrder?orderId=' + res.data.ordersId).then(ret => {
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay',
|
||||
timeStamp: ret.data.timestamp,
|
||||
nonceStr: ret.data.noncestr,
|
||||
package: ret.data.package,
|
||||
signType: ret.data.signType,
|
||||
paySign: ret.data.sign,
|
||||
success: function(suc) {
|
||||
console.log('success:' + JSON.stringify(suc));
|
||||
that.showPay = false
|
||||
uni.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'success'
|
||||
})
|
||||
|
||||
let data = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
that.$u.api.userVip(data).then(res => {
|
||||
if (res.code == 0 && res.data && res.data
|
||||
.isVip ==
|
||||
2) {
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
})
|
||||
setTimeout(d => {
|
||||
let data = {
|
||||
flag: true
|
||||
}
|
||||
uni.$emit('back', data)
|
||||
uni.navigateBack(1)
|
||||
}, 1000);
|
||||
},
|
||||
fail: function(err) {
|
||||
console.log('fail:' + JSON.stringify(err));
|
||||
uni.showToast({
|
||||
title: '支付失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
});
|
||||
});
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
let ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.indexOf('micromessenger') !== -1) {
|
||||
this.$u.post('/app/wxPay/wxPayMpOrder?orderId=' + res.data.ordersId).then(red => {
|
||||
if (red.code === 0) {
|
||||
this.callPay(red.data);
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '支付失败!'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
// #ifdef APP
|
||||
this.$u.post("/app/wxPay/payAppOrder?orderId=" + res.data.ordersId).then(red => {
|
||||
if (red.code == 0) {
|
||||
that.setPayment('wxpay', JSON.stringify(red
|
||||
.data));
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: red.msg,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
} else if (that.openWay == 2) {
|
||||
// #ifdef H5
|
||||
this.$u.post('/app/aliPay/payOrder?orderId=' + res.data.ordersId + '&classify=2').then(
|
||||
red => {
|
||||
if (red.code === 0) {
|
||||
const div = document.createElement('div')
|
||||
div.innerHTML = red.data //此处form就是后台返回接收到的数据
|
||||
document.body.appendChild(div)
|
||||
document.forms[0].submit()
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '支付失败!'
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// #ifdef APP
|
||||
this.$u.post('/app/aliPay/payOrder?orderId=' + res.data.ordersId + '&classify=1').then(
|
||||
red => {
|
||||
if (red.code === 0) {
|
||||
console.log('1111111')
|
||||
that.setPayment('alipay', red.data);
|
||||
} else {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '支付失败!'
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
} else if (that.openWay == 3) {
|
||||
that.$queue.showLoading('支付中...')
|
||||
that.$Request.postT("/app/order/payOrders", {
|
||||
orderId: res.data.ordersId,
|
||||
}).then(red => {
|
||||
uni.hideLoading();
|
||||
if (red.code == 0) {
|
||||
that.showPay = false
|
||||
uni.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'success'
|
||||
})
|
||||
|
||||
let data = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
that.$u.api.userVip(data).then(res => {
|
||||
if (res.code == 0 && res.data && res.data
|
||||
.isVip ==
|
||||
2) {
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
})
|
||||
setTimeout(d => {
|
||||
let data = {
|
||||
flag: true
|
||||
}
|
||||
uni.$emit('back', data)
|
||||
uni.navigateBack(1)
|
||||
}, 1000);
|
||||
} else {
|
||||
that.$queue.showToast(red.msg)
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
isCheckPay(code, name, order) {
|
||||
if (code == 0) {
|
||||
console.log('999999999999')
|
||||
this.setPayment(name, order);
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: '支付信息有误'
|
||||
});
|
||||
}
|
||||
},
|
||||
setPayment(name, order) {
|
||||
let that = this
|
||||
uni.requestPayment({
|
||||
provider: name,
|
||||
orderInfo: order, //微信、支付宝订单数据
|
||||
success: function(res) {
|
||||
uni.hideLoading();
|
||||
that.showPay = false
|
||||
uni.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'success'
|
||||
})
|
||||
|
||||
let data = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
that.$u.api.userVip(data).then(res => {
|
||||
if (res.code == 0 && res.data && res.data
|
||||
.isVip ==
|
||||
2) {
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
})
|
||||
setTimeout(d => {
|
||||
let data = {
|
||||
flag: true
|
||||
}
|
||||
uni.$emit('back', data)
|
||||
uni.navigateBack(1)
|
||||
}, 1000);
|
||||
},
|
||||
fail: function(err) {
|
||||
uni.hideLoading();
|
||||
},
|
||||
complete() {
|
||||
uni.hideLoading();
|
||||
}
|
||||
});
|
||||
},
|
||||
callPay: function(response) {
|
||||
if (typeof WeixinJSBridge === "undefined") {
|
||||
if (document.addEventListener) {
|
||||
document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(response), false);
|
||||
} else if (document.attachEvent) {
|
||||
document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(response));
|
||||
document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(response));
|
||||
}
|
||||
} else {
|
||||
this.onBridgeReady(response);
|
||||
}
|
||||
},
|
||||
onBridgeReady: function(response) {
|
||||
let that = this;
|
||||
if (!response.package) {
|
||||
return;
|
||||
}
|
||||
console.log("response)))):" + JSON.stringify(response))
|
||||
WeixinJSBridge.invoke(
|
||||
'getBrandWCPayRequest', {
|
||||
"appId": response.appid, //公众号名称，由商户传入
|
||||
"timeStamp": response.timestamp, //时间戳，自1970年以来的秒数
|
||||
"nonceStr": response.noncestr, //随机串
|
||||
"package": response.package,
|
||||
"signType": response.signType, //微信签名方式：
|
||||
"paySign": response.sign //微信签名
|
||||
},
|
||||
function(res) {
|
||||
if (res.err_msg === "get_brand_wcpay_request:ok") {
|
||||
// 使用以上方式判断前端返回,微信团队郑重提示：
|
||||
//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
|
||||
that.showPay = false
|
||||
uni.showToast({
|
||||
title: '支付成功',
|
||||
icon: 'success'
|
||||
})
|
||||
|
||||
let data = {
|
||||
userId: uni.getStorageSync('userId')
|
||||
}
|
||||
that.$u.api.userVip(data).then(res => {
|
||||
if (res.code == 0 && res.data && res.data
|
||||
.isVip ==
|
||||
2) {
|
||||
uni.setStorageSync('isVIP', true)
|
||||
} else {
|
||||
uni.setStorageSync('isVIP', false)
|
||||
}
|
||||
})
|
||||
setTimeout(d => {
|
||||
let data = {
|
||||
flag: true
|
||||
}
|
||||
uni.$emit('back', data)
|
||||
uni.navigateBack(1)
|
||||
}, 1000);
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
}
|
||||
WeixinJSBridge.log(response.err_msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.custom-style {
|
||||
/* background: linear-gradient(90deg, #DBC084 0%, #E9D4A6 100%); */
|
||||
/* padding: 0px 16px; */
|
||||
/* border: 0px; */
|
||||
color: #604320;
|
||||
}
|
||||
|
||||
.illustrate {
|
||||
width: 100%;
|
||||
margin: 30rpx 0;
|
||||
|
||||
.illustrate-box {
|
||||
width: 686rpx;
|
||||
}
|
||||
|
||||
.illustrate-box-txt {
|
||||
color: #ff7581;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/deep/.u-radio__label {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* #ifdef MP-TOUTIAO */
|
||||
/deep/radio::before {
|
||||
content: '' !important;
|
||||
}
|
||||
|
||||
/* #endif */
|
||||
|
||||
|
||||
/deep/.u-mode-center-box {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.zl {
|
||||
width: 518rpx;
|
||||
height: 556rpx;
|
||||
position: relative;
|
||||
background: transparent;
|
||||
|
||||
.zl-bg {
|
||||
width: 518rpx;
|
||||
height: 556rpx;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.zl-title {
|
||||
position: absolute;
|
||||
top: 15%;
|
||||
left: 46%;
|
||||
transform: translate(-50%, 100%);
|
||||
font-size: 44rpx;
|
||||
font-weight: bold;
|
||||
color: #F24364;
|
||||
background: linear-gradient(0deg, #FF5878 0.390625%, #F30931 100%);
|
||||
background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
}
|
||||
|
||||
.zl-titlef {
|
||||
font-size: 14rpx;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
position: absolute;
|
||||
top: 41%;
|
||||
right: 35%;
|
||||
}
|
||||
|
||||
.zl-titlef2 {
|
||||
font-size: 14rpx;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
position: absolute;
|
||||
top: 48%;
|
||||
left: 22%;
|
||||
}
|
||||
|
||||
.zl-titlebtn {
|
||||
font-size: 34rpx;
|
||||
font-weight: bold;
|
||||
background: linear-gradient(0deg, #FF5878 0.390625%, #F30931 100%);
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
position: absolute;
|
||||
bottom: 10%;
|
||||
left: 50%;
|
||||
transform: translate(-65%, 50%);
|
||||
}
|
||||
}
|
||||
|
||||
.btn-bg {
|
||||
width: 64px;
|
||||
height: 28px;
|
||||
background: linear-gradient(90deg, #DBC084 0%, #E9D4A6 100%);
|
||||
color: #604320;
|
||||
border-radius: 28px;
|
||||
text-align: center;
|
||||
line-height: 28px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
</style>
|
||||
572
pages/video/video.nvue
Normal file
572
pages/video/video.nvue
Normal file
@@ -0,0 +1,572 @@
|
||||
<template>
|
||||
<view class="detail">
|
||||
<list @loadmore="getData()" :loadmoreoffset="wHeight*3" :show-scrollbar="false" ref="listBox"
|
||||
:pagingEnabled="true" :scrollable="true">
|
||||
<cell v-for="(item,i) in videoList" :key="i" :ref="'list'+item.courseDetailsId">
|
||||
<view class="swipers-items" @longpress="openBs()" @appear="appear(item.courseDetailsId,i)"
|
||||
:style="boxStyle">
|
||||
<!-- 视频 -->
|
||||
<video :show-fullscreen-btn="false" @controlstoggle="controlstoggles" object-fit="cover"
|
||||
v-if="isShowVideo == item.courseDetailsId && item.videoUrl" :play-strategy="2"
|
||||
:show-loading="true" codec="software" :muted="false" :show-center-play-btn="true" :loop="true"
|
||||
@ended="ended" :enable-progress-gesture="false" :poster="item.titleImg"
|
||||
:ref="'myVideo'+item.courseDetailsId" :id="'myVideo'+item.courseDetailsId" :src="item.videoUrl"
|
||||
:autoplay="item.autoPlay" class="swipers-items-video"></video>
|
||||
<image v-else :src="item.titleImg" class="swipers-items-imgsbg" mode="aspectFill">
|
||||
</image>
|
||||
<!-- 右边操作 -->
|
||||
<view class="swipers-items-right" :style="rightTop" v-if="showControls">
|
||||
<view class="swipers-items-right-item">
|
||||
<view class="swipers-items-right-item-img" @click.stop="dianzan(item)">
|
||||
<image v-if="item.isGood!=null && item.isGood!=0" class="swipers-items-right-item-imgs"
|
||||
src="../../static/images/me/myLove_.png" mode=""></image>
|
||||
<image v-else class="swipers-items-right-item-imgs"
|
||||
src="../../static/images/me/myLove.png" mode=""></image>
|
||||
</view>
|
||||
<view class="swipers-items-right-item-txt">
|
||||
<text class="swipers-items-right-item-txts">
|
||||
{{item.goodNum}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swipers-items-right-item" @click="share()">
|
||||
<view class="swipers-items-right-item-img">
|
||||
<image class="swipers-items-right-item-imgs" src="../../static/images/me/share.png"
|
||||
mode=""></image>
|
||||
</view>
|
||||
<view class="swipers-items-right-item-txt">
|
||||
<text class="swipers-items-right-item-txts">
|
||||
分享
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swipers-items-right-item" v-if="item.isCollect==null || item.isCollect == 0">
|
||||
<view class="swipers-items-right-item-img" @click.stop="shoucang(item)">
|
||||
<image class="swipers-items-right-item-imgs" src="../../static/images/me/shuqian.png"
|
||||
mode=""></image>
|
||||
</view>
|
||||
<view class="swipers-items-right-item-txt">
|
||||
<text class="swipers-items-right-item-txts">
|
||||
追剧
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swipers-items-right-item" v-else>
|
||||
<view class="swipers-items-right-item-img" @click.stop="shoucang(item)">
|
||||
<image class="swipers-items-right-item-imgs" src="../../static/images/me/shuqian_s.png"
|
||||
mode=""></image>
|
||||
</view>
|
||||
<view class="swipers-items-right-item-txt">
|
||||
<text class="swipers-items-right-item-txts">
|
||||
已追
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部视频信息 -->
|
||||
<view class="swipers-items-btom"
|
||||
:style="{bottom:(item.rankCount && item.rankCount<30)?'160rpx':'100rpx'}" v-if="showControls">
|
||||
<view class="swipers-items-btom-box">
|
||||
<!-- 标题 -->
|
||||
<view class="swipers-items-btom-box-title">
|
||||
<text class="swipers-items-btom-box-titles">
|
||||
{{item.title}}
|
||||
</text>
|
||||
</view>
|
||||
<!-- 介绍 -->
|
||||
<view v-if="item.content" class="swipers-items-btom-box-content">
|
||||
<text class="swipers-items-btom-box-contents">{{item.content}}</text>
|
||||
</view>
|
||||
<!-- 集数 -->
|
||||
<view @click="goCourse(item.courseId,item.courseDetailsId)"
|
||||
class="swipers-items-btom-box-num">
|
||||
<text class="swipers-items-btom-box-nums">
|
||||
查看更多续集 >
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</cell>
|
||||
</list>
|
||||
<uni-popup ref="popupBs" :safe-area="true" background-color="#ffffff">
|
||||
<view class="bs">
|
||||
<text class="bs-title">倍速：</text>
|
||||
<view class="bs-se">
|
||||
<view class="bs-se-i" @click="BsChange(index)" :class="nowBs==index?'bsActive':''"
|
||||
v-for="(item,index) in subList" :key="index">
|
||||
<text class="bs-se-it">{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const listDom = uni.requireNativePlugin('dom')
|
||||
import config from '../../common/config.js'
|
||||
import httpsRequest from '../../common/httpRequest.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
nowBs: 1, //当前倍速
|
||||
subList: [{
|
||||
name: '0.5x',
|
||||
num: 0.5
|
||||
}, {
|
||||
name: '1x',
|
||||
num: 1
|
||||
}, {
|
||||
name: '1.25x',
|
||||
num: 1.25
|
||||
}, {
|
||||
name: '1.5x',
|
||||
num: 1.5
|
||||
}],
|
||||
isStart: false, //是否开始生成二维码
|
||||
erweima: '',
|
||||
qrCodeData: '',
|
||||
haibaoImg: '',
|
||||
showImg: false,
|
||||
haibaoShow: false,
|
||||
imgSrc: '',
|
||||
current: 0,
|
||||
maskCustomStyle: {
|
||||
background: 'rgba(0, 0, 0, 0.5)'
|
||||
},
|
||||
show: false,
|
||||
videoList: [],
|
||||
videoContext: null, //记录当前视频的上下文
|
||||
isVIP: false, //是否是vip
|
||||
courseId: '',
|
||||
meunList: [], //菜单
|
||||
meunTop: 37, //返回图标距离顶部的距离
|
||||
num: 1, //当前播放的集数
|
||||
showPay: false, //购买视频的弹窗
|
||||
info: {}, //整部的信息
|
||||
courseDetailsId: '', //详情id
|
||||
scrollIntoView: '', //当前播放视频的位置
|
||||
scrollIntoViews: 'video0', //当前播放视频的位置
|
||||
isVips: '否', //是否显示会员
|
||||
rightTop: {
|
||||
top: '0rpx'
|
||||
},
|
||||
title: '',
|
||||
showControls: true, //是否显示控制中心
|
||||
page: 1,
|
||||
pages: 1,
|
||||
limit: 10,
|
||||
randomNum: 0,
|
||||
wHeight: 0,
|
||||
boxStyle: {
|
||||
'height': 0,
|
||||
'width': '750rpx',
|
||||
},
|
||||
isShowVideo: '',
|
||||
};
|
||||
},
|
||||
onShow() {
|
||||
let that = this
|
||||
//获取设备的高度
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
//计算右侧操作拦的位置
|
||||
that.rightTop.top = res.screenHeight - (440 / 2) + 'rpx'
|
||||
},
|
||||
fail() {
|
||||
//如果获取屏幕的高度失败，那么位置默认设置为通用高度630rpx
|
||||
that.rightTop.top = '630rpx'
|
||||
}
|
||||
})
|
||||
this.page = 1
|
||||
this.randomNum = Math.floor(Math.random() * 33);
|
||||
this.getDataList()
|
||||
},
|
||||
onHide() {
|
||||
try {
|
||||
this.videoContext.stop();
|
||||
this.videoContext = null;
|
||||
setTimeout(() => {
|
||||
this.meunList = [];
|
||||
this.videoList = [];
|
||||
this.current = 0;
|
||||
}, 500)
|
||||
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
const sysInfo = uni.getSystemInfoSync()
|
||||
this.wHeight = sysInfo.windowHeight
|
||||
this.boxStyle.height = this.wHeight + 5;
|
||||
this.$forceUpdate()
|
||||
},
|
||||
methods: {
|
||||
appear(e, index) {
|
||||
this.current = index
|
||||
this.showControls = true
|
||||
this.isShowVideo = e
|
||||
this.scrollIntoViews = 'video' + index
|
||||
this.scrollIntoView = 'video' + index
|
||||
let numIdCurr = this.videoList[index].courseDetailsId;
|
||||
this.videoContextId = 'myVideo' + numIdCurr;
|
||||
this.videoContext = uni.createVideoContext(this.videoContextId, this);
|
||||
//插入历史记录
|
||||
this.setHistor(this.videoList[index].courseId, this.videoList[index].courseDetailsId);
|
||||
this.$forceUpdate()
|
||||
},
|
||||
getData() {
|
||||
if (this.page < this.pages) {
|
||||
this.page += 1
|
||||
this.getDataList()
|
||||
this.$forceUpdate()
|
||||
}
|
||||
},
|
||||
//显示/隐藏适配控制器的回调
|
||||
controlstoggles(e) {
|
||||
this.showControls = e.detail.show
|
||||
console.log(e.detail.show, '显示/隐藏控制栏')
|
||||
},
|
||||
//打开倍速弹框
|
||||
openBs() {
|
||||
this.$refs.popupBs.open('bottom')
|
||||
},
|
||||
//切换倍速
|
||||
BsChange(index) {
|
||||
this.nowBs = index
|
||||
this.videoContext.playbackRate(this.subList[index].num)
|
||||
this.$refs.popupBs.close()
|
||||
uni.showToast({
|
||||
title: '已切换' + this.subList[index].num + '倍播放',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
})
|
||||
},
|
||||
// 跳转资源详情
|
||||
goCourse(e, courseDetailsId) {
|
||||
let userId = uni.getStorageSync('userId')
|
||||
if (userId) {
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/index/course/courseDet?id=' + e
|
||||
// });
|
||||
uni.navigateTo({
|
||||
url: '/me/detail/detail?id=' + e + '&courseDetailsId=' + courseDetailsId
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
},
|
||||
//分享-复制app下载连接
|
||||
share() {
|
||||
let invitationCode = ''
|
||||
let qdCode = ''
|
||||
if (uni.getStorageSync('invitationCode')) {
|
||||
invitationCode = uni.getStorageSync('invitationCode')
|
||||
}
|
||||
if (uni.getStorageSync('qdCode')) {
|
||||
qdCode = uni.getStorageSync('qdCode')
|
||||
}
|
||||
let url = config.APIHOST2 + '/pages/login/registerApp?invitation=' + invitationCode + '&qdCode=' + qdCode
|
||||
uni.setClipboardData({
|
||||
data: url,
|
||||
success(res) {
|
||||
uni.showToast({
|
||||
title: '已复制链接'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
//收藏
|
||||
shoucang(item) {
|
||||
if (uni.getStorageSync('token')) {
|
||||
let data = {
|
||||
courseId: item.courseId,
|
||||
courseDetailsId: item.courseDetailsId,
|
||||
classify: 1,
|
||||
type: item.isCollect == 0 ? 1 : 0
|
||||
}
|
||||
httpsRequest.postJson('/app/courseCollect/insertCourseCollect', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
if (data.type == 1) {
|
||||
item.isCollect = 1;
|
||||
} else {
|
||||
item.isCollect = 0;
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
//点赞
|
||||
dianzan(item) {
|
||||
if (uni.getStorageSync('token')) {
|
||||
let data = {
|
||||
courseId: item.courseId,
|
||||
courseDetailsId: item.courseDetailsId,
|
||||
classify: 2,
|
||||
type: item.isGood == 0 ? 1 : 0
|
||||
};
|
||||
httpsRequest.postJson('/app/courseCollect/insertCourseCollect', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
if (data.type == 1) {
|
||||
item.isGood = 1;
|
||||
item.goodNum += 1;
|
||||
} else {
|
||||
item.isGood = 0;
|
||||
item.goodNum -= 1;
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
ended() {
|
||||
console.log(this.current, 'eeeeeeeeeeeee')
|
||||
if (this.current < this.videoList.length - 1) {
|
||||
// this.current += 1
|
||||
this.$nextTick(() => {
|
||||
let courseDetailsId = this.videoList[this.current + 1].courseDetailsId
|
||||
console.log(courseDetailsId, '开始移动了')
|
||||
const el = this.$refs['list' + courseDetailsId][0]
|
||||
listDom.scrollToElement(el, {})
|
||||
this.$forceUpdate()
|
||||
console.log(el, '移动结束')
|
||||
})
|
||||
}
|
||||
},
|
||||
/**
|
||||
* @param {Number} courseId 总id
|
||||
* @param {Number} courseDetailsId 当前视频id
|
||||
* @param {boolean} type 是购买后返回的还是直接进来的
|
||||
*/
|
||||
getDataList() {
|
||||
let data = {
|
||||
page: this.page,
|
||||
limit: this.limit,
|
||||
token: uni.getStorageSync('token') ? uni.getStorageSync('token') : '',
|
||||
randomNum: this.randomNum
|
||||
};
|
||||
httpsRequest.getT('/app/course/selectCourseDetailsList', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.pages = res.data.totalPage
|
||||
if (res.data.list) {
|
||||
let arr = JSON.parse(JSON.stringify(res.data.list))
|
||||
arr.map((item, index) => {
|
||||
item.autoPlay = true
|
||||
})
|
||||
//菜单数组
|
||||
if (this.page == 1) {
|
||||
this.videoList = arr
|
||||
this.isShowVideo = this.videoList[0].courseDetailsId
|
||||
} else {
|
||||
this.videoList = [...this.videoList, ...arr]
|
||||
}
|
||||
if (this.page == 1) {
|
||||
let numIdCurr = this.videoList[0].courseDetailsId;
|
||||
this.videoContextId = 'myVideo' + numIdCurr;
|
||||
this.$nextTick(() => {
|
||||
this.videoContext = uni.createVideoContext(this.videoContextId, this);
|
||||
this.videoContext.play();
|
||||
})
|
||||
if (uni.getStorageSync('token')) { //如果有token则插入
|
||||
//插入历史记录
|
||||
this.setHistor(this.videoList[this.current].courseId, this.videoList[this
|
||||
.current]
|
||||
.courseDetailsId)
|
||||
}
|
||||
}
|
||||
|
||||
this.$forceUpdate()
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '加载失败',
|
||||
icon: 'none'
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
},
|
||||
//插入观看记录
|
||||
setHistor(courseId, courseDetailsId) {
|
||||
if (uni.getStorageSync('token')) {
|
||||
let data = {
|
||||
courseId: courseId,
|
||||
courseDetailsId: courseDetailsId,
|
||||
classify: 3,
|
||||
type: 1
|
||||
};
|
||||
httpsRequest.postJson('/app/courseCollect/insertCourseCollect', data).then(res => {})
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.bs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx;
|
||||
|
||||
}
|
||||
|
||||
.bs-title {
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.bs-se {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
background-color: #eeeeef;
|
||||
padding: 10rpx 20rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.bs-se-it {
|
||||
font-size: 24rpx;
|
||||
width: 100rpx;
|
||||
padding: 16rpx 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bsActive {
|
||||
background-color: #ffffff;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
.detail {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
background-color: #000;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.swipers {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swipers-item {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swipers-items {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
position: relative;
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
.swipers-items-video {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swipers-items-imgsbg {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swipers-items-right {
|
||||
position: absolute;
|
||||
width: 60rpx;
|
||||
top: 100rpx;
|
||||
right: 20rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item {
|
||||
width: 60rpx;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item-imgs {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.swipers-items-right-item-img {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item-imgs {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item-txt {
|
||||
width: 60rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item-txts {
|
||||
width: 60rpx;
|
||||
color: #ffffff;
|
||||
font-size: 24rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.swipers-items-btom {
|
||||
width: 750rpx;
|
||||
position: absolute;
|
||||
/* bottom: 140rpx; */
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box {
|
||||
width: 710rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-title {
|
||||
width: 710rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-titles {
|
||||
width: 710rpx;
|
||||
color: #ffffff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-content {
|
||||
width: 710rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-contents {
|
||||
width: 710rpx;
|
||||
color: #ffffff;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-num {
|
||||
width: 750rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-nums {
|
||||
width: 710rpx;
|
||||
color: #ffffff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
</style>
|
||||
1099
pages/video/video.vue
Normal file
1099
pages/video/video.vue
Normal file
File diff suppressed because it is too large
Load Diff
563
pages/video/videoIOS.nvue
Normal file
563
pages/video/videoIOS.nvue
Normal file
@@ -0,0 +1,563 @@
|
||||
<template>
|
||||
<view class="detail">
|
||||
<swiper @longpress="openBs()" :circular="false" class="swipers" @change="change" :current="current"
|
||||
:vertical="true" :indicator-dots="false" :autoplay="false" :interval="3000" :duration="300">
|
||||
<swiper-item class="swipers-item" v-for="(item,index) in videoList" :key="item.courseDetailsId">
|
||||
<view class="swipers-items">
|
||||
<!-- 视频 -->
|
||||
<video :show-fullscreen-btn="false" @controlstoggle="controlstoggles" object-fit="cover"
|
||||
v-if="current === index && item.videoUrl" :play-strategy="2" :show-loading="true"
|
||||
codec="software" :muted="false" :show-center-play-btn="true" :loop="true" @ended="ended"
|
||||
:enable-progress-gesture="false" :poster="item.titleImg" :ref="'myVideo'+item.courseDetailsId"
|
||||
:id="'myVideo'+item.courseDetailsId" :src="item.videoUrl" :autoplay="item.autoPlay"
|
||||
class="swipers-items-video"></video>
|
||||
<image v-else :src="item.titleImg" class="swipers-items-imgsbg" mode="aspectFill">
|
||||
</image>
|
||||
<!-- 右边操作 -->
|
||||
<view class="swipers-items-right" :style="rightTop" v-if="showControls">
|
||||
<view class="swipers-items-right-item">
|
||||
<view class="swipers-items-right-item-img" @click.stop="dianzan(item)">
|
||||
<image v-if="item.isGood!=null && item.isGood!=0" class="swipers-items-right-item-imgs"
|
||||
src="../../static/images/me/myLove_.png" mode=""></image>
|
||||
<image v-else class="swipers-items-right-item-imgs"
|
||||
src="../../static/images/me/myLove.png" mode=""></image>
|
||||
</view>
|
||||
<view class="swipers-items-right-item-txt">
|
||||
<text class="swipers-items-right-item-txts">
|
||||
{{item.goodNum}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swipers-items-right-item" @click="share()">
|
||||
<view class="swipers-items-right-item-img">
|
||||
<image class="swipers-items-right-item-imgs" src="../../static/images/me/share.png"
|
||||
mode=""></image>
|
||||
</view>
|
||||
<view class="swipers-items-right-item-txt">
|
||||
<text class="swipers-items-right-item-txts">
|
||||
分享
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swipers-items-right-item" v-if="item.isCollect==null || item.isCollect == 0">
|
||||
<view class="swipers-items-right-item-img" @click.stop="shoucang(item)">
|
||||
<image class="swipers-items-right-item-imgs" src="../../static/images/me/shuqian.png"
|
||||
mode=""></image>
|
||||
</view>
|
||||
<view class="swipers-items-right-item-txt">
|
||||
<text class="swipers-items-right-item-txts">
|
||||
追剧
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="swipers-items-right-item" v-else>
|
||||
<view class="swipers-items-right-item-img" @click.stop="shoucang(item)">
|
||||
<image class="swipers-items-right-item-imgs" src="../../static/images/me/shuqian_s.png"
|
||||
mode=""></image>
|
||||
</view>
|
||||
<view class="swipers-items-right-item-txt">
|
||||
<text class="swipers-items-right-item-txts">
|
||||
已追
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 底部视频信息 -->
|
||||
<view class="swipers-items-btom" v-if="showControls">
|
||||
<view class="swipers-items-btom-box">
|
||||
<!-- 标题 -->
|
||||
<view class="swipers-items-btom-box-title">
|
||||
<text class="swipers-items-btom-box-titles">
|
||||
{{item.title}}
|
||||
</text>
|
||||
</view>
|
||||
<!-- 介绍 -->
|
||||
<view v-if="item.content" class="swipers-items-btom-box-content">
|
||||
<text class="swipers-items-btom-box-contents">{{item.content}}</text>
|
||||
</view>
|
||||
<!-- 集数 -->
|
||||
<view @click="goCourse(item.courseId,item.courseDetailsId)"
|
||||
class="swipers-items-btom-box-num">
|
||||
<text class="swipers-items-btom-box-nums">
|
||||
查看更多续集 >
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<uni-popup ref="popupBs" :safe-area="true" background-color="#ffffff">
|
||||
<view class="bs">
|
||||
<text class="bs-title">倍速：</text>
|
||||
<view class="bs-se">
|
||||
<view class="bs-se-i" @click="BsChange(index)" :class="nowBs==index?'bsActive':''"
|
||||
v-for="(item,index) in subList" :key="index">
|
||||
<text class="bs-se-it">{{item.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import config from '../../common/config.js'
|
||||
import httpsRequest from '../../common/httpRequest.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
nowBs: 1, //当前倍速
|
||||
subList: [{
|
||||
name: '0.5x',
|
||||
num: 0.5
|
||||
}, {
|
||||
name: '1x',
|
||||
num: 1
|
||||
}, {
|
||||
name: '1.25x',
|
||||
num: 1.25
|
||||
}, {
|
||||
name: '1.5x',
|
||||
num: 1.5
|
||||
}],
|
||||
isStart: false, //是否开始生成二维码
|
||||
erweima: '',
|
||||
qrCodeData: '',
|
||||
haibaoImg: '',
|
||||
showImg: false,
|
||||
haibaoShow: false,
|
||||
imgSrc: '',
|
||||
current: 0,
|
||||
maskCustomStyle: {
|
||||
background: 'rgba(0, 0, 0, 0.5)'
|
||||
},
|
||||
show: false,
|
||||
videoList: [],
|
||||
videoContext: null, //记录当前视频的上下文
|
||||
isVIP: false, //是否是vip
|
||||
courseId: '',
|
||||
meunList: [], //菜单
|
||||
meunTop: 37, //返回图标距离顶部的距离
|
||||
num: 1, //当前播放的集数
|
||||
showPay: false, //购买视频的弹窗
|
||||
info: {}, //整部的信息
|
||||
courseDetailsId: '', //详情id
|
||||
scrollIntoView: '', //当前播放视频的位置
|
||||
scrollIntoViews: 'video0', //当前播放视频的位置
|
||||
isVips: '否', //是否显示会员
|
||||
rightTop: {
|
||||
top: '0rpx'
|
||||
},
|
||||
title: '',
|
||||
showControls: true, //是否显示控制中心
|
||||
page: 1,
|
||||
pages: 1,
|
||||
limit: 5,
|
||||
randomNum: 0
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
current(newData, oldData) {
|
||||
if ((newData + 1) == (this.limit * this.page)) { //最后一条了
|
||||
if (this.page < this.pages) {
|
||||
this.page += 1
|
||||
this.getDataList()
|
||||
}
|
||||
this.$forceUpdate()
|
||||
}
|
||||
},
|
||||
},
|
||||
onShow() {
|
||||
let that = this
|
||||
//获取设备的高度
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
//计算右侧操作拦的位置
|
||||
that.rightTop.top = res.screenHeight - (440 / 2) + 'rpx'
|
||||
},
|
||||
fail() {
|
||||
//如果获取屏幕的高度失败，那么位置默认设置为通用高度630rpx
|
||||
that.rightTop.top = '630rpx'
|
||||
}
|
||||
})
|
||||
this.page = 1
|
||||
this.randomNum = Math.floor(Math.random() * 33);
|
||||
this.getDataList()
|
||||
},
|
||||
onHide() {
|
||||
try {
|
||||
this.videoContext.stop();
|
||||
this.videoContext = null;
|
||||
setTimeout(() => {
|
||||
this.meunList = [];
|
||||
this.videoList = [];
|
||||
this.current = 0;
|
||||
}, 500)
|
||||
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
//显示/隐藏适配控制器的回调
|
||||
controlstoggles(e) {
|
||||
this.showControls = e.detail.show
|
||||
console.log(e.detail.show, '显示/隐藏控制栏')
|
||||
},
|
||||
//打开倍速弹框
|
||||
openBs() {
|
||||
this.$refs.popupBs.open('bottom')
|
||||
},
|
||||
//切换倍速
|
||||
BsChange(index) {
|
||||
this.nowBs = index
|
||||
this.videoContext.playbackRate(this.subList[index].num)
|
||||
this.$refs.popupBs.close()
|
||||
uni.showToast({
|
||||
title: '已切换' + this.subList[index].num + '倍播放',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
})
|
||||
},
|
||||
// 跳转资源详情
|
||||
goCourse(e, courseDetailsId) {
|
||||
let userId = uni.getStorageSync('userId')
|
||||
if (userId) {
|
||||
// uni.navigateTo({
|
||||
// url: '/pages/index/course/courseDet?id=' + e
|
||||
// });
|
||||
uni.navigateTo({
|
||||
url: '/me/detail/detail?id=' + e + '&courseDetailsId=' + courseDetailsId
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
},
|
||||
//分享-复制app下载连接
|
||||
share() {
|
||||
let invitationCode = ''
|
||||
let qdCode = ''
|
||||
if (uni.getStorageSync('invitationCode')) {
|
||||
invitationCode = uni.getStorageSync('invitationCode')
|
||||
}
|
||||
if (uni.getStorageSync('qdCode')) {
|
||||
qdCode = uni.getStorageSync('qdCode')
|
||||
}
|
||||
let url = config.APIHOST2 + '/pages/login/registerApp?invitation=' + invitationCode + '&qdCode=' + qdCode
|
||||
uni.setClipboardData({
|
||||
data: url,
|
||||
success(res) {
|
||||
uni.showToast({
|
||||
title: '已复制链接'
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
//收藏
|
||||
shoucang(item) {
|
||||
if (uni.getStorageSync('token')) {
|
||||
let data = {
|
||||
courseId: item.courseId,
|
||||
courseDetailsId: item.courseDetailsId,
|
||||
classify: 1,
|
||||
type: item.isCollect == 0 ? 1 : 0
|
||||
}
|
||||
httpsRequest.postJson('/app/courseCollect/insertCourseCollect', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
if (data.type == 1) {
|
||||
item.isCollect = 1;
|
||||
} else {
|
||||
item.isCollect = 0;
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
//点赞
|
||||
dianzan(item) {
|
||||
if (uni.getStorageSync('token')) {
|
||||
let data = {
|
||||
courseId: item.courseId,
|
||||
courseDetailsId: item.courseDetailsId,
|
||||
classify: 2,
|
||||
type: item.isGood == 0 ? 1 : 0
|
||||
};
|
||||
httpsRequest.postJson('/app/courseCollect/insertCourseCollect', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
if (data.type == 1) {
|
||||
item.isGood = 1;
|
||||
item.goodNum += 1;
|
||||
} else {
|
||||
item.isGood = 0;
|
||||
item.goodNum -= 1;
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/login"
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
//swiper上下切换事件
|
||||
change(e) {
|
||||
console.log(e, '111111111111111111')
|
||||
this.showControls = true
|
||||
//拿出当前的swiper索引
|
||||
let current = Number(e.detail.current);
|
||||
this.scrollIntoView = 'video' + current
|
||||
this.$nextTick(() => {
|
||||
this.current = current
|
||||
this.startPlay(current)
|
||||
})
|
||||
if (uni.getStorageSync('token')) {
|
||||
//插入历史记录
|
||||
this.setHistor(this.videoList[this.current].courseId, this.videoList[this.current].courseDetailsId);
|
||||
}
|
||||
|
||||
},
|
||||
//控制播放
|
||||
startPlay(current) {
|
||||
if (this.videoContext) { //判断之前是否有视频的上下文
|
||||
this.videoContext.stop();
|
||||
this.videoContext = null;
|
||||
}
|
||||
let numIdCurr = this.videoList[current].courseDetailsId;
|
||||
// 播放时记录当前播放的id
|
||||
this.videoContextId = 'myVideo' + numIdCurr;
|
||||
this.videoContext = uni.createVideoContext(this.videoContextId, this);
|
||||
this.$nextTick(() => {
|
||||
//播放当前的
|
||||
this.videoContext.play();
|
||||
this.$forceUpdate();
|
||||
})
|
||||
},
|
||||
ended() {
|
||||
if (this.current < this.videoList.length - 1) {
|
||||
this.current += 1
|
||||
}
|
||||
},
|
||||
/**
|
||||
* @param {Number} courseId 总id
|
||||
* @param {Number} courseDetailsId 当前视频id
|
||||
* @param {boolean} type 是购买后返回的还是直接进来的
|
||||
*/
|
||||
getDataList() {
|
||||
let data = {
|
||||
page: this.page,
|
||||
limit: this.limit,
|
||||
token: uni.getStorageSync('token') ? uni.getStorageSync('token') : '',
|
||||
randomNum: this.randomNum
|
||||
};
|
||||
httpsRequest.getT('/app/course/selectCourseDetailsList', data).then(res => {
|
||||
if (res.code == 0) {
|
||||
this.pages = res.data.totalPage
|
||||
if (res.data.list) {
|
||||
let arr = JSON.parse(JSON.stringify(res.data.list))
|
||||
arr.map((item, index) => {
|
||||
item.autoPlay = true
|
||||
})
|
||||
//菜单数组
|
||||
if (this.page == 1) {
|
||||
this.videoList = arr
|
||||
} else {
|
||||
this.videoList = [...this.videoList, ...arr]
|
||||
}
|
||||
if (this.page == 1) {
|
||||
let numIdCurr = this.videoList[0].courseDetailsId;
|
||||
this.videoContextId = 'myVideo' + numIdCurr;
|
||||
|
||||
this.$nextTick(() => {
|
||||
this.videoContext = uni.createVideoContext(this.videoContextId, this);
|
||||
this.videoContext.play();
|
||||
})
|
||||
if (uni.getStorageSync('token')) { //如果有token则插入
|
||||
//插入历史记录
|
||||
this.setHistor(this.videoList[this.current].courseId, this.videoList[this
|
||||
.current]
|
||||
.courseDetailsId)
|
||||
}
|
||||
}
|
||||
|
||||
this.$forceUpdate()
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '加载失败',
|
||||
icon: 'none'
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
},
|
||||
//插入观看记录
|
||||
setHistor(courseId, courseDetailsId) {
|
||||
let data = {
|
||||
courseId: courseId,
|
||||
courseDetailsId: courseDetailsId,
|
||||
classify: 3,
|
||||
type: 1
|
||||
};
|
||||
httpsRequest.postJson('/app/courseCollect/insertCourseCollect', data).then(res => {})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.bs {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx;
|
||||
|
||||
}
|
||||
|
||||
.bs-title {
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.bs-se {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
background-color: #eeeeef;
|
||||
padding: 10rpx 20rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.bs-se-it {
|
||||
font-size: 24rpx;
|
||||
width: 100rpx;
|
||||
padding: 16rpx 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.bsActive {
|
||||
background-color: #ffffff;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
|
||||
.detail {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
.swipers {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swipers-item {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swipers-items {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
position: relative;
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
.swipers-items-video {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swipers-items-imgsbg {
|
||||
width: 750rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.swipers-items-right {
|
||||
position: absolute;
|
||||
width: 60rpx;
|
||||
top: 100rpx;
|
||||
right: 20rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item {
|
||||
width: 60rpx;
|
||||
margin-bottom: 40rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item-img {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item-imgs {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item-txt {
|
||||
width: 60rpx;
|
||||
}
|
||||
|
||||
.swipers-items-right-item-txts {
|
||||
width: 60rpx;
|
||||
color: #ffffff;
|
||||
font-size: 24rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.swipers-items-btom {
|
||||
width: 750rpx;
|
||||
position: absolute;
|
||||
bottom: 100rpx;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box {
|
||||
width: 710rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-title {
|
||||
width: 710rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-titles {
|
||||
width: 710rpx;
|
||||
color: #ffffff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-content {
|
||||
width: 710rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-contents {
|
||||
width: 710rpx;
|
||||
color: #ffffff;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-num {
|
||||
width: 750rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.swipers-items-btom-box-nums {
|
||||
width: 710rpx;
|
||||
color: #ffffff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user