1158 lines
25 KiB
Vue
1158 lines
25 KiB
Vue
<template>
|
|
<view class="">
|
|
<view class="margin-tb-sm bg-white padding">
|
|
<view class="flex justify-between align-center">
|
|
<view class="flex align-center">
|
|
<image src="../../../static/tabbar/index.png" style="width: 40rpx;height: 37rpx;" mode=""></image>
|
|
<view class="text-xl text-bold text-black margin-lr-xs">{{goodsShop.shopName}}</view>
|
|
|
|
|
|
|
|
<!-- <image src="../../../static/images/index/right.png" style="width: 14rpx;height: 24rpx;" mode=""></image> -->
|
|
</view>
|
|
<view class="flex Switch ">
|
|
<view @click="tabSwidth(1)" :class="orderType==1?'selSwitch':''">自取</view>
|
|
<view @click="tabSwidth(2)" :class="orderType==2?'selSwitch':''">外卖</view>
|
|
</view>
|
|
</view>
|
|
<view style="font-size: 20upx;color: #FF130A;margin-top: 10rpx;">
|
|
<view>加入购物车就可以拼单哦拼单人购物车有商品先清空再添加</view>
|
|
</view>
|
|
<!-- <view class="text-gray">距离您16km</view> -->
|
|
<view class="flex justify-between margin-top">
|
|
<view class="btn1" @click="cancel()">取消拼单</view>
|
|
|
|
<button class="btn" open-type="share">分享好友</button>
|
|
</view>
|
|
</view>
|
|
<view v-if="myGoodList.length" class="margin-tb-sm bg-white padding">
|
|
<view class="flex justify-between align-center padding-bottom">
|
|
<image :src="myGoodList[0].avatar" mode="" style="width: 48rpx;height: 48rpx;border-radius: 48rpx;">
|
|
</image>
|
|
<view class="flex align-center flex-sub margin-left-sm">
|
|
<view class="text-black text-lg text-bold">{{myGoodList[0].nickName}}</view>
|
|
<!-- <view class="margin-left-sm">我自己</view> -->
|
|
</view>
|
|
<view class="flex">
|
|
<view class="sBtn1" @click="clear()" v-if="userId == myGoodList[0].userId">清空</view>
|
|
<view class="sBtn2" @click="goGoodsList" v-if="userId == myGoodList[0].userId">去点餐</view>
|
|
<!-- <view class="sBtn2" @click="goGoodsList">修改订单</view> -->
|
|
</view>
|
|
</view>
|
|
<u-line color="#E6E6E6" />
|
|
<view class="padding-top" v-for="(item,index) in myGoodList" :key='index'>
|
|
<view class="flex justify-between">
|
|
<view class="text-black text-lg text-bold">{{item.goodsName}}</view>
|
|
<view v-if="item.skuMessage">{{item.skuMessage}}</view>
|
|
<view class="text-lg text-gray"><text class="text-sm">x</text>{{item.goodsNum}}</view>
|
|
</view>
|
|
<view v-if="index==(myGoodList.length-1)" class="flex justify-between margin-top-sm ">
|
|
<view class="text-gray">总计</view>
|
|
<view class="text-lg text-black text-bold"><text class="text-sm">¥</text>{{item.goodsPrice}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view v-if="otherGoodList.length>0" v-for="(orders,index) in otherGoodList" :key='index'>
|
|
<view v-if="(index!=0 && orders.userId!=otherGoodList[index-1].userId) || index==0"
|
|
class="margin-tb-sm bg-white padding">
|
|
<view class="flex justify-between align-center padding-bottom">
|
|
<image :src="orders.avatar" style="width: 48rpx;height: 48rpx;border-radius: 48rpx;"></image>
|
|
<view class="flex align-center flex-sub margin-left-sm">
|
|
<view class="text-black text-lg text-bold">{{orders.nickName}}</view>
|
|
|
|
</view>
|
|
<view class="flex">
|
|
|
|
<view class="sBtn3" @click="goGoodsList" v-if="userId == orders.userId">去点餐</view>
|
|
</view>
|
|
</view>
|
|
<u-line color="#E6E6E6" />
|
|
<view v-for="(item,index) in otherGoodList" :key='index'>
|
|
<view class="padding-top" v-if="item.userId==orders.userId">
|
|
<view class="flex justify-between">
|
|
<view class="text-black text-lg text-bold">{{item.goodsName}}</view>
|
|
<view v-if="item.skuMessage">{{item.skuMessage}}</view>
|
|
<view class="text-lg text-gray"><text class="text-sm">x</text>{{item.goodsNum}}</view>
|
|
</view>
|
|
<view v-if="item.userId!=otherGoodList[index+1].userId"
|
|
class="flex justify-between margin-top-sm ">
|
|
<view class="text-gray">总计</view>
|
|
<view class="text-lg text-black text-bold"><text class="text-sm">¥</text>{{item.goodsPrice}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<empty v-if="!myGoodList.length && !otherGoodList.length" content='暂无商品'></empty>
|
|
|
|
<view style="height: 100rpx;"></view>
|
|
<!-- 结算 -->
|
|
|
|
|
|
<!-- 结算 -->
|
|
<view class="settlement" @click="isPopupShow">
|
|
<view class="settlement_img">
|
|
<image src="../../../static/images/index/diancan.png" mode=""></image>
|
|
<view class="settlement_hot">{{number}}</view>
|
|
</view>
|
|
<view class="settlement_le">
|
|
<text>￥</text>{{totalPrice}}
|
|
</view>
|
|
<view class="settlement_ri" @click.stop="goConfirm()">去结算</view>
|
|
</view>
|
|
<!-- 购物车弹窗 -->
|
|
<u-popup v-model="popupShow" mode="bottom" border-radius="20">
|
|
<view class="padding">
|
|
<view class="flex justify-between align-center margin-bottom-sm">
|
|
<view class="text-bold text-black text-df">拼单餐品</view>
|
|
<view class="flex align-center">
|
|
<image src="../../../static/images/index/delete.png" style="width: 28rpx;height: 31rpx;"
|
|
mode=""></image>
|
|
<text class="margin-left-xs" @click="cancel">取消拼单</text>
|
|
</view>
|
|
</view>
|
|
<scroll-view scroll-y='true' class="popup">
|
|
<view v-for="(item,ind) in goodsList.orderGoodsList[0]" :key='ind'>
|
|
<view class="flex align-center margin-tb-sm">
|
|
<image :src="item.goodsPicture[0]" style="width: 96rpx;height: 96rpx;border-radius: 10rpx;">
|
|
</image>
|
|
<view class="margin-left-sm">
|
|
<view>{{item.goodsName}}</view>
|
|
<view v-if="item.skuMessage">{{item.skuMessage}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex justify-between align-center">
|
|
<view class="text-bold text-sm">¥<text class="text-lg">{{item.goodsPrice}}</text>
|
|
</view>
|
|
<view class="flex align-center justify-between">
|
|
<view @click.stop="noAdd(item,ind)">
|
|
<image src="../../../static/images/index/jian.png"
|
|
style="width: 54rpx;height: 54rpx;"></image>
|
|
</view>
|
|
<view class="text-center margin-lr-xs">{{item.goodsNum}}</view>
|
|
<view @click.stop="add(item,ind)">
|
|
<image src="../../../static/images/index/add.png"
|
|
style="width: 50rpx;height: 50rpx;"></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
<view class="settlement1 margin-top-lg">
|
|
<view class="settlement_img">
|
|
<image src="../../../static/images/index/diancan.png" mode=""></image>
|
|
<view class="settlement_hot">{{number}}</view>
|
|
</view>
|
|
<view class="settlement_le">
|
|
<text>￥</text>{{totalPrice}}
|
|
</view>
|
|
<view class="settlement_ri" @click.stop="goConfirm()">去结算</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import empty from '@/components/empty.vue'
|
|
export default {
|
|
components: {
|
|
empty
|
|
},
|
|
onShareAppMessage(res) { //发送给朋友
|
|
return {
|
|
title: '快来和我一起拼个单吧！',
|
|
path: '/pages/index/index?shopId=' + this.shopId + '&orderId=' + this.orderId,
|
|
imageUrl: this.tuiguangImg,
|
|
}
|
|
},
|
|
onShareTimeline(res) { //分享到朋友圈
|
|
return {
|
|
title: "快来和我一起拼个单吧！",
|
|
path: '/pages/index/index?shopId=' + this.shopId + '&orderId=' + this.orderId,
|
|
imageUrl: this.tuiguangImg,
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
orderType: 2,
|
|
shopId: '',
|
|
tuiguangImg: '',
|
|
goodsNum: 0,
|
|
totalPrice: 0,
|
|
orderId: '',
|
|
otherGoodList: [],
|
|
myGoodList: [],
|
|
goodsList: [],
|
|
userId: '',
|
|
popupShow: false,
|
|
goodsShop: {},
|
|
number: 0,
|
|
}
|
|
},
|
|
onLoad(e) {
|
|
this.shopId = e.shopId
|
|
this.orderId = e.orderId ? e.orderId : uni.getStorageSync('orderId')
|
|
this.userId = uni.getStorageSync('userId')
|
|
},
|
|
onShow() {
|
|
this.getOrderDetail();
|
|
this.getGoodList()
|
|
this.$Request.getT('/app/common/type/238').then(res => {
|
|
if (res.code === 0) {
|
|
this.tuiguangImg = res.data.value;
|
|
}
|
|
});
|
|
},
|
|
methods: {
|
|
// 添加数量
|
|
add(item, index) {
|
|
// this.count++;
|
|
console.log(item, index)
|
|
this.goodsList.orderGoodsList[0][index].goodsNum++
|
|
|
|
let data = {
|
|
orderGoodsId: this.goodsList.orderGoodsList[0][index].id,
|
|
type: 1,
|
|
num: 1,
|
|
shopId: this.shopId
|
|
}
|
|
this.$Request.get("/app/order/updateGoodsNum", data).then(res => {
|
|
if (res.code == 0) {
|
|
this.getGoodList()
|
|
this.getOrderList();
|
|
} else {
|
|
this.$queue.showToast(res.msg);
|
|
this.goodsList.orderGoodsList[0][index].goodsNum--
|
|
}
|
|
});
|
|
},
|
|
// 减少数量
|
|
noAdd(item, index) {
|
|
console.log(item, index)
|
|
this.goodsList.orderGoodsList[0][index].goodsNum--
|
|
// this.count--;
|
|
let data = {
|
|
orderGoodsId: this.goodsList.orderGoodsList[0][index].id,
|
|
type: 2,
|
|
num: 1,
|
|
shopId: this.shopId
|
|
}
|
|
this.$Request.get("/app/order/updateGoodsNum", data).then(res => {
|
|
if (res.code == 0) {
|
|
this.getGoodList()
|
|
this.getOrderList();
|
|
}
|
|
});
|
|
},
|
|
isPopupShow() {
|
|
// uni.showToast({
|
|
// title: '请返回到购物车模块操作',
|
|
// icon: 'none'
|
|
// })
|
|
|
|
if (this.myGoodList.length > 0) {
|
|
if (this.userId != this.myGoodList[0].userId) {
|
|
uni.showToast({
|
|
title: '请联系拼单发起人操作',
|
|
icon: "none"
|
|
})
|
|
return
|
|
} else {
|
|
this.getOrderList();
|
|
|
|
}
|
|
} else {
|
|
uni.showToast({
|
|
title: '请联系拼单发起人操作',
|
|
icon: "none"
|
|
})
|
|
return
|
|
}
|
|
|
|
},
|
|
clear() {
|
|
if (this.myGoodList.length > 0) {
|
|
if (this.userId != this.myGoodList[0].userId) {
|
|
uni.showToast({
|
|
title: '请联系拼单发起人操作',
|
|
icon: "none"
|
|
})
|
|
return
|
|
}
|
|
}
|
|
let that = this
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '确定清空我的订单吗',
|
|
success: function(res) {
|
|
if (res.confirm) {
|
|
console.log('用户点击确定');
|
|
let data = {
|
|
shopId: that.shopId,
|
|
}
|
|
that.$Request.post("/app/order/emptyShoppingTrolley", data).then(res => {
|
|
if (res.code == 0) {
|
|
that.myGoodList = [];
|
|
that.getGoodList()
|
|
} else {
|
|
that.$queue.showToast(res.msg);
|
|
}
|
|
});
|
|
} else if (res.cancel) {
|
|
console.log('用户点击取消');
|
|
}
|
|
}
|
|
});
|
|
},
|
|
// 取消订单
|
|
cancel(e) {
|
|
if (this.myGoodList.length > 0) {
|
|
//检查是不是发起人
|
|
if (this.userId != this.myGoodList[0].userId) {
|
|
uni.showToast({
|
|
title: '请联系拼单发起人操作',
|
|
icon: "none"
|
|
})
|
|
return
|
|
}
|
|
}
|
|
let that = this
|
|
console.log(e)
|
|
uni.showModal({
|
|
title: '提示',
|
|
content: '确认取消订单吗?',
|
|
success: function(res) {
|
|
if (res.confirm) {
|
|
console.log('用户点击确定');
|
|
let data = {
|
|
orderId: that.orderId
|
|
}
|
|
that.$Request.post("/app/order/deleteOrder", data).then(res => {
|
|
if (res.code == 0) {
|
|
uni.showToast({
|
|
title: '订单取消成功',
|
|
icon: 'none'
|
|
})
|
|
uni.removeStorageSync('orderId')
|
|
setTimeout(function() {
|
|
uni.navigateBack()
|
|
}, 1000)
|
|
} else {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
});
|
|
} else if (res.cancel) {
|
|
console.log('用户点击取消');
|
|
}
|
|
}
|
|
});
|
|
},
|
|
// 切换外卖/自提
|
|
tabSwidth(e) {
|
|
this.orderType = e
|
|
this.getOrderList()
|
|
},
|
|
goGoodsList() {
|
|
uni.setStorageSync('types',1)
|
|
uni.navigateBack({
|
|
|
|
})
|
|
// uni.navigateTo({
|
|
// url: '/pages/index/shop/goodsList?shopId=' + this.shopId
|
|
// })
|
|
},
|
|
// 获取购物车商品列表
|
|
getOrderList() {
|
|
let data = {
|
|
shopId: this.shopId,
|
|
page: 1,
|
|
limit: 1000,
|
|
status: 1,
|
|
// orderType: this.orderType
|
|
}
|
|
this.$Request.get("/app/order/selectAllOrderList", data).then(res => {
|
|
if (res.code == 0 && res.data.pageUtils.list.length) {
|
|
this.goodsList = res.data.pageUtils.list[0]
|
|
|
|
if (this.goodsList && this.goodsList.orderGoodsList && this.goodsList.orderGoodsList[0]) {
|
|
|
|
this.totalPrice = parseFloat(parseFloat(res.data.money).toFixed(2));
|
|
this.goodsNum = 0
|
|
|
|
this.goodsList.orderGoodsList[0].forEach(res => {
|
|
res.goodsPicture = res.goodsPicture.split(',')
|
|
this.goodsNum += res.goodsNum
|
|
})
|
|
this.popupShow = true
|
|
if (!this.goodsList.orderGoodsList[0].length) {
|
|
this.popupShow = false
|
|
}
|
|
|
|
|
|
}
|
|
|
|
}
|
|
uni.hideLoading()
|
|
});
|
|
},
|
|
getOrderDetail(){
|
|
this.$Request.getT('/app/order/selectOrderById?orderId=' + this.orderId).then(res =>{
|
|
if(res.code == 0 && res.data){
|
|
if(res.data.isPay && res.data.isPay == 1){
|
|
uni.showToast({
|
|
title: '拼单已结束',
|
|
icon: 'none'
|
|
})
|
|
setTimeout(function() {
|
|
uni.removeStorageSync('orderId')
|
|
uni.navigateBack()
|
|
}, 1000)
|
|
}
|
|
}
|
|
});
|
|
},
|
|
getGoodList() {
|
|
this.number = 0;
|
|
let data = {
|
|
orderId: this.orderId,
|
|
}
|
|
|
|
this.$Request.get("/app/order/selectShareTheBill", data).then(res => {
|
|
if (res.code == 0) {
|
|
|
|
if(!res.data){
|
|
uni.showToast({
|
|
title: '拼单已结束',
|
|
icon: 'none'
|
|
})
|
|
setTimeout(function() {
|
|
uni.removeStorageSync('orderId')
|
|
uni.navigateBack()
|
|
}, 1000)
|
|
}
|
|
this.goodsShop = res.data.goodsShop
|
|
// this.goodsList = res.data.orderGoodsList
|
|
this.myGoodList = res.data.parentShareTheBill
|
|
let mySum = 0
|
|
for (var i = 0; i < this.myGoodList.length; i++) {
|
|
if (i == 0) {
|
|
mySum = parseFloat(parseFloat(parseFloat(this.myGoodList[i].goodsPrice) * parseFloat(this.myGoodList[i].goodsNum)).toFixed(2))
|
|
this.number += this.myGoodList[i].goodsNum
|
|
} else {
|
|
mySum = parseFloat(parseFloat(mySum + parseFloat(this.myGoodList[i].goodsPrice) * parseFloat(this.myGoodList[i].goodsNum)).toFixed(2))
|
|
this.number += this.myGoodList[i].goodsNum
|
|
}
|
|
if (i == (this.myGoodList.length - 1)) {
|
|
this.myGoodList[i].goodsPrice = mySum
|
|
this.totalPrice = mySum
|
|
}
|
|
}
|
|
|
|
|
|
this.otherGoodList = res.data.orderGoodsList
|
|
var sum = 0
|
|
for (var i = 0; i < this.otherGoodList.length; i++) {
|
|
if (i == 0) {
|
|
|
|
sum = parseFloat(parseFloat(parseFloat(this.otherGoodList[i].goodsPrice) * parseFloat(this.otherGoodList[i].goodsNum)).toFixed(2))
|
|
|
|
this.number += this.otherGoodList[i].goodsNum
|
|
} else {
|
|
this.number += this.otherGoodList[i].goodsNum
|
|
if (this.otherGoodList[i].userId == this.otherGoodList[i - 1].userId) {
|
|
sum = parseFloat(parseFloat(sum + parseFloat(this.otherGoodList[i].goodsPrice) * parseFloat(this.otherGoodList[i].goodsNum)).toFixed(2))
|
|
} else {
|
|
this.otherGoodList[i - 1].goodsPrice = sum
|
|
sum = parseFloat(parseFloat(parseFloat(this.otherGoodList[i].goodsPrice) * parseFloat(this.otherGoodList[i].goodsNum)).toFixed(2))
|
|
}
|
|
}
|
|
if (i == (this.otherGoodList.length - 1)) {
|
|
this.otherGoodList[i].goodsPrice = sum
|
|
this.totalPrice = parseFloat(parseFloat(parseFloat(this.totalPrice) + parseFloat(sum)).toFixed(2))
|
|
// parseFloat(parseFloat(mySum).toFixed(2))
|
|
}
|
|
}
|
|
|
|
} else {
|
|
uni.removeStorageSync('orderId')
|
|
this.$queue.showToast(res.msg);
|
|
setTimeout(function() {
|
|
uni.navigateBack()
|
|
}, 1000)
|
|
}
|
|
});
|
|
},
|
|
// 去结算
|
|
goConfirm() {
|
|
if (!this.userId) {
|
|
uni.navigateTo({
|
|
url: '/pages/public/login'
|
|
})
|
|
return
|
|
}
|
|
|
|
if (this.myGoodList.length > 0) {
|
|
if (this.userId != this.myGoodList[0].userId) {
|
|
uni.showToast({
|
|
title: '请联系拼单发起人结算订单',
|
|
icon: "none"
|
|
})
|
|
return
|
|
}
|
|
}
|
|
if (this.myGoodList.length > 0 || this.otherGoodList.length > 0) {
|
|
uni.navigateTo({
|
|
url: '/pages/index/shop/confirmOrder?shopId=' + this.shopId + '&orderType=2&orderId=' +
|
|
this.orderId
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
title: '请先添加商品',
|
|
icon: "none"
|
|
})
|
|
}
|
|
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.Switch {
|
|
width: 164rpx;
|
|
height: 62rpx;
|
|
color: #FFFFFF;
|
|
background: #FCD202;
|
|
border-radius: 30rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 2rpx;
|
|
}
|
|
|
|
.Switch>view {
|
|
/* flex: 1; */
|
|
width: 80rpx;
|
|
text-align: center;
|
|
line-height: 62rpx;
|
|
height: 58rpx;
|
|
}
|
|
|
|
.selSwitch {
|
|
color: #333333;
|
|
background: #FFFFFF;
|
|
border-radius: 30rpx;
|
|
}
|
|
|
|
.btn {
|
|
width: 320rpx;
|
|
height: 88rpx;
|
|
color: #333333;
|
|
font-size: 30rpx;
|
|
font-weight: 500;
|
|
text-align: center;
|
|
line-height: 88rpx;
|
|
border-radius: 50rpx;
|
|
background: #FCD202;
|
|
border: 2rpx solid #FCD202;
|
|
margin: 0;
|
|
}
|
|
|
|
button::after {
|
|
border: 2rpx solid #FCD202;
|
|
}
|
|
|
|
.btn1 {
|
|
width: 320rpx;
|
|
height: 88rpx;
|
|
color: #999999;
|
|
font-weight: 500;
|
|
font-size: 30rpx;
|
|
text-align: center;
|
|
line-height: 88rpx;
|
|
border-radius: 44rpx;
|
|
border: 2rpx solid #CCCCCC;
|
|
}
|
|
|
|
.btn2 {
|
|
width: 320rpx;
|
|
height: 88rpx;
|
|
color: #333333;
|
|
font-weight: 500;
|
|
text-align: center;
|
|
line-height: 88rpx;
|
|
border-radius: 50rpx;
|
|
background: #FCD202;
|
|
}
|
|
|
|
/* 结算 */
|
|
.settlement {
|
|
width: 94%;
|
|
background-color: #000000;
|
|
line-height: 3.4;
|
|
border-radius: 49rpx;
|
|
position: fixed;
|
|
bottom: 10rpx;
|
|
left: 3%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.settlement_le {
|
|
width: 45%;
|
|
padding-left: 20%;
|
|
color: #FFFFFF;
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.settlement_le text {
|
|
font-size: 22rpx;
|
|
}
|
|
|
|
.settlement_ri {
|
|
width: 35%;
|
|
background-color: #FCD202;
|
|
font-family: PingFang SC;
|
|
font-weight: 800;
|
|
color: #333333;
|
|
text-align: center;
|
|
border-top-right-radius: 49rpx;
|
|
border-bottom-right-radius: 49rpx;
|
|
}
|
|
|
|
.settlement_img {
|
|
width: 91rpx;
|
|
height: 96rpx;
|
|
position: absolute;
|
|
// bottom: 30rpx;
|
|
left: 5%;
|
|
}
|
|
|
|
.settlement_img image {
|
|
width: 74rpx;
|
|
height: 81rpx;
|
|
}
|
|
|
|
.settlement_hot {
|
|
width: 35rpx;
|
|
height: 35rpx;
|
|
line-height: 35rpx;
|
|
text-align: center;
|
|
border-radius: 50%;
|
|
position: absolute;
|
|
top: -10rpx;
|
|
right: 0;
|
|
background-color: #FF130A;
|
|
color: #FFFFFF;
|
|
font-size: 20rpx;
|
|
font-weight: bold;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.sBtn1 {
|
|
width: 128rpx;
|
|
height: 48rpx;
|
|
color: #999999;
|
|
text-align: center;
|
|
line-height: 48rpx;
|
|
border: 2rpx solid #CCCCCC;
|
|
border-radius: 24rpx;
|
|
}
|
|
|
|
.sBtn2 {
|
|
width: 128rpx;
|
|
height: 48rpx;
|
|
color: #FF130A;
|
|
text-align: center;
|
|
line-height: 48rpx;
|
|
border: 2rpx solid #FF130A;
|
|
border-radius: 24rpx;
|
|
margin-left: 20rpx;
|
|
}
|
|
|
|
.sBtn3 {
|
|
width: 170rpx;
|
|
height: 48rpx;
|
|
color: #999999;
|
|
text-align: center;
|
|
line-height: 48rpx;
|
|
border: 2rpx solid #CCCCCC;
|
|
border-radius: 24rpx;
|
|
}
|
|
|
|
.popup {
|
|
/* height: 500rpx; */
|
|
max-height: 500rpx;
|
|
/* overflow-y: auto; */
|
|
}
|
|
|
|
.popup {
|
|
/* height: 500rpx; */
|
|
max-height: 500rpx;
|
|
/* overflow-y: auto; */
|
|
}
|
|
|
|
.tabBtn {
|
|
/* background-color: #f6f6fa; */
|
|
height: 60rpx;
|
|
line-height: 60rpx;
|
|
color: #999999;
|
|
font-size: 38rpx;
|
|
}
|
|
|
|
.Switch {
|
|
width: 164rpx;
|
|
height: 62rpx;
|
|
color: #FFFFFF;
|
|
background: #FCD202;
|
|
border-radius: 30rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
padding: 2rpx;
|
|
}
|
|
|
|
.Switch>view {
|
|
/* flex: 1; */
|
|
width: 80rpx;
|
|
text-align: center;
|
|
line-height: 62rpx;
|
|
height: 58rpx;
|
|
}
|
|
|
|
.selSwitch {
|
|
|
|
color: #333333;
|
|
background: #FFFFFF;
|
|
border-radius: 30rpx;
|
|
}
|
|
|
|
.hintPopul {
|
|
width: 100%;
|
|
height: 100vh;
|
|
|
|
position: absolute;
|
|
top: 0;
|
|
background: rgba(0, 0, 0, .4);
|
|
}
|
|
|
|
.content {
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
margin: auto;
|
|
text-align: center;
|
|
width: 500rpx;
|
|
height: 400rpx;
|
|
border-radius: 20rpx;
|
|
background-color: #fff;
|
|
padding-top: 120rpx;
|
|
}
|
|
|
|
.content image {
|
|
position: absolute;
|
|
top: -50rpx;
|
|
left: 0;
|
|
right: 0;
|
|
margin: auto;
|
|
}
|
|
|
|
.hintText {
|
|
font-size: 30rpx;
|
|
|
|
}
|
|
|
|
|
|
.VerticalNav.nav {
|
|
width: 200upx;
|
|
white-space: initial;
|
|
}
|
|
|
|
.VerticalNav.nav .cu-item {
|
|
width: 100%;
|
|
text-align: center;
|
|
background-color: #f1f1f1;
|
|
margin: 0;
|
|
border: none;
|
|
height: 50px;
|
|
position: relative;
|
|
}
|
|
|
|
.VerticalNav.nav .cu-item.cur {
|
|
background-color: #fff;
|
|
}
|
|
|
|
|
|
.VerticalBox {
|
|
display: flex;
|
|
}
|
|
|
|
.VerticalMain {
|
|
background-color: #f1f1f1;
|
|
flex: 1;
|
|
}
|
|
|
|
.detail_describe_text2 {
|
|
font-weight: 500;
|
|
margin-top: 2%;
|
|
color: #999999;
|
|
}
|
|
|
|
.detail_account_bottom {
|
|
margin-top: 20rpx;
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
/* margin: 4% 0 3%; */
|
|
}
|
|
|
|
.detail_account_bottom_le {
|
|
width: 47.5%;
|
|
/* margin-right: 5%; */
|
|
border-radius: 44rpx;
|
|
text-align: center;
|
|
line-height: 2.8;
|
|
border: 2rpx solid #FCD202;
|
|
}
|
|
|
|
.detail_account_bottom_ri {
|
|
width: 47.5%;
|
|
border-radius: 44rpx;
|
|
text-align: center;
|
|
line-height: 2.8;
|
|
background-color: #FCD202;
|
|
}
|
|
|
|
.food_all {
|
|
position: relative;
|
|
}
|
|
|
|
.text-through {
|
|
text-decoration: line-through
|
|
}
|
|
|
|
/* 食物 */
|
|
.food {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
// position: absolute;
|
|
// top: 350rpx;
|
|
background-color: #FFFFFF;
|
|
border-top-left-radius: 18rpx;
|
|
border-top-right-radius: 18rpx;
|
|
}
|
|
|
|
.food_address {
|
|
margin: 3%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: 120rpx;
|
|
}
|
|
|
|
.food_address_le {
|
|
width: 75%;
|
|
}
|
|
|
|
.food_address_le_top {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.food_address_le_top_le {
|
|
width: 40rpx;
|
|
height: 37rpx;
|
|
}
|
|
|
|
.food_address_le_top_le image {
|
|
width: 40rpx;
|
|
height: 37rpx;
|
|
}
|
|
|
|
.food_address_le_top_ce {
|
|
line-height: 1.6;
|
|
font-size: 38rpx;
|
|
font-weight: 600;
|
|
color: #333333;
|
|
}
|
|
|
|
.food_address_le_top_ce_ri {
|
|
width: 14rpx;
|
|
/* margin: 1% 0 0 2%; */
|
|
height: 24rpx;
|
|
margin-left: 2%;
|
|
}
|
|
|
|
.food_address_le_top_ce_ri image {
|
|
width: 14rpx;
|
|
height: 24rpx;
|
|
}
|
|
|
|
.food_address_text {
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
}
|
|
|
|
.food_address_ri {
|
|
width: 24%;
|
|
height: 55rpx;
|
|
display: flex;
|
|
padding: 0.5% 1%;
|
|
background-color: #FCD202;
|
|
border-radius: 31rpx;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.food_address_ri_sty {
|
|
flex: 1;
|
|
text-align: center;
|
|
padding-top: 4%;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.food_address_ri_sty_active {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
background-color: #FFFFFF;
|
|
border-radius: 31rpx;
|
|
color: #333333;
|
|
text-align: center;
|
|
}
|
|
|
|
/* 结算 */
|
|
.settlement {
|
|
width: 94%;
|
|
background-color: #000000;
|
|
line-height: 3.4;
|
|
border-radius: 49rpx;
|
|
position: fixed;
|
|
bottom: 10rpx;
|
|
left: 3%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.settlement1 {
|
|
width: 94%;
|
|
background-color: #000000;
|
|
line-height: 2.8;
|
|
border-radius: 49rpx;
|
|
position: relative;
|
|
/* bottom: 10rpx; */
|
|
left: 0;
|
|
right: 0;
|
|
/* left: 3%; */
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin: 20rpx auto;
|
|
}
|
|
|
|
.settlement_le {
|
|
width: 45%;
|
|
padding-left: 20%;
|
|
color: #FFFFFF;
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.settlement_le text {
|
|
font-size: 22rpx;
|
|
}
|
|
|
|
.settlement_ri {
|
|
width: 35%;
|
|
background-color: #FCD202;
|
|
font-family: PingFang SC;
|
|
font-weight: 800;
|
|
color: #333333;
|
|
text-align: center;
|
|
border-top-right-radius: 49rpx;
|
|
border-bottom-right-radius: 49rpx;
|
|
}
|
|
|
|
.settlement_img {
|
|
width: 91rpx;
|
|
height: 96rpx;
|
|
position: absolute;
|
|
// bottom: 30rpx;
|
|
left: 5%;
|
|
}
|
|
|
|
.settlement_img image {
|
|
width: 74rpx;
|
|
height: 81rpx;
|
|
}
|
|
|
|
.settlement_hot {
|
|
width: 35rpx;
|
|
height: 35rpx;
|
|
line-height: 35rpx;
|
|
text-align: center;
|
|
border-radius: 50%;
|
|
position: absolute;
|
|
top: -10rpx;
|
|
right: 0;
|
|
background-color: #FF130A;
|
|
color: #FFFFFF;
|
|
font-size: 20rpx;
|
|
font-weight: bold;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
|
|
.select_all {
|
|
width: 100%;
|
|
position: relative;
|
|
}
|
|
|
|
/* 餐厅 */
|
|
.select {
|
|
color: #000000;
|
|
font-weight: bold;
|
|
background-color: #fff;
|
|
z-index: 10;
|
|
}
|
|
|
|
.select_line {
|
|
width: 15%;
|
|
height: 6rpx;
|
|
margin: 0 auto 4%;
|
|
background: #E6E6E6;
|
|
border-radius: 4rpx;
|
|
}
|
|
|
|
.select_search {
|
|
width: 100%;
|
|
margin: 2% 0;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.select_search_le {
|
|
/* width: 10%; */
|
|
font-size: 30rpx;
|
|
line-height: 2.5;
|
|
margin-right: 1%;
|
|
}
|
|
|
|
.select_search_ce {
|
|
/* width: 5%; */
|
|
/* margin-top: 1%; */
|
|
margin-right: 20rpx;
|
|
margin-left: 6rpx;
|
|
/* margin: 0 20rpx; */
|
|
width: 20rpx;
|
|
height: 10rpx;
|
|
}
|
|
|
|
.select_search_ri {
|
|
/* width: 84%; */
|
|
height: 72rpx;
|
|
flex: 1;
|
|
display: flex;
|
|
}
|
|
|
|
.select_search_ri input {
|
|
flex: 1;
|
|
/* width: 100%; */
|
|
height: 72rpx;
|
|
background: #F5F5F5;
|
|
color: #999999;
|
|
border-radius: 36rpx;
|
|
text-decoration: 42rpx;
|
|
text-align: center;
|
|
}
|
|
|
|
/* 附近 */
|
|
.nearby {
|
|
width: 100%;
|
|
position: relative;
|
|
}
|
|
|
|
.nearby_text {
|
|
width: 18%;
|
|
font-size: 30rpx;
|
|
font-weight: 800;
|
|
color: #333333;
|
|
text-align: center;
|
|
border-bottom: 16rpx solid #FCD202;
|
|
/* line-height: 20rpx; */
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.nearby_address_active {
|
|
border: 2rpx solid #FCD202;
|
|
width: 100%;
|
|
padding: 3%;
|
|
margin-top: 3%;
|
|
border-radius: 10upx;
|
|
display: flex;
|
|
}
|
|
|
|
.nearby_address {
|
|
width: 100%;
|
|
padding: 3%;
|
|
margin-top: 3%;
|
|
border-radius: 10upx;
|
|
display: flex;
|
|
}
|
|
|
|
.nearby_address_le {
|
|
flex: 1;
|
|
}
|
|
|
|
.nearby_address_ri {
|
|
line-height: 2.5;
|
|
text-align: right;
|
|
/* flex: 1; */
|
|
}
|
|
|
|
.nearby_text2 {
|
|
|
|
/* line-height: 1.5; */
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.nearby_text2_ {
|
|
font-size: 30rpx;
|
|
font-weight: 800;
|
|
color: #333333;
|
|
}
|
|
|
|
.nearby_text3 {
|
|
font-size: 24rpx;
|
|
font-weight: 500;
|
|
color: #999999;
|
|
margin-top: 2%;
|
|
}
|
|
|
|
/* 添加地址 */
|
|
.goorder {
|
|
width: 100%;
|
|
padding: 2% 3%;
|
|
position: fixed;
|
|
bottom: 0;
|
|
background-color: #FFFFFF;
|
|
border-top: 1rpx solid #999999;
|
|
}
|
|
|
|
.goorder_but {
|
|
width: 100%;
|
|
line-height: 2.5;
|
|
text-align: center;
|
|
background: #FCD202;
|
|
border-radius: 36rpx;
|
|
}
|
|
</style>
|