wangxiaowei/jianbing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完善门店购物车页面

Browse Source
This commit is contained in:
wangxiaowei
2025-04-26 10:12:55 +08:00
parent 5eb6d1b3b8
commit 5297bc0034
108 changed files with 2067 additions and 740 deletions
Download Patch File Download Diff File Expand all files Collapse all files

84
components/cate-one/cate-one.vue
View File

@ -2,13 +2,15 @@
<view class="cate">
<view class="cate-one row">
<view class="aside">
<scroll-view style="height: 100%" scroll-y="true" scroll-with-animation="true">
<block v-for="(item, index) in cateList" :key="index">
<view :class="'one-item sm ' + (index == selectIndex ? 'active bg-white' : '')" @click="changeActive(index)">
<text class="name">{{ item.name }}</text>
<view v-if="index == selectIndex" class="active-line bg-default"></view>
</view>
</block>
<scroll-view style="height: 100%;" scroll-y="true" scroll-with-animation="true">
<view style="padding-bottom: 200rpx;">
<block v-for="(item, index) in cateList" :key="index">
<view :class="'one-item sm ' + (index == selectIndex ? 'active bg-white' : '')" @click="changeActive(index)">
<text class="name">{{ item.name }}</text>
<view v-if="index == selectIndex" class="active-line bg-default"></view>
</view>
</block>
</view>
</scroll-view>
</view>
@ -25,7 +27,7 @@
</view>
<view class="info">
<view>
<view class="u-line-2 u-padding-top-10">葱烩海鲜卷边披萨--{{index}}</view>
<view class="u-line-2 u-padding-top-10">葱烩海鲜卷边披萨</view>
<view class="u-padding-top-44 row-between">
<view class="row">
<view class="primary">
@ -56,6 +58,39 @@
</view>
<view class="text-999">去结算</view>
</view>
<u-popup v-model="showCart" mode="bottom" :border-radius="16">
<view style="max-height: 800rpx;">
<view class="px20 text-999 mt20">
温馨提示：请适量点餐
</view>
<view>
<scroll-view style="height: 700rpx;" scroll-y="true" scroll-with-animation="true">
<view class="row-start u-row-between u-padding-top-20 u-padding-bottom-20 px20" v-for="(item, index) in 20">
<view class="row-start">
<view>
<u-image :src="cloudPath + 'img/banner.png'" width="136" height="136" border-radius="16"></u-image>
</view>
<view class="ml20">
<view class="u-line-2 u-padding-top-10">葱烩海鲜卷边披萨</view>
<view class="primary u-padding-top-40">
<price-format :price="12.9" :subscriptSize="22" :firstSize="34" :secondSize="26"></price-format>
</view>
</view>
</view>
<view>
<view class="u-text-right">
<u-icon class="u-padding-top-10" name="trash" size="32"></u-icon>
</view>
<view class="u-padding-top-30">
<u-number-box min="1" v-model="numberVal" @change="changeNumber"></u-number-box>
</view>
</view>
</view>
</scroll-view>
</view>
</view>
</u-popup>
</view>
</template>
@ -72,7 +107,9 @@
return {
selectIndex: 0,
cateList: [],
cateName: ''
cateName: '',
showCart: true,
numberVal: 1
}
},
methods: {
@ -108,6 +145,10 @@
// this.goodsList = data.dataList
// this.status = data.status
},
changeNumber() {
}
},
watch: {
list: {
@ -127,6 +168,10 @@
</script>
<style lang="scss">
page {
padding-bottom: 0;
}
$header-height: 94rpx;
.cate {
@ -134,7 +179,7 @@
}
.cate-one {
height: calc(100vh - #{$header-height} - var(--window-top) - var(--window-bottom));
height: 100vh;
.aside {
width: 180rpx;
@ -172,22 +217,25 @@
.main-wrap {
position: relative;
padding: 0 20rpx 120rpx;
.info {
width: 100%;
display: flex;
justify-content: space-between;
margin: 0 16rpx;
padding: 0 20rpx;
.goods {
padding-bottom: 200rpx;
.info {
width: 100%;
display: flex;
justify-content: space-between;
margin: 0 16rpx;
}
}
}
}
}
.buy {
position: absolute;
position: fixed;
left: 0;
right: 0;
bottom: calc( 20rpx + env(safe-area-inset-bottom));
bottom: env(safe-area-inset-bottom);
height: 100rpx;
background-color: #212526;
}