feat: 完成上门页面

2025-04-16 08:59:24 +08:00 · 2025-04-16 08:59:24 +08:00 · b683bf60e3
commit b683bf60e3
parent 59a4a261bb
5 changed files with 230 additions and 5 deletions
--- a/pages.json
+++ b/pages.json
@ -52,6 +52,13 @@
 			{
 				"navigationBarTitleText" : "已和客户沟通"
 			}
+		},
+		{
+			"path" : "pages/order/arrived-on-site",
+			"style" : 
+			{
+				"navigationBarTitleText" : "完成上门"
+			}
 		}
 	],
 	"globalStyle": {
--- a/pages/order/arrived-on-site.vue
+++ b/pages/order/arrived-on-site.vue
@ -0,0 +1,187 @@
+<template>
+  <view class="ctr" v-if="data !== null">
+    <view class="group">
+      <view class="group-name flex-l line-after">
+        <me-icon class="icon" type="icon-info" color="#E18F00" size="40rpx"></me-icon>
+        <text class="text">上门后请提交信息</text>
+      </view>
+      <view class="item upload flex-sb">
+        <view class="left">
+          <view class="title flex-l">拍照打卡</view>
+          <view class="desc flex-l">请上传上门的打卡照片</view>
+        </view>
+        <view class="right flex-c">
+          <view class="up-ctr flex-direction-column" hover-class="auto-mask-layer-radius4" hover-start-time="0" hover-stay-time="50">
+            <me-icon class="icon" type="icon-upload-cloud-fill" color="var(--summaryColor)" size="36rpx"></me-icon>
+            <view class="up flex-c">点击上传</view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <me-empty-space height="376"></me-empty-space>
+    <view class="bottom">
+      <me-button @click="submit()" text="提交" width="686rpx" icon-type="icon-checkbox-circle" margin-top="32rpx"></me-button>
+    </view>
+  </view>
+</template>
+
+<script setup>
+
+import MeIcon from "../../components/me-icon/me-icon.vue";
+import MeEmptySpace from "../../components/me-empty-space/me-empty-space.vue";
+import MeButton from "../../components/me-button/me-button.vue";
+import helpers from "../../utils/helpers";
+import {ref} from 'vue'
+import {onLoad} from '@dcloudio/uni-app'
+import api from "../../api/api";
+import {throttle} from "../../utils/throttle";
+import enums from "../../utils/enums";
+
+//预约上门时间
+const submit = throttle(() => {
+  uni.showModal({
+    title: '提示信息',
+    confirmText: '确认',
+    content: '确认已到达客户地址？',
+    success: function (res) {
+      if (res.confirm) {
+        uni.showLoading({
+          title: '提交中'
+        });
+        // uni.hideLoading();
+      }
+    }
+  });
+})
+
+const id = ref(null)
+onLoad((params) => {
+  id.value = params.id
+  init()
+})
+
+const data = ref(null)
+const init = () => {
+  api.orderInfo({order_dispatch_id: id.value}).then(res => {
+    if (res.status !== enums.ORDER_DISPATCH_STATUS.STATUS_PLANIT) {
+      return helpers.showToast('该订单不可上门')
+    }
+
+    data.value = res
+  }).catch(() => {})
+}
+
+</script>
+
+<style lang="scss" scoped>
+.ctr {
+  padding: 0 32rpx;
+  box-sizing: border-box;
+  height: 100vh;
+  .group {
+    width: 100%;
+    background: var(--containerBgColor);
+    border-radius: 16rpx;
+    padding: 20rpx;
+    box-sizing: border-box;
+    margin-top: 32rpx;
+    .group-name {
+      width: 100%;
+      height: 80rpx;
+      position: relative;
+      .text {
+        font-size: 30rpx;
+        color: #E18F00;
+        margin-left: 8rpx;
+      }
+    }
+    .item {
+      width: 100%;
+    }
+    .time {
+      .item-row {
+        width: 100%;
+        height: 100rpx;
+        .title {
+          width: 200rpx;
+          height: 100rpx;
+          font-size: 30rpx;
+          color: var(--titleColor);
+        }
+        .value {
+          width: 446rpx;
+          height: 100rpx;
+          font-size: 30rpx;
+          color: var(--titleColor);
+        }
+        .value-empty {
+          color: var(--summaryColor);
+        }
+      }
+      .desc {
+        width: 100%;
+        min-height: 50rpx;
+        font-size: 28rpx;
+        color: var(--descriptionColor);
+        line-height: 48rpx;
+      }
+    }
+    .upload {
+      .left {
+        width: 516rpx;
+        height: 130rpx;
+        .title {
+          width: 100%;
+          height: 80rpx;
+          font-size: 30rpx;
+          color: var(--titleColor);
+        }
+        .desc {
+          width: 100%;
+          height: 50rpx;
+          font-size: 28rpx;
+          color: var(--descriptionColor);
+        }
+      }
+      .right {
+        width: 130rpx;
+        height: 130rpx;
+        .up-ctr {
+          width: 100rpx;
+          height: 100rpx;
+          background: var(--contentBgColor);
+          border-radius: 8rpx;
+          .up {
+            width: 100%;
+            height: 36rpx;
+            font-size: 20rpx;
+            color: var(--summaryColor);
+          }
+        }
+      }
+    }
+  }
+  .bottom {
+    width: 100%;
+    padding-top: 20rpx;
+    padding-bottom: 68rpx;
+    background: var(--pageBgColor);
+    box-sizing: border-box;
+    position: fixed;
+    bottom: 0;
+  }
+}
+</style>
+
+
+
+
+
+
+
+
+
+
+
+
+
--- a/pages/order/order-info.vue
+++ b/pages/order/order-info.vue
@ -18,7 +18,7 @@
          <text>{{data.order_info.item_title}}</text>
        </view>
      </view>
-      <template v-if="data.status !== 0">
+      <template v-if="data.status !== enums.ORDER_DISPATCH_STATUS.STATUS_TOGET">
        <view class="item-row flex-sb line-after">
          <view class="title flex-l">客户姓名</view>
          <view class="value flex-r">
@ -50,14 +50,22 @@
    </view>
    <me-empty-space height="376"></me-empty-space>

-    <view class="bottom" v-if="data.status === 0">
+<!--    待接单-->
+    <view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_TOGET">
      <me-button @click="rejectOrder()" active-color="var(--contentBgColor)" text="拒 绝" width="686rpx" text-color="var(--titleColor)"></me-button>
      <me-button @click="acceptOrder()" text="确认接单" width="686rpx" icon-type="icon-flashlight" margin-top="32rpx"></me-button>
    </view>

-    <view class="bottom" v-if="data.status === 10">
+<!--    待和客户确认上门时间-->
+    <view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_GOTIT">
      <me-button @click="selectTime()" text="已和客户沟通" width="686rpx" icon-type="icon-arrow-right-circle" margin-top="32rpx"></me-button>
    </view>
+
+<!--    待上门-->
+    <view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_PLANIT">
+      <me-button @click="openLocation()" active-color="var(--contentBgColor)" icon-type="icon-navigation" text="导航至客户地址" width="686rpx" text-color="var(--titleColor)" custom-icon-color="var(--titleColor)"></me-button>
+      <me-button @click="arrivedOnSite()" text="完成上门" width="686rpx" icon-type="icon-arrow-right-circle" margin-top="32rpx"></me-button>
+    </view>
 	</view>
 </template>

@ -72,6 +80,26 @@ import {ref, reactive, computed, watch, inject} from 'vue'
 import api from "../../api/api";
 import enums from "../../utils/enums";

+//打开客户位置
+const openLocation = () => {
+  uni.openLocation({
+    latitude: Number(data.value.order_info.lat),
+    longitude: Number(data.value.order_info.lng),
+    success: function () {
+      console.log('success');
+    },
+    fail: function () {
+      helpers.showToast('客户经纬度不正确，请联系平台')
+    }
+  });
+}
+
+//完成上门
+const arrivedOnSite = () => {
+  helpers.jumpToPage('arrived-on-site', 'id=' + id.value)
+}
+
+//选择上门时间
 const selectTime = () => {
  helpers.jumpToPage('select-time', 'id=' + id.value)
 }
--- a/pages/order/select-time.vue
+++ b/pages/order/select-time.vue
@ -33,6 +33,7 @@ import {ref} from 'vue'
 import {onLoad} from '@dcloudio/uni-app'
 import api from "../../api/api";
 import {throttle} from "../../utils/throttle";
+import enums from "../../utils/enums";

 //预约上门时间
 const submit = throttle(() => {
@ -69,8 +70,8 @@ onLoad((params) => {
 const data = ref(null)
 const init = () => {
  api.orderInfo({order_dispatch_id: id.value}).then(res => {
-    if (res.status !== 10) {
-      return helpers.showToast('该订单已预约')
+    if (res.status !== enums.ORDER_DISPATCH_STATUS.STATUS_GOTIT) {
+      return helpers.showToast('该订单不可预约上门时间')
    }

    data.value = res
--- a/utils/helpers.js
+++ b/utils/helpers.js
@ -23,6 +23,8 @@ class helpers {
 			'index': '/pages/index/index',
 			//选择上门时间
 			'select-time': '/pages/order/select-time',
+			//完成上门
+			'arrived-on-site': '/pages/order/arrived-on-site',
 		}

 		url = paths[pathName]