|
|
|
@ -22,8 +22,8 @@ |
|
|
|
<view class="box"> |
|
|
|
<!-- 循环子订单 --> |
|
|
|
<view v-for="(item,index) in orderChildList" :key="index"> |
|
|
|
<!-- 核销码 景点、线路、自提 --> |
|
|
|
<view class="" v-if="item.isQrcode && item.qrcode.length > 0"> |
|
|
|
<!-- 核销码 景点、自提 --> |
|
|
|
<view class="" v-if="item.isQrcode && item.qrcode.length > 0 && item.product_model != 'line'"> |
|
|
|
<view class="qrcode-remain"> |
|
|
|
还剩<span>{{item.remainNum}}</span>张未核销 |
|
|
|
</view> |
|
|
|
@ -33,15 +33,15 @@ |
|
|
|
<swiper-item v-for="(qrItem, qrIndex) in item.qrcode" :key="qrIndex" class="flex-center"> |
|
|
|
<view class="qrcode-item flex-column"> |
|
|
|
<view class="qrcode-title">{{item.sku_name}}</view> |
|
|
|
<image :src="qrItem.qrcodeimg" style="width: 300rpx;height: 300rpx;" |
|
|
|
mode="aspectFill"></image> |
|
|
|
<canvas :id="'qrcodeT'+qrItem.use_code+qrIndex" :canvas-id="'qrcodeT'+qrItem.use_code+qrIndex" |
|
|
|
<image :src="qrItem.qrcodeimg" style="width: 300rpx;height: 300rpx;" mode="aspectFill"> |
|
|
|
</image> |
|
|
|
<canvas :id="'qrcodeT'+qrItem.use_code+qrIndex" |
|
|
|
:canvas-id="'qrcodeT'+qrItem.use_code+qrIndex" |
|
|
|
style="width:150px;height:150px;z-index: -20;bottom: -500px;position: absolute;"></canvas> |
|
|
|
<view class="qrcode-subtitle"> |
|
|
|
核销码:{{qrItem.use_code}}</view> |
|
|
|
|
|
|
|
<view class="complete-text flex-center" |
|
|
|
v-if="qrItem.state > 0"> |
|
|
|
<view class="complete-text flex-center" v-if="qrItem.state > 0"> |
|
|
|
<view class="flex-center" v-if="qrItem.state == 1"> |
|
|
|
已核销 |
|
|
|
</view> |
|
|
|
@ -63,13 +63,6 @@ |
|
|
|
<view class="swiper-prompt">左右滑动核销其他二维码</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 收货地址 --> |
|
|
|
<view class="product-box" v-if="item.product_model == 'post' && !Array.isArray(item.consignee_info)"> |
|
|
|
<view class="title">收货信息</view> |
|
|
|
<view class="subtitle" style="font-weight: bold;font-size: 31rpx;">{{item.consignee_info.name}} {{item.consignee_info.tel}}</view> |
|
|
|
<view class="subtitle"><span>{{item.consignee_info.address}}</span></view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 景点商品详情 --> |
|
|
|
<view class="product-box" v-if="item.product_model == 'ticket'"> |
|
|
|
<view class="title" @click="item.type=item.product_model;gotoDetailByType(item)"> |
|
|
|
@ -78,7 +71,9 @@ |
|
|
|
class="rightIcon"></image> |
|
|
|
</view> |
|
|
|
<view class="subtitle" v-if="item.use_date"><span>出行时间：</span>{{item.use_date}}</view> |
|
|
|
<view class="subtitle" v-if="item.scene_detail.open_time"><span>开放时间：</span>{{item.scene_detail.open_time}}</view> |
|
|
|
<view class="subtitle" v-if="item.scene_detail.open_time"> |
|
|
|
<span>开放时间：</span>{{item.scene_detail.open_time}} |
|
|
|
</view> |
|
|
|
<view class="line"></view> |
|
|
|
<view class="skutitle flex-between"> |
|
|
|
<view>{{item.sku_name}}</view> |
|
|
|
@ -87,31 +82,12 @@ |
|
|
|
x{{item.product_num}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 自提信息 --> |
|
|
|
<view class="product-box" v-if="item.product_model == 'post' && item.pickup_shop_id > 0"> |
|
|
|
<view class="title">自提信息</view> |
|
|
|
<view class="pick-box flex-between"> |
|
|
|
<view class="pick-title"> |
|
|
|
<view style="display: flex;align-items: center;"> |
|
|
|
<image src="https://static.ticket.sz-trip.com/shiweisuzhou/images/order/location.png" mode=""></image> |
|
|
|
{{item.pickup_shop_info.title}} |
|
|
|
</view> |
|
|
|
<view class="pick-subtitle" style="padding: 20rpx 0 0 50rpx;"> |
|
|
|
{{item.pickup_shop_info.address}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="pick-subtitle flex-center"> |
|
|
|
<view v-if="item.pickup_shop_info.tel" @click="clickPhone(item.pickup_shop_info.tel)"> |
|
|
|
<image src="https://static.ticket.sz-trip.com/shiweisuzhou/images/order/phone.png" mode=""></image> |
|
|
|
电话 |
|
|
|
</view> |
|
|
|
<view style="margin-left: 35rpx;" v-if="item.pickup_shop_info.lon && item.pickup_shop_info.lat" |
|
|
|
@click="openLocation(item.pickup_shop_info.lat,item.pickup_shop_info.lon)"> |
|
|
|
<image src="https://static.ticket.sz-trip.com/shiweisuzhou/images/order/navigation.png" mode=""></image> |
|
|
|
导航 |
|
|
|
</view> |
|
|
|
<!-- 景点出行人 --> |
|
|
|
<view style="margin-top: 30rpx;padding-top: 30rpx;border-top: 1rpx solid #D8D8D8;" v-if="item.product_model == 'ticket' && item.phone"> |
|
|
|
<view class="title">出行人</view> |
|
|
|
<view class="subtitle"> |
|
|
|
<span>手机号：</span>{{item.phone}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -119,7 +95,8 @@ |
|
|
|
<!-- 邮寄、自提商品详情 --> |
|
|
|
<view class="product-box" v-if="item.product_model == 'post'"> |
|
|
|
<view class="good-box"> |
|
|
|
<image :src="item.product_img" mode="aspectFill" @click="item.type=item.product_model;gotoDetailByType(item)"></image> |
|
|
|
<image :src="item.product_img" mode="aspectFill" |
|
|
|
@click="item.type=item.product_model;gotoDetailByType(item)"></image> |
|
|
|
<view class="flex-column"> |
|
|
|
<span class="good-title text-overflowRows">{{item.product_title}}</span> |
|
|
|
<span class="good-subtitle">{{item.sku_name}}</span> |
|
|
|
@ -129,6 +106,48 @@ |
|
|
|
<span class="good-subtitle">x{{item.product_num}}</span> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 收货地址 --> |
|
|
|
<view style="margin-top: 30rpx;padding-top: 30rpx;border-top: 1rpx solid #D8D8D8;" v-if="item.product_model == 'post' && !Array.isArray(item.consignee_info)"> |
|
|
|
<view class="title">收货信息</view> |
|
|
|
<view class="subtitle" style="font-weight: bold;font-size: 31rpx;">{{item.consignee_info.name}} |
|
|
|
{{item.consignee_info.tel}} |
|
|
|
</view> |
|
|
|
<view class="subtitle"><span>{{item.consignee_info.address}}</span></view> |
|
|
|
|
|
|
|
<view class="mask-btn" @click="openMask(item)">快递查询</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 自提信息 --> |
|
|
|
<view style="margin-top: 30rpx;padding-top: 30rpx;border-top: 1rpx solid #D8D8D8;" v-if="item.product_model == 'post' && item.pickup_shop_id > 0"> |
|
|
|
<view class="title">自提信息</view> |
|
|
|
<view class="pick-box flex-between"> |
|
|
|
<view class="pick-title"> |
|
|
|
<view style="display: flex;align-items: center;"> |
|
|
|
<image src="https://static.ticket.sz-trip.com/shiweisuzhou/images/order/location.png" |
|
|
|
mode=""></image> |
|
|
|
{{item.pickup_shop_info.title}} |
|
|
|
</view> |
|
|
|
<view class="pick-subtitle" style="padding: 20rpx 0 0 50rpx;"> |
|
|
|
{{item.pickup_shop_info.address}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="pick-subtitle flex-center"> |
|
|
|
<view v-if="item.pickup_shop_info.tel" @click="clickPhone(item.pickup_shop_info.tel)"> |
|
|
|
<image src="https://static.ticket.sz-trip.com/shiweisuzhou/images/order/phone.png" |
|
|
|
mode=""></image> |
|
|
|
电话 |
|
|
|
</view> |
|
|
|
<view style="margin-left: 35rpx;" |
|
|
|
v-if="item.pickup_shop_info.lon && item.pickup_shop_info.lat" |
|
|
|
@click="openLocation(item.pickup_shop_info.lat,item.pickup_shop_info.lon)"> |
|
|
|
<image src="https://static.ticket.sz-trip.com/shiweisuzhou/images/order/navigation.png" |
|
|
|
mode=""></image> |
|
|
|
导航 |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 酒店信息 --> |
|
|
|
@ -137,35 +156,148 @@ |
|
|
|
<view class="hotel-title"> |
|
|
|
{{item.product_title}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- <view class="product-box" v-if="item.product_model == 'hotel'"> |
|
|
|
<view class="title">{{入住信息}}</view> |
|
|
|
<view class="good-title"> |
|
|
|
{{item.product_title}} |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="order-time flex-between" style="justify-content: space-around;"> |
|
|
|
<view class="order-time flex-between" style="padding-right: 30rpx;"> |
|
|
|
<view class="time"> |
|
|
|
<view style="font-size: 35rpx;font-weight: bold;">{{new Date(selectDate.startDay).Format('MM-dd')}}</view> |
|
|
|
<view style="padding:0 14rpx">{{ ShowDateDay(new Date(selectDate.startDay).getDay()) }}</view> |
|
|
|
<view style="font-size: 35rpx;font-weight: bold;"> |
|
|
|
{{new Date(item.order_product_extend.start_date).Format('MM-dd')}} |
|
|
|
</view> |
|
|
|
<view style="padding:0 14rpx"> |
|
|
|
{{ ShowDateDay(new Date(item.order_product_extend.start_date).getDay()) }} |
|
|
|
</view> |
|
|
|
<view style="color: #999999;">入住</view> |
|
|
|
</view> |
|
|
|
<view class="cal-day"> |
|
|
|
共{{selectDate.differDays}}晚 |
|
|
|
共{{calDate(item.order_product_extend.start_date,item.order_product_extend.end_date)}}晚 |
|
|
|
</view> |
|
|
|
<view class="time"> |
|
|
|
<view style="font-size: 35rpx;font-weight: bold;">{{new Date(selectDate.endDay).Format('MM-dd')}}</view> |
|
|
|
<view style="padding:0 14rpx">{{ShowDateDay(new Date(selectDate.endDay).getDay()) }}</view> |
|
|
|
<view style="font-size: 35rpx;font-weight: bold;"> |
|
|
|
{{new Date(item.order_product_extend.end_date).Format('MM-dd')}} |
|
|
|
</view> |
|
|
|
<view style="padding:0 14rpx"> |
|
|
|
{{ShowDateDay(new Date(item.order_product_extend.end_date).getDay()) }} |
|
|
|
</view> |
|
|
|
<view style="color: #999999;">离店</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
|
|
|
|
<!-- 景点出行人 --> |
|
|
|
<view class="product-box" v-if="item.product_model == 'ticket' && item.phone"> |
|
|
|
<view class="title">出行人</view> |
|
|
|
<view class="subtitle"> |
|
|
|
<span>手机号：</span>{{item.phone}} |
|
|
|
<view class="flex-between"> |
|
|
|
<view class="address-container flex flex-shrink-0 flex-between" @click="goMap(item)"> |
|
|
|
<view class="address-title text-overflowRows"> |
|
|
|
{{item.scene_detail.address}} |
|
|
|
</view> |
|
|
|
<view class="flex-column flex-center"> |
|
|
|
<image |
|
|
|
src="https://static.ticket.sz-trip.com/shiweisuzhou/images/homestay/location.png"> |
|
|
|
<view class="tip" style="padding-top: 11rpx;">地图</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="phone-container flex-column flex-center" @click="callPhone(item.scene_detail.tel)"> |
|
|
|
<image src="https://static.ticket.sz-trip.com/shiweisuzhou/images/homestay/phone.png"> |
|
|
|
<view class="tip" style="padding-top: 11rpx;">电话</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="skutitle flex-between" |
|
|
|
style="padding-top: 30rpx;border-top: 1rpx solid #D8D8D8;margin-top: 30rpx;"> |
|
|
|
<view>{{item.sku_name}}</view> |
|
|
|
<view> |
|
|
|
<span>￥{{item.product_price / 100}}</span> |
|
|
|
x{{item.product_num}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 酒店预订信息 --> |
|
|
|
<view style="margin-top: 30rpx;padding-top: 30rpx;border-top: 1rpx solid #D8D8D8;" v-if="item.product_model == 'hotel'"> |
|
|
|
<view class="title">预订信息</view> |
|
|
|
<view class="subtitle"> |
|
|
|
<span>房间数：</span>{{item.product_num}} |
|
|
|
</view> |
|
|
|
<view class="subtitle"> |
|
|
|
<span>入住姓名：</span>{{item.order_product_extend.customer_name}} |
|
|
|
</view> |
|
|
|
<view class="subtitle"> |
|
|
|
<span>联系电话：</span>{{item.order_product_extend.reserve_mobile}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 线路下单 --> |
|
|
|
<view v-if="info.order_product_list && info.order_product_list[0].product_model == 'line'"> |
|
|
|
<view class="" v-if="lineQrcodeList && lineQrcodeList.length > 0"> |
|
|
|
<view class="qrcode-remain"> |
|
|
|
还剩<span>{{lineNum}}</span>张未核销 |
|
|
|
</view> |
|
|
|
|
|
|
|
<swiper class="qrcode-box" :circular="false" previous-margin="100rpx" next-margin="100rpx" |
|
|
|
:duration="800" :current="current" @change="swiperChanges"> |
|
|
|
<swiper-item v-for="(qrItem, qrIndex) in lineQrcodeList" :key="qrIndex" class="flex-center"> |
|
|
|
<view class="qrcode-item flex-column"> |
|
|
|
<view class="qrcode-title">{{qrItem.sku_name}}</view> |
|
|
|
<image :src="qrItem.qrcodeimg" style="width: 300rpx;height: 300rpx;" mode="aspectFill"> |
|
|
|
</image> |
|
|
|
<canvas :id="'qrcodeT'+qrItem.use_code+qrIndex" |
|
|
|
:canvas-id="'qrcodeT'+qrItem.use_code+qrIndex" |
|
|
|
style="width:150px;height:150px;z-index: -20;bottom: -500px;position: absolute;"></canvas> |
|
|
|
<view class="qrcode-subtitle"> |
|
|
|
核销码:{{qrItem.use_code}}</view> |
|
|
|
|
|
|
|
<view class="complete-text flex-center" v-if="qrItem.state > 0"> |
|
|
|
<view class="flex-center" v-if="qrItem.state == 1"> |
|
|
|
已核销 |
|
|
|
</view> |
|
|
|
<view class="flex-center" v-else> |
|
|
|
已失效 |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</swiper-item> |
|
|
|
</swiper> |
|
|
|
|
|
|
|
<!-- 指示点 --> |
|
|
|
<view class="swiper-point flex-center"> |
|
|
|
<view v-for="(qrItem,qrIndex) in item.qrcode" :key="qrIndex" |
|
|
|
:class="[{'swiper-points': qrIndex == item.current}]"></view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 提示语 --> |
|
|
|
<view class="swiper-prompt">左右滑动核销其他二维码</view> |
|
|
|
</view> |
|
|
|
<!-- 线路下单多个规格、多个子订单 --> |
|
|
|
<view> |
|
|
|
<view class="product-box"> |
|
|
|
<view class="title" @click="info.order_product_list[0].type=info.order_product_list[0].product_model;gotoDetailByType(info.order_product_list[0])"> |
|
|
|
{{info.order_product_list[0].product_title}} |
|
|
|
<image src="https://static.ticket.sz-trip.com/shiweisuzhou/images/order/rightIcon.png" |
|
|
|
class="rightIcon"></image> |
|
|
|
</view> |
|
|
|
<view class="subtitle" v-if="info.order_product_list[0].use_date"> |
|
|
|
<span>出行时间：</span>{{info.order_product_list[0].use_date}} |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 规格信息 --> |
|
|
|
<view style="margin-top: 30rpx;border-top: 1rpx solid #D8D8D8;"> |
|
|
|
<view class="skutitle flex-between" v-for="(item,index) in info.order_product_list" :key="index" style="margin-top: 20rpx;"> |
|
|
|
<view>{{item.sku_name}}</view> |
|
|
|
<view> |
|
|
|
<span>￥{{item.product_price / 100}}</span> |
|
|
|
x{{item.product_num}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<!-- 线路出行人信息 --> |
|
|
|
<view class="product-box"> |
|
|
|
<view class="title">出行人</view> |
|
|
|
<view v-for="(item,index) in info.order_product_list" :key="index" style="margin-top: 25rpx;padding-top: 25rpx;border-top: 1rpx solid #D8D8D8;"> |
|
|
|
出行人{{index + 1}} |
|
|
|
<view class="subtitle"> |
|
|
|
<span>姓名：</span>{{item.contacts_info[0].name}} |
|
|
|
</view> |
|
|
|
<view class="subtitle"> |
|
|
|
<span>{{item.contacts_info[0].title}}：</span>{{item.contacts_info[0].id_number}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -204,6 +336,57 @@ |
|
|
|
</view> |
|
|
|
</button> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 底部按钮 --> |
|
|
|
<footer> |
|
|
|
<view class="bottom-price" v-if="info.state == 'UNPAID'"> |
|
|
|
合计： |
|
|
|
<span class="price">{{info.paid_money/100}}</span> |
|
|
|
</view> |
|
|
|
<view class="btn-box"> |
|
|
|
<view class="btn" v-if="['WAIT_POST','WAIT_USE','PAID'].includes(info.state)" @click="refund()"> |
|
|
|
取消订单 |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="btn" v-if="info.state === 'UNPAID'" @click="closeOrder()"> |
|
|
|
关闭订单 |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="btn pay-btn" v-if="info.state === 'UNPAID'" @click="setOrderId()"> |
|
|
|
立即支付 |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- <view class="btn" v-if="info.state == 'POST' && info.order_child[0].goods_genre == 'pgoods'" |
|
|
|
@click="openMask()"> |
|
|
|
快递查询 |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="btn" v-if="info.state == 'POST' && info.order_child[0].goods_genre == 'pgoods'" |
|
|
|
@click="confirmGoods()"> |
|
|
|
确认收货 |
|
|
|
</view> --> |
|
|
|
</view> |
|
|
|
</footer> |
|
|
|
|
|
|
|
<!-- 快递详情 --> |
|
|
|
<view class="mask" v-if="maskShow"> |
|
|
|
<view class="mask-bg" @click="maskShow = false"></view> |
|
|
|
<view class="mask-content"> |
|
|
|
<p class="mask-title">物流信息</p> |
|
|
|
<view class="iconfont" @click="maskShow = false">x</view> |
|
|
|
<view class="express-all"> |
|
|
|
<view class="express-item" v-for="item,index in postInfo" :key="index"> |
|
|
|
<view class="line" v-if="index != postInfo.length - 1"></view> |
|
|
|
<view class="express-item-icon" v-if="index!=0"></view> |
|
|
|
<view class="express-item-icon express-item-icons" v-else></view> |
|
|
|
<view :class="['express-info',index==0?'active':'']"> |
|
|
|
<p>{{item.context}}</p> |
|
|
|
<p class="express-time">{{item.time}}</p> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
|
|
|
|
@ -215,6 +398,11 @@ |
|
|
|
orderId: '', |
|
|
|
info: {}, |
|
|
|
orderChildList: [], |
|
|
|
lineQrcodeList: [], |
|
|
|
lineNum: 0, |
|
|
|
current: 0, |
|
|
|
maskShow: false, |
|
|
|
postInfo: {} |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(option) { |
|
|
|
@ -222,43 +410,71 @@ |
|
|
|
this.getDetail() |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
getDetail() { |
|
|
|
this.Post({ |
|
|
|
order_id: this.orderId |
|
|
|
}, '/api/order/query').then(res => { |
|
|
|
console.log(res.data) |
|
|
|
this.info = res.data |
|
|
|
this.orderChildList = res.data.order_product_list |
|
|
|
// 景点ticket、线路line、自提需展示二维码 |
|
|
|
this.info.order_product_list.forEach(item => { |
|
|
|
// 收货地址 |
|
|
|
if(item.product_model == 'post' && item.consignee_info) item.consignee_info = JSON.parse(item.consignee_info) |
|
|
|
console.log(item.consignee_info) |
|
|
|
// 自提信息 |
|
|
|
if(item.product_model == 'post' && item.pickup_shop_id > 0) item.pickup_shop_info = JSON.parse(item.pickup_shop_info) |
|
|
|
|
|
|
|
// 判断是否展示核销码 |
|
|
|
if (['ticket', 'line', 'post'].includes(item.product_model)) { |
|
|
|
item.isQrcode = true |
|
|
|
if (item.product_model == 'post' && !item.pickup_shop_id) { |
|
|
|
item.isQrcode = false |
|
|
|
} |
|
|
|
// 未核销数量 |
|
|
|
item.remainNum = 0 |
|
|
|
// 轮播图滚动index |
|
|
|
item.current = 0 |
|
|
|
|
|
|
|
// 生成二维码 |
|
|
|
item.qrcode.forEach((qrItem, qrIndex) => { |
|
|
|
if (qrItem.state == 0) { |
|
|
|
item.remainNum += 1 |
|
|
|
} |
|
|
|
// 获取订单详情 |
|
|
|
async getDetail() { |
|
|
|
try { |
|
|
|
const res = await this.Post({ |
|
|
|
order_id: this.orderId |
|
|
|
}, '/api/order/query'); |
|
|
|
this.info = res.data; |
|
|
|
this.orderChildList = res.data.order_product_list; |
|
|
|
this.processOrderData(this.orderChildList); |
|
|
|
} catch (error) { |
|
|
|
console.error('获取订单详情失败:', error); |
|
|
|
} |
|
|
|
}, |
|
|
|
// 处理订单数据 |
|
|
|
processOrderData(orderList) { |
|
|
|
orderList.forEach(item => { |
|
|
|
// 处理收货地址 |
|
|
|
if (item.product_model === 'post' && item.consignee_info) { |
|
|
|
item.consignee_info = JSON.parse(item.consignee_info); |
|
|
|
} |
|
|
|
// 处理自提信息 |
|
|
|
if (item.product_model === 'post' && item.pickup_shop_id > 0) { |
|
|
|
item.pickup_shop_info = JSON.parse(item.pickup_shop_info); |
|
|
|
} |
|
|
|
// 处理线路出行人信息 |
|
|
|
if (item.product_model === 'line' && item.contacts_info) { |
|
|
|
item.contacts_info = JSON.parse(item.contacts_info); |
|
|
|
} |
|
|
|
// 处理线路核销码 |
|
|
|
if (item.product_model === 'line') { |
|
|
|
item.qrcode.forEach(qrItem => { |
|
|
|
qrItem.sku_name = item.sku_name; |
|
|
|
}); |
|
|
|
|
|
|
|
this.getCodeImg(qrItem, qrIndex) |
|
|
|
}) |
|
|
|
this.lineQrcodeList = [...this.lineQrcodeList, ...item.qrcode]; |
|
|
|
let lineNum = 0; |
|
|
|
if (this.lineQrcodeList.length > 0) { |
|
|
|
this.lineQrcodeList.forEach((qrItem, index) => { |
|
|
|
if (qrItem.state === 0) { |
|
|
|
lineNum += 1; |
|
|
|
} |
|
|
|
this.getCodeImg(qrItem, index); |
|
|
|
}); |
|
|
|
this.lineNum = lineNum; |
|
|
|
} |
|
|
|
}) |
|
|
|
}) |
|
|
|
} |
|
|
|
// 判断是否展示核销码 |
|
|
|
if (['ticket', 'post'].includes(item.product_model)) { |
|
|
|
item.isQrcode = true; |
|
|
|
if (item.product_model === 'post' && !item.pickup_shop_id) { |
|
|
|
item.isQrcode = false; |
|
|
|
} |
|
|
|
// 未核销数量 |
|
|
|
item.remainNum = 0; |
|
|
|
// 轮播图滚动index |
|
|
|
item.current = 0; |
|
|
|
// 生成二维码 |
|
|
|
item.qrcode.forEach((qrItem, qrIndex) => { |
|
|
|
if (qrItem.state === 0) { |
|
|
|
item.remainNum += 1; |
|
|
|
} |
|
|
|
this.getCodeImg(qrItem, qrIndex); |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 生成二维码 |
|
|
|
getCodeImg(item, index) { |
|
|
|
@ -277,7 +493,7 @@ |
|
|
|
}); |
|
|
|
}, |
|
|
|
//轮播图左右滑动 |
|
|
|
swiperChange(e,item) { |
|
|
|
swiperChange(e, item) { |
|
|
|
let { |
|
|
|
current, |
|
|
|
source |
|
|
|
@ -288,6 +504,18 @@ |
|
|
|
} |
|
|
|
this.$forceUpdate() |
|
|
|
}, |
|
|
|
//线路轮播图左右滑动 |
|
|
|
swiperChanges(e) { |
|
|
|
let { |
|
|
|
current, |
|
|
|
source |
|
|
|
} = e.detail; |
|
|
|
//在自动或手动的时候才赋予current值 |
|
|
|
if (source === 'autoplay' || source === 'touch') { |
|
|
|
this.current = current; |
|
|
|
} |
|
|
|
this.$forceUpdate() |
|
|
|
}, |
|
|
|
// 复制订单号 |
|
|
|
clickCopy() { |
|
|
|
uni.setClipboardData({ |
|
|
|
@ -301,6 +529,115 @@ |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
calDate(startDate, endDate) { |
|
|
|
var start = new Date(startDate); |
|
|
|
var end = new Date(endDate); |
|
|
|
var diff = end - start; |
|
|
|
var days = Math.floor(diff / (1000 * 60 * 60 * 24)); // 计算天数差 |
|
|
|
return days; |
|
|
|
}, |
|
|
|
callPhone(tel) { |
|
|
|
let _this = this |
|
|
|
uni.showActionSheet({ |
|
|
|
itemList: [tel, '呼叫'], |
|
|
|
success: function(res) { |
|
|
|
_this.clickPhone(tel) |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
goMap(item) { |
|
|
|
if (!item.scene_detail.lon && !item.scene_detail.lat) { |
|
|
|
uni.showToast({ |
|
|
|
title: '暂未配置地理位置', |
|
|
|
icon: 'none' |
|
|
|
}) |
|
|
|
return |
|
|
|
} |
|
|
|
debugger |
|
|
|
uni.openLocation({ |
|
|
|
latitude: Number(item.scene_detail.lat), |
|
|
|
longitude: Number(item.scene_detail.lon), |
|
|
|
name: item.scene_detail.title, |
|
|
|
address: item.scene_detail.address, |
|
|
|
success: function() { |
|
|
|
console.log('success'); |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 申请退款 |
|
|
|
refund() { |
|
|
|
uni.showModal({ |
|
|
|
title: '提示', |
|
|
|
content: '是否申请退款？', |
|
|
|
success: successRes => { |
|
|
|
if (successRes.confirm) { |
|
|
|
this.Post({ order_id: this.info.order_id }, '/api/order/refund') |
|
|
|
.then(res => { |
|
|
|
if (res.code === 1) { |
|
|
|
uni.showToast({ title: '申请成功', icon: 'success' }); |
|
|
|
this.getDetail(); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 关闭订单 |
|
|
|
closeOrder(id, index) { |
|
|
|
uni.showModal({ |
|
|
|
title: '提示', |
|
|
|
content: '是否关闭订单？', |
|
|
|
success: successRes => { |
|
|
|
if (successRes.confirm) { |
|
|
|
this.Post({ order_id: this.info.order_id }, '/api/order/close') |
|
|
|
.then(res => { |
|
|
|
if (res.code === 1) { |
|
|
|
uni.showToast({ title: '关闭成功', icon: 'success' }); |
|
|
|
this.getDetail(); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 支付 |
|
|
|
setOrderId(id) { |
|
|
|
this.Post({ |
|
|
|
order_id: this.info.order_id, |
|
|
|
pay_platform: "miniprogram", |
|
|
|
pay_method: 'abc' |
|
|
|
}, '/api/order/pay') |
|
|
|
.then(res => { |
|
|
|
if (res.code == 1) { |
|
|
|
uni.requestPayment({ |
|
|
|
nonceStr: res.data.nonceStr, |
|
|
|
package: res.data.package, |
|
|
|
paySign: res.data.paySign, |
|
|
|
signType: res.data.signType, |
|
|
|
timeStamp: res.data.timeStamp, |
|
|
|
success: () => { |
|
|
|
this.getDetail(); |
|
|
|
} |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 快递查询 |
|
|
|
openMask(item) { |
|
|
|
this.Post({ |
|
|
|
child_order_id: item.child_order_id |
|
|
|
}, '/api/order/getExpress').then(res => { |
|
|
|
if (res.data.length > 0) { |
|
|
|
this.postInfo = res.data.reverse() |
|
|
|
this.maskShow = true |
|
|
|
} else { |
|
|
|
uni.showToast({ |
|
|
|
title: '暂未查询到物流信息，请联系客服', |
|
|
|
icon: 'none' |
|
|
|
}); |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
@ -390,10 +727,21 @@ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.mask-btn { |
|
|
|
width: fit-content; |
|
|
|
line-height: 53rpx; |
|
|
|
background: #F8F9FA; |
|
|
|
border-radius: 11rpx; |
|
|
|
border: 1px solid #999999; |
|
|
|
padding: 0 15rpx; |
|
|
|
margin: 10rpx 0 0 auto; |
|
|
|
flex-shrink: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.line { |
|
|
|
width: 643rpx; |
|
|
|
height: 1rpx; |
|
|
|
background: #d8d8d83b; |
|
|
|
background: #D8D8D8; |
|
|
|
margin: 33rpx 0; |
|
|
|
} |
|
|
|
|
|
|
|
@ -476,6 +824,82 @@ |
|
|
|
color: #222222; |
|
|
|
margin-top: 30rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.order-time { |
|
|
|
height: 107rpx; |
|
|
|
|
|
|
|
.time { |
|
|
|
display: flex; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #000000; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.cal-day { |
|
|
|
background: #F2F2F2; |
|
|
|
border-radius: 17rpx; |
|
|
|
padding: 5rpx 16rpx; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #000000; |
|
|
|
} |
|
|
|
|
|
|
|
.address-container { |
|
|
|
width: 525rpx; |
|
|
|
height: 107rpx; |
|
|
|
border-radius: 20rpx; |
|
|
|
padding: 25rpx 20rpx 25rpx 33rpx; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 27rpx; |
|
|
|
color: #000000; |
|
|
|
background-color: #F2F2F2; |
|
|
|
background-image: url('https://static.ticket.sz-trip.com/shiweisuzhou/images/homestay/mapBg.png'); |
|
|
|
background-repeat: no-repeat; |
|
|
|
background-size: 100% 100%; |
|
|
|
|
|
|
|
image { |
|
|
|
width: 30rpx; |
|
|
|
height: 30rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.tip { |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #333333; |
|
|
|
} |
|
|
|
|
|
|
|
.address-title { |
|
|
|
width: 400rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.phone-container { |
|
|
|
width: 93rpx; |
|
|
|
height: 107rpx; |
|
|
|
background: #F2F2F2; |
|
|
|
border-radius: 20rpx; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #333333; |
|
|
|
|
|
|
|
image { |
|
|
|
width: 30rpx; |
|
|
|
height: 30rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.tip { |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #333333; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.kefu-box { |
|
|
|
@ -512,6 +936,7 @@ |
|
|
|
margin-left: 18rpx; |
|
|
|
width: 371rpx; |
|
|
|
} |
|
|
|
|
|
|
|
&>view:last-child { |
|
|
|
margin-left: auto; |
|
|
|
width: fit-content; |
|
|
|
@ -529,27 +954,6 @@ |
|
|
|
font-size: 24rpx; |
|
|
|
color: #666666; |
|
|
|
} |
|
|
|
|
|
|
|
.order-time{ |
|
|
|
height: 107rpx; |
|
|
|
background: linear-gradient(180deg, #FFFFFF, #F7F7F7); |
|
|
|
.time{ |
|
|
|
display: flex; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #000000; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
} |
|
|
|
.cal-day{ |
|
|
|
background: #F2F2F2; |
|
|
|
border-radius: 17rpx; |
|
|
|
padding: 5rpx 16rpx; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #000000; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
@ -668,4 +1072,174 @@ |
|
|
|
text-align: center; |
|
|
|
margin-bottom: 45rpx; |
|
|
|
} |
|
|
|
|
|
|
|
// 底部按钮 |
|
|
|
footer { |
|
|
|
width: 750rpx; |
|
|
|
height: 167rpx; |
|
|
|
position: fixed; |
|
|
|
bottom: 0; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
background-color: #fff; |
|
|
|
border-top: 10rpx solid #F7F7F7; |
|
|
|
padding: 0 26rpx; |
|
|
|
|
|
|
|
.bottom-price { |
|
|
|
font-weight: 500; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #000000; |
|
|
|
|
|
|
|
span { |
|
|
|
font-weight: bold; |
|
|
|
font-size: 40rpx; |
|
|
|
color: #DC2525; |
|
|
|
} |
|
|
|
|
|
|
|
span::before { |
|
|
|
content: '￥'; |
|
|
|
font-size: 24rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.btn-box { |
|
|
|
margin-left: auto; |
|
|
|
display: flex; |
|
|
|
|
|
|
|
.btn { |
|
|
|
width: 213rpx; |
|
|
|
line-height: 71rpx; |
|
|
|
background: #F8F9FA; |
|
|
|
border-radius: 11rpx; |
|
|
|
border: 1rpx solid #999999; |
|
|
|
text-align: center; |
|
|
|
margin-right: 14rpx; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 31rpx; |
|
|
|
color: #111111; |
|
|
|
} |
|
|
|
|
|
|
|
.btn:last-of-type { |
|
|
|
margin-right: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.pay-btn { |
|
|
|
height: 73rpx; |
|
|
|
background: #6A8A2D; |
|
|
|
border: none; |
|
|
|
color: #FFFFFF; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 快递查询 |
|
|
|
.mask { |
|
|
|
position: fixed; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
top: 0; |
|
|
|
bottom: 0; |
|
|
|
background: rgba(0, 0, 0, 0.6); |
|
|
|
z-index: 1000; |
|
|
|
display: flex; |
|
|
|
align-items: flex-end; |
|
|
|
justify-content: center; |
|
|
|
} |
|
|
|
|
|
|
|
.mask-bg { |
|
|
|
position: fixed; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
top: 0; |
|
|
|
bottom: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.mask-content { |
|
|
|
width: 100%; |
|
|
|
padding: 28rpx 0; |
|
|
|
border-radius: 20rpx 20rpx 0 0; |
|
|
|
background: white; |
|
|
|
height: 70%; |
|
|
|
position: relative; |
|
|
|
overflow-y: auto; |
|
|
|
} |
|
|
|
|
|
|
|
.mask-content .icon-close { |
|
|
|
position: absolute; |
|
|
|
right: 20rpx; |
|
|
|
top: 20rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.mask-content .close-btn { |
|
|
|
background-image: url("https://static.ticket.sz-trip.com/taizhou/images/close.png"); |
|
|
|
width: 80rpx; |
|
|
|
height: 80rpx; |
|
|
|
position: absolute; |
|
|
|
bottom: -100rpx; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
margin: auto; |
|
|
|
} |
|
|
|
|
|
|
|
.mask-title { |
|
|
|
font-size: 36rpx; |
|
|
|
font-weight: bold; |
|
|
|
padding-left: 37rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.mask-content .iconfont { |
|
|
|
position: absolute; |
|
|
|
right: 30rpx; |
|
|
|
top: 20rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.express-all { |
|
|
|
margin: 40rpx; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
|
|
|
|
.express-item { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
padding-bottom: 60rpx; |
|
|
|
position: relative; |
|
|
|
z-index: 1; |
|
|
|
} |
|
|
|
|
|
|
|
.line { |
|
|
|
width: 1rpx; |
|
|
|
height: 100%; |
|
|
|
background: #CCCCCC; |
|
|
|
position: absolute; |
|
|
|
left: 13rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.express-info { |
|
|
|
width: 600rpx; |
|
|
|
font-size: 26rpx; |
|
|
|
line-height: 40rpx; |
|
|
|
color: #999; |
|
|
|
} |
|
|
|
|
|
|
|
.express-info.active { |
|
|
|
color: #000; |
|
|
|
} |
|
|
|
|
|
|
|
.express-time { |
|
|
|
font-size: 22rpx; |
|
|
|
color: #666; |
|
|
|
margin-top: 10rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.express-item-icon { |
|
|
|
width: 27rpx; |
|
|
|
height: 27rpx; |
|
|
|
background: #CCCCCC; |
|
|
|
border-radius: 50%; |
|
|
|
position: relative; |
|
|
|
} |
|
|
|
|
|
|
|
.express-item-icons { |
|
|
|
background: #D3E8A7; |
|
|
|
} |
|
|
|
</style> |
chenkainan
4 months ago