首页增加为你推荐模块
This commit is contained in:
Gaoxs
@ -1,18 +1,20 @@
|
||||
<template>
|
||||
<view class="promotionGood" v-if="benefit.length > 0">
|
||||
<view class="item acea-row row-between-wrapper" v-for="(item, promotionGoodIndex) in benefit" :key="promotionGoodIndex" @click="routerGo(item)">
|
||||
<view class="pictrue"><image :src="item.image" class="image" /></view>
|
||||
<view class="text">
|
||||
<view class="name line1">{{ item.storeName }}</view>
|
||||
<view class="sp-money acea-row">
|
||||
<view class="moneyCon">
|
||||
促销价: ￥
|
||||
<text class="num">{{ item.price }}</text>
|
||||
<view class="goods-box" v-for="(item, promotionGoodIndex) in benefit" :key="promotionGoodIndex" @tap="routerGo(item)">
|
||||
<view class="img-box">
|
||||
<!-- <image class="tag-img" :src="item.image" mode=""></image> -->
|
||||
<image class="img" :src="item.image" lazy-load mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="tip one-t">{{ item.storeName }}</view>
|
||||
<view class="title more-t">{{ item.storeName }}</view>
|
||||
<view class="price-box">
|
||||
<view class="flex x-bc align-end">
|
||||
<view class="current">{{ item.activity_type === 'groupon' ? item.price : item.otPrice }}</view>
|
||||
<view class="sales miso-font">仅剩：{{ item.stock }}{{ item.unitName }}</view>
|
||||
</view>
|
||||
<view class="acea-row row-between-wrapper">
|
||||
<view class="money">日常价：￥{{ item.otPrice }}</view>
|
||||
<view>仅剩：{{ item.stock }}{{ item.unitName }}</view>
|
||||
<view class="x-f tag-box">
|
||||
<!-- <view class="discount">新人礼</view>
|
||||
<view class="discount">满100减60</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -34,3 +36,107 @@ export default {
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.goods-box {
|
||||
width: 345rpx;
|
||||
background: #fff;
|
||||
padding-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.img-box {
|
||||
width: 345rpx;
|
||||
height: 345rpx;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
|
||||
.tag-img {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 2;
|
||||
width: 80rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.img {
|
||||
width: 345rpx;
|
||||
height: 345rpx;
|
||||
background-color: #ccc;
|
||||
}
|
||||
}
|
||||
|
||||
.tip {
|
||||
width: 346rpx;
|
||||
line-height: 56rpx;
|
||||
background: rgba(246, 242, 234, 1);
|
||||
font-size: 22rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
color: rgba(168, 112, 13, 1);
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 24rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
line-height: 36rpx;
|
||||
height: 72rpx;
|
||||
margin: 20rpx 20rpx 10rpx;
|
||||
}
|
||||
|
||||
.price-box {
|
||||
padding: 10rpx 20rpx 0;
|
||||
width: 344rpx;
|
||||
.sales {
|
||||
font-size: 20rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 400;
|
||||
color: rgba(153, 153, 153, 1);
|
||||
line-height: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.current {
|
||||
font-size: 30rpx;
|
||||
font-weight: 500;
|
||||
color: rgba(225, 33, 43, 1);
|
||||
line-height: 30rpx;
|
||||
margin-bottom: 20rpx;
|
||||
&:before {
|
||||
content: '￥';
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.original {
|
||||
font-size: 22rpx;
|
||||
font-weight: 400;
|
||||
text-decoration: line-through;
|
||||
color: rgba(153, 153, 153, 1);
|
||||
margin-left: 14rpx;
|
||||
line-height: 22rpx;
|
||||
margin-bottom: 10rpx;
|
||||
&:before {
|
||||
content: '￥';
|
||||
font-size: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.tag-box {
|
||||
.discount {
|
||||
line-height: 28rpx;
|
||||
border: 1rpx solid rgba(225, 33, 43, 1);
|
||||
border-radius: 8rpx;
|
||||
font-size: 18rpx;
|
||||
font-family: PingFang SC;
|
||||
font-weight: 500;
|
||||
color: rgba(225, 33, 43, 1);
|
||||
padding: 0 8rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
|
||||
// export const VUE_APP_API_URL = 'http://natapp.xinxintuan.co/api';
|
||||
export const VUE_APP_API_URL = 'https://wxapi.yixiang.co/api';
|
||||
// export const VUE_APP_API_URL = 'https://h5api.dayouqiantu.cn/api';
|
||||
// export const VUE_APP_API_URL = 'https://wxapi.yixiang.co/api';
|
||||
export const VUE_APP_API_URL = 'https://h5api.xinxintuan.co/api';
|
||||
export const VUE_APP_RESOURCES_URL = 'https://h5.yixiang.co/static';
|
||||
|
||||
@ -38,90 +38,6 @@
|
||||
|
||||
<Menu :list="menus"></Menu>
|
||||
|
||||
<uni-notice-bar scrollable="true" @click="goRoll(singNew)" single="true" :speed="10" showIcon="true" :text="singNew.info"></uni-notice-bar>
|
||||
<view class="wrapper hot" v-if="bastList.length > 0">
|
||||
<image class="bg" src="../../static/images/index-bg.png" mode="widthFix"></image>
|
||||
<view class="title no-border acea-row row-between-wrapper">
|
||||
<div class="text line1">
|
||||
<span class="iconfont icon-remen"></span>
|
||||
<span class="label">热门榜单</span>
|
||||
</div>
|
||||
<view @click="goHotNewGoods(2)" class="more">
|
||||
更多
|
||||
<text class="iconfont icon-jiantou"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="newProducts">
|
||||
<scroll-view :show-scrollbar="false" scroll-y="false" scroll-x="true">
|
||||
<view class="newProductsScroll">
|
||||
<view @click="goGoodsCon(item)" class="newProductsItem" v-for="(item, likeInfoIndex) in likeInfo" :key="likeInfoIndex">
|
||||
<view class="img-box">
|
||||
<image :src="item.image" />
|
||||
</view>
|
||||
<view class="pro-info line1"><text>{{ item.storeName }}</text></view>
|
||||
<view class="money font-color-red"><text>￥{{ item.price }}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wrapper" v-if="bastList.length > 0">
|
||||
<view class="title no-border acea-row row-between-wrapper">
|
||||
<view class="text">
|
||||
<div class="name line1">
|
||||
<span class="iconfont icon-jingpintuijian"></span>
|
||||
<span class="label">精品推荐</span>
|
||||
</div>
|
||||
</view>
|
||||
<view @click="goHotNewGoods(1)" class="more">
|
||||
更多
|
||||
<text class="iconfont icon-jiantou"></text>
|
||||
</view>
|
||||
</view>
|
||||
<Good-list :good-list="bastList" :is-sort="false"></Good-list>
|
||||
</view>
|
||||
|
||||
<view class="wrapper" v-if="firstList.length > 0">
|
||||
<view class="title acea-row row-between-wrapper">
|
||||
<view class="text">
|
||||
<view class="name line1">
|
||||
<span class="iconfont icon-xinpin"></span>
|
||||
<span class="label">首发新品</span>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="goHotNewGoods(3)" class="more">
|
||||
更多
|
||||
<text class="iconfont icon-jiantou"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="newProducts">
|
||||
<scroll-view :show-scrollbar="false" scroll-y="false" scroll-x="true">
|
||||
<view class="newProductsScroll">
|
||||
<view @click="goGoodsCon(item)" class="newProductsItem" v-for="(item, firstListIndex) in firstList" :key="firstListIndex">
|
||||
<view class="img-box">
|
||||
<image :src="item.image" />
|
||||
</view>
|
||||
<view class="pro-info line1">{{ item.storeName }}</view>
|
||||
<view class="money font-color-red">￥{{ item.price }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wrapper" v-if="benefit.length > 0">
|
||||
<view class="title acea-row row-center">
|
||||
<view class="text text-center">
|
||||
<div class="name line1 new-name">
|
||||
<span class="iconfont icon-shoucang"></span>
|
||||
<span class="txt">猜你喜欢</span>
|
||||
</div>
|
||||
</view>
|
||||
<!-- <view @click="goGoodsPromotion(4)" class="more">
|
||||
更多
|
||||
<text class="iconfont icon-jiantou"></text>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
<PromotionGood :benefit="benefit"></PromotionGood>
|
||||
<Coupon-window :coupon-list="couponList" v-if="showCoupon" @checked="couponClose" @close="couponClose"></Coupon-window>
|
||||
</view>
|
||||
@ -129,7 +45,6 @@
|
||||
<script>
|
||||
import colorThief from 'miniapp-color-thief';
|
||||
|
||||
// import { swiper, swiperSlide } from "vue-awesome-swiper";
|
||||
import {
|
||||
mapState,
|
||||
mapMutations,
|
||||
@ -161,7 +76,7 @@
|
||||
GoodList,
|
||||
PromotionGood,
|
||||
CouponWindow,
|
||||
Menu
|
||||
Menu,
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
@ -179,6 +94,7 @@
|
||||
logoUrl: '',
|
||||
banner: [],
|
||||
menus: [],
|
||||
|
||||
roll: [],
|
||||
activity: [],
|
||||
activityOne: {},
|
||||
|
||||
Reference in New Issue
Block a user