Commit 59f041af authored by wangxuelai's avatar wangxuelai

'小程序线上课堂修改'

parent ceaeef90
......@@ -747,6 +747,13 @@
"index"
]
},
{
"root": "business/pages/bindmessagepush",
"name": "bindmesagepush",
"pages": [
"index"
]
},
{
"root": "business/pages/coursemgt",
"name": "coursemgt",
......
.container{
width: 100%;
padding: 0 60rpx;
box-sizing: border-box;
min-height: 100vh;
}
.logo-box{
padding: 38rpx 0 90rpx;
}
.logo-box .logo{
width: 103rpx;
height: 103rpx;
border-radius: 50%;
}
.logo-box .slogon{
font-size: 22rpx;
color: rgba(0,0,0,.4);
padding-top: 38rpx;
}
.form-box{
position: relative;
margin-top: 75rpx;
}
.form-box .form-item{
display: flex;
align-items: center;
position: relative;
height: 100rpx;
}
.form-box .form-item::after{
content:'';
width: 100%;
height: 1px;
background: rgba(0,0,0,.05);
position: absolute;
left: 0;
bottom: 0;
}
.form-box .form-item .left-iconbox{
min-width: 50rpx;
display: flex;
align-items: center;
justify-content: center;
margin-right: 26rpx;
}
.form-box .form-item .left-iconbox .left-icon{
}
.form-box .form-item .left-iconbox .icon-phone{
width: 41rpx;
height: 50rpx;
}
.form-box .form-item .left-iconbox .icon-code{
width: 27rpx;
height: 20rpx;
}
.form-box .form-item .left-iconbox .icon-psd{
width: 42rpx;
height: 46rpx;
}
.form-box .form-item .left-iconbox .icon-orgname,
.form-box .form-item .left-iconbox .icon-address{
width: 46rpx;
height: 46rpx;
}
.form-box .form-item .btn-getcode,
.form-box .form-item .icon-psdstatus{
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.form-box .form-item .btn-getcode{
font-size: 24rpx;
border-radius: 25rpx;
height: 50rpx;
line-height: 50rpx;
padding: 0 20rpx;
color: #fff;
background: #2DBCFF;
}
/* .form-box .form-item .btn-getcode-default{
color: #fff;
background: #2DBCFF;
}
.form-box .form-item .btn-getcode-disabled{
color: rgba(0,163,255,.6);
background: rgba(45,188,255,.1);
} */
.form-box .form-item .btn-getcode[disabled]{
color: rgba(0, 0, 0, 0.3);
background: #F7F7F7;
}
.form-box .form-item .icon-psdhide{
width: 38rpx;
height: 18rpx;
}
.form-box .form-item .icon-psdshow{
width: 38rpx;
height: 26rpx;
}
.form-box .error-tip{
position: absolute;
left: 50%;
transform: translateX(-50%);
bottom: -78rpx;
font-weight: 500;
color: #F76260;
padding-left: 25rpx;
display: flex;
align-items: center;
height: 52rpx;
line-height: 52rpx;
background :rgba(255,255,255,1);
box-shadow: 0 1rpx 10rpx 0 rgba(220,220,220,0.3);
border-radius: 26rpx;
padding: 0 13rpx;
}
.form-box .error-tip .icon-warn{
width: 22rpx;
height: 22rpx;
margin-right: 14rpx;
}
.form-box .error-tip .warn-text{
font-size: 24rpx;
white-space: nowrap;
}
.form-box .btn-forgetpsd{
position: absolute;
right: 0;
bottom: -50rpx;
font-size: 24rpx;
color: #A3A3A3;
padding-left: 25rpx;
}
.form-box .btn-forgetpsd::before{
content: '';
width: 14rpx;
height: 14rpx;
background: rgba(101,184,244,1);
box-shadow: 0 2rpx 10rpx 0 rgba(0, 248, 144, 0.35);
border-radius: 50%;
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
}
.formBtn{
font-size: 26rpx;
font-weight: bold;
color: #FDFDFD;
width: 100%;
height: 90rpx;
line-height: 90rpx;
text-align: center;
background: linear-gradient(-90deg,rgba(51,168,255,1),rgba(4,222,254,1));
box-shadow: 0px 8rpx 16rpx 0px rgba(51, 209, 255, .35);
border-radius:45rpx;
margin-top: 104rpx;
}
.formBtn-dark{
background: linear-gradient(-90deg,rgba(51,168,255,1),rgba(4,222,254,1));
box-shadow: 0px 8rpx 16rpx 0px rgba(51, 209, 255, .35);
opacity: 0.5;
}
button.formBtn[disabled]{
background: linear-gradient(-90deg,rgba(51,168,255,1),rgba(4,222,254,1));
box-shadow: 0px 8rpx 16rpx 0px rgba(51, 209, 255, .35);
opacity: 0.5;
color: #fff;
}
.bottom-box{
width: 100%;
position: absolute;
bottom: 0;
left: 0;
display: flex;
flex-direction: column;
align-items: center;
}
.bottom-box .tabchange{
display: flex;
align-items: center;
justify-content: center;
}
.bottom-box .tabchange .tab-item{
padding: 0 56rpx;
font-size: 26rpx;
color: #16B0FD;
position: relative;
}
.bottom-box .tabchange .tab-item::after{
content: '';
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%) scaleX(.5);
width: 1px;
height: 29rpx;
background: rgba(0,0,0,.2);
}
.bottom-box .tabchange .tab-item:last-of-type::after{
display: none;
}
.bottom-box .tip{
font-size: 24rpx;
color: #A3A3A3;
padding: 50rpx 0 70rpx;
}
\ No newline at end of file
import regexp from '../../../constants/regexp.js';
const app = getApp();
Page({
data: {
imageRoot: app.globalData.imageRoot,
imageVersion: app.globalData.imageVersion,
params:{
mobile:'',
code:'',
},
sending: false,
hasSend: false,
countdownTime: 60,
countdownIntervalId: '',
isactive: false,
},
onLoad: function (options) {
},
mobileInput(e){
this.setData({
"params.mobile":e.detail.value
})
if (regexp.mobile.test(this.data.params.mobile) && regexp.verifyCode.test(this.data.params.code)) {
this.setData({
isactive: true
})
}
},
codeInput(e){
this.setData({
"params.code":e.detail.value
})
if (regexp.mobile.test(this.data.params.mobile) && regexp.verifyCode.test(this.data.params.code)) {
this.setData({
isactive: true
})
}
},
login (e) {
console.log(this.data.params, 'data.params');
},
sendVerify () { // 发送验证码
const that = this;
if (!regexp.mobile.test(that.data.params.mobile)) {
that.setData({
warnTip: '请输入正确格式的手机号,并获取验证码'
},()=>{
})
return;
}
if (that.data.sending) {
return
}
that.setData({
sending: true
})
getVerifyCode({
mobile: that.data.params.mobile,
sms_type: 11,
}).then((res) => {
const {code} = res;
that.setData({
sending: false
})
if (code!=200) {
wx.showModal({
title: '提示',
content: res.msg,
showCancel: false,
confirm: true
})
return;
}
that.setData({
hasSend: true
})
let countdownInterval = setInterval(() => {
let countdownTime = that.data.countdownTime - 1;
that.setData({
countdownTime
})
that.setData({
countdownIntervalId: countdownInterval,
})
if (that.data.countdownTime <= 0) {
that.setData({
hasSend: false
})
that.setData({
countdownTime: 60
})
clearInterval(that.data.countdownIntervalId);
}
}, 1000);
}).catch((err) => {
that.setData({
sending: false
})
})
},
})
\ No newline at end of file
{
"usingComponents": {}
}
\ No newline at end of file
<!--business/pages/loginregistermgt/login.wxml-->
<view class="container">
<view class="top-box">
<image class="logo" src="{{imageRoot}}common/circlelogo.png"/>
</view>
<view class="form-box">
<view class="login-type1">
<view class="form-item">
<input type="number" placeholder-class="placeholderclass" value="{{params.mobile}}" bindinput="mobileInput" maxlength="11" placeholder="请输入您的手机号码" />
</view>
<view class="form-item">
<input type="number" class="verifycodebtn" maxlength="4" bindinput="codeInput" placeholder-class="placeholderclass" value="{{params.code}}" placeholder="请输入验证码" />
<view class="btn-getcode {{hasSend || params.mobile.length<11 ? 'codesended': ''}}" bindtap="sendVerify"
disabled="{{hasSend || params.mobile.length<11}}">{{hasSend ? countdownTime + '秒后重新获取': '获取验证码'}}</view>
</view>
</view>
</view>
<button class="formBtn {{isactive ? 'isactive' : ''}}" bindtap="login">激活消息推送</button>
</view>
\ No newline at end of file
@import "./form.wxss";
.top-box{
padding-top: 50rpx;
text-align: center;
}
.top-box .logo{
width: 142rpx;
height: 142rpx;
}
.top-box .text{
font-size:24rpx;
font-family:PingFang SC;
font-weight:400;
color:rgba(163,163,163,1);
text-align: center;
line-height: 1;
padding: 30rpx 0 30rpx 0;
}
.form-box-bottom{
display: flex;
justify-content: space-between;
padding-top: 48rpx;
}
.form-box-bottom .tab-btn{
font-size:26rpx;
font-family:PingFang-SC-Regular;
font-weight:400;
color:rgba(101,184,244,1);
}
.form-box-bottom .btn{
font-size:26rpx;
font-family:PingFang-SC-Regular;
font-weight:400;
color:rgba(163,163,163,1);
position: relative;
}
.form-box-bottom .btn::before{
content: '';
width:14rpx;
height:14rpx;
background:rgba(101,184,244,1);
box-shadow:0px 2rpx 10rpx 0px rgba(0, 248, 144, 0.35);
border-radius:50%;
display: block;
position: absolute;
left: -26rpx;
bottom: 10rpx;
}
.form-box .login-type1 .btn-getcode{
display: flex;
align-items: center;
justify-content: center;
background:#fff;
color:#0091FF;
border: 1px solid #0091FF;
}
.warnbox {
position: absolute;
top: 50%;
right: 0;
padding: 13rpx;
box-shadow:0px 1rpx 32rpx 0rpx rgba(220,220,220,0.49);
border-radius:0px 26rpx 26rpx 26rpx;
}
.warnbox .warnicon {
width: 22rpx;
height: 22rpx;
float: left;
margin-right: 14rpx;
}
.warnbox .warntext {
font-size: 24rpx;
color: #F76260;
float: left;
line-height: 1;
}
.form-box .login-type1 .btn-getcode.codesended {
background-color: #fff;
border: 1px solid #CCCCCC;
color: #CCCCCC;
display: flex;
align-items: center;
justify-content: center;
outline: none;
}
.form-item input {
width: 100%;
/* background-color: red; */
}
.form-item input.verifycodebtn {
width: 360rpx;
}
.container .formBtn {
background: initial;
background-color: #CCCCCC;
color: #FFFFFF;
box-shadow: initial;
}
.container .formBtn.isactive {
background-color: #0091FF;
}
\ No newline at end of file
export default {
mobile: /^1[3456789]{1}[0-9]{9}$/,
passWord: /^[a-zA-Z0-9]{6,20}$/,
storeMobile: /^([0-9]|[-])+$/g
storeMobile: /^([0-9]|[-])+$/g,
verifyCode: /^\d{4}/g,
}
\ No newline at end of file
......@@ -196,7 +196,7 @@ Page({
this.websitecourseshowGet()
this.websiteintrosGet();
this.clockListGet();
this.newslistGet();
// this.newslistGet();
this.momentlistGet();
this.onlineCoursesListGet();
this.userShow();
......
......@@ -9,13 +9,14 @@ Page({
* 页面的初始数据
*/
data: {
type: 1,
infoList:[],
perPage: 10,
page: 1,
hasmore: true,
emptyPage: false,
listLoading: false,
infoTatol:'',
infoTatol:0,
localImageRoot: '../../../images/',
imageRoot: app.globalData.imageRoot,
imageVersion: app.globalData.imageVersion,
......@@ -89,7 +90,21 @@ Page({
onShareAppMessage: function () {
},
// 线上课
// 线上课
selectType(e) {
const { type } = e.currentTarget.dataset;
if (this.data.type == type) {
return
}
this.setData({
type,
page: 1,
hasmore: true,
emptyPage: false,
}, () => {
this.getOnlineCoursesList('down')
})
},
onlineCoursesListGet(){
onlinecourseslistGet({
school_id: this.data.sid
......
<!--src/pages/websiteindex/onlineclassroomlist.wxml-->
<wxs src="../../../filter/index.wxs" module="filter" />
<view class="container online-classroom">
<view class="tabspanle">
<view class="tabsitem {{type == 1 ? 'active' : ''}}" data-type="1" bindtap="selectType">
<view class="tabname">全部</view>
<view class="tabline"></view>
</view>
<view class="tabsitem {{type == 2 ? 'active' : ''}}" data-type="2" bindtap="selectType">
<view class="tabname">视频</view>
<view class="tabline"></view>
</view>
<view class="tabsitem {{type == 3 ? 'active' : ''}}" data-type="3" bindtap="selectType">
<view class="tabname">音频</view>
<view class="tabline"></view>
</view>
<view class="tabsitem {{type == 4 ? 'active' : ''}}" data-type="4" bindtap="selectType">
<view class="tabname">图文</view>
<view class="tabline"></view>
</view>
</view>
<view class="content-box" wx:if="{{!emptyPage}}">
<block wx:for="{{infoList}}" wx:key="index">
<view class="content-item" bindtap="goOnlineClass" data-item="{{item}}">
<view class="cover-box">
<image class="cover-img" src="{{filter.imagify(item.cover, 'image/resize,w_400/format,jpg')}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="" wx:if="{{item.cover}}" />
<image class="cover-img" src="{{filter.imagify('qingxiao/biz/image/course/courseDefaultImg.png')}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="" wx:else/>
<view class="man-count">
<image class="" src="{{imageRoot}}2c/websiteindex/hot-icon.png?{{imageVersion}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="" />{{item.visit_pv_count+item.study_count}}人学习
</view>
<image class="cover-img" src="{{filter.imagify(item.cover, 'image/resize,w_400/format,jpg')}}" mode="aspectFill" lazy-load="false" binderror="" bindload="" wx:if="{{item.cover}}" />
<image class="cover-img" src="{{filter.imagify('qingxiao/biz/image/course/courseDefaultImg.png')}}" mode="aspectFill" lazy-load="false" binderror="" bindload="" wx:else/>
<image class="classtypeicon" src="{{imageRoot}}2c/onlineclass/textimgicon.png?{{imageVersion}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="" />
</view>
<view class="info-box">
<view class="title">{{item.title}}</view>
<view class="subtitle">{{item.remark}}</view>
<view class="class-count" wx:if="{{item.type==2}}">
<view class="title clearfix">
<image class="classtypetag" src="{{imageRoot}}2c/onlineclass/text.png?{{imageVersion}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="" />
<text class="titletext">{{item.title}}大萨达撒多哒哒哒哒大萨达撒大萨达撒多哒哒哒哒大萨达撒</text>
</view>
<view class="learnbox">
<image class="eyeicon" src="{{imageRoot}}2c/onlineclass/eyeicon.png?{{imageVersion}}" mode="aspectFit|aspectFill|widthFix" lazy-load="false" binderror="" bindload="" />
<view class="learncount" hover-class="none" hover-stop-propagation="false">
223人已学习
</view>
</view>
<!-- <view class="subtitle">{{item.remark}}</view> -->
<!-- <view class="class-count" wx:if="{{item.type==2}}">
<view class="left"><view class="hot-dot"></view>{{item.sub_courses_count}}节课</view>
<view class="free">免费</view>
</view>
</view> -->
</view>
</view>
</block>
......
/* src/pages/websiteindex/onlineclassroomlist.wxss */
.online-classroom .content-box{
.online-classroom {
background-color: #F9F9F9;
min-height: 100vh;
}
.tabspanle {
display: flex;
align-items: center;
justify-content: space-around;
background-color: #fff;
padding: 21rpx 0 9rpx;
position: fixed;
top: 0;
width: 100%;
left: 0;
z-index: 5;
}
.tabsitem {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.tabname {
font-size: 32rpx;
color: #666;
line-height: 1;
padding-bottom: 10rpx;
}
.tabline {
width:30px;
height:6px;
background:transparent;
border-radius:3px;
}
.content-box {
padding: 120rpx 24rpx 60rpx;
}
.tabsitem.active .tabname {
color: #FEA917;
font-size: 32rpx;
}
.tabsitem.active .tabline {
background:rgba(254,169,23,1);
}
.online-classroom .content-box .detail-box{
padding: 0 24rpx 20rpx 24rpx;
......@@ -77,18 +119,29 @@
display: flex;
justify-content: space-between;
margin-bottom: 30rpx;
padding: 0 24rpx;
padding: 15rpx;
background-color: #fff;
border-radius:20rpx;
}
.online-classroom .content-box .content-item .cover-box{
width:260rpx;
height:180rpx;
width:150rpx;
height:150rpx;
border-radius:10rpx;
position: relative;
margin-right: 32rpx;
position: relative;
}
.online-classroom .content-box .content-item .cover-box .classtypeicon {
position: absolute;
width: 40rpx;
height: 40rpx;
right: 12rpx;
bottom: 12rpx;
z-index: 10;
}
.online-classroom .content-box .content-item .cover-box .cover-img{
width:260rpx;
height:180rpx;
width:150rpx;
height:150rpx;
border-radius:10rpx;
}
.online-classroom .content-box .content-item .cover-box .man-count{
......@@ -111,20 +164,59 @@
width: 24rpx;
height: 30rpx;
margin-right: 12rpx;
}
.online-classroom .content-box .content-item {
}
.online-classroom .content-box .content-item .info-box{
flex: 1;
overflow: hidden;
position: relative;
display: flex;
justify-content: space-between;
flex-direction: column;
}
.online-classroom .content-box .content-item .info-box .title{
font-size:28rpx;
/* display: flex; */
/* align-items: center; */
/* white-space: nowrap; */
/* flex-wrap: nowrap; */
word-break: break-all;
text-overflow: ellipsis;
word-wrap: normal;
}
.online-classroom .content-box .content-item .info-box .title .classtypetag{
width: 58rpx;
height: 30rpx;
display: inline-block;
/* float: left; */
margin-right: 10rpx;
}
.online-classroom .content-box .content-item .info-box .title .titletext{
font-size:26rpx;
font-family:PingFang SC;
font-weight:bold;
color:rgba(70,70,70,1);
/* font-weight:bold; */
color:#666666;
line-height:32rpx;
padding: 6rpx 0 18rpx 0;
word-break: break-all;
display: inline;
line-height: 30rpx;
/* float: left; */
}
.online-classroom .content-box .content-item .learnbox {
display: flex;
align-items: center;
padding-bottom: 10rpx;
}
.online-classroom .content-box .content-item .learnbox .eyeicon {
width: 24rpx;
height: 14rpx;
margin-right: 10rpx;
}
.online-classroom .content-box .content-item .learnbox .learncount {
color: #999999;
font-size: 22rpx;
}
.online-classroom .content-box .content-item .info-box .subtitle{
font-size:22rpx;
......
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