<template>
|
|
<up-list @scrolltolower="scrolltolower">
|
|
<up-list-item>
|
|
<view v-if="list && list.length > 0">
|
|
<view class="mb28 container-list-item"
|
|
@click.stop="toOrderDetail(item.id)"
|
|
v-for="(item, index) in list"
|
|
:key="item.id">
|
|
<view class="flex-between flex" style="background: #FFF4E5;padding: 22rpx 42rpx">
|
|
<view>{{ orderStatus[item.status] }}</view>
|
|
<view>本单酬劳
|
|
<text style="color: #FF530A">¥{{ item.orderGivePrice }}</text>
|
|
</view>
|
|
</view>
|
|
<view class="container-list">
|
|
<view class="flex-between flex mb28"
|
|
:key="index"
|
|
style="justify-content: flex-start;"
|
|
v-for="(pet, index) in item.h5OrderVO.petVOList">
|
|
<up-image style="flex-shrink:0" class="mr20" width="70px" height="70px"
|
|
:src="pet.photo" shape="circle"></up-image>
|
|
<view style="display: flex;flex-direction: column;gap: 20rpx;">
|
|
<!-- <view class="font28 col3">服务天数: 共{{ pet.orderServiceText.length }}天 I {{ pet.orderServiceText.join(',') }}
|
|
</view> -->
|
|
<view class="font28 col3">服务天数: 共{{ pet.orderServiceText.length }}天 I
|
|
{{ pet.orderServiceText.length >= 2 ? `${pet.orderServiceText[0]},${pet.orderServiceText[pet.orderServiceText.length - 1]}` : pet.orderServiceText.join(',') }}
|
|
</view>
|
|
<!-- <view style="margin: 18rpx 0">期望上门时间:早</view> -->
|
|
<view>{{ pet.breed }}{{ pet.bodyType }} | {{ pet.productNameText.join(',') }}</view>
|
|
</view>
|
|
</view>
|
|
<view class="mb28 address">{{ item.address }}</view>
|
|
<view class="mb28" v-if="item.type == 0">订单为系统派发,请确认订单信息后再抢单</view>
|
|
<view class="flex flex-between">
|
|
|
|
<!-- <up-button type="primary" text="订单详情"
|
|
shape="circle"
|
|
class="mr20" color="#FFAA48"></up-button> -->
|
|
|
|
<up-button type="primary" text="打卡记录"
|
|
@click.stop="showServicePopup(item)"
|
|
shape="circle"
|
|
class="mr20" color="#FFAA48"></up-button>
|
|
|
|
<up-button type="primary" text="宠物档案"
|
|
@click.stop="toPet(item)" shape="circle" class="mr20"
|
|
color="#FFAA48"></up-button>
|
|
|
|
<up-button type="primary" text="服务档案"
|
|
@click.stop="toService(item)" shape="circle"
|
|
color="#FFAA48"></up-button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-else class="empty-state">
|
|
<text class="empty-text">暂无订单数据</text>
|
|
</view>
|
|
</up-list-item>
|
|
</up-list>
|
|
|
|
<!-- 宠物服务时间弹窗 -->
|
|
<pet-service-popup :show="popupVisible" :orderData="currentOrder" @close="closeServicePopup" ref="servicePopupRef" />
|
|
</template>
|
|
<script setup>
|
|
import { onMounted, ref, computed } from 'vue';
|
|
import PetServicePopup from './petServicePopup.vue';
|
|
import {
|
|
appletOrderDateFrequencyList,
|
|
} from "@/api/order/frequency.js"
|
|
|
|
import {
|
|
useStore
|
|
} from "vuex"
|
|
const store = useStore();
|
|
|
|
const userInfo = computed(() => {
|
|
return store.getters.userInfo;
|
|
})
|
|
|
|
|
|
const scrolltolower = () => {
|
|
|
|
}
|
|
|
|
onMounted(() => {
|
|
console.log(props)
|
|
})
|
|
|
|
const props = defineProps({
|
|
list: {
|
|
type: Array,
|
|
required: true
|
|
},
|
|
current: {
|
|
type: Number,
|
|
required: true
|
|
}
|
|
});
|
|
const orderStatus = ['待接单','进行中','已完成']
|
|
|
|
// 弹窗相关状态
|
|
const popupVisible = ref(false);
|
|
const currentOrder = ref([]);
|
|
const servicePopupRef = ref(null);
|
|
|
|
|
|
function toClock(item) {
|
|
|
|
item.h5OrderVO.orderItemList
|
|
|
|
let itemID = 0
|
|
|
|
if(item.h5OrderVO.orderServiceList && item.h5OrderVO.orderServiceList[0]){
|
|
itemID = item.h5OrderVO.orderServiceList[0].id
|
|
}
|
|
|
|
const paths = [
|
|
`/otherPages/myOrdersManage/clock/index?id=${item.orderId}&itemID=${itemID}`,
|
|
`/otherPages/myOrdersManage/clock/index?id=${item.orderId}&itemID=${itemID}`,
|
|
`/otherPages/myOrdersManage/clock/index?isRead=true&id=${item.orderId}&itemID=${itemID}`,
|
|
]
|
|
uni.navigateTo({
|
|
url: paths[item.orderStatus]
|
|
})
|
|
}
|
|
|
|
// 跳转订单详情
|
|
const toOrderDetail = (id) => {
|
|
// uni.navigateTo({
|
|
// url: `/otherPages/orderTakingManage/detail/index?id=${id}&type=my`
|
|
// });
|
|
}
|
|
|
|
// 显示服务时间弹窗
|
|
function showServicePopup(item) {
|
|
// 如果是已完成状态,直接跳转到打卡记录页面
|
|
// if (item.orderStatus === 2) {
|
|
// return toClock(item);
|
|
// }
|
|
|
|
|
|
appletOrderDateFrequencyList({
|
|
masterId: userInfo.value.userId,
|
|
orderId : item.orderId,
|
|
}).then(res => {
|
|
// 显示弹窗并设置当前订单数据
|
|
currentOrder.value = res.data;
|
|
popupVisible.value = true;
|
|
if (servicePopupRef.value) {
|
|
servicePopupRef.value.updateServiceList();
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
// 关闭服务时间弹窗
|
|
function closeServicePopup() {
|
|
popupVisible.value = false;
|
|
}
|
|
|
|
function toPet(item) {
|
|
uni.navigateTo({
|
|
url: "/otherPages/orderTakingManage/pet/index?id=" + item.orderId
|
|
})
|
|
}
|
|
|
|
function toService(item) {
|
|
uni.navigateTo({
|
|
url: "/otherPages/myOrdersManage/service/index?id=" + item.orderId
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@import "../index";
|
|
|
|
.empty-state {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 40rpx;
|
|
}
|
|
|
|
.empty-image {
|
|
width: 200rpx;
|
|
height: 200rpx;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.empty-text {
|
|
color: #999;
|
|
font-size: 28rpx;
|
|
}
|
|
</style>
|