pet-front/pages/myOrdersManage/components/petServicePopup.vue

<template>
	<up-popup :show="show" mode="bottom" @close="close" :round="10" :closeable="true">
		<view class="popup-container">
			<view class="popup-title">服务列表</view>
			<view class="pet-list">
				<timelineService
				v-for="(item,index) in orderData"
				:key="index"
				:date="item.date"
				:status="currentStatus(item.list)"
				:list="item.list"
				:serviceBtn="false"
				/>
			</view>
		</view>
	</up-popup>
</template>

<script setup>
import { ref, defineProps, defineEmits } from 'vue';
import timelineService from "./timelineService.vue";

const props = defineProps({
	show: {
		type: Boolean,
		default: false
	},
	orderData: {
		type: Object,
		default: () => ({})
	}
});

const emit = defineEmits(['close']);
const petList = ref([]);

// 关闭弹窗
const close = () => {
	emit('close');
};

// 获取服务时间段文本
const getServiceTimeText = (timeCode) => {
	const timeMap = {
		'MORNING': '早上',
		'AFTERNOON': '下午',
		'EVENING': '晚上'
	};
	return timeMap[timeCode] || '未指定';
};

const currentStatus = list => {
	for (var index = 0; index < list.length; index++) {
		var element = list[index];
		console.log(element);
		if(element.status != '2'){//未完成
			return true
		}
	}
	return false
}

// 更新服务列表数据
const updateServiceList = () => {
	if (props.orderData && props.orderData.h5OrderVO) {
	}
};

// 暴露方法给父组件
defineExpose({
	updateServiceList
});
</script>

<style scoped lang="scss">
.popup-container {
	padding: 30rpx;
	max-height: 70vh;
	overflow-y: auto;
}

.popup-title {
	font-size: 32rpx;
	font-weight: bold;
	text-align: center;
	margin-bottom: 30rpx;
}

.pet-list {
	
}
</style>