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.
804 lines
24 KiB
804 lines
24 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: 100px;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: 80px;position: absolute;top:0;left: 0;display: flex;">
|
|
<view style="width: 50%;height: 80px;"></view>
|
|
<view style="width: 50%;height: 80px;" @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: 80px;position: absolute;top:0;left: 0;display: flex;">
|
|
<view style="width: 50%;height: 80px;" @tap="isPaotui=!isPaotui"></view>
|
|
<view style="width: 50%;height: 80px;"></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">
|
|
北校区1食堂3楼12号窗口杨国福麻辣烫
|
|
</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: 13px; font-weight: normal; margin-left: 10px; 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))':'#eee'}">
|
|
<view style="font-weight: 700;">
|
|
立即送出
|
|
</view>
|
|
<view style="font-size: 10px;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))':'#eee'}">
|
|
<view style="font-weight: 700;">
|
|
预约配送
|
|
</view>
|
|
<view class="">
|
|
<view style="font-size: 10px;color: #777;" v-if="formData.isImmediately!=true&&formData.deliveryTime!=''">
|
|
{{formData.deliveryTime}}
|
|
</view>
|
|
<view v-else style="font-size: 10px;color: #777;">
|
|
选择时间 >
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-if="isPaotui" style='background: #fff;border-bottom: 1px solid #eee;'>
|
|
<view style="height: 45px;line-height: 20px;padding: 0 20px;font-size: 14px;font-weight: 700;padding-top: 10px;">
|
|
<view class="">
|
|
配送员
|
|
</view>
|
|
<view style="font-size: 12px;color: #777;">
|
|
指定配送员后，如遇到配送员拒绝接单，该订单进入抢单大厅
|
|
</view>
|
|
</view>
|
|
<view style="padding: 20px;">
|
|
<view style="display: flex;font-size: 14px;font-weight: bold;line-height: 25px;margin-bottom: 15px;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: 5px; font-size: 12px;">佣金 ￥</text>
|
|
<input type="digit" v-model="customCommission" style="width: 70px; border-bottom: 1px solid #ccc; text-align: center; font-size: 14px; font-weight: normal; height: 25px; min-height: 25px;" placeholder="金额" />
|
|
</view>
|
|
</view>
|
|
<view class="" style="display: flex;font-size: 14px;font-weight: bold;line-height: 25px;">
|
|
<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>
|
|
</view>
|
|
<view class="box1">
|
|
<view style="width: 100%;line-height: 35px;font-size: 14px;font-weight: 700;">
|
|
{{shopItem.shopName || '未知道商家'}}
|
|
</view>
|
|
|
|
<block v-if="!isGroupBuy">
|
|
<view style="display: flex;padding: 10px;background: #eee;border-radius: 10px; margin-bottom:10px;" 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%;">
|
|
X{{cartItem.quantity}}
|
|
</view>
|
|
<view class="pintuan-left-price" style="flex:1;">
|
|
￥{{cartItem.price}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
<block v-else>
|
|
<view style="display: flex;padding: 10px;background: #eee;border-radius: 10px; margin-bottom:10px;" 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%;">
|
|
X1
|
|
</view>
|
|
<view class="pintuan-left-price" style="flex:1;">
|
|
<view style="background: rgba(255, 57, 57, 0.2);padding: 0px 6px;border-radius: 10px;margin-left: 10px;">
|
|
<text>拼团</text>
|
|
<text style="color: red;">￥{{groupItem.groupRule.groupPrice}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</block>
|
|
|
|
<view>
|
|
<view style="height: 40px;line-height: 40px;display: flex;">
|
|
<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: 40px;line-height: 40px;display: flex;" v-if="isPaotui">
|
|
<view style="flex: 1;color: #777;font-weight: 700;">
|
|
配送费 <text v-if="isGroupBuy" style="font-size: 10px;color: #999;">(均摊)</text>
|
|
</view>
|
|
<view style="color: #000;font-weight:700;">
|
|
￥{{deliveryFeeCalc.toFixed(2)}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view
|
|
style="display: flex;height: 40px;line-height: 50px;border-top: 1px solid #eee;font-size: 16px;font-weight: 700;">
|
|
<view style="flex: 1;">
|
|
合计
|
|
</view>
|
|
<view class="">
|
|
￥{{totalAmountCalc.toFixed(2)}}
|
|
</view>
|
|
</view>
|
|
<view style="height:80px;"></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:300px;height:370px;" />
|
|
<img v-if="warnPopup == 'psyj'" @tap="$refs.warnPopup.close()" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/001cf760048b4718bdccd55085bef601.png" alt="填写配送佣金" style="width:300px;height:370px;" />
|
|
<img v-if="warnPopup == 'psy'" @tap="$refs.warnPopup.close()" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/e10ad77ca478413a9c53918750ecb932.png" alt="指定配送员" style="width:300px;height:370px;" />
|
|
</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: [],
|
|
selected: 'buzhiding',
|
|
customCommission: '0',
|
|
shopItem: {},
|
|
cartItems: [],
|
|
groupItem: null,
|
|
isGroupBuy: false,
|
|
isFaceToFace: false,
|
|
assignedWorker: null,
|
|
immediateTimeStr: '',
|
|
totalPackageFee: 0
|
|
}
|
|
},
|
|
components: {
|
|
deliveryTimeOp,
|
|
addressList
|
|
},
|
|
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));
|
|
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) {
|
|
return parseFloat(this.groupItem.groupRule.groupPrice);
|
|
} else {
|
|
return this.cartItems.reduce((acc, curr) => acc + (curr.quantity * parseFloat(curr.price)), 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 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) {
|
|
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 + extra) / members) * 10) / 10;
|
|
} else {
|
|
return Math.ceil((commission / members) * 10) / 10;
|
|
}
|
|
}
|
|
return commission;
|
|
},
|
|
totalAmountCalc() {
|
|
return this.goodsAmountCalc + this.packageFee + this.deliveryFeeCalc;
|
|
}
|
|
},
|
|
onShow() {
|
|
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
|
|
this.initAddress()
|
|
|
|
const now = new Date();
|
|
now.setMinutes(now.getMinutes() + 30);
|
|
this.immediateTimeStr = `${now.getHours().toString().padStart(2, '0')}:${now.getMinutes().toString().padStart(2, '0')}`;
|
|
|
|
// Listen for selected delivery person event
|
|
uni.$on('updateDeliveryWorker', (worker) => {
|
|
this.assignedWorker = worker;
|
|
this.selected = 'zhiding';
|
|
});
|
|
},
|
|
onUnload() {
|
|
uni.$off('updateDeliveryWorker');
|
|
},
|
|
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(){
|
|
if(this.isPaotui && !this.formData.address) {
|
|
this.warnPopup = 'shdz';
|
|
this.$refs.warnPopup.open();
|
|
return;
|
|
}
|
|
|
|
if(this.isPaotui && this.selected === 'buzhiding') {
|
|
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) {
|
|
this.warnPopup = 'psy';
|
|
this.$refs.warnPopup.open();
|
|
return;
|
|
}
|
|
|
|
let items = [];
|
|
if(this.isGroupBuy && this.groupItem) {
|
|
items.push({
|
|
productId: this.groupItem.item.id,
|
|
productName: this.groupItem.item.productName,
|
|
productPicture: this.groupItem.item.productPicture,
|
|
specs: this.getSpecDisplayString(this.groupItem.specs),
|
|
price: parseFloat(this.groupItem.groupRule.groupPrice),
|
|
quantity: 1
|
|
});
|
|
} else {
|
|
for(let cart of this.cartItems) {
|
|
items.push({
|
|
productId: cart.item.id,
|
|
productName: cart.item.productName,
|
|
productPicture: cart.item.productPicture,
|
|
specs: this.getSpecDisplayString(cart.specs),
|
|
price: parseFloat(cart.price),
|
|
quantity: cart.quantity
|
|
});
|
|
}
|
|
}
|
|
|
|
let payload = {
|
|
userId: uni.getStorageSync('id') || 'test-user123',
|
|
shopId: this.shopItem.id,
|
|
orderType: this.isGroupBuy ? 2 : 1,
|
|
deliveryType: this.isPaotui ? 1 : 2,
|
|
totalAmount: this.totalAmountCalc,
|
|
goodsAmount: this.goodsAmountCalc,
|
|
packageFee: this.packageFee,
|
|
addressId: this.isPaotui && this.formData.address ? this.formData.address.id : null,
|
|
getAreaId: this.shopItem.shopArea || null,
|
|
putAreaId: this.isPaotui && this.formData.address ? this.formData.address.areaId : null,
|
|
items: items
|
|
};
|
|
|
|
if(this.isGroupBuy && this.groupItem) {
|
|
payload.groupTargetMembers = parseInt(this.groupItem.groupRule.groupCount);
|
|
payload.groupPrice = parseFloat(this.groupItem.groupRule.groupPrice);
|
|
}
|
|
|
|
if(this.isPaotui) {
|
|
if(this.selected === 'zhiding' && this.assignedWorker) {
|
|
payload.workerId = this.assignedWorker.workerId;
|
|
payload.workerCommission = parseFloat(this.assignedWorker.orderBkge || 0);
|
|
} else {
|
|
payload.workerCommission = parseFloat(this.customCommission || 0); // Default unassigned pool
|
|
}
|
|
}
|
|
|
|
uni.showLoading({ title: '提交中' });
|
|
this.tui.request("/hiver/order/submitMallOrder", "POST", payload, false, false).then(res => {
|
|
uni.hideLoading();
|
|
if(res.code == 200) {
|
|
let orderId = res.result;
|
|
// Simulate successful payment instantly
|
|
this.tui.request(`/hiver/order/payMallOrderSuccess?orderId=${orderId}&workerId=${payload.workerId || ''}`, "POST", {}, false, false).then(res2 => {
|
|
uni.showToast({ title: '支付成功并生成对应详情', icon: 'none' });
|
|
setTimeout(() => {
|
|
uni.navigateBack({ delta: 2 });
|
|
}, 1500);
|
|
});
|
|
} else {
|
|
uni.showToast({ title: res.message || '下单失败', icon: 'none' });
|
|
}
|
|
});
|
|
},
|
|
goDetail(){
|
|
// Pass match conditions to worker list
|
|
let shopArea = this.shopItem.shopArea || '';
|
|
let putArea = this.formData.address ? this.formData.address.areaId : '';
|
|
uni.navigateTo({
|
|
url:`/package1/index/deliveryPersonList?shopAreaId=${shopArea}&putAreaId=${putArea}`
|
|
})
|
|
},
|
|
openAddressBook(){
|
|
this.$refs.bookPopup.open('bottom')
|
|
|
|
},
|
|
checkTime(type){
|
|
if(type == this.formData.isImmediately){
|
|
|
|
}
|
|
this.formData.isImmediately = !this.formData.isImmediately
|
|
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;
|
|
}
|
|
},
|
|
//时间选择器获取时间数据
|
|
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: 55px;
|
|
font-size: 36rpx;
|
|
font-weight: 700;
|
|
flex: 1;
|
|
text-align: center;
|
|
}
|
|
|
|
.tab1 {
|
|
width: 100%;
|
|
height: 80px;
|
|
position: relative;
|
|
|
|
img {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-size: 100%;
|
|
}
|
|
}
|
|
|
|
.box1 {
|
|
width: 95%;
|
|
margin: 0 auto 10px;
|
|
background: #fff;
|
|
border-radius: 10px;
|
|
padding: 10px;
|
|
}
|
|
|
|
.goods-img {
|
|
width: 160rpx;
|
|
height: 160rpx;
|
|
position: relative;
|
|
|
|
img {
|
|
width: 100%;
|
|
background-size: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.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: 28px;
|
|
color: #777;
|
|
}
|
|
.address-box{
|
|
background: #fff;
|
|
height: 40px;
|
|
line-height: 40px;
|
|
font-size: 16px;
|
|
font-weight: 700;
|
|
padding: 0 20px;
|
|
}
|
|
.time-box{
|
|
background: #fff;
|
|
display: flex;
|
|
height: 70px;
|
|
padding: 10px;
|
|
}
|
|
.time1{
|
|
height: 50px;
|
|
flex: 1;
|
|
border-radius: 10px;
|
|
text-align: center;
|
|
margin: 0 5px 0 10px;
|
|
line-height: 20px;
|
|
padding-top: 5px;
|
|
}
|
|
.radio-check {
|
|
background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));
|
|
width: 24px;
|
|
height: 24px;
|
|
border-radius: 24px;
|
|
text-align: center;
|
|
line-height: 24px;
|
|
margin: 0 10px 0 0;
|
|
}
|
|
|
|
.radio-no-check {
|
|
width: 24px;
|
|
height: 24px;
|
|
border-radius: 24px;
|
|
border: 1px solid #eee;
|
|
margin: 0 10px 0 0;
|
|
}
|
|
.buy-bottom {
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 150rpx;
|
|
display: flex;
|
|
background: #fff;
|
|
z-index: 99;
|
|
box-shadow: 0 -10px 15px rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
.bottom-btn {
|
|
width: 90%;
|
|
height: 50px;
|
|
background: linear-gradient(90deg, #e3ff96, #a6ffea);
|
|
font-size: 13px;
|
|
font-weight: 700;
|
|
line-height: 50px;
|
|
text-align: center;
|
|
border-radius: 50px;
|
|
margin: 10px auto;
|
|
}
|
|
.ziqu-box{
|
|
background: #eee;
|
|
width: 90%;
|
|
margin: 0 auto;
|
|
border-radius: 10px;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
.ziqu-xuanfu{
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
padding: 5px 10px;
|
|
background: rgba(166, 255, 234, 1);
|
|
border-top-right-radius: 10px;
|
|
border-bottom-left-radius: 10px;
|
|
font-weight: 700;
|
|
font-size: 10px;
|
|
}
|
|
.ziqu-address{
|
|
display: flex;
|
|
height: 50px;
|
|
background: #fff;
|
|
width: 90%;
|
|
border-radius: 10px;
|
|
font-size: 13px;
|
|
margin: 30px auto 0;
|
|
font-weight: bold;
|
|
line-height: 50px;
|
|
img{
|
|
width: 20px;
|
|
height: 20px;
|
|
margin: 15px 10px 0 15px;
|
|
}
|
|
}
|
|
.ziqu-time-box{
|
|
width: 90%;
|
|
margin: 10px auto;
|
|
display: flex;
|
|
font-weight: 700;
|
|
}
|
|
.ziqu-call-box{
|
|
width: 90%;
|
|
display: flex;
|
|
height: 35px;
|
|
line-height: 35px;
|
|
margin: 0 auto 10px;
|
|
}
|
|
.ziqu-call{
|
|
flex: 1;
|
|
}
|
|
.book-popup-content{
|
|
position: relative;
|
|
height: 600px;
|
|
width: 100%;
|
|
padding: 10px;
|
|
overflow: scroll;
|
|
}
|
|
</style>
|
|
|