357 lines
7.9 KiB
Vue
357 lines
7.9 KiB
Vue
|
<template>
|
|||
|
|
<view class="container">
|
|||
|
|
<!-- 订单信息 -->
|
|||
|
|
<view class="order-card">
|
|||
|
|
<view class="card-title">订单信息</view>
|
|||
|
|
<view class="info-row">
|
|||
|
|
<text class="label">服务名称：</text>
|
|||
|
|
<text class="value">{{ orderInfo.serviceName }}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-row">
|
|||
|
|
<text class="label">服务时间：</text>
|
|||
|
|
<text class="value">{{ form.serviceDate }} {{ form.timeSlot }}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="info-row">
|
|||
|
|
<text class="label">服务地址：</text>
|
|||
|
|
<text class="value">{{ form.serviceAddress }}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 选择陪伴员 -->
|
|||
|
|
<view class="section">
|
|||
|
|
<view class="section-title">选择陪伴员</view>
|
|||
|
|
|
|||
|
|
<view class="teacher-list">
|
|||
|
|
<view
|
|||
|
|
v-for="teacher in teacherList"
|
|||
|
|
:key="teacher.id"
|
|||
|
|
class="teacher-item"
|
|||
|
|
:class="{ selected: form.teacherId === teacher.id }"
|
|||
|
|
@click="selectTeacher(teacher)"
|
|||
|
|
>
|
|||
|
|
<image :src="teacher.avatar || '/static/images/avatar.png'" mode="aspectFill" />
|
|||
|
|
<view class="teacher-info">
|
|||
|
|
<text class="teacher-name">{{ teacher.teacherName }}</text>
|
|||
|
|
<text class="teacher-subjects">{{ teacher.subjects || '暂无科目' }}</text>
|
|||
|
|
<text class="teacher-level">{{ getLevelText(teacher.level) }}</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="check-icon" v-if="form.teacherId === teacher.id">
|
|||
|
|
<text class="iconfont icon-check"></text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view v-if="teacherList.length === 0" class="empty">
|
|||
|
|
<text>暂无可用陪伴员</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 服务要求 -->
|
|||
|
|
<view class="section">
|
|||
|
|
<view class="section-title">服务要求</view>
|
|||
|
|
<textarea
|
|||
|
|
v-model="form.serviceRequirement"
|
|||
|
|
placeholder="请输入服务要求（选填）"
|
|||
|
|
maxlength="500"
|
|||
|
|
/>
|
|||
|
|
<view class="count">{{ form.serviceRequirement.length }}/500</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 提交按钮 -->
|
|||
|
|
<view class="submit-btn">
|
|||
|
|
<button @click="submit" :disabled="!canSubmit">确认派单</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { managerApi, orderApi } from '@/api/index.js'
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
orderId: null,
|
|||
|
|
workOrderId: null,
|
|||
|
|
managerId: null,
|
|||
|
|
orderInfo: {},
|
|||
|
|
teacherList: [],
|
|||
|
|
form: {
|
|||
|
|
teacherId: null,
|
|||
|
|
serviceDate: '',
|
|||
|
|
timeSlot: '',
|
|||
|
|
serviceAddress: '',
|
|||
|
|
serviceRequirement: ''
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
canSubmit() {
|
|||
|
|
return this.form.teacherId && this.form.serviceDate && this.form.timeSlot
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(options) {
|
|||
|
|
this.orderId = options.orderId
|
|||
|
|
this.workOrderId = options.workOrderId
|
|||
|
|
this.managerId = options.managerId
|
|||
|
|
this.loadOrderInfo()
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
async loadOrderInfo() {
|
|||
|
|
try {
|
|||
|
|
const res = await orderApi.getOrderDetail(this.orderId)
|
|||
|
|
this.orderInfo = res
|
|||
|
|
|
|||
|
|
this.form.serviceDate = res.serviceDate
|
|||
|
|
this.form.timeSlot = res.timeSlot
|
|||
|
|
this.form.serviceAddress = res.serviceAddress
|
|||
|
|
|
|||
|
|
this.loadAvailableTeachers()
|
|||
|
|
} catch (error) {
|
|||
|
|
uni.showToast({ title: '加载订单信息失败', icon: 'none' })
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
async loadAvailableTeachers() {
|
|||
|
|
try {
|
|||
|
|
const res = await managerApi.getAvailableTeachers({
|
|||
|
|
serviceId: this.orderInfo.serviceId,
|
|||
|
|
serviceDate: this.form.serviceDate,
|
|||
|
|
timeSlot: this.form.timeSlot
|
|||
|
|
})
|
|||
|
|
this.teacherList = res
|
|||
|
|
} catch (error) {
|
|||
|
|
uni.showToast({ title: '加载陪伴员列表失败', icon: 'none' })
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
selectTeacher(teacher) {
|
|||
|
|
this.form.teacherId = teacher.id
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
getLevelText(level) {
|
|||
|
|
const levelMap = {
|
|||
|
|
normal: '普通教师',
|
|||
|
|
gold: '金牌教师',
|
|||
|
|
scholar: '学霸教师'
|
|||
|
|
}
|
|||
|
|
return levelMap[level] || '普通教师'
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
async submit() {
|
|||
|
|
if (!this.canSubmit) return
|
|||
|
|
|
|||
|
|
uni.showLoading({ title: '派单中...' })
|
|||
|
|
|
|||
|
|
try {
|
|||
|
|
await managerApi.assignOrder({
|
|||
|
|
orderId: this.orderId,
|
|||
|
|
managerId: this.managerId,
|
|||
|
|
teacherId: this.form.teacherId,
|
|||
|
|
serviceDate: this.form.serviceDate,
|
|||
|
|
timeSlot: this.form.timeSlot,
|
|||
|
|
serviceAddress: this.form.serviceAddress,
|
|||
|
|
serviceRequirement: this.form.serviceRequirement
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
uni.hideLoading()
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '派单成功',
|
|||
|
|
icon: 'success',
|
|||
|
|
duration: 2000
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack()
|
|||
|
|
}, 2000)
|
|||
|
|
} catch (error) {
|
|||
|
|
uni.hideLoading()
|
|||
|
|
uni.showToast({
|
|||
|
|
title: error.message || '派单失败',
|
|||
|
|
icon: 'none'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.container {
|
|||
|
|
min-height: 100vh;
|
|||
|
|
background: #f8f8f8;
|
|||
|
|
padding: 20rpx 30rpx 120rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.order-card {
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
padding: 30rpx;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
|
|||
|
|
.card-title {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #333;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
padding-left: 20rpx;
|
|||
|
|
border-left: 6rpx solid #667eea;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.info-row {
|
|||
|
|
display: flex;
|
|||
|
|
margin-bottom: 16rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
|
|||
|
|
&:last-child {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.label {
|
|||
|
|
color: #999;
|
|||
|
|
min-width: 180rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.value {
|
|||
|
|
flex: 1;
|
|||
|
|
color: #333;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.section {
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
padding: 30rpx;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
|
|||
|
|
.section-title {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #333;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
padding-left: 20rpx;
|
|||
|
|
border-left: 6rpx solid #667eea;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
textarea {
|
|||
|
|
width: 100%;
|
|||
|
|
min-height: 200rpx;
|
|||
|
|
padding: 20rpx;
|
|||
|
|
background: #f8f8f8;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #333;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.count {
|
|||
|
|
text-align: right;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #999;
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.teacher-list {
|
|||
|
|
.teacher-item {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
padding: 24rpx;
|
|||
|
|
background: #f8f8f8;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
margin-bottom: 16rpx;
|
|||
|
|
position: relative;
|
|||
|
|
|
|||
|
|
&:last-child {
|
|||
|
|
margin-bottom: 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
&.selected {
|
|||
|
|
background: #e6f7ff;
|
|||
|
|
border: 2rpx solid #667eea;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
image {
|
|||
|
|
width: 100rpx;
|
|||
|
|
height: 100rpx;
|
|||
|
|
border-radius: 50rpx;
|
|||
|
|
margin-right: 20rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.teacher-info {
|
|||
|
|
flex: 1;
|
|||
|
|
|
|||
|
|
.teacher-name {
|
|||
|
|
display: block;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #333;
|
|||
|
|
margin-bottom: 8rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.teacher-subjects {
|
|||
|
|
display: block;
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #666;
|
|||
|
|
margin-bottom: 8rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.teacher-level {
|
|||
|
|
display: inline-block;
|
|||
|
|
padding: 4rpx 16rpx;
|
|||
|
|
background: #fff7e6;
|
|||
|
|
color: #fa8c16;
|
|||
|
|
font-size: 22rpx;
|
|||
|
|
border-radius: 20rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.check-icon {
|
|||
|
|
width: 48rpx;
|
|||
|
|
height: 48rpx;
|
|||
|
|
background: #667eea;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: center;
|
|||
|
|
|
|||
|
|
.iconfont {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.empty {
|
|||
|
|
text-align: center;
|
|||
|
|
padding: 80rpx 0;
|
|||
|
|
color: #999;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.submit-btn {
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
right: 0;
|
|||
|
|
padding: 20rpx 30rpx;
|
|||
|
|
background: #fff;
|
|||
|
|
border-top: 1rpx solid #eee;
|
|||
|
|
|
|||
|
|
button {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 88rpx;
|
|||
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|||
|
|
color: #fff;
|
|||
|
|
border: none;
|
|||
|
|
border-radius: 44rpx;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
|
|||
|
|
&[disabled] {
|
|||
|
|
background: #ccc;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</style>
|