上传代码
This commit is contained in:
195
uniapp04/pages/goToPay/distributionBox.vue
Normal file
195
uniapp04/pages/goToPay/distributionBox.vue
Normal file
@ -0,0 +1,195 @@
|
||||
<template>
|
||||
<uni-popup ref="popup" type="bottom">
|
||||
<view class="pBoxUp">
|
||||
<view class="textCenter f32 psTitle border-bottom">
|
||||
请选择配送时间
|
||||
</view>
|
||||
<view class="shopPopup bgff justify-between default-flex">
|
||||
<view class="f30 t666 lBox">
|
||||
<view v-for="(item, index) in jmhDay" @click="selectLDate(item)" :class="sLDate === item.formatDate ? 'ed' : ''" class="boxLDate" :key="index">
|
||||
{{ item.desc }}({{ item.name }})
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<view v-for="(item, index) in timeList" @click="selectRDate(item)" :class="[sRightDate === item.time ? 'ed' : '', item.disabled ? 'disabled' : '']" :key="index" class="rBox">
|
||||
{{ item.time }}{{ item.disabled ? ' (超出配送时间)' : '' }}
|
||||
</view>
|
||||
<view class="empty f28 text-center" style="color: #999;margin-top: 40rpx;" v-if="timeList.length < 1">
|
||||
今天没有时间了,看看明天吧
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cancelButton" @click="close()">
|
||||
取消
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDate } from './utils.js';
|
||||
|
||||
export default {
|
||||
name: "distributionBox",
|
||||
props: {
|
||||
getTime: String // 接收父组件传来的初始值
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
sendTime: '',
|
||||
sRightDate: '',
|
||||
sLDate: '',
|
||||
jmhDay: [],
|
||||
timeList: [
|
||||
{ disabled: false, time: '10:00-12:00', id: 1 },
|
||||
{ disabled: false, time: '12:00-14:00', id: 2 },
|
||||
{ disabled: false, time: '14:00-16:00', id: 3 },
|
||||
{ disabled: false, time: '16:00-18:00', id: 4 },
|
||||
{ disabled: false, time: '18:00-20:00', id: 5 }
|
||||
]
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.getNextDay();
|
||||
},
|
||||
methods: {
|
||||
close() {
|
||||
this.$refs.popup.close();
|
||||
},
|
||||
getWeekDate(day) {
|
||||
const weeks = ["周日", "周一", "周二", "周三", "周四", "周五", "周六"];
|
||||
return weeks[day];
|
||||
},
|
||||
getNextDay() {
|
||||
const day = this.getWeekDate(new Date().getDay());
|
||||
const isDay = getDate().fullDate;
|
||||
const nextDay = this.getWeekDate(new Date(new Date().getTime() + 24 * 60 * 60 * 1000).getDay());
|
||||
const nDate = getDate(new Date(new Date().getTime() + 24 * 60 * 60 * 1000)).fullDate;
|
||||
const HDay = this.getWeekDate(new Date(new Date().getTime() + 48 * 60 * 60 * 1000).getDay());
|
||||
const hDate = getDate(new Date(new Date().getTime() + 48 * 60 * 60 * 1000)).fullDate;
|
||||
const d1 = hDate.substr(hDate.indexOf('-') + 1);
|
||||
this.sLDate = isDay;
|
||||
this.selectLDate(1);
|
||||
this.jmhDay = [
|
||||
{ name: day, id: 1, formatDate: isDay, desc: '今天' },
|
||||
{ name: nextDay, id: 2, formatDate: nDate, desc: '明天' },
|
||||
{ name: HDay, id: 3, formatDate: hDate, desc: d1.substr(0, d1.indexOf('-')) + '月' + d1.substr(d1.indexOf('-') + 1) + '日' }
|
||||
];
|
||||
},
|
||||
showBox() {
|
||||
this.$refs.popup.open();
|
||||
},
|
||||
selectRDate(item) {
|
||||
if (item.disabled) {
|
||||
return;
|
||||
}
|
||||
this.sRightDate = item.time;
|
||||
this.sendTime = `${this.sLDate} ${item.time}`;
|
||||
this.$emit('update:getTime', this.sendTime); // 更新父组件的 sendTime
|
||||
this.$emit('timeSelected', this.sendTime); // 新增:通知父组件已选择的时间
|
||||
this.$refs.popup.close();
|
||||
},
|
||||
selectLDate(val) {
|
||||
if (val !== 1) {
|
||||
this.sLDate = val.formatDate;
|
||||
}
|
||||
let t = [
|
||||
{ disabled: false, time: '10:00-12:00', id: 1 },
|
||||
{ disabled: false, time: '12:00-14:00', id: 2 },
|
||||
{ disabled: false, time: '14:00-16:00', id: 3 },
|
||||
{ disabled: false, time: '16:00-18:00', id: 4 },
|
||||
{ disabled: false, time: '18:00-20:00', id: 5 }
|
||||
];
|
||||
if (val.desc === '今天' || val === 1) {
|
||||
const currentHour = new Date().getHours();
|
||||
if (currentHour <= 10) {
|
||||
this.timeList = t;
|
||||
} else if (currentHour <= 12) {
|
||||
t[0].disabled = true;
|
||||
this.timeList = t;
|
||||
} else if (currentHour <= 14) {
|
||||
t[0].disabled = true;
|
||||
t[1].disabled = true;
|
||||
this.timeList = t;
|
||||
} else if (currentHour <= 16) {
|
||||
t[0].disabled = true;
|
||||
t[1].disabled = true;
|
||||
t[2].disabled = true;
|
||||
this.timeList = t;
|
||||
} else if (currentHour <= 18) {
|
||||
t[0].disabled = true;
|
||||
t[1].disabled = true;
|
||||
t[2].disabled = true;
|
||||
t[3].disabled = true;
|
||||
this.timeList = t;
|
||||
} else if (currentHour <= 20) {
|
||||
t[0].disabled = true;
|
||||
t[1].disabled = true;
|
||||
t[2].disabled = true;
|
||||
t[3].disabled = true;
|
||||
t[4].disabled = true;
|
||||
this.timeList = t;
|
||||
}
|
||||
} else {
|
||||
this.timeList = t;
|
||||
}
|
||||
this.sRightDate = '';
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.pBoxUp{
|
||||
background: #f5f5f5;
|
||||
.psTitle{
|
||||
line-height: 100rpx;
|
||||
text-align: center;
|
||||
border-bottom: 1rpx solid #f7f7f7;
|
||||
}
|
||||
.shopPopup{
|
||||
backgound:#ffffff;
|
||||
font-size: 32rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.boxLDate{
|
||||
font-size: 24rpx;
|
||||
height:80rpx;
|
||||
line-height: 80rpx;
|
||||
width:273rpx;
|
||||
text-align: center;
|
||||
}
|
||||
.lBox{
|
||||
color:#666666;
|
||||
background: #f5f5f5;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.boxLDate.ed{
|
||||
color:#1DA337;
|
||||
background: #fff;
|
||||
}
|
||||
.rBox.ed{
|
||||
color:#1DA337;
|
||||
}
|
||||
.rBox{
|
||||
width: 239px;
|
||||
padding-left: 20rpx;
|
||||
font-size: 24rpx;
|
||||
color: #333;
|
||||
height:80rpx;
|
||||
background: #fff;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
.cancelButton{
|
||||
font-size: 36rpx;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
border-top: 1px solid #e5e5e5;
|
||||
background: #FFF;
|
||||
}
|
||||
}
|
||||
</style>
|
644
uniapp04/pages/goToPay/goToPay.vue
Normal file
644
uniapp04/pages/goToPay/goToPay.vue
Normal file
@ -0,0 +1,644 @@
|
||||
<template>
|
||||
<view class="notice">
|
||||
<uni-notice-bar show-icon scrollable text="3分钟内未支付,订单将自动取消" />
|
||||
</view>
|
||||
<view class="order-page">
|
||||
<view class="header">
|
||||
<view class="status" :id="statusId">
|
||||
待支付,剩余{{ formattedTime }}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="order-summary">
|
||||
<view class="order-info">
|
||||
<view class="uni-px-5 uni-pb-5">
|
||||
<uni-data-checkbox v-model="radio1" :localdata="sex"></uni-data-checkbox>
|
||||
</view>
|
||||
<!-- <text><uni-tag :inverted="true" text="确认订单" type="primary" @click="submitOrder" /></text> -->
|
||||
</view>
|
||||
<view class="address" v-if="radio1 === 2">
|
||||
<picker @change="bindPickerChange" :value="index" :range="array">
|
||||
<view class="uni-input">地址:{{selectedApartmentName ? selectedApartmentName : '请选择公寓'}}</view>
|
||||
</picker>
|
||||
<!-- 时间 -->
|
||||
<template class="time-picker">
|
||||
<view class="align-center justify-between default-flex secondBox" @click="showTime">
|
||||
<view class="default-flex align-center">
|
||||
<view class="t666 f28">
|
||||
配送时间:
|
||||
</view>
|
||||
</view>
|
||||
<view class="tDesc">
|
||||
<view class="sTime">{{ sendTime || '请选择配送时间' }}</view>
|
||||
<view class="bj">
|
||||
<img src="https://yujia-shanghai-bucket.oss-cn-shanghai.aliyuncs.com/small-program/yvmuShop/timeEdit.png"
|
||||
alt="">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<distribution-box ref="dsbonBox" :get-time.sync="sendTime"
|
||||
@timeSelected="handleTimeSelected"></distribution-box>
|
||||
</template>
|
||||
</view>
|
||||
<view class="pay-button" @click="submitOrder">
|
||||
去支付
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-options">
|
||||
<!-- <view class="option">
|
||||
<uni-icons type="calendar-filled" size="30"></uni-icons>
|
||||
<text>找人付</text>
|
||||
</view>
|
||||
<view class="option">
|
||||
<uni-icons type="calendar-filled" size="30"></uni-icons>
|
||||
<text>改订单信息</text>
|
||||
</view>
|
||||
<view class="option" @click="closeOrder">
|
||||
<uni-icons type="calendar-filled" size="30"></uni-icons>
|
||||
<text>取消订单</text>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="order-items">
|
||||
<view class="businessDetail">
|
||||
<image class="item-image" :src="orderItem.businessVO?.businessImages"></image>
|
||||
{{orderItem.businessVO?.businessName}}
|
||||
</view>
|
||||
<view class="order-item" v-for="item in orderItem.orderDetailsVOList">
|
||||
<image class="item-image" :src="item.dishesVO.dishesImage"></image>
|
||||
<view class="item-info">
|
||||
<view class="item-name">{{item.dishesVO.dishesName}}</view>
|
||||
<view class="item-description">{{item.quantity}}×{{item.dishesVO.dishesName}}</view>
|
||||
<view class="item-price">¥{{item.dishesVO.dishesPrice}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="total" v-if="radio1===1||radio1===2">
|
||||
<text>打包费</text>
|
||||
<text>¥1</text>
|
||||
</view>
|
||||
<view class="total" v-if="radio1 === 2">
|
||||
<text>配送费</text>
|
||||
<text>¥1.7</text>
|
||||
</view>
|
||||
<view class="total">
|
||||
<text>实付款</text>
|
||||
<text v-if="radio1 === 0">¥{{orderItem.totalPrice}}</text>
|
||||
<text v-if="radio1 === 1">¥{{orderItem.totalPrice + 1}}</text>
|
||||
<text v-if="radio1 === 2">¥{{orderItem.totalPrice + 1 + 1.7}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-details">
|
||||
<view class="detail">
|
||||
<text>备注</text>
|
||||
<text @click="goToRemark">{{ orderItem.notes ? orderItem.notes : '去备注' }}</text>
|
||||
</view>
|
||||
<view class="detail">
|
||||
<text>手机号</text>
|
||||
<text>{{orderItem.phone}}</text>
|
||||
</view>
|
||||
<view class="detail">
|
||||
<text>发票信息</text>
|
||||
<text>暂不支持</text>
|
||||
</view>
|
||||
<view class="detail">
|
||||
<text>订单号码</text>
|
||||
<text>{{orderItem.pickupCode}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onMounted,
|
||||
onActivated,
|
||||
ref
|
||||
} from 'vue'
|
||||
import DistributionBox from './distributionBox.vue';
|
||||
import {
|
||||
apiImageUrl
|
||||
} from '../../API/api'
|
||||
import {
|
||||
onLoad,
|
||||
onUnload
|
||||
} from '@dcloudio/uni-app';
|
||||
|
||||
onUnload(() => {
|
||||
uni.reLaunch({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
});
|
||||
|
||||
const radio1 = ref(0);
|
||||
const statusId = ref(null);
|
||||
const array = ref(['1公寓', '2公寓', '3公寓', '4公寓', '5公寓', '6公寓', '7公寓', '8公寓', '9公寓', '10公寓', '11公寓', '12公寓', '育才大厦']);
|
||||
const index = ref(0);
|
||||
const sex = ref([{
|
||||
text: '堂食',
|
||||
value: 0
|
||||
},
|
||||
{
|
||||
text: '自提',
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
text: '跑腿',
|
||||
value: 2
|
||||
}
|
||||
]);
|
||||
|
||||
function bindPickerChange(e) {
|
||||
const selectedIndex = e.detail.value;
|
||||
console.log('picker发送选择改变,携带值为', selectedIndex);
|
||||
index.value = selectedIndex;
|
||||
const selectedApartment = array.value[selectedIndex];
|
||||
console.log('您选择了:', selectedApartment);
|
||||
selectedApartmentName.value = selectedApartment; // 存储所选公寓名称
|
||||
}
|
||||
const selectedApartmentName = ref('');
|
||||
uni.$on('updateRemark', (newRemark) => {
|
||||
orderItem.value.notes = newRemark;
|
||||
});
|
||||
|
||||
const orderItem = ref(null);
|
||||
const getOrder = () => {
|
||||
const notPay = uni.getStorageSync("notPay")
|
||||
uni.request({
|
||||
url: apiImageUrl + '/api/orders/get/my',
|
||||
method: 'GET',
|
||||
data: {
|
||||
id: notPay
|
||||
//id:133
|
||||
},
|
||||
header: {
|
||||
'Content-Type': 'application/json', // 确保设置正确的 Content-Type
|
||||
'cookie': uni.getStorageSync("cookie") || ''
|
||||
},
|
||||
success(res) {
|
||||
console.log("获取订单成功");
|
||||
if (res.data && res.data.data) {
|
||||
// 更新响应式变量
|
||||
orderItem.value = res.data.data;
|
||||
console.log(orderItem.value);
|
||||
// 根据 orderItem.pickupMethod 设置 radio1 的值
|
||||
if (orderItem.value.pickupMethod !== undefined) {
|
||||
radio1.value = orderItem.value.pickupMethod;
|
||||
}
|
||||
}
|
||||
},
|
||||
fail() {
|
||||
console.log("获取订单失败");
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
const isoStart = ref('');
|
||||
const isoEnd = ref('');
|
||||
|
||||
const submitOrder = () => {
|
||||
console.log("我选择的radio1的值:", radio1.value,
|
||||
"我选择的公寓:", selectedApartmentName.value,
|
||||
"我选择的时间:", sendTime.value);
|
||||
|
||||
const notPay = uni.getStorageSync("notPay");
|
||||
|
||||
uni.request({
|
||||
url: `${apiImageUrl}/api/orders/updateOrder`,
|
||||
method: 'POST',
|
||||
data: {
|
||||
location: selectedApartmentName.value,
|
||||
notes: orderItem.value?.notes || "", // 使用订单中的备注,如果不存在则为空字符串
|
||||
orderId: notPay,
|
||||
pickupMethod: radio1.value, // 使用当前选中的配送方式
|
||||
pickupStartTime: isoStart.value, // 注意这里使用的是 .value
|
||||
pickupEndTime: isoEnd.value, // 注意这里使用的是 .value
|
||||
},
|
||||
header: {
|
||||
'Content-Type': 'application/json', // 确保设置正确的 Content-Type
|
||||
'cookie': uni.getStorageSync("cookie") || ''
|
||||
},
|
||||
success(res) {
|
||||
console.log("更新订单", res); // 确保这里可以打印出 res
|
||||
orderItem.value.pickupMethod = radio1.value;
|
||||
if(res.data.code===0){
|
||||
goToPayment()
|
||||
}else {
|
||||
uni.showToast({
|
||||
title:'支付失败'
|
||||
})
|
||||
}
|
||||
},
|
||||
fail(err) {
|
||||
console.log("更新订单失败", err);
|
||||
}
|
||||
});
|
||||
};
|
||||
onMounted(() => {
|
||||
getOrder();
|
||||
});
|
||||
|
||||
onActivated(() => {
|
||||
getOrder();
|
||||
});
|
||||
|
||||
const goToPayment = () => {
|
||||
const notPay = uni.getStorageSync("notPay")
|
||||
my.request({
|
||||
url: apiImageUrl + '/api/Alipay/payment/create',
|
||||
method: 'GET',
|
||||
data: {
|
||||
id: notPay
|
||||
},
|
||||
header: {
|
||||
'Content-Type': 'application/json',
|
||||
'cookie': uni.getStorageSync("cookie") || ''
|
||||
},
|
||||
success: function(result) {
|
||||
console.log("reasaaaaaaaaaa");
|
||||
console.log(result);
|
||||
console.log("tradeNo的值为:");
|
||||
console.log(result.data.data);
|
||||
my.tradePay({
|
||||
tradeNO: result.data.data,
|
||||
success: (res) => {
|
||||
console.log('成功调用')
|
||||
console.log(res);
|
||||
if (res.resultCode == 9000) {
|
||||
uni.setStorageSync('orderId', notPay);
|
||||
uni.navigateTo({
|
||||
url: '/pages/testFive/testFive'
|
||||
});
|
||||
uni.removeStorageSync('cartItems');
|
||||
}
|
||||
|
||||
},
|
||||
fail: (res) => {
|
||||
my.alert({
|
||||
content: JSON.stringify(res),
|
||||
})
|
||||
console.log('失败');
|
||||
console.log(res);
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 时间戳
|
||||
const orderCreateTime = Date.now();
|
||||
const paymentTimeout = 3 * 60 * 1000; // 15分钟转换为毫秒
|
||||
|
||||
// 更新剩余时间的函数
|
||||
const updateTimer = () => {
|
||||
const elapsedTime = Date.now() - orderCreateTime;
|
||||
if (elapsedTime > paymentTimeout) {
|
||||
console.log('超时啦');
|
||||
clearInterval(intervalId); // 清除定时器
|
||||
formattedTime.value = '已超时';
|
||||
} else {
|
||||
const remainingTime = paymentTimeout - elapsedTime;
|
||||
const minutes = Math.floor((remainingTime % (1000 * 60 * 60)) / (1000 * 60));
|
||||
const seconds = Math.floor((remainingTime % (1000 * 60)) / 1000);
|
||||
formattedTime.value = `待支付,${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
|
||||
}
|
||||
};
|
||||
|
||||
const computed = {
|
||||
statusId() {
|
||||
// Logic to compute statusId
|
||||
return someValue;
|
||||
}
|
||||
};
|
||||
|
||||
// 响应式数据
|
||||
const formattedTime = ref('待支付,剩余14:48');
|
||||
const intervalId = ref(null);
|
||||
|
||||
// 设置一个每秒更新一次的定时器
|
||||
onMounted(() => {
|
||||
intervalId.value = setInterval(updateTimer, 1000);
|
||||
updateTimer(); // 立即执行一次以显示正确的初始时间
|
||||
});
|
||||
|
||||
// 设置一个15分钟后触发的超时处理
|
||||
setTimeout(() => {
|
||||
if (!formattedTime.value.includes('已超时')) {
|
||||
console.log('超时啦');
|
||||
clearInterval(intervalId.value); // 清除定时器
|
||||
uni.showToast({
|
||||
title: '支付已超时',
|
||||
duration: 2000
|
||||
})
|
||||
const orderItemId = orderItem.value.id
|
||||
const tradeNo = uni.getStorageSync("tradeNo");
|
||||
uni.request({
|
||||
url: apiImageUrl + '/api/Alipay/test/close',
|
||||
method: 'GET',
|
||||
data: {
|
||||
orderId: orderItemId,
|
||||
out_trade_no: tradeNo
|
||||
},
|
||||
success(res) {
|
||||
console.log("成功");
|
||||
console.log(res);
|
||||
},
|
||||
fail() {
|
||||
console.log("失败");
|
||||
}
|
||||
});
|
||||
// uni.reLaunch({
|
||||
// url:'/pages/index/index'
|
||||
// })
|
||||
uni.showToast({
|
||||
title: '订单超时,已为您自动取消喽',
|
||||
duration: 2000
|
||||
})
|
||||
formattedTime.value = '已超时';
|
||||
}
|
||||
}, paymentTimeout);
|
||||
|
||||
const closeOrder = () => {
|
||||
const orderItemId = orderItem.value.id
|
||||
const tradeNo = uni.getStorageSync("tradeNo");
|
||||
uni.request({
|
||||
url: apiImageUrl + '/api/Alipay/test/close',
|
||||
method: 'GET',
|
||||
data: {
|
||||
orderId: orderItemId,
|
||||
out_trade_no: tradeNo
|
||||
},
|
||||
success(res) {
|
||||
console.log("成功");
|
||||
console.log(res);
|
||||
},
|
||||
fail() {
|
||||
console.log("失败");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const goToRemark = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/goToRemark/goToRemark'
|
||||
})
|
||||
}
|
||||
const sendTime = ref('');
|
||||
const dsbonBox = ref(null);
|
||||
|
||||
const showTime = () => {
|
||||
if (dsbonBox.value) {
|
||||
dsbonBox.value.showBox();
|
||||
}
|
||||
};
|
||||
|
||||
const handleTimeSelected = (time) => {
|
||||
console.log('Selected Time:', time);
|
||||
|
||||
const [date, duration] = time.split(' ');
|
||||
const [startHour, endHour] = duration.split('-');
|
||||
|
||||
// 修改:移除时区部分
|
||||
isoStart.value = `${date}T${startHour}:00`; // 原格式含+08:00
|
||||
isoEnd.value = `${date}T${endHour}:00`; // 现改为纯时间格式
|
||||
|
||||
console.log('Start Time:', isoStart.value);
|
||||
console.log('End Time:', isoEnd.value);
|
||||
|
||||
sendTime.value = time;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.order-page {
|
||||
background-color: #f5f5f5;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.back-button,
|
||||
.customer-service {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.status {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.address {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
color: #666;
|
||||
padding-bottom: 10px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.notice {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.order-summary {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.order-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.time-picker {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.pay-button {
|
||||
background-color: #007bff;
|
||||
color: #fff;
|
||||
padding: 10px 0px;
|
||||
border-radius: 20px;
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
// ceshi
|
||||
position: relative;
|
||||
/* 确保按钮定位上下文 */
|
||||
z-index: 1;
|
||||
/* 设置较高的z-index值,确保按钮始终位于顶部 */
|
||||
margin-top: 40px;
|
||||
/* 如果需要,增加上边距避免与其他元素重叠 */
|
||||
}
|
||||
|
||||
.order-options {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.option {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.businessDetail {
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.order-items {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.item image {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.item-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.total {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.order-details {
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.detail {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
|
||||
/* */
|
||||
.order-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.item-image {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
|
||||
.item-info {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.item-name {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.item-description {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.item-price {
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.uni-px-5 {
|
||||
padding-left: 10px;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.uni-pb-5 {
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.button-update {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background-color: pink;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
/* 时间选择器 */
|
||||
.bgff {
|
||||
background-color: pink;
|
||||
}
|
||||
|
||||
.justify-between {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.default-flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.align-center {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.mr-2 {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.secondBox {
|
||||
padding: 30rpx 0rpx 0rpx 0rpx;
|
||||
|
||||
.lImg {
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
}
|
||||
|
||||
.bj {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
}
|
||||
|
||||
.tDesc {
|
||||
font-size: 28rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #666;
|
||||
|
||||
.sTime {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
22
uniapp04/pages/goToPay/utils.js
Normal file
22
uniapp04/pages/goToPay/utils.js
Normal file
@ -0,0 +1,22 @@
|
||||
//utils.js
|
||||
|
||||
export function getDate(date, AddDayCount = 0) {
|
||||
if (!date) {
|
||||
date = new Date()
|
||||
}
|
||||
if (typeof date !== 'object'){
|
||||
date = date.replace(/-/g, '/')
|
||||
}
|
||||
const dd = new Date(date)
|
||||
dd.setDate(dd.getDate() + AddDayCount) // 获取AddDayCount天后的日期
|
||||
const y = dd.getFullYear()
|
||||
const m = dd.getMonth() + 1 < 10 ? '0' + (dd.getMonth() + 1) : dd.getMonth() + 1 // 获取当前月份的日期,不足10补0
|
||||
const d = dd.getDate() < 10 ? '0' + dd.getDate() : dd.getDate() // 获取当前几号,不足10补0
|
||||
return {
|
||||
fullDate: y + '-' + m + '-' + d,
|
||||
year: y,
|
||||
month: m,
|
||||
date: d,
|
||||
day: dd.getDay()
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user