You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1451 lines
33 KiB
1451 lines
33 KiB
<template>
|
|
<view class="page">
|
|
|
|
<view class="headcon" :style="{ paddingTop: geStatusBarHeight() + 'px'}">
|
|
<view class="hback">
|
|
<uni-icons type="back" size="24" color="#000" @tap="gotoBack"></uni-icons>
|
|
<text class="htxt">我的课程</text>
|
|
<view class="tabtip" @click="openDialog">
|
|
<uni-icons class="rtop" type="info" size="21" color="#e96900"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<scroll-view class="scrolllist0" scroll-with-animation>
|
|
<view class="tabicl" :class="0==tabCurrentIndex0?'cur':''" @tap="tabSelect0(0)">
|
|
<view class="ptext">日课表</view>
|
|
<view class="pline"></view>
|
|
</view>
|
|
<view class="tabicl" :class="1==tabCurrentIndex0?'cur':''" @tap="tabSelect0(1)">
|
|
<view class="ptext">周课表</view>
|
|
<view class="pline"></view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
|
|
<view v-show="0==tabCurrentIndex0">
|
|
<scroll-view class="scrolllist" scroll-x="true" scroll-with-animation :scroll-left="scrollLeft">
|
|
<view class="tabcell" v-for="(item, index) in list" :key="index" :class="index==tabCurrentIndex?'cur':''" @tap="tabSelect" :data-id="index">
|
|
<view class="wtxt">{{item.week}}</view>
|
|
<view class="dtxt">{{item.date}}</view>
|
|
</view>
|
|
</scroll-view>
|
|
<swiper class="swiper-box" :duration="300" :current="tabCurrentIndex" @animationfinish="animationfinish">
|
|
<swiper-item class="swiper-item" v-for="tabItem in list" :key="tabItem.id">
|
|
<scroll-view scroll-y style="height: 100%;width: 100%;">
|
|
<view class="scell" v-if="tabItem.slist.length>0">
|
|
<view v-for="(item, index) in tabItem.slist" :key="index" class="oitem">
|
|
|
|
<view class="otop">
|
|
<view class="hleft">
|
|
{{item.courseName}}
|
|
</view>
|
|
<view class="hright">
|
|
{{item.startTime+'-'+item.endTime}}
|
|
</view>
|
|
</view>
|
|
|
|
<view class="oscon">
|
|
<view class="osimg imgload">
|
|
<image class="osimg" v-if="item.pic" :src="getimgRemoteFile(item.pic)" mode="aspectFill"></image>
|
|
</view>
|
|
<view class="osname">
|
|
<view class="oscell">
|
|
<view v-if="item.claName=='团课'" class="txtbg">{{item.claName}}</view>
|
|
<view v-else class="txtbg1">{{item.claName}}</view>
|
|
<uni-rate :size="20" :readonly="true" :value="item.star" :max="item.star"/>
|
|
</view>
|
|
<view class="oscell" v-if="item.storeName">
|
|
<uni-icons type="paperclip" size="18" color="#00A99A"></uni-icons>
|
|
<view class="ntip">{{item.storeName}}</view>
|
|
</view>
|
|
<view class="oscell">
|
|
<uni-icons type="calendar" size="18" color="#00A99A"></uni-icons>
|
|
<view class="ntip">{{item.claDate}}</view>
|
|
<view class="txt">{{item.weekDay }}</view>
|
|
</view>
|
|
<view class="oscell">
|
|
<uni-icons type="person" size="18" color="#666"></uni-icons>
|
|
<view class="ntxt">{{item.staffName}}</view>
|
|
<!-- <view class="txt">{{item.teacherposition }}</view> -->
|
|
</view>
|
|
<view class="oscell">
|
|
<uni-icons type="map-pin-ellipse" size="18" color="#00A99A"></uni-icons>
|
|
<view class="ntxt">{{item.roomName}}</view>
|
|
</view>
|
|
<view class="oscell">
|
|
<uni-icons type="checkbox" size="18" color="#00A99A"></uni-icons>
|
|
<view class="ntxt">已预约{{item.bookAttendCnt}}人/限{{item.atClassCnt}}人</view>
|
|
</view>
|
|
<view class="oscell">
|
|
<view class="txt" style="margin-left: 46rpx;">满{{item.lessCnt}}人开课</view>
|
|
</view>
|
|
</view>
|
|
<view class="rcpm">
|
|
<button type="primary" class="orderbtn" @click="gotoorder(item)">预约</button>
|
|
<button type="primary" class="sharebtn" @click="gotoshare(item)">分享</button>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view v-if="tabItem.slist.length==0 && tabItem.loadStatus=='noMore'" class="nodata"></view>
|
|
<uni-load-more v-if="tabItem.slist.length>0" iconType="circle" :status="tabItem.loadStatus" />
|
|
|
|
</scroll-view>
|
|
</swiper-item>
|
|
</swiper>
|
|
|
|
</view>
|
|
|
|
<view v-show="1==tabCurrentIndex0">
|
|
<uni-table class="courcon" ref="table" :loading="loading" emptyText="暂无更多数据">
|
|
<view class="table_head">
|
|
<uni-tr>
|
|
<uni-th width="60" align="center" class="leftfix">
|
|
<view class="leftcell">
|
|
<view class="ctitle">日期</view>
|
|
<view class="ctitle">15日内</view>
|
|
</view>
|
|
</uni-th>
|
|
<uni-th width="120" align="center" v-for="(item, index) in columnTitles" :key="index">
|
|
<view class="rightcell">
|
|
<view class="ctitle">{{item.day}}</view>
|
|
<view class="ctitle">{{item.weekName}}</view>
|
|
<view class="cnum" v-if="item.count>0">{{item.count}}</view>
|
|
</view>
|
|
</uni-th>
|
|
</uni-tr>
|
|
</view>
|
|
<view class="table_body">
|
|
<uni-tr v-for="(item, index) in claTimeContainer" :key="index">
|
|
<uni-td width="60" align="center" class="leftfix">
|
|
<view class="courfix">
|
|
{{item.time}}
|
|
</view>
|
|
</uni-td>
|
|
<uni-td width="120" align="center" v-for="(cell, ii) in columnTitles" :key="ii">
|
|
<block v-for="(cc, kk) in item.claTimeWeekDayMap" :key="kk">
|
|
<block v-for="(dd, mm) in cc" :key="mm">
|
|
<view class="courheadtext" v-if="dd.claDate==cell.day"
|
|
:style="{color:colorlist[index].fcolor,backgroundColor:colorlist[index].color,borderLeftColor:colorlist[index].fcolor}" >
|
|
<view class="ctxt">{{dd.startTime}}-{{dd.endTime}}</view>
|
|
<view class="ctxt">{{dd.courseName}}</view>
|
|
<view class="ctxt">{{dd.claName}}</view>
|
|
<view class="ctxt">{{dd.staffName}}</view>
|
|
<button v-if="dd.claTimeStatus=='1'" type="primary" class="orderbtn" @click="gotoorder(dd)">预约</button>
|
|
<view v-else class="noorderbtn">预约</view>
|
|
</view>
|
|
</block>
|
|
</block>
|
|
</uni-td>
|
|
</uni-tr>
|
|
|
|
</view>
|
|
</uni-table>
|
|
|
|
</view>
|
|
|
|
|
|
<!-- 购买须知 -->
|
|
<uni-popup ref="pfDialog" :mask-click="false">
|
|
<view class="pcon">
|
|
<view class="phtxt">购买须知</view>
|
|
<view class="ptxt">
|
|
①购买后即可自动预约本次课程。<br>
|
|
②购买后不可退款，若开课前未能履约，可在自行取消后预约其它课程。<br>
|
|
③若开课前预约人数未达到最低人数，系统将自动取消课程，并返还费用到你的储值余额中，你可继续预约其它课程。
|
|
</view>
|
|
<view class="btn" @click="closeDialog">
|
|
关闭
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
|
|
<!-- 是否登录 -->
|
|
<openlogin ref="loginId" @getPhoneNumber="getPhoneNumber"></openlogin>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { myCache,getRemoteFile } from '../../utils/utils.js';
|
|
import openlogin from "../components/openlogin.vue";
|
|
export default {
|
|
components: {
|
|
openlogin
|
|
},
|
|
data() {
|
|
return {
|
|
openId:"",
|
|
phone:"",
|
|
userid:"",
|
|
tabCurrentIndex0: 0,
|
|
tabCurrentIndex: 0,
|
|
scrollLeft: 0,//tabs
|
|
list:[],
|
|
loading:false,
|
|
colorlist:[
|
|
{
|
|
time:'08:30',
|
|
fcolor:'#ce4b62',
|
|
color:'#ffdbdf'
|
|
},
|
|
{
|
|
time:'10:00',
|
|
fcolor:'#0c7e07',
|
|
color:'#f4fff3'
|
|
},
|
|
{
|
|
time:'11:00',
|
|
fcolor:'#b871d7',
|
|
color:'#faebfe'
|
|
},
|
|
{
|
|
time:'14:00',
|
|
fcolor:'#95440f',
|
|
color:'#ffe9cb'
|
|
},
|
|
{
|
|
time:'15:00',
|
|
fcolor:'#116c94',
|
|
color:'#cbefff'
|
|
},
|
|
{
|
|
time:'16:00',
|
|
fcolor:'#867ae0',
|
|
color:'#f4f0ff'
|
|
},
|
|
{
|
|
time:'17:00',
|
|
fcolor:'#37acc0',
|
|
color:'#e0f8fa'
|
|
},
|
|
{
|
|
time:'18:00',
|
|
fcolor:'#e8739d',
|
|
color:'#feecfa'
|
|
},
|
|
{
|
|
time:'19:00',
|
|
fcolor:'#4d8ae3',
|
|
color:'#eaf0ff'
|
|
},
|
|
{
|
|
time:'20:00',
|
|
fcolor:'#f2960f',
|
|
color:'#fbeacc'
|
|
}
|
|
],
|
|
columnTitles: [
|
|
{
|
|
"weekName": "星期二",
|
|
"day": "08-19",
|
|
"count": 1
|
|
},
|
|
{
|
|
"weekName": "星期三",
|
|
"day": "08-20",
|
|
"count": 3
|
|
},
|
|
{
|
|
"weekName": "星期四",
|
|
"day": "08-21",
|
|
"count": 0
|
|
},
|
|
{
|
|
"weekName": "星期五",
|
|
"day": "08-22",
|
|
"count": 1
|
|
},
|
|
{
|
|
"weekName": "星期六",
|
|
"day": "08-23",
|
|
"count": 1
|
|
},
|
|
{
|
|
"weekName": "星期日",
|
|
"day": "08-24",
|
|
"count": 2
|
|
},
|
|
{
|
|
"weekName": "星期一",
|
|
"day": "08-25",
|
|
"count": 2
|
|
},
|
|
{
|
|
"weekName": "星期二",
|
|
"day": "08-26",
|
|
"count": 1
|
|
},
|
|
{
|
|
"weekName": "星期三",
|
|
"day": "08-27",
|
|
"count": 3
|
|
},
|
|
{
|
|
"weekName": "星期四",
|
|
"day": "08-28",
|
|
"count": 0
|
|
},
|
|
{
|
|
"weekName": "星期五",
|
|
"day": "08-29",
|
|
"count": 1
|
|
},
|
|
{
|
|
"weekName": "星期六",
|
|
"day": "08-30",
|
|
"count": 1
|
|
},
|
|
{
|
|
"weekName": "星期日",
|
|
"day": "08-31",
|
|
"count": 2
|
|
},
|
|
{
|
|
"weekName": "星期一",
|
|
"day": "09-01",
|
|
"count": 2
|
|
}
|
|
],
|
|
claTimeContainer: [
|
|
{
|
|
"time": "08:30",
|
|
"claTimeWeekDayMap": {
|
|
"1": [
|
|
{
|
|
"courseTimeId": 1935590320385343489,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-08-24",
|
|
"weekDay": "星期日",
|
|
"startTime": "08:00",
|
|
"endTime": "09:30",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
},
|
|
{
|
|
"courseTimeId": 1935590320385343492,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-08-31",
|
|
"weekDay": "星期日",
|
|
"startTime": "08:00",
|
|
"endTime": "09:30",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
}
|
|
],
|
|
"2": [
|
|
{
|
|
"courseTimeId": 1935590320385343490,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-08-25",
|
|
"weekDay": "星期一",
|
|
"startTime": "08:00",
|
|
"endTime": "09:30",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
},
|
|
{
|
|
"courseTimeId": 1935590320385343493,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-09-01",
|
|
"weekDay": "星期一",
|
|
"startTime": "08:00",
|
|
"endTime": "09:30",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
}
|
|
],
|
|
"3": [],
|
|
"4": [
|
|
{
|
|
"courseTimeId": 1935590320322428930,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-08-20",
|
|
"weekDay": "星期三",
|
|
"startTime": "08:00",
|
|
"endTime": "09:30",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
},
|
|
{
|
|
"courseTimeId": 1935596230449086465,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-08-27",
|
|
"weekDay": "星期三",
|
|
"startTime": "08:00",
|
|
"endTime": "09:00",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
},
|
|
{
|
|
"courseTimeId": 1935590320385343491,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-09-03",
|
|
"weekDay": "星期三",
|
|
"startTime": "08:00",
|
|
"endTime": "09:30",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
}
|
|
],
|
|
"5": [],
|
|
"6": [],
|
|
"7": [],
|
|
"8": [],
|
|
"9": [],
|
|
"10": [],
|
|
"11": [],
|
|
"12": [],
|
|
"13": [],
|
|
"14": [],
|
|
"15": []
|
|
}
|
|
},
|
|
{
|
|
"time": "10:00",
|
|
"claTimeWeekDayMap": {
|
|
"1": [],
|
|
"2": [],
|
|
"3": [],
|
|
"4": [],
|
|
"5": [],
|
|
"6": [],
|
|
"7": [],
|
|
"8": [],
|
|
"9": [],
|
|
"10": [],
|
|
"11": [],
|
|
"12": [],
|
|
"13": [],
|
|
"14": [],
|
|
"15": []
|
|
}
|
|
},
|
|
{
|
|
"time": "11:00",
|
|
"claTimeWeekDayMap": {
|
|
"1": [],
|
|
"2": [],
|
|
"3": [],
|
|
"4": [],
|
|
"5": [],
|
|
"6": [],
|
|
"7": [],
|
|
"8": [],
|
|
"9": [],
|
|
"10": [],
|
|
"11": [],
|
|
"12": [],
|
|
"13": [],
|
|
"14": [],
|
|
"15": []
|
|
}
|
|
},
|
|
{
|
|
"time": "14:00",
|
|
"claTimeWeekDayMap": {
|
|
"1": [],
|
|
"2": [],
|
|
"3": [],
|
|
"4": [],
|
|
"5": [],
|
|
"6": [],
|
|
"7": [],
|
|
"8": [],
|
|
"9": [],
|
|
"10": [],
|
|
"11": [],
|
|
"12": [],
|
|
"13": [],
|
|
"14": [],
|
|
"15": []
|
|
}
|
|
},
|
|
{
|
|
"time": "15:00",
|
|
"claTimeWeekDayMap": {
|
|
"1": [],
|
|
"2": [],
|
|
"3": [],
|
|
"4": [],
|
|
"5": [],
|
|
"6": [],
|
|
"7": [],
|
|
"8": [],
|
|
"9": [],
|
|
"10": [],
|
|
"11": [],
|
|
"12": [],
|
|
"13": [],
|
|
"14": [],
|
|
"15": []
|
|
}
|
|
},
|
|
{
|
|
"time": "16:00",
|
|
"claTimeWeekDayMap": {
|
|
"1": [],
|
|
"2": [],
|
|
"3": [],
|
|
"4": [],
|
|
"5": [],
|
|
"6": [],
|
|
"7": [],
|
|
"8": [],
|
|
"9": [],
|
|
"10": [],
|
|
"11": [],
|
|
"12": [],
|
|
"13": [],
|
|
"14": [],
|
|
"15": []
|
|
}
|
|
},
|
|
{
|
|
"time": "17:00",
|
|
"claTimeWeekDayMap": {
|
|
"1": [],
|
|
"2": [],
|
|
"3": [],
|
|
"4": [],
|
|
"5": [],
|
|
"6": [],
|
|
"7": [],
|
|
"8": [],
|
|
"9": [],
|
|
"10": [],
|
|
"11": [],
|
|
"12": [],
|
|
"13": [],
|
|
"14": [],
|
|
"15": []
|
|
}
|
|
},
|
|
{
|
|
"time": "18:00",
|
|
"claTimeWeekDayMap": {
|
|
"1": [],
|
|
"2": [],
|
|
"3": [],
|
|
"4": [],
|
|
"5": [],
|
|
"6": [],
|
|
"7": [],
|
|
"8": [],
|
|
"9": [],
|
|
"10": [],
|
|
"11": [],
|
|
"12": [],
|
|
"13": [],
|
|
"14": [],
|
|
"15": []
|
|
}
|
|
},
|
|
{
|
|
"time": "19:30",
|
|
"claTimeWeekDayMap": {
|
|
"1": [],
|
|
"2": [],
|
|
"3": [
|
|
{
|
|
"courseTimeId": 1935590110594646018,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-08-19",
|
|
"weekDay": "星期二",
|
|
"startTime": "16:00",
|
|
"endTime": "17:30",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
}
|
|
],
|
|
"4": [],
|
|
"5": [],
|
|
"6": [
|
|
{
|
|
"courseTimeId": 1935590110657560578,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-08-29",
|
|
"weekDay": "星期五",
|
|
"startTime": "16:00",
|
|
"endTime": "17:30",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
}
|
|
],
|
|
"7": [
|
|
{
|
|
"courseTimeId": 1935590110657560579,
|
|
"claName": "普拉提A班",
|
|
"courseName": "普拉提",
|
|
"claDate": "2025-08-30",
|
|
"weekDay": "星期六",
|
|
"startTime": "16:00",
|
|
"endTime": "17:30",
|
|
"staffName": "教师A",
|
|
"studentCount": 0,
|
|
"roomName": null,
|
|
"claColor": "#409EFF",
|
|
"claTimeStatus": "1"
|
|
}
|
|
],
|
|
"8": [],
|
|
"9": [],
|
|
"10": [],
|
|
"11": [],
|
|
"12": [],
|
|
"13": [],
|
|
"14": [],
|
|
"15": []
|
|
}
|
|
}
|
|
],
|
|
|
|
};
|
|
},
|
|
onLoad(option) {
|
|
if(option.id||option.id==0){
|
|
if(parseInt(option.id)==0){
|
|
this.tabCurrentIndex=0;
|
|
}
|
|
else{
|
|
this.tabCurrentIndex=parseInt(option.id);
|
|
}
|
|
this.scrollLeft = (this.tabCurrentIndex - 1) * 60;
|
|
}
|
|
// 先获取周课表
|
|
this.loadweekcourse();
|
|
},
|
|
onShow(){
|
|
},
|
|
onReady(){
|
|
this.openId = myCache('openId');
|
|
var user = myCache('user');
|
|
this.userid = user.userid? user.userid:'';
|
|
this.phone = user.userphone;
|
|
if(this.userid==""||this.userid=="0"){
|
|
uni.navigateTo({
|
|
url: `/pages/login/login`
|
|
});
|
|
}
|
|
},
|
|
onPullDownRefresh() {
|
|
setTimeout(()=>{
|
|
uni.stopPullDownRefresh()
|
|
},100);
|
|
},
|
|
methods: {
|
|
closeDialog(){
|
|
this.$refs.pfDialog.close();
|
|
},
|
|
openDialog(){
|
|
this.$refs.pfDialog.open();
|
|
},
|
|
gotoBack(){
|
|
// 返回
|
|
uni.navigateBack({
|
|
delta: 1
|
|
});
|
|
},
|
|
getPhoneNumber(e){
|
|
if(e.phone){
|
|
this.phone = e.phone
|
|
}
|
|
if(e.userid){
|
|
this.userid = e.userid
|
|
}
|
|
},
|
|
// 获取周课表
|
|
async loadweekcourse(){
|
|
uni.showLoading();
|
|
this.loading=true;
|
|
try{
|
|
const {data: res1} = await uni.$http.get('/api/course/getCourseList');
|
|
console.log(res1);
|
|
this.loading=false;
|
|
if (res1.success) {
|
|
var data = res1.data;
|
|
this.columnTitles=data.columnTitles?data.columnTitles:[];
|
|
this.claTimeContainer=data.claTimeContainer?data.claTimeContainer:[];
|
|
this.list=[];
|
|
this.columnTitles.forEach((item,index)=>{
|
|
var lcell={
|
|
id: item.courseTimeId,
|
|
order_state:null,
|
|
loadStatus:'more', // 'more', // 'noMore',
|
|
date:(item.day).slice(-5),
|
|
redate: item.day,
|
|
week:item.weekName,
|
|
slist:[]
|
|
}
|
|
this.list.push(lcell)
|
|
})
|
|
this.$forceUpdate();
|
|
this.getOrderList();
|
|
}
|
|
else{
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '当前信息不存在..',
|
|
cancelText: '取消',
|
|
confirmText: '确定',
|
|
success: ress => {
|
|
// 返回
|
|
uni.navigateBack({
|
|
delta: 1
|
|
});
|
|
}
|
|
});
|
|
}
|
|
}
|
|
catch(e){
|
|
console.log(e);
|
|
this.loading=false;
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '当前信息不存在..',
|
|
cancelText: '取消',
|
|
confirmText: '确定',
|
|
success: ress => {
|
|
// 返回
|
|
uni.navigateBack({
|
|
delta: 1
|
|
});
|
|
}
|
|
});
|
|
}
|
|
},
|
|
// 获取日课表
|
|
async getOrderList() {
|
|
if(this.list[this.tabCurrentIndex].loadStatus!=="noMore")
|
|
{
|
|
uni.showLoading({
|
|
title: '课程加载中...'
|
|
});
|
|
var para={
|
|
date:this.list[this.tabCurrentIndex].redate
|
|
}
|
|
const {data: res} = await uni.$http.post('/api/course/getCourseListByDate', para);
|
|
if(res&&res.length>0){
|
|
this.list[this.tabCurrentIndex].loadStatus="noMore";
|
|
this.$forceUpdate();
|
|
this.list[this.tabCurrentIndex].slist=res;
|
|
this.$forceUpdate();
|
|
}
|
|
else{
|
|
this.list[this.tabCurrentIndex].loadStatus="noMore";
|
|
this.$forceUpdate();
|
|
this.list[this.tabCurrentIndex].slist=[];
|
|
this.$forceUpdate();
|
|
}
|
|
}
|
|
},
|
|
loadData(){
|
|
// 加载
|
|
if(this.list[this.tabCurrentIndex].loadStatus=="more") {
|
|
this.list[this.tabCurrentIndex].loadStatus="loading";
|
|
setTimeout(() => {
|
|
this.getOrderList();
|
|
}, 300);
|
|
}
|
|
},
|
|
getimgRemoteFile(img){
|
|
if(img){
|
|
img=img.split(',')[0];
|
|
return getRemoteFile(img)
|
|
}
|
|
else{
|
|
return require("@/static/image/theme/p1.jpg")
|
|
}
|
|
},
|
|
getYear(){
|
|
var today = new Date();
|
|
var targetday_milliseconds=today.getTime();
|
|
today.setTime(targetday_milliseconds); //注意，这行是关键代码
|
|
var tYear = today.getFullYear();
|
|
return tYear;
|
|
},
|
|
getDay(day){
|
|
var today = new Date();
|
|
var targetday_milliseconds=today.getTime() + 1000*60*60*24*day;
|
|
today.setTime(targetday_milliseconds); //注意，这行是关键代码
|
|
var tYear = today.getFullYear();
|
|
var tMonth = today.getMonth();
|
|
tMonth = this.doHandleMonth(tMonth + 1);
|
|
var tDate = today.getDate();
|
|
tDate = this.doHandleMonth(tDate);
|
|
return tYear+"/"+tMonth+"/"+tDate;
|
|
},
|
|
// 课程表切换
|
|
tabSelect0(index) {
|
|
this.tabCurrentIndex0 = index;
|
|
},
|
|
tabSelect(e) {
|
|
this.tabCurrentIndex = e.currentTarget.dataset.id;
|
|
this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60;
|
|
// 重新加载 暂不需要加载
|
|
// this.list[this.tabCurrentIndex].loadStatus="more";
|
|
// this.list[this.tabCurrentIndex].slist=[];
|
|
this.loadData();
|
|
},
|
|
animationfinish({ detail: { current } }) {
|
|
this.tabCurrentIndex = current;
|
|
this.loadData();
|
|
},
|
|
gotoorder(item){
|
|
var data=encodeURIComponent(JSON.stringify(item));
|
|
// 预定详情
|
|
uni.navigateTo({
|
|
url: `/pages/book/book?data=${data}`
|
|
});
|
|
},
|
|
gotoshare(item){
|
|
console.log("分享");
|
|
},
|
|
gotoInfo(id){
|
|
// 详情
|
|
uni.navigateTo({
|
|
url: `/pages/order/orderinfo?id=${id}`
|
|
});
|
|
},
|
|
iflogin(){
|
|
this.openId = myCache('openId');
|
|
var user = myCache('user');
|
|
this.userid = user.userid? user.userid:'';
|
|
this.phone = user.userphone;
|
|
if(this.userid==""||this.userid=="0"||this.phone==""){
|
|
uni.navigateTo({
|
|
url: `/pages/login/login`
|
|
});
|
|
return false;
|
|
}
|
|
else{
|
|
return true;
|
|
}
|
|
},
|
|
reset(){
|
|
this.orderlists=[];
|
|
// 重新加载数据
|
|
this.list.forEach((cell,idx)=>{
|
|
this.list[idx].loadStatus='more';
|
|
this.list[idx].slist=[];
|
|
});
|
|
this.$forceUpdate();
|
|
this.loadData();
|
|
},
|
|
// 获取状态栏高度
|
|
geStatusBarHeight(){
|
|
return uni.getSystemInfoSync()['statusBarHeight'];
|
|
},
|
|
// 获取导航栏高度
|
|
getNavBarHeight(){
|
|
return 45+uni.getSystemInfoSync()['statusBarHeight'];
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.page {
|
|
padding: 0;
|
|
position: relative;
|
|
background-image: url('@/static/image/bg.jpg');
|
|
background-attachment: fixed;
|
|
background-size: cover;
|
|
background-position: center center;
|
|
height: calc(100vh);
|
|
/* #ifdef H5 */
|
|
height: calc(100vh - var(--window-top));
|
|
/* #endif */
|
|
}
|
|
.headcon{
|
|
display: flex;
|
|
flex-direction: row;
|
|
background-color: #FFFFFF;
|
|
padding-top: 10rpx;
|
|
border-bottom: 1px solid #ddd;
|
|
.hback{
|
|
display: flex;
|
|
flex-direction: row;
|
|
padding: 20rpx;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
position: relative;
|
|
.htxt{
|
|
color: #000;
|
|
font-size: 30rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
.tabtip{
|
|
position: absolute;
|
|
top: -6rpx;
|
|
left: 10rpx;
|
|
position: relative;
|
|
display: inline-block;
|
|
overflow: hidden;
|
|
}
|
|
.scrolllist0{
|
|
display: flex;
|
|
flex: 1;
|
|
height: 100rpx;
|
|
background: #FFF;
|
|
white-space: nowrap;
|
|
width: 100%;
|
|
text-align: right;
|
|
}
|
|
.tabicl{
|
|
width: 130rpx;
|
|
height: 100rpx;
|
|
line-height: 100rpx;
|
|
position: relative;
|
|
display: inline-block;
|
|
overflow: hidden;
|
|
margin-right: 20rpx;
|
|
}
|
|
.ptext{
|
|
font-size: 32rpx;
|
|
font-weight: 600;
|
|
text-align: center;
|
|
color: #333333;
|
|
height: 90rpx;
|
|
}
|
|
.cur .ptext{
|
|
color: #00A99A;
|
|
font-size: 36rpx;
|
|
}
|
|
.cur .pline{
|
|
width: 40%;
|
|
height: 9rpx;
|
|
background: #00A99A;
|
|
border-radius: 6rpx;
|
|
opacity: 1;
|
|
margin-left: 30%;
|
|
}
|
|
.scrolllist{
|
|
height: 150rpx;
|
|
background: #FFF;
|
|
white-space: nowrap;
|
|
width: 100%;
|
|
}
|
|
.tabcell{
|
|
width: 98rpx;
|
|
position: relative;
|
|
display: inline-block;
|
|
overflow: hidden;
|
|
margin-left: 12rpx;
|
|
text-align: center;
|
|
margin-top: 20rpx;
|
|
.dtxt{
|
|
font-size: 28rpx;
|
|
color:#000;
|
|
font-weight: 600;
|
|
padding: 2rpx 10rpx;
|
|
margin-bottom: 4rpx;
|
|
}
|
|
.wtxt{
|
|
font-size: 28rpx;
|
|
color:#000;
|
|
margin-bottom: 10rpx;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
.tabcell.cur{
|
|
background-color: #e4f9f7;
|
|
border: 1rpx solid #00A99A;
|
|
border-radius: 10rpx;
|
|
}
|
|
|
|
.swiper-box {
|
|
flex: 1;
|
|
height: calc(100vh - var(--window-top) - 310rpx) !important;
|
|
}
|
|
.swiper-item {
|
|
height: 100%;
|
|
}
|
|
.nodata{
|
|
width: 100%;
|
|
height: calc(100vh - 400rpx) !important;
|
|
line-height: calc(100vh) !important;
|
|
background-image: url('/static/image/no.png');
|
|
background-size: 52% auto;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
font-size: 28rpx;
|
|
text-align: center;
|
|
color: #00A99A;
|
|
overflow: hidden;
|
|
}
|
|
.scell{
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
margin: 20rpx;
|
|
.oitem{
|
|
display: flex;
|
|
flex-direction: column;
|
|
background-color: #FFFFFF;
|
|
border-radius: 6rpx;
|
|
padding: 20rpx;
|
|
width: 100%;
|
|
margin-bottom: 20rpx;
|
|
.otop{
|
|
display: flex;
|
|
flex-direction: row;
|
|
padding: 10rpx 0 20rpx;
|
|
width: 100%;
|
|
border-bottom: 1rpx solid #f0f0f0;
|
|
.hleft{
|
|
display: flex;
|
|
flex:1;
|
|
align-items: center;
|
|
font-size: 30rpx;
|
|
font-weight: 600;
|
|
line-height: 32rpx;
|
|
color: #000;
|
|
}
|
|
.hright{
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
font-size: 28rpx;
|
|
color: #000;
|
|
font-weight: 600;
|
|
}
|
|
}
|
|
.oscon{
|
|
margin:20rpx 0 10rpx;
|
|
border-radius: 16rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
justify-content: center;
|
|
align-items: center;
|
|
.osimg{
|
|
width: 160rpx;
|
|
height: 260rpx;
|
|
border-radius: 10rpx;
|
|
}
|
|
.osname{
|
|
display: flex;
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-left: 26rpx;
|
|
.oscell{
|
|
display: flex;
|
|
flex-direction: row;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
.txtbg{
|
|
padding: 2rpx 15rpx;
|
|
border-radius: 30rpx;
|
|
background-color: #f3fbfb;
|
|
border: 1rpx solid #7cced6;
|
|
font-size: 26rpx;
|
|
color: #333;
|
|
margin-right: 10rpx;
|
|
}
|
|
.txtbg1{
|
|
padding: 2rpx 15rpx;
|
|
border-radius: 30rpx;
|
|
background-color: #fcf2f3;
|
|
border: 1rpx solid #f09fb6;
|
|
font-size: 26rpx;
|
|
color: #333;
|
|
margin-right: 10rpx;
|
|
}
|
|
.txtbg2{
|
|
padding: 2rpx 15rpx;
|
|
border-radius: 30rpx;
|
|
background-color: #fcf3ef;
|
|
border: 1rpx solid #e99b12;
|
|
font-size: 26rpx;
|
|
color: #333;
|
|
margin-right: 10rpx;
|
|
}
|
|
.txtbg3{
|
|
padding: 2rpx 15rpx;
|
|
border-radius: 30rpx;
|
|
background-color: #f1f8f0;
|
|
border: 1rpx solid #7dbd71;
|
|
font-size: 26rpx;
|
|
color: #333;
|
|
margin-right: 10rpx;
|
|
}
|
|
.ntip{
|
|
font-size: 26rpx;
|
|
color:#1abbc3;
|
|
line-height: 32rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
.ntxt{
|
|
font-size: 26rpx;
|
|
color:#000;
|
|
line-height: 32rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
.txt{
|
|
font-size: 24rpx;
|
|
color:#666;
|
|
margin-left: 10rpx;
|
|
}
|
|
}
|
|
.rcpm{
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 116rpx;
|
|
}
|
|
.sharebtn{
|
|
background-color: #FFF;
|
|
margin-left: 20rpx;
|
|
border-radius: 40rpx;
|
|
height: 46rpx;
|
|
line-height: 44rpx;
|
|
padding: 0 20rpx;
|
|
font-size: 24rpx;
|
|
border:1rpx solid rgb(252, 105, 0);
|
|
color:rgb(252, 105, 0) !important;
|
|
}
|
|
.sharebtn::after{
|
|
border:0 !important;
|
|
}
|
|
.orderbtn{
|
|
background-color: #00A99A !important;
|
|
margin-left: 20rpx;
|
|
border-radius: 40rpx;
|
|
height: 46rpx;
|
|
line-height: 44rpx;
|
|
padding: 0 20rpx;
|
|
font-size: 24rpx;
|
|
border:1rpx solid #00A99A;
|
|
margin-bottom: 30rpx;
|
|
}
|
|
.orderbtn::after{
|
|
border:0 !important;
|
|
}
|
|
}
|
|
}
|
|
.sitem {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex: 1;
|
|
background-color: #FFFFFF;
|
|
/*设置最小宽度，才会让元素排不下，导致换行排列*/
|
|
min-width: calc((100% - 20rpx) / 2);
|
|
max-width: calc((100% - 20rpx) / 2);
|
|
margin-right:5rpx;
|
|
margin-left:5rpx;
|
|
margin-bottom: 10rpx;
|
|
border-radius: 16rpx;
|
|
.simg{
|
|
width: 100%;
|
|
height: 360rpx;
|
|
.img{
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 16rpx 16rpx 0 0;
|
|
}
|
|
}
|
|
.sname{
|
|
font-size: 30rpx;
|
|
font-weight: 600;
|
|
color: rgb(29, 29, 29);
|
|
padding: 16rpx;
|
|
}
|
|
.sinfo{
|
|
font-size: 26rpx;
|
|
color:rgb(116, 116, 116);
|
|
padding: 0 16rpx;
|
|
height: 60rpx;
|
|
line-height: 30rpx;
|
|
overflow: hidden;
|
|
position: relative;
|
|
text-overflow: ellipsis;
|
|
display:-webkit-box;
|
|
-webkit-box-orient:vertical;
|
|
-webkit-line-clamp:2;
|
|
}
|
|
.sprices{
|
|
padding: 0 16rpx 20rpx 16rpx;
|
|
font-size: 36rpx;
|
|
color:rgb(252, 105, 0);
|
|
border-radius: 0 0 16rpx 16rpx;
|
|
.cx{
|
|
font-size: 28rpx;
|
|
color:rgb(116, 116, 116);
|
|
text-decoration: line-through;
|
|
margin-left: 20rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.table_head{
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 20;
|
|
}
|
|
.table_body{
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 19;
|
|
height: calc(100vh - 240rpx);
|
|
/* #ifdef H5 */
|
|
height: calc(100vh - 240rpx - var(--window-top));
|
|
/* #endif */
|
|
background: #f8f8f8;
|
|
}
|
|
::v-deep .uni-table-tr{
|
|
display: flex;
|
|
background: #f8f8f8;
|
|
}
|
|
::v-deep .uni-table-th{
|
|
padding:0 !important
|
|
}
|
|
::v-deep .uni-table-td{
|
|
padding:0 !important
|
|
}
|
|
::v-deep .uni-table-tr .uni-table-th:first-child {
|
|
position: sticky;
|
|
left: 0;
|
|
z-index: 10;
|
|
background-color: #FFFAF2;
|
|
}
|
|
::v-deep .uni-table-tr .uni-table-td:first-child {
|
|
position: sticky;
|
|
left: 0;
|
|
z-index: 99;
|
|
background-color: #FFFAF2;
|
|
}
|
|
.leftfix{
|
|
position: sticky;
|
|
left: 0;
|
|
z-index: 10;
|
|
background-color: #fffae0;
|
|
}
|
|
.courcon{
|
|
width: 100%;
|
|
height: calc(100vh);
|
|
/* #ifdef H5 */
|
|
height: calc(100vh - 100rpx - var(--window-top));
|
|
/* #endif */
|
|
overflow: auto;
|
|
margin: 0;
|
|
padding: 0;
|
|
.leftcell{
|
|
position: sticky;
|
|
left: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
background-color: #fffae0;
|
|
}
|
|
.rightcell{
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 240rpx;
|
|
height: 120rpx;
|
|
background-color: #ffffff;
|
|
position: relative;
|
|
}
|
|
.cnum{
|
|
position: absolute;
|
|
top:15rpx;
|
|
right: 20rpx;
|
|
min-width: 28rpx;
|
|
padding: 0 2rpx;
|
|
border-radius: 50% 50%;
|
|
background-color: #ff0000;
|
|
color: #FFF;
|
|
font-size: 22rpx;
|
|
}
|
|
.courhead{
|
|
border-radius: 8rpx;
|
|
background-color: #ffffff;
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
justify-content: center;
|
|
align-items: center;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
}
|
|
.ctitle{
|
|
font-size: 30rpx;
|
|
color:#000;
|
|
}
|
|
.courcell{
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
border-bottom: 1rpx dotted #ccc;
|
|
background-color: #ffffff;
|
|
}
|
|
.chcell{
|
|
width: 240rpx;
|
|
}
|
|
.courfix{
|
|
position: sticky;
|
|
left: 0;
|
|
z-index: 19;
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 120rpx;
|
|
height: 240rpx;
|
|
background-color: #FFFAF2;
|
|
justify-content: center;
|
|
align-items: center;
|
|
border-bottom: 1rpx dotted #ccc;
|
|
}
|
|
.courheadtext{
|
|
display: flex;
|
|
flex-direction: column;
|
|
width: 240rpx;
|
|
height: 240rpx;
|
|
justify-content: center;
|
|
align-items: center;
|
|
border-radius: 10rpx;
|
|
border-radius: 10rpx;
|
|
border-left-width: 10rpx;
|
|
border-left: solid;
|
|
}
|
|
.ctxt{
|
|
font-size: 28rpx;
|
|
line-height: 36rpx;
|
|
}
|
|
.orderbtn{
|
|
background-color: #00A99A !important;
|
|
border-radius: 40rpx;
|
|
height: 40rpx;
|
|
line-height: 38rpx;
|
|
padding: 0 20rpx;
|
|
font-size: 24rpx;
|
|
border:1rpx solid #00A99A;
|
|
margin-top: 6rpx;
|
|
}
|
|
.orderbtn::after{
|
|
border:0 !important;
|
|
}
|
|
.noorderbtn{
|
|
background-color: #c8c8c8 !important;
|
|
border-radius: 40rpx;
|
|
height: 40rpx;
|
|
line-height: 38rpx;
|
|
padding: 0 20rpx;
|
|
font-size: 24rpx;
|
|
border:1rpx solid #c8c8c8;
|
|
margin-top: 6rpx;
|
|
color:#666;
|
|
}
|
|
}
|
|
.bbtn{
|
|
margin: 20rpx 30rpx 54rpx;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #FCFCFD;
|
|
width: 314rpx;
|
|
height: 76rpx;
|
|
line-height: 76rpx;
|
|
background: #00A99A;
|
|
box-shadow: 0rpx 12rpx 64rpx 2rpx rgba(137,150,95,0.4);
|
|
border-radius: 10rpx;
|
|
opacity: 1;
|
|
&::after{
|
|
border:none;
|
|
}
|
|
}
|
|
|
|
|
|
.pcon{
|
|
width: 690rpx;
|
|
padding-top:30rpx;
|
|
padding-bottom:50rpx;
|
|
background: #FCFCFD;
|
|
box-shadow: 0rpx 128rpx 128rpx 2rpx rgba(31,47,70,0.12);
|
|
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
|
position: relative;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
.phtxt{
|
|
width: 600rpx;
|
|
margin: 20rpx auto 10rpx;
|
|
font-size: 36rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 600;
|
|
color: #23262F;
|
|
}
|
|
.ptxt
|
|
{
|
|
width: 620rpx;
|
|
margin: 0 auto 20rpx;
|
|
overflow-y: auto;
|
|
border-radius: 16rpx 16rpx 16rpx 16rpx;
|
|
opacity: 1;
|
|
border: 2rpx solid #F7F8FA;
|
|
line-height: 50rpx;
|
|
padding: 20rpx;
|
|
height:calc(100vh - 800rpx) !important;
|
|
}
|
|
.btn{
|
|
width: 520rpx;
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
background: #00A99A;
|
|
box-shadow: 0rpx 12rpx 64rpx 2rpx rgba(0,169,154,0.4);
|
|
border-radius: 254rpx 254rpx 254rpx 254rpx;
|
|
text-align: center;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC-Medium, PingFang SC;
|
|
font-weight: 500;
|
|
color: #FCFCFD;
|
|
}
|
|
}
|
|
|
|
</style>
|