|
|
|
@ -1,12 +1,61 @@ |
|
|
|
<template> |
|
|
|
<view> |
|
|
|
<lf-nav :spreadOut="true" :showIcon="true" bgColor="white" title="在线商城订单"></lf-nav> |
|
|
|
<lf-nav :spreadOut="true" :showIcon="true" bgColor="white" title="在线商城订单" @changeHeight="e => nav_height = e"></lf-nav> |
|
|
|
<view class="lf-row-between lf-bg-white"> |
|
|
|
<view class="online-tab" :class="online_tab==0?'online-active':''" @click="online_tab = 0">线上订单</view> |
|
|
|
<view class="online-tab" :class="online_tab==1?'online-active':''" @click="online_tab = 1">线下订单</view> |
|
|
|
</view> |
|
|
|
<view v-if="online_tab == 0"> |
|
|
|
线上订单 |
|
|
|
<view class="special_tab"> |
|
|
|
<u-tabs :list="tab_list" active-color="#15716E" inactive-color='#777777' :is-scroll="true" :current="current" @change="tabChange"></u-tabs> |
|
|
|
</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-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"> |
|
|
|
|
|
|
|
<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> |
|
|
|
<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"> |
|
|
|
<view class="lf-font-24 lf-color-777">订单关闭</view> |
|
|
|
<view class="lf-color-price lf-font-24">删除订单</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="loading-more lf-m-b-10"> |
|
|
|
<text :class="{'loading-more-text': tabItem.loadingClass}" v-if="tabItem.list.length">{{tabItem.loadingText}}</text> |
|
|
|
<lf-nocontent v-else></lf-nocontent> |
|
|
|
<!-- <view> |
|
|
|
{{tabItem.list.length}} |
|
|
|
</view> --> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
</scroll-view> |
|
|
|
</swiper-item> |
|
|
|
</swiper> |
|
|
|
</view> |
|
|
|
<view v-else> |
|
|
|
<view class="special_tab"> |
|
|
|
@ -16,9 +65,9 @@ |
|
|
|
<u-icon name="search" class="search-icon"></u-icon> |
|
|
|
<input class="rom-search" type="text" placeholder="请输入商品名称" /> |
|
|
|
</view> |
|
|
|
<swiper :style="{height: '1200rpx', width: '750rpx'}" :current="current" @change="swiperChange"> |
|
|
|
<swiper :style="{height: autoHeight, width: '750rpx'}" :current="current" @change="swiperChange"> |
|
|
|
<swiper-item v-for="(tabItem, tabIndex) in tab_list" :key="tabIndex"> |
|
|
|
<scroll-view class="com" :scroll-y="true" :refresher-enabled="true" :refresher-triggered="tabItem.isRefresher" @scrolltolower="onScrolltolower" @refresherrefresh="onRefresherrefresh"> |
|
|
|
<scroll-view :style="{height: autoHeight}" 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"> |
|
|
|
@ -67,11 +116,11 @@ |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
online_tab: 1, |
|
|
|
online_tab: 0, |
|
|
|
tab_list: [ |
|
|
|
{ |
|
|
|
id: 1, |
|
|
|
name: '综合', |
|
|
|
name: '全部', |
|
|
|
list: [ |
|
|
|
{ |
|
|
|
id: 10, |
|
|
|
@ -122,7 +171,7 @@ |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: 2, |
|
|
|
name: '销量', |
|
|
|
name: '代付款', |
|
|
|
list: [ |
|
|
|
{ |
|
|
|
id: 10, |
|
|
|
@ -163,7 +212,7 @@ |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: 3, |
|
|
|
name: '上新', |
|
|
|
name: '拼团中', |
|
|
|
list: [ |
|
|
|
{ |
|
|
|
id: 10, |
|
|
|
@ -204,7 +253,48 @@ |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: 4, |
|
|
|
name: '价格', |
|
|
|
name: '待提货', |
|
|
|
list: [ |
|
|
|
{ |
|
|
|
id: 10, |
|
|
|
original_price: "4111.00", |
|
|
|
picture: "https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png", |
|
|
|
pictures: ["https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png"], |
|
|
|
price: "2412.00", |
|
|
|
product_id: 1008, |
|
|
|
sale: 0, |
|
|
|
title: "三亚悦榕庄(Banyan Tree Sanya Resort and Spa)" |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: 10, |
|
|
|
original_price: "4111.00", |
|
|
|
picture: "https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png", |
|
|
|
pictures: ["https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png"], |
|
|
|
price: "2412.00", |
|
|
|
product_id: 1008, |
|
|
|
sale: 0, |
|
|
|
title: "三亚悦榕庄(Banyan Tree Sanya Resort and Spa)" |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: 10, |
|
|
|
original_price: "4111.00", |
|
|
|
picture: "https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png", |
|
|
|
pictures: ["https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png"], |
|
|
|
price: "2412.00", |
|
|
|
product_id: 1008, |
|
|
|
sale: 0, |
|
|
|
title: "三亚悦榕庄(Banyan Tree Sanya Resort and Spa)" |
|
|
|
} |
|
|
|
], |
|
|
|
isRefresher: false, |
|
|
|
loadingClass: true, |
|
|
|
loadingText: '正在加载中', |
|
|
|
page: 1, |
|
|
|
isPage: true |
|
|
|
}, |
|
|
|
{ |
|
|
|
id: 5, |
|
|
|
name: '待发货', |
|
|
|
list: [ |
|
|
|
{ |
|
|
|
id: 10, |
|
|
|
@ -247,9 +337,20 @@ |
|
|
|
current: 0, |
|
|
|
windowHeight: 0, |
|
|
|
loadingClass: false, |
|
|
|
loadingText: '没有更多数据啦~' |
|
|
|
loadingText: '没有更多数据啦~', |
|
|
|
scrollH: '', |
|
|
|
nav_height: '', |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
autoHeight(){ |
|
|
|
return `calc(${this.scrollH}px - ${this.nav_height}px - 86rpx - 120rpx - 120rpx)`; |
|
|
|
} |
|
|
|
}, |
|
|
|
onLoad(){ |
|
|
|
let info = uni.getSystemInfoSync(); |
|
|
|
this.scrollH = info.screenHeight; |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
tabChange(index){ |
|
|
|
this.current = index; |
|
|
|
@ -297,9 +398,6 @@ |
|
|
|
this.$set(this.tab_list, this.current, tab_item); |
|
|
|
// this.$refs.uWaterfallFather[this.current].clear(); |
|
|
|
} |
|
|
|
}, |
|
|
|
onShow(){ |
|
|
|
this.windowHeight = getApp().globalData.windowHeight; |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|