feat: ✨ 楼层装修新增绑定分类功能
学习很差啦
parent
f08d166c86
commit
d01edbdfe2
|
|
@ -1,198 +1,276 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div v-for="(item, index) in res" :key="index" class="goods-row">
|
<!-- 一行两列商品展示 -->
|
||||||
<div class="flex goods-col">
|
<view class="goods-list" v-if="type == 'twoColumns'">
|
||||||
<div class="goods-img" @click="navigateToDetailPage(item)">
|
<view v-for="(item, index) in res" :key="index" class="goods-item">
|
||||||
<u-image width="230rpx" border-radius='16' height="230rpx" :src="item.goodsImage || item.thumbnail">
|
<view class="image-wrapper" @click="navigateToDetailPage(item)">
|
||||||
<u-loading slot="loading"></u-loading>
|
<u-image
|
||||||
</u-image>
|
:src="item.thumbnail"
|
||||||
</div>
|
width="100%"
|
||||||
<div class="goods-detail">
|
height="330rpx"
|
||||||
<div class="title clamp3" @click="navigateToDetailPage(item)">{{ item.goodsName }}</div>
|
mode="aspectFill"
|
||||||
<view class="price-box" @click="navigateToDetailPage(item)">
|
>
|
||||||
<div class="price" v-if="item.price!=undefined">
|
<u-loading slot="loading"></u-loading>
|
||||||
¥<span>{{ $options.filters.goodsFormatPrice(item.price )[0] }} </span>.{{
|
</u-image>
|
||||||
$options.filters.goodsFormatPrice(item.price )[1]
|
</view>
|
||||||
}}
|
<view class="goods-detail">
|
||||||
</div>
|
<div
|
||||||
</view>
|
class="title clamp"
|
||||||
<div class="promotion" @click="navigateToDetailPage(item)">
|
v-html="lightSearchStr(keyword, item.goodsName)"
|
||||||
<div v-if="item.salesModel == 'WHOLESALE'">
|
@click="navigateToDetailPage(item)"
|
||||||
<span>批</span>
|
></div>
|
||||||
</div>
|
<view class="price-box" @click="navigateToDetailPage(item)">
|
||||||
<div v-for="(promotionItem,promotionIndex) in getPromotion(item)" :key="promotionIndex">
|
<div class="price" v-if="item.price != undefined">
|
||||||
<span v-if="promotionItem.indexOf('COUPON') != -1">劵</span>
|
¥<span
|
||||||
<span v-if="promotionItem.indexOf('FULL_DISCOUNT') != -1">满减</span>
|
>{{
|
||||||
<span v-if="promotionItem.indexOf('SECKILL') != -1">秒杀</span>
|
$options.filters.goodsFormatPrice(item.price)[0]
|
||||||
</div>
|
}} </span
|
||||||
</div>
|
>.{{ $options.filters.goodsFormatPrice(item.price)[1] }}
|
||||||
<div style="overflow: hidden" @click="navigateToDetailPage(item)" class="count-config">
|
</div>
|
||||||
<span style="float: left; font-size: 22rpx">已售 {{ item.buyCount || '0' }}</span>
|
</view>
|
||||||
<span style="float: right; font-size: 22rpx">{{ item.commentNum || '0' }}条评论</span>
|
<div class="count-config" @click="navigateToDetailPage(item)">
|
||||||
</div>
|
<span>已售 {{ item.buyCount || "0" }}</span>
|
||||||
|
<span>{{ item.commentNum || "0" }}条评论</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div
|
||||||
|
class="store-seller-name"
|
||||||
</div>
|
v-if="storeName"
|
||||||
</div>
|
@click="navigateToStoreDetailPage(item)"
|
||||||
|
>
|
||||||
|
<div class="text-hidden">
|
||||||
|
<u-tag
|
||||||
|
style="margin-right: 10rpx"
|
||||||
|
size="mini"
|
||||||
|
mode="dark"
|
||||||
|
v-if="item.selfOperated"
|
||||||
|
text="自营"
|
||||||
|
type="error"
|
||||||
|
/>
|
||||||
|
<span>{{ item.storeName || "暂无" }}</span>
|
||||||
|
</div>
|
||||||
|
<span>
|
||||||
|
<u-icon name="arrow-right"></u-icon>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 一行一列商品展示 -->
|
||||||
|
<div v-if="type == 'oneColumns'">
|
||||||
|
<div v-for="(item, index) in res" :key="index" class="goods-row">
|
||||||
|
<div class="flex goods-col">
|
||||||
|
<div class="goods-img" @click="navigateToDetailPage(item)">
|
||||||
|
<u-image
|
||||||
|
width="230rpx"
|
||||||
|
border-radius="16"
|
||||||
|
height="230rpx"
|
||||||
|
:src="item.goodsImage || item.thumbnail"
|
||||||
|
>
|
||||||
|
<u-loading slot="loading"></u-loading>
|
||||||
|
</u-image>
|
||||||
|
</div>
|
||||||
|
<div class="goods-detail">
|
||||||
|
<div class="title clamp3" @click="navigateToDetailPage(item)">
|
||||||
|
{{ item.goodsName }}
|
||||||
|
</div>
|
||||||
|
<view class="price-box" @click="navigateToDetailPage(item)">
|
||||||
|
<div class="price" v-if="item.price != undefined">
|
||||||
|
¥<span
|
||||||
|
>{{ $options.filters.goodsFormatPrice(item.price)[0] }} </span
|
||||||
|
>.{{ $options.filters.goodsFormatPrice(item.price)[1] }}
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<div class="promotion" @click="navigateToDetailPage(item)">
|
||||||
|
<div v-if="item.salesModel == 'WHOLESALE'">
|
||||||
|
<span>批</span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
v-for="(promotionItem, promotionIndex) in getPromotion(item)"
|
||||||
|
:key="promotionIndex"
|
||||||
|
>
|
||||||
|
<span v-if="promotionItem.indexOf('COUPON') != -1">劵</span>
|
||||||
|
<span v-if="promotionItem.indexOf('FULL_DISCOUNT') != -1"
|
||||||
|
>满减</span
|
||||||
|
>
|
||||||
|
<span v-if="promotionItem.indexOf('SECKILL') != -1">秒杀</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
style="overflow: hidden"
|
||||||
|
@click="navigateToDetailPage(item)"
|
||||||
|
class="count-config"
|
||||||
|
>
|
||||||
|
<span style="float: left; font-size: 22rpx"
|
||||||
|
>已售 {{ item.buyCount || "0" }}</span
|
||||||
|
>
|
||||||
|
<span style="float: right; font-size: 22rpx"
|
||||||
|
>{{ item.commentNum || "0" }}条评论</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import commonTpl from '@/components/m-goods-list/common'
|
import commonTpl from "@/components/m-goods-list/common";
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
lightColor: this.$mainColor
|
lightColor: this.$mainColor,
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
mixins: [commonTpl],
|
mixins: [commonTpl],
|
||||||
props: {
|
props: {
|
||||||
// 遍历的数据
|
// 展示的类型
|
||||||
res: {
|
type:{
|
||||||
type: Array,
|
type:String,
|
||||||
default: () => {
|
default:"oneColumns"
|
||||||
return []
|
},
|
||||||
}
|
// 遍历的数据
|
||||||
},
|
res: {
|
||||||
},
|
type: Array,
|
||||||
methods:{
|
default: () => {
|
||||||
// 跳转到商品详情
|
return [];
|
||||||
navigateToDetailPage(item) {
|
},
|
||||||
uni.navigateTo({
|
},
|
||||||
url: `/pages/product/goods?id=${item.id}&goodsId=${item.goodsId}`,
|
},
|
||||||
});
|
methods: {
|
||||||
},
|
// 跳转到商品详情
|
||||||
}
|
navigateToDetailPage(item) {
|
||||||
}
|
uni.navigateTo({
|
||||||
|
url: `/pages/product/goods?id=${item.id}&goodsId=${item.goodsId}`,
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang='scss' scoped>
|
<style lang="scss" scoped>
|
||||||
.goods-list {
|
.goods-list {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
margin: 10rpx 20rpx 284rpx;
|
margin: 10rpx 20rpx 284rpx;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
>.goods-item {
|
> .goods-item {
|
||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
display: flex;
|
display: flex;
|
||||||
border-radius: 16rpx;
|
border-radius: 16rpx;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
width: calc(50% - 30rpx);
|
width: calc(50% - 30rpx);
|
||||||
margin-bottom: 20rpx;
|
margin-bottom: 20rpx;
|
||||||
padding-bottom: 20rpx;
|
padding-bottom: 20rpx;
|
||||||
|
|
||||||
&:nth-child(2n + 1) {
|
&:nth-child(2n + 1) {
|
||||||
margin-right: 20rpx;
|
margin-right: 20rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.image-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
height: 330rpx;
|
||||||
|
border-radius: 16rpx 16rpx 0 0;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.image-wrapper {
|
.count-config,
|
||||||
width: 100%;
|
.store-seller-name {
|
||||||
height: 330rpx;
|
font-size: $font-sm;
|
||||||
border-radius: 16rpx 16rpx 0 0;
|
}
|
||||||
overflow: hidden;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.count-config,
|
.text-hidden {
|
||||||
.store-seller-name {
|
overflow: hidden;
|
||||||
font-size: $font-sm;
|
text-overflow: ellipsis;
|
||||||
}
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.text-hidden {
|
.goods-row {
|
||||||
overflow: hidden;
|
background: #fff;
|
||||||
text-overflow: ellipsis;
|
padding: 16rpx;
|
||||||
white-space: nowrap;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
> .goods-col {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
.goods-row {
|
> .goods-img {
|
||||||
background: #fff;
|
overflow: hidden;
|
||||||
padding: 16rpx;
|
flex: 4;
|
||||||
|
}
|
||||||
|
|
||||||
>.goods-col {
|
> .goods-detail {
|
||||||
display: flex;
|
flex: 7;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
>.goods-img {
|
.goods-detail {
|
||||||
overflow: hidden;
|
margin: 0 20rpx;
|
||||||
flex: 4;
|
|
||||||
}
|
|
||||||
|
|
||||||
>.goods-detail {
|
> .title {
|
||||||
flex: 7;
|
font-size: $font-base;
|
||||||
}
|
color: $font-color-dark;
|
||||||
}
|
line-height: 1.5;
|
||||||
}
|
height: 86rpx;
|
||||||
|
padding: 10rpx 0 0;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
.goods-detail {
|
.promotion {
|
||||||
margin: 0 20rpx;
|
margin-top: 4rpx;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
>.title {
|
div {
|
||||||
font-size: $font-base;
|
span {
|
||||||
color: $font-color-dark;
|
font-size: 24rpx;
|
||||||
line-height: 1.5;
|
color: $light-color;
|
||||||
height: 86rpx;
|
margin-right: 10rpx;
|
||||||
padding: 10rpx 0 0;
|
padding: 0 4rpx;
|
||||||
display: -webkit-box;
|
border-radius: 2rpx;
|
||||||
-webkit-box-orient: vertical;
|
}
|
||||||
-webkit-line-clamp: 2;
|
}
|
||||||
overflow: hidden;
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.promotion {
|
.store-seller-name {
|
||||||
margin-top: 4rpx;
|
color: #666;
|
||||||
display: flex;
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
div {
|
.count-config {
|
||||||
span {
|
padding: 5rpx 0;
|
||||||
font-size: 24rpx;
|
color: #666;
|
||||||
color: $light-color;
|
display: flex;
|
||||||
margin-right: 10rpx;
|
font-size: 24rpx;
|
||||||
padding: 0 4rpx;
|
justify-content: space-between;
|
||||||
border-radius: 2rpx;
|
}
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.store-seller-name {
|
> .price-box {
|
||||||
color: #666;
|
margin-top: 10rpx;
|
||||||
overflow: hidden;
|
display: flex;
|
||||||
display: flex;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
padding-right: 10rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: $font-color-light;
|
||||||
|
|
||||||
.count-config {
|
> .price {
|
||||||
padding: 5rpx 0;
|
font-size: 26rpx;
|
||||||
color: #666;
|
line-height: 1;
|
||||||
display: flex;
|
color: $main-color;
|
||||||
font-size: 24rpx;
|
font-weight: bold;
|
||||||
justify-content: space-between;
|
|
||||||
}
|
|
||||||
|
|
||||||
>.price-box {
|
/deep/ span:nth-of-type(1) {
|
||||||
margin-top: 10rpx;
|
font-size: 38rpx;
|
||||||
display: flex;
|
}
|
||||||
align-items: center;
|
}
|
||||||
justify-content: space-between;
|
}
|
||||||
padding-right: 10rpx;
|
}
|
||||||
font-size: 24rpx;
|
|
||||||
color: $font-color-light;
|
|
||||||
|
|
||||||
>.price {
|
|
||||||
font-size: 26rpx;
|
|
||||||
line-height: 1;
|
|
||||||
color: $main-color;
|
|
||||||
font-weight: bold;
|
|
||||||
|
|
||||||
/deep/ span:nth-of-type(1) {
|
|
||||||
font-size: 38rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -15,6 +15,11 @@ export default {
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
onReachBottom(){
|
||||||
|
// 给子级监听触底加载
|
||||||
|
uni.$emit('onReachBottom',true)
|
||||||
|
},
|
||||||
|
|
||||||
onPullDownRefresh() {
|
onPullDownRefresh() {
|
||||||
this.$refs.tpl.init();
|
this.$refs.tpl.init();
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,21 +1,38 @@
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="layout">
|
<div class="layout">
|
||||||
<u-sticky>
|
<u-sticky>
|
||||||
<div class="goods-cell-title">
|
<div class="goods-cell-title">
|
||||||
<div class="goods-item-title" :class="{ 'selected-title': selected.index == index }"
|
<div
|
||||||
@click="handleClickTitle(title, index)" v-for="(title, index) in res.list[0].titleWay" :key="index">
|
class="goods-item-title"
|
||||||
|
:class="{ 'selected-title': selected.index == index }"
|
||||||
|
@click="handleClickTitle(title, index)"
|
||||||
|
v-for="(title, index) in res.list[0].titleWay"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
<h4 class="h4">{{ title.title }}</h4>
|
<h4 class="h4">{{ title.title }}</h4>
|
||||||
<div>{{ title.desc }}</div>
|
<div>{{ title.desc }}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</u-sticky>
|
</u-sticky>
|
||||||
<div class="goods-list">
|
<div class="goods-list">
|
||||||
<div v-if="item.___index != undefined ? (selected.index == item.___index) : ( selected.val == item.type)"
|
<div
|
||||||
@click="handleClick(item)" class="goods-item" v-for="(item, item_index) in res.list[0].listWay"
|
v-if="
|
||||||
:key="item_index">
|
item.___index != undefined
|
||||||
|
? selected.index == item.___index
|
||||||
|
: selected.val == item.type
|
||||||
|
"
|
||||||
|
@click="handleClick(item)"
|
||||||
|
class="goods-item"
|
||||||
|
v-for="(item, item_index) in res.list[0].listWay"
|
||||||
|
:key="item_index"
|
||||||
|
>
|
||||||
<div class="goods-img">
|
<div class="goods-img">
|
||||||
<u-image :src="item.img" height="350rpx" mode="aspectFit" width="100%">
|
<u-image
|
||||||
|
:src="item.img"
|
||||||
|
height="350rpx"
|
||||||
|
mode="aspectFit"
|
||||||
|
width="100%"
|
||||||
|
>
|
||||||
<u-loading slot="loading"></u-loading>
|
<u-loading slot="loading"></u-loading>
|
||||||
</u-image>
|
</u-image>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -24,9 +41,42 @@
|
||||||
{{ item.title }}
|
{{ item.title }}
|
||||||
</div>
|
</div>
|
||||||
<div class="goods-bottom">
|
<div class="goods-bottom">
|
||||||
<div class="goods-price"> ¥<span>{{ $options.filters.goodsFormatPrice(item.price )[0] }} </span>.{{
|
<div class="goods-price">
|
||||||
$options.filters.goodsFormatPrice(item.price)[1]
|
¥<span
|
||||||
}}</div>
|
>{{ $options.filters.goodsFormatPrice(item.price)[0] }} </span
|
||||||
|
>.{{ $options.filters.goodsFormatPrice(item.price)[1] }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
v-if="res.list[0].titleWay[selected.index].bindCategory && goodsData.length"
|
||||||
|
v-for="(item, index) in goodsData"
|
||||||
|
:key="index"
|
||||||
|
class="goods-item"
|
||||||
|
@click="handleClick(item)"
|
||||||
|
>
|
||||||
|
<div class="goods-img">
|
||||||
|
<u-image
|
||||||
|
:src="item.thumbnail"
|
||||||
|
height="350rpx"
|
||||||
|
mode="aspectFit"
|
||||||
|
width="100%"
|
||||||
|
>
|
||||||
|
<u-loading slot="loading"></u-loading>
|
||||||
|
</u-image>
|
||||||
|
</div>
|
||||||
|
<div class="goods-desc">
|
||||||
|
<div class="goods-title">
|
||||||
|
{{ item.goodsName }}
|
||||||
|
</div>
|
||||||
|
<div class="goods-bottom">
|
||||||
|
<div class="goods-price">
|
||||||
|
¥<span
|
||||||
|
>{{ $options.filters.goodsFormatPrice(item.price)[0] }} </span
|
||||||
|
>.{{ $options.filters.goodsFormatPrice(item.price)[1] }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -34,6 +84,7 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
import { getGoodsList } from "@/api/goods.js";
|
||||||
export default {
|
export default {
|
||||||
title: "商品分类以及商品",
|
title: "商品分类以及商品",
|
||||||
data() {
|
data() {
|
||||||
|
|
@ -42,21 +93,43 @@ export default {
|
||||||
index: 0,
|
index: 0,
|
||||||
val: "",
|
val: "",
|
||||||
},
|
},
|
||||||
|
params: {
|
||||||
|
pageNumber: 1,
|
||||||
|
pageSize: 100,
|
||||||
|
categoryId: "",
|
||||||
|
},
|
||||||
|
goodsData: [], //商品循环内容
|
||||||
|
goodsResult:"", //es总返回内容
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
props: ["res"],
|
props: ["res","enableBottomLoad"],
|
||||||
watch: {
|
watch: {
|
||||||
res: {
|
res: {
|
||||||
handler(val) {
|
handler(val) {
|
||||||
// 监听父级的值 如果有值将值赋给selected
|
// 监听父级的值 如果有值将值赋给selected
|
||||||
if (val) {
|
if (val) {
|
||||||
this.selected.val = this.res.list[0].listWay[0].type;
|
console.log(val)
|
||||||
|
// 如果第一个标签页绑定为商品
|
||||||
|
this.selected.val = this.res.list[0].listWay[0] ? this.res.list[0].listWay[0].type: '';
|
||||||
|
// 如果第一个标签为绑定为分类
|
||||||
|
this.res.list[0].titleWay[0].bindCategory ? this.initGoods(this.res.list[0].titleWay[0]) : ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
immediate: true,
|
immediate: true,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
mounted() {},
|
mounted() {
|
||||||
|
uni.$on('onReachBottom',()=>{
|
||||||
|
if(this.enableBottomLoad && this.goodsResult.totalElements >= this.params.pageNumber * this.params.pageSize){
|
||||||
|
this.params.pageNumber++
|
||||||
|
this.initGoods(this.res.list[0].titleWay[this.selected.index])
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
},
|
||||||
|
destroyed(){
|
||||||
|
uni.$off('onReachBottom')
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleClick(item) {
|
handleClick(item) {
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
|
|
@ -66,9 +139,25 @@ export default {
|
||||||
closeGoods(val, index) {
|
closeGoods(val, index) {
|
||||||
this.res.list[0].listWay.splice(index, 1);
|
this.res.list[0].listWay.splice(index, 1);
|
||||||
},
|
},
|
||||||
|
async initGoods(val) {
|
||||||
|
if(this.enableBottomLoad) this.params.pageSize = 20
|
||||||
|
val ? this.params.categoryId = val.bindCategory.id : '';
|
||||||
|
const res = await getGoodsList(this.params);
|
||||||
|
if (res.data.success) {
|
||||||
|
this.goodsResult = res.data.result
|
||||||
|
const result = res.data.result.content.map(item=>item.content)
|
||||||
|
this.goodsData.push(...result);
|
||||||
|
console.log(this.goodsData)
|
||||||
|
}
|
||||||
|
},
|
||||||
handleClickTitle(val, index) {
|
handleClickTitle(val, index) {
|
||||||
this.selected.index = index;
|
this.selected.index = index;
|
||||||
this.selected.val = val.title;
|
this.selected.val = val.title;
|
||||||
|
if (val.bindCategory) {
|
||||||
|
this.params.pageNumber = 1
|
||||||
|
this.goodsData = []
|
||||||
|
this.initGoods(val);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|
@ -151,7 +240,7 @@ $w_94: 94%;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
> .goods-title {
|
> .goods-title {
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
height: 70rpx;
|
height: 67rpx;
|
||||||
display: -webkit-box;
|
display: -webkit-box;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
-webkit-box-orient: vertical;
|
-webkit-box-orient: vertical;
|
||||||
|
|
@ -165,11 +254,10 @@ $w_94: 94%;
|
||||||
> .goods-price {
|
> .goods-price {
|
||||||
line-height: 2;
|
line-height: 2;
|
||||||
color: $main-color;
|
color: $main-color;
|
||||||
>span{
|
> span {
|
||||||
font-size: 42rpx;
|
font-size: 42rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -42,7 +42,7 @@
|
||||||
<textPicture v-if="item.type == 'textPicture'" :res="item.options" />
|
<textPicture v-if="item.type == 'textPicture'" :res="item.options" />
|
||||||
<menuLayout v-if="item.type == 'menu'" :res="item.options" />
|
<menuLayout v-if="item.type == 'menu'" :res="item.options" />
|
||||||
<flexOne v-if="item.type == 'flexOne'" :res="item.options" />
|
<flexOne v-if="item.type == 'flexOne'" :res="item.options" />
|
||||||
<goods v-if="item.type == 'goods'" :res="item.options" />
|
<goods :enableBottomLoad="enableLoad" v-if="item.type == 'goods'" :res="item.options" />
|
||||||
<group v-if="item.type == 'group'" :res="item.options" />
|
<group v-if="item.type == 'group'" :res="item.options" />
|
||||||
<notice v-if="item.type == 'notice'" :res="item.options" />
|
<notice v-if="item.type == 'notice'" :res="item.options" />
|
||||||
<promotions v-if="item.type == 'promotionDetail'" :res="item.options" />
|
<promotions v-if="item.type == 'promotionDetail'" :res="item.options" />
|
||||||
|
|
@ -85,6 +85,7 @@ export default {
|
||||||
config,
|
config,
|
||||||
pageData: "", //楼层页面数据
|
pageData: "", //楼层页面数据
|
||||||
isIos: "",
|
isIos: "",
|
||||||
|
enableLoad:false, //触底加载 针对于商品模块
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
|
|
@ -124,8 +125,12 @@ export default {
|
||||||
this.pageData = "";
|
this.pageData = "";
|
||||||
getFloorData().then((res) => {
|
getFloorData().then((res) => {
|
||||||
if (res.data.success) {
|
if (res.data.success) {
|
||||||
this.pageData = JSON.parse(res.data.result.pageData);
|
const result = JSON.parse(res.data.result.pageData)
|
||||||
console.log(this.pageData);
|
this.pageData = result;
|
||||||
|
if(result.list.length){
|
||||||
|
// 如果最后一个装修模块是商品模块的话 默认启用自动加载
|
||||||
|
result.list[result.list.length-1] ? result.list[result.list.length-1].model == 'goods' ? this.enableLoad = true : '' : ''
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue