jiaoyukun/NewDiverseYouthNightSchool
2
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
NewDiverseYouthNightSchool/addons/xilufitness/uniapp/pages/scheduling/scheduling.vue

280 lines
8.5 KiB
Vue
Raw Normal View History

添加拉卡拉SDK
2025-08-01 11:39:06 +08:00
<template>
<view class="xilu">
<view class="page-head bg-normal">
<view class="xilu_tab_nav">
<view class="xilu_tab_nav_link" :class="nindex==1?'active':''" @click="chooseNav(1)">团课</view>
<view class="xilu_tab_nav_link" :class="nindex==2?'active':''" @click="chooseNav(2)">私教</view>
<view class="xilu_tab_nav_link" :class="nindex==3?'active':''" @click="chooseNav(3)">活动</view>
</view>
</view>
<view class="page-foot">
<Footer :identity="2" :footState="0"></Footer>
</view>
<view class="container" style="padding-top: 108rpx;">
<view class="xilu_date_nav flex-box ml25">
<template v-for="(vo,index) in timeList">
<view :class="day_date == vo.day_date ? 'xilu_date_nav_item active' : 'xilu_date_nav_item'"
@tap="chooseDate(vo.day_date)">
<view>{{vo.day || ''}}</view>
<view class="mt5">{{vo.week || ''}}</view>
</view>
</template>
</view>
<view class="plr25 pb40" v-if="nindex==1">
<template v-if="list.length > 0">
<view class="xilu_part1_item" v-for="(vo,index) in list" @click="detail(vo.id,vo.course_type)">
<view class="flex-box">
<view class="flex-grow-1 fs34 fw500 colf">{{vo.course.title || ''}}</view>
<image src="@/static/images/xilu_arrow_white.png" mode="aspectFill" class="ico30"></image>
</view>
<view class="mt30 flex-box">
<image src="@/static/images/xilu_icon21.png" mode="widthFix" class="ico28"></image>
<view class="w352 plr10 fs28 col2">{{vo.class_time_txt2 || ''}}{{vo.start_at}}～{{vo.end_at}}
</view>
<image src="@/static/images/xilu_icon22.png" mode="widthFix" class="ico28"></image>
<view class="pl10 col9 fs28">总人数<text class="col2">{{vo.user_count || 0}}</text></view>
</view>
<view class="mt30 flex-box">
<image src="@/static/images/xilu_icon23.png" mode="widthFix" class="ico28"></image>
<view class="flex-grow-1 col9 pl10 fs28 m-ellipsis">{{vo.shop.shop_name || ''}}</view>
</view>
<view class="mt30 flex-box" @click.stop="openLocation(vo.shop.lat,vo.shop.lng)">
<image src="@/static/images/xilu_icon24.png" mode="widthFix" class="ico28"></image>
<view class="flex-grow-1 plr10 col9 fs28 m-ellipsis">{{vo.shop.address || ''}}</view>
<image src="@/static/images/xilu_guide.png" mode="widthFix" class="ico30"></image>
</view>
</view>
</template>
<template v-else>
<empty-data :tips="'暂无课程排期'" :lineHeight="200"></empty-data>
</template>
</view>
<view class="plr25 pb40" v-if="nindex==2">
<template v-if="list.length > 0">
<view class="xilu_part1_item" v-for="(vo,index) in list" @click="detail(vo.id,vo.course_type)">
<view class="flex-box">
<view class="flex-grow-1 fs34 fw500 colf">{{vo.course.title || ''}}</view>
<image src="@/static/images/xilu_arrow_white.png" mode="aspectFill" class="ico30"></image>
</view>
<view class="mt30 flex-box">
<image src="@/static/images/xilu_icon21.png" mode="widthFix" class="ico28"></image>
<view class="w352 plr10 fs28 col2">{{vo.class_time_txt2 || ''}} {{vo.start_at || ''}}～{{vo.end_at || ''}}
</view>
<image src="@/static/images/xilu_icon22.png" mode="widthFix" class="ico28"></image>
<view class="pl10 col9 fs28">总人数<text class="col2">{{vo.user_count || 0}}</text></view>
</view>
<view class="mt30 flex-box">
<image src="@/static/images/xilu_icon23.png" mode="widthFix" class="ico28"></image>
<view class="flex-grow-1 col9 pl10 fs28 m-ellipsis">{{vo.shop.shop_name || ''}}</view>
</view>
<view class="mt30 flex-box" @click.stop="openLocation(vo.shop.lat,vo.shop.lng)">
<image src="@/static/images/xilu_icon24.png" mode="widthFix" class="ico28"></image>
<view class="flex-grow-1 plr10 col9 fs28 m-ellipsis">{{vo.shop.address || ''}}</view>
<image src="@/static/images/xilu_guide.png" mode="widthFix" class="ico30"></image>
</view>
</view>
</template>
<template v-else>
<empty-data :tips="'暂无课程排期'" :lineHeight="200"></empty-data>
</template>
</view>
<view class="plr25 pb40" v-if="nindex==3">
<template v-if="list.length > 0">
<view class="xilu_part1_item" v-for="(vo,index) in list" @click="campDetail(vo.id,vo.work_camp.id)">
<view class="flex-box">
<view class="flex-grow-1 fs34 fw500 colf">{{vo.camp.title || ''}}</view>
<image src="@/static/images/xilu_arrow_white.png" mode="aspectFill" class="ico30"></image>
</view>
<view class="mt30 flex-box">
<image src="@/static/images/xilu_icon21.png" mode="widthFix" class="ico28"></image>
<view class="w352 plr10 fs28 col2">{{vo.day_date || ''}}
{{vo.day_start_at || ''}}～{{vo.day_end_at || ''}}
</view>
<image src="@/static/images/xilu_icon22.png" mode="widthFix" class="ico28"></image>
<view class="pl10 col9 fs28">总人数<text class="col2">{{vo.user_count || 0}}</text></view>
</view>
<view class="mt30 flex-box">
<image src="@/static/images/xilu_icon23.png" mode="widthFix" class="ico28"></image>
<view class="flex-grow-1 col9 pl10 fs28 m-ellipsis">{{vo.shop.shop_name || ''}}</view>
</view>
<view class="mt30 flex-box" @click.stop="openLocation(vo.shop.lat,vo.shop.lng)">
<image src="@/static/images/xilu_icon24.png" mode="widthFix" class="ico28"></image>
<view class="flex-grow-1 plr10 col9 fs28 m-ellipsis">{{vo.shop.address || ''}}</view>
<image src="@/static/images/xilu_guide.png" mode="widthFix" class="ico30"></image>
</view>
</view>
</template>
<template v-else>
<empty-data :tips="'暂无活动排期'" :lineHeight="200"></empty-data>
</template>
</view>
</view>
</view>
</template>
<script>
const app = getApp();
export default {
data() {
return {
tabList: ['团课', '活动', '私教'],
nindex: 1,
timeList: [],
day_date: '',
page: 1,
list: [],
total_count: 0
}
},
methods: {
chooseNav(e) {
this.nindex = e;
this.clearData();
},
//选择日期
chooseDate(day_date) {
this.day_date = day_date;
this.clearData();
},
//清楚数据
clearData() {
this.list = [];
this.page = 1;
this.total_count = 0;
this.getLists();
},
//获取数据
getLists() {
let _this = this;
this.$http({
url: '/addons/xilufitness/coach/getScheduling',
data: {
page: _this.page,
course_type: _this.nindex,
day_date: _this.day_date
},
method: 'get'
}).then(res => {
if (res.code == 1) {
if (_this.page > 1) {
_this.list.push(...res.data.list);
} else {
_this.list = res.data.list;
}
_this.total_count = res.data.total_count;
_this.timeList = res.data.timeList || [];
_this.day_date = _this.day_date || res.data.day_date;
}
}).catch(error => {
});
},
//详情
detail(id, is_type) {
this.$api.navigate('../scheduling_info/scheduling_info?id=' + id + '&is_type=' + is_type);
},
//活动详情
campDetail(id, work_camp_id) {
this.$api.navigate('../scheduling_info/scheduling_info?id=' + id + '&is_type=3' + '&work_camp_id=' +
work_camp_id);
},
//打开地图
openLocation(lat, lng) {
this.$api.openLocation(lat, lng);
}
},
onLoad() {
this.getLists();
},
onReachBottom() {
let list = this.list;
let total_count = this.total_count;
if (list.length > total_count) {
this.page = this.page + 1;
this.getLists();
}
}
}
</script>
<style lang="scss" scoped>
.xilu {
&_tab_nav {
height: 108rpx;
line-height: 108rpx;
padding-left: 32rpx;
&_link {
margin-right: 40rpx;
font-size: 34rpx;
font-weight: 400;
color: #FFFFFF;
display: inline-block;
vertical-align: top;
}
&_link.active {
font-weight: 500;
color: #FFCF00;
}
}
&_date_nav {
width: 700rpx;
height: 145rpx;
background: #404243;
border-radius: 20rpx;
&_item {
width: 58rpx;
height: 110rpx;
font-size: 28rpx;
font-weight: 400;
color: #FFFFFF;
margin-left: 42rpx;
line-height: 40rpx;
text-align: center;
padding-top: 13rpx;
}
&_item:first-child {
margin-left: 16rpx;
}
&_item.active {
background: #FFCF00;
border-radius: 29rpx;
color: #101010;
line-height: 40rpx;
}
}
&_part1_item {
padding: 30rpx 30rpx 25rpx;
background: #292B2C;
border-radius: 20rpx;
width: 100%;
margin-top: 30rpx;
}
}
.w352 {
width: 352rpx;
}
</style>
Reference in New Issue Copy Permalink