|
|
@ -61,47 +61,24 @@ |
|
|
<view class="special_tab"> |
|
|
<view class="special_tab"> |
|
|
<u-tabs :list="tab_list" active-color="#15716E" inactive-color='#777777' :is-scroll="true" :current="current" @change="tabChange"></u-tabs> |
|
|
<u-tabs :list="tab_list" active-color="#15716E" inactive-color='#777777' :is-scroll="true" :current="current" @change="tabChange"></u-tabs> |
|
|
</view> |
|
|
</view> |
|
|
<view class="lf-p-30 lf-flex lf-w-100 lf-bg-white lf-m-b-30"> |
|
|
|
|
|
<u-icon name="search" class="search-icon"></u-icon> |
|
|
|
|
|
<input class="rom-search" type="text" placeholder="请输入商品名称" /> |
|
|
|
|
|
</view> |
|
|
|
|
|
<swiper :style="{height: autoHeight, width: '750rpx'}" :current="current" @change="swiperChange"> |
|
|
|
|
|
|
|
|
<swiper :style="{height: autoHeightTwo, width: '750rpx', background: '#fff'}" :current="current" @change="swiperChange"> |
|
|
<swiper-item v-for="(tabItem, tabIndex) in tab_list" :key="tabIndex"> |
|
|
<swiper-item v-for="(tabItem, tabIndex) in tab_list" :key="tabIndex"> |
|
|
<scroll-view :style="{height: autoHeight}" class="com" :scroll-y="true" :refresher-enabled="true" :refresher-triggered="tabItem.isRefresher" @scrolltolower="onScrolltolower" @refresherrefresh="onRefresherrefresh"> |
|
|
|
|
|
|
|
|
<scroll-view :style="{height: autoHeightTwo}" class="com" :scroll-y="true" :refresher-enabled="true" :refresher-triggered="tabItem.isRefresher" @scrolltolower="onScrolltolower" @refresherrefresh="onRefresherrefresh"> |
|
|
|
|
|
|
|
|
<view v-for="(item2,index2) of tabItem.list" :key="index2" class="online-card"> |
|
|
|
|
|
<view class="lf-font-24 lf-color-777"> |
|
|
|
|
|
订单编号783974398749328 |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="lf-m-t-30"> |
|
|
|
|
|
<text class="lf-iconfont icon-Group- lf-font-28"></text> |
|
|
|
|
|
<text class="lf-color-black lf-font-28 lf-font-bold lf-m-l-10">精品超市</text> |
|
|
|
|
|
<text class="lf-iconfont icon-xiangyou lf-font-24 lf-m-l-10"></text> |
|
|
|
|
|
|
|
|
<view class="item" v-for="(item, index) in 10" :key="index"> |
|
|
|
|
|
<view class="lf-row-between"> |
|
|
|
|
|
<text class="lf-font-36 lf-color-black lf-font-bold lf-color-price">-¥250</text> |
|
|
|
|
|
<text class="lf-font-24 lf-color-555">线上-商城内消费</text> |
|
|
</view> |
|
|
</view> |
|
|
<view v-for="i of 5"> |
|
|
|
|
|
<view class="lf-m-t-30" style="display: flex;"> |
|
|
|
|
|
<image class="content-img" src="https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png" mode="aspectFill"></image> |
|
|
|
|
|
<view class="lf-m-l-15"> |
|
|
|
|
|
<view class="lf-color-333 lf-font-26 lf-line-2" style="max-width: 480rpx;">爱他美较大婴儿配方奶粉较大婴儿配方奶粉较大婴儿配方奶粉2段 900g</view> |
|
|
|
|
|
<view class="lf-font-24 lf-color-777 lf-m-t-14 lf-row-between"> |
|
|
|
|
|
<view>1件;900g</view> |
|
|
|
|
|
<view class="lf-font-32 lf-color-price">¥385</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
<view class="lf-row-between lf-m-t-30 lf-m-b-50"> |
|
|
|
|
|
<view class="lf-font-24 lf-color-777">订单关闭</view> |
|
|
|
|
|
<view class="lf-color-price lf-font-24">删除订单</view> |
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
<view class="lf-row-between lf-m-t-20"> |
|
|
|
|
|
<text class="lf-font-24 lf-color-555">¥374.38</text> |
|
|
|
|
|
<text class="lf-font-24 lf-color-777">2021-09-01 18:27:58</text> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
<view class="loading-more lf-m-b-10"> |
|
|
<view class="loading-more lf-m-b-10"> |
|
|
<text :class="{'loading-more-text': tabItem.loadingClass}" v-if="tabItem.list.length">{{tabItem.loadingText}}</text> |
|
|
<text :class="{'loading-more-text': tabItem.loadingClass}" v-if="tabItem.list.length">{{tabItem.loadingText}}</text> |
|
|
<lf-nocontent v-else></lf-nocontent> |
|
|
<lf-nocontent v-else></lf-nocontent> |
|
|
<!-- <view> |
|
|
|
|
|
{{tabItem.list.length}} |
|
|
|
|
|
</view> --> |
|
|
|
|
|
</view> |
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -345,6 +322,9 @@ |
|
|
computed: { |
|
|
computed: { |
|
|
autoHeight(){ |
|
|
autoHeight(){ |
|
|
return `calc(${this.scrollH}px - ${this.nav_height}px - 86rpx - 120rpx - 120rpx)`; |
|
|
return `calc(${this.scrollH}px - ${this.nav_height}px - 86rpx - 120rpx - 120rpx)`; |
|
|
|
|
|
}, |
|
|
|
|
|
autoHeightTwo(){ |
|
|
|
|
|
return `calc(${this.scrollH}px - ${this.nav_height}px - 86rpx - 90rpx)`; |
|
|
} |
|
|
} |
|
|
}, |
|
|
}, |
|
|
onLoad(){ |
|
|
onLoad(){ |
|
|
@ -513,6 +493,18 @@ |
|
|
padding: 0 65rpx 0 65rpx; |
|
|
padding: 0 65rpx 0 65rpx; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.item{ |
|
|
|
|
|
width: 686rpx; |
|
|
|
|
|
height: max-content; |
|
|
|
|
|
background: #F4F8F8; |
|
|
|
|
|
border-radius: 10rpx; |
|
|
|
|
|
// margin-bottom: 30rpx; |
|
|
|
|
|
margin-top: 30rpx; |
|
|
|
|
|
padding: 30rpx; |
|
|
|
|
|
box-sizing: border-box; |
|
|
|
|
|
line-height: 1; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
/deep/.u-scroll-box { |
|
|
/deep/.u-scroll-box { |
|
|
display: flex; |
|
|
display: flex; |
|
|
justify-content: center; |
|
|
justify-content: center; |
|
|
|