php
/
ZhiHuiJiaoWu_UniApp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

1

master
于宏哲PHP 9 months ago
parent
9c692f4f96
commit
1d109e3d83
3 changed files with 464 additions and 330 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 16
      api/apiRoute.js
  2. 136
      pages/market/clue/class_arrangement.vue
  3. 150
      pages/market/clue/class_arrangement_detail.vue

16
api/apiRoute.js
View File

@ -334,4 +334,20 @@ export default {
async updateCallUp(data={}) { async updateCallUp(data={}) {
return await http.post('/per_update_call_up', data); return await http.post('/per_update_call_up', data);
}, },
async getDate(data={}) {
return await http.get('/course/get_date', data);
},
async courseAllList(data = {}) {
return await http.get('/course/courseAllList', data);
},
async addSchedule(data = {}) {
return await http.post('/course/addSchedule', data);
},
async scheduleList(data = {}) {
return await http.get('/course/scheduleList', data);
},
} }

136
pages/market/clue/class_arrangement.vue
View File

@ -2,7 +2,7 @@
<view class="class-arrange-root"> <view class="class-arrange-root">
<!-- 顶部日期选择 --> <!-- 顶部日期选择 -->
<view class="date-bar"> <view class="date-bar">
<view class="date-item" v-for="(item, idx) in weekList" :key="idx" :class="{active: idx === selectedDayIndex}"> <view class="date-item" v-for="(item, idx) in weekList" :key="idx" :class="{active: item.status}" @click="getDate(item.date,item.day)">
<view class="week">{{ item.week }}</view> <view class="week">{{ item.week }}</view>
<view class="day">{{ item.day }}</view> <view class="day">{{ item.day }}</view>
</view> </view>
@ -16,23 +16,23 @@
</view> </view>
<!-- 日历底部弹窗 --> <!-- 日历底部弹窗 -->
<uni-popup ref="calendarPopup" type="bottom"> <uni-popup ref="calendarPopup" type="bottom">
<uni-calendar @confirm="onCalendarConfirm" @close="closeCalendar" /> <uni-calendar @change="onCalendarChange" />
</uni-popup> </uni-popup>
<!-- 课程卡片列表 --> <!-- 课程卡片列表 -->
<view class="course-list"> <view class="course-list">
<view class="course-card" v-for="(course, idx) in courseList" :key="idx"> <view class="course-card" v-for="(course, idx) in courseList" :key="idx">
<view class="card-header"> <view class="card-header">
<view class="status-end">已结束</view> <view class="status-end">{{ getStatusText(course.status) }}</view>
</view> </view>
<view class="card-body"> <view class="card-body">
<view class="row">时间：{{ course.date }}</view> <view class="row">时间：{{ course.course_date }}</view>
<view class="row">教室：{{ course.classroom }}</view> <view class="row">教室：{{ course.venue.venue_name }}</view>
<view class="row">课程：{{ course.name }}</view> <view class="row">课程：{{ course.course.course_name }}</view>
<view class="row">人数：{{ course.count }}</view> <view class="row">人数：{{ course.available_capacity }}</view>
</view> </view>
<view class="card-footer"> <view class="card-footer">
<view class="sign-info">已签到学生 (0/{{ course.count }})</view> <view class="sign-info"></view>
<button class="detail-btn" @click="viewDetail(course)">详情</button> <button class="detail-btn" @click="viewDetail(course)">详情</button>
</view> </view>
</view> </view>
@ -41,84 +41,115 @@
</template> </template>
<script> <script>
export default { import apiRoute from '@/api/apiRoute.js';
export default {
data() { data() {
return { return {
weekList: [ weekList: [],
{ week: '星期一', day: 11 },
{ week: '星期二', day: 12 },
{ week: '星期三', day: 13 },
{ week: '星期四', day: 14 },
{ week: '星期五', day: 15 },
{ week: '星期六', day: 16 },
{ week: '星期日', day: 17 },
],
selectedDayIndex: 4, selectedDayIndex: 4,
courseList: [ date: '',
{ courseList: [],
date: '2025-06-15', resource_id:''
classroom: '时间范围教室',
name: '大课7+1类型',
count: 10,
},
{
date: '2025-06-15',
classroom: '时间范围教室',
name: '大课5+1',
count: 10,
},
],
}; };
}, },
onLoad(options) {
this.resource_id = options.resource_id
this.getDate();
},
methods: { methods: {
async getDate(date = '', day = '') {
try {
let res = await apiRoute.getDate({
'date': date,
'day': day
})
this.weekList = res.data.dates
this.date = res.data.date
let data = await apiRoute.courseAllList({
'schedule_date': this.date
})
this.courseList = data.data
} catch (error) {
console.error('获取信息失败:', error);
}
},
openCalendar() { openCalendar() {
this.$refs.calendarPopup.open(); this.$refs.calendarPopup.open();
}, },
closeCalendar() { closeCalendar() {
console.log(123123)
this.$refs.calendarPopup.close(); this.$refs.calendarPopup.close();
}, },
viewDetail(course) { viewDetail(course) {
// 跳转到课程详情页 // 跳转到课程详情页
this.$navigateTo({ this.$navigateTo({
url: '/pages/market/clue/class_arrangement_detail?date=' + course.date url: '/pages/market/clue/class_arrangement_detail?id=' + course.id+'&resource_id='+this.resource_id
}); });
}, },
onCalendarConfirm(e) { onCalendarConfirm(e) {
this.closeCalendar();
// 这里可以处理选中的日期 e.fulldate // 这里可以处理选中的日期 e.fulldate
uni.showToast({ title: '选择日期：' + e.fulldate, icon: 'none' }); uni.showToast({
title: '选择日期：' + e.fulldate,
icon: 'none'
});
this.closeCalendar();
},
onCalendarChange(e) {
this.getDate(e.fulldate, e.date);
this.closeCalendar();
}, },
getStatusText(status) {
const statusMap = {
pending: '待开始',
upcoming: '即将开始',
ongoing: '进行中',
completed: '已结束'
};
return statusMap[status] || status;
}
}, },
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.class-arrange-root { .class-arrange-root {
background: #232323; background: #232323;
min-height: 100vh; min-height: 100vh;
padding-bottom: 30rpx; padding-bottom: 30rpx;
} }
.date-bar {
.date-bar {
display: flex; display: flex;
align-items: center; align-items: center;
background: #232323; background: #232323;
padding: 0 0 10rpx 0; padding: 0 0 10rpx 0;
overflow-x: auto; overflow-x: auto;
border-bottom: 1px solid #333; border-bottom: 1px solid #333;
.date-item { .date-item {
flex: 1; flex: 1;
text-align: center; text-align: center;
color: #bdbdbd; color: #bdbdbd;
padding: 16rpx 0 0 0; padding: 16rpx 0 0 0;
.week { .week {
font-size: 22rpx; font-size: 22rpx;
} }
.day { .day {
font-size: 28rpx; font-size: 28rpx;
margin-top: 4rpx; margin-top: 4rpx;
} }
&.active { &.active {
color: #29d3b4; color: #29d3b4;
.day { .day {
border-radius: 50%; border-radius: 50%;
background: #333; background: #333;
@ -127,14 +158,16 @@ export default {
} }
} }
} }
} }
.more-bar-wrapper {
.more-bar-wrapper {
width: 100%; width: 100%;
display: flex; display: flex;
justify-content: center; justify-content: center;
margin: 10rpx 0 0 0; margin: 10rpx 0 0 0;
} }
.more-bar {
.more-bar {
display: flex; display: flex;
align-items: center; align-items: center;
color: #bdbdbd; color: #bdbdbd;
@ -143,19 +176,23 @@ export default {
background: #333; background: #333;
border-radius: 20rpx; border-radius: 20rpx;
padding: 8rpx 24rpx; padding: 8rpx 24rpx;
} }
.course-list {
.course-list {
margin-top: 20rpx; margin-top: 20rpx;
.course-card { .course-card {
background: #434544; background: #434544;
border-radius: 10rpx; border-radius: 10rpx;
margin: 0 0 20rpx 0; margin: 0 0 20rpx 0;
padding: 0 0 20rpx 0; padding: 0 0 20rpx 0;
box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.08); box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.08);
.card-header { .card-header {
display: flex; display: flex;
justify-content: flex-end; justify-content: flex-end;
padding: 10rpx 20rpx 0 0; padding: 10rpx 20rpx 0 0;
.status-end { .status-end {
background: #e95c6b; background: #e95c6b;
color: #fff; color: #fff;
@ -164,23 +201,28 @@ export default {
font-size: 22rpx; font-size: 22rpx;
} }
} }
.card-body { .card-body {
padding: 0 20rpx; padding: 0 20rpx;
.row { .row {
color: #fff; color: #fff;
font-size: 24rpx; font-size: 24rpx;
margin: 8rpx 0; margin: 8rpx 0;
} }
} }
.card-footer { .card-footer {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 0 20rpx; padding: 0 20rpx;
.sign-info { .sign-info {
color: #bdbdbd; color: #bdbdbd;
font-size: 22rpx; font-size: 22rpx;
} }
.detail-btn { .detail-btn {
background: transparent; background: transparent;
border: 2rpx solid #ffd86b; border: 2rpx solid #ffd86b;
@ -192,5 +234,5 @@ export default {
} }
} }
} }
} }
</style> </style>

150
pages/market/clue/class_arrangement_detail.vue
View File

@ -2,7 +2,7 @@
<view class="detail-root"> <view class="detail-root">
<view class="header"> <view class="header">
<view class="title">课程安排详情</view> <view class="title">课程安排详情</view>
<view class="date">日期：{{ date }}</view> <view class="date">日期：{{ course_info.course_date }} {{course_info.time_slot}}</view>
</view> </view>
<view class="section"> <view class="section">
<view class="section-title">学员列表</view> <view class="section-title">学员列表</view>
@ -11,16 +11,10 @@
<view class="avatar">{{ stu.name.charAt(0) }}</view> <view class="avatar">{{ stu.name.charAt(0) }}</view>
<view class="info"> <view class="info">
<view class="name">{{ stu.name }}</view> <view class="name">{{ stu.name }}</view>
<view class="desc">{{ stu.desc }}</view> <view class="desc">{{ getStatusText(stu.status)}}</view>
</view> </view>
</view> </view>
<view <view v-for="n in course_info.available_capacity" :key="n" class="student-item empty" @tap="addStudent" :data-index="n">
v-for="n in emptyArray"
:key="n"
class="student-item empty"
@tap="addStudent"
:data-index="n"
>
<view class="avatar empty-avatar">+</view> <view class="avatar empty-avatar">+</view>
<view class="info"> <view class="info">
<view class="name">空位</view> <view class="name">空位</view>
@ -33,79 +27,155 @@
</template> </template>
<script> <script>
export default { import apiRoute from '@/api/apiRoute.js';
export default {
data() { data() {
return { return {
course_id:'',
course_info:[],
date: '', date: '',
students: [ students: [
{ name: '张三', desc: '已签到' }, // {
{ name: '李四', desc: '未签到' }, // name: '张三',
// desc: '已签到'
// },
// {
// name: '李四',
// desc: '未签到'
// },
], ],
maxCount: 5, resource_id:''
}; };
}, },
computed: { onLoad(query) {
emptyCount() { this.course_id = query.id || '';
return this.maxCount - this.students.length; this.resource_id = query.resource_id
this.courseInfo();
}, },
emptyArray() { methods: {
return Array.from({length: this.emptyCount}, (v, i) => i + 1); getStatusText(status) {
const statusMap = {
0: '待上课',
1: '已上课',
2: '请假'
};
return statusMap[status] || status;
}, },
async scheduleList() {
try {
let res = await apiRoute.scheduleList({
'schedule_id': this.course_id
})
console.log(res);
this.students = res.data
} catch (error) {
console.error('获取信息失败:', error);
}
}, },
onLoad(query) { async courseInfo() {
this.date = query.date || ''; try {
let res = await apiRoute.courseInfo({
'id': this.course_id
})
this.course_info = res.data
this.scheduleList();
} catch (error) {
console.error('获取信息失败:', error);
}
}, },
methods: { async addStudent(e) {
addStudent(e) { const data = {
const n = e.currentTarget.dataset.index; 'resources_id':this.resource_id,
uni.showToast({ title: '添加学员功能待实现，空位号：' + n, icon: 'none' }); 'person_type':'customer_resource',
'schedule_id':this.course_id,
'course_date':this.course_info.course_date,
'time_slot':this.course_info.time_slot
};
try {
let res = await apiRoute.addSchedule(data)
if(res.code == 1){
uni.showToast({
title: '添加成功',
icon: 'none'
});
this.courseInfo();
}else{
uni.showToast({
title: res.msg,
icon: 'none'
});
}
} catch (error) {
uni.showToast({
title: '添加失败',
icon: 'none'
});
}
// const n = e.currentTarget.dataset.index;
// uni.showToast({
// title: '添加学员功能待实现，空位号：' + n,
// icon: 'none'
// });
}, },
}, },
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.detail-root { .detail-root {
background: #232323; background: #232323;
min-height: 100vh; min-height: 100vh;
padding-bottom: 30rpx; padding-bottom: 30rpx;
} }
.header {
.header {
padding: 40rpx 30rpx 20rpx 30rpx; padding: 40rpx 30rpx 20rpx 30rpx;
.title { .title {
color: #fff; color: #fff;
font-size: 36rpx; font-size: 36rpx;
font-weight: bold; font-weight: bold;
} }
.date { .date {
color: #29d3b4; color: #29d3b4;
font-size: 26rpx; font-size: 26rpx;
margin-top: 10rpx; margin-top: 10rpx;
} }
} }
.section {
.section {
margin: 30rpx; margin: 30rpx;
background: #434544; background: #434544;
border-radius: 16rpx; border-radius: 16rpx;
padding: 30rpx 20rpx; padding: 30rpx 20rpx;
} }
.section-title {
.section-title {
color: #ffd86b; color: #ffd86b;
font-size: 28rpx; font-size: 28rpx;
margin-bottom: 20rpx; margin-bottom: 20rpx;
} }
.student-list {
.student-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
gap: 20rpx; gap: 20rpx;
} }
.student-item {
.student-item {
background: #333; background: #333;
border-radius: 12rpx; border-radius: 12rpx;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 18rpx 24rpx; padding: 18rpx 24rpx;
min-width: 260rpx; min-width: 260rpx;
.avatar { .avatar {
width: 60rpx; width: 60rpx;
height: 60rpx; height: 60rpx;
@ -118,31 +188,37 @@ export default {
font-size: 32rpx; font-size: 32rpx;
margin-right: 18rpx; margin-right: 18rpx;
} }
.info { .info {
.name { .name {
color: #fff; color: #fff;
font-size: 28rpx; font-size: 28rpx;
} }
.desc { .desc {
color: #bdbdbd; color: #bdbdbd;
font-size: 22rpx; font-size: 22rpx;
margin-top: 4rpx; margin-top: 4rpx;
} }
} }
&.empty { &.empty {
border: 2rpx dashed #ffd86b; border: 2rpx dashed #ffd86b;
background: #232323; background: #232323;
.avatar.empty-avatar { .avatar.empty-avatar {
background: #ffd86b; background: #ffd86b;
color: #232323; color: #232323;
font-size: 36rpx; font-size: 36rpx;
} }
.info .name { .info .name {
color: #ffd86b; color: #ffd86b;
} }
.info .desc { .info .desc {
color: #ffd86b; color: #ffd86b;
} }
} }
} }
</style> </style>
Write Preview
Loading…
Cancel
Save