|
@@ -0,0 +1,226 @@
|
|
|
+<!-- 订单详情 -->
|
|
|
+<template>
|
|
|
+ <view class="order-detail">
|
|
|
+ <view class="user-info order-card">
|
|
|
+ <view class="font-title">基本信息</view>
|
|
|
+ <view class="user-box">
|
|
|
+ <view class="info-list">
|
|
|
+ <view>被服务人员:{{ detaile.name }}</view>
|
|
|
+ <view @click="onPhone">电话号码:<label class="phone">{{ detaile.telephone }}</label></view>
|
|
|
+ <view>地址:{{ detaile.address }}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="service-info order-card">
|
|
|
+ <view class="font-title ">备注信息</view>
|
|
|
+ <view class="info-list">
|
|
|
+ {{ detaile.remark }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="service-info order-card">
|
|
|
+ <view class="font-title">图片上传</view>
|
|
|
+ <view class="upload-box">
|
|
|
+ <view class="upload-img-item" v-for="(item, index) in fileList" :key="item.url">
|
|
|
+ <view class="delete-icon" @click="deletePic(index)"><up-icon name="close-circle-fill"
|
|
|
+ color="#f64a1f" size="18"></up-icon></view>
|
|
|
+ <img class="upload-img" :src="item.url" :alt="item.fileName" srcset="">
|
|
|
+ </view>
|
|
|
+ <img src="/static/img/upload.png" alt="" class="upload-img" @click="uploadClick('img')"
|
|
|
+ v-if="fileList.length < 10">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class=" footer-g">
|
|
|
+ <up-button type="primary" text="确定结束" @click="onSubmit"></up-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ref, toRaw } from 'vue';
|
|
|
+import { onLoad } from '@dcloudio/uni-app';
|
|
|
+import { getVolunteerOrderInfo, getVolunteerFinishSecondOrder } from '@/api/volunteer.js'
|
|
|
+import { getAddress } from '@/api/address.js'
|
|
|
+
|
|
|
+import { wxUploadFile, wxMakePhoneCall } from '@/utils/wxRequest.js'
|
|
|
+
|
|
|
+const fileList = ref([]);
|
|
|
+const orderId = ref('');
|
|
|
+const detaile = ref({});
|
|
|
+
|
|
|
+// 删除图片
|
|
|
+const deletePic = (index) => {
|
|
|
+ fileList.value.splice(index, 1);
|
|
|
+};
|
|
|
+
|
|
|
+
|
|
|
+const uploadClick = async (type) => {
|
|
|
+ const res = await wxUploadFile(type);
|
|
|
+ fileList.value = [...fileList.value, ...res];
|
|
|
+ console.log('xxxxres', res, fileList.value);
|
|
|
+}
|
|
|
+const onPhone = (phone) => {
|
|
|
+ wxMakePhoneCall(phone)
|
|
|
+}
|
|
|
+
|
|
|
+const getOrderDetail = async () => {
|
|
|
+ try {
|
|
|
+ uni.showLoading({
|
|
|
+ title: '数据加载中...'
|
|
|
+ });
|
|
|
+ const res = await getVolunteerOrderInfo({ orderId: orderId.value });
|
|
|
+ const ad_res = await getAddress(res.data.addressId);
|
|
|
+ let data = res.data;
|
|
|
+ if (ad_res.data) {
|
|
|
+ data = {
|
|
|
+ ...data,
|
|
|
+ address: ad_res.data.address,
|
|
|
+ name: ad_res.data.name,
|
|
|
+ telephone: ad_res.data.telephone
|
|
|
+ }
|
|
|
+ }
|
|
|
+ detaile.value = data;
|
|
|
+ console.log('detaile.value', detaile.value);
|
|
|
+
|
|
|
+ } catch (error) {
|
|
|
+ console.log('error', error);
|
|
|
+ uni.showToast({
|
|
|
+ title: error.msg,
|
|
|
+ icon: 'error',
|
|
|
+ })
|
|
|
+ } finally {
|
|
|
+ uni.hideLoading();
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+const onSubmit = () => {
|
|
|
+ const img_urls = fileList.value.map(item => item.url).join(',');
|
|
|
+ console.log('submit', fileList.value,img_urls);
|
|
|
+
|
|
|
+ getVolunteerFinishSecondOrder({
|
|
|
+ secondOrderId:orderId.value,
|
|
|
+ serviceLog:img_urls,
|
|
|
+ volunteerId: detaile.value.volunteerId
|
|
|
+ }).then(res=> {
|
|
|
+ if(res.code === 200){
|
|
|
+ uni.switchTab({
|
|
|
+ url: '/pages/classify'
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+onLoad((options) => {
|
|
|
+ console.log('options', options);
|
|
|
+ orderId.value = options.orderId;
|
|
|
+ // orderId.value = '1911685346559660034';
|
|
|
+
|
|
|
+ getOrderDetail();
|
|
|
+
|
|
|
+})
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.order-detail {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ padding: 12px 12px 24px;
|
|
|
+ background: rgba(245, 245, 245, 1);
|
|
|
+
|
|
|
+
|
|
|
+ .order-card {
|
|
|
+ border-radius: 8px;
|
|
|
+ background: rgba(255, 255, 255, 1);
|
|
|
+ padding: 12px;
|
|
|
+ margin-bottom: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .font-title {
|
|
|
+ margin-bottom: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .user-box {
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .user-img {
|
|
|
+ width: 65.8px;
|
|
|
+ height: 65.8px;
|
|
|
+ margin-right: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .register-box {
|
|
|
+ display: flex;
|
|
|
+ margin-bottom: 12px;
|
|
|
+
|
|
|
+ .register-img {
|
|
|
+ width: 90px;
|
|
|
+ height: 90px;
|
|
|
+ margin-right: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-list {
|
|
|
+ flex: 1;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 500;
|
|
|
+ letter-spacing: 0px;
|
|
|
+ line-height: 23.27px;
|
|
|
+ color: rgba(51, 51, 51, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .price {
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 500;
|
|
|
+ color: rgba(246, 74, 31, 1);
|
|
|
+
|
|
|
+ .price-yuan {
|
|
|
+ font-size: 13px;
|
|
|
+ font-weight: 700;
|
|
|
+ color: rgba(246, 74, 31, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .footer-g {
|
|
|
+ padding: 12px;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 18px;
|
|
|
+ left: 0px;
|
|
|
+ right: 0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload-img {
|
|
|
+ height: 68px;
|
|
|
+ width: 68px;
|
|
|
+ margin-right: 12px;
|
|
|
+ margin-bottom: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload-box {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ .upload-img-item {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ .delete-icon {
|
|
|
+ position: absolute;
|
|
|
+ top: -7px;
|
|
|
+ right: 7px;
|
|
|
+ z-index: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .phone {
|
|
|
+ color: #3c9cff;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|