2022-10-11 09:43:31 +08:00
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
<meta name="viewport"
|
|
|
|
|
content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,viewport-fit=cover">
|
|
|
|
|
<title>商品列表页</title>
|
|
|
|
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/vue.min.js?v=1367936144322" type="text/javascript"
|
|
|
|
|
charset="utf-8"></script>
|
|
|
|
|
<script type="text/javascript"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/axios.js?v=1367936144322"></script>
|
|
|
|
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/siteqiexchange/js/swiper.min.js"></script>
|
|
|
|
|
<link href="https://lsxdemall.oss-cn-beijing.aliyuncs.com/siteqiexchange/css/swiper.min.css" rel="stylesheet">
|
|
|
|
|
<link rel="stylesheet" href="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/css/loading.css">
|
|
|
|
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/js/loading.js"></script>
|
2022-10-25 18:03:09 +08:00
|
|
|
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/js/api2_0.js?v=1"></script>
|
2022-11-01 11:32:19 +08:00
|
|
|
|
<link rel="stylesheet"
|
|
|
|
|
href="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/css/couponCollection.css?v=1">
|
2022-11-02 15:07:29 +08:00
|
|
|
|
<link rel="stylesheet" href="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/tabbar.css">
|
|
|
|
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/modelPop.js"></script>
|
|
|
|
|
<script src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/common/tabbar.js"></script>
|
2022-10-19 16:39:25 +08:00
|
|
|
|
|
|
|
|
|
<script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.4.1/vconsole.min.js"></script>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
<div id="homepage" :style="{background:
|
|
|
|
|
(viewConfig.backgroundImg.iswitch&&viewConfig.backgroundImg.bgImg?
|
|
|
|
|
`url(${viewConfig.backgroundImg.bgImg})`
|
|
|
|
|
:viewConfig.backgroundImg.bgColor),
|
|
|
|
|
backgroundSize: '100% 100%',
|
|
|
|
|
}">
|
|
|
|
|
<div v-show="loading">
|
|
|
|
|
<preload-component />
|
|
|
|
|
</div>
|
|
|
|
|
<div v-show="!loading&&!suspension" class="main-body"
|
|
|
|
|
:style="{paddingBottom: (viewConfig.bottomBar.iswitch!=='1'||calculateTabLength()<2)?'0.14rem':'0.55rem'}">
|
|
|
|
|
|
|
|
|
|
<!-- 配置的顶部banner -->
|
|
|
|
|
<div class="topBanner">
|
|
|
|
|
<div class="search-backpresty" :style="{
|
|
|
|
|
background:(viewConfig.search.iswitch==='1'?(viewConfig.search.bgColor):'none'),
|
2022-11-04 10:29:20 +08:00
|
|
|
|
position:'fixed',
|
|
|
|
|
justifyContent: goodsShow&&!isKey?'space-between':'center'
|
2022-10-11 09:43:31 +08:00
|
|
|
|
}">
|
2022-11-04 10:29:20 +08:00
|
|
|
|
<img class="backpresty" @click="backHandler" v-if="goodsShow&&!isKey"
|
2022-10-11 09:43:31 +08:00
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/backprepageBtn.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<div class="search-box" v-if="viewConfig.search.iswitch==='1'" @click="searchFn">
|
|
|
|
|
<input type="text" class="search" :style="{
|
|
|
|
|
color:viewConfig.search.fontColor,
|
|
|
|
|
textAlign:viewConfig.search.textAlign,
|
|
|
|
|
background:viewConfig.search.borderColor,
|
|
|
|
|
borderRadius:(viewConfig.search.shape==='circular'?'0.15rem':0) }"
|
|
|
|
|
:placeholder="viewConfig.search.placeholder">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2022-10-28 11:28:04 +08:00
|
|
|
|
<div class="fictitious" v-if="viewConfig.search.iswitch==='1'"></div>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
<img class="banner" :src="viewConfig.top_image" alt="">
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 配置的图片 -->
|
|
|
|
|
<div class="autoImg" v-if="viewConfig.picture.img&&viewConfig.picture.iswitch=='1'">
|
|
|
|
|
<img :src="viewConfig.picture.img" @click="autoImgHandle" alt="">
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 配置的标题 -->
|
|
|
|
|
<div class="title" v-if="viewConfig.title.iswitch==='1'">
|
|
|
|
|
<img :src="viewConfig.title.pic" alt="" class="or" v-if="viewConfig.title.comstyle==='2'">
|
|
|
|
|
<p :style="{
|
|
|
|
|
color:viewConfig.title.fontColor,
|
|
|
|
|
fontSize:(viewConfig.title.fontSize==='1'?'0.13rem'
|
|
|
|
|
:(viewConfig.title.fontSize==='2'?'.16rem':'0.19rem')),
|
|
|
|
|
textAlign:viewConfig.title.textAlign }" v-if="viewConfig.title.comstyle==='1'">
|
|
|
|
|
{{viewConfig.title.text}}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 轮播展示 -->
|
|
|
|
|
<div id="rotation" v-if="viewConfig.list==='2'">
|
|
|
|
|
<div class="saleNull" v-if="!goodsNum">
|
|
|
|
|
<img src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/saleNull.png" alt="">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="commodity" v-if="goodsNum">
|
|
|
|
|
<div class="swiper-container" :class="swiperDataList.length>1?'':'oneItem'">
|
|
|
|
|
<div class="swiper-wrapper">
|
|
|
|
|
<div class="swiper-slide" v-for="(item,index) in swiperDataList" :key="index">
|
|
|
|
|
<div class="imgitemMask" v-if="item.available!=1">
|
|
|
|
|
<span>
|
|
|
|
|
<img v-if="item.available==4"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/yet.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img v-if="item.available==2"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/future.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img v-if="item.available==11"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/overdue.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img v-if="item.available==6"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/empty.png"
|
|
|
|
|
alt="">
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
2022-10-20 17:47:23 +08:00
|
|
|
|
<div class="imgbox" :class="dynamicAsh(item)">
|
2022-10-11 09:43:31 +08:00
|
|
|
|
<!-- type :1 兑换码 2:立减金,channel:1支付宝,2微信 -->
|
|
|
|
|
<img class="le-img"
|
2022-11-01 11:32:19 +08:00
|
|
|
|
:style="{width:(item.entity.product_name||item.entity.batch_goods_name).length>6?'0.4rem':'0.46rem',height:(item.entity.product_name||item.entity.batch_goods_name).length>6?'0.4rem':'0.46rem'}"
|
2022-10-20 17:47:23 +08:00
|
|
|
|
:src="item.type==1?item.entity.show_url:(item.entity.channel==1?'https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/zfbreduce.png':'https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/wxreduce.png')"></img>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</div>
|
2022-10-20 17:47:23 +08:00
|
|
|
|
<div class="item-name" :class="dynamicAsh(item)"
|
2022-10-11 18:31:47 +08:00
|
|
|
|
:style="{fontSize:(item.entity.product_name||item.entity.batch_goods_name).length>6?'0.08rem':'0.12rem'}"
|
2022-10-20 17:47:23 +08:00
|
|
|
|
v-html="item.type==1?item.entity.product_name:item.entity.batch_goods_name">
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</div>
|
|
|
|
|
<template v-if="item.origin_price!==item.coupon_price">
|
2022-10-20 17:47:23 +08:00
|
|
|
|
<p class="price" :class="dynamicAsh(item)">
|
2022-10-11 09:43:31 +08:00
|
|
|
|
原价¥{{item.origin_price}}
|
|
|
|
|
</p>
|
|
|
|
|
<p class="money">
|
2022-10-20 17:47:23 +08:00
|
|
|
|
<span class="coupon" :class="dynamicAsh(item)">券后价</span>
|
|
|
|
|
<span class="sign" :class="dynamicAsh(item)">¥</span>
|
|
|
|
|
<span class="current-price"
|
|
|
|
|
:class="dynamicAsh(item)">{{item.coupon_price}}</span>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</p>
|
|
|
|
|
</template>
|
|
|
|
|
<p class="money moneyExtra" v-else>
|
2022-10-20 17:47:23 +08:00
|
|
|
|
<span class="sign" :class="dynamicAsh(item)">¥</span>
|
|
|
|
|
<span class="current-price" :class="dynamicAsh(item)">{{item.origin_price}}</span>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 列表 展示-->
|
|
|
|
|
<div id="list" v-if="viewConfig.list==='1'">
|
|
|
|
|
<div class="saleNull" v-if="!goodsNum">
|
|
|
|
|
<img src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/saleNull.png" alt="">
|
|
|
|
|
</div>
|
|
|
|
|
<ul class="listcommity" v-if="goodsNum">
|
|
|
|
|
<li v-for="(item,i) in swiperDataList" :key="i" @click="exchangeBtn(item)">
|
|
|
|
|
<div class="box">
|
|
|
|
|
<div class="imgBG">
|
|
|
|
|
<img :src="item.type==1?item.entity.show_url:(item.entity.channel==1?'https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/zfbreduce.png':'https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/wxreduce.png')"
|
|
|
|
|
alt=""
|
2022-10-27 11:25:07 +08:00
|
|
|
|
:class="item.stock&&item.stock<0||item.available!=1&&item.available!=2&&item.available!=22?'changegray':''">
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<font
|
2022-10-27 11:25:07 +08:00
|
|
|
|
:class="item.stock&&item.stock<0||item.available!=1&&item.available!=2&&item.available!=22?'changegray':''">
|
2022-10-11 09:43:31 +08:00
|
|
|
|
{{item.type==1?item.entity.product_name:item.entity.batch_goods_name}}</font>
|
|
|
|
|
<div class="details">
|
|
|
|
|
<template v-if="item.origin_price!==item.coupon_price">
|
2022-10-20 17:47:23 +08:00
|
|
|
|
<p class="sign" :class="dynamicAsh(item)">¥</p>
|
|
|
|
|
<p class="price" :class="dynamicAsh(item)">{{item.coupon_price}}</p>
|
|
|
|
|
<p class="coupon" :class="dynamicAsh(item)">券后价</p>
|
|
|
|
|
<p class="original-price" :class="dynamicAsh(item)">
|
2022-10-11 09:43:31 +08:00
|
|
|
|
原价¥{{item.origin_price}}
|
|
|
|
|
</p>
|
|
|
|
|
</template>
|
|
|
|
|
<p v-else style="margin-top:0.05rem">
|
2022-10-20 17:47:23 +08:00
|
|
|
|
<span class="sign" :class="dynamicAsh(item)">¥</span>
|
|
|
|
|
<span class="price" :class="dynamicAsh(item)">{{item.origin_price}}</span>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
2022-10-28 11:19:57 +08:00
|
|
|
|
<span class="goodsStatus">
|
|
|
|
|
<img v-if="item.available==4"
|
2022-11-01 11:32:19 +08:00
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/yet.png" alt="">
|
2022-10-28 11:19:57 +08:00
|
|
|
|
<img v-if="item.available==2"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/future.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img v-if="item.available==11"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/overdue.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img v-if="item.available==6"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/empty.png"
|
|
|
|
|
alt="">
|
|
|
|
|
</span>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 矩阵展示 -->
|
|
|
|
|
<div id="matrix" v-if="viewConfig.list==='3'">
|
|
|
|
|
<div class="saleNull" v-if="!goodsNum">
|
|
|
|
|
<img src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/saleNull.png" alt="">
|
|
|
|
|
</div>
|
|
|
|
|
<ul class="listcommity" v-if="goodsNum">
|
2022-10-27 11:25:07 +08:00
|
|
|
|
<li :class="item.stock&&item.stock<0||item.available!=1&&item.available!=2&&item.available!=22?'changegray':''"
|
2022-10-11 09:43:31 +08:00
|
|
|
|
v-for="(item,i) in swiperDataList" :key="i" @click="exchangeBtn(item)">
|
|
|
|
|
<div class="goodsNum-frist">
|
|
|
|
|
<span class="goodsIcon">
|
|
|
|
|
<img v-if="item.available==4"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/yet.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img v-if="item.available==2"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/future.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img v-if="item.available==11"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/overdue.png"
|
|
|
|
|
alt="">
|
|
|
|
|
<img v-if="item.available==6"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/empty.png"
|
|
|
|
|
alt="">
|
|
|
|
|
</span>
|
|
|
|
|
<img class="img"
|
|
|
|
|
:src="item.type==1?item.entity.show_url:(item.entity.channel==1?'https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/zfbreduce.png':'https://lsxdemall.oss-cn-beijing.aliyuncs.com/commonproductlogo/wxreduce.png')"
|
|
|
|
|
alt="" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="detail-text">
|
|
|
|
|
<font>{{item.type==1?item.entity.product_name:item.entity.batch_goods_name}}</font>
|
|
|
|
|
<template v-if="item.origin_price!==item.coupon_price">
|
2022-10-20 17:47:23 +08:00
|
|
|
|
<p class="original-price" :class="dynamicAsh(item)">原价¥{{item.origin_price}}</p>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
<p>
|
2022-10-20 17:47:23 +08:00
|
|
|
|
<span class="sign" :class="dynamicAsh(item)">¥</span>
|
|
|
|
|
<span class="price" :class="dynamicAsh(item)">{{item.coupon_price}}</span>
|
|
|
|
|
<span class="coupon" :class="dynamicAsh(item)">券后价</span>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</p>
|
|
|
|
|
</template>
|
2022-10-20 18:27:43 +08:00
|
|
|
|
<template v-else>
|
|
|
|
|
<p class="original-price" :class="dynamicAsh(item)"></p>
|
2022-10-20 18:29:56 +08:00
|
|
|
|
<p>
|
2022-10-20 18:27:43 +08:00
|
|
|
|
<span class="sign" :class="dynamicAsh(item)">¥</span>
|
|
|
|
|
<span class="price" :class="dynamicAsh(item)">{{item.origin_price}}</span>
|
|
|
|
|
</p>
|
|
|
|
|
</template>
|
2022-10-11 09:43:31 +08:00
|
|
|
|
</div>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="exchangeBtn"
|
|
|
|
|
:class="(viewConfig.bottomBar.iswitch!=='1'||calculateTabLength()<2)?'bottomBtn':''"
|
|
|
|
|
v-if="viewConfig.list==='2'" :style="{background: viewConfig.bgcolor,color:viewConfig.font_color}"
|
|
|
|
|
@click="exchangeBtn()">
|
|
|
|
|
购买
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="bottom" id="bottom" :class="viewConfig.list===2?'tipset':''" v-show="describe.type">
|
|
|
|
|
<img :src="describe.bg_image" v-show="describe.type==1&&describe.bg_image">
|
|
|
|
|
<div v-html="describe.content" class="goodsTip" v-show="describe.type==3&&describe.content"></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- 悬浮提示 -->
|
|
|
|
|
<div v-if="suspension" class="suspensionDom">
|
|
|
|
|
<img @click="closeTip"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/backprepageBtn.png" alt="">
|
|
|
|
|
<h4>活动规则</h4>
|
|
|
|
|
<div v-html="describe.content"></div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 悬浮使用说明 -->
|
|
|
|
|
<img class="susTip" @click="susTipFn" :style="{top:viewConfig.search.iswitch!=='1'?'0.2rem':'0.8rem'}"
|
|
|
|
|
v-if="describe.type==2&&describe.content&&!suspension&&!loading"
|
|
|
|
|
src="https://lsxdemall.oss-cn-beijing.aliyuncs.com/MarketingSystem/img/acticeTextTip.png" alt="">
|
|
|
|
|
|
|
|
|
|
<!-- 单条弹出框 -->
|
|
|
|
|
<div class="prompt" :class="promtshow?'proactive':''">
|
|
|
|
|
{{this.promttip}}
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<!-- 弹出提示 -->
|
|
|
|
|
<model-pop :show.sync="popShow" :title="popTitle" :status="popStatus" :text="popText"
|
|
|
|
|
@backFunction="backFunctionPop"></model-pop>
|
|
|
|
|
<!-- tab -->
|
|
|
|
|
<tab-component v-if="!suspension" :current="1" />
|
|
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
<script>
|
2022-10-19 16:39:25 +08:00
|
|
|
|
var vConsole = new VConsole();
|
2022-10-11 09:43:31 +08:00
|
|
|
|
new Vue({
|
|
|
|
|
el: '#homepage',
|
|
|
|
|
data () {
|
|
|
|
|
return {
|
|
|
|
|
swiperDataList: [], //轮播
|
|
|
|
|
promtshow: false,
|
|
|
|
|
promttip: '',
|
|
|
|
|
loading: true,
|
|
|
|
|
lastid: 0,
|
|
|
|
|
gstatus: 1,
|
|
|
|
|
suspension: false,
|
|
|
|
|
goodsShow: true,
|
|
|
|
|
goodsNum: false,
|
|
|
|
|
exchangeCommity: {}, //兑换选择的商品
|
|
|
|
|
describe: {},
|
|
|
|
|
isKey: true,
|
|
|
|
|
showType: 0,
|
|
|
|
|
viewConfig: {}, //动态数据
|
|
|
|
|
|
|
|
|
|
/* 提示框状态 */
|
|
|
|
|
popShow: false,
|
|
|
|
|
popTitle: '',
|
|
|
|
|
popText: '',
|
|
|
|
|
popStatus: 1 /*1 成功 2提示 3失败 */
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
components: {
|
|
|
|
|
tabComponent,
|
|
|
|
|
modelPop
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
created () {
|
|
|
|
|
this.getGoods();
|
|
|
|
|
let productConfig = JSON.parse(localStorage.getItem('product_list'));
|
|
|
|
|
document.title = localStorage.getItem('title');
|
|
|
|
|
this.isKey = localStorage.getItem('haskey');
|
|
|
|
|
this.describe = productConfig.describe;
|
|
|
|
|
this.viewConfig = productConfig
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
methods: {
|
|
|
|
|
tabHandle (id) {
|
|
|
|
|
this.tabActive = id
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
closeTip () {
|
|
|
|
|
this.suspension = false;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
susTipFn () {
|
|
|
|
|
this.suspension = true;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
onSelected (item) {
|
|
|
|
|
this.exchangeCommity = item;
|
|
|
|
|
this.gstatus = item.available;
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
backHandler () {
|
2022-11-04 10:00:51 +08:00
|
|
|
|
let backUrl = window.history.length;
|
|
|
|
|
if (window.history.length) {
|
|
|
|
|
history.go(-backUrl + 1);
|
|
|
|
|
}
|
2022-10-11 09:43:31 +08:00
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
// 单条弹框
|
|
|
|
|
openDialog () {
|
|
|
|
|
this.promtshow = true;
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.promtshow = false;
|
|
|
|
|
this.promttip = '';
|
|
|
|
|
}, 3000)
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//根据token获取商品信息
|
|
|
|
|
async getGoods () {
|
|
|
|
|
let self = this;
|
|
|
|
|
let showType = localStorage.getItem('showType');
|
|
|
|
|
this.showType = showType;
|
|
|
|
|
let data = {
|
|
|
|
|
"last_product_id": localStorage.getItem('lastid') | 0,
|
|
|
|
|
}
|
|
|
|
|
if (showType == 1) { //白名单
|
|
|
|
|
let tokenList = JSON.parse(localStorage.getItem('getTokenList'));
|
|
|
|
|
let goodsList = [];
|
|
|
|
|
for (item of tokenList) {
|
|
|
|
|
let goodsItem = [];
|
|
|
|
|
data.token = item;
|
|
|
|
|
let waitGoods = await req.axiosPost('/key/products', data).then(res => {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
res.data.forEach(it => {
|
|
|
|
|
it.token = item;
|
|
|
|
|
});
|
|
|
|
|
goodsItem = res.data;
|
|
|
|
|
} else {
|
|
|
|
|
this.popTitle = '温馨提示'
|
|
|
|
|
this.popText = res.message
|
|
|
|
|
this.popStatus = 2
|
|
|
|
|
this.popShow = true
|
2022-10-17 11:23:00 +08:00
|
|
|
|
if (res.code == 403) {
|
2022-10-11 09:43:31 +08:00
|
|
|
|
setTimeout(() => {
|
|
|
|
|
window.location.href = localStorage.getItem('white_link');
|
|
|
|
|
}, 3000);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
goodsList = goodsList.concat(goodsItem);
|
|
|
|
|
};
|
|
|
|
|
let duplicate = []; //去重
|
|
|
|
|
let goodsArr = []; //最终的商品集合
|
|
|
|
|
goodsList.forEach(item => {
|
|
|
|
|
if (duplicate.indexOf(item.product_id) == -1) {
|
|
|
|
|
duplicate.push(item.product_id);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
let similar = []
|
|
|
|
|
duplicate.forEach(it => {
|
|
|
|
|
similar = goodsList.filter(iten => { //goodshow为去重后的数据
|
|
|
|
|
return iten.product_id == it;
|
|
|
|
|
});
|
2022-11-04 09:50:15 +08:00
|
|
|
|
let flag = [1, 2, 6, 8, 7, 5, 4, 22, 11, 3, 10, 20, 21]; //显示的avarivble规则
|
2022-10-11 09:43:31 +08:00
|
|
|
|
let minIndex = 7;
|
|
|
|
|
similar.forEach(item => {
|
|
|
|
|
let flagIndex = flag.indexOf(item.available);
|
|
|
|
|
if (flagIndex > -1) {
|
|
|
|
|
if (flagIndex < minIndex)
|
|
|
|
|
minIndex = flagIndex;
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
let obj = similar.find((o) => {
|
|
|
|
|
return o.available == flag[minIndex]
|
|
|
|
|
})
|
|
|
|
|
goodsArr.push(obj);
|
|
|
|
|
});
|
|
|
|
|
/*商品自定义排序:0-100,降序排列,100第一个展示,0最后一个展示*/
|
|
|
|
|
var objectArraySort = (keyName) => {
|
|
|
|
|
return (objectN, objectM) => {
|
|
|
|
|
var valueN = objectN[keyName]
|
|
|
|
|
var valueM = objectM[keyName]
|
|
|
|
|
if (valueN < valueM) return 1
|
|
|
|
|
else if (valueN > valueM) return -1
|
|
|
|
|
else return 0
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
goodsArr.sort(objectArraySort('weight'))
|
|
|
|
|
self.swiperDataList = goodsArr;
|
|
|
|
|
localStorage.setItem('goodsCollection', JSON.stringify(goodsArr));
|
|
|
|
|
self.goodsShow = goodsArr.length > 1;
|
|
|
|
|
localStorage.setItem('goodsCount', goodsArr.length);
|
2022-10-28 11:28:04 +08:00
|
|
|
|
if (goodsArr && goodsArr.length == 1 && (goodsArr[0].available == 1 || goodsArr[0].available == 22)) {
|
2022-11-03 17:03:30 +08:00
|
|
|
|
localStorage.setItem('goods_id', goodsArr[0].entity.goods_id);
|
2022-10-11 09:43:31 +08:00
|
|
|
|
localStorage.setItem('key', goodsArr[0].key);
|
|
|
|
|
localStorage.setItem('token', goodsArr[0].token);
|
2022-10-12 14:08:25 +08:00
|
|
|
|
window.location.replace(goodsArr[0].type == 1 ? "./details.html" : "../index.html?id=" + localStorage.getItem('linkId'));
|
2022-10-11 09:43:31 +08:00
|
|
|
|
return false;
|
|
|
|
|
} else if (goodsArr && goodsArr.length >= 1) {
|
|
|
|
|
self.goodsNum = true;
|
|
|
|
|
self.onSelected(goodsArr[0])
|
|
|
|
|
self.$nextTick(function () {
|
|
|
|
|
var swiper = new Swiper('.swiper-container', {
|
|
|
|
|
slidesPerView: "auto",
|
|
|
|
|
loopAdditionalSlides: 1000,
|
|
|
|
|
centeredSlides: true,
|
|
|
|
|
observer: true,
|
|
|
|
|
observeParents: true,
|
|
|
|
|
loop: self.goodsShow,
|
|
|
|
|
onSlideChangeEnd: function (swiper) {
|
|
|
|
|
let row = goodsArr[swiper.realIndex];
|
|
|
|
|
self.onSelected(goodsArr[swiper.realIndex])
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
self.loading = false;
|
|
|
|
|
}, 100);
|
|
|
|
|
} else {
|
|
|
|
|
self.goodsNum = false;
|
2022-10-14 10:30:43 +08:00
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.popTitle = '温馨提示'
|
|
|
|
|
this.popText = '暂无可兑换商品'
|
|
|
|
|
this.popStatus = 2
|
|
|
|
|
this.popShow = true
|
|
|
|
|
}, 1000);
|
2022-10-11 09:43:31 +08:00
|
|
|
|
}
|
|
|
|
|
} else { //兑换码
|
|
|
|
|
data.token = localStorage.getItem('token')
|
|
|
|
|
req.axiosPost('/key/products', data).then(res => {
|
|
|
|
|
if (res.code == 200) {
|
|
|
|
|
self.swiperDataList = res.data;
|
|
|
|
|
localStorage.setItem('goodsCollection', JSON.stringify(res.data));
|
|
|
|
|
localStorage.setItem('goodsCount', res.data.length);
|
|
|
|
|
self.goodsShow = res.data.length > 1;
|
|
|
|
|
if (res.data && res.data.length == 1) {//单个商品直接进入详情页面
|
2022-11-03 17:03:30 +08:00
|
|
|
|
localStorage.setItem('goods_id', res.data[0].entity.goods_id);
|
2022-10-12 14:08:25 +08:00
|
|
|
|
window.location.replace("./details.html");
|
2022-10-11 09:43:31 +08:00
|
|
|
|
return false;
|
|
|
|
|
} else if (res.data && res.data.length >= 1) {
|
|
|
|
|
self.goodsNum = true;
|
|
|
|
|
self.onSelected(res.data[0])
|
|
|
|
|
self.$nextTick(function () {
|
|
|
|
|
var swiper = new Swiper('.swiper-container', {
|
|
|
|
|
slidesPerView: "auto",
|
|
|
|
|
loopAdditionalSlides: 1000,
|
|
|
|
|
centeredSlides: true,
|
|
|
|
|
observer: true,
|
|
|
|
|
observeParents: true,
|
|
|
|
|
loop: self.goodsShow,
|
|
|
|
|
onSlideChangeEnd: function (swiper) {
|
|
|
|
|
let row = res.data[swiper.realIndex];
|
|
|
|
|
self.onSelected(res.data[swiper.realIndex])
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
self.loading = false;
|
|
|
|
|
}, 100);
|
2022-10-14 10:30:43 +08:00
|
|
|
|
} else {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.popTitle = '温馨提示'
|
|
|
|
|
this.popText = '暂无可兑换商品'
|
|
|
|
|
this.popStatus = 2
|
|
|
|
|
this.popShow = true
|
|
|
|
|
}, 1000);
|
2022-10-11 09:43:31 +08:00
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
this.popTitle = '温馨提示'
|
|
|
|
|
this.popText = res.message
|
|
|
|
|
this.popStatus = 3
|
|
|
|
|
this.popShow = true
|
2022-10-17 11:23:00 +08:00
|
|
|
|
if (res.code == 403) {
|
2022-10-11 09:43:31 +08:00
|
|
|
|
let haskey = localStorage.getItem('haskey');
|
|
|
|
|
if (haskey) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
window.history.back();
|
|
|
|
|
}, 3000);
|
|
|
|
|
} else {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
window.location.href = "../index.html?id=" + localStorage.getItem('linkId');
|
|
|
|
|
}, 3000);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}).catch(err => {
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
},
|
2022-10-20 17:47:23 +08:00
|
|
|
|
/* 动态置灰 */
|
|
|
|
|
dynamicAsh (item) {
|
2022-10-28 11:28:04 +08:00
|
|
|
|
return (item.stock && (item.stock < 0 || item.available != 1) && item.available != 2 && item.available != 22) ? 'changegray' : ''
|
2022-10-20 17:47:23 +08:00
|
|
|
|
},
|
2022-10-11 09:43:31 +08:00
|
|
|
|
|
|
|
|
|
//选择商品点击兑换
|
|
|
|
|
exchangeBtn (row = this.exchangeCommity) {
|
|
|
|
|
let gstatus = row.available;
|
|
|
|
|
this.gstatus = gstatus;
|
2022-10-28 11:28:04 +08:00
|
|
|
|
if (gstatus == 1 || gstatus == 22) {
|
2022-10-11 09:43:31 +08:00
|
|
|
|
// 跳转商品详情页面
|
|
|
|
|
if (this.showType == 1) { //白名单
|
|
|
|
|
localStorage.setItem('token', row.token);
|
|
|
|
|
localStorage.setItem('key', row.key);
|
|
|
|
|
}
|
2022-11-03 17:03:30 +08:00
|
|
|
|
localStorage.setItem('goods_id', row.entity.goods_id);
|
2022-10-11 09:43:31 +08:00
|
|
|
|
//type :1 兑换码 2:立减金
|
2022-10-12 14:08:25 +08:00
|
|
|
|
window.location.replace("./details.html");
|
2022-10-11 09:43:31 +08:00
|
|
|
|
} else {
|
|
|
|
|
this.popTitle = '温馨提示'
|
|
|
|
|
this.popText = product_status(gstatus, row)
|
|
|
|
|
this.popStatus = 2
|
|
|
|
|
this.popShow = true
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* 弹框回调 */
|
|
|
|
|
backFunctionPop () {
|
|
|
|
|
if (this.gstatus == 8) {
|
|
|
|
|
window.history.go(0);
|
|
|
|
|
}
|
2022-10-14 10:30:43 +08:00
|
|
|
|
|
|
|
|
|
if (this.popText === '暂无可兑换商品') {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
window.location.href = "../index.html?id=" + localStorage.getItem('linkId');
|
|
|
|
|
}, 1000);
|
|
|
|
|
}
|
2022-10-11 09:43:31 +08:00
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
/* 判Tab长度 */
|
|
|
|
|
calculateTabLength () {
|
|
|
|
|
return this.viewConfig.bottomBar.navlist.filter(item => item.iswitch === '1').length
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
/* 图片跳转 */
|
|
|
|
|
autoImgHandle () {
|
|
|
|
|
if (this.viewConfig.picture.jumpType === '1') {
|
|
|
|
|
window.location.href = this.viewConfig.picture.jumpUrl
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
//搜索
|
|
|
|
|
searchFn () {
|
|
|
|
|
window.location.href = './searchPage.html'
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
</html>
|