界面优化
This commit is contained in:
jia
parent
91f47b8021
commit
6c2bf15dd0
@ -37,78 +37,6 @@
|
||||
</view>
|
||||
<view class="goodslist">
|
||||
<WaterfallsFlow :wfList='cateGoods' />
|
||||
|
||||
<!-- <view class="goods">
|
||||
<view v-for="(item,index) in cateGoods" :key="index">
|
||||
|
||||
<view :class="[index%2==0?'goods_item':'goods_items']" @click="gogogo(item)">
|
||||
<view class="kk" v-if="index%2==0">
|
||||
|
||||
<image :src="item.image[0]" mode="aspectFit" style="width:'365rpx';height:251rpx">
|
||||
</image>
|
||||
</view>
|
||||
<view style="width:'365rpx';height:336rpx" v-else>
|
||||
<image :src="item.image[0]" mode="aspectFit" style="width:'365rpx';height:336rpx">
|
||||
</image>
|
||||
</view>
|
||||
<view class="goods_item_img" v-if="item.video_link.length>0">
|
||||
<image src="@/static/images/sp.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="botm">
|
||||
<view class="title">{{item.title}}</view>
|
||||
<view class="goods_info flex_a_c">
|
||||
<view class="l_info flex_a_c">
|
||||
<image :src="(item.author && item.author.avatar) || '/static/images/f.png'"
|
||||
mode="aspectFit" class="g_img"></image>
|
||||
<view class="g_name">{{item.author && item.author.nickname}}</view>
|
||||
</view>
|
||||
<view class="nice_box" @click.stop="giveStart(item)">
|
||||
<text class="iconfont"
|
||||
:class="item.relevance_id ? 'icon-shoucang1' : 'icon-dianzan'"></text>
|
||||
<text class="collect">{{item.count_start}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<!--<view class="goods">
|
||||
<view v-for="(item,i) in cateGoods" :key="i" v-if='i%2!=0'>
|
||||
<view class="goods_item" @click="gogogo(item)">
|
||||
<view style="height: 251rpx;">
|
||||
<u--image :src="item.image[0]" width="356rpx" height="251rpx" :showLoading="true"
|
||||
lazyLoad fade duration="450">
|
||||
<template v-slot:loading>
|
||||
<u-loading-icon color="#f5f5f5"></u-loading-icon>
|
||||
</template>
|
||||
</u--image>
|
||||
</view>
|
||||
|
||||
<view class="goods_item_img" v-if="item.video_link.length>0">
|
||||
<image src="@/static/images/sp.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="botm">
|
||||
<view class="title">{{item.title}}</view>
|
||||
<view class="goods_info flex_a_c">
|
||||
<view class="l_info flex_a_c">
|
||||
<image :src="(item.author && item.author.avatar) || '/static/images/f.png'"
|
||||
mode="aspectFit" class="g_img"></image>
|
||||
<view class="g_name">{{item.author && item.author.nickname}}</view>
|
||||
</view>
|
||||
<view class="nice_box" @click.stop="giveStart(item)">
|
||||
<text class="iconfont"
|
||||
:class="item.relevance_id ? 'icon-shoucang1' : 'icon-dianzan'"></text>
|
||||
<text class="collect">{{item.count_start}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
-->
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
<view class="empty_wrapper" v-if="emptyShow">
|
||||
<u-empty :show="emptyShow" mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png"></u-empty>
|
||||
@ -226,7 +154,6 @@
|
||||
this.getCateList()
|
||||
this.cateGoods = []
|
||||
this.getGoods()
|
||||
|
||||
this.Area()
|
||||
uni.stopPullDownRefresh()
|
||||
},
|
||||
@ -257,7 +184,6 @@
|
||||
onReachBottom() {
|
||||
if (this.status == 'nomore') return;
|
||||
this.status = 'loading';
|
||||
|
||||
this.where.page = ++this.where.page;
|
||||
this.getGoods()
|
||||
},
|
||||
@ -479,6 +405,7 @@
|
||||
|
||||
graphicLstApi(this.where).then(res => {
|
||||
this.cateGoods.push(...res.data.list)
|
||||
|
||||
if (res.data.list.length < this.where.limit) this.status = 'nomore'
|
||||
|
||||
if (this.where.page == 1 && res.data.list.length <= 0) this.emptyShow = true
|
||||
@ -513,6 +440,7 @@
|
||||
this.cateGoods = []
|
||||
this.where.category_id = item.category_id
|
||||
this.emptyShow = false
|
||||
this.status = 'loadmore'
|
||||
this.where.page = 1
|
||||
this.getGoods(item)
|
||||
this.street_id = item.id
|
||||
|
||||
@ -5,7 +5,8 @@
|
||||
<view class="site-box flex_a_c_j_sb" :style="{'background-color':backColor}">
|
||||
|
||||
<view :class="['place_wrapper','flex_a_c',isFshow?'sitebox':'']" @click="selectLocation">
|
||||
<view :class="['iconfont','icon-weizhi',isFshow?'sitebox':'']" style="color:#000;margin-left: 20rpx;">
|
||||
<view :class="['iconfont','icon-weizhi',isFshow?'sitebox':'']"
|
||||
style="color:#000;margin-left: 20rpx;">
|
||||
</view>
|
||||
<view class="town_name" style="color:#000;">{{street}}</view>
|
||||
</view>
|
||||
@ -18,20 +19,13 @@
|
||||
</view>
|
||||
|
||||
|
||||
<zbpSwiper
|
||||
:isSelectPlace="true"
|
||||
:town="street"
|
||||
:streetname="street"
|
||||
:location_Arr="locationArr"
|
||||
@change="dchange"
|
||||
>
|
||||
<zbpSwiper :isSelectPlace="true" :town="street" :streetname="street" :location_Arr="locationArr"
|
||||
@change="dchange">
|
||||
</zbpSwiper>
|
||||
|
||||
<view class="list">
|
||||
<navigator
|
||||
hover-class="none"
|
||||
:url="`/pages/nongKe/supply_chain/supplier?type_id=10&street_id=${street_id}`"
|
||||
>
|
||||
<navigator hover-class="none"
|
||||
:url="`/pages/nongKe/supply_chain/supplier?type_id=10&street_id=${street_id}`">
|
||||
<view class="list-m">
|
||||
<image src="@/static/images/f6.png" mode="aspectFit"></image>
|
||||
<view class="list-title">
|
||||
@ -80,10 +74,7 @@
|
||||
</view>
|
||||
|
||||
<view class="list-con">
|
||||
<view
|
||||
class="list-con-left"
|
||||
@tap="navgo('/pages/nongKe/specialty/index')"
|
||||
>
|
||||
<view class="list-con-left" @tap="navgo('/pages/nongKe/specialty/index')">
|
||||
<!-- <view class="list-con-title">
|
||||
<view class="con-titlea">
|
||||
名优特产
|
||||
@ -95,11 +86,7 @@
|
||||
<image src="@/static/images/f5.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
<view class="list-con-right">
|
||||
<view
|
||||
class="con-right"
|
||||
style="margin-bottom: 20rpx"
|
||||
@click="navaction(1)"
|
||||
>
|
||||
<view class="con-right" style="margin-bottom: 20rpx" @click="navaction(1)">
|
||||
<!-- <view class="list-con-title">
|
||||
<view class="con-titlea">
|
||||
当地美食
|
||||
@ -130,24 +117,12 @@
|
||||
<WaterfallsFlow :wfList="cateGoods" />
|
||||
</view>
|
||||
<view class="empty_wrapper" v-if="emptyShow">
|
||||
<u-empty
|
||||
:show="emptyShow"
|
||||
mode="list"
|
||||
icon="http://cdn.uviewui.com/uview/empty/list.png"
|
||||
></u-empty>
|
||||
<u-empty :show="emptyShow" mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png"></u-empty>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<u-picker
|
||||
:defaultIndex="[0, 0]"
|
||||
:show="showPicker"
|
||||
ref="uPicker"
|
||||
:columns="columnData"
|
||||
@confirm="confirm"
|
||||
@cancel="showPicker = false"
|
||||
@change="changeHandler"
|
||||
keyName="name"
|
||||
></u-picker>
|
||||
<u-picker :defaultIndex="[0, 0]" :show="showPicker" ref="uPicker" :columns="columnData" @confirm="confirm"
|
||||
@cancel="showPicker = false" @change="changeHandler" keyName="name"></u-picker>
|
||||
<u-loadmore :status="status" v-if="cateGoods.length >= where.limit" />
|
||||
|
||||
<view class="location" v-if="isshow">
|
||||
@ -158,41 +133,41 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import mTabbar from '@/components/m-tabbar/m-tabbar.vue'
|
||||
import zbpSwiper from '@/components/zbpSwiper'
|
||||
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||
import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlowo.vue'
|
||||
import Cache from '@/utils/cache';
|
||||
import {
|
||||
import mTabbar from '@/components/m-tabbar/m-tabbar.vue'
|
||||
import zbpSwiper from '@/components/zbpSwiper'
|
||||
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||
import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlowo.vue'
|
||||
import Cache from '@/utils/cache';
|
||||
import {
|
||||
getSlideAPI
|
||||
} from '@/api/lihai.js'
|
||||
import {
|
||||
} from '@/api/lihai.js'
|
||||
import {
|
||||
graphicLstApi,
|
||||
getTopicList,
|
||||
graphicStartApi
|
||||
} from '@/api/community.js'
|
||||
import {
|
||||
} from '@/api/community.js'
|
||||
import {
|
||||
getIndexData,
|
||||
getDiy,
|
||||
|
||||
} from '@/api/api.js'
|
||||
} from '@/api/api.js'
|
||||
|
||||
import {
|
||||
import {
|
||||
spuInfo
|
||||
} from '@/api/product.js';
|
||||
import {
|
||||
} from '@/api/product.js';
|
||||
import {
|
||||
getGeocoder,
|
||||
merClassifly,
|
||||
getProductHot
|
||||
} from '@/api/store.js';
|
||||
import {
|
||||
} from '@/api/store.js';
|
||||
import {
|
||||
getArea,
|
||||
getStreet
|
||||
} from '@/api/article.js';
|
||||
import {
|
||||
} from '@/api/article.js';
|
||||
import {
|
||||
Toast
|
||||
} from '@/libs/uniApi'
|
||||
export default {
|
||||
} from '@/libs/uniApi'
|
||||
export default {
|
||||
components: {
|
||||
mTabbar,
|
||||
zbpSwiper,
|
||||
@ -333,7 +308,7 @@ export default {
|
||||
this.cateGoods.push(...res.data.list)
|
||||
})
|
||||
} else {
|
||||
getProductHot(this.where.page,this.where.limit).then(res => {
|
||||
getProductHot(this.where.page, this.where.limit).then(res => {
|
||||
this.cateGoods.push(...res.data.list)
|
||||
})
|
||||
}
|
||||
@ -542,21 +517,21 @@ export default {
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
/deep/.color-lump {
|
||||
/deep/.color-lump {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
page {
|
||||
page {
|
||||
background: #f4f7fe;
|
||||
|
||||
// background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.location {
|
||||
.location {
|
||||
background-color: #f6f6f6;
|
||||
width: 680rpx;
|
||||
height: 150rpx;
|
||||
@ -581,20 +556,20 @@ page {
|
||||
font-size: 20rpx;
|
||||
color: #5a5a5a;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.Circle_friends {
|
||||
.Circle_friends {
|
||||
position: relative;
|
||||
padding: 0 0 87.72rpx 0;
|
||||
}
|
||||
}
|
||||
|
||||
.sitebox {
|
||||
.sitebox {
|
||||
animation-name: fadeIn;
|
||||
animation-duration: 3s;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
@ -602,9 +577,9 @@ page {
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.site-box {
|
||||
.site-box {
|
||||
width: 100%;
|
||||
/* #ifdef MP || APP-PLUS */
|
||||
height: 160rpx;
|
||||
@ -645,42 +620,42 @@ page {
|
||||
font-size: 30rpx;
|
||||
font-size: 35.09rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.circle_friends_wrapper {
|
||||
.circle_friends_wrapper {
|
||||
position: relative;
|
||||
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.u-tabs__wrapper__nav__line {
|
||||
/deep/.u-tabs__wrapper__nav__line {
|
||||
width: 46rpx;
|
||||
}
|
||||
}
|
||||
|
||||
/deep/.u-tabs__wrapper__nav__item {
|
||||
/deep/.u-tabs__wrapper__nav__item {
|
||||
padding: 0 0px;
|
||||
padding-right: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.search_wrapper {
|
||||
.search_wrapper {
|
||||
width: 694.74rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs_wrapper {
|
||||
.tabs_wrapper {
|
||||
width: 720rpx;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 21.05rpx;
|
||||
// margin-left: -20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.empty_wrapper {
|
||||
.empty_wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.article_box {
|
||||
.article_box {
|
||||
height: 100%;
|
||||
width: 694.74rpx;
|
||||
margin: 0 auto;
|
||||
@ -731,9 +706,9 @@ page {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabs_wrapper {
|
||||
.tabs_wrapper {
|
||||
width: 723rpx;
|
||||
margin: 0rpx auto;
|
||||
margin-bottom: 21.05rpx;
|
||||
@ -751,9 +726,9 @@ page {
|
||||
margin-right: 7.02rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list {
|
||||
.list {
|
||||
display: flex;
|
||||
padding: 12rpx;
|
||||
justify-content: space-between;
|
||||
@ -776,19 +751,22 @@ page {
|
||||
position: relative;
|
||||
|
||||
.titlea-con {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
width: 96rpx;
|
||||
height: 100rpx;
|
||||
|
||||
color: #f4f7fe;
|
||||
|
||||
.titlea {
|
||||
margin-top: 12rpx;
|
||||
position: absolute;
|
||||
top: 32rpx;
|
||||
margin-left: 12rpx;
|
||||
font-size: 16rpx;
|
||||
font-family: PingFang SC-Semibold, PingFang SC;
|
||||
}
|
||||
|
||||
.titleb {
|
||||
margin-top: 6rpx;
|
||||
position: absolute;
|
||||
bottom:8rpx;
|
||||
font-size: 37rpx;
|
||||
font-family: PingFang SC-Semibold, PingFang SC;
|
||||
font-weight: 600;
|
||||
@ -824,10 +802,11 @@ page {
|
||||
.list-title-info {
|
||||
// width: 98rpx;
|
||||
height: 30rpx;
|
||||
line-height: 30rpx;
|
||||
background: #ffffff;
|
||||
padding: 2rpx 2rpx;
|
||||
display: flex;
|
||||
font-size: 10rpx;
|
||||
|
||||
font-size: 18rpx;
|
||||
font-family: PingFang SC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
@ -856,9 +835,9 @@ page {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list-con {
|
||||
.list-con {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: -10rpx;
|
||||
@ -935,9 +914,9 @@ page {
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list-bon {
|
||||
.list-bon {
|
||||
width: 724rpx;
|
||||
height: 128rpx;
|
||||
margin: 0 auto;
|
||||
@ -947,10 +926,10 @@ page {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.goodslist {
|
||||
.goodslist {
|
||||
margin: 0 auto;
|
||||
width: 725rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user