Commit 9634c1e9 by tangjiale

更新代码

parent e009b253
......@@ -3,7 +3,7 @@
* @eMail: 932055106@qq.com
* @Date: 2022-01-13 17:47:44
* @LastEditors: tangjiale
* @LastEditTime: 2022-06-08 19:59:38
* @LastEditTime: 2022-06-14 11:38:14
*/
// wx.setStorageSync('host', 'https://sdb.youchengzhang.cn/'); //正式环境
// wx.setStorageSync('host', 'https://test.xiaobentiyu.cn'); //测试环境
......
......@@ -6,7 +6,8 @@
"pages/sport/sport",
"subPages/course/list/list",
"subPages/course/detail/detail",
"subPages/course/pay/pay"
"subPages/course/pay/pay",
"subPages/course/order/order"
],
"subpackages": [
{
......@@ -52,15 +53,15 @@
"pages": [
"login/index",
"mobile-login/mobile-login",
"privacy/privacy"
"privacy/privacy",
"role-list/role-list"
]
}
],
"tabBar": {
"custom": true,
"color": "#222222",
"selectedColor": "#39BF3E",
"backgroundColor": "#fff",
"color": "#000000",
"selectedColor": "#FF811E",
"list": [
{
"pagePath": "pages/index/index",
......@@ -98,7 +99,7 @@
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTitleText": "奔腾宝贝",
"navigationBarTitleText": "",
"navigationBarTextStyle": "black"
},
"sitemapLocation": "sitemap.json",
......
<!--components/icon/icon.wxml-->
<view class="hnfont iconfont {{type}} custom-class" style='{{ styleObj ||"" }}{{ color ? "color:" + color + ";" : "" }}font-size: {{size}}rpx;'></view>
\ No newline at end of file
// components/icon/icon.js
/*
* @Author: tangjiale
* @eMail: 932055106@qq.com
* @Date: 2022-04-28 16:07:44
* @LastEditors: tangjiale
* @LastEditTime: 2022-05-07 11:16:28
*/
Component({
externalClasses: ['custom-class'],
......
<view class="xbfont iconfont {{type}} custom-class" style='{{ styleObj ||"" }}{{ color ? "color:" + color + ";" : "" }}font-size: {{size}}rpx;'></view>
\ No newline at end of file
/* components/icon/icon.wxss */
@import '/css/iconfont.wxss';
.hnfont{
.xbfont{
display: inline-block;
vertical-align: middle;
}
\ No newline at end of file
......@@ -3,20 +3,20 @@
* @eMail: 932055106@qq.com
* @Date: 2022-06-06 11:29:18
* @LastEditors: tangjiale
* @LastEditTime: 2022-06-11 17:37:33
* @LastEditTime: 2022-06-14 11:35:23
*/
const organTab = [
{
pagePath: "/pages/index/index",
type:'page',
iconPath: "/tabBarImg/xztab-0.png",
selectedIconPath: "/tabBarImg/xztab-1-active.png",
iconPath: "/tabBarImg/kc-tab.png",
selectedIconPath: "/tabBarImg/kc-tab-active.png",
text: "首页"
}, {
pagePath: "/pages/mine/mine",
type:'page',
iconPath: "/tabBarImg/xztab-0.png",
selectedIconPath: "/tabBarImg/xztab-1-active.png",
iconPath: "/tabBarImg/my-tab.png",
selectedIconPath: "/tabBarImg/my-tab-active.png",
text: "我的"
}
]
......@@ -24,20 +24,20 @@ const parentTab = [
{
pagePath: "/pages/index/index",
type:'page',
iconPath: "/tabBarImg/xztab-0.png",
selectedIconPath: "/tabBarImg/xztab-1-active.png",
iconPath: "/tabBarImg/kc-tab.png",
selectedIconPath: "/tabBarImg/kc-tab-active.png",
text: "课程"
},{
pagePath: "/pages/sport/sport",
type:'page',
iconPath: "/tabBarImg/xztab-0.png",
selectedIconPath: "/tabBarImg/xztab-1-active.png",
iconPath: "/tabBarImg/yd-tab.png",
selectedIconPath: "/tabBarImg/yd-tab-active.png",
text: "运动"
},{
pagePath: "/pages/my/my",
type:'page',
iconPath: "/tabBarImg/xztab-0.png",
selectedIconPath: "/tabBarImg/xztab-1-active.png",
iconPath: "/tabBarImg/my-tab.png",
selectedIconPath: "/tabBarImg/my-tab-active.png",
text: "我的"
}
]
......@@ -45,8 +45,8 @@ const parentTab = [
Component({
data: {
selected: 0,
color: "#B3B3B3",
selectedColor: "#333333",
color: "rgba(0,0,0,0.9)",
selectedColor: "#FF811E",
list: []
},
attached() {
......
......@@ -3,9 +3,10 @@
bottom: 0;
left: 0;
right: 0;
height: 94rpx;
height: 112rpx;
background: white;
display: flex;
box-shadow: 0px -4rpx 16rpx 2rpx rgba(0, 0, 0, 0.04);
padding-bottom: env(safe-area-inset-bottom);
}
......@@ -19,15 +20,19 @@
}
.tab-bar-item {
font-size: 20rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
flex: 1;
line-height: 20rpx;
}
.tab-bar-item cover-image {
margin-top: 21rpx;
margin-top: 16rpx;
margin-left: auto;
margin-right: auto;
width: 34rpx;
height: 34rpx;
width: 56rpx;
height: 56rpx;
}
.tab-bar-item cover-view {
......
......@@ -3,7 +3,7 @@
* @eMail: 932055106@qq.com
* @Date: 2022-06-06 14:11:05
* @LastEditors: tangjiale
* @LastEditTime: 2022-06-07 09:27:30
* @LastEditTime: 2022-06-15 09:00:29
*/
const app = getApp()
var API = require("../../utils/request.js");
......@@ -13,7 +13,12 @@ Page({
* 页面的初始数据
*/
data: {
tyCourseList:[], //体验课
page:0,
list:[],
loading:false,
finish:false
},
/**
......@@ -21,6 +26,12 @@ Page({
*/
onLoad: function (options) {
this.aiUrl()
this.queryRecomdList()
this.setData({
page:0,list:[],loading:false,finish:false
})
this.queryList()
},
onShow: function () {
......@@ -35,6 +46,55 @@ Page({
},
queryRecomdList(){
let that = this
//type 1正式课 2体验课
API.getData('/px/course/getMobileCourseList', {page:1,size:2,type:2}, function (res) {
if(res && res.data && res.data.length){
res.data.forEach(item => {
item['_empNames'] = item.pxEmployeeList && item.pxEmployeeList.length && (item.pxEmployeeList.map(v => v.empName)).join('、') || ''
})
}
that.setData({tyCourseList:res.data})
});
},
queryList(){
let that = this
this.data.page ++
this.data.loading = true
API.getData('/px/course/getMobileCourseList', {
page:that.data.page,
size:10,
type:1, //课程类型(1:正式课,2:体验课)
}, (res) => {
that.data.loading = true
if(res.data && res.data.length){
res.data.forEach(item => {
item['_empNames'] = item.pxEmployeeList && item.pxEmployeeList.length && (item.pxEmployeeList.map(v => v.empName)).join('、') || ''
})
}
that.data.finish = res.data.length < 10
that.data.list = that.data.list.concat(res.data || [])
that.setData({
page:that.data.page,
finish:that.data.finish,
loading:that.data.loading,
list:that.data.list
})
});
},
gotoDetail(e){
let {id} = e.currentTarget.dataset
wx.navigateTo({
url: '../../subPages/course/detail/detail?id=' + id,
})
},
gotoList(e){
let {type} = e.currentTarget.dataset
wx.navigateTo({
url: '../../subPages/course/list/list?type=' + type,
})
},
aiUrl() {
var that = this;
API.getData('/index/getConfContent', {
......@@ -76,7 +136,8 @@ Page({
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
if(this.data.loading && this.data.finish) return
this.queryList()
},
/**
......
{
"usingComponents": {}
"usingComponents": {},
"navigationBarTitleText": "小奔体育"
}
\ No newline at end of file
<view class="page-bg">
首页
<view class="content">
<view class="content-head">
<view class="content-title">推荐体验课</view>
<view class="content-btn" data-type="2" bindtap="gotoList">查看更多</view>
</view>
<view class="course-bg" wx:for="{{tyCourseList}}" data-id="{{item.id}}" bindtap="gotoDetail">
<view class="course-img">
<image class="course-img" src="{{item.poster}}" mode="aspectFill"></image>
<view class="fexed-num">{{item.peopleNum || 0}}人已体验</view>
</view>
<view class="course-info">
<view class="course-info-h">
<view class="course-title">{{item.name}}</view>
<view class="course-tag">
<view class="tag-item {{item.courseStep==1?'xx-color':item.courseStep==2?'cz-color':'gz-color'}}">{{item.courseStep==1?'小学':item.courseStep==2?'初中':'高中'}}组</view>
<view class="tag-item">{{item.classHour}}课时</view>
<view class="tag-item">{{['','基础班','提高班','精英班','赛事班'][item.leveId]}}</view>
</view>
</view>
<view class="btm-text">
<view class="empNames-w">授课教练 {{item._empNames}}</view>
</view>
</view>
</view>
</view>
<view class="content" style="margin-top:60rpx">
<view class="content-head">
<view class="content-title">最热门班课</view>
<view class="content-btn" data-type="1" bindtap="gotoList">查看更多</view>
</view>
<view class="waterfall-flex">
<view class="flex-item">
<view class="w-course" wx:for="{{list}}" wx:if="{{index%2 == 0}}" data-id="{{item.id}}" bindtap="gotoDetail">
<view class="w-course-img">
<image class="w-course-img" src="{{item.poster}}" mode="aspectFill"></image>
<view class="fexed-num">已购 {{item.peopleNum || 0}}人</view>
</view>
<view class="w-course-title">{{item.name}}</view>
<view class="course-tag">
<view class="tag-item {{item.courseStep==1?'xx-color':item.courseStep==2?'cz-color':'gz-color'}}">{{item.courseStep==1?'小学':item.courseStep==2?'初中':'高中'}}组</view>
<view class="tag-item">{{item.classHour}}课时</view>
<view class="tag-item">{{['','基础班','提高班','精英班','赛事班'][item.leveId]}}</view>
</view>
<view class="w-empNames">授课教练 {{item._empNames}}</view>
</view>
</view>
<view class="flex-item">
<view class="w-course" wx:for="{{list}}" wx:if="{{index%2 == 1}}" data-id="{{item.id}}" bindtap="gotoDetail">
<view class="w-course-img">
<image class="w-course-img" src="{{item.poster}}" mode="aspectFill"></image>
<view class="fexed-num">已购 {{item.peopleNum || 0}}人</view>
</view>
<view class="w-course-title">{{item.name}}</view>
<view class="course-tag">
<view class="tag-item {{item.courseStep==1?'xx-color':item.courseStep==2?'cz-color':'gz-color'}}">{{item.courseStep==1?'小学':item.courseStep==2?'初中':'高中'}}组</view>
<view class="tag-item">{{item.classHour}}课时</view>
<view class="tag-item">{{['','基础班','提高班','精英班','赛事班'][item.leveId]}}</view>
</view>
<view class="w-empNames">授课教练 {{item._empNames}}</view>
</view>
</view>
</view>
</view>
</view>
\ No newline at end of file
.page-bg{
overflow: hidden;
min-height: 100vh;
width: 100%;
background-color: #f5f5f5;
background-color: #fff;
padding-bottom: 100rpx;
}
.content{
margin: 20rpx 30rpx 0rpx 30rpx;
width: calc(100% - 60rpx);
}
.content-head{
display: flex;
align-items: center;
justify-content: space-between;
}
.content-title{
font-size: 34rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: rgba(0, 0, 0, 0.9);
}
.empNames-w{
position: relative;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.content-btn{
padding: 6rpx 20rpx;
border-radius: 24rpx;
opacity: 1;
border: 1rpx solid rgba(0, 0, 0, 0.15);
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
line-height: 24rpx;
}
.course-bg{
margin-top: 20rpx;
display: flex;
align-items: center;
}
.course-img{
position: relative;
width: 300rpx;
height: 186rpx;
border-radius: 24rpx;
object-fit: cover;
object-position: center;
}
.fexed-num{
position: absolute;
left: 10rpx;
bottom: 10rpx;
padding: 6rpx 16rpx;
border-radius: 22rpx;
background-color: rgba(0,0,0,0.24);
font-size: 22rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
.course-info{
height: 186rpx;
width: calc(100% - 320rpx);
margin-left: 20rpx;
}
.course-title{
font-size: 30rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #000000;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.course-info-h{
height: 155rpx;
}
.course-tag{
margin-top: 10rpx;
display: flex;
align-items: center;
}
.tag-item{
margin-right: 10rpx;
padding: 4rpx 10rpx;
background: #F8F8F8;
border-radius: 8rpx;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.xx-color{
background: rgba(45, 137,255, 0.12) !important;
color: #2D89FF !important;
}
.cz-color{
background: rgba(0, 187,104, 0.12) !important;
color: #00BB68 !important;
}
.gz-color{
background: rgba(38, 122,202, 0.12) !important;
color: #267ACA !important;
}
.btm-text{
display: flex;
justify-content: space-between;
align-items: center;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.3);
}
.waterfall-flex{
display: flex;
justify-content: space-between;
}
.flex-item{
position: relative;
overflow: hidden;
width: calc((100% - 22rpx) / 2);
}
.flex-item:nth-child(2n){
margin-left: 22rpx;
}
.w-course{
position: relative;
width: 100%;
margin: 22rpx 0rpx 18rpx 0rpx;
/* margin: 22rpx 0rx 18rpx 0rpx; */
}
.w-course-img{
position: relative;
height: 208rpx;
width: 100%;
object-fit: cover;
object-position: center;
border-radius: 24rpx;
}
.w-course-title{
position: relative;
margin-top: 20rpx;
font-size: 30rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: rgba(0, 0, 0, 0.9);
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.w-empNames{
margin-top: 20rpx;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.pay-num{
}
\ No newline at end of file
{
"usingComponents": {},
"navigationBarTitleText": "AI训练库"
"navigationBarTitleText": "运动"
}
\ No newline at end of file
......@@ -3,7 +3,7 @@
overflow: hidden;
margin: 0 auto;
min-height: 100vh;
padding-bottom: 80rpx;
padding-bottom: 100rpx;
}
.list .li:nth-child(2n-1){
......
......@@ -45,7 +45,7 @@
"compileType": "miniprogram",
"libVersion": "2.17.0",
"appid": "wx7d7fbc0e6746baf5",
"projectname": "奔腾宝贝",
"projectname": "小奔体育",
"simulatorType": "wechat",
"simulatorPluginLibVersion": {},
"editorSetting": {
......
......@@ -107,8 +107,8 @@
"name": "",
"pathName": "subPages/sport/sportTime/sportTime",
"query": "type=2",
"scene": null,
"launchMode": "default"
"launchMode": "default",
"scene": null
},
{
"name": "订单支付",
......@@ -116,6 +116,34 @@
"query": "",
"launchMode": "default",
"scene": null
},
{
"name": "",
"pathName": "subPages/login/role-list/role-list",
"query": "角色",
"launchMode": "default",
"scene": null
},
{
"name": "",
"pathName": "subPages/course/detail/detail",
"query": "id=17098",
"launchMode": "default",
"scene": null
},
{
"name": "课程详情",
"pathName": "subPages/course/detail/detail",
"query": "id=17098",
"launchMode": "default",
"scene": null
},
{
"name": "",
"pathName": "subPages/course/order/order",
"query": "id=17099",
"scene": null,
"launchMode": "default"
}
]
}
......
......@@ -3,7 +3,7 @@
* @eMail: 932055106@qq.com
* @Date: 2022-06-13 08:57:51
* @LastEditors: tangjiale
* @LastEditTime: 2022-06-13 19:42:49
* @LastEditTime: 2022-06-15 09:22:54
*/
var API = require("../../../utils/request.js");
Page({
......@@ -12,43 +12,73 @@ Page({
* 页面的初始数据
*/
data: {
courseDetail:{},
detail:{},
showAll:false,
schoolActive:0
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
wx.makePhoneCall({
phoneNumber: '1340000' //仅为示例,并非真实的电话号码
})
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
this.queryCourseDetail(options.id)
this.queryCourseDetail(this.options.id)
},
//收藏/取消收藏
courseCollect(){
API.getData('/px/course/getMobileCourseList', {
id:that.data.page,
opType:1, //1:收藏,2:取消收藏
let that = this
API.getData('/px/course/collectCancelCourse', {
id:that.data.detail.id,
opType:that.data.detail.hadCollect == 1 ? 2 : 1, //1:收藏,2:取消收藏
}, (res) => {
wx.showToast({
icon:'none',
title: `${that.data.detail.hadCollect == 1 ? '取消':''}收藏成功`,
}).then(() =>{
that.data.detail.hadCollect = that.data.detail.hadCollect == 1 ? 2 : 1
that.setData({detail:that.data.detail})
})
})
},
queryCourseDetail(){
changeSchools(e){
this.setData({schoolActive:e.detail.value})
},
queryCourseDetail(id){
let that = this
API.getData('/px/course/getMobileCourseInfo', {
id:that.data.page,
id:id,
}, (res) => {
that.setData({courseDetail:res})
if(res.data && res.data.detail){
res.data.detail = res.data.detail.replace(/<img/g, '<img class="rich-img" ');
res.data['_empNames'] = (res.data.pxEmployeeList.map(v => v.empName)).join('、')
}
that.setData({detail:res.data})
})
},
changeAll(){
this.setData({showAll:!this.data.showAll})
},
callSchool(){
wx.makePhoneCall({
phoneNumber: this.data.detail.schoolList[schoolActive].tel
})
},
onShareAppMessage: function (res) {
let that = this
return{
title: that.data.detail.name,
path:'subPages/course/detail/detail?id=' + that.data.detail.id,
imageUrl: that.data.detail.poster
}
}
})
\ No newline at end of file
{
"usingComponents": {}
"usingComponents": {
"xb-icon": "../../../components/t-icon/t-icon"
},
"navigationBarTitleText": "课程详情"
}
\ No newline at end of file
<view class="page-bg">
<view class="page-bg" wx:if="{{detail && detail.id}}">
课程详情
<view class="poster-img">
<image class="poster-img" src="{{detail.poster}}" mode="aspectFill"></image>
<view class="course-nums">{{detail.type == 1 ? '已购'+ (detail.peopleNum || 0) +'人' : (detail.peopleNum || 0)+'已体验'}}</view>
</view>
<view class="ctn-bg">
<view class="detail-title">{{detail.name}}</view>
<view class="info-ctn flex-s">
<view>
<!-- <view class="detail-num">{{detail.peopleNum || 0}}人已体验</view> -->
<view class="course-tag">
<view class="tag-item {{detail.courseStep==1?'xx-color':detail.courseStep==2?'cz-color':'gz-color'}}">{{detail.courseStep==1?'小学':item.courseStep==2?'初中':'高中'}}组</view>
<view class="tag-item">{{detail.classHour}}课时</view>
<view class="tag-item">{{['','基础班','提高班','精英班','赛事班'][detail.leveId]}}</view>
</view>
<view class="detail-text">
<view class="teach-list">授课教练 {{detail._empNames}}</view>
</view>
</view>
<view class="flex-c">
<button class="icon-text" style="margin-right:40rpx" open-type="share">
<image class="detail-icon" src="../../../images/course/share-icon.png"></image>
<view>分享</view>
</button>
<view class="icon-text" bindtap="courseCollect">
<image wx:if="{{detail.hadCollect==2}}" class="detail-icon" src="/images/course/collect-icon.png"></image>
<image wx:if="{{detail.hadCollect==1}}" class="detail-icon" src="/images/course/collected-icon.png"></image>
<view>收藏</view>
</view>
</view>
</view>
<view class="line-item flex-c" style="margin-top:20rpx">
<view class="line-item-title">上课时段</view>
<view class="line-item-value">{{detail.courseTime}}</view>
</view>
<view class="line-item flex-s">
<view class="flex-c">
<view class="line-item-title">适用校区</view>
<picker bindchange="changeSchools" value="{{schoolActive}}" range="{{detail.schoolList}}" range-key="name">
<view class="flex-c">
<view class="line-item-value">{{detail.schoolList[schoolActive].name}}</view>
<xb-icon type="icon-icon_pull-down" class="change-icon" size="32" color="#000000"></xb-icon>
</view>
</picker>
</view>
<view class="call-bg" bindtap="callSchool" wx:if="{{detail.schoolList[schoolActive].tel}}">
<image class="call-icon" src="../../../images/course/call-icon.png"></image>
</view>
</view>
<view class="text-bg">
<view class="btm-title">课程详情</view>
<view class="detail-content">
<rich-text class="rich-text" nodes="{{detail.detail}}"></rich-text>
</view>
</view>
</view>
<view class="fixed-btm flex-s">
<view class="fixed-price">¥{{detail.cost / 100}}</view>
<view class="fixed-btn">立即抢购</view>
</view>
</view>
\ No newline at end of file
/* subPages/course/detail/detail.wxss */
\ No newline at end of file
.page-bg{
min-height: 100vh;
width: 100%;
padding-bottom: 120rpx;
}
.poster-img{
position: relative;
height: 468rpx;
width: 100%;
display: block;
}
.ctn-bg{
margin: 30rpx 30rpx 0rpx 30rpx;
width: calc(100% - 60rpx);
}
.detail-title{
font-size: 44rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #353535;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.course-tag{
margin-top: 10rpx;
display: flex;
align-items: center;
}
.tag-item{
margin-right: 10rpx;
padding: 4rpx 10rpx;
background: #F8F8F8;
border-radius: 8rpx;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.xx-color{
background: rgba(45, 137,255, 0.12) !important;
color: #2D89FF !important;
}
.cz-color{
background: rgba(0, 187,104, 0.12) !important;
color: #00BB68 !important;
}
.gz-color{
background: rgba(38, 122,202, 0.12) !important;
color: #267ACA !important;
}
.flex-s{
display: flex;
align-items: center;
justify-content: space-between;
}
.flex-c{
display: flex;
align-items: center;
}
.info-ctn{
padding-bottom: 30rpx;
border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
}
.detail-text{
display: flex;
margin-top: 24rpx;
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.detail-icon{
height: 48rpx;
width: 48rpx;
display: block;
}
.icon-text{
background: none !important;
line-height: 42rpx !important;
padding: 0px !important;
height: 80rpx;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.line-item{
padding: 21rpx 0rpx;
}
.line-item-title{
width: 160rpx;
font-size: 30rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: rgba(0, 0, 0, 0.9);
}
.line-item-value{
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.call-bg{
padding-left: 24rpx;
height: 48rpx;
border-left: 1rpx solid rgba(0, 0, 0, 0.1);
}
.call-icon{
height: 34rpx;width: 38rpx;
}
.change-icon{
margin-left: 20rpx;
}
.course-nums{
position: absolute;
left: 30rpx;
bottom: 10rpx;
padding: 6rpx 16rpx;
border-radius: 22rpx;
background-color: rgba(0,0,0,0.24);
font-size: 26rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
.text-bg{
margin-top: 20rpx;
padding-top: 20rpx;
border-top: 1rpx solid rgba(0, 0, 0, 0.1);
}
.btm-title{
margin-bottom: 18rpx;
font-size: 30rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: rgba(0, 0, 0, 0.9);
}
.detail-content{
line-height: 48rpx;
font-size: 30rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #353535;
}
.rich-img{
padding: 30rpx 0rpx;
width: 100%;
}
.detail-time{
flex: none;
}
.teach-list{
margin-right: 20rpx;
}
.fixed-btm{
position: fixed;
bottom: 0rpx;
left: 0rpx;
height: 120rpx;
width: calc(100% - 60rpx);
padding: 0px 30rpx;
background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, #FFFFFF 100%);
}
.fixed-btn{
font-size: 34rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
padding: 21rpx 132rpx;
background: #FF811E;
box-shadow: 0px 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.08);
border-radius: 50rpx;
}
.fixed-price{
font-size: 60rpx;
font-family: D-DIN DIN-Bold, D-DIN DIN;
font-weight: bold;
color: #FF4E4E;
}
\ No newline at end of file
......@@ -3,7 +3,7 @@
* @eMail: 932055106@qq.com
* @Date: 2022-06-11 17:38:58
* @LastEditors: tangjiale
* @LastEditTime: 2022-06-11 17:54:36
* @LastEditTime: 2022-06-15 08:57:52
*/
var API = require("../../../utils/request.js");
Page({
......@@ -12,6 +12,7 @@ Page({
* 页面的初始数据
*/
data: {
type:1,
page:0,
list:[],
loading:false,
......@@ -28,8 +29,11 @@ Page({
/**
* 生命周期函数--监听页面显示
*/
onShow: function (options) {
this.queryCourseList()
onShow: function () {
//1正式课 2体验课
this.setData({type:this.options.type || 1,page:0,list:[],loading:false,finish:false},()=>{
this.queryCourseList()
})
},
onReachBottom:function (){
......@@ -44,8 +48,13 @@ Page({
API.getData('/px/course/getMobileCourseList', {
page:that.data.page,
size:10,
type:1, //课程类型(1:正式课,2:体验课)
type:that.data.type, //课程类型(1:正式课,2:体验课)
}, (res) => {
if(res && res.data && res.data.length){
res.data.forEach(item => {
item['_empNames'] = item.pxEmployeeList && item.pxEmployeeList.length && (item.pxEmployeeList.map(v => v.empName)).join('、') || ''
})
}
that.data.loading = true
that.data.finish = res.data.length < 10
that.data.list = that.data.list.concat(res.data || [])
......@@ -56,5 +65,11 @@ Page({
list:that.data.list
})
});
}
},
gotoDetail(e){
let {id} = e.currentTarget.dataset
wx.navigateTo({
url: '/subPages/course/detail/detail?id=' + id,
})
},
})
\ No newline at end of file
{
"usingComponents": {}
"usingComponents": {},
"navigationBarTitleText": "小奔体育"
}
\ No newline at end of file
......@@ -3,10 +3,65 @@
<view class="page-bg">
<view class="list">
<view class="item" wx:for="{{list}}">
<image src="{{item.poster}}"></image>
</view>
<!-- 体验课 -->
<block wx:if="{{type == 2}}">
<view class="course-bg" wx:for="{{list}}" data-id="{{item.id}}" bindtap="gotoDetail">
<view class="course-img">
<image class="course-img" src="{{item.poster}}" mode="aspectFill"></image>
<view class="fexed-num">{{item.peopleNum || 0}}人已体验</view>
</view>
<view class="course-info">
<view class="course-info-h">
<view class="course-title">{{item.name}}</view>
<view class="course-tag">
<view class="tag-item {{item.courseStep==1?'xx-color':item.courseStep==2?'cz-color':'gz-color'}}">{{item.courseStep==1?'小学':item.courseStep==2?'初中':'高中'}}组</view>
<view class="tag-item">{{item.classHour}}课时</view>
<view class="tag-item">{{['','基础班','提高班','精英班','赛事班'][item.leveId]}}</view>
</view>
</view>
<view class="btm-text">
<view class="empNames-w">授课教练 {{item._empNames}}</view>
</view>
</view>
</view>
</block>
<!-- 班课 -->
<block wx:if="{{type == 1}}">
<view class="waterfall-flex">
<view class="flex-item">
<view class="w-course" wx:for="{{list}}" wx:if="{{index%2 == 0}}" data-id="{{item.id}}" bindtap="gotoDetail">
<view class="w-course-img">
<image class="w-course-img" src="{{item.poster}}" mode="aspectFill"></image>
<view class="fexed-num">已购 {{item.peopleNum || 0}}人</view>
</view>
<view class="w-course-title">{{item.name}}</view>
<view class="course-tag">
<view class="tag-item {{item.courseStep==1?'xx-color':item.courseStep==2?'cz-color':'gz-color'}}">{{item.courseStep==1?'小学':item.courseStep==2?'初中':'高中'}}组</view>
<view class="tag-item">{{item.classHour}}课时</view>
<view class="tag-item">{{['','基础班','提高班','精英班','赛事班'][item.leveId]}}</view>
</view>
<view class="w-empNames">授课教练 {{item._empNames}}</view>
</view>
</view>
<view class="flex-item">
<view class="w-course" wx:for="{{list}}" wx:if="{{index%2 == 1}}" data-id="{{item.id}}" bindtap="gotoDetail">
<view class="w-course-img">
<image class="w-course-img" src="{{item.poster}}" mode="aspectFill"></image>
<view class="fexed-num">已购 {{item.peopleNum || 0}}人</view>
</view>
<view class="w-course-title">{{item.name}}</view>
<view class="course-tag">
<view class="tag-item {{item.courseStep==1?'xx-color':item.courseStep==2?'cz-color':'gz-color'}}">{{item.courseStep==1?'小学':item.courseStep==2?'初中':'高中'}}组</view>
<view class="tag-item">{{item.classHour}}课时</view>
<view class="tag-item">{{['','基础班','提高班','精英班','赛事班'][item.leveId]}}</view>
</view>
<view class="w-empNames">授课教练 {{item._empNames}}</view>
</view>
</view>
</view>
</block>
</view>
</view>
\ No newline at end of file
......@@ -10,6 +10,158 @@
width: calc(100% - 60rpx);
}
.item{
.empNames-w{
position: relative;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.content-btn{
padding: 6rpx 20rpx;
border-radius: 24rpx;
opacity: 1;
border: 1rpx solid rgba(0, 0, 0, 0.15);
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
line-height: 24rpx;
}
.course-bg{
width: 100%;
margin-top: 20rpx;
display: flex;
align-items: center;
}
.course-img{
position: relative;
width: 300rpx;
height: 186rpx;
border-radius: 24rpx;
object-fit: cover;
object-position: center;
}
.fexed-num{
position: absolute;
left: 10rpx;
bottom: 10rpx;
padding: 6rpx 16rpx;
border-radius: 22rpx;
background-color: rgba(0,0,0,0.24);
font-size: 22rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #FFFFFF;
}
.course-info{
height: 186rpx;
width: calc(100% - 320rpx);
margin-left: 20rpx;
}
.course-title{
font-size: 30rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #000000;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.course-info-h{
height: 155rpx;
}
.course-tag{
margin-top: 10rpx;
display: flex;
align-items: center;
}
.tag-item{
margin-right: 10rpx;
padding: 4rpx 10rpx;
background: #F8F8F8;
border-radius: 8rpx;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.xx-color{
background: rgba(45, 137,255, 0.12) !important;
color: #2D89FF !important;
}
.cz-color{
background: rgba(0, 187,104, 0.12) !important;
color: #00BB68 !important;
}
.gz-color{
background: rgba(38, 122,202, 0.12) !important;
color: #267ACA !important;
}
.btm-text{
display: flex;
justify-content: space-between;
align-items: center;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.3);
}
.waterfall-flex{
display: flex;
justify-content: space-between;
}
.flex-item{
position: relative;
overflow: hidden;
width: calc((100% - 22rpx) / 2);
}
.flex-item:nth-child(2n){
margin-left: 22rpx;
}
.w-course{
position: relative;
width: 100%;
margin: 22rpx 0rpx 18rpx 0rpx;
/* margin: 22rpx 0rx 18rpx 0rpx; */
}
.w-course-img{
position: relative;
height: 208rpx;
width: 100%;
object-fit: cover;
object-position: center;
border-radius: 24rpx;
}
.w-course-title{
position: relative;
margin-top: 20rpx;
font-size: 30rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: rgba(0, 0, 0, 0.9);
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.w-empNames{
margin-top: 20rpx;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.pay-num{
}
\ No newline at end of file
/*
* @Author: tangjiale
* @eMail: 932055106@qq.com
* @Date: 2022-06-14 17:37:06
* @LastEditors: tangjiale
* @LastEditTime: 2022-06-14 19:57:35
*/
var API = require("../../../utils/request.js");
Page({
/**
* 页面的初始数据
*/
data: {
detail:{},
params:{
gender:'', //性别
releationShip:'', //关系
schId:'', //所在校区
},
randeList:[{name:'男',value:1},{name:'女',value:2}],
randerIdx:'',
gxList:[
{name:'爸爸',value:1},{name:'妈妈',value:2},{name:'其他',value:3}
],
gxIndex:'',
slIndex:''
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
this.queryCourseDetail(this.options.id)
},
queryCourseDetail(id){
let that = this
API.getData('/px/course/getMobileCourseInfo', {
id:id,
}, (res) => {
if(res.data && res.data.detail){
res.data.detail = res.data.detail.replace(/<img/g, '<img class="rich-img" ');
res.data['_empNames'] = (res.data.pxEmployeeList.map(v => v.empName)).join('、')
}
that.setData({detail:res.data})
})
},
bindPickerChange(e){
let {value} = e.detail
this.data.params.gender = this.data.randeList[value].value
this.setData({params:this.data.params,randerIdx:value})
},
changeGx(e){
let {value} = e.detail
this.data.params.releationShip = this.data.gxList[value].value
this.setData({params:this.data.params,gxIndex:value})
},
changeXq(e){
let {value} = e.detail
this.data.params.schId = this.data.detail.schoolList[value].id
this.setData({params:this.data.params,slIndex:value})
},
inputName(e){
this.data.params.stuName = e.detail.value
this.setData({params:this.data.params})
},
inputPhone(e){
this.data.params.stuName = e.detail.value
this.setData({params:this.data.params})
},
createOrder(){
let param = this.data.params
if(!param.stuName){
wx.showToast({title: '请输入孩子姓名',icon: 'none',});
return
}
if(!param.gender){
wx.showToast({title: '请选择孩子性别',icon: 'none',});
return
}
if(!param.releationShip){
wx.showToast({title: '请选择与孩子关系',icon: 'none',});
return
}
if(!param.schId){
wx.showToast({title: '请选择所在校区',icon: 'none',});
return
}
this.payOrder({
...param,...{courserId:this.data.detail.id,phone:13975487978}
})
},
payOrder(data){
let that = this
API.requestAll('/px/order/addTyOrder', data,function (res) {
if(res.code == 200){
that.toPay(res.data)
}else{
wx.showToast({
title: res.message,
duration: 2000,
icon: 'none'
});
}
})
},
toPay(data){
var orderNo = data.orderNo
API.requestAll('/px/order/pay', {orderNo}, (res) => {
if(res.code ==200){
wx.requestPayment({
timeStamp: res.data.timeStamp,
nonceStr: res.data.nonceStr,
package: res.data.packageValue,
signType: res.data.signType,
paySign: res.data.paySign,
success(res) {
wx.showToast({
title: '支付成功',
icon: 'success',
duration: 2000
});
wx.navigateTo({
url: '/pages/goods/order/order'
})
},
fail(res) {
}
})
}else{
wx.showToast({
title: res.message,
duration: 2000,
icon: 'none'
});
}
}, function (res) {
// canOrder = true;
wx.showToast({
title: res.message,
duration: 2000,
icon: 'none'
});
});
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
{
"usingComponents": {
"xb-icon": "../../../components/t-icon/t-icon"
},
"navigationBarTitleText": "订单提交"
}
\ No newline at end of file
<view class="page-bg" wx:if="{{detail && detail.id}}">
<view class="course-bg">
<view class="course-img">
<image class="course-img" src="{{detail.poster}}" mode="aspectFill"></image>
</view>
<view class="course-info">
<view class="course-info-h">
<view class="course-title">{{detail.name}}</view>
<view class="course-tag">
<view class="tag-item {{detail.courseStep==1?'xx-color':detail.courseStep==2?'cz-color':'gz-color'}}">{{detail.courseStep==1?'小学':detail.courseStep==2?'初中':'高中'}}组</view>
<view class="tag-item">{{detail.classHour}}课时</view>
<view class="tag-item">{{['','基础班','提高班','精英班','赛事班'][detail.leveId]}}</view>
</view>
</view>
<view class="btm-text">
<view class="empNames-w">授课教练 {{detail._empNames}}</view>
<view class="price-t">
<text class="unit">¥</text>
<text class="price">{{detail.cost / 100}}</text>
</view>
</view>
</view>
</view>
<view class="grey-line"></view>
<view class="order-info">
<view class="order-title">订单信息</view>
<view class="input-item">
<view class="input-t">孩子姓名</view>
<view class="input-bg">
<input type="text" value="{{params.stuName}}" bindinput="inputName" placeholder="请输入孩子姓名" placeholder-class="placeholder-c"></input>
</view>
</view>
<view class="input-item">
<view class="input-t">孩子性别</view>
<view class="input-bg">
<picker class="name" bindchange="bindPickerChange" value="{{randerIdx}}" range="{{randeList}}" range-key="name">
<view class="flex-s">
<view class="sex {{!params.gender ? 'placeholder-c':''}}">{{randeList[randerIdx].name || '请选择性别'}}</view>
<xb-icon type="icon-icon_pull-down" class="change-icon" size="32" color="#000000"></xb-icon>
</view>
</picker>
</view>
</view>
<view class="input-item">
<view class="input-t">与孩子关系</view>
<view class="input-bg">
<picker class="name" bindchange="changeGx" value="{{gxIndex}}" range="{{gxList}}" range-key="name">
<view class="flex-s">
<view class="sex {{!params.releationShip ? 'placeholder-c':''}}">{{gxList[gxIndex].name || '请选择您与孩子的关系'}}</view>
<xb-icon type="icon-icon_pull-down" class="change-icon" size="32" color="#000000"></xb-icon>
</view>
</picker>
</view>
</view>
<view class="input-item">
<view class="input-t">所在校区</view>
<view class="input-bg">
<picker class="name" bindchange="changeXq" value="{{slIndex}}" range="{{detail.schoolList}}" range-key="name">
<view class="flex-s">
<view class="sex {{!params.schId ? 'placeholder-c':''}}">{{detail.schoolList[slIndex].name || '请选择校区'}}</view>
<xb-icon type="icon-icon_pull-down" class="change-icon" size="32" color="#000000"></xb-icon>
</view>
</picker>
</view>
</view>
</view>
<view class="fixed-btm flex-s">
<view class="fixed-price">¥{{detail.cost / 100}}</view>
<view class="fixed-btn" bindtap="createOrder">立即抢购</view>
</view>
</view>
\ No newline at end of file
.page-bg{
min-height: 100vh;
width: 100%;
}
.course-bg{
margin: 20rpx 30rpx 0rpx 30rpx;
display: flex;
width: calc(100% - 60rpx);
align-items: center;
}
.course-img{
position: relative;
width: 334rpx;
height: 208rpx;
border-radius: 24rpx;
object-fit: cover;
object-position: center;
}
.course-info{
height: 208rpx;
width: calc(100% - 354rpx);
margin-left: 20rpx;
}
.course-title{
font-size: 30rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #000000;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
word-wrap: break-word;
white-space: normal !important;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.flex-s{
display: flex;
align-items: center;
justify-content: space-between;
}
.course-info-h{
height: 150rpx;
}
.empNames-w{
margin-top: 10rpx;
position: relative;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.3);
}
.unit{
font-size: 36rpx;
font-family: D-DIN DIN-Bold, D-DIN DIN;
font-weight: bold;
color: #FF4E4E;
}
.price-t{
flex: none;
font-size: 48rpx;
font-family: D-DIN DIN-Bold, D-DIN DIN;
font-weight: bold;
color: #FF4E4E;
}
.course-text{
margin-top: 10rpx;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.btm-text{
display: flex;
justify-content: space-between;
align-items: center;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.3);
}
.price{margin-left: 10rpx;}
.grey-line{
margin-top: 30rpx;
height: 20rpx;
width: 100%;
background: #F8F8F8;
}
.order-info{
margin:0px 30rpx;
width: calc(100% - 60rpx);
}
.order-title{
height: 88rpx;
line-height: 88rpx;
width: 100%;
font-size: 34rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #353535;
}
.input-item{
height: 112rpx;
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
}
.input-t{
width: 184rpx;
font-size: 30rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.9);
}
.input-bg{
padding: 24rpx 30rpx;
background: #F8F9FA;
border-radius: 16rpx;
width: calc(100% - 184rpx);
}
.placeholder-c{
font-size: 30rpx !important;
font-family: PingFang SC-Regular, PingFang SC !important;
font-weight: 400 !important;
color: #C3CAD3 !important;
}
.fixed-btm{
position: fixed;
bottom: 0rpx;
left: 0rpx;
height: 120rpx;
width: calc(100% - 60rpx);
padding: 0px 30rpx;
background: linear-gradient(180deg, rgba(255, 255, 255, 1) 0%, #FFFFFF 100%);
}
.fixed-btn{
font-size: 34rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
padding: 21rpx 132rpx;
background: #FF811E;
box-shadow: 0px 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.08);
border-radius: 50rpx;
}
.fixed-price{
font-size: 60rpx;
font-family: D-DIN DIN-Bold, D-DIN DIN;
font-weight: bold;
color: #FF4E4E;
}
.course-tag{
margin-top: 10rpx;
display: flex;
align-items: center;
}
.tag-item{
margin-right: 10rpx;
padding: 4rpx 10rpx;
background: #F8F8F8;
border-radius: 8rpx;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: rgba(0, 0, 0, 0.5);
}
.xx-color{
background: rgba(45, 137,255, 0.12) !important;
color: #2D89FF !important;
}
.cz-color{
background: rgba(0, 187,104, 0.12) !important;
color: #00BB68 !important;
}
.gz-color{
background: rgba(38, 122,202, 0.12) !important;
color: #267ACA !important;
}
\ No newline at end of file
{
"usingComponents": {},
"navigationBarTitleText": "身份列表"
}
\ No newline at end of file
<view>
<view class="main">
<view class="title">我的身份</view>
<view class="roleList" wx:if="{{organManager.length > 0}}">
<view class="li touch-item {{item.isTouchMove ? 'touch-move-active' : ''}}" hover-class="after-click-content" data-item="{{item}}" data-key="{{index}}" data-peopleType="{{item.peopleType}}" wx:for="{{organManager}}" bindtap="changeRole">
<image class="photo" src="{{item.imgSrc}}"></image>
<view class="content">
<view class="name">
{{item.name}}
<text class="student">教育局</text>
<text class="parent" wx:if="{{item.peopleType == 'Parent'}}">家长</text>
</view>
<view class="class">{{item.schName}}教育局</view>
</view>
<view wx:if="{{item.isCur == true}}">
<image class="user" src="https://cdn.xiaobentiyu.cn/sport_minapp_img/login/sel-sf.png"></image>
</view>
<view wx:else></view>
</view>
</view>
<view class="roleList" wx:if="{{schoolManager.length > 0}}">
<view class="li touch-item {{item.isTouchMove ? 'touch-move-active' : ''}}" hover-class="after-click-content" data-item="{{item}}" data-key="{{index}}" data-peopleType="{{item.peopleType}}" wx:for="{{schoolManager}}" bindtap="changeRole">
<image class="photo" src="{{item.imgSrc}}"></image>
<view class="content">
<view class="name">
{{item.name}}
<text class="student">学校管理员</text>
</view>
<view class="class">{{item.schName}}管理员</view>
</view>
<view wx:if="{{item.isCur == true}}">
<image class="user" src="https://cdn.xiaobentiyu.cn/sport_minapp_img/login/sel-sf.png"></image>
</view>
<view wx:else></view>
</view>
</view>
<view class="roleList" wx:if="{{parentList.length > 0}}">
<view class="li touch-item {{item.isTouchMove ? 'touch-move-active' : ''}}" hover-class="after-click-content" wx:for="{{parentList}}" data-item="{{item}}" data-key="{{index}}" data-peopleType="{{item.peopleType}}" bindtap="changeRole" bindtouchstart="touchstart" bindtouchmove="touchmove" data-index="{{index}}">
<image class="photo" src="{{item.imgSrc}}"></image>
<view class="content">
<view class="name">
{{item.name}}
<text class="parent" wx:if="{{item.peopleType == 'Parent'}}">家长</text>
<text class="student" wx:if="{{item.peopleType == 'Student'}}">孩子</text>
</view>
<view class="class" wx:if="{{item.peopleType == 'Student'}}">{{item.schName}} {{item.className}}</view>
</view>
<view wx:if="{{item.isCur == true}}">
<image class="user" src="https://cdn.xiaobentiyu.cn/sport_minapp_img/login/sel-sf.png"></image>
</view>
<view wx:else></view>
<view class="del" data-index="{{index}}" data-item="{{item}}" catchtap="delRole">删除</view>
</view>
</view>
<view class="roleList" wx:if="{{teacharList.length > 0}}">
<view class="li touch-item {{item.isTouchMove ? 'touch-move-active' : ''}}" hover-class="after-click-content" wx:for="{{teacharList}}" data-item="{{item}}" data-key="{{index}}" data-peopleType="{{item.peopleType}}" bindtap="changeRole" bindtouchstart="touchstart2" bindtouchmove="touchmove2" data-index="{{index}}">
<image class="photo" src="{{item.imgSrc}}"></image>
<view class="content">
<view class="name">{{item.name}} <text class="teacher">教师</text></view>
<view class="class">{{item.schName}}</view>
</view>
<view wx:if="{{item.isCur == true}}">
<image class="user" src="https://cdn.xiaobentiyu.cn/sport_minapp_img/login/sel-sf.png"></image>
</view>
<view wx:else></view>
<view class="del" data-index="{{index}}" data-item="{{item}}" catchtap="delRole">删除</view>
</view>
</view>
<view class="roleList" wx:if="{{schMembersList.length > 0}}">
<view class="li touch-item {{item.isTouchMove ? 'touch-move-active' : ''}}" hover-class="after-click-content" wx:for="{{schMembersList}}" data-item="{{item}}" data-key="{{index}}" data-peopleType="{{item.peopleType}}" bindtap="changeRole" bindtouchstart="touchstart3" bindtouchmove="touchmove3" data-index="{{index}}">
<image class="photo" src="{{item.imgSrc}}"></image>
<view class="content">
<view class="name">{{item.name}} <text class="org">机构</text></view>
<view class="class">{{item.schName || ''}}</view>
</view>
<view wx:if="{{item.isCur == true}}">
<image class="user" src="https://cdn.xiaobentiyu.cn/sport_minapp_img/login/sel-sf.png"></image>
</view>
<view wx:else></view>
<view class="del" data-index="{{index}}" data-item="{{item}}" catchtap="delRole">删除</view>
</view>
</view>
<view class="roleList" wx:if="{{visitorsList.length > 0}}">
<view class="li touch-item {{item.isTouchMove ? 'touch-move-active' : ''}}" hover-class="after-click-content" wx:for="{{visitorsList}}" data-item="{{item}}" data-key="{{index}}" data-peopleType="{{item.peopleType}}" bindtap="changeRole" bindtouchstart="touchstart4" bindtouchmove="touchmove4" data-index="{{index}}">
<image class="photo" src="{{item.imgSrc}}"></image>
<view class="content">
<view class="name">{{item.name}} <text class="personal">游客</text></view>
<view class="class" wx:if="{{item.peopleType != 'Visitor'}}">{{item.schName || ''}}</view>
</view>
<view wx:if="{{item.isCur == true}}">
<image class="user" src="https://cdn.xiaobentiyu.cn/sport_minapp_img/login/sel-sf.png"></image>
</view>
<view wx:else></view>
<view class="del" data-index="{{index}}" data-item="{{item}}" catchtap="delRole">解除</view>
</view>
</view>
<!-- <view class="addRole" bindtap="navigateTo">
<view class="addRoleContent">
<image src="../../../images/login/add.png"></image>
<view class="text">添加身份</view>
</view>
</view> -->
</view>
</view>
\ No newline at end of file
/* .change-role{position: fixed;width: 100%;bottom: 0;top: 0;background: #f6f6f6;}
*/
.change-role{background: #f6f6f6;}
.cell-wrap{z-index: 200;position: relative;padding-left:30rpx;background:#fff;}
.cell-wrap :last-child{border-bottom: none !important}
.cell-wrap .noBorder{border-bottom: none !important}
.cell-wrap .li{height: 130rpx;border-bottom: 1rpx solid #e1e1e1;background:#fff;}
.cell-wrap .li .avatar-img{width: 90rpx;height: 90rpx;border-radius: 50%;float: left;margin:20rpx 30rpx 0 0 ;}
.cell-wrap .li .info{float: left;margin-top: 20rpx;}
.cell-wrap .li .name{font-size: 30rpx;}
.cell-wrap .li .info{font-size: 24rpx;color: #999;}
.cell-wrap .li .school{width: 300rpx;display: inline-block;overflow: hidden;height: 30rpx;}
.cell-wrap .line{
height: 70rpx !important;background: #f6f6f6 !important;margin-left: -30rpx;border-bottom: none !important;
line-height: 70rpx;font-size: 30rpx;font-weight: bold;color: #53608b;padding-left: 30rpx;
}
.change-role .btn{
height: 100rpx;line-height: 100rpx;text-align: center;font-size: 34rpx;background: #fff;color: 000;margin-top: 20rpx;
}
page{
background: #F5F5F5;
}
.main{
width: 94%;
margin: 0 auto;
}
.title{
width: 100%;
color: #888888;
font-size: 28rpx;
margin-top: 30rpx;
margin-bottom: 30rpx;
}
.roleList{
background: #FFFFFF;
border-radius:20rpx;
margin-bottom: 20rpx;
}
.roleList .li{
position: relative;
width: 95%;
height: 120rpx;
margin-left: 5%;
border-bottom: 2rpx solid #EEEEEE;
}
.roleList .li:last-child{
border-bottom: 0rpx;
}
.roleList .li .photo{
width: 72rpx;
height: 72rpx;
border-radius: 50%;
float: left;
margin-top: 24rpx;
}
.roleList .li .content{
float: left;
margin-left: 20rpx;
}
.content .name{
overflow: hidden;
color: #353535;
font-size: 28rpx;
font-weight:bold;
margin-top: 26rpx;
}
.content .class{
color: #B2B2B2;
font-size: 22rpx;
}
.roleList .li .user{
position: absolute;
right: 40rpx;
top: 40rpx;
width: 42rpx;
height: 42rpx;
}
.parent{
font-size: 20rpx;
background: #EECA3A;
color: #FFFFFF;
border-radius: 8rpx;
margin-left: 20rpx;
margin-top: 8rpx;
padding-bottom: 6rpx;
height: 32rpx;
line-height: 32rpx;
padding: 0rpx 10rpx;
}
.teacher{
font-size: 20rpx;
background: #69C3FF;
color: #FFFFFF;
border-radius: 8rpx;
margin-left: 20rpx;
margin-top: 8rpx;
padding-bottom: 6rpx;
height: 32rpx;
line-height: 32rpx;
padding: 0rpx 10rpx;
}
.org{
font-size: 20rpx;
background: #626174;
color: #FFFFFF;
border-radius: 8rpx;
margin-left: 20rpx;
margin-top: 8rpx;
padding-bottom: 6rpx;
height: 32rpx;
line-height: 32rpx;
padding: 0rpx 10rpx;
}
.personal{
font-size: 20rpx;
background: #DDCE07;
color: #FFFFFF;
border-radius: 8rpx;
margin-left: 20rpx;
margin-top: 8rpx;
padding-bottom: 6rpx;
height: 32rpx;
line-height: 32rpx;
padding: 0rpx 10rpx;
}
.addRole{
overflow: hidden;
width: 100%;
height: 100rpx;
margin: 0 auto;
margin-top: 20rpx;
background: #FFFFFF;
border-radius:20rpx;
margin-bottom: 40rpx;
}
.addRoleContent{
width: 200rpx;
height: 48rpx;
margin: 0 auto;
margin-top: 26rpx;
}
.addRoleContent image{
width: 42rpx;
height: 42rpx;
float: left;
margin-top: 6rpx;
}
.addRoleContent .text{
color: #FF9B4D;
font-size: 36rpx;
font-weight:bold;
margin-left: 12rpx;
float: left;
}
.container{
width:100%;
overflow: hidden;
box-sizing: border-box;
padding-bottom:10rpx;
}
.touch-item {
display: flex;
/* //均匀排布每个元素 */
justify-content: space-between;
overflow: hidden;
}
.content {
float: left;
line-height: 22px;
margin-right:0;
-webkit-transition: all 0.4s;
transition: all 0.4s;
-webkit-transform: translateX(90rpx);
transform: translateX(90rpx);
position: absolute;
left: 0;
}
.del {
background-color: #FF4E4E;
width: 90px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: #fff;
-webkit-transform: translateX(90px);
transform: translateX(90px);
-webkit-transition: all 0.4s;
transition: all 0.4s;
}
/* .touch-move-active .content, */
.touch-move-active .del {
-webkit-transform: translateX(0);
transform: translateX(0);
}
/* .touch-move-active .content{
background: rgba(180, 218, 12, 0.3);
} */
.student{
font-size: 20rpx;
background: #29CC84;
color: #FFFFFF;
border-radius: 8rpx;
margin-left: 20rpx;
margin-top: 8rpx;
padding-bottom: 6rpx;
height: 32rpx;
line-height: 32rpx;
padding: 0rpx 10rpx;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment