预订单
This commit is contained in:
parent
d8c5ab4a7d
commit
94db721247
|
|
@ -1,15 +1,18 @@
|
|||
<template>
|
||||
<view>
|
||||
<div class="top-cont flex justify-between align-center">
|
||||
<div class="flex align-center">
|
||||
<u-icon name="../../static/images/time.png" size="16"></u-icon>
|
||||
<span style="margin-left: 5px">{{ newDate }}</span>
|
||||
</div>
|
||||
<div class="top-right-cont">
|
||||
<span class="right-item" :class="{ active: active == 1 }" @click="active = 1">自取</span>
|
||||
<span class="right-item" :class="{ active: active == 2 }" @click="active = 2">外卖</span>
|
||||
<div class="top-wrap">
|
||||
<div class="top-cont flex justify-between align-center">
|
||||
<div class="flex align-center">
|
||||
<u-icon name="../../static/images/time.png" size="16"></u-icon>
|
||||
<span style="margin-left: 5px">{{ newDate }}</span>
|
||||
</div>
|
||||
<div class="top-right-cont">
|
||||
<span class="right-item" :class="{ active: active == 1 }" @click="active = 1">自取</span>
|
||||
<span class="right-item" :class="{ active: active == 2 }" @click="active = 2">外卖</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="height: 55px"></div>
|
||||
|
||||
<u-row class="footer-cont" align="top">
|
||||
<u-col :span="3" class="left-wrap">
|
||||
|
|
@ -21,12 +24,7 @@
|
|||
</u-col>
|
||||
<u-col :span="9">
|
||||
<div class="right-wrap" v-for="(book, index) in cookbook" :key="index">
|
||||
<div
|
||||
class="right-balance"
|
||||
:ref="'detail-' + index + '-' + itemIndex"
|
||||
v-for="(item, itemIndex) in book.recipeDetailList"
|
||||
:key="itemIndex"
|
||||
>
|
||||
<div class="right-balance" :id="'detail-' + index" v-for="(item, itemIndex) in book.recipeDetailList" :key="itemIndex">
|
||||
<div class="top-name">{{ item.intervalName }}</div>
|
||||
<div class="cont-list" v-for="(food, foodIndex) in item.mealList">
|
||||
<div>
|
||||
|
|
@ -69,6 +67,7 @@
|
|||
</u-row>
|
||||
|
||||
<!-- 购物车 -->
|
||||
<div style="height: 60px"></div>
|
||||
<div class="shop-car">
|
||||
<div class="car-cont">
|
||||
<div class="flex align-center" @click="openCar">
|
||||
|
|
@ -145,13 +144,7 @@
|
|||
</div>
|
||||
</u-popup>
|
||||
|
||||
<u-modal
|
||||
:show="showModal"
|
||||
showCancelButton
|
||||
title="提示"
|
||||
@cancel="showModal = false"
|
||||
@confirm="clearCar"
|
||||
>
|
||||
<u-modal :show="showModal" showCancelButton title="提示" @cancel="showModal = false" @confirm="clearCar">
|
||||
<view class="slot-content" style="text-align: center">
|
||||
<span>是否确认清空购物车?</span>
|
||||
</view>
|
||||
|
|
@ -360,37 +353,27 @@ export default {
|
|||
},
|
||||
scrollToDetail(index) {
|
||||
console.log('🚀 ~ scrollToDetail ~ index', index)
|
||||
if (this.current != 0 && this.current == index) return
|
||||
this.current = index
|
||||
this.$nextTick(() => {
|
||||
const detailElement = this.$refs['detail-' + index + '-0'][0]
|
||||
if (detailElement) {
|
||||
setTimeout(() => {
|
||||
detailElement.scrollIntoView({ behavior: 'smooth' })
|
||||
}, 100)
|
||||
}
|
||||
const query = uni.createSelectorQuery().in(this)
|
||||
query
|
||||
.select(`#detail-${index}`)
|
||||
.boundingClientRect(rect => {
|
||||
console.log('🚀 ~ scrollToDetail ~ rect', rect)
|
||||
if (rect) {
|
||||
setTimeout(() => {
|
||||
console.log('🚀 ~ scrollToDetail ~ rect.top', rect.top)
|
||||
uni.pageScrollTo({
|
||||
scrollTop: rect.top - 55,
|
||||
duration: 300
|
||||
})
|
||||
}, 100)
|
||||
}
|
||||
})
|
||||
.exec()
|
||||
})
|
||||
},
|
||||
// scrollToDetail(index) {
|
||||
// console.log('🚀 ~ scrollToDetail ~ index', index)
|
||||
// this.current = index
|
||||
// this.$nextTick(() => {
|
||||
// const query = uni.createSelectorQuery().in(this)
|
||||
// const targetElement = this.$refs['detail-' + index + '-0'][0]
|
||||
// if (targetElement) {
|
||||
// query
|
||||
// .select(`#${targetElement.id}`)
|
||||
// .boundingClientRect(rect => {
|
||||
// if (rect) {
|
||||
// uni.pageScrollTo({
|
||||
// scrollTop: rect.top + uni.getSystemInfoSync().statusBarHeight, // 需要加上状态栏高度
|
||||
// duration: 300 // 滚动的时间
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// .exec()
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
handleFoodNum(type, food) {
|
||||
console.log('🚀 ~ handleFoodNum ~ food:', food)
|
||||
console.log('🚀 ~ handleFoodNum ~ type', type)
|
||||
|
|
@ -453,10 +436,15 @@ export default {
|
|||
z-index: 10090 !important;
|
||||
}
|
||||
page {
|
||||
/* padding-top: env(safe-area-inset-top); */
|
||||
background: #f9fbff;
|
||||
position: relative;
|
||||
}
|
||||
.top-wrap {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100vw;
|
||||
z-index: 999;
|
||||
}
|
||||
.top-cont {
|
||||
height: 55px;
|
||||
padding: 0 16px;
|
||||
|
|
@ -481,7 +469,7 @@ page {
|
|||
}
|
||||
|
||||
.footer-cont {
|
||||
height: calc(100vh - 115px);
|
||||
/* height: calc(100vh - 115px); */
|
||||
overflow: auto;
|
||||
}
|
||||
.left-wrap {
|
||||
|
|
|
|||
Loading…
Reference in New Issue