1 line
4.9 KiB
Plaintext
1 line
4.9 KiB
Plaintext
|
{"version":3,"file":"order-detail.js","sources":["../../../../../src/pages/order/order-detail.vue","../../../../../uniPage:/cGFnZXMvb3JkZXIvb3JkZXItZGV0YWlsLnZ1ZQ"],"sourcesContent":["<template>\r\n <view class=\"order-detail p-4 bg-white shadow rounded-lg\" v-if=\"orderDetail\">\r\n <!-- 订单头部，包含标题和状态 -->\r\n <view class=\"order-header flex justify-between items-center mb-2\">\r\n <text class=\"order-title font-bold text-lg\">{{ orderDetail.serviceInfo.serviceName }}</text>\r\n <text class=\"order-status text-sm text-gray-500\">{{ orderDetail.state }}</text>\r\n </view>\r\n\r\n <!-- 服务信息 -->\r\n <view class=\"order-info text-sm text-gray-700 mb-4\">\r\n <view>\r\n <text>服务类型:</text>\r\n {{ orderDetail.serviceInfo.type }}\r\n </view>\r\n <view>\r\n <text>服务地址:</text>\r\n {{ orderDetail.serviceInfo.address }}\r\n </view>\r\n <view>\r\n <text>预约时间:</text>\r\n {{ orderDetail.reservationTime }}\r\n </view>\r\n <view>\r\n <text>服务时长:</text>\r\n {{ orderDetail.serviceHours }} 小时\r\n </view>\r\n </view>\r\n\r\n <!-- 宠物信息 -->\r\n <view class=\"pet-info flex items-center mb-4\">\r\n <image\r\n :src=\"imgUrl(orderDetail.pet.profileUrl)\"\r\n mode=\"aspectFill\"\r\n class=\"w-16 h-16 rounded-full mr-4\"\r\n ></image>\r\n <view>\r\n <view>\r\n <text>宠物名称:</text>\r\n {{ orderDetail.pet.name }}\r\n </view>\r\n <view>\r\n <text>宠物品种:</text>\r\n {{ orderDetail.pet.breed }}\r\n </view>\r\n </view>\r\n </view>\r\n\r\n <!-- 用户信息 -->\r\n <view class=\"user-info text-sm text-gray-700 mb-4\">\r\n <view>\r\n <text>下单用户:</text>\r\n {{ orderDetail.user.nickname }} ({{ orderDetail.user.phone }})\r\n </view>\r\n <view>\r\n <text>用户地址:</text>\r\n {{ orderDetail.address.province }} {{ orderDetail.address.city }}\r\n {{ orderDetail.address.district }} {{ orderDetail.address.detailAddress }}\r\n </view>\r\n </view>\r\n\r\n <!-- 支付信息 -->\r\n <view class=\"payment-info text-sm text-gray-700 mb-4\">\r\n <view>\r\n <text>支付方式:</text>\r\n {{ orderDetail.paymentMethod }}\r\n </view>\r\n <view>\r\n <text>支付状态:</text>\r\n {{ orderDetail.isPay ? '已支付' : '未支付' }}\r\n </view>\r\n <view>\r\n <text>总价:</text>\r\n ¥{{ orderDetail.price }}\r\n </view>\r\n </view>\r\n\r\n <!-- 二维码信息 -->\r\n <view v-if=\"orderDetail.qrcode\" class=\"qrcode-info text-center mb-4\">\r\n <image :src=\"imgUrl(orderDetail.qrcode)\" mode=\"aspectFit\" class=\"w-32 h-32 mx-auto\"></image>\r\n <view class=\"text-xs text-gray-500 mt-2\">订单二维码</view>\r\n </view>\r\n </view>\r\n <view v-else class=\"text-center text-gray-500 mt-4\">加载中...</view>\r\n</template>\r\n\r\n<script lang=\"js\" setup>\r\nimport { ref } from 'vue'\r\nimport { imgUrl, toast } from '@/utils/commUtils'\r\nimport { httpGet } from '@/utils/http'\r\n\r\nconst orderDetail = ref(null)\r\n\r\nonLoad(async (options) => {\r\n const orderId = options.id // 获取传递的订单ID\r\n try {\r\n const response = await httpGet(`/order/info/${orderId}`)\r\n if (response.code === 200) {\r\n orderDetail.value = response.data\r\n // console.log('@@',orderDetail.value)\r\n } else {\r\n toast('获取订单详情失败 ' + response.message)\r\n console.error('获取订单详情失败:', response.message)\r\n }\r\n } catch (error) {\r\n toast('请求失败')\r\n console.error('请求失败:', error)\r\n }\r\n})\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.order-detail {\r\n @apply p-4 bg-white shadow rounded-lg;\r\n}\r\n\r\n.order-header {\r\n @apply flex justify-between items-center mb-2;\r\n}\r\n\r\n.order-title {
|