第一次提交
This commit is contained in:
wangxiaowei
293
pages/user/my_collect/my_collect.vue
Normal file
293
pages/user/my_collect/my_collect.vue
Normal file
@ -0,0 +1,293 @@
|
||||
<template>
|
||||
<view>
|
||||
<scroll-view scroll-y="true" class="scroll-Y" :style="'height:' + scrollviewHigh + 'px;'" lower-threshold="50"
|
||||
@scrolltolower="scrolltolowerFunc">
|
||||
<view class="shop_list_body">
|
||||
<view class="shop_list_body_item" v-for="(item,index) in shop_list" :key="index">
|
||||
<view class="shop_list_body_item_shop" @click="goto_shop(item.shop_supplier_id)">
|
||||
<view class="shop_list_body_item_shop_logo">
|
||||
<image :src="item.logo"></image>
|
||||
</view>
|
||||
<view class="shop_list_body_item_shop_info">
|
||||
<view class="h1 title">{{item.store_name}}</view>
|
||||
<view class="h3 brand">主营品牌：{{item.categoryName}}</view>
|
||||
<view class="h3 sales">销量{{item.product_sales}}件</view>
|
||||
</view>
|
||||
<view class="shop_list_body_item_shop_others">
|
||||
<view class="h3 attention"><text class="red">{{item.fav_count}}</text>人关注</view>
|
||||
<view class="h3 collect">店铺评分：<text class="red">{{item.score}}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="item.productList.length>0" :class="item.productList.length<3?'shop_list_body_item_product2':'shop_list_body_item_product'">
|
||||
<view class="shop_list_body_item_product_item" v-for="(item2,index2) in item.productList" :key="index2"
|
||||
@click="goto_product(item2.product_id)">
|
||||
<image :src="item2.logo"></image>
|
||||
<view class="shop_list_body_item_product_item_price">
|
||||
<view class="h4 red">¥<text class="h3">{{item2.product_price>1000?item2.product_price*1:item2.product_price}}</text></view>
|
||||
<view class="h6 huaxianjia">¥<text class="h5">{{item2.line_price>1000?item2.line_price*1:item2.line_price}}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 没有记录 -->
|
||||
<view class="d-c-c p30" v-if="shop_list.length==0 && !loading">
|
||||
<text class="iconfont icon-wushuju"></text>
|
||||
<text class="cont">亲，暂无相关记录哦</text>
|
||||
</view>
|
||||
<uni-load-more v-else :loadingType="loadingType"></uni-load-more>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uniLoadMore from "@/components/uni-load-more.vue";
|
||||
export default {
|
||||
components: {
|
||||
uniLoadMore
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
shop_list: [], //店铺列表数据
|
||||
/*底部加载*/
|
||||
loading: true,
|
||||
/*没有更多*/
|
||||
no_more: false,
|
||||
//页面高度
|
||||
scrollviewHigh: '',
|
||||
//当前页
|
||||
page: 1,
|
||||
//总页数
|
||||
last_page: '',
|
||||
isfollow:'',
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
/*加载中状态*/
|
||||
loadingType() {
|
||||
if (this.loading) {
|
||||
return 1;
|
||||
} else {
|
||||
if (this.shop_list.length != 0 && this.no_more) {
|
||||
return 2;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.getData();
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
/*初始化*/
|
||||
init() {
|
||||
let self = this;
|
||||
self.shop_list=[];
|
||||
self.page=1;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
self.scrollviewHigh = res.windowHeight;
|
||||
}
|
||||
});
|
||||
},
|
||||
//获取数据
|
||||
getData() {
|
||||
let self = this;
|
||||
self._post('user.Favorite/list', {
|
||||
page: self.page,
|
||||
type: 10,
|
||||
list_rows: 15,
|
||||
}, (res) => {
|
||||
self.loading = false;
|
||||
self.shop_list = self.shop_list.concat(res.data.list.data);
|
||||
self.last_page = res.data.list.last_page;
|
||||
if (res.data.list.last_page <= 1) {
|
||||
self.no_more = true;
|
||||
} else {
|
||||
self.no_more = false;
|
||||
}
|
||||
})
|
||||
},
|
||||
/*可滚动视图区域到底触发*/
|
||||
scrolltolowerFunc() {
|
||||
let self = this;
|
||||
if (self.no_more) {
|
||||
return;
|
||||
}
|
||||
self.page++;
|
||||
if (self.page <= self.last_page) {
|
||||
self.getData();
|
||||
} else {
|
||||
self.no_more = true;
|
||||
}
|
||||
},
|
||||
//跳转店铺首页
|
||||
goto_shop(shop_supplier_id) {
|
||||
this.gotoPage('/pages/shop/shop?shop_supplier_id=' + shop_supplier_id);
|
||||
},
|
||||
//跳转商品页面
|
||||
goto_product(product_id) {
|
||||
this.gotoPage('/pages/product/detail/detail?product_id=' + product_id);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.h1 {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.h2 {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.h3 {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.h4 {
|
||||
font-size: 20rpx;
|
||||
}
|
||||
|
||||
.h5 {
|
||||
font-size: 16rpx;
|
||||
}
|
||||
|
||||
.h6 {
|
||||
font-size: 12rpx;
|
||||
}
|
||||
|
||||
.huaxianjia {
|
||||
text-decoration: line-through;
|
||||
color: #585858;
|
||||
}
|
||||
|
||||
.shop_list_body {
|
||||
width: 100%;
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.shop_list_body_item {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
max-height: 470rpx;
|
||||
margin-bottom: 30rpx;
|
||||
flex-direction: column;
|
||||
background-color: white;
|
||||
border-radius: 20rpx;
|
||||
padding: 10rpx;
|
||||
border-bottom: 2rpx #f2f2f2 solid;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.shop_list_body_item_shop {
|
||||
width: 100%;
|
||||
height: 150rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10rpx;
|
||||
}
|
||||
|
||||
.shop_list_body_item_shop_logo {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
}
|
||||
|
||||
.shop_list_body_item_shop_logo image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
border-radius: 15rpx;
|
||||
}
|
||||
|
||||
.shop_list_body_item_shop_info {
|
||||
padding: 10rpx;
|
||||
box-sizing: border-box;
|
||||
margin-left: -10%;
|
||||
padding-top: 0;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.shop_list_body_item_shop_others {
|
||||
padding: 10rpx;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
text-align: right;
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.shop_list_body_item_product {
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
background-color: #f2f2f2;
|
||||
padding: 10rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 15rpx;
|
||||
}
|
||||
|
||||
.shop_list_body_item_product2 {
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
background-color: #f2f2f2;
|
||||
padding: 10rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 15rpx;
|
||||
}
|
||||
|
||||
.shop_list_body_item_product2 .shop_list_body_item_product_item {
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
|
||||
.shop_list_body_item_product_item {
|
||||
width: 30%;
|
||||
height: 240rpx;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.shop_list_body_item_product_item image {
|
||||
width: 100%;
|
||||
height: 200rpx;
|
||||
background-color: rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.shop_list_body_item_product_item view {
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-box-orient: vertical;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.shop_list_body_item_product_item_price {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.brand {
|
||||
position: relative;
|
||||
top: -20rpx;
|
||||
color: #585858;
|
||||
}
|
||||
|
||||
.sales {
|
||||
color: #585858;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user