You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1421 lines
44 KiB
1421 lines
44 KiB
<template>
|
|
<!-- 代买饭页 -->
|
|
<view class="page1">
|
|
<view class="title">
|
|
<view class="title-sreach">
|
|
<view class="back-btn" @tap="back" :style="{'top': menuButtonInfo.top +'px'}">
|
|
<uni-icons type="left" size="28"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view style="position: absolute;top: 200rpx;width: 100%;">
|
|
<view class="tab1" v-if="isPaotui">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/6b3a4d4c61ee42feb29e69d6fcfd2c1e.png" alt=""
|
|
style="position: absolute;" />
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/1cbed0734a154a70b75cb84a811bd0b7.png" alt="" />
|
|
<view style="width: 100%;height: 160rpx;position: absolute;top:0;left: 0;display: flex;">
|
|
<view style="width: 50%;height: 160rpx;"></view>
|
|
<view style="width: 50%;height: 160rpx;" @tap="isPaotui=!isPaotui"></view>
|
|
</view>
|
|
</view>
|
|
<view class="tab1" v-else>
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/3b98dfb370eb4ddcb942b7942dedced2.png" alt=""
|
|
style="position: absolute;" />
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/82627e6cedcf409a932d6afaafa19a4b.png" alt=""
|
|
style="position: absolute;" />
|
|
<view style="width: 100%;height: 160rpx;position: absolute;top:0;left: 0;display: flex;">
|
|
<view style="width: 50%;height: 160rpx;" @tap="isPaotui=!isPaotui"></view>
|
|
<view style="width: 50%;height: 160rpx;"></view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="ziqu-box" v-if="isPaotui==false">
|
|
<view class="ziqu-xuanfu">
|
|
取餐信息
|
|
</view>
|
|
<view class="ziqu-address">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/e13c675ffd4547d0b271900902ffea66.png" alt="" />
|
|
<view class="ziqu-text">
|
|
地址：{{shopItem.shopAddress || ''}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="address-box" v-if="isPaotui">
|
|
<view v-if="!formData.address" @tap="openAddressBook">
|
|
请选择收货地址 <uni-icons type="right" size="16"></uni-icons>
|
|
</view>
|
|
<view v-else style="display: flex; justify-content: space-between; align-items: center;">
|
|
<view @tap="openAddressBook"
|
|
style="flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;">
|
|
{{formData.address.areaName || ''}}{{formData.address.floor ? formData.address.floor + '层' : ''}}{{formData.address.roomNum || ''}}
|
|
{{formData.address.receiverName || ''}}
|
|
</view>
|
|
<view @tap.stop="openAddressBook"
|
|
style="color: #0b9b73; font-size: 26rpx; font-weight: normal; margin-left: 20rpx; display: flex; align-items: center;">
|
|
更换地址 <uni-icons type="right" size="13" color="#0b9b73"></uni-icons>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="time-box" v-if="isPaotui">
|
|
<view class="time1" @tap="checkTime(true)"
|
|
:style="{'background':formData.isImmediately?'linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1))':'#f5f5f5'}">
|
|
<view style="font-weight: 700;">
|
|
立即送出
|
|
</view>
|
|
<view style="font-size: 20rpx;color: #777;">
|
|
预计{{immediateTimeStr}}送达
|
|
</view>
|
|
</view>
|
|
<view class="time1" @tap="checkTime(false)"
|
|
:style="{'background':formData.isImmediately==false?'linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1))':'#f5f5f5'}">
|
|
<view style="font-weight: 700;">
|
|
预约配送
|
|
</view>
|
|
<view class="">
|
|
<view style="font-size: 20rpx;color: #777;"
|
|
v-if="formData.isImmediately!=true&&formData.deliveryTime!=''">
|
|
{{formData.deliveryTime}}
|
|
</view>
|
|
<view v-else style="font-size: 20rpx;color: #777;">
|
|
选择时间 >
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-if="isPaotui" style='background: #fff;border-bottom: 1px solid #eee;'>
|
|
<view
|
|
style="height: 140rpx;line-height: 40rpx;padding: 0 40rpx;font-size: 28rpx;font-weight: 700;padding-top: 20rpx;">
|
|
<view class="">
|
|
配送员
|
|
</view>
|
|
<view style="font-size: 24rpx;color: #777;">
|
|
指定配送员，如配送员拒绝接单或者下线，订单进入抢单大厅
|
|
</view>
|
|
<view style="font-size: 24rpx;color: #777;">
|
|
不指定配送员超过10分钟没有人接单，会发送短信通知
|
|
</view>
|
|
</view>
|
|
<view style="padding: 40rpx;">
|
|
<view
|
|
style="display: flex;font-size: 28rpx;font-weight: bold;line-height: 50rpx;margin-bottom: 30rpx;align-items: center;">
|
|
<view style="width:50%;display: flex;align-items: center;">
|
|
<view class="radio-check" v-if="selected === 'buzhiding'">
|
|
<uni-icons type="checkmarkempty" size="12"></uni-icons>
|
|
</view>
|
|
<view class="radio-no-check" @tap="checkVoucher('buzhiding')" v-else></view>
|
|
不指定
|
|
</view>
|
|
<view style="width: 50%;display: flex;justify-content: flex-end;align-items: center;"
|
|
v-if="selected === 'buzhiding'">
|
|
<text style="color: #777; font-weight: normal; margin-right: 10rpx; font-size: 24rpx;">佣金 ￥</text>
|
|
<input type="digit" v-model="customCommission"
|
|
style="width: 140rpx; border-bottom: 1px solid #ccc; text-align: center; font-size: 28rpx; font-weight: normal; height: 50rpx; min-height: 50rpx;"
|
|
placeholder="金额" />
|
|
</view>
|
|
</view>
|
|
<view class="" style="display: flex;font-size: 28rpx;font-weight: bold;line-height: 50rpx;">
|
|
<view style="width:50%;display: flex;">
|
|
<view class="radio-check" v-if="selected === 'zhiding'">
|
|
<uni-icons type="checkmarkempty" size="12"></uni-icons>
|
|
</view>
|
|
<view class="radio-no-check" @tap="checkVoucher('zhiding')" v-else></view>
|
|
指定配送员
|
|
</view>
|
|
<view style="width: 50%;color: #777;text-align: right;" @tap="goDetail">
|
|
{{ assignedWorker ? assignedWorker.workerName + ' ' + assignedWorker.mobile : '配送员' }}
|
|
<uni-icons type="right" size="12"></uni-icons>
|
|
</view>
|
|
</view>
|
|
|
|
<view v-if="highFloorFeeCalc > 0" style="margin-top: 20rpx; color: #ff5722; font-size: 24rpx; background: #fff5f5; padding: 10rpx 20rpx; border-radius: 10rpx;">
|
|
<uni-icons type="info" size="14" color="#ff5722"></uni-icons>
|
|
因您的收货楼层在3楼以上，将额外收取配送费 ¥{{highFloorFeeCalc}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="box1">
|
|
<view style="width: 100%;line-height: 70rpx;font-size: 28rpx;font-weight: 700;">
|
|
{{shopItem.shopName || '未知道商家'}}
|
|
</view>
|
|
|
|
<block v-if="!isGroupBuy">
|
|
<view style="display: flex;padding: 20rpx;background: #f5f5f5;border-radius: 20rpx; margin-bottom:20rpx;"
|
|
v-for="(cartItem, index) in cartItems" :key="index">
|
|
<view class="goods-img">
|
|
<img :src="cartItem.item.productPicture" alt="">
|
|
</view>
|
|
<view class="goods-content">
|
|
<view class="goods-name">
|
|
{{cartItem.item.productName}}
|
|
</view>
|
|
<view class="goods-content-center" v-if="cartItem.specs">
|
|
<view class="goods-deal1">
|
|
{{getSpecDisplayString(cartItem.specs)}}
|
|
</view>
|
|
</view>
|
|
<view class="goods-content-bottom">
|
|
<view style="width: 45%;flex:1;">
|
|
X{{cartItem.quantity}}
|
|
</view>
|
|
<view class="pintuan-left-price">
|
|
￥{{cartItem.price}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
<block v-else>
|
|
<view style="display: flex;padding: 20rpx;background: #f5f5f5;border-radius: 20rpx; margin-bottom:20rpx;"
|
|
v-if="groupItem">
|
|
<view class="goods-img">
|
|
<img :src="groupItem.item.productPicture" alt="">
|
|
</view>
|
|
<view class="goods-content">
|
|
<view class="goods-name">
|
|
{{groupItem.item.productName}}
|
|
</view>
|
|
<view class="goods-content-center" v-if="groupItem.specs">
|
|
<view class="goods-deal1">
|
|
{{getSpecDisplayString(groupItem.specs)}}
|
|
</view>
|
|
</view>
|
|
<view class="goods-content-bottom">
|
|
<view style="width: 45%;flex:1;">
|
|
X1
|
|
</view>
|
|
<view class="pintuan-left-price">
|
|
<view
|
|
style="background: rgba(255, 57, 57, 0.2);padding: 0px 12rpx;border-radius: 20rpx;margin-left: 20rpx;">
|
|
<text>拼团</text>
|
|
<text style="color: red;">￥{{groupItem.groupRule.groupPrice}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-if="groupItem.item.moreBuyData" style="display: flex;padding: 20rpx;background: #f5f5f5;border-radius: 20rpx; margin-bottom:20rpx;"
|
|
v-for="(cartItem, index) in groupItem.item.moreBuyData" :key="index">
|
|
<view class="goods-img">
|
|
<img :src="cartItem.productPicture" alt="">
|
|
</view>
|
|
<view class="goods-content">
|
|
<view class="goods-name">
|
|
{{cartItem.productName}}
|
|
</view>
|
|
<view class="goods-content-center" v-if="cartItem.specs">
|
|
<view class="goods-deal1">
|
|
{{getSpecDisplayString(cartItem.specs)}}
|
|
</view>
|
|
</view>
|
|
<view class="goods-content-bottom">
|
|
<view style="width: 45%;flex:1;">
|
|
X{{cartItem.quantity}}
|
|
</view>
|
|
<view class="pintuan-left-price">
|
|
￥{{cartItem.attributeListPrice | sliceMsg}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
|
|
<view>
|
|
<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="isPaotui">
|
|
<view style="flex: 1;color: #777;font-weight: 700;">
|
|
打包费
|
|
</view>
|
|
<view style="color: #000;font-weight:700;">
|
|
￥{{packageFee.toFixed(2)}}
|
|
</view>
|
|
</view>
|
|
<view style="height: 80rpx;line-height: 80rpx;display: flex;" v-if="isPaotui">
|
|
<view style="flex: 1;color: #777;font-weight: 700;">
|
|
配送费 <text v-if="isFaceToFace" style="font-size: 20rpx;color: #999;">(均摊 | 超过2人，每多一人配送费总额增加0.5)</text>
|
|
</view>
|
|
<view style="color: #000;font-weight:700;">
|
|
￥{{deliveryFeeCalc.toFixed(2)}}
|
|
</view>
|
|
</view>
|
|
<view style="height: 80rpx;line-height: 80rpx;display: flex;">
|
|
<view style="flex: 1;color: #777;font-weight: 700;">
|
|
备注
|
|
</view>
|
|
<view style="color: #000;font-weight:700;flex: 1;">
|
|
<input type="digit" v-model="remark"
|
|
style="border-bottom: 1px solid #ccc; text-align: center; font-size: 28rpx; font-weight: normal; height: 50rpx; min-height: 50rpx;"
|
|
/>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view
|
|
style="display: flex;height: 80rpx;line-height: 80rpx;border-top: 1px solid #eee;font-size: 28rpx;font-weight: 700; align-items:center;" @tap="openCouponPopup">
|
|
<view style="flex: 1; color: #777; font-size:32rpx;">
|
|
优惠券
|
|
</view>
|
|
<view style="color: #ff5722;" v-if="selectedCoupon">
|
|
-￥{{selectedCoupon.discountAmount.toFixed(2)}}
|
|
</view>
|
|
<view style="color: #0b9b73;" v-else-if="availableCoupons.length > 0">
|
|
有 {{availableCoupons.length}} 张可用
|
|
</view>
|
|
<view style="color: #999;" v-else>
|
|
无可用券
|
|
</view>
|
|
<uni-icons type="right" size="14" color="#999" style="margin-left:10rpx;"></uni-icons>
|
|
</view>
|
|
<view
|
|
style="display: flex;height: 80rpx;line-height: 100rpx;border-top: 1px solid #eee;font-size: 32rpx;font-weight: 700;">
|
|
<view style="flex: 1;">
|
|
合计
|
|
</view>
|
|
<view class="">
|
|
￥{{totalAmountCalc.toFixed(2)}}
|
|
</view>
|
|
</view>
|
|
<view style="height:160rpx;"></view>
|
|
<view class="buy-bottom">
|
|
<view class="bottom-btn" @tap="submitPay">
|
|
立即支付
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 地址簿弹出层 -->
|
|
<uni-popup ref="bookPopup" background-color="#fff">
|
|
<view class="book-popup-content">
|
|
<address-list @selectAddress="handleSelectAddress" @syncAddress="handleSyncAddress"
|
|
@close="closeAddressBook"></address-list>
|
|
</view>
|
|
</uni-popup>
|
|
<!-- 警告弹出层 -->
|
|
<uni-popup ref="warnPopup" background-color="#fff">
|
|
<view class="warnImg">
|
|
<img v-if="warnPopup == 'shdz'" @tap="$refs.warnPopup.close()"
|
|
src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/4996043b3987401794b974d359429b8e.png"
|
|
alt="填写收货地址" style="width:600rpx;height:740rpx;" />
|
|
<img v-if="warnPopup == 'psyj'" @tap="$refs.warnPopup.close()"
|
|
src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/001cf760048b4718bdccd55085bef601.png"
|
|
alt="填写配送佣金" style="width:600rpx;height:740rpx;" />
|
|
<img v-if="warnPopup == 'psy'" @tap="$refs.warnPopup.close()"
|
|
src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/e10ad77ca478413a9c53918750ecb932.png"
|
|
alt="指定配送员" style="width:600rpx;height:740rpx;" />
|
|
</view>
|
|
</uni-popup>
|
|
<!-- 支付弹出层 -->
|
|
<uni-popup ref="payPopup" background-color="#fff">
|
|
<view class="pay-popup">
|
|
<view class="content">
|
|
<view class="box1">
|
|
<view style="height: 70rpx;line-height: 70rpx;text-align: center;">
|
|
支付剩余时间 59:09
|
|
</view>
|
|
<view
|
|
style="height: 90rpx;line-height: 90rpx;text-align: center;font-weight: 700;font-size: 30rpx;">
|
|
￥<text
|
|
style="font-size: 60rpx;">{{backendTotalAmount ? backendTotalAmount.toFixed(2) : totalAmountCalc.toFixed(2)}}</text>
|
|
</view>
|
|
<view style="height: 40rpx;text-align: center;color: red;">
|
|
若拼团失败，将会为您自动退款
|
|
</view>
|
|
</view>
|
|
<view class="box1" style="display: flex;padding: 40rpx;">
|
|
<view style="flex: 1;">
|
|
<view style="height: 42rpx;line-height: 42rpx;display: flex;">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/4c8e0cc311db4d38ab43e019673c4b8c.png"
|
|
alt="" style="width: 42rpx;height: 42rpx;margin-right: 20rpx;" />
|
|
<text style="font-size: 30rpx;font-weight: 700;">微信支付</text>
|
|
</view>
|
|
<view style="text-align: right;margin-left: 60rpx;color: #777;width: 146rpx;">
|
|
使用微信支付
|
|
</view>
|
|
</view>
|
|
<view style="width: 36rpx;padding-top: 20rpx;">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/02bff7edc4e04caaa1868955ff684f1f.png"
|
|
alt="" style="width: 36rpx;height: 36rpx;" />
|
|
</view>
|
|
</view>
|
|
<view class="btn" @tap="wxPayment">
|
|
确认付款
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
<!-- 拼团分享弹出层 -->
|
|
<uni-popup ref="pintuanPopup" background-color="#fff" @change="onPintuanPopupChange">
|
|
<view class="pintuan-popup">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/ecd00dab1c9c44198d765bc08bc1bd71.png" alt=""
|
|
style="position: absolute;top: 0;right: 0;width: 240rpx;height: 180rpx;" @tap="$refs.pintuanPopup.close()">
|
|
<view style="position: absolute;bottom: 0;width: 100%;height: 760rpx;">
|
|
<view class="kaituan1">
|
|
<view class="kaituan1-title">
|
|
差{{groupItem.groupRule.groupCount - 1}}人即可成团
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/21b403bd13414ce79ad73cf1c8e3de98.png"
|
|
alt="" style="width: 120rpx;height: 22rpx;position: absolute;bottom: 0;right: 30rpx;" />
|
|
</view>
|
|
<view class="kaituan1-title1">
|
|
快呼唤小伙伴参加吧！
|
|
</view>
|
|
</view>
|
|
<view class="kaituan2">
|
|
<view class="kaituan22">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/ecd00dab1c9c44198d765bc08bc1bd71.png"
|
|
alt=""
|
|
style="width: 90rpx;height: 90rpx;border-radius: 90rpx;margin: 0 auto;display: block;" />
|
|
</view>
|
|
<view class="kaituan22" v-for="n in groupItem.groupRule.groupCount - 1">
|
|
<view class="weipincheng">
|
|
+
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="kaituan3" style="display: flex;margin-left: auto;margin-right: auto;width: 50%;">
|
|
剩余
|
|
<uni-countdown :show-day="false" :hour="23" :minute="59" :second="59" :font-size="16" color="red" />
|
|
结束
|
|
</view>
|
|
<view class="kaituan4">
|
|
<button open-type="share" style="background:transparent;border:none;color:inherit;font-size:inherit;display:inline-flex;align-items:center;">
|
|
分享至微信 <uni-icons type="weixin" size="15"></uni-icons>
|
|
</button>
|
|
</view>
|
|
<view class="kaituan5">
|
|
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/c1f1b45c98fa4db1a1e5f98b3a0573c2.png"
|
|
alt="" style="width: 520rpx;height: 150rpx;margin: 0 auto;display: block;" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
|
|
<uni-popup ref="couponPopup" type="bottom" background-color="#F5F8F5">
|
|
<view style="width: 100%; height: 800rpx; display: flex; flex-direction: column;">
|
|
<view style="height: 100rpx; line-height: 100rpx; text-align: center; font-size: 32rpx; font-weight: bold; border-bottom: 1px solid #eee; position: relative; background: #fff;">
|
|
选择优惠券
|
|
<uni-icons type="closeempty" size="24" @tap="$refs.couponPopup.close()" style="position: absolute; right: 30rpx; top: 0;"></uni-icons>
|
|
</view>
|
|
<scroll-view scroll-y style="flex: 1; padding: 20rpx; box-sizing: border-box;">
|
|
<view v-for="(item, index) in availableCoupons" :key="index" @tap="selectCoupon(item)"
|
|
style="background: #fff; border-radius: 12rpx; padding: 30rpx 20rpx; margin-bottom: 20rpx; display: flex; align-items: center; justify-content: space-between;">
|
|
<view style="display: flex; align-items: center; flex: 1;">
|
|
<view style="color: #ff5722; font-size: 40rpx; font-weight: bold; width: 140rpx;">
|
|
<text style="font-size: 24rpx;">￥</text>{{item.discountAmount}}
|
|
</view>
|
|
<view style="flex: 1; display: flex; flex-direction: column; justify-content: center; margin-left: 20rpx;">
|
|
<view style="font-size: 28rpx; font-weight: bold; color: #333; margin-bottom: 6rpx;">{{item.couponName}}</view>
|
|
<view style="font-size: 22rpx; color: #999;" v-if="item.minAmount > 0">满{{item.minAmount}}可用</view>
|
|
<view style="font-size: 22rpx; color: #999;" v-else>无门槛使用</view>
|
|
</view>
|
|
</view>
|
|
<uni-icons v-if="selectedCoupon && selectedCoupon.id === item.id" type="checkmarkempty" size="20" color="#0b9b73"></uni-icons>
|
|
<view v-else style="width: 40rpx; height: 40rpx; border-radius: 50%; border: 1px solid #ddd;"></view>
|
|
</view>
|
|
<view v-if="availableCoupons.length===0" style="text-align:center; padding-top: 100rpx; color: #999;">
|
|
暂无可用优惠券
|
|
</view>
|
|
<view style="height:40rpx;"></view>
|
|
</scroll-view>
|
|
<view style="padding: 20rpx 40rpx; background: #fff;" v-if="availableCoupons.length>0">
|
|
<view @tap="selectCoupon(null)" style="width: 100%; height: 80rpx; background: linear-gradient(90deg, #e3ff96, #a6ffea); font-size: 30rpx; font-weight: 700; line-height: 80rpx; text-align: center; border-radius: 100rpx;">
|
|
不使用优惠券
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-popup>
|
|
<delivery-time-op @timeCallback="timeCallback" :dodge="true" ref='model' :content="content" :barHidth='600'
|
|
title="选择送达时间">
|
|
> </delivery-time-op>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import deliveryTimeOp from '@/components/delivery-time-op/delivery-time-op.vue'
|
|
import addressList from '@/package1/address/addressList.vue'
|
|
export default {
|
|
data() {
|
|
return {
|
|
warnPopup: 'shdz',
|
|
isPaotui: true,
|
|
menuButtonInfo: {},
|
|
formData: {
|
|
address: null,
|
|
isImmediately: true,
|
|
deliveryTime: '',
|
|
peisongyuan: ''
|
|
},
|
|
content: [],
|
|
remark:'',
|
|
selected: 'buzhiding',
|
|
customCommission: '0',
|
|
shopItem: {},
|
|
cartItems: [],
|
|
groupItem: null,
|
|
isGroupBuy: false,
|
|
isFaceToFace: false,
|
|
assignedWorker: null,
|
|
immediateTimeStr: '',
|
|
totalPackageFee: 0,
|
|
backendTotalAmount: 0,
|
|
currentOrderId: '',
|
|
createdOrderInfo: null,
|
|
isPaymentSuccessGroupInitiate: false,
|
|
availableCoupons: [],
|
|
selectedCoupon: null
|
|
}
|
|
},
|
|
components: {
|
|
deliveryTimeOp,
|
|
addressList
|
|
},
|
|
filters: {
|
|
sliceMsg(val) {
|
|
var name = ''
|
|
if (typeof(val) == 'string') {
|
|
let newObj = JSON.parse(val)
|
|
for (let as in newObj) {
|
|
name = newObj[as].specPrice
|
|
}
|
|
}
|
|
return name;
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
if (option.shopItem) {
|
|
this.shopItem = JSON.parse(decodeURIComponent(option.shopItem));
|
|
}
|
|
if (option.cart) {
|
|
this.cartItems = JSON.parse(decodeURIComponent(option.cart));
|
|
this.isGroupBuy = false;
|
|
}
|
|
if (option.item) {
|
|
this.groupItem = JSON.parse(decodeURIComponent(option.item));
|
|
console.log("1111111",this.groupItem)
|
|
this.isGroupBuy = this.groupItem.orderType === 2;
|
|
this.isFaceToFace = this.groupItem.isFaceToFace || false;
|
|
}
|
|
if (option.packageFee) {
|
|
this.totalPackageFee = parseFloat(option.packageFee) || 0;
|
|
}
|
|
},
|
|
computed: {
|
|
goodsAmountCalc() {
|
|
if (this.isGroupBuy && this.groupItem) {
|
|
if(this.groupItem.item.moreBuyData){
|
|
let allPrice = parseFloat(this.groupItem.groupRule.groupPrice)
|
|
for(let a = 0;a<this.groupItem.item.moreBuyData.length;a++){
|
|
allPrice += parseFloat(Number(this.sliceMsg1(this.groupItem.item.moreBuyData[a].attributeListPrice)) * this.groupItem.item.moreBuyData[a].quantity);
|
|
}
|
|
return parseFloat(allPrice);
|
|
}else{
|
|
return parseFloat(this.groupItem.groupRule.groupPrice);
|
|
}
|
|
} else {
|
|
return this.cartItems.reduce((acc, curr) => acc + (curr.quantity * parseFloat(curr.price)), 0);
|
|
}
|
|
},
|
|
highFloorFeeCalc() {
|
|
if (this.selected === 'zhiding' && this.assignedWorker) {
|
|
let hFee = parseFloat(this.assignedWorker.highFloorFee || 0);
|
|
if (hFee > 0 && this.formData.address && parseInt(this.formData.address.floor) > 3) {
|
|
return hFee;
|
|
}
|
|
}
|
|
return 0;
|
|
},
|
|
packageFee() {
|
|
if (this.totalPackageFee > 0) return this.totalPackageFee;
|
|
let fee = 0;
|
|
if (this.isGroupBuy && this.groupItem && this.groupItem.item) {
|
|
fee = parseFloat(this.groupItem.item.lunchBox || 0);
|
|
} else if (this.cartItems && this.cartItems.length > 0) {
|
|
for (let cart of this.cartItems) {
|
|
if (cart.item) {
|
|
fee += parseFloat(cart.item.lunchBox || 0) * cart.quantity;
|
|
}
|
|
}
|
|
}
|
|
return fee;
|
|
},
|
|
deliveryFeeCalc() {
|
|
if (!this.isPaotui) return 0;
|
|
let isJoiningFaceToFace = this.isGroupBuy && this.groupItem && this.groupItem.groupId && this.groupItem
|
|
.isFaceToFace;
|
|
if (isJoiningFaceToFace)
|
|
return 0; // Front-end doesn't know exact fee, relies on backend after order creation
|
|
let commission = 0;
|
|
if (this.selected === 'zhiding') {
|
|
if (!this.assignedWorker) return 0;
|
|
commission = parseFloat(this.assignedWorker.orderBkge || 3);
|
|
} else {
|
|
if (this.customCommission !== '' && this.customCommission !== null && !isNaN(parseFloat(this
|
|
.customCommission))) {
|
|
commission = parseFloat(this.customCommission);
|
|
}
|
|
}
|
|
if (this.isGroupBuy && this.groupItem && this.groupItem.isFaceToFace && !this.groupItem.groupId) {
|
|
let members = parseInt(this.groupItem.groupRule.groupCount) || 1;
|
|
if (this.selected === 'zhiding') {
|
|
let extra = members > 2 ? (members - 2) * 0.5 : 0;
|
|
return Math.ceil(((commission + this.highFloorFeeCalc + extra) / members) * 100) / 100;
|
|
} else {
|
|
return Math.ceil(((commission + this.highFloorFeeCalc) / members) * 100) / 100;
|
|
}
|
|
}
|
|
return commission + this.highFloorFeeCalc;
|
|
},
|
|
totalAmountCalc() {
|
|
let total = this.preDiscountTotal;
|
|
if (this.selectedCoupon) {
|
|
total -= parseFloat(this.selectedCoupon.discountAmount);
|
|
}
|
|
return total > 0 ? total : 0.01;
|
|
},
|
|
preDiscountTotal() {
|
|
if(this.isPaotui==true){
|
|
return this.goodsAmountCalc + this.packageFee + this.deliveryFeeCalc;
|
|
}else{
|
|
return this.goodsAmountCalc;
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
preDiscountTotal(newVal, oldVal) {
|
|
if (newVal !== oldVal) {
|
|
this.fetchCoupons();
|
|
}
|
|
}
|
|
},
|
|
onShow() {
|
|
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
|
|
this.initAddress()
|
|
//this.fetchCoupons();
|
|
const now = new Date();
|
|
const startTime = new Date(now);
|
|
const endTime = new Date(now);
|
|
startTime.setMinutes(startTime.getMinutes() + 20);
|
|
endTime.setMinutes(endTime.getMinutes() + 35);
|
|
const startStr =
|
|
`${startTime.getHours().toString().padStart(2, '0')}:${startTime.getMinutes().toString().padStart(2, '0')}`;
|
|
const endStr =
|
|
`${endTime.getHours().toString().padStart(2, '0')}:${endTime.getMinutes().toString().padStart(2, '0')}`;
|
|
this.immediateTimeStr = `${startStr}-${endStr}`;
|
|
|
|
uni.$on('updateDeliveryWorker', (worker) => {
|
|
this.assignedWorker = worker;
|
|
this.selected = 'zhiding';
|
|
});
|
|
},
|
|
onShareAppMessage(res) {
|
|
if (this.isPaymentSuccessGroupInitiate) {
|
|
let groupId = this.createdOrderInfo.groupInfo.id;
|
|
let targetMembers = this.groupItem?.groupRule?.groupCount || 2;
|
|
let shopItemStr = encodeURIComponent(JSON.stringify(this.shopItem));
|
|
let isFTF = this.isFaceToFace ? 1 : 0;
|
|
console.log(shopItemStr)
|
|
let path = `/package1/group/groupBuySingle?type=shop&item=${shopItemStr}&groupId=${groupId}&targetMembers=${targetMembers}&isFaceToFace=${isFTF}`;
|
|
|
|
return {
|
|
title: '我发起了一个拼团，快来一起拼单吧！',
|
|
path: path,
|
|
imageUrl:'https://jewel-shop.oss-cn-beijing.aliyuncs.com/62c9aa038b2541ad9c400a76ddae7ef8.png'
|
|
}
|
|
}
|
|
return {
|
|
title: '买饭',
|
|
path: '/pages/index/index'
|
|
}
|
|
},
|
|
onUnload() {
|
|
uni.$off('updateDeliveryWorker');
|
|
uni.removeStorageSync('pendingAssignWorker');
|
|
},
|
|
methods: {
|
|
initAddress() {
|
|
let cachedAddress = uni.getStorageSync('selectedAddress');
|
|
if (cachedAddress) {
|
|
this.formData.address = cachedAddress;
|
|
} else {
|
|
let that = this;
|
|
that.tui.request("/app/userAddress/list", "GET", {
|
|
userId: uni.getStorageSync('id')
|
|
}, false, true).then((res) => {
|
|
if (res.code == 200 && res.result && res.result.length > 0) {
|
|
// Find default address or use the first one
|
|
let target = res.result.find(item => item.isDefault == 1) || res.result[0];
|
|
that.formData.address = target;
|
|
uni.setStorageSync('selectedAddress', target);
|
|
}
|
|
}).catch(() => {});
|
|
}
|
|
},
|
|
handleSelectAddress(address) {
|
|
this.formData.address = address;
|
|
uni.setStorageSync('selectedAddress', address);
|
|
this.$refs.bookPopup.close();
|
|
},
|
|
handleSyncAddress(address) {
|
|
this.formData.address = address;
|
|
},
|
|
closeAddressBook() {
|
|
this.$refs.bookPopup.close();
|
|
},
|
|
getSpecDisplayString(specs) {
|
|
if (!specs) return '';
|
|
let arr = [];
|
|
for (let k in specs) {
|
|
arr.push(specs[k]);
|
|
}
|
|
return arr.join(',');
|
|
},
|
|
submitPay() {
|
|
let isJoiningFaceToFace = this.isGroupBuy && this.groupItem && this.groupItem.groupId && this.groupItem
|
|
.isFaceToFace;
|
|
if (this.isPaotui && !this.formData.address && !isJoiningFaceToFace) {
|
|
this.warnPopup = 'shdz';
|
|
this.$refs.warnPopup.open();
|
|
return;
|
|
}
|
|
|
|
if (this.isPaotui && this.selected === 'buzhiding' && !isJoiningFaceToFace) {
|
|
let comm = parseFloat(this.customCommission);
|
|
if (isNaN(comm) || comm <= 0) {
|
|
this.warnPopup = 'psyj';
|
|
this.$refs.warnPopup.open();
|
|
return;
|
|
}
|
|
}
|
|
|
|
if (this.isPaotui && this.selected === 'zhiding' && !this.assignedWorker && !isJoiningFaceToFace) {
|
|
this.warnPopup = 'psy';
|
|
this.$refs.warnPopup.open();
|
|
return;
|
|
}
|
|
this.submitOrderToBackend();
|
|
},
|
|
goDetail() {
|
|
let shopArea = this.shopItem.shopArea || '';
|
|
let putArea = this.formData.address ? this.formData.address.areaId : '';
|
|
uni.navigateTo({
|
|
url: `/package1/index/deliveryPersonList?orderType=0&shopAreaId=${shopArea}&putAreaId=${putArea}`
|
|
})
|
|
},
|
|
openCouponPopup() {
|
|
this.fetchCoupons();
|
|
this.$refs.couponPopup.open('bottom');
|
|
},
|
|
fetchCoupons() {
|
|
let userId = uni.getStorageSync('id');
|
|
if (!userId) return;
|
|
let amount = this.preDiscountTotal;
|
|
this.tui.request('/mall/coupon/available', 'GET', {
|
|
userId: userId,
|
|
regionId:JSON.parse(uni.getStorageSync('area')).id,
|
|
applyScene: 1,
|
|
amount: amount,
|
|
merchantId: this.shopItem.shopId || '0'
|
|
}, false, true).then((res) => {
|
|
if (res.code == 200 && res.result) {
|
|
this.availableCoupons = res.result;
|
|
if (this.selectedCoupon) {
|
|
let stillValid = this.availableCoupons.find(c => c.id === this.selectedCoupon.id);
|
|
if (!stillValid) this.selectedCoupon = null;
|
|
}
|
|
}
|
|
});
|
|
},
|
|
selectCoupon(item) {
|
|
this.selectedCoupon = item;
|
|
this.$refs.couponPopup.close();
|
|
},
|
|
openAddressBook() {
|
|
this.$refs.bookPopup.open('bottom')
|
|
},
|
|
checkTime(type) {
|
|
if (type === this.formData.isImmediately) {
|
|
if (type === false) {
|
|
this.$refs.model.open()
|
|
this.generateDeliveryTimes()
|
|
}
|
|
return;
|
|
}
|
|
this.formData.isImmediately = type;
|
|
if (this.formData.isImmediately === false) {
|
|
this.$refs.model.open()
|
|
this.generateDeliveryTimes()
|
|
}
|
|
},
|
|
checkVoucher(type) {
|
|
if (type == this.selected) return;
|
|
this.selected = type;
|
|
if (this.selected == 'buzhiding') {
|
|
this.formData.peisongyuan = "";
|
|
this.assignedWorker = null;
|
|
}
|
|
},
|
|
wxPayment() {
|
|
let that = this;
|
|
if (!this.currentOrderId || !this.backendTotalAmount) return;
|
|
|
|
let amountInCents = Math.round(this.backendTotalAmount * 100);
|
|
let payDesc = '商城订单';
|
|
|
|
this.tui.request("/api/wechat/pay/unified-order", "POST", {
|
|
openid: uni.getStorageSync('miniProgramOpenid') || 'test-openid',
|
|
amount: amountInCents, // 支付金额（分）
|
|
description: payDesc,
|
|
outTradeNo: this.currentOrderId
|
|
}, false, false).then((res) => {
|
|
if (res.code == 200) {
|
|
uni.requestPayment({
|
|
provider: 'wxpay',
|
|
timeStamp: res.timeStamp,
|
|
nonceStr: res.nonceStr,
|
|
package: res.package,
|
|
signType: res.signType,
|
|
paySign: res.paySign,
|
|
success: function(res2) {
|
|
uni.showToast({ title: '支付成功', icon: 'success' });
|
|
that.tui.request("/api/wechat/pay/paySuccess", "POST", {
|
|
outTradeNo: that.currentOrderId
|
|
}, false, false).then((res3) => {
|
|
if(res3.code == 200){
|
|
that.handlePaymentSuccess();
|
|
}else{
|
|
that.tui.toast("订单创建失败，请联系客服处理");
|
|
}
|
|
})
|
|
|
|
},
|
|
fail: function(err) {
|
|
uni.redirectTo({
|
|
url: '/package1/order/orderDetail?id=' + that.currentOrderId
|
|
});
|
|
}
|
|
});
|
|
} else {
|
|
// 模拟支付成功(用于测试环境)
|
|
if (res.code == 404 || res.code == 500 || res.code == 400 || !res.code) {
|
|
that.tui.request(
|
|
`/hiver/order/payMallOrderSuccess?orderId=${that.currentOrderId}&workerId=${that.assignedWorker ? that.assignedWorker.workerId : ''}`,
|
|
"POST", {}, false, false).then(res2 => {
|
|
that.$refs.payPopup.close();
|
|
uni.showToast({
|
|
title: '支付成功(模拟)',
|
|
icon: 'none'
|
|
});
|
|
setTimeout(() => {
|
|
that.handlePaymentSuccess();
|
|
}, 1500);
|
|
}).catch(e => {
|
|
that.tui.toast("请求失败");
|
|
});
|
|
} else {
|
|
that.tui.toast(res.message);
|
|
}
|
|
}
|
|
})
|
|
},
|
|
handlePaymentSuccess() {
|
|
if (!this.isGroupBuy) {
|
|
uni.redirectTo({
|
|
url: '/package1/order/orderDetail?id=' + this.currentOrderId
|
|
});
|
|
} else {
|
|
let isInitiating = !this.groupItem.groupId;
|
|
let isJoining = !!this.groupItem.groupId;
|
|
if (isInitiating) {
|
|
this.isPaymentSuccessGroupInitiate = true;
|
|
this.$refs.pintuanPopup.open('center');
|
|
return;
|
|
} else if (isJoining) {
|
|
uni.redirectTo({
|
|
url: '/package1/order/orderDetail?id=' + this.currentOrderId
|
|
});
|
|
}
|
|
}
|
|
},
|
|
onPintuanPopupChange(e) {
|
|
if(!e.show){
|
|
uni.redirectTo({
|
|
url: '/package1/order/orderDetail?id=' + this.currentOrderId
|
|
});
|
|
}
|
|
},
|
|
getMustFinishTime() {
|
|
if (!this.formData.deliveryTime || this.formData.deliveryTime === '自动送达' || this.formData.deliveryTime ===
|
|
'尽快送达'){
|
|
const now = new Date();
|
|
now.setMinutes(now.getMinutes() + 35);
|
|
const year = now.getFullYear();
|
|
const month = String(now.getMonth() + 1).padStart(2, '0');
|
|
const day = String(now.getDate()).padStart(2, '0');
|
|
const hours = String(now.getHours()).padStart(2, '0');
|
|
const minutes = String(now.getMinutes()).padStart(2, '0');
|
|
const seconds = String(now.getSeconds()).padStart(2, '0');
|
|
return `${year}-${month}-${day}T${hours}:${minutes}:${seconds}`;
|
|
}else{
|
|
let timeStr = this.formData.deliveryTime;
|
|
if (timeStr.length === 5) {
|
|
let [h, m] = timeStr.split(':');
|
|
let targetHour = parseInt(h);
|
|
let d = new Date();
|
|
if (targetHour < d.getHours()) d.setDate(d.getDate() + 1);
|
|
let yyyy = d.getFullYear();
|
|
let MM = String(d.getMonth() + 1).padStart(2, '0');
|
|
let DD = String(d.getDate()).padStart(2, '0');
|
|
return `${yyyy}-${MM}-${DD}T${timeStr}:00`;
|
|
}
|
|
}
|
|
return null;
|
|
},
|
|
sliceMsg1(val) {
|
|
var name = ''
|
|
if (typeof(val) == 'string') {
|
|
let newObj = JSON.parse(val)
|
|
for (let as in newObj) {
|
|
name = newObj[as].specPrice
|
|
}
|
|
}
|
|
return name;
|
|
},
|
|
submitOrderToBackend() {
|
|
let isJoiningFaceToFace = this.isGroupBuy && this.groupItem && this.groupItem.groupId && this.groupItem
|
|
.isFaceToFace;
|
|
|
|
let items = [];
|
|
if (this.isGroupBuy && this.groupItem) {
|
|
if(this.groupItem.item.moreBuyData){
|
|
for(let a = 0;a<this.groupItem.item.moreBuyData.length;a++){
|
|
items.push({
|
|
productId: this.groupItem.item.moreBuyData[a].id,
|
|
specs: '',
|
|
price: parseFloat(this.sliceMsg1(this.groupItem.item.moreBuyData[a].attributeListPrice)),
|
|
quantity: this.groupItem.item.moreBuyData[a].quantity
|
|
});
|
|
}
|
|
}
|
|
items.push({
|
|
productId: this.groupItem.item.id,
|
|
productName: this.groupItem.item.productName,
|
|
productPicture: this.groupItem.item.productPicture,
|
|
specs: JSON.stringify(this.groupItem.specs || {}),
|
|
price: parseFloat(this.groupItem.groupRule.groupPrice),
|
|
isMain:0,
|
|
quantity: 1
|
|
});
|
|
} else {
|
|
for (let cart of this.cartItems) {
|
|
items.push({
|
|
productId: cart.item.id,
|
|
specs: JSON.stringify(cart.specs || {}),
|
|
price: parseFloat(cart.price),
|
|
quantity: cart.quantity
|
|
});
|
|
}
|
|
}
|
|
|
|
let deliveryType = this.isPaotui ? 1 : 2;
|
|
let payload = {
|
|
userId: uni.getStorageSync('id') || 'test-user123',
|
|
shopId: this.shopItem.id,
|
|
deliveryType: deliveryType,
|
|
packageFee: this.isPaotui ? this.packageFee : 0,
|
|
remark: this.remark,
|
|
items: items,
|
|
receiverName: this.formData.address ? this.formData.address.receiverName : '',
|
|
receiverPhone: this.formData.address ? this.formData.address.phone : '',
|
|
receiverAddress: this.formData.address ? ((this.formData.address.areaName || '') + (this.formData
|
|
.address.floor ? this.formData.address.floor + '层' : '') + (this.formData.address
|
|
.roomNum || '')) : '',
|
|
shopName: this.shopItem.shopName,
|
|
shopPhone: this.shopItem.contactPhone || '',
|
|
shopAddress: this.shopItem.shopAddress || ''
|
|
};
|
|
|
|
let mft = this.getMustFinishTime();
|
|
if (mft) payload.mustFinishTime = mft;
|
|
|
|
if (deliveryType === 1 && !isJoiningFaceToFace) {
|
|
payload.addressId = this.formData.address ? this.formData.address.id : null;
|
|
payload.getAreaId = this.shopItem.shopArea || null;
|
|
payload.putAreaId = this.formData.address ? this.formData.address.areaId : null;
|
|
}
|
|
|
|
payload.userCouponId = this.selectedCoupon ? this.selectedCoupon.id : null;
|
|
|
|
if (this.isGroupBuy && this.groupItem) {
|
|
if (this.groupItem.groupId) {
|
|
payload.groupId = this.groupItem.groupId;
|
|
} else {
|
|
payload.groupParam = {
|
|
targetMembers: parseInt(this.groupItem.groupRule.groupCount),
|
|
isFaceToFace: this.groupItem.isFaceToFace ? 1 : 0,
|
|
selfCommission: this.selected === 'buzhiding' ? parseFloat(this.customCommission || 0) :
|
|
null
|
|
};
|
|
}
|
|
}
|
|
|
|
if (this.isPaotui && !isJoiningFaceToFace) {
|
|
if (this.selected === 'zhiding' && this.assignedWorker) {
|
|
payload.workerParam = {
|
|
workerId: this.assignedWorker.workerId,
|
|
workerName: this.assignedWorker.workerName,
|
|
orderBkge: parseFloat(this.assignedWorker.orderBkge || 0) + this.highFloorFeeCalc
|
|
};
|
|
} else if (this.selected === 'buzhiding') {
|
|
payload.workerParam = {
|
|
orderBkge: parseFloat(this.customCommission || 0)
|
|
};
|
|
}
|
|
}
|
|
|
|
uni.showLoading({
|
|
title: '创建订单中...'
|
|
});
|
|
payload.regionId = JSON.parse(uni.getStorageSync('area')).id
|
|
this.tui.request("/mall/order/create", "POST", payload, false, false).then(res => {
|
|
uni.hideLoading();
|
|
if (res.success && res.result) {
|
|
let orderId = res.result.id;
|
|
let totalAmount = res.result.totalAmount;
|
|
this.backendTotalAmount = totalAmount;
|
|
this.currentOrderId = orderId;
|
|
this.createdOrderInfo = res.result;
|
|
this.$refs.payPopup.open('bottom');
|
|
} else {
|
|
uni.showToast({
|
|
title: res.message || '下单失败',
|
|
icon: 'none'
|
|
});
|
|
}
|
|
}).catch(err => {
|
|
uni.hideLoading();
|
|
});
|
|
},
|
|
//时间选择器获取时间数据
|
|
generateDeliveryTimes() {
|
|
const now = new Date();
|
|
const today = new Date(now);
|
|
const tomorrow = new Date(now);
|
|
tomorrow.setDate(tomorrow.getDate() + 1);
|
|
|
|
// 星期几
|
|
const weekdays = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
|
|
const todayWeekday = weekdays[today.getDay()];
|
|
const todayStr = `今天 (${todayWeekday})`;
|
|
|
|
// 明天的日期格式：月-日（不补零）
|
|
const month = tomorrow.getMonth() + 1;
|
|
const day = tomorrow.getDate();
|
|
const tomorrowStr = `${month}-${day}`;
|
|
|
|
// ----- 生成今天的时间列表 -----
|
|
const todayTimelist = [{
|
|
timestr: '自动送达'
|
|
}];
|
|
|
|
const currentHour = now.getHours();
|
|
const currentMinute = now.getMinutes();
|
|
|
|
// 计算下一个半小时点
|
|
let nextHour = currentHour;
|
|
let nextMinute = 30;
|
|
if (currentMinute >= 30) {
|
|
nextHour = currentHour + 1;
|
|
nextMinute = 0;
|
|
}
|
|
|
|
// 从下一个半小时点开始，直到 23:30
|
|
for (let h = nextHour; h <= 23; h++) {
|
|
const startMin = (h === nextHour) ? nextMinute : 0;
|
|
for (let m = startMin; m < 60; m += 30) {
|
|
if (h === 23 && m > 30) continue; // 不超过 23:30
|
|
const timeStr = `${h.toString().padStart(2, '0')}:${m.toString().padStart(2, '0')}`;
|
|
todayTimelist.push({
|
|
timestr: timeStr
|
|
});
|
|
}
|
|
}
|
|
|
|
// ----- 生成明天的时间列表（全天 00:00 ~ 23:30）-----
|
|
const tomorrowTimelist = [];
|
|
for (let h = 0; h <= 23; h++) {
|
|
for (let m = 0; m < 60; m += 30) {
|
|
if (h === 23 && m > 30) continue;
|
|
const timeStr = `${h.toString().padStart(2, '0')}:${m.toString().padStart(2, '0')}`;
|
|
tomorrowTimelist.push({
|
|
timestr: timeStr
|
|
});
|
|
}
|
|
}
|
|
|
|
this.content = [{
|
|
timezh: todayStr,
|
|
timelist: todayTimelist
|
|
},
|
|
{
|
|
timezh: tomorrowStr,
|
|
timelist: tomorrowTimelist
|
|
}
|
|
];
|
|
},
|
|
//时间选择器点击后
|
|
timeCallback(val) {
|
|
this.formData.deliveryTime = val.timestr
|
|
this.$refs.model.close()
|
|
},
|
|
back() {
|
|
uni.navigateBack()
|
|
}
|
|
}
|
|
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
width: 100%;
|
|
height: 100%;
|
|
font-size: 24rpx;
|
|
background: #F5F8F5;
|
|
color: #00231C;
|
|
}
|
|
|
|
.page1 {
|
|
width: 100%;
|
|
height: 100%;
|
|
font-size: 24rpx;
|
|
position: relative;
|
|
background: #fff;
|
|
}
|
|
|
|
.title {
|
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') no-repeat;
|
|
width: 100%;
|
|
height: 20%;
|
|
}
|
|
|
|
.title-sreach {
|
|
width: 100%;
|
|
display: flex;
|
|
height: 200rpx;
|
|
position: relative;
|
|
}
|
|
|
|
.back-btn {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.title-name {
|
|
padding-top: 110rpx;
|
|
font-size: 36rpx;
|
|
font-weight: 700;
|
|
flex: 1;
|
|
text-align: center;
|
|
}
|
|
|
|
.tab1 {
|
|
width: 100%;
|
|
height: 160rpx;
|
|
position: relative;
|
|
|
|
img {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.box1 {
|
|
width: 95%;
|
|
margin: 0 auto 20rpx;
|
|
background: #fff;
|
|
border-radius: 20rpx;
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.goods-img {
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
position: relative;
|
|
|
|
|
|
img {
|
|
width: 100%;
|
|
background-size: 100%;
|
|
height: 100%;
|
|
border-radius: 20rpx;
|
|
}
|
|
}
|
|
|
|
.goods-content {
|
|
flex: 1;
|
|
padding-left: 20rpx;
|
|
}
|
|
|
|
.goods-name {
|
|
font-size: 32rpx;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.goods-content-center {
|
|
display: flex;
|
|
margin: 16rpx 0;
|
|
color: #777;
|
|
}
|
|
|
|
.pintuan-left-price {
|
|
// width: 55%;
|
|
text-align: right;
|
|
font-weight: 700;
|
|
color: #000;
|
|
display: flex;
|
|
}
|
|
|
|
.goods-content-bottom {
|
|
display: flex;
|
|
line-height: 56rpx;
|
|
color: #777;
|
|
}
|
|
|
|
.address-box {
|
|
background: #fff;
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 700;
|
|
padding: 0 40rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.time-box {
|
|
background: #fff;
|
|
display: flex;
|
|
height: 140rpx;
|
|
padding: 20rpx;
|
|
}
|
|
|
|
.time1 {
|
|
height: 100rpx;
|
|
flex: 1;
|
|
border-radius: 20rpx;
|
|
text-align: center;
|
|
margin: 0 10rpx 0 20rpx;
|
|
line-height: 40rpx;
|
|
padding-top: 10rpx;
|
|
}
|
|
|
|
.radio-check {
|
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
border-radius: 48rpx;
|
|
text-align: center;
|
|
line-height: 48rpx;
|
|
margin: 0 20rpx 0 0;
|
|
}
|
|
|
|
.radio-no-check {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
border-radius: 48rpx;
|
|
border: 1px solid #eee;
|
|
margin: 0 20rpx 0 0;
|
|
}
|
|
|
|
.buy-bottom {
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 150rpx;
|
|
display: flex;
|
|
background: #fff;
|
|
z-index: 99;
|
|
box-shadow: 0 -20rpx 30rpx rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
.bottom-btn {
|
|
width: 90%;
|
|
height: 100rpx;
|
|
background: linear-gradient(90deg, #e3ff96, #a6ffea);
|
|
font-size: 26rpx;
|
|
font-weight: 700;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
border-radius: 100rpx;
|
|
margin: 20rpx auto;
|
|
}
|
|
.ziqu-text{
|
|
align-items: center;
|
|
display: flex;
|
|
}
|
|
.btn {
|
|
width: 95%;
|
|
height: 100rpx;
|
|
font-size: 32rpx;
|
|
font-weight: 700;
|
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
|
|
border-radius: 100rpx;
|
|
line-height: 100rpx;
|
|
text-align: center;
|
|
margin: 40rpx auto 0;
|
|
}
|
|
|
|
.ziqu-box {
|
|
background: #f5f5f5;
|
|
width: 90%;
|
|
margin: 0 auto;
|
|
border-radius: 20rpx;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ziqu-xuanfu {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
padding: 10rpx 20rpx;
|
|
background: rgba(166, 255, 234, 1);
|
|
border-top-right-radius: 20rpx;
|
|
border-bottom-left-radius: 20rpx;
|
|
font-weight: 700;
|
|
font-size: 20rpx;
|
|
}
|
|
|
|
.ziqu-address {
|
|
display: flex;
|
|
height: 110rpx;
|
|
background: #fff;
|
|
width: 90%;
|
|
border-radius: 20rpx;
|
|
font-size: 26rpx;
|
|
margin: 60rpx auto 20rpx;
|
|
font-weight: bold;
|
|
line-height: 40rpx;
|
|
|
|
img {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
margin: 36rpx 20rpx 0 30rpx;
|
|
}
|
|
}
|
|
|
|
.ziqu-time-box {
|
|
width: 90%;
|
|
margin: 20rpx auto;
|
|
display: flex;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.ziqu-call-box {
|
|
width: 90%;
|
|
display: flex;
|
|
height: 70rpx;
|
|
line-height: 70rpx;
|
|
margin: 0 auto 20rpx;
|
|
}
|
|
|
|
.ziqu-call {
|
|
flex: 1;
|
|
}
|
|
|
|
.book-popup-content {
|
|
position: relative;
|
|
height: 1200rpx;
|
|
width: 100%;
|
|
padding: 20rpx;
|
|
overflow: scroll;
|
|
}
|
|
|
|
.vue-ref {
|
|
border-radius: 20rpx !important;
|
|
}
|
|
|
|
.pintuan-popup {
|
|
background: url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/780a024aefb7431ba21cf16efc8a482e.png') no-repeat;
|
|
background-size: 100%;
|
|
width: 600rpx;
|
|
height: 960rpx;
|
|
position: relative;
|
|
}
|
|
|
|
.kaituan1 {
|
|
height: 120rpx;
|
|
font-size: 44rpx;
|
|
font-weight: 700;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.kaituan1-title {
|
|
position: relative;
|
|
text-align: center;
|
|
|
|
img {
|
|
width: 120rpx;
|
|
height: 22rpx;
|
|
position: absolute;
|
|
bottom: 0;
|
|
right: 250rpx;
|
|
}
|
|
}
|
|
|
|
.kaituan1-title1 {
|
|
font-size: 30rpx;
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
.kaituan2 {
|
|
display: flex;
|
|
width: 90%;
|
|
margin: 40rpx auto;
|
|
}
|
|
|
|
.kaituan22 {
|
|
flex: 1;
|
|
}
|
|
|
|
.kaituan3 {
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
text-align: center;
|
|
color: #777;
|
|
}
|
|
|
|
.kaituan4 {
|
|
width: 85%;
|
|
height: 100rpx;
|
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
|
|
border-radius: 100rpx;
|
|
text-align: center;
|
|
line-height: 100rpx;
|
|
font-size: 30rpx;
|
|
font-weight: 700;
|
|
margin: 20rpx auto;
|
|
}
|
|
|
|
.kaituan5 {
|
|
margin: 40rpx 0 40rpx;
|
|
}
|
|
|
|
.weipincheng {
|
|
width: 90rpx;
|
|
height: 90rpx;
|
|
background: rgba(166, 255, 234, 0.24);
|
|
border-radius: 90rpx;
|
|
text-align: center;
|
|
font-size: 60rpx;
|
|
font-weight: 700;
|
|
margin-left: -6rpx;
|
|
z-index: 97;
|
|
color: #02fbdd;
|
|
border: 1px solid #a6ffea;
|
|
line-height: 80rpx;
|
|
margin: 0 auto;
|
|
}
|
|
button::after{
|
|
border: 0;
|
|
}
|
|
</style>
|