|
@@ -2,50 +2,45 @@
|
|
|
<template>
|
|
|
<view>
|
|
|
<view class="order-detail">
|
|
|
- <view class="service-info">
|
|
|
- <PositioningMap :address="detaile.address" />
|
|
|
- </view>
|
|
|
- <view class="user-info order-card">
|
|
|
- <view class="handle-user">
|
|
|
- <view class="handle-user-left">
|
|
|
- <img :src="detaile.avatar" alt=""
|
|
|
- style="width: 96rpx; height: 96rpx; margin-right: 32rpx" />
|
|
|
- <view class="handle-user-info">
|
|
|
- <view class="user-name">{{ detaile.clientName }}</view>
|
|
|
- <view class="user-id" style="display: flex">服务类别:{{ detaile.businessTireName }}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- <view class="user-phone" @click="onPhone(detaile.clientPhoneNumber)">
|
|
|
- <up-icon name="phone" color="#fff" size="25"></up-icon>
|
|
|
- </view> -->
|
|
|
- </view>
|
|
|
+ <PositioningMap :address="detaile.address" />
|
|
|
+ </view>
|
|
|
|
|
|
- <view class="handle-adress">
|
|
|
- <up-icon name="map" color="rgba(156, 163, 175, 1)" size="20"></up-icon>
|
|
|
- <view class="adress-text">{{ detaile.address }}</view>
|
|
|
- <!-- <up-icon name="pushpin" color="rgba(221, 94, 69, 1)" size="25"></up-icon> -->
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <view class="handle-remark">
|
|
|
- <text class="remark-title">服务次数:{{detaile.singleQuantity }}次</text>
|
|
|
- </view>
|
|
|
- <view class="handle-remark">
|
|
|
- <text class="remark-title">服务时间: {{ detaile.workDate + ' '+ detaile.workStartTime }}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
+ <view class="user-info">
|
|
|
+ <view class="handle-user-info">
|
|
|
+ <view class="user-name">下单时间:{{ detaile.createTime }}</view>
|
|
|
+ <view>上门时间:{{ detaile.workDate + ' ' + detaile.workStartTime }}</view>
|
|
|
+ <view>服务人员:{{ detaile.clientName }} 123123456</view>
|
|
|
+ <view class="user-id" style="display: flex">服务类别:{{ detaile.businessTireName }}</view>
|
|
|
+ <view class="adress-text">地址:{{ detaile.address }}</view>
|
|
|
<view class="handle-remark">
|
|
|
<view class="remark-title">备注</view>
|
|
|
<view class="remark-text">{{ detaile.remark || '暂无备注' }}</view>
|
|
|
</view>
|
|
|
+ <view class="footer-g">
|
|
|
+ <view class="handle-start" v-if="orderStatus && detaile.serviceStartTime && dateData">
|
|
|
+ 服务已开始:<text class="handle-time">{{ dateData }}</text>
|
|
|
+ </view>
|
|
|
+ <Slide ref="verify" @change="change" :sliderText="slideData" :btnType="orderStatus ? 'upload' : 'start'" />
|
|
|
+ </view>
|
|
|
</view>
|
|
|
+
|
|
|
</view>
|
|
|
- <view class="footer-g">
|
|
|
- <view class="handle-start" v-if="orderStatus && detaile.serviceStartTime && dateData">
|
|
|
- 服务已开始:<text class="handle-time">{{ dateData }}</text>
|
|
|
+
|
|
|
+ <!-- <view class="handle-adress">
|
|
|
+ <up-icon name="map" color="rgba(156, 163, 175, 1)" size="20"></up-icon>
|
|
|
+ </view> -->
|
|
|
+ <!-- <view>
|
|
|
+ <view class="handle-remark">
|
|
|
+ <text class="remark-title">服务次数:{{ detaile.singleQuantity }}次</text>
|
|
|
</view>
|
|
|
- <Slide ref="verify" @change="change" :sliderText="slideData" :btnType="orderStatus ? 'upload' : 'start'" />
|
|
|
- </view>
|
|
|
+ <view class="handle-remark">
|
|
|
+ <text class="remark-title">服务时间: {{ detaile.workDate + ' ' + detaile.workStartTime }}</text>
|
|
|
+ </view>
|
|
|
+ </view> -->
|
|
|
+
|
|
|
+
|
|
|
</view>
|
|
|
+
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
@@ -81,7 +76,7 @@ const getCurrentLocation = () => {
|
|
|
// 先检查用户是否授权了位置权限
|
|
|
uni.getSetting({
|
|
|
success: (res) => {
|
|
|
- console.log("TCL: getCurrentLocation -> res", res)
|
|
|
+ console.log("TCL: getCurrentLocation -> res", res)
|
|
|
// 已授权,直接获取位置
|
|
|
getLocation(resolve, reject);
|
|
|
// if (!res.authSetting['scope.getFuzzyLocation']) {
|
|
@@ -214,21 +209,21 @@ const change = async (e) => {
|
|
|
// uni.showLoading({
|
|
|
// title: '获取位置信息...'
|
|
|
// })
|
|
|
-
|
|
|
+
|
|
|
// 获取开始服务时的位置
|
|
|
// const locationData = await getCurrentLocation().catch(err => {
|
|
|
// // uni.hideLoading()
|
|
|
// verify.value.initialization()
|
|
|
// throw new Error('无法获取位置信息,请确保已开启位置权限')
|
|
|
// })
|
|
|
-
|
|
|
- const locationData =await getLatLong()
|
|
|
+
|
|
|
+ const locationData = await getLatLong()
|
|
|
// 构建参数字符串
|
|
|
const params = `secondOrderId=${secondOrderId.value}&serviceStartLongitude=${locationData.longitude.toString()}&serviceStartLatitude=${locationData.latitude.toString()}`
|
|
|
-
|
|
|
+
|
|
|
// 调用开始服务接口,通过URL查询参数传递位置信息
|
|
|
const res = await getTimesByDate(params)
|
|
|
-
|
|
|
+
|
|
|
if (res.code === 200) {
|
|
|
uni.showToast({
|
|
|
title: '已开始服务',
|
|
@@ -250,13 +245,13 @@ const change = async (e) => {
|
|
|
// uni.hideLoading()
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
if (e.state && orderStatus.value) {
|
|
|
try {
|
|
|
// uni.showLoading({
|
|
|
// title: '获取位置信息...'
|
|
|
// })
|
|
|
-
|
|
|
+
|
|
|
uni.showToast({
|
|
|
title: '操作成功',
|
|
|
icon: 'success',
|
|
@@ -284,7 +279,7 @@ const change = async (e) => {
|
|
|
onLoad((options) => {
|
|
|
secondOrderId.value = options.secondOrderId
|
|
|
getOrderDetail()
|
|
|
-
|
|
|
+
|
|
|
// // 初始检查位置权限
|
|
|
// getCurrentLocation().then(location => {
|
|
|
// console.log('位置权限正常,可以获取位置');
|
|
@@ -309,190 +304,39 @@ onUnload(() => {
|
|
|
})
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
-.order-detail {
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
+// .order-detail {
|
|
|
+// position: fixed;
|
|
|
+// top: 0;
|
|
|
+// left: 0;
|
|
|
+// right: 0;
|
|
|
+// bottom: 280rpx;
|
|
|
+// overflow-y: auto;
|
|
|
+// }
|
|
|
+.handle-user-info {
|
|
|
+ // display: flex;
|
|
|
+ // flex-direction: column;
|
|
|
+ // gap: 10rpx;
|
|
|
+ position: absolute;
|
|
|
+ top: 280;
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
- bottom: 280rpx;
|
|
|
- overflow-y: auto;
|
|
|
-
|
|
|
- .service-info {
|
|
|
- // height: 360px;
|
|
|
- }
|
|
|
- .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);
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .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;
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.handle-user {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .handle-user-left {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .handle-user-info {
|
|
|
- .user-name {
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: 400;
|
|
|
- color: rgba(17, 24, 39, 1);
|
|
|
- }
|
|
|
-
|
|
|
- .user-id {
|
|
|
- font-size: 28rpx;
|
|
|
- font-weight: 400;
|
|
|
- color: rgba(107, 114, 128, 1);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .user-phone {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
-
|
|
|
- width: 80rpx;
|
|
|
- height: 80rpx;
|
|
|
- border-radius: 50%;
|
|
|
- background: rgba(221, 94, 69, 1);
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.handle-adress {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: space-between;
|
|
|
- margin-top: 38rpx;
|
|
|
-
|
|
|
- .adress-text {
|
|
|
- flex: 1;
|
|
|
- text-align: left;
|
|
|
- padding-left: 24rpx;
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: 400;
|
|
|
- color: rgba(75, 85, 99, 1);
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.handle-remark {
|
|
|
- margin-top: 30rpx;
|
|
|
-
|
|
|
- .remark-title {
|
|
|
- font-size: 28rpx;
|
|
|
- font-weight: 400;
|
|
|
- color: rgba(17, 24, 39, 1);
|
|
|
- margin-bottom: 20rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .remark-text {
|
|
|
- border-radius: 16rpx;
|
|
|
- background: rgba(249, 250, 251, 1);
|
|
|
- padding: 32rpx;
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: 400;
|
|
|
- color: rgba(75, 85, 99, 1);
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.handle-start {
|
|
|
- margin-bottom: 30rpx;
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: 400;
|
|
|
- color: rgba(75, 85, 99, 1);
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- .handle-time {
|
|
|
- font-size: 32rpx;
|
|
|
- font-weight: 400;
|
|
|
- color: rgba(17, 24, 39, 1);
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-.footer-g {
|
|
|
- padding: 12px;
|
|
|
- position: absolute;
|
|
|
- bottom: 18px;
|
|
|
- left: 0px;
|
|
|
- right: 0px;
|
|
|
- background: rgba(255, 255, 255, 1);
|
|
|
+ bottom: 0;
|
|
|
+ background: red;
|
|
|
+ width: 750rpx;
|
|
|
+ height: 804rpx;
|
|
|
+ border-radius: 20rpx 20rpx 0rpx 0rpx;
|
|
|
+ // margin-left: 38rpx;
|
|
|
+ // margin-right: 36rpx;
|
|
|
+ // margin-top: 50rpx;
|
|
|
+ // > view {
|
|
|
+ // padding-bottom: 16rpx;
|
|
|
+ // border-bottom: 1px solid #f0f0f0;
|
|
|
+ // margin-bottom: 16rpx;
|
|
|
+ // font-size: 28rpx;
|
|
|
+ // color: #333;
|
|
|
+ // display: flex;
|
|
|
+ // justify-content: flex-start;
|
|
|
+ // align-items: center;
|
|
|
+ // }
|
|
|
}
|
|
|
</style>
|