145 lines
4.1 KiB
Vue
145 lines
4.1 KiB
Vue
<template>
|
|
<view class="page flex-col">
|
|
<view class="header">
|
|
<headers titles="预约训练">
|
|
<uni-icons @click="goback()" type="arrow-left" color="#000000"
|
|
size="22px"></uni-icons>
|
|
</headers>
|
|
</view>
|
|
<scroll-view style="height: 100%;" scroll-y="true" class="itemContent" @scrolltolower="onReachBottomCus"
|
|
refresher-enabled @refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
|
|
<!-- 新增内容容器 -->
|
|
<view class="box_2 flex-col">
|
|
<view class="box_4 flex-col" v-for="item in appointmentList">
|
|
<view class="group_5 flex-row justify-between">
|
|
<view class="block_3 flex-col justify-between">
|
|
<text class="text_2">{{ item.reservDay }}</text>
|
|
<view class="group_6 flex-row justify-between">
|
|
<view class="text-wrapper_1 flex-col">
|
|
<text class="text_3">{{ item.subjectStr }}</text>
|
|
</view>
|
|
<view class="text-wrapper_2 flex-col">
|
|
<text class="text_4">{{ item.coach }}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="text-wrapper_3 flex-col">
|
|
<text class="text_5">{{ item.statusStr }}</text>
|
|
</view>
|
|
</view>
|
|
<view class="text-wrapper_4 flex-row justify-between">
|
|
<text class="text_6">时间范围：</text>
|
|
<text class="text_7">{{ item.reservTime }}</text>
|
|
</view>
|
|
<view class="text-wrapper_5 flex-row justify-between">
|
|
<text class="text_8">教练名称：</text>
|
|
<text class="text_9">{{ item.coachName }}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="box_6 flex-col bottom_">
|
|
<view class="text-wrapper_12 flex-col " @click="goAppointment()">
|
|
<text class="text_19">预约</text>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import headers from "@/components/header/headers.vue";
|
|
import request from "@/utils/request";
|
|
|
|
export default {
|
|
components: {headers},
|
|
data() {
|
|
return {
|
|
isTriggered: false,
|
|
pageNo: 1,
|
|
pageSize: 10,
|
|
total: 0,
|
|
appointmentList: [],
|
|
constants: {}
|
|
};
|
|
},
|
|
onLoad() {
|
|
this.getList()
|
|
},
|
|
methods: {
|
|
goback() {
|
|
uni.navigateBack()
|
|
},
|
|
getList(){
|
|
request({
|
|
url: '/app-api/drivingSchool/system/reservationCourse/list',
|
|
method: 'GET',
|
|
params: {
|
|
pageNum: this.pageNo,
|
|
pageSize: this.pageSize,
|
|
},
|
|
tenantIdFlag: false
|
|
}).then(res => {
|
|
console.log('获取预约列表',res)
|
|
if (this.pageNo === 1) {
|
|
this.total = res.data.total
|
|
this.appointmentList = []
|
|
this.appointmentList = res.data.records
|
|
}
|
|
this.appointmentList = this.appointmentList.concat(res.data.records)
|
|
})
|
|
},
|
|
/**
|
|
* 上滑加载数据
|
|
*/
|
|
onReachBottomCus() {
|
|
//判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
|
|
if (this.pageNo * this.pageSize >= this.total) {
|
|
uni.$u.toast('没有更多数据了')
|
|
return
|
|
}
|
|
//页码+1,调用获取数据的方法获取第二页数据
|
|
this.pageNo++
|
|
//此处调用自己获取数据列表的方法
|
|
this.getList()
|
|
},
|
|
/**
|
|
* 下拉刷新数据
|
|
*/
|
|
onRefresherrefresh() {
|
|
this.isTriggered = true
|
|
this.pageNo = 1
|
|
this.total = 0
|
|
this.appointmentList = []
|
|
this.getList()
|
|
},
|
|
goAppointment() {
|
|
uni.navigateTo({
|
|
url: '/newPages/appointmentAdd/index'
|
|
})
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
<style lang='scss'>
|
|
@import '../common/common.scss';
|
|
@import './assets/style/index.rpx.scss';
|
|
|
|
// 新增样式
|
|
.content-box {
|
|
margin-top: 88rpx; /* 根据头部高度调整 */
|
|
padding: 20rpx;
|
|
overflow-y: auto;
|
|
height: calc(100vh - 88rpx); /* 确保内容区域高度正确 */
|
|
}
|
|
|
|
.header {
|
|
width: 100%;
|
|
background: #f4f5f6;
|
|
box-sizing: border-box;
|
|
padding-top: 88px;
|
|
}
|
|
.bottom_{
|
|
position: fixed;
|
|
bottom: 0;
|
|
}
|
|
</style>
|