add
This commit is contained in:
Gao xiaosong
@ -1,313 +1,269 @@
|
||||
<template>
|
||||
<view class="index">
|
||||
<view class="header acea-row row-center-wrapper">
|
||||
<view @click="goGoodSearch()" class="search acea-row row-middle">
|
||||
<text class="iconfont icon-xiazai5"></text>搜索商品
|
||||
</view>
|
||||
</view>
|
||||
<view class="slider-banner banner">
|
||||
<swiper indicatorDots="true" v-if="banner.length > 0">
|
||||
<block v-for="(item, bannerIndex) in banner" :key="bannerIndex">
|
||||
<swiper-item>
|
||||
<view @click="item.url?$yrouter.push('/'+item.url) : ''" class="swiper-item">
|
||||
<image :src="item.pic" />
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="news acea-row row-between-wrapper">
|
||||
<view class="pictrue" v-if="$VUE_APP_RESOURCES_URL">
|
||||
<image :src="$VUE_APP_RESOURCES_URL+'/images/news.png'" />
|
||||
</view>
|
||||
<view class="swiper-no-swiping new-banner">
|
||||
<swiper
|
||||
class="swiper-wrapper"
|
||||
v-if="roll.length > 0"
|
||||
:indicator-dots="false"
|
||||
autoplay
|
||||
circular
|
||||
vertical
|
||||
>
|
||||
<block v-for="(item, rollIndex) in roll" :key="rollIndex">
|
||||
<swiper-item class="swiper-slide">
|
||||
<view
|
||||
@click="item.uniapp_url?$yrouter.push(item.uniapp_url) : ''"
|
||||
class="swiper-item acea-row row-between-wrapper"
|
||||
>
|
||||
<view class="text acea-row row-between-wrapper">
|
||||
<view class="label" v-if="item.show === '是'">最新</view>
|
||||
<view class="newsTitle line1">{{ item.info }}</view>
|
||||
</view>
|
||||
<view class="iconfont icon-xiangyou"></view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
<view class="nav acea-row">
|
||||
<view
|
||||
@click="goWxappUrl(item)"
|
||||
class="item"
|
||||
v-for="(item, menusIndex) in menus"
|
||||
:key="menusIndex"
|
||||
>
|
||||
<view class="pictrue">
|
||||
<image :src="item.pic" />
|
||||
</view>
|
||||
<view>{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wrapper hot" v-if="bastList.length > 0">
|
||||
<image class="bg" src="../../static/images/index-bg.png" mode="widthFix" ></image>
|
||||
<view class="title acea-row row-between-wrapper">
|
||||
<view class="text">
|
||||
<view class="name line1">热门榜单</view>
|
||||
</view>
|
||||
<view @click="goHotNewGoods()" class="more">
|
||||
更多
|
||||
<text class="iconfont icon-jiantou"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="newProducts">
|
||||
<scroll-view 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">{{ item.storeName }}</view>
|
||||
<view class="money font-color-red">￥{{ item.price }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wrapper" v-if="bastList.length > 0">
|
||||
<view class="title acea-row row-between-wrapper">
|
||||
<view class="text">
|
||||
<view class="name line1">精品推荐</view>
|
||||
</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="index">
|
||||
<view class="header acea-row row-center-wrapper">
|
||||
<view @click="goGoodSearch()" class="search acea-row row-middle">
|
||||
<text class="iconfont icon-xiazai5"></text>
|
||||
搜索商品
|
||||
</view>
|
||||
</view>
|
||||
<view class="slider-banner banner">
|
||||
<swiper indicatorDots="true" v-if="banner.length > 0">
|
||||
<block v-for="(item, bannerIndex) in banner" :key="bannerIndex">
|
||||
<swiper-item>
|
||||
<view @click="item.url ? $yrouter.push('/' + item.url) : ''" class="swiper-item"><image :src="item.pic" /></view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="news acea-row row-between-wrapper">
|
||||
<view class="pictrue" v-if="$VUE_APP_RESOURCES_URL"><image :src="$VUE_APP_RESOURCES_URL + '/images/news.png'" /></view>
|
||||
<view class="swiper-no-swiping new-banner">
|
||||
<swiper class="swiper-wrapper" v-if="roll.length > 0" :indicator-dots="false" autoplay circular vertical>
|
||||
<block v-for="(item, rollIndex) in roll" :key="rollIndex">
|
||||
<swiper-item class="swiper-slide">
|
||||
<view @click="item.uniapp_url ? $yrouter.push(item.uniapp_url) : ''" class="swiper-item acea-row row-between-wrapper">
|
||||
<view class="text acea-row row-between-wrapper">
|
||||
<view class="label" v-if="item.show === '是'">最新</view>
|
||||
<view class="newsTitle line1">{{ item.info }}</view>
|
||||
</view>
|
||||
<view class="iconfont icon-xiangyou"></view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
<view class="nav acea-row">
|
||||
<view @click="goWxappUrl(item)" class="item" v-for="(item, menusIndex) in menus" :key="menusIndex">
|
||||
<view class="pictrue"><image :src="item.pic" /></view>
|
||||
<view>{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wrapper hot" v-if="bastList.length > 0">
|
||||
<image class="bg" src="../../static/images/index-bg.png" mode="widthFix"></image>
|
||||
<view class="title acea-row row-between-wrapper">
|
||||
<view class="text"><view class="name line1">热门榜单</view></view>
|
||||
<view @click="goHotNewGoods()" class="more">
|
||||
更多
|
||||
<text class="iconfont icon-jiantou"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="newProducts">
|
||||
<scroll-view 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">{{ item.storeName }}</view>
|
||||
<view class="money font-color-red">￥{{ item.price }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="wrapper" v-if="bastList.length > 0">
|
||||
<view class="title acea-row row-between-wrapper">
|
||||
<view class="text"><view class="name line1">精品推荐</view></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">
|
||||
首发新品
|
||||
<text class="new font-color-red">NEW~</text>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="goHotNewGoods(3)" class="more">
|
||||
更多
|
||||
<text class="iconfont icon-jiantou"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="newProducts">
|
||||
<scroll-view 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-between-wrapper">
|
||||
<view class="text">
|
||||
<view class="name line1">促销单品</view>
|
||||
</view>
|
||||
<view @click="goGoodsPromotion()" 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>
|
||||
<view class="wrapper" v-if="firstList.length > 0">
|
||||
<view class="title acea-row row-between-wrapper">
|
||||
<view class="text">
|
||||
<view class="name line1">
|
||||
首发新品
|
||||
<text class="new font-color-red">NEW~</text>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="goHotNewGoods(3)" class="more">
|
||||
更多
|
||||
<text class="iconfont icon-jiantou"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="newProducts">
|
||||
<scroll-view 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-between-wrapper">
|
||||
<view class="text"><view class="name line1">促销单品</view></view>
|
||||
<view @click="goGoodsPromotion()" 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>
|
||||
</template>
|
||||
<script>
|
||||
// import { swiper, swiperSlide } from "vue-awesome-swiper";
|
||||
|
||||
import GoodList from "@/components/GoodList";
|
||||
import PromotionGood from "@/components/PromotionGood";
|
||||
import CouponWindow from "@/components/CouponWindow";
|
||||
import { getHomeData, getShare } from "@/api/public";
|
||||
import cookie from "@/utils/store/cookie";
|
||||
import { isWeixin } from "@/utils/index";
|
||||
import GoodList from '@/components/GoodList';
|
||||
import PromotionGood from '@/components/PromotionGood';
|
||||
import CouponWindow from '@/components/CouponWindow';
|
||||
import { getHomeData, getShare } from '@/api/public';
|
||||
import cookie from '@/utils/store/cookie';
|
||||
import { isWeixin } from '@/utils/index';
|
||||
|
||||
const HAS_COUPON_WINDOW = "has_coupon_window";
|
||||
const HAS_COUPON_WINDOW = 'has_coupon_window';
|
||||
|
||||
export default {
|
||||
name: "Index",
|
||||
components: {
|
||||
// swiper,
|
||||
// swiperSlide,
|
||||
GoodList,
|
||||
PromotionGood,
|
||||
CouponWindow
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
showCoupon: false,
|
||||
logoUrl: "",
|
||||
banner: [],
|
||||
menus: [],
|
||||
roll: [],
|
||||
activity: [],
|
||||
activityOne: {},
|
||||
bastList: [],
|
||||
firstList: [],
|
||||
info: {
|
||||
fastList: [],
|
||||
bastBanner: [],
|
||||
name: 'Index',
|
||||
components: {
|
||||
// swiper,
|
||||
// swiperSlide,
|
||||
GoodList,
|
||||
PromotionGood,
|
||||
CouponWindow
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
showCoupon: false,
|
||||
logoUrl: '',
|
||||
banner: [],
|
||||
menus: [],
|
||||
roll: [],
|
||||
activity: [],
|
||||
activityOne: {},
|
||||
bastList: [],
|
||||
firstList: [],
|
||||
info: {
|
||||
fastList: [],
|
||||
bastBanner: [],
|
||||
|
||||
bastList: []
|
||||
},
|
||||
likeInfo: [],
|
||||
lovely: [],
|
||||
benefit: [],
|
||||
couponList: [],
|
||||
swiperOption: {
|
||||
pagination: {
|
||||
el: ".swiper-pagination",
|
||||
clickable: true
|
||||
},
|
||||
autoplay: {
|
||||
disableOnInteraction: false,
|
||||
delay: 2000
|
||||
},
|
||||
loop: true,
|
||||
speed: 1000,
|
||||
observer: true,
|
||||
observeParents: true
|
||||
},
|
||||
swiperRoll: {
|
||||
direction: "vertical",
|
||||
autoplay: {
|
||||
disableOnInteraction: false,
|
||||
delay: 2000
|
||||
},
|
||||
loop: true,
|
||||
speed: 1000,
|
||||
observer: true,
|
||||
observeParents: true
|
||||
},
|
||||
swiperScroll: {
|
||||
freeMode: true,
|
||||
freeModeMomentum: false,
|
||||
slidesPerView: "auto",
|
||||
observer: true,
|
||||
observeParents: true
|
||||
},
|
||||
swiperBoutique: {
|
||||
pagination: {
|
||||
el: ".swiper-pagination",
|
||||
clickable: true
|
||||
},
|
||||
autoplay: {
|
||||
disableOnInteraction: false,
|
||||
delay: 2000
|
||||
},
|
||||
loop: true,
|
||||
speed: 1000,
|
||||
observer: true,
|
||||
observeParents: true
|
||||
},
|
||||
swiperProducts: {
|
||||
freeMode: true,
|
||||
freeModeMomentum: false,
|
||||
slidesPerView: "auto",
|
||||
observer: true,
|
||||
observeParents: true
|
||||
}
|
||||
};
|
||||
},
|
||||
onShow: function() {
|
||||
let that = this;
|
||||
uni.showLoading({
|
||||
title:'加载中'
|
||||
})
|
||||
getHomeData().then(res => {
|
||||
that.logoUrl = res.data.logoUrl;
|
||||
that.$set(that, "banner", res.data.banner);
|
||||
that.$set(that, "menus", res.data.menus);
|
||||
that.$set(that, "roll", res.data.roll);
|
||||
that.$set(that, "activity", res.data.activity);
|
||||
var activityOne = res.data.activity.shift();
|
||||
that.$set(that, "activityOne", activityOne);
|
||||
that.$set(that, "info", res.data.info);
|
||||
that.$set(that, "firstList", res.data.firstList);
|
||||
that.$set(that, "bastList", res.data.bastList);
|
||||
that.$set(that, "likeInfo", res.data.likeInfo);
|
||||
that.$set(that, "lovely", res.data.lovely);
|
||||
that.$set(that, "benefit", res.data.benefit);
|
||||
that.$set(that, "couponList", res.data.couponList);
|
||||
uni.hideLoading()
|
||||
that.setOpenShare();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
goGoodSearch() {
|
||||
this.$yrouter.push("/pages/shop/GoodSearch/index");
|
||||
},
|
||||
goWxappUrl(item) {
|
||||
this.$yrouter.push(item.uniapp_url);
|
||||
},
|
||||
goHotNewGoods(type) {
|
||||
this.$yrouter.push({
|
||||
path: "/pages/shop/HotNewGoods/index",
|
||||
query: { type }
|
||||
});
|
||||
},
|
||||
goGoodsCon(item) {
|
||||
console.log(item)
|
||||
this.$yrouter.push({
|
||||
path: "/pages/shop/GoodsCon/index",
|
||||
query: { id: item.id }
|
||||
});
|
||||
},
|
||||
goGoodsPromotion() {
|
||||
this.$yrouter.push("/pages/shop/GoodsPromotion/index");
|
||||
},
|
||||
setOpenShare: function() {}
|
||||
}
|
||||
bastList: []
|
||||
},
|
||||
likeInfo: [],
|
||||
lovely: [],
|
||||
benefit: [],
|
||||
couponList: [],
|
||||
swiperOption: {
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true
|
||||
},
|
||||
autoplay: {
|
||||
disableOnInteraction: false,
|
||||
delay: 2000
|
||||
},
|
||||
loop: true,
|
||||
speed: 1000,
|
||||
observer: true,
|
||||
observeParents: true
|
||||
},
|
||||
swiperRoll: {
|
||||
direction: 'vertical',
|
||||
autoplay: {
|
||||
disableOnInteraction: false,
|
||||
delay: 2000
|
||||
},
|
||||
loop: true,
|
||||
speed: 1000,
|
||||
observer: true,
|
||||
observeParents: true
|
||||
},
|
||||
swiperScroll: {
|
||||
freeMode: true,
|
||||
freeModeMomentum: false,
|
||||
slidesPerView: 'auto',
|
||||
observer: true,
|
||||
observeParents: true
|
||||
},
|
||||
swiperBoutique: {
|
||||
pagination: {
|
||||
el: '.swiper-pagination',
|
||||
clickable: true
|
||||
},
|
||||
autoplay: {
|
||||
disableOnInteraction: false,
|
||||
delay: 2000
|
||||
},
|
||||
loop: true,
|
||||
speed: 1000,
|
||||
observer: true,
|
||||
observeParents: true
|
||||
},
|
||||
swiperProducts: {
|
||||
freeMode: true,
|
||||
freeModeMomentum: false,
|
||||
slidesPerView: 'auto',
|
||||
observer: true,
|
||||
observeParents: true
|
||||
}
|
||||
};
|
||||
},
|
||||
onShow: function() {
|
||||
let that = this;
|
||||
uni.showLoading({
|
||||
title: '加载中'
|
||||
});
|
||||
getHomeData().then(res => {
|
||||
console.log(res);
|
||||
that.logoUrl = res.data.logoUrl;
|
||||
that.$set(that, 'banner', res.data.banner);
|
||||
that.$set(that, 'menus', res.data.menus);
|
||||
that.$set(that, 'roll', res.data.roll);
|
||||
that.$set(that, 'activity', res.data.activity);
|
||||
var activityOne = res.data.activity.shift();
|
||||
that.$set(that, 'activityOne', activityOne);
|
||||
that.$set(that, 'info', res.data.info);
|
||||
that.$set(that, 'firstList', res.data.firstList);
|
||||
that.$set(that, 'bastList', res.data.bastList);
|
||||
that.$set(that, 'likeInfo', res.data.likeInfo);
|
||||
that.$set(that, 'lovely', res.data.lovely);
|
||||
that.$set(that, 'benefit', res.data.benefit);
|
||||
that.$set(that, 'couponList', res.data.couponList);
|
||||
uni.hideLoading();
|
||||
that.setOpenShare();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
goGoodSearch() {
|
||||
this.$yrouter.push('/pages/shop/GoodSearch/index');
|
||||
},
|
||||
goWxappUrl(item) {
|
||||
this.$yrouter.push(item.uniapp_url);
|
||||
},
|
||||
goHotNewGoods(type) {
|
||||
this.$yrouter.push({
|
||||
path: '/pages/shop/HotNewGoods/index',
|
||||
query: { type }
|
||||
});
|
||||
},
|
||||
goGoodsCon(item) {
|
||||
console.log(item);
|
||||
this.$yrouter.push({
|
||||
path: '/pages/shop/GoodsCon/index',
|
||||
query: { id: item.id }
|
||||
});
|
||||
},
|
||||
goGoodsPromotion() {
|
||||
this.$yrouter.push('/pages/shop/GoodsPromotion/index');
|
||||
},
|
||||
setOpenShare: function() {}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped lang="less">
|
||||
.index {
|
||||
background-color: #fff;
|
||||
background-color: #fff;
|
||||
}
|
||||
.swiper-item {
|
||||
height: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user