Browse Source

补充菜窖页面

修改起订协议为滚动
修复轮播图大小不按比例显示的问题
修复底部卡片白色背景布局顶部圆角消失的问题
修复轮播图的指示器与底部背景距离保持不变
修复轮播图不能点击的问题
master
wangjiahai 1 year ago
parent
commit
a9031233fe
  1. 17
      pages/home/cloudCard2.vue

17
pages/home/cloudCard2.vue

@ -3,14 +3,14 @@
<view <view
style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);"> style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);">
<view class="top" style="position: fixed;z-index: 2;"> <view class="top" style="position: fixed;">
<swiper class="swiper" ref="swiper" :indicator-dots="true" :autoplay="true" :interval="3000" <swiper class="swiper" ref="swiper" :indicator-dots="true" :autoplay="true" :interval="3000"
:duration="1200" :circular='true'> :duration="1200" :circular='true'>
<swiper-item v-for="(item,index) in imgList" style="" @click="swiperClick(item)"> <swiper-item v-for="(item,index) in imgList" style="" @click="swiperClick(item)">
<image :src="item.bannerUrl" style="width: 100%; " mode="scaleToFill"> <image :src="item.bannerUrl" style="width: 100vw;height: 50vw; " mode="scaleToFill">
</image> </image>
</swiper-item> </swiper-item>
@ -20,7 +20,7 @@
</view> </view>
<loading-state ref="pageView" @request="request" style="z-index: 0;"> <loading-state ref="pageView" @request="request">
<!-- 总高度 - 底部导航栏高度 60px --> <!-- 总高度 - 底部导航栏高度 60px -->
<view style="height: calc(100vh - 60px);box-sizing: border-box;display: flex;flex-direction: column;"> <view style="height: calc(100vh - 60px);box-sizing: border-box;display: flex;flex-direction: column;">
@ -29,7 +29,7 @@
<view style="height: calc(50vw - 15px);width: 100%;"></view> <view style="height: calc(50vw - 15px);width: 100%;"></view>
<view <view
style="background: #fff; width: 100%; border-radius: 15px;display: flex;flex-direction: column; box-sizing: border-box;flex: 1"> style="background: #fff; width: 100%; border-radius: 15px;display: flex;flex-direction: column; box-sizing: border-box;flex: 1;z-index: 1;">
<view class="center" style=""> <view class="center" style="">
@ -48,8 +48,7 @@
<view style="width: 77%;background-color: #fff;overflow-y: auto;"> <view style="width: 77%;background-color: #fff;overflow-y: auto;">
<view <view style="z-index: 1;background: #FFFFFF;position: sticky;top: 0;padding: 10px; ">
style="z-index: 1;background: #FFFFFF;position: sticky;top: 0;padding: 10px; margin-top: 10px;">
<view style="display: flex;flex-direction: row;overflow-x: auto;"> <view style="display: flex;flex-direction: row;overflow-x: auto;">
@ -206,7 +205,6 @@
</loading-state> </loading-state>
<uni-popup ref="inputDialog" type="dialog"> <uni-popup ref="inputDialog" type="dialog">
<uni-popup-dialog ref="inputClose" mode="more" title="订购协议" :showConfirm="true" <uni-popup-dialog ref="inputClose" mode="more" title="订购协议" :showConfirm="true"
:beforeClose="dialogBeforeClose" @confirm="dialogInputConfirm" :beforeClose="dialogBeforeClose" @confirm="dialogInputConfirm"
@ -214,7 +212,7 @@
</uni-popup> </uni-popup>
<uni-popup ref="inputDialog2" type="dialog"> <uni-popup ref="inputDialog2" type="dialog">
<uni-popup-dialog ref="inputClose" mode="base" title="起订说明" :showConfirm="true" <uni-popup-dialog ref="inputClose" mode="more" title="起订说明" :showConfirm="true"
:beforeClose="dialogBeforeClose2" @confirm="dialogInputConfirm2" :beforeClose="dialogBeforeClose2" @confirm="dialogInputConfirm2"
:content="data.brandVos[selectIndex2].qdxy"></uni-popup-dialog> :content="data.brandVos[selectIndex2].qdxy"></uni-popup-dialog>
</uni-popup> </uni-popup>
@ -947,7 +945,8 @@
.wx-swiper-dots { .wx-swiper-dots {
position: relative; position: relative;
left: 50%; left: 50%;
top: 90%; /* 轮播图总高度 50vw-指示器点的大小12rxp-覆盖的高度15px - 覆盖的到指示器的高度5px */
top: calc(50vw - 20px - 12rpx);
} }
.swiper /deep/ .wx-swiper-dot { .swiper /deep/ .wx-swiper-dot {

Loading…
Cancel
Save