|
|
<template>
<view style="position: relative;"> <view class="top-tap mx-1px-bottom" v-show="!detailData.data.shop_hidden_more_info"> <view class="item"> <view class="name active" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor" v-if="activeName == 'shop'" data-type="shop" @tap="jumpScroll"> 商品 </view> <view class="name" v-else data-type="shop" @tap="jumpScroll"> 商品 </view> </view> <view class="item"> <view class="name active" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor" v-if="activeName == 'comment'" data-type="comment" @tap="jumpScroll"> 评价 </view> <view class="name" v-else data-type="comment" @tap="jumpScroll"> 评价 </view> </view> <view class="item"> <view class="name active" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor" v-if="activeName == 'details'" data-type="details" @tap="jumpScroll"> 详情 </view> <view class="name" v-else data-type="details" @tap="jumpScroll"> 详情 </view> </view> <!-- <view class="item "> <view class="name active" style="color: {{config.mainColor}}; border-color: {{config.mainColor}}" v-if="{{activeName == 'recommend'}}" data-type="recommend" @tap="jumpScroll"> 推荐 </view> <view class="name" v-else data-type="recommend" @tap="jumpScroll"> 推荐 </view> </view> --> <!-- #ifdef MP-WEIXIN --> <view class="share" @tap="changeShare"> <i class="iconfont icon--fenxiang"></i> </view> <!-- #endif --> <!-- #ifdef H5 --> <!-- <view class="share" @tap="togglePopup('middle-img')"> <i class="iconfont icon--fenxiang"></i> </view> --> <view class="share" @tap="toggleShare"> <i class="iconfont icon--fenxiang"></i> </view> <!-- #endif --> </view> <!-- #ifdef H5 --> <view > <uni-popup :show="type === 'middle-img'" position="top" mode="fixed" @hidePopup="togglePopup('')"> <view class="uni-center center-box"> <image style="position: absolute; top: 0;right:0" @tap="togglePopup('')" class="image" src="/static/ico-share-wechat.png" /> </view> </uni-popup> </view> <!-- #endif --> <view class="content" :class="detailData.data.shop_hidden_more_info == 1 ? 'no-top' : ''"> <view class="js__top"> <view class="top-image"> <swiper indicator-dots="true" autoplay="flase" circular="true"> <swiper-item v-for="(item, index) in detailData.data.photos" :key="index" > <image :src="item.url" :data-url="item.url" class="slide-image" @tap="bigImg"></image> </swiper-item> </swiper> <view class="small-txt" v-if="detailData.data.is_first_order_free"> 收货全额返 </view> <view class="call" v-if="freeInfo"> <span v-if="(!is_login && freeInfo.status != 2) || (freeInfo.status == 1 && freeInfo.task.status != 1)" @tap="call">集Call免费领</span> <span v-if="freeInfo.status == 2 && freeInfo.task.status != 1" class="over">集Call已领完</span> <span v-if="freeInfo.task.status == 1" @tap="call" class="success">集Call已完成</span> </view> <!--秒杀--> <view class="marketing-box" :style="'background: ' + config.mainColor" v-if="detailData.meta.seckill"> <seckill :end="detailData.meta.seckill?detailData.meta.seckill.ends_at:''" :starts="detailData.meta.seckill?detailData.meta.seckill.starts_at:''" :server="detailData.meta.seckill?detailData.meta.seckill.server_time:''" @starts="isStarts" @end="isEnd"></seckill> </view> <!--拼团--> <view class="marketing-box" :style="'background: ' + config.mainColor" v-if="detailData.meta.multiGroupon"> <seckill v-if="commodity.multi_groupon_init_status == 1 || commodity.multi_groupon_init_status == 2" :end="commodity.multi_groupon_ends_at" :starts="commodity.multi_groupon_starts_at" :server="detailData.data.server_time" typename="拼团" @starts="isStarts" @end="isEnd"></seckill> <view v-if="commodity.multi_groupon_init_status == 0" class="over"> 此次拼团失败,可以参加其他人的拼团购买 </view> </view> </view> <view class="basic-information"> <!-- <view class="seckill-box mx-1px-bottom {{detailData.meta.seckill.init_status == 1 ? 'active' : ''}}" v-if="{{detailData.meta.seckill}}"> <view class="seckill-time-box"> <view class="seckill seckill-item" v-if="{{active}}"> <i class="iconfont icon-shijian"></i> <view class="text">距离秒杀结束还剩余</view> <view class="tiem"><span> <p v-if="{{endTime.hour < 10}}">0</p>{{endTime.hour}}</span> : <span><p v-if="{{endTime.minute < 10}}">0</p>{{endTime.minute}}</span> : <span><p v-if="{{endTime.second < 10}}">0</p>{{endTime.second}}</span></view> </view> <view class="seckill-item" v-else> <view v-if="{{type == 0}}"> <view class="no-starts"> 未开始 </view> <view class="time-text"> {{message}} </view> </view> <view v-if="{{type == 1}}"> <i class="iconfont icon-shijian"></i> <view class="text">距离秒杀开始还剩余</view> <view class="tiem"><span> <p v-if="{{startsTime.hour < 10}}">0</p>{{startsTime.hour}}</span> : <span> <p v-if="{{startsTime.minute < 10}}">0</p>{{startsTime.minute}}</span> : <span> <p v-if="{{startsTime.second < 10}}">0</p>{{startsTime.second}}</span></view> </view> </view> </view> <view class="money-box"> <span class="old">¥{{detailData.data.market_price}}</span> <span class="new">¥{{price}}</span> </view> </view> --> <view class="basic-top"> <view class="price-box"> {{detailData.data.name}} </view> <!-- <view class="recommend" @tap="changeShare"> 我要推荐 > </view> --> </view><!-- 商品描述--> <view class="basic-center">{{detailData.data.extend_description}}</view> <view class="basic-vip-box"> <view class="group-num" v-if="detailData.meta.multiGroupon"> {{detailData.meta.multiGroupon.number}} 人团 </view> <view class="basic"> <view class="basic-bottom" v-if="is_init"> <view class="price-box"> <block v-if="detailData.data.negotiable == 1"> <view style="font-size: 20px"> 价格面议 </view> </block> <block v-else> <text class="price" v-if="!cart_status.group">¥{{price}}</text> <text class="price" v-else>{{detailData.meta.multiGroupon.price}}</text> <!-- <text v-if="{{!detailData.meta.multiGroupon}}">{{detailData.data.price_txt_sell}}</text> <span class="group-num" v-else>{{detailData.meta.multiGroupon.number}}人拼团价</span> --> </block> </view> <!-- <view class="recommend" v-if="{{detailData.data.can_share}}" @tap="changeShare"> 我要推荐 > </view> --> </view> <view class="market-price"> <view class="price"> <view :hidden="detailData.data.shop_hidden_more_info"> <block v-if="detailData.data.negotiable != 1"> ¥ {{detailData.data.market_price}} </block> </view> </view> <view> <block v-if="detailData.data.shop_show_sell_nums"> 月销: {{detailData.data.sale}} </block> </view> </view> </view> </view> <!--限购信息--> <view class="purchaseInfo mx-1px-top" v-if="detailData.data.user_limit"> <view class="title"> 限购 </view> <view> 本商品每人限购{{detailData.data.user_limit}}件 </view> </view> <!--拼团信息--> <!-- <view class="groups-info mx-1px-top" v-if="{{detailData.meta.groupon}}"> <view> 运费:免运费 </view> <view> 剩余人数:{{detailData.meta.groupon.number - detailData.meta.groupon.sale_number}} </view> <view> 已参加人数:{{detailData.meta.groupon.sale_number}} </view> </view> --> <!--快捷sku--> <!-- <view class="select-sku-box mx-1px-top" @tap="showSelect"> <view class="title">选择</view> <view class="sku-info"> {{select_product.color}} <block v-if="{{select_product.color}}"> , </block> {{select_product.size}} </view> <view class="iconfont icon--xiangyoujiantou"> </view> </view> <view class="new-addbox mx-1px-top"> <image mode="widthFix" src="https://cdn.ibrand.cc/%E7%BC%96%E7%BB%84%207@2x.png"></image> </view> --> <!--优惠券信息--> <view class="coupons-tags mx-1px-top" v-if="coupons.length" @tap="showCoupons"> <view class="tags-title"> 领券 </view> <view class="coupon-box"> <view class="tags-item" :style="'background: ' + config.mainColor" v-for="(item, index) in coupons" :key="index" v-if="index <= 2 && item.is_open == 1" > {{item.label}} <view class="dot-wrap"> <view class="dot-left"> <view class="dot-item dot-item-left"></view> <view class="dot-item dot-item-left"></view> <view class="dot-item dot-item-left"></view> </view> <view class="dot-right"> <view class="dot-item dot-item-right"></view> <view class="dot-item dot-item-right"></view> <view class="dot-item dot-item-right"></view> </view> </view> </view> </view> </view> <!--折扣信息--> <view class="discounts-tags mx-1px-top" v-if="discounts.length" @tap="showDiscounts"> <view class="tags-title"> 促销 </view> <view class="discounts-box"> <view class="disconts-item" v-for="(item, index) in discounts" :key="index" > <view class="discounts-tags-title" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor"> {{item.tags}} </view> <view class="tags-item"> {{item.label}} </view> </view> </view> </view> <!-- <view class="old-box mx-1px-top">; 价格 ¥{{detailData.data.market_price}} </view> --> </view> <!-- 新提出来的模块--> <view class="new-module"> <!--快捷sku--> <view class="select-sku-box mx-1px-top" @tap="showSelect" v-if="select_product"> <view class="title">选择</view> <view class="sku-info"> {{select_product.color || ''}} <block v-if="select_product.color"> , </block> {{select_product.size || ''}} </view> <view class="iconfont icon--xiangyoujiantou"> </view> </view> <!-- 品牌直供 正品保障--> <view class="new-addbox mx-1px-top"> <image mode="widthFix" src="https://cdn.ibrand.cc/%E7%BC%96%E7%BB%84%207@2x.png"></image> </view> </view> <!--可自提门店--> <view class="seif-info" @tap="changeMoreShop" v-if="shopInfo && shopInfo.length"> <view class="title"> 可自提门店 </view> <view class="name-info"> <view class="name"> {{shopInfo[0].name}} </view> <view class="iconfont icon--xiangyoujiantou"> </view> </view> </view> <!--新人免单--> <view class="new-free" v-if="freeGoodsInfo && freeGoodsInfo.item && freeGoodsInfo.item.length"> <view class="seif-info mx-1px-bottom"> <view class="title"> {{freeGoodsInfo.name}} </view> <view class="name-info"> <view class="iconfont icon--xiangyoujiantou"> </view> </view> </view> <view class="free-goods-info"> <view class="item" :data-link="item.link" v-for="(item, index) in freeGoodsInfo.item" :key="index" @tap="jumpFreeLink"> <image :src="item.image"> <view class="free-tag"> 收货全额返 </view> </image> <view class="name"> {{item.name}} </view> <view class="price"> ¥{{item.goods_sell_price}} </view> </view> </view> </view> <!--拼团信息和规则--> <view class="groups-rule" v-if="detailData && detailData.meta && detailData.meta.multiGroupon"> <view class="rule-title" @tap="sharRules"> <view class="info-one">拼团</view> <view class="info-two">{{detailData.meta.multiGroupon.number}} 人团,人数未达到自动退款</view> <view class="info-three">玩法详情 <view class="iconfont icon--xiangyoujiantou"></view></view> </view> <view class="rule-avatar" v-if="groupon_userlist && groupon_userlist.userList && groupon_userlist.userList.length"> <view class="avatar-item" v-for="(item,index) in groupon_userlist.userList" :style="{left:-3*index + 'px',zIndex:groupon_userlist.userList.length - index}" > <image :src="item.meta.avatar" v-if="item.meta.avatar"></image> <view class="iconfont icon-yonghu" v-else></view> <span class="colonel" v-if="item.is_leader">团长</span> </view> </view> <view class="rule-text" v-if="groupon_userlist && groupon_userlist.userList&&groupon_userlist.userList.length"> 欢迎来到 <view class="usename">{{groupon_userlist.userList[0].meta.nick_name}}</view> 的拼团。 <block v-if="commodity&&commodity.multi_groupon_item_complete_status == 0">还需<view class="num">{{groupon_userlist.gap_number}}</view>人即可成团</block> <block v-if="commodity&&commodity.multi_groupon_item_complete_status == 1">已成团</block> <block v-if="commodity&&commodity.multi_groupon_item_complete_status == 2">成团失败</block> </view> <view class="rule-progress"> <progress :percent='emjstatus.percent' stroke-width="4" activeColor="#EA4448" backgroundColor="#DBDBDB"></progress> <view class="launch" :class="emjstatus.lauch ? 'active-emj' :''" style="left: 10%"> <view class="iconfont icon-faqipintuan"></view> <view class="text">发起拼团</view> </view> <view class="invite" :class="emjstatus.half ? 'active-emj' :''" style="left:40%"> <view class="iconfont icon-yaoqinghaoyou"></view> <view class="text">邀请好友参团</view> </view> <view class="success" :class="emjstatus.end ? 'active-emj' :''" style="left: 80%"> <view class="iconfont icon-pintuanchenggong"></view> <view class="text">拼团<block v-if="commodity && commodity.multi_groupon_item_complete_status != 2">成功</block><block v-if="commodity.multi_groupon_item_complete_status == 2">失败</block></view> </view> </view> <view class="virtual-box mx-1px-top" v-if="!detailData.meta.has_multiGroup && detailData.meta.is_agent"> <view class="title"> 开团 </view> <view class="text"> 您可虚拟开团该商品 </view> <view class="virtual-btn" @tap="jumpVirtual"> 虚拟开团 </view> </view> </view> <!--他们也在拼--> <view class="they-groups" v-if="detailData.meta.multiGroupon && groupon_itemList[0] && groupon_itemList[0].length"> <view class="they-title"> <view class="num"> {{meta.pagination.total}}个拼团正在进行中 </view> <view class="they-more" @tap="seeMore">查看更多拼团 <view class="iconfont icon--xiangyoujiantou"></view></view> </view> <view class="they-detail"> <view class="use-info"> <image :src="groupon_itemList[0][0].leader.meta.avatar"></image> <view class="nick-name">{{groupon_itemList[0][0].leader.meta.nick_name}}</view> </view> <view class="offered-info"> <view class="box"> <view class="info-num">还差<span>{{groupon_itemList[0][0].gap_number}}人</span>成团</view> <view class="groups-time-box"> <span>剩余: </span> <group :end="groupon_itemList[0][0].ends_at" :starts="groupon_itemList[0][0].starts_at" :server="detailData.data.server_time" mold="list"></group> </view> </view> <view class="info-btn" @tap="multiAddToCart" :data-id="groupon_itemList[0][0].id" :data-join="groupon_itemList[0][0].has_joined" :data-no="groupon_itemList[0][0].multi_groupon_order_no"> <span v-if="groupon_itemList[0][0].has_joined == 1">已参团</span> <span v-else>去参团</span> </view> </view> </view> <view class="they-detail" v-if="groupon_itemList[0][1]"> <view class="use-info"> <image :src="groupon_itemList[0][1].leader.meta.avatar"></image> <view class="nick-name">{{groupon_itemList[0][1].leader.meta.nick_name}}</view> </view> <view class="offered-info"> <view class="box"> <view class="info-num">还差<span>{{groupon_itemList[0][1].gap_number}}人</span>成团</view> <view class="groups-time-box"> <span>剩余: </span> <group :end="groupon_itemList[0][1].ends_at" :starts="groupon_itemList[0][1].starts_at" :server="detailData.data.server_time" mold="list"></group> </view> </view> <view class="info-btn" @tap="multiAddToCart" :data-id="groupon_itemList[0][1].id" :data-join="groupon_itemList[0][1].has_joined" :data-no="groupon_itemList[0][1].multi_groupon_order_no"> <span v-if="groupon_itemList[0][1].has_joined == 1">已参团</span> <span v-else>去参团</span> </view> </view> </view> </view> <!--同款信息--> <view class="same" @tap="showSame" v-if="detailData.data.subsection == 1"> <view> <span>【商场同款】</span> 线下商场同步销售 </view> <view> ... </view> </view> <!--我要推荐--> <view class="recommended" v-if="detailData.data.can_share && !detailData.meta.multiGroupon" @tap="changeShare"> <view class="title">推荐</view> <view class="goodness"><block v-if="detailData.data.show_commission">推荐可获得佣金 <span>{{detailData.data.commission}}元</span></block> </view> <!-- #ifdef MP-WEIXIN --> <view class="btn">我要推荐 ></view> <!-- #endif --> </view> <!--第三方供货说明--> <view class="third-party" @tap="changeThird" v-if="detailData.data.supplier && detailData.data.supplier.code != 'self'"> <view class="title">说明 :</view> <view class="detail-list"> <view class="item pa-bottom"> <span class="iconfont icon-Group92"></span> <view class="txt">本商品为第三方供应提供</view> </view> <view class="item"> <span class="iconfont icon-Group92"></span> <view class="txt">由 {{detailData.data.supplier?detailData.data.supplier.company_name:''}} 发货并提供售后</view> </view> </view> <view class="more-see"> <span class="iconfont icon--xiangyoujiantou"></span> </view> </view> </view> <view class="detail-item-box"> <!--商品评论--> <view class="js__comment" @tap="viewComment" v-if="!detailData.data.shop_hidden_more_info"> <view class="title mx-1px-bottom"> <view class="title_content"> 商品评论({{detailData.meta.comments || 0}}) </view> <view class="praise-of" v-if="detailData.data.comment_rate">好评度 {{detailData.data.comment_rate}}% <span class="iconfont icon--xiangyoujiantou"></span></view> </view> <!-- 标签列表--> <view class="tags-content"> <view class="item" v-for="(item, index) in detailData.data.tags" :key="index" >{{item}}</view> </view> <view class="content" v-if="detailData.data.oneComment && detailData.data.oneComment.length"> <view class="comment_list" v-for="(item, index) in detailData.data.oneComment" :key="index" > <view class="comment_user"> <view class="img-box"> <image :src="item.user.avatar"></image> <view class="user_name">{{item.user.nick_name}}</view> </view> <view class="rater"> <!-- <template is="rater" data="{{ ...$vlc.rater.store }}"/> --> <uni-rate size="18" :disabled="rateDisabled" active-color="red" :value="item.point"></uni-rate> </view> </view> <view class="comment_time"> <view class="time"> {{item.updated_at}} </view> <view class="model"> {{item.item_meta.specs_text}} </view> </view> <view class="comment_content"> {{item.contents}} </view> <view class="comment-img"> <image :src="item" mode="widthFix" alt v-for="(item, index) in item.pic_list" :key="index" ></image> </view> <view class="all-comment mx-1px-top"> <view class="text"> 更多热评 <span class="iconfont icon--xiangyoujiantou"></span> </view> </view> </view> </view> </view> <!--商品参数--> <view v-if="attributesList.top.length"> <view class="title mx-1px-bottom" :data-type="parameter" @tap="change"> <view class="title-text"> 商品参数 </view> <view :class="expands.parameter ? 'arrow-up' : 'arrow-down'"> </view> </view> <view class="content" v-if="expands.parameter"> <view class="argument-box"> <view class="argument-top"> <span v-for="(top,index) in attributesList.top" :key="index"> {{top.name}} : {{top.attribute_value}} </span> </view> <view class="argument-bottom" v-if="attributesList.bottom.length"> <view class="argument-item" v-for="(bottom,idx) in attributesList.bottom" :key="idx"> <view class="index-title">{{bottom.name}} :</view> <view class="index-box"> <view> <view :class="bottom.attribute_value_id == list.id ? 'red-dot' : ''" v-for="(list,index) in bottom.values" > {{list.name}} </view> </view> </view> </view> </view> </view> </view> </view> <!--套餐详情--> <view v-if="detailData.meta.suit && detailData.meta.suit.length!=0"> <view class="title mx-1px-bottom" data-type="meal" @tap="change"> <view class="title-text"> 搭配套餐 </view> <view> </view> </view> <view class="content meals" v-if="!expands.meal"> <view class="commodity_description" v-for="(item, index) in detailData.meta.suit" :key="index" v-for-item="detail"> <view class="meal_list"> <view class="store_list" v-for="(item, index) in detail.items" :key="index" > <view @tap="jumpToDetail" :data-id="item.goods.id"> <image class="slider-image" :src="item.goods.img"></image> <view class="description">{{item.goods.name}}</view> <!-- <view>1</view> <p class="price"><span style="color: red">¥{{i.package_price}}</span>/<span>¥{{i.origin_price}}</span></p> --> </view> </view> </view> <view class="all_count" :data-suitid="detail.id" @tap="jumpMeal"> 搭配套餐价=<span style="color: red">¥{{detail.total}}</span>/<span style="text-decoration: line-through">¥{{detail.origin_total}}</span> </view> <!-- {{{commodity.content}}} --> </view> </view> </view> <!--商品详情--> <view> <view class="title mx-1px-bottom" data-type="commodity" @tap="change"> <view class="title-text"> 商品详情 </view> <view> </view> </view> <view class="content" v-if="expands.commodity"> <u-parse :content="detailData.data.content" v-if="detailData.data.content" /> </view> </view> </view> <!-- <view class="to-top" hidden="{{!showToTop}}" @tap="goTop"> <i class="iconfont icon-xiangshang"></i> </view> --> <!-- <view class="tabbar mx-1px-top"> <view class="tabbar-item item_0 mx-1px-right" data-type="shop" @tap="jump"> <i class="iconfont icon-shangcheng"></i> <text>商城</text> </view> <view class="tabbar-item item_1 mx-1px-right" v-if="{{service_info && service_info.online_service_status == 1}}" @tap="changeAttention"> <i class="iconfont icon-service"></i> <text>客服</text> <button open-type="contact" v-if="{{service_info.online_service_type !== 'self'}}" /> </view> <!– <view class="tabbar-item item_2 {{is_Fav ? 'favorite' : ''}}" @tap="changeStatus"> <i class="iconfont icon-favor"></i> <span>{{is_Fav ? '已收藏' : '收藏'}}</span> </view>–> <view class="tabbar-item item_1 mx-1px-left-right" data-type="cart" @tap="jump"> <i class="iconfont icon-gouwuche"></i> <text>购物车</text> </view> <view class="tabbar-item item_3 alone" @tap="aloneAddToCart" v-if="{{detailData.meta.multiGroupon && detailData.data.multi_groupon_init_status == 1}}" style="background: {{config.secColor}}"> <view class="price">¥{{commodity.sell_price}}</view> 单独购买 </view> <block v-if="{{!detailData.meta.seckill && !detailData.meta.multiGroupon && cart_status.status && !is_fives}}"> <view class="tabbar-item item_3 btn_1" style="background: {{config.secColor}}" @tap="showSelect" v-if="{{detailData.meta.vip_plan && initInfoData.vip_plan_status == 1 && detailData.meta.vip_plan.level != 0}}"> {{cart_status.message}} </view> <block v-else> <view class="tabbar-item item_3 btn_1" v-if="{{cart_status.status || cart_status.seckill || cart_status.group}}" style="background: {{config.secColor}}" @tap="showSelect"> {{cart_status.message}} </view> <view class="tabbar-item item_3 btn_1 no-seckill" v-else @tap="showSelect"> {{cart_status.message}} </view> </block> </block> <!–立即购买–> <view class="tabbar-item item_3 btn_1 svip-btn" data-status="true" @tap="showSelect" v-if="{{detailData.meta.vip_plan && initInfoData.vip_plan_status == 1 && detailData.meta.vip_plan.level != 0}}"> {{immediately_text.message}} </view> <block v-else> <view class="tabbar-item item_3 btn_2 seckill" data-status="true" v-if="{{cart_status.status || cart_status.seckill || cart_status.group}}" style="background: {{config.mainColor}}" @tap="showSelect"> {{immediately_text.message}} </view> <view class="tabbar-item item_3 btn_1 no-seckill" data-status="true" v-else @tap="showSelect"> {{immediately_text.message}} </view> </block> <!–<view class="tabbar-item item_3 btn_2" style="background: {{config.mainColor}}" @tap="immediately" v-if="{{show_immediately}}"> </view>–> </view> --> <view class="tabbar mx-1px-top new-tabbar" v-if="is_show_tabbar"> <view class="tabbar-item item_0" data-type="shop" @tap="jump"> <i class="iconfont icon--shouye"></i> <text>首页</text> </view> <view data-type="cart" @tap="jump" class="tabbar-item item_0 cart-item-box"> <i class="iconfont icon-gouwuche"></i> <text>购物车</text> </view> <view class="tabbar-item item_1 server-item" v-if="service_info && service_info.online_service_status == 1" @tap="changeAttention"> <i class="iconfont icon-service"></i> <text>客服</text> <button open-type="contact" v-if="service_info.online_service_type !== 'self'" /> </view> <view class="tabbar-item item_3 alone" @tap="aloneAddToCart" v-if="detailData.meta.multiGroupon && detailData.data.multi_groupon_init_status == 1" :style="{background: config.secColor}"> 原价购买 <view class="price">¥{{commodity.sell_price}}</view> </view> <!-- 加入购物车 --> <block v-if="!detailData.meta.seckill && !detailData.meta.multiGroupon && cart_status.status && !is_fives"> <view class="tabbar-item item_3 btn_1" :style="{background: config.secColor}" @tap="showSelect" v-if="detailData.meta.vip_plan && initInfoData.vip_plan_status == 1 && detailData.meta.vip_plan.level != 0"> {{cart_status.message}} </view> <block v-else> <!-- 普通 --> <view class="tabbar-item item_3 btn_1" v-if="cart_status.status || cart_status.seckill || cart_status.group" :style="{background: config.secColor}" @tap="showSelect"> {{cart_status.message}} </view> <view class="tabbar-item item_3 btn_1 no-seckill" v-else @tap="showSelect"> {{cart_status.message}} </view> </block> </block> <view class="tabbar-item item_3 btn_1 svip-btn right_btn" data-status="true" @tap="showSelect" v-if="detailData.meta.vip_plan && initInfoData.vip_plan_status == 1 && detailData.meta.vip_plan.level != 0"> {{immediately_text.message}} </view> <block v-else> <!--购买按钮(普通,拼团,秒杀)--> <view class="tabbar-item item_3 btn_2 seckill right_btn" :class="[detailData.meta.multiGroupon ? 'multiGroupon' : '',cart_status.seckill ? 'seckill-btn-box' : '']" data-status="true" v-if="cart_status.status || cart_status.seckill || cart_status.group" @tap="showSelect"> {{immediately_text.message}} </view> <view class="tabbar-item item_3 btn_1 no-seckill right_btn" data-status="true" v-else @tap="showSelect" > {{immediately_text.message}} </view> </block> <!-- <view class="tabbar-item item_1 server-item" v-if="service_info && service_info.online_service_status == 1" @tap="changeAttention"> <i class="iconfont icon-service"></i> <text>客服</text> <button open-type="contact" v-if="service_info.online_service_type !== 'self'" /> </view> --> </view> </view> <view class="maks" :class="!show_select ? 'cur' : ''" @tap="closeSelect"> </view> <view class="detail-popup" :class="!show_select ? 'detail-active' : ''" :hidden="show_select" :animation="show.animation"> <view class="select_goods_container"> <!--关闭按钮--> <view class="select_goods_cloese" @tap="closeSelect"></view> <view class="select_goods_header"> <view class="img_box"> <image v-if="select_product && select_product.img" :src="select_product.img" :alt="select_product.sku"></image> <image v-else :src="commodity.img + ' '" alt></image> </view> <!-- <view class="img_box" style="background-color: {{select_product.bac}};width: 78px;height: 78px;" v-if="{{!select_product.img && !!select_product.color}}"></view> --> <view class="price_item"> <span v-if="select_product"> <text v-if="!cart_status.group || is_alone">¥{{price}}</text> <text v-if="cart_status.group && !is_alone">¥{{detailData.meta.multiGroupon.price}}</text> </span> <span style="font-weight:bold;color:#ee2b1d;" v-else> {{price_interval}} </span> <!-- <text v-else>¥{{price}}</text> <text v-else>{{detailData.meta.groupon.groupon_price}}</text> --> <text v-if="detailData.data.shop_show_store == 1">库存{{store_count}}</text> </view> </view> <view class="select_spec"> <view class="spec_line" v-for="(spec, index) in specs" :key="index"> <view class="spec_title">{{spec.label}}</view> <view class="spec_value"> <view class="spec_block" :class=" !!item.disabled ? 'disabled' : '' " v-for="(item, index) in spec.values" :key="index" :data-key="index" :data-index="item.index" :data-disabled="item.disabled ? 1 : 0" :data-id="item.id" :data-active="item.active ? 1 : 0" @tap="selectSpec"> <!-- <view class="spec_icon spec_text" v-if="item.spec_img"> <image :src="item.spec_img" data-alt="item.alias || item.value"></image> </view> <text class="spec_icon" :style=" 'background-color:'+ item.color" v-if="!item.spec_img && item.color"></text> --> <view class="spec_text" v-if="(item.alias || item.value) && item.spec_img !== ''"> {{item.alias || item.value}} <view v-if="!!item.active" :style="'border-color: ' + config.mainColor" class="border-color"> </view> </view> <view class="spec_text" v-if="!item.spec_img && !item.color"> {{item.alias || item.value}} <view v-if="!!item.active" :style="'border-color: ' + config.mainColor" class="border-color"> </view> </view> </view> <!-- <view class="spec_list" v-if="{{spec.id != 2}}">尺码表</view> --> </view> </view> <view class="spec_line"> <view class="num_title">数量</view> <view class="num_value"> <text @tap="changeCount" data-index="0">-</text> <view class="none_border"> <input @input="modifyCount" :value="select_count" type="number" confirm-type="done"></input> </view> <text @tap="changeCount" data-index="1">+</text> </view> <view class="purchase" v-if="detailData.data.user_limit"> 本商品每人限购{{detailData.data.user_limit}}件 </view> </view> <button class="button" v-if="!canBuy" :style="'background: ' + config.mainColor" type="primary" :loading="loading" @tap="confirmF">确定</button> <button class="button disabled" v-else type="primary" :loading="loading" @tap="confirmF">确定</button> <!-- <view class="button {{ canBuy ? 'disabled' : '' }}" @tap="confirm"> <submit-button v-ref:button bindsubmit="confirm" :status="disallow_cart ? 'disabled' : 'normal'">确定</submit-button> </view> --> </view> </view> </view> <!--弹出客服--> <view class="maks" :class="show_attention ? 'cur' : ''" @tap="changeAttention"> </view> <view class="attention-WeChat" :class="show_attention ? 'cur' : ''"> <view class="service-box"> <view class="code item" @tap="previewImage"> <image mode="widthFix" :src="service_info?service_info.online_service_self.qr_code:''" alt></image> <view class="text"> 保存二维码用微信识别添加 </view> </view> <view class="item phone" @tap="callPhone"> <view class="phone-text"> <image mode="widthFix" :src="service_info?service_info.online_service_self.qr_code:''" alt></image> <view class="phone-warp"> <i class="iconfont icon-dianhua"></i> <view class="phone-num">{{service_info?service_info.online_service_self.phone:''}}</view> <view>点击电话,咨询客服</view> </view> </view> <view> {{service_info?service_info.online_service_self.time:''}} </view> </view> </view> </view> <!--网络繁忙弹窗--> <ten :show="show_ten" @endTen="HideTen"></ten> <!--用户拒绝下载图片授权弹出--> <alert :is_refused="is_refused" @close="closeAlert"></alert> <!--选择优惠券部分--> <view class="maks" :class="show_coupons ? 'cur' : ''" @tap="showCoupons"> </view> <view class="select-coupon-box" :class="show_coupons ? 'cur' : ''"> <view class="select-coupon"> <view class="select-coupon-top"> <view class="title"> 优惠券 <view class="close" @tap="showCoupons"> X </view> </view> </view> <view class="select-coupon-bottom"> <view class="title"> 可领优惠券 </view> <view class="coupon-box"> <view class="coupon-item" v-for="(item, index) in coupons" :key="index" v-if="item.is_open"> <view class="coupon"> <view class="coupon-left" :style="'background: ' + config.mainColor"> <view class="text-wrap"> <view class="text-box"> <view class="text"> <span class="money" v-if="item.action_type.type == 'cash'">¥</span> <span class="num">{{ item.action_type.value }}</span> <span class="money" v-if="item.action_type.type == 'discount'">折</span> </view> <span class="label text">{{ item.label }}</span> </view> </view> <view class="dot-wrap"> <view class="dot-item"> </view> <view class="dot-item"> </view> <view class="dot-item"> </view> <view class="dot-item"> </view> <view class="dot-item"> </view> </view> </view> <view class="coupon-right"> <view class="top"> <span> <span class="type" v-if="item.channel == 'ec'">商店</span> <span class="type" v-if="item.channel == 'shop'">门店</span> </span> <span class="info">{{item.title}}</span> </view> <view class="bottom"> <view class="bottom-use"> <view class="tiem-box"> <text>{{item.use_start_time}}至{{item.use_end_time}}</text> </view> <view class="btn use" :style="'background: ' + config.mainColor + '; border-color: ' + config.mainColor" :data-code="item.code" :data-index="index" v-if="!coupons[index].has_get" @tap="getCoupon"> 点击领取 </view> <view class="btn already" v-else> 已领取 </view> </view> </view> </view> </view> </view> </view> </view> </view> </view> <!--查看促销部分--> <view class="maks" :class="show_discounts ? 'cur' : ''" @tap="showDiscounts"> </view> <view class="see-discounts-box" :class="show_discounts ? 'cur' : ''"> <view class="select-discounts"> <view class="select-discounts-top"> <view class="title"> 促销 <view class="close" @tap="showDiscounts"> X </view> </view> </view> <view class="select-discounts-bottom"> <view class="discounts-box"> <view class="disconts-item mx-1px-bottom" v-for="(item, index) in discounts" :key="index" > <view class="discounts-tags-title" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor"> {{item.tags}} </view> <view class="tags-item"> {{item.label}} </view> </view> </view> </view> </view> </view> <!--弹出第三方供货详情--> <view class="maks" :class="show_third ? 'cur' : ''"> </view> <view class="third-box" :class="show_third ? 'cur' : ''"> <view class="title mx-1px-bottom"> <view class="txt">说明</view> <view class="iconfont icon-close" @tap="changeThird"></view> </view> <view class="content"> <view class="item pad-bottom"> <span class="iconfont icon-Group92"></span> <view class="txt">本商品为第三方供应提供</view> </view> <view class="item pad-bottom"> <span class="iconfont icon-Group92"></span> <view class="txt">由 {{detailData.data.supplier?detailData.data.supplier.company_name:''}} 发货并提供售后</view> </view> <view class="item"> <span class="iconfont icon-Group92"></span> <view class="txt"> <view class="topic pad-bottom">企业信息</view> <view class="info">企业名称:{{detailData.data.supplier?detailData.data.supplier.company_name:''}} </view> <view class="info">企业执照注册号:{{detailData.data.supplier?detailData.data.supplier.company_number:''}} </view> <view class="info">企业地址:{{detailData.data.supplier?detailData.data.supplier.company_address:''}}</view> <view class="info">企业电话:{{detailData.data.supplier?detailData.data.supplier.company_phone:''}}</view> <view class="info">营业期限:{{detailData.data.supplier?detailData.data.supplier.company_limit:''}} </view> <view class="info mar-bottom">经营范围:{{detailData.data.supplier?detailData.data.supplier.company_scope:''}}</view> </view> </view> </view> </view> <!--弹出拼团规则部分--> <view class="maks" :class="show_rule ? 'cur' : ''"> </view> <view class="rule-box" :class="show_rule ? 'cur' :''"> <view class="rules-title"> <view class="text">拼团规则</view> <view class="iconfont icon-close" @tap="closeRule"></view> </view> <view class="rules-content"> <view class="rules-item"> <view class="info-title">【团长】</view> <view class="infomation">是指该团第一位支付的人</view> </view> <view class="rules-item"> <view class="info-title">【开团】</view> <view class="infomation">团长购买拼团商品并完成支付,该团即正式开启;无论该团成功与否,每次活动每人仅可发起一个拼团。</view> </view> <view class="rules-item"> <view class="info-title">【参团】</view> <view class="infomation"> 从团长分享的商品链接进入购买该商品即可成为该团团员,也可将该团链接分享给更多新团员参加,使该团尽快成功并发货。</view> </view> <view class="rules-item"> <view class="info-title">【拼团成功】</view> <view class="infomation">开团后24小时内,该团达到规定的人数,且商品库存充足,则拼团成功。因活动商品紧俏,越快邀请到好友成团购买到活动商品的可能性越大。</view> </view> <view class="rules-item"> <view class="info-title">【拼团失败】</view> <view class="infomation">开团后24小时内未达到规定人数、库存不足活动提前结束、活动时间到期等原因将引起拼团失败。拼团失败后将自动取消订单,活动结束后立即退款。</view> </view> <view class="rules-item"> <view class="info-title">【其他说明】</view> <view class="infomation">拼团活动不可使用优惠券、其他促销折扣、积分。</view> </view> </view> </view> <!--弹出更多门店--> <view class="maks" :class="show_more_shop ? 'cur' : ''"> </view> <view class="more-shop-box" :class="show_more_shop ? 'cur' :''"> <view class="title iconfont icon-close" @tap="changeMoreShop"> </view> <view class="content"> <view class="title-text mx-1px-bottom"> 可自提门店 </view> <view class="shop-list"> <view class="item mx-1px-bottom" v-for="(item, index) in shopInfo" :key="index"> <view class="name"> {{item.name}} </view> <view class="address"> 地址:{{item.address}} </view> <view class="time"> 营业时间:{{item.business_hours}} </view> <!--<view class="phone"> 联系电话:{{item.phone}} </view>--> </view> </view> </view> </view> <!--弹出更多拼团--> <view class="maks" :class="show_more ? 'cur' : ''" @tap="closeMore"> </view> <view class="more-box" :class="show_more ? 'cur' : ''"> <view class="more-title">TA们也在拼</view> <scroll-view scroll-y bindscrolltolower="scrollBottom"> <view class="more-content"> <view v-for="(items, idx) in groupon_itemList" :key="idx" > <view class="more-item" v-for="(item, index) in groupon_itemList[idx]" :key="index"> <view class="use-info"> <image :src="item.leader.meta.avatar"></image> <view class="nick-name">{{item.leader.meta.nick_name}}</view> </view> <view class="offered-info"> <view class="box"> <view class="info-num">还差<span>{{groupon_itemList[0][0].gap_number}}人</span>成团</view> <view class="groups-time-box"> <span>剩余: </span> <group :end="groupon_itemList[0][0].ends_at" :starts="groupon_itemList[0][0].starts_at" :server="detailData.data.server_time" mold="list"> 我已经进来了 </group> </view> </view> <view class="info-btn" @tap="multiAddToCart" :data-id="item.id" :data-join="item.has_joined" :data-no="item.multi_groupon_order_no"> <span v-if="item.has_joined == 1">已参团</span> <span v-else>去参团</span> </view> </view> </view> </view> </view> </scroll-view> </view> <!--弹出分享部分--> <view class="maks share" :class="show_share ? 'cur' : ''" @tap="changeShare"> </view> <view class="share-box" :class="show_share ? 'cur' : ''"> <!-- #ifdef MP-WEIXIN --> <button class="shaer-item" open-type="share"> 分享给好友 </button> <!-- #endif --> <!-- #ifdef APP-PLUS --> <button class="shaer-item" @click="shareapp"> 分享给好友 </button> <!-- #endif --> <view class="shaer-item mx-1px-top" @tap="getShearImg"> 生成海报 </view> <view class="shaer-item clear" @tap="changeShare"> 取消 </view> </view> <!--固定的分享盒子--> <!-- #ifdef MP-WEIXIN || APP-PLUS--> <view class="share-fixed" @tap="changeShare"> <view class="iconfont icon--fenxiang"></view> <view class="txt">分享</view> </view> <!-- #endif --> <!--同款部分--> <view class="maks" :class="show_same ? 'cur' : ''"> </view> <view class="see-discounts-box" :class="show_same ? 'cur' : ''"> <view class="select-discounts"> <view class="select-discounts-top"> <view class="title"> 促销 <view class="close" @tap="showSame"> X </view> </view> </view> <view class="show-same"> 该商品线上商城和线下商场同步销售,欢迎到线下商场体验购买。 </view> </view> </view> <!--分享到朋友圈弹出--> <view class="share-img-box" :class="share_img ? 'cur' : ''"> <view class="imgs-box"> <view class="img"> <image mode="widthFix" :src="shareImg"></image> </view> <!-- #ifdef MP-WEIXIN || APP-PLUS--> <view class="text"> 保存图片后,可分享到朋友圈 </view> <view class="save" :style="'background: ' + config.mainColor" @tap="downImg"> 保存图片 </view> <!-- #endif --> <!-- #ifdef H5 --> <view class="text"> 长按图片,下载保存分享到朋友圈 </view> <!-- #endif --> <i class="iconfont icon-delete" @tap="changeImg"></i> </view> </view> <!--加入购物车弹出--> <view class="cart-box" catchtouchmove="move" :hidden="!show_cart"> <view class="cart-mask"> </view> <view class="cart-dialog"> <view class="title mx-1px-bottom"> 商品成功加入购物车 </view> <view class="buttons"> <view class="button" :style="'background: ' + config.mainColor" @tap="goCart"> 进入购物车 </view> <view class="button agin" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor" @tap="changeCart"> 继续购物 </view> </view> </view> </view> <!-- H5的分享样式--> <view class="maks" :class="is_toggle_share ? 'cur' : ''" @tap="toggleShare"> </view> <view class="new-share-box" :class="is_toggle_share ? 'cur' : ''"> <view class="paney-body"> <view class="title"> 分享到 </view> <view class="btn-box mx-1px-bottom"> <view class="graphic-btn item" @tap="shareGraphic"> <image src="https://cdn.guojiang.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20200428143540.png"></image> <view class="txts"> 图文分享 </view> </view> <view class="weiixn-btn item" @tap="togglePopup('middle-img')"> <image src="https://cdn.guojiang.club/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20200428143536.png"></image> <view class="txts">微信分享</view> </view> </view> <view class="cancel-btn" @tap.stop="toggleShare"> 取消 </view> </view> </view> <!-- 点击图文弹出 --> <view class="graphic-show-box" :class="share_gaphic ? 'cur' : ''" @tap="closeShareGraphic"> <image :src="qr_code_image" mode="widthFix" @tap="preImage"></image> <view class="texts"> 长按图片保存到本地 </view> </view> </view></template><script>var app = getApp();import {pageLogin, getUrl,config,is,GetUrl,// #ifdef MP-WEIXIN
autoLogin// #endif
} from '@/common/js/utils.js';import Animation from '@/common/js/animation.js';// 引入安卓权限
import permision from "@/common/js/permission.js"import uParse from '@/components/gaoyia-parse/parse.vue';import ten from "@/components/ten/ten";import group from "@/components/group/group";import seckill from "@/components/seckill/seckill";import alert from "@/components/alert/alert";import uniRate from "@/components/score/uni-rate/uni-rate.vue";import uniPopup from '@/components/uni-popup/uni-popup.vue';
export default { data() { return { cart_status: { status: false, message: '商品已下架' }, immediately_text: { status: false, message: '商品已下架' }, id: '', skuTable: {}, price: 0, commodity: {}, detailData: {data:'',meta:''}, specs: [], detail: '', attributesList: { top: [], bottom: [] }, expands: { parameter: true, //商品参数
recommend: true, //推荐搭配
commodity: true, //商品详情
story: true, //产品故事
interest: true, //TA们也感兴趣
like: true, //猜你喜欢
history: true //历史浏览
}, showToTop: false, show_select: true, //选尺寸
select_product: {}, //当前选中商品
store_count: 0, store_num: 0, select_count: 1, is_login: true, is_show_tabbar: false, show_attention: false, canBuy: false, query: {}, animationSelect: {}, loading: false, coupons: [], // 可领取的优惠券信息
discounts: [], // 可享受的优惠折扣信息
show_coupons: false, // 领取优惠券
show_discounts: false, // 查看促销活动
show_cart: false, // 加入购物车弹窗
show_share: false, // 弹出分享
message: '', purchaseInfo: { status: false, num: 0 }, // 限购
active: false, type: 0, endTime: { interval: '', day: 0, hour: 0, minute: 0, second: 0, count: 0 }, startsTime: { interval: '', day: 0, hour: 0, minute: 0, second: 0, count: 0 }, show_ten: false, // 网络繁忙弹窗
freeInfo: '', domInfo: { shop: '', like: 0 }, activeName: 'shop', lock: false, author: '', brand: config.BRAND.name, share_img: false, shareImg: "", show_same: false, show_rule: false, show_more: false, groupon_item_id: '', //子参团id
url_groupon_item_id: '', //url上面自带的子参团id 通过分享进来的
groupon_userlist: { userList: '' }, // 拼团用户信息数据
groupon_itemList: [], // 他们也在拼数据
meta: '', // 他们也在拼页面数据
init: false, //是否加载过
more: true, //是否还可以加载
page: 1, //当前请求第几页的数据
emjstatus: { percent: 0, //进度条百分比
lauch: false, //第一个icon控制
half: false, //第二个icon控制
end: false //第三个icon控制
}, show_third: false, //弹出第三方供货
config: '', gbConfig: '', price_interval: '', initInfoData: '', is_immediately: false, is_refused: false, is_fives: false, show_more_shop: false, freeGoodsInfo: '', shopInfo: '', animation:'', show:'', service_info:'', is_alone: false, rateDisabled: true, is_init:false, is_toggle_share:false, share_gaphic:false, qr_code_image:'', open_id:'', // #ifdef H5
env:{ isIPad: /ipad/i.test(window.navigator.userAgent), isIphone: /iphone|ipad|ipod/i.test(window.navigator.userAgent), isWechat: /MicroMessenger/i.test(window.navigator.userAgent) }, // #endif
is_no_specification:false }; }, components: { ten, group, seckill, alert, uParse, uniRate, uniPopup }, onLoad(e) { // 第三方平台配置颜色
var gbConfig = this.$cookieStorage.get('globalConfig') || ''; var init = this.$cookieStorage.get('init'); // this.setData({
// config: gbConfig,
//
// author: init && init.other_technical_support ? init.other_technical_support : ''
// });
//
this.config=gbConfig; this.author=init && init.other_technical_support ? init.other_technical_support : '';
if (!gbConfig) { let extConfig = {};
if (extConfig) { // this.setData({
// config: extConfig
// });
//
this.config=extConfig; } }
wx.showLoading({ title: "加载中", mask: true }); // 显示页面转发按钮
//#ifdef MP-WEIXIN
wx.showShareMenu({ withShareTicket: true }); //#endif
var id = ''; var groupon_item_id = ''; var user_id = '';
if (e.id) { id = e.id; }
if (e.user_id) { user_id = e.user_id; }
if (e.groupon_item_id) { groupon_item_id = e.groupon_item_id; this.setData({ url_groupon_item_id: e.groupon_item_id }); }
if (e.scene) { var scene = decodeURIComponent(e.scene); var sceneArr = scene.split(',');
if (sceneArr.length > 1) { groupon_item_id = sceneArr[2] ? sceneArr[2] : ''; this.setData({ url_groupon_item_id: sceneArr[2] ? sceneArr[2] : '' }); }
id = sceneArr[0];
/* if (sceneArr[3]) { user_id = sceneArr[3]; this.beSharePoint(id, sceneArr[3]); } */ }
if (!id) { wx.redirectTo({ url: '/pages/store/list/list' }); return; }
/* if (e.is_share && e.user_id) { // #ifdef MP-WEIXIN
this.beSharePoint(id, user_id); // #endif
} */ var is_login = this.$cookieStorage.get('user_token'); this.id=id; this.query=e; this.is_login=is_login; this.groupon_item_id=groupon_item_id; this.user_id=user_id; // this.queryDiscounts(e.id);
this.initfun(e); /* 分销相关 S */
/* 分销相关 E */ // 用户登录后请求限购接口
if (this.is_login) { this.goodsPurchase(this.id); }
// H5自动登陆
// #ifdef H5
if(e.openid){ this.open_id = e.openid; this.$cookieStorage.set('openid',e.openid) let agent_code = e.agent_code; this.postNewQuickLogin(this.open_id,agent_code); } // #endif
},
onShareAppMessage(res) { if(res.from === 'menu'){ this.setData({ show_share:false }) } else { this.changeShare(); } var codeTitle = '';
if (this.commodity.user) { codeTitle = this.commodity.user.nick_name + '向您推荐' + this.commodity.name; }
var priceTitle = '¥ ' + this.commodity.sell_price + ' | ' + this.commodity.name; var id = this.commodity.user ? this.commodity.user.id : ''; let pages = getCurrentPages(); let currPage = null; // console.log(pages) 的到一个数组
if (pages.length) { // 获取当前页面的对象(上边所获得的数组中最后一项就是当前页面的对象)
currPage = pages[pages.length - 1]; } // 获取当前页面的路由
let route = currPage.route; return { title: priceTitle, // path: '/' + this.router + '?id=' + this.id,
path: `/${route}?id=${this.id}&agent_code=${this.detailData.data.agent_code}&user_id=${id}&is_share=true`, imageUrl: this.commodity.img }; },
methods: { preImage(){ uni.previewImage({ current:this.qr_code_image, urls:[this.qr_code_image] }) }, //封装H5的登陆
wechatLogin(){ let env = { isIPad: /ipad/i.test(window.navigator.userAgent), isIphone: /iphone|ipad|ipod/i.test(window.navigator.userAgent), isWechat: /MicroMessenger/i.test(window.navigator.userAgent) } let agent_code = this.$cookieStorage.get("agent_code"); if(env.isWechat){ if(this.open_id){ this.$cookieStorage.set('openid',this.open_id) } var openid = this.$cookieStorage.get('openid') || this.open_id; if(openid){ this.postNewQuickLogin(openid,agent_code); } else{ let origin = window.location.origin; let id = this.commodity.user ? this.commodity.user.id : ''; let url = origin+'/pages/store/detail/detail?id='+this.id+'&agent_code='+agent_code+'&user_id='+id+'&is_share=true'; window.location.href = this.$config.GLOBAL.baseUrl+'oauth/wxOauth?redirect_url='+encodeURIComponent(url); } } else{ let url = getUrl(); wx.navigateTo({ url:'/pages/user/loginType/loginType?url='+url }) } }, // 分享给app的好友
shareapp(){ this.changeShare(); var user_id = this.commodity.user ? this.commodity.user.id : ''; var imageUrl = this.commodity.img; var id = this.id; var agent_code = this.detailData.data.agent_code || ''; var priceTitle = '¥ ' + this.commodity.sell_price + ' | ' + this.commodity.name; var url = `pages/store/detail/detail?id=${id}&agent_code=${agent_code}&user_id=${user_id}&is_share=true`; uni.getProvider({ service:'share', success:function(res){ uni.share({ provider: "weixin", scene: "WXSceneSession", type: 5, title:priceTitle, imageUrl:imageUrl, miniProgram:{ id:'gh_72e65196278a', path:`pages/store/detail/detail?id=${id}&agent_code=${agent_code}&user_id=${user_id}&is_share=true`, type:0, webUrl: 'https://guojiang.club' }, success: function (res) { console.log("success:" + JSON.stringify(res)); }, fail: function (err) { console.log("fail:" + JSON.stringify(err)); } }); } }) }, jumpRecharge() { var token = this.$cookieStorage.get('user_token');
if (token) { wx.navigateTo({ url: '/pages/recharge/index/index' }); } else { // #ifdef H5
var url = getUrl()+ '?id='+this.id; // #endif
// #ifdef APP-PLUS || MP-WEIXIN
var url = getUrl(); // #endif
wx.showModal({ content: '请先登录', success: res => { if (res.confirm) { // #ifdef APP-PLUS || MP-WEIXIN
wx.navigateTo({ url: '/pages/user/register/register?url=' + url }); // #endif
// #ifdef H5
this.wechatLogin(); // #endif
} } }); } },
jumpSvip() { if (this.detailData.meta.vip_plan) { var link = this.detailData.meta.vip_plan.vip_plan_equity_link; wx.navigateTo({ url: '/pages/other/links/links?url=' + link }); } },
closeAlert() { this.setData({ is_refused: false }); },
callPhone() { wx.makePhoneCall({ phoneNumber: this.service_info.online_service_self.phone }); },
setCode(e) { var agent_code = '';
if (e.agent_code) { agent_code = e.agent_code; }
if (e.scene) { var scene = decodeURIComponent(e.scene); var sceneArr = scene.split(',');
if (sceneArr.length > 0) { agent_code = sceneArr[1]; } } // 获取agent_code存缓存里
if (agent_code) { // 如果有agent_code并且有coupon_agent_code就将coupon_agent_code清除,保证agent_code为第一位
if (this.$cookieStorage.get('coupon_agent_code')) { this.$cookieStorage.clear('coupon_agent_code'); } const timeMap = { y: 31536000000, m: 2592000000, d: 86400000, h: 3600000, n: 60000, s: 1000 }; // 默认有效期为7天
var valid_time = "";
if (!this.$cookieStorage.get('distribution_valid_time')) { valid_time = 10080; } else { valid_time = this.$cookieStorage.get('distribution_valid_time'); }
let timeStamp = new Date().getTime(); timeStamp += timeMap.n * valid_time; // 如果有agent_code就讲这次进入的时间缓存
this.$cookieStorage.set('agent_code_time', timeStamp, valid_time + 'n'); // 如果缓存中没有agent_code
if (!this.$cookieStorage.get('agent_code')) { var data = []; data.push({ id: this.id, time: timeStamp }); this.$cookieStorage.set('agent_code', agent_code, valid_time + 'n'); this.$cookieStorage.set('agent_goods_id', data); } else { // 判断缓存的code和从url的code相等
if (agent_code == this.$cookieStorage.get('agent_code')) { var data = this.$cookieStorage.get('agent_goods_id') ? this.$cookieStorage.get('agent_goods_id') : []; var flag = false;
for (var i = 0; i < data.length; i++) { if (data[i].id == this.id) { flag = true; data[i].time = timeStamp; break; } }
if (!flag) { data.push({ id: this.id, time: timeStamp }); }
this.$cookieStorage.set('agent_code', agent_code, valid_time + 'n'); this.$cookieStorage.set('agent_goods_id', data); } else { var data = []; ; data.push({ id: this.id, time: timeStamp }); this.$cookieStorage.set('agent_code', agent_code, valid_time + 'n'); this.$cookieStorage.set('agent_goods_id', data); // this.$cookieStorage.set('agent_scan', 0, valid_time + 'n');
} } } },
// 初始化数据
initfun(e) { var token = this.$cookieStorage.get('user_token'); var agent_code = '';
if (e.agent_code) { agent_code = e.agent_code; }
if (e.scene) { var scene = decodeURIComponent(e.scene); var sceneArr = scene.split(',');
if (sceneArr.length > 0) { agent_code = sceneArr[1]; } }
this.$http.get({ api: 'api/system/init' }).then(res => { res = res.data; if (res.status) { this.$cookieStorage.set('init_info', res.data.h5_share); this.$cookieStorage.set('service_info', res.data.online_service_data); this.$cookieStorage.set('distribution_valid_time', res.data.distribution_valid_time); this.$cookieStorage.set('init', res.data); var shareTicketInfo = this.$cookieStorage.get('shareTicketInfo'); var init = this.$cookieStorage.get('init'); var service_info = this.$cookieStorage.get('service_info'); // this.setData({
// service_info: service_info,
// initInfoData: res.data
// });
this.service_info=service_info; this.initInfoData=res.data;
/* if (shareTicketInfo && init && init.get_gid == 1) { this.getGid(shareTicketInfo); } else { } */ this.getStoreDetail(); this.setCode(e);
// #ifdef MP-WEIXIN
if (agent_code && res.data.mini_program_login_type == 'default' && token == '') { wx.showLoading({ title: '正在自动登录', mask: true }); wx.login({ success: res => { if (res.code) { autoLogin(res.code, agent_code).then(res => { if (res.status) { if (res.data.access_token) { var access_token = res.data.token_type + ' ' + res.data.access_token; this.setData({ is_login: access_token }); } if (res.data.open_id) { wx.reLaunch({ url: '/pages/user/agentlogin/agentlogin?agent_code=' + agent_code + '&open_id=' + res.data.open_id + '&url=' + getUrl() }); } } wx.hideLoading(); }, err => { wx.hideLoading(); }); } else { wx.showToast({ title: '获取code失败', icon: 'none' }); } } }); } // #endif
// #ifdef H5
if(agent_code && token == ''){ var env = { isIPad: /ipad/i.test(window.navigator.userAgent), isIphone: /iphone|ipad|ipod/i.test(window.navigator.userAgent), isWechat: /MicroMessenger/i.test(window.navigator.userAgent) } if(env.isWechat){ if(e.openid){ this.$cookieStorage.set('openid',e.openid) } var openid = this.$cookieStorage.get('openid') || e.openid; if(openid){ this.postNewQuickLogin(openid,agent_code); } else{ let origin = window.location.origin; var id = this.commodity.user ? this.commodity.user.id : ''; var url = origin+'/pages/store/detail/detail?id='+this.id+'&agent_code='+agent_code+'&user_id='+id+'&is_share=true'; window.location.href = this.$config.GLOBAL.baseUrl+'oauth/wxOauth?redirect_url='+encodeURIComponent(url); } } else{ var url = getUrl()+ '?id='+this.id; wx.navigateTo({ url:'/pages/user/loginType/loginType?url='+url }) } } // #endif
} else { this.getStoreDetail(); }
this.setCode(e); }).catch(err => { this.setCode(e); }); }, postNewQuickLogin(open_id,agent_code){ wx.showLoading({ title: '正在登录', mask: true }); this.$http.post({ api:'api/oauth/newQuickLogin', data:{ open_id:open_id, agent_code:agent_code } }).then(res=>{ res = res.data; if(res.status){ if(res.data.access_token){ var access_token = res.data.token_type + ' ' + res.data.access_token; var expires_in = res.data.expires_in || 315360000; this.$cookieStorage.set("user_token", access_token, expires_in); //如果用户没有绑定手机号
/* if(res.data.has_bind_mobile == 0){ wx.reLaunch({ url:'/pages/user/bindingphone/bindingphone' }) } else{ } */ this.is_login = this.$cookieStorage.get('user_token'); } else{ wx.showModal({ content: res.message || '请求失败,请重试', showCancel: false }); } } else{ wx.showModal({ content: res.message || '请求失败,请重试', showCancel: false }); } wx.hideLoading() }).catch(rej=>{ wx.showModal({ content: rej.message || '请求失败,请重试', showCancel: false }); wx.hideLoading() }) },
// 请求商品详情页面数据
getStoreDetail(wechat_group_id) { var token = this.$cookieStorage.get('user_token') || ''; var wechat_group_id = wechat_group_id || this.$cookieStorage.get('openGId') || ''; this.getGoodsDetail({ api: `api/store/detail/${this.id}`, header: { Authorization: token }, data: { include: 'photos,oneComment,guessYouLike,point,user', multi_groupon_item_id: this.groupon_item_id, wechat_group_id: wechat_group_id } }).then(() => { if (this.detailData.data.shop_hidden_more_info == 0) { this.getDomInfo('.js__top', 'shop'); // this.getDomInfo('.js__like', 'like');
this.getDomInfo('.js__comment', 'comment'); }
// this.attributesList(this.detailData.meta);
wx.setNavigationBarTitle({ title: this.detailData.data.name }); var price_interval = '¥' + this.detailData.data.min_price + ' - ' + '¥' + this.detailData.data.max_price;
if (this.detailData.data.min_price == this.detailData.data.max_price) {// price_interval = '¥' + this.detailData.data.min_price
}
this.setData({ price_interval: price_interval, is_show_tabbar: true, is_init:true }); // 新增
// 设置价格
this.setData({ price: Number(this.commodity.sell_price).toFixed(2), store_count: this.commodity.store_nums }); this.changeText(); this.immediatelyText(); this.disallow_cart(); this.queryCommodityStore(this.id); // #ifdef H5
if (this.$wechat && this.$wechat.isWechat()) { var desc=this.detailData.data.name; var img=this.detailData.data.img; var priceTitle = '¥ ' + this.commodity.sell_price + ' | ' + this.commodity.name; var id = this.commodity.user ? this.commodity.user.id : ''; var origin = window.location.origin; var pathname = window.location.pathname; var path = origin+'/pages/store/detail/detail?id='+this.id+'&agent_code='+this.detailData.data.agent_code+'&user_id='+id+'&is_share=true'; this.$wechat.share({ title:priceTitle, img:img, desc:'果酱小店' },path); } // #endif
}); },
changeStatus() { var token = this.$cookieStorage.get('user_token');
if (token) { this.changeFavorite(this.id, 'goods'); } else { // #ifdef H5
var url = getUrl()+ '?id='+this.id; // #endif
// #ifdef APP-PLUS || MP-WEIXIN
var url = getUrl(); // #endif
wx.showModal({ content: '请先登录', success: res => { if (res.confirm) { // #ifdef APP-PLUS || MP-WEIXIN
wx.navigateTo({ url: '/pages/user/register/register?url=' + url }); // #endif
// #ifdef H5
this.wechatLogin(); // #endif
} } }); } },
// 监听页面滚动
onPageScroll(e) { if (this.detailData.data.shop_hidden_more_info) { return; }
var shop = this.domInfo.shop; var like = 0; var comment = this.domInfo.comment;
if (!this.lock) { if (e.scrollTop < shop) { this.setData({ activeName: 'shop' }); } else if (e.scrollTop > shop + like && e.scrollTop < shop + like + comment) { this.setData({ activeName: 'comment' }); } else { this.setData({ activeName: 'details' }); } }
this.setData({ lock: false }); },
// 网络繁忙倒计时
HideTen() { this.setData({ show_ten: false }); },
// 弹出客服
showServer() { var srcList = ['https://ibrand-miniprogram.oss-cn-hangzhou.aliyuncs.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/QQ20180517-0.jpg']; wx.previewImage({ urls: srcList }); /*this.setData({ showServer: !this.showServer })*/ },
// 弹出分享
changeShare() { this.setData({ show_share: !this.show_share }); },
//弹出规则
sharRules() { this.setData({ show_rule: !this.show_rule }); },
//弹出第三方供货详情
changeThird() { this.setData({ show_third: !this.show_third }); },
//弹出更多拼团
seeMore() { this.setData({ show_more: !this.show_more }); },
//点击幕布关闭更多拼团
closeMore() { this.setData({ show_more: false }); },
//关闭规则
closeRule() { this.setData({ show_rule: false }); }, //请求h5的图片接口
getCreateShareImg(){ wx.showLoading({ title:"生成中", mask:true }) let origin = window.location.origin; let share_url = origin+'/pages/store/detail/detail'; this.$http.get({ api:'api/distribution/createH5ShareImg', data:{ goods_id:this.id, share_url:share_url } }).then(res=>{ res = res.data; if(res.status){ this.qr_code_image = res.data.image;
if(this.qr_code_image){ this.share_gaphic =!this.share_gaphic;
this.is_toggle_share = false; } } else{ wx.showModal({ content: res.message || '请求失败,请重试', showCancel: false }); } wx.hideLoading() }).catch(rej=>{ wx.hideLoading() wx.showModal({ content: rej.message || '内部错误,请重试', showCancel: false }); }) },
// 弹出图片
changeImg() { // this.setData({
// share_img: !this.share_img
// });
this.share_img=!this.share_img; },
jumpAuthor() { wx.navigateTo({ url: '/pages/index/author/author' }); },
jumpFreeLink(e) { let link = e.currentTarget.dataset.link; wx.navigateTo({ url: link, fail: () => { wx.switchTab({ url: link }); } }); },
// 获取分享图片
getShearImg() { wx.showLoading({ title: "生成中", mask: true }); var token = this.$cookieStorage.get('user_token') || ''; this.$http.get({ api: 'api/distribution/createMiniShareImg', header: { Authorization: token }, data: { goods_id: this.id } }).then(res => { if (res.statusCode == 200) { res = res.data;
if (res.status) { this.setData({ shareImg: res.data.image });
setTimeout(() => { this.changeImg(); }, 100) } else { wx.showModal({ content: res.message || '请求失败', showCancel: false }); } } else { wx.showModal({ content: '请求失败', showCancel: false }); }
wx.hideLoading(); this.changeShare(); }).catch(rej => { wx.showModal({ content: '内部错误', showCancel: false }); wx.hideLoading(); this.changeShare(); }); }, toggleShare(){ this.is_toggle_share = !this.is_toggle_share; },
// 下载图片
downImg() { if (this.shareImg) { wx.showLoading({ title: '正在下载', mask: true }); this.$http.dowloadFile({ api: this.shareImg }).then(res => { if (res.statusCode == 200) { // #ifdef MP-WEIXIN
wx.getSetting({ success: ret => { // 如果之前没有授权
if (!ret.authSetting['scope.writePhotosAlbum']) { wx.authorize({ scope: 'scope.writePhotosAlbum', success: rej => { this.saveImg(res.tempFilePath); }, // 用户拒绝授权
fail: ret => { this.setData({ is_refused: true }); wx.hideLoading(); } }); } else { this.saveImg(res.tempFilePath); } } }); // #endif
// #ifdef APP-PLUS
var that = this; uni.getSystemInfo({ success(result) { if(result.platform == 'android'){ that.requestAndroidPermission(res.tempFilePath); } else if(result.platform == 'ios'){ that.requestIosPermission(res.tempFilePath) } } }) // #endif
} else { wx.hideLoading(); wx.showToast({ title: '下载图片失败', icon: 'none' }); } }, err => {}); } }, //ios app授权
requestIosPermission(url){ var result = permision.judgeIosPermission('photoLibrary'); if(result){ this.saveImg(url); }else{ //打开授权,iOS上如果没有调用过的权限,不会出现在权限设置界面。
permision.gotoAppPermissionSetting() } }, //安卓app授权
async requestAndroidPermission(url) { var result = await permision.requestAndroidPermission("android.permission.WRITE_EXTERNAL_STORAGE") var strStatus if (result == 1) { strStatus = "已获得授权"; this.saveImg(url); } else if (result == 0) { strStatus = "未获得授权"; void permision.gotoAppPermissionSetting() } else { strStatus = "被永久拒绝权限" void permision.gotoAppPermissionSetting() } },
// 保存图片
saveImg(path) { wx.saveImageToPhotosAlbum({ filePath: path, success: res => { wx.hideLoading(); wx.showToast({ title: '保存图片成功', icon: 'success' }); }, fail: rej => { wx.hideLoading(); wx.showToast({ title: '保存图片失败', icon: 'none' }); } }); },
// 获取节点信息
getDomInfo(name, type) { var query = uni.createSelectorQuery().in(this); query.select(name).boundingClientRect(res => { this.setData({ [`domInfo.${type}`]: res.height }); }).exec(); },
jumpScroll(e) { var type = e.target.dataset.type;
if (type == 'shop') { wx.pageScrollTo({ scrollTop: 0, duration: 0 }); } else if (type == 'comment') { wx.pageScrollTo({ scrollTop: this.domInfo.shop + this.domInfo.like + 10, duration: 0 }); } else if (type == 'details') { wx.pageScrollTo({ scrollTop: this.domInfo.shop + this.domInfo.like + this.domInfo.comment, duration: 0 }); } else { wx.pageScrollTo({ scrollTop: this.domInfo.shop, duration: 0 }); }
this.setData({ activeName: type, lock: true }); },
viewComment() { wx.navigateTo({ url: '/pages/store/comment/comment?id=' + this.id }); },
immediatelyText() { var ret; var commodity = this.commodity; var seckill = this.detailData.meta.seckill; var group = this.detailData.meta.multiGroupon;
if (!commodity) { return; }
if (commodity.is_del != 0 || commodity.is_largess != 0) { ret = { status: false, message: '商品已下架' }; } else if (commodity.store_nums <= 0) { ret = { status: false, message: '商品缺货中' }; } else { ret = { status: true, message: '立即购买' }; }
if (seckill && seckill.init_status == 2) { ret = { seckill: false, message: '原价购买' }; } else if (seckill && seckill.init_status == 1) { ret = { seckill: true, message: '立即抢购' }; }
if (group && commodity.multi_groupon_init_status == 2) { ret = { group: false, message: '原价购买' }; } else if (group && commodity.multi_groupon_init_status == 1) { if (this.detailData.data.multi_groupon_join_status == 1) { ret = { group: true, message: '已参团' }; } else if (this.groupon_item_id) { ret = { group: true, message: '一键参团' }; } else { ret = { group: true, message: '一键开团' }; } }
this.setData({ immediately_text: ret }); },
changeMoreShop() { this.setData({ show_more_shop: !this.show_more_shop }); },
changeText() { var ret; var commodity = this.commodity; var seckill = this.detailData.meta.seckill; var group = this.detailData.meta.multiGroupon;
if (!commodity) { return; }
if (commodity.is_del != 0 || commodity.is_largess != 0) { ret = { status: false, message: '商品已下架' }; } else if (commodity.store_nums <= 0) { ret = { status: false, message: '商品缺货中' }; } else { ret = { status: true, message: '加入购物车' }; }
if (seckill && seckill.init_status == 2) { ret = { status: true, seckill: false, message: '原价购买' }; } else if (seckill && seckill.init_status == 1) { ret = { status: true, seckill: true, message: '立即抢购' }; }
if (group && commodity.multi_groupon_init_status == 2) { ret = { status: true, group: false, message: '原价购买' }; } else if (group && commodity.multi_groupon_init_status == 1) { if (this.detailData.data.multi_groupon_join_status == 1) { ret = { status: true, group: true, message: '已参团' }; } else if (this.groupon_item_id) { ret = { status: true, group: true, message: '一键参团' }; } else { ret = { status: true, group: true, message: '一键开团' }; } }
this.setData({ cart_status: ret }); },
// 活动开始的倒计时
countTime() { var d = 86400000, h = 3600000, n = 60000, end = this.detailData.meta.seckill.ends_at, server = this.detailData.meta.seckill.server_time, arr = String(end).split(/\D/), newArr = String(server).split(/\D/); newArr = newArr.map(Number); arr = arr.map(Number); var serverTime = new Date(newArr[0], newArr[1] - 1, newArr[2], newArr[3], newArr[4], newArr[5]).getTime(); // var nowTime = new Date().getTime();
var endTime = new Date(arr[0], arr[1] - 1, arr[2], arr[3], arr[4], arr[5]).getTime(); // 组件才秒杀列表页使用时,没有重新请求列表,服务器时间应该加上未开始倒计时的时间
if (this.mold == 'list') { serverTime = serverTime + this.startsTime.count; } // 计算开始时间跟结束时间的差值
var timeDiff = endTime - serverTime; // 在本地计算倒计时
var allTime = this.endTime.count + 1000; this.setData({ 'endTime.count': allTime }); // this.endTime.count += 1000;
var interval = timeDiff - this.endTime.count;
if (interval < 0) { // 活动结束
this.isEnd(); // this.$emit('end',this.index)
} else { var day = Math.floor(interval / d); Math.floor(interval -= day * d); var hour = Math.floor(interval / h); Math.floor(interval -= hour * h); var minute = Math.floor(interval / n); var second = Math.floor(interval % n / 1000); this.setData({ 'endTime.day': day, 'endTime.hour': hour, 'endTime.minute': minute, 'endTime.second': second }); // this.endTime.day = day;
// this.endTime.hour = hour;
// this.endTime.minute = minute;
// this.endTime.second = second;
} },
// 活动未开始的倒计时
countStartsTime() { var d = 86400000, h = 3600000, n = 60000, sta = this.detailData.meta.seckill.starts_at, server = this.detailData.meta.seckill.server_time, arr = String(sta).split(/\D/), newArr = String(server).split(/\D/); newArr = newArr.map(Number); arr = arr.map(Number); var serverTime = new Date(newArr[0], newArr[1] - 1, newArr[2], newArr[3], newArr[4], newArr[5]).getTime(); var staTime = new Date(arr[0], arr[1] - 1, arr[2], arr[3], arr[4], arr[5]).getTime(); var timeDiff = staTime - serverTime; var allTime = this.startsTime.count + 1000; this.setData({ 'startsTime.count': allTime }); // this.startsTime.count += 1000;
var interval = timeDiff - this.startsTime.count; // var interval = staTime - nowTime;
// 时间差小于一天
if (interval < d) { this.setData({ type: 1 });
if (interval < 0) { // 代表活动已经开始了,需要执行活动开始倒计时
var interval = setInterval(this.countTime, 1000); this.setData({ active: true, 'endTime.interval': interval }); this.isStarts(); // this.active = true;
// this.startsTime.count = -(this.startsTime.count - 1000)
// this.$emit('starts',this.index);
// this. = setInterval(this.countTime,1000);
// 清除掉倒计时,以免重复分发事件
clearInterval(this.startsTime.interval); } else { var day = Math.floor(interval / d); Math.floor(interval -= day * d); var hour = Math.floor(interval / h); Math.floor(interval -= hour * h); var minute = Math.floor(interval / n); var second = Math.floor(interval % n / 1000); this.setData({ 'startsTime.day': day, 'startsTime.hour': hour, 'startsTime.minute': minute, 'startsTime.second': second }); // this.startsTime.day = day;
// this.startsTime.hour = hour;
// this.startsTime.minute = minute;
// this.startsTime.second = second;
} } else { this.setData({ message: `${arr[1]} 月 ${arr[2]} 日,${arr[3]} : ${arr[4]} 开始` }); // this.message = `${arr[1] - 1} 月 ${arr[2]} 日,${arr[3]} : ${arr[4]} 开始`
} },
// 秒杀结束执行
isEnd() { if (this.detailData.meta.seckill || this.detailData.meta.groupon) { var id = this.id; var token = this.$cookieStorage.get('user_token') || ''; this.getGoodsDetail({ api: `api/store/detail/${id}`, header: { Authorization: token }, data: { include: 'photos,products,oneComment,guessYouLike,whoLike,point,user' } }); this.queryCommodityStore(id); } },
isStarts() { if (this.detailData.meta.seckill && this.detailData.meta.seckill.init_status == 2 || this.detailData.meta.groupon && this.commodity.multi_groupon_init_status == 2) { var token = this.$cookieStorage.get('user_token') || ''; var id = this.id; this.getGoodsDetail({ api: `api/store/detail/${id}`, header: { Authorization: token }, data: { include: 'photos,products,oneComment,guessYouLike,whoLike,point,user' } }); this.queryCommodityStore(id); } },
// onStateChange(nextState){
// console.log(nextState)
// if (!app.isEmptyObject(nextState.detailData)) {
// Wxparse.wxParse('detailI', 'html', nextState.detailData.data.content, this, 0);
// this.attributesList(nextState.detailData.meta);
// wx.setNavigationBarTitle({
// title: nextState.detailData.data.name
// })
// this.setData({
// detailData: nextState.detailData,
// commodity: nextState.detailData.data
// })
// wx.hideLoading()
// }
//
// // if (nextState.commoditySpec.length > 0 ) {
// //
// // this.setData({
// // specs:nextState.commoditySpec
// // })
// // }
// //
// // if (!app.isEmptyObject(nextState.resultStore)) {
// // this.specStore(nextState.resultStore,nextState.resultStore.key)
// //
//
// // }
//
// },
change(e) { var expands = this.expands[e.currentTarget.dataset.type]; this.setData({ [`expands.${e.currentTarget.dataset.type}`]: !expands }); },
jumpCollage() { var multi_groupon_item_id = this.groupon_userlist.multi_groupon_item_id; wx.navigateTo({ url: `/pages/store/collage/collage?multi_groupon_item_id=${multi_groupon_item_id}` }); },
showSelect(e) { /*if (this.id == 1) { this.call(); return }*/ var id = e.target.dataset.id; var group = this.detailData.meta.multiGroupon; var multi_groupon_item_id = this.groupon_userlist.multi_groupon_item_id;
if (group && this.commodity.multi_groupon_init_status == 1 && this.detailData.data.multi_groupon_join_status == 1) { if (this.detailData.data.multi_groupon_order_no) { wx.showModal({ content: '您的参团订单未支付,点击确定继续支付', success: res => { if (res.confirm) { wx.navigateTo({ url: '/pages/store/payment/payment?order_no=' + this.detailData.data.multi_groupon_order_no }); } } }); } else { wx.navigateTo({ url: `/pages/store/collage/collage?multi_groupon_item_id=${multi_groupon_item_id}` }); } } else { //直接进来,URL上面没有子参团id,想要从他们也在拼的去参团买
if (id) { this.setData({ show_more: false, groupon_item_id: id }); } else if (this.url_groupon_item_id) { //通过分享进来的
this.setData({ groupon_item_id: this.url_groupon_item_id }); } else { this.setData({ groupon_item_id: '' }); }
if (e.target.dataset.status && (this.immediately_text.message == '立即购买' || this.immediately_text.message == '原价购买')) { this.setData({ is_immediately: true }); } else { this.setData({ is_immediately: false }); }
// this.setData({
// is_alone: false,
// show_select: false
// });
this.is_alone=false; this.show_select=false; // #ifdef MP-WEIXIN
var animation = new Animation('show'); animation.positionInit(); // #endif
} },
// 子团点击
multiAddToCart(e) { var id = e.currentTarget.dataset.id; var status = e.currentTarget.dataset.join; var order_no = e.currentTarget.dataset.order_no;
if (status == 1) { // 当订单未付款时跳转到付款页面
if (order_no) { wx.showModal({ content: '您的参团订单未支付,点击确定继续支付', success: res => { if (res.confirm) { wx.navigateTo({ url: '/pages/store/payment/payment?order_no=' + order_no }); } } }); } else { wx.navigateTo({ url: `/pages/store/collage/collage?multi_groupon_item_id=${id}` }); }
return; }
if (id) { this.setData({ show_more: false, groupon_item_id: id }); } else if (this.url_groupon_item_id) { this.setData({ groupon_item_id: this.url_groupon_item_id }); } else { this.setData({ groupon_item_id: '' }); }
this.setData({ show_select: false, is_alone: false }); // #ifdef MP-WEIXIN
var animation = new Animation('show'); animation.positionInit(); // #endif
},
// 单独购买
aloneAddToCart() { this.setData({ is_alone: true, show_select: false }); // #ifdef MP-WEIXIN
var animation = new Animation('show'); animation.positionInit(); // #endif
},
// 立即购买
immediately() { this.setData({ is_immediately: true, show_select: false }); // #ifdef MP-WEIXIN
var animation = new Animation('show'); animation.positionInit(); // #endif
},
closeSelect() { // #ifdef MP-WEIXIN
var animation = new Animation('show'); animation.up().then(() => { this.setData({ show_select: true }); }); // #endif
// #ifdef H5 || APP-PLUS
this.show_select=true; // #endif
},
changeCount(e) { var select_count = parseInt(this.select_count); var index = e.target.dataset.index; var val = select_count + (parseInt(index) ? 1 : -1);
if (val > 0 && val <= parseInt(this.store_count)) { this.setData({ select_count: val }); // 用户登录并且开启了限购
if (this.purchaseInfo.status && this.is_login) { if (this.select_count > this.purchaseInfo.num) { this.setData({ select_count: this.select_count - 1 }); wx.showToast({ title: '超过限购数量', image: '../../../static/error.png' }); } } } else if (val <= 0) { wx.showToast({ title: '小于最小库存', image: '../../../static/error.png' }); } else if (val > parseInt(this.store_count)) { wx.showToast({ title: '超出最大库存', image: '../../../static/error.png' }); } },
modifyCount(e) { var val = parseInt(e.detail.value);
if (!val) { val = 1; } else if (!/^[1-9]\d*$/.test(val)) { val = val.replace(/[^\d].*$/, ''); val = parseInt(val) || 1; }
if (this.purchaseInfo.status && this.is_login) { if (val < 0) { val = 1; } else if (val > this.purchaseInfo.num) { val = this.purchaseInfo.num || 1; wx.showToast({ title: '超过限购数量', image: '../../../static/error.png' }); } } else { if (val < 0) { val = 1; } else if (val > this.store_count) { wx.showToast({ title: '超过最大库存', image: '../../../static/error.png' }); val = parseInt(this.store_count); } }
this.setData({ select_count: val }); },
showCoupons() { this.setData({ show_coupons: !this.show_coupons }); },
changeAttention() { if (this.service_info.online_service_type !== 'self') return; this.setData({ show_attention: !this.show_attention }); },
showDiscounts() { this.setData({ show_discounts: !this.show_discounts }); },
showSame() { this.setData({ show_same: !this.show_same }); },
getCoupon(e) { var is_login = this.$cookieStorage.get('user_token'); var code = e.currentTarget.dataset.code; var index = e.currentTarget.dataset.index; if (is_login) { this.goodsConvertCoupon(code, index); } else { // #ifdef APP-PLUS || MP-WEIXIN
var url = getUrl()+ '?id='+this.id; // #endif
// #ifdef H5
var url = getUrl(); // #endif
wx.showModal({ content: '请先登录', success: res => { if (res.confirm) { // #ifdef APP-PLUS || MP-WEIXIN
wx.navigateTo({ url: '/pages/user/register/register?url=' + url }); // #endif
// #ifdef H5
this.wechatLogin() // #endif
} } }); } },
selectSpec(e) { var spec = { key: e.currentTarget.dataset.key, index: e.currentTarget.dataset.index, disabled: Number(e.currentTarget.dataset.disabled), active: Number(e.currentTarget.dataset.active), id: Number(e.currentTarget.dataset.id) }; if (spec.disabled) return; var specs = this.specs;
if (!spec.active) { for (let item of specs[spec.index].values) { if (item.active) { item.active = false; break; } } }
specs[spec.index].values[spec.key].active = !specs[spec.index].values[spec.key].active; spec.active = !spec.active; specs[spec.index].select = spec.active ? spec.id : ''; this.setData({ specs: specs }); var canBuy = this.disallow_cart(); this.setData({ canBuy: canBuy }); // this.queryCommodityStore(id, spec.index);
this.specStore(this.result, spec.index); },
specStore(result, key) { var query = this.query; var data = result.data; var specs = this.specs;
if (key === undefined) { specs.forEach(spec => { for (let v of spec.values) { v.disabled = !data[v.id] || data[v.id].count == 0; } }); this.setData({ specs: specs, skuTable: result.table }); specs = this.specs; var canBuy = this.disallow_cart(); this.setData({ canBuy: canBuy }); specs.forEach(spec => { let name = 'spec[' + spec.id + ']';
if (query[name]) { let id = query[name];
for (let v of spec.values) { if (v.id == id && !v.disabled && data[v.id] && data[v.id].count) { v.active = true; spec.select = v.id; this.setData({ specs: specs }); specs = this.specs; var canBuy = this.disallow_cart(); this.setData({ canBuy: canBuy }); this.specStore(result, v.index); return; } } }
if (!spec.select) { for (let v of spec.values) { if (!v.disabled && data[v.id] && data[v.id].count) { v.active = true; spec.select = v.id; this.setData({ specs: specs }); specs = this.specs; var canBuy = this.disallow_cart(); this.setData({ canBuy: canBuy }); // this.$emit('specStore', result, v.index);
this.specStore(result, v.index); return; } }
return; }
this.setData({ specs: specs }); }); return; }
var spec = specs[key];
if (spec.select) { this.setData({ store_count: data[spec.select].count });
for (let i = 0; i < specs.length; i++) { if (i == key) continue; specs[i].values.forEach(v => { v.disabled = !data[spec.select].specs[v.id].count; });
if (specs[i].select) { this.setData({ store_count: data[spec.select].specs[specs[i].select].count }); }
this.setData({ specs: specs }); } } else { this.setData({ store_count: this.commodity.store });
for (let i = 0; i < specs.length; i++) { if (i == key) continue; specs[i].values.forEach(v => { v.disabled = !data[v.id] || !data[v.id].count; });
if (specs[i].select) { this.setData({ store_count: data[specs[i].select].count }); }
this.setData({ specs: specs }); } }
if (parseInt(this.select_count) > this.store_count) { this.setData({ select_count: String(this.store_count) }); } else if (parseInt(this.select_count) == 0) { this.setData({ select_count: '1' }); }
this.setData({ specs: specs }); var canBuy = this.disallow_cart(); // this.setData({
// canBuy: canBuy
// });
//
this.canBuy=canBuy; },
confirmF() { if (this.loading) return; if (this.disallow_cart()) return; this.setData({ loading: true }); var select_product = this.select_product; var select_count = Number(this.select_count); var data = this.specs.length ? { id: select_product.id, name: this.commodity.name, qty: select_count, store_count: this.store_count, price: select_product.price, market_price: this.commodity.market_price, attributes: { img: select_product.img || this.detailData.data.photos[0].url, size: select_product.size, color: select_product.color, com_id: this.commodity.id, } } : { id: this.commodity.id, name: this.commodity.name, qty: select_count, store_count: this.store_count, price: this.commodity.sell_price, market_price: this.commodity.market_price, attributes: { img: this.commodity.img || this.detailData.data.photos[0].url, com_id: this.commodity.id, } }; // if (this.channel) data.attributes.channel = 'employee';
if (select_product.sku) data.attributes.sku = select_product.sku; // 秒杀开始添加信息
if (this.detailData.meta.seckill && this.detailData.meta.seckill.init_status == 1) { var newData = {}; newData.attributes = {}; newData.id = data.id; newData.img = data.attributes.img || this.detailData.data.photos[0].url; newData.name = data.name; if(this.is_no_specification){ newData.price = this.price; } else{ newData.price = data.price; } newData.qty = data.qty; newData.total = data.qty * newData.price; newData.seckill_goods_id = this.detailData.meta.seckill.item_id; newData.seckill_item_id = this.detailData.meta.seckill.id;
if (this.specs.length) { newData.attributes['dynamic_sku'] = {}; newData.attributes['dynamic_sku'].id = data.id; newData.attributes['dynamic_sku'].size = data.attributes.size; newData.attributes['dynamic_sku'].color = data.attributes.color; } } // 拼团开始添加信息
if (this.detailData.meta.multiGroupon && this.commodity.multi_groupon_init_status == 1) { /* var grouponData = data; */ var grouponData = JSON.parse(JSON.stringify(data)); grouponData.multi_groupon_id = this.detailData.meta.multiGroupon.id; grouponData.price = this.detailData.meta.multiGroupon.price; grouponData.multi_groupon_item_id = this.groupon_item_id; } // 添加511特殊需求信息
if (this.is_immediately) { var immdeData = JSON.parse(JSON.stringify(data)); immdeData.product_id = data.id; } // 判断是否登录
// var is_login = !!Cache.get(cache_keys.token);
// 判断是否参与秒杀并且秒杀开始
if (this.detailData.meta.seckill && this.detailData.meta.seckill.init_status == 1) { if (!this.is_login) { var url = getUrl()+ '?id='+this.id; wx.showModal({ content: '请先登录', success: res => { if (res.confirm) { // #ifdef APP-PLUS || MP-WEIXIN
wx.navigateTo({ url: '/pages/user/register/register?url=' + url }); // #endif
// #ifdef H5
this.wechatLogin() // #endif
} } }); } else { this.checkoutSeckillOrder(newData); } } else if (this.detailData.meta.multiGroupon && this.commodity.multi_groupon_init_status == 1 && !this.is_alone) { if (!this.is_login) { // #ifdef H5
var url = getUrl()+ '?id='+this.id; // #endif
// #ifdef APP-PLUS || MP-WEIXIN
var url = getUrl(); // #endif
wx.showModal({ content: '请先登录', success: res => { if (res.confirm) { // #ifdef APP-PLUS || MP-WEIXIN
wx.navigateTo({ url: '/pages/user/register/register?url=' + url }); // #endif
// #ifdef H5
this.wechatLogin() // #endif
} } }); } else { this.checkoutGroupOrder(grouponData); } } else if (this.is_immediately) { if (!this.is_login) { // #ifdef APP-PLUS || MP-WEIXIN
var url = getUrl() // #endif
// #ifdef H5
var url = getUrl()+ '?id='+this.id; // #endif
wx.showModal({ content: '请先登录', success: res => { if (res.confirm) { // #ifdef APP-PLUS || MP-WEIXIN
wx.navigateTo({ url: '/pages/user/register/register?url=' + url }); // #endif
// #ifdef H5
this.wechatLogin() // #endif
this.loading = false }
} }); } else { // 是否立即购买
this.checkoutImmdeOrder(immdeData); } } else { if (this.is_login) { this.appendToCart(data); this.addStoreNum(); } else { data.local = true; data.total = Number(data.qty) * Number(data.price); data.color = data.attributes.color; data.size = data.attributes.size; data.img = data.attributes.img; var locals = this.$cookieStorage.get('cart') || []; locals.unshift(data); var skus = {}; var save = []; locals.forEach(v => { let sku, index;
if (v.attributes && v.attributes.sku) { sku = v.attributes.sku; } else { sku = v.id; }
if (skus[sku] === undefined) { index = save.length; v.index = index; v.checked = true; save.push(v); skus[sku] = index; } else { let i = skus[sku]; save[i].qty += v.qty; save[i].total += v.total; save[i].store_count = this.store_count; } }); // console.log(skus, save)
this.$cookieStorage.set('cart', save); this.setData({ store_num: 0 }); this.addStoreNum(); this.addCart(true); } } },
addStoreNum() { // 判断是否登录
// var is_login = !!Cache.get(cache_keys.token);
// var cache_store_num = Cache.get(cache_keys.cart);
var cache_store_num = this.$cookieStorage.get('cart');
if (this.is_login) { this.queryShoppingCount(); } else { if (cache_store_num && cache_store_num.length) { var store_num = this.store_num; cache_store_num.forEach(v => { store_num += v.qty; }); this.setData({ store_num: store_num }); } } },
disallow_cart() { if (!this.specs.length) { return !this.store_count; }
var ids = [], select_product = {}, specs = this.specs; // console.log(this.commodity.sell_price)
//设置价格
this.setData({ price: Number(this.commodity.sell_price).toFixed(2) });
for (let spec of specs) { if (!spec.select) { this.setData({ price: Number(this.commodity.sell_price).toFixed(2), select_product: null }); return true; }
ids.push(spec.select);
for (let v of spec.values) { if (v.id == spec.select) { switch (spec.label_key) { case 'color': select_product.img = v.spec_img; select_product.color = v.alias || v.value; select_product.bac = v.color; break;
default: select_product.size = v.alias || v.value; }
break; } } }
if (this.skuTable) { ids = ids[0] > ids[1] ? [ids[1], ids[0]] : ids; ids = ids.join('-'); select_product = Object.assign(select_product, this.skuTable[ids]); }
//设置价格
this.setData({ price: Number(select_product.price).toFixed(2), select_product: select_product }); return false; },
jump(e) { if (e.currentTarget.dataset.type == 'shop') { wx.switchTab({ url: '/pages/index/index/index' }); } else if (e.currentTarget.dataset.type == 'cart') { wx.switchTab({ url: '/pages/store/cart/cart' }); } else { wx.navigateTo({ url: '/pages/store/detail/detail?id=' + e.currentTarget.dataset.id }); } },
jumpToDetail(e) { var id = e.currentTarget.dataset.id; wx.navigateTo({ url: `/pages/store/detail/detail?id=${id}` }); },
jumpMeal(e) { var id = e.currentTarget.dataset.suitid; wx.navigateTo({ url: `/pages/store/meal/meal?id=${id}` }); },
bigImg(e) { var srcList = []; var src = e.currentTarget.dataset.url; this.detailData.data.photos.forEach(i => { srcList.push(i.url); });
if (src && srcList.length) { wx.previewImage({ current: src, urls: srcList }); } },
previewImage() { wx.previewImage({ current: this.service_info.online_service_self.qr_code, urls: [this.service_info.online_service_self.qr_code] }); },
goCart() { wx.switchTab({ url: '/pages/store/cart/cart' }); this.changeCart(); },
changeCart() { this.setData({ show_cart: !this.show_cart }); },
call(e) { var token = this.$cookieStorage.get('user_token'); var id = this.freeInfo.id; var CallUrl = '/pages/store/call/call?id=' + id;
if (!token) { // #ifdef H5
var url = getUrl()+ '?id='+this.id; // #endif
// #ifdef APP-PLUS || MP-WEIXIN
var url = getUrl(); // #endif
// #ifdef APP-PLUS || MP-WEIXIN
wx.navigateTo({ url: '/pages/user/register/register?url=' + url }); // #endif
// #ifdef H5
this.wechatLogin() // #endif
return; }
wx.navigateTo({ url: CallUrl }); },
// 请求sku
queryCommodityStore(id, key) { var that = this; this.$http.get({ api: `api/store/detail/${id}/stock` }).then(res => { wx.hideLoading(); res = res.data; if (!res.status || !res.data || !res.data.specs) return; //是无规格商品并且是秒杀商品
if((res.data.specs && res.data.specs.length == 0) && (res.data.stores && res.data.stores.length == 0)){ if(this.detailData.meta.seckill){ this.is_no_specification = true; this.price = this.commodity.seckill_price; } }
if (res.data.specs && typeof key === 'undefined') { let specs = []; Object.keys(res.data.specs).forEach((key, index) => { let value = res.data.specs[key]; value.select = ''; value.values = value.list.map(v => { return Object.assign({ index: index, active: false, disabled: false }, v); }); delete value.list; specs.push(value); }); that.setData({ specs: specs }); // console.log(specs)
var canBuy = this.disallow_cart(); this.setData({ canBuy: canBuy }); }
if (res.data.stores) { let data = {}; Object.keys(res.data.stores).forEach(key => { let value = res.data.stores[key]; value.ids.forEach(id => { data[id] = data[id] || { count: 0, specs: {} }; data[id].count += Number(value.store); value.ids.forEach(i => { if (i == id) return; data[id].specs[i] = { count: Number(value.store) }; }); }); }); // console.log(data);
var result = { data, table: res.data.stores }; // this.setData({
// result: result
// });
this.result=result; that.specStore(result, key); // this.$emit('specStore', result, key);
} }).catch(err => { console.log('paojinlai zheli') }); },
queryShoppingCount() { var oauth = this.is_login; this.$http.get({ api: `api/shopping/cart/count`, header: { Authorization: oauth } }).then(res => {}).catch(rej => {}); },
appendToCart(data) { if (!Array.isArray(data)) { data = [data]; }
var oauth = this.is_login; var json = {}; data.forEach((v, i) => json[i] = v); data = json; var that = this; this.$http.post({ api: 'api/shopping/cart', header: { Authorization: oauth }, data: data }).then(res => { res = res.data;
if (res.status) { that.addCart(true); } else { that.addCart(false, res.message); } }).catch(rej => { that.addCart(false); }); },
addCart(success, message) { this.setData({ loading: false });
if (success) { this.closeSelect(); this.changeCart(); } else { if (message) { wx.showToast({ title: message, icon: 'none' }); } else { wx.showToast({ title: '添加到购物车失败,请重试', icon: 'none' }); } } },
// 请求商品详情页面数据
getGoodsDetail(obj) { var that = this; return new Promise((resolve, reject) => { this.$http.get(obj).then(res => { // console.log(res)
if (res.statusCode == 200) { res = res.data;
if (res.status) { that.setData({ detailData: res, commodity: res.data }); /*if (res.meta.seckill) { var interval = setInterval(this.countStartsTime, 1000); that.setData({ 'startsTime.interval': interval }) }*/
if (res.meta.discounts) { res.meta.discounts.coupons.forEach(v => v.receive = false); that.setData({ coupons: res.meta.discounts.coupons, discounts: res.meta.discounts.discounts }); }
if (res.meta.multiGroupon) { //当有拼团,并且拼团正在进行中
var id = this.id; // 商品id
var multi_groupon_item_id = this.groupon_item_id; // 子参团id
this.getGrouponUserList(id, multi_groupon_item_id); this.getGrouponItems(res.meta.multiGroupon.id, 1, multi_groupon_item_id); this.controlProgress(); }
resolve(); } else { wx.showModal({ content: res.message || '请求失败', showCancel: false }); wx.hideLoading(); reject(); } } else { wx.showModal({ content: res.message || '请求失败', showCancel: false }); wx.hideLoading(); reject(); } }).catch(err => { wx.showModal({ content: res.message || '请求失败', showCancel: false }); wx.hideLoading(); // console.log(err);
reject(); }); }); },
// 查询商品详情页优惠折扣信息
// queryDiscounts(id) {
// wx.request({
// url: config.GLOBAL.baseUrl + 'api/store/detail/' + id + '/discount',
// success: res => {
// if (res.statusCode == 200) {
// res = res.data;
// if (res.status) {
// res.data.coupons.forEach(v => v.receive = false);
// this.setData({
// coupons: res.data.coupons,
// discounts: res.data.discounts
// })
// }
// }
// }
// })
// },
// 领取优惠券
goodsConvertCoupon(code, index) { var token = this.$cookieStorage.get('user_token'); this.$http.post({ api: 'api/coupon/convert', header: { Authorization: token }, data: { coupon_code: code } }).then(res => { res = res.data;
if (res.status) { this.coupons[index].has_get = true; this.$set(this.coupons,index,this.coupons[index]); wx.showToast({ title: '领取成功' }); } else { wx.showToast({ title: res.message, image: '../../../static/error.png' }); } }); },
// 秒杀结算
checkoutSeckillOrder(data) { var token = this.$cookieStorage.get('user_token'); this.$http.post({ api: 'api/shopping/order/checkout?seckill_item_id=' + data.seckill_item_id, header: { Authorization: token }, data: data }).then(res => { if (res.statusCode == 200) { res = res.data;
if (res.status) { this.$cookieStorage.set('local_order', res.data); this.setData({ loading: false }); wx.navigateTo({ url: '/pages/store/order/order?type=seckill' }); } else { if (res.data && res.data.server_busy) { this.setData({ show_ten: true }); } else if (res.message == 'User unbind mobile') { wx.showModal({ content: '请先绑定手机号', showCancel: false, success: res => { if (res.confirm || !res.cancel && !res.confirm) { wx.navigateTo({ url: '/pages/user/phone/phone?url=' + getUrl() }); } } }); } else { wx.showModal({ content: res.message || '请求失败', showCancel: false }); }
this.setData({ loading: false }); } } }); },
// 拼团结算
checkoutGroupOrder(data) { var token = this.$cookieStorage.get('user_token'); this.$http.post({ api: 'api/shopping/order/checkout', header: { Authorization: token }, data: data }).then(res => { if (res.statusCode == 200) { res = res.data;
if (res.status) { var info = { multi_groupon_id: data.multi_groupon_id, multi_groupon_item_id: data.multi_groupon_item_id }; this.$cookieStorage.set('group_info', info); this.$cookieStorage.set('local_order', res.data); this.setData({ loading: false }); wx.navigateTo({ url: '/pages/store/order/order?type=groupon' }); } else { if (res.data && res.data.server_busy) { this.setData({ show_ten: true }); } else if (res.message == 'User unbind mobile') { wx.showModal({ content: '请先绑定手机号', showCancel: false, success: res => { if (res.confirm || !res.cancel && !res.confirm) { wx.navigateTo({ url: '/pages/user/phone/phone?url=' + getUrl() }); } } }); } else { wx.showModal({ content: res.message || '请求失败', showCancel: false }); }
this.setData({ loading: false }); } } }); },
// 虚拟参团
jumpVirtual() { wx.navigateTo({ url: '/pages/store/virtual/virtual?id=' + this.id + '&multi_groupon_id=' + this.detailData.meta.multiGroupon.id }); },
// 立即购买
checkoutImmdeOrder(data) { var token = this.$cookieStorage.get('user_token'); this.$http.post({ api: 'api/shopping/order/checkout?product_id=' + data.id, header: { Authorization: token }, data: data }).then(res => { if (res.statusCode == 200) { res = res.data;
if (res.status) { this.$cookieStorage.set('local_order', res.data); this.setData({ loading: false }); wx.navigateTo({ url: '/pages/store/order/order' }); } else { if (res.data && res.data.server_busy) { this.setData({ show_ten: true }); } else if (res.message == 'User unbind mobile') { wx.showModal({ content: '请先绑定手机号', showCancel: false, success: res => { if (res.confirm || !res.cancel && !res.confirm) { wx.navigateTo({ url: '/pages/user/phone/phone?url=' + getUrl() }); } } }); } else { wx.showModal({ content: res.message || '请求失败', showCancel: false }); }
this.setData({ loading: false }); } } }); },
// 商品限购
goodsPurchase(id) { var token = this.$cookieStorage.get('user_token'); this.$http.get({ api: 'api/store/goods/purchase/' + id, header: { Authorization: token } }).then(res => { if (res.statusCode == 200) { res = res.data;
if (res.status) { if (res.data) { this.setData({ 'purchaseInfo.status': true, 'purchaseInfo.num': res.data.user_limit }); } } else { wx.showModal({ content: res.message || '接口错误', showCancel: false }); } } else { wx.showModal({ content: '请求失败', showCancel: false }); } }); },
//请求拼团数据
getGrouponUserList(id, multi_groupon_item_id) { var token = this.$cookieStorage.get('user_token') || ''; this.$http.get({ api: 'api/multiGroupon/getGrouponUserList', header: { Authorization: token }, data: { goods_id: id, multi_groupon_item_id: multi_groupon_item_id } }).then(res => { if (res.statusCode == 200) { res = res.data;
if (res.status) { this.setData({ groupon_userlist: res.data }); } else { wx.showModal({ content: res.message || '拼团信息请求失败', showCancel: false }); } } else { wx.showModal({ content: '拼团信息请求失败', showCancel: false }); } }); },
//scroll-view 滚动刷新
scrollBottom() { var hasMore = this.meta.pagination.total_pages > this.meta.pagination.current_page; var multi_groupon_id = this.detailData.meta.multiGroupon.id;
if (hasMore) { this.setData({ more: true }); var page = this.meta.pagination.current_page + 1; var multi_groupon_item_id = this.multi_groupon_item_id; this.getGrouponItems(multi_groupon_id, page, multi_groupon_item_id); } else { wx.showToast({ image: '../../../static/error.png', title: '再拉也没有啦' }); } },
//他们也在拼请求数据
getGrouponItems(multi_groupon_id, page, multi_groupon_item_id) { wx.showLoading({ title: "加载中", mask: true }); var token = this.$cookieStorage.get('user_token') || ''; this.$http.get({ api: 'api/multiGroupon/getGrouponItems', header: { Authorization: token }, data: { multi_groupon_id: multi_groupon_id, page: page, multi_groupon_item_id: multi_groupon_item_id } }).then(res => { if (res.statusCode == 200) { res = res.data;
if (res.status) { this.setData({ //[`groupon_itemList[${page - 1}]`]: res.data,
meta: res.meta, init: true }); this.$set(this.groupon_itemList, page -1, res.data); } else { wx.showModal({ content: res.message || '请求他们也在拼数据失败', showCancel: false }); } } else { wx.showModal({ content: '请求他们也在拼数据失败', showCancel: false }); }
this.setData({ more: false }); wx.hideLoading(); }).catch(rej => { wx.hideLoading(); wx.showModal({ content: res.message || '请求失败', showCancel: false }); }); },
//进度条控制3种状态
controlProgress() { // todo
if (this.commodity.multi_groupon_init_status == 1) { if (this.detailData.data.multi_groupon_join_status || this.groupon_item_id) { //只要你是满团,就是显示全红
if (this.detailData.data.multi_groupon_item_complete_status != 0) { this.setData({ emjstatus: { percent: 100, //进度条百分比
lauch: true, //第一个icon控制
half: true, //第二个icon控制
end: true //第三个icon控制
} }); } else { this.setData({ emjstatus: { percent: 50, //进度条百分比
lauch: true, //第一个icon控制
half: true, //第二个icon控制
end: false //第三个icon控制
} }); } } } },
/* beSharePoint(goods_id, user_id) { wx.login({ success: res => { if (res.code) { this.sharePoint(res.code, goods_id, user_id); } } }); }, */
togglePopup(type) { this.type = type; if(this.type == "middle-img"){ this.is_toggle_share = false } }, shareGraphic(){ this.getCreateShareImg(); }, closeShareGraphic(){ this.share_gaphic =!this.share_gaphic; }, ShearUser(){ this.togglePopup('middle-img') }, async shareFc() { try { console.log('准备生成:' + new Date()) const d = await getSharePoster({ _this: this, //若在组件中使用 必传
type: 'testShareType', formData: { //访问接口获取背景图携带自定义数据
}, posterCanvasId: this.canvasId, //canvasId
delayTimeScale: 20, //延时系数
/* background: { width: 1080, height: 1920, backgroundColor: '#666' }, */ drawArray: ({ bgObj, type, bgScale }) => { const dx = bgObj.width * 0.3; const fontSize = bgObj.width * 0.045; const lineHeight = bgObj.height * 0.04; //可直接return数组,也可以return一个promise对象, 但最终resolve一个数组, 这样就可以方便实现后台可控绘制海报
return new Promise((rs, rj) => { rs([{ type: 'custom', setDraw(Context) { Context.setFillStyle('black'); Context.setGlobalAlpha(0.3); Context.fillRect(0, bgObj.height - bgObj.height * 0.2, bgObj.width, bgObj.height * 0.2); Context.setGlobalAlpha(1); } }, { type: 'image', url: '/static/3.jpg', alpha: .3, dx, dy: bgObj.height - bgObj.width * 0.25, infoCallBack(imageInfo) { let scale = bgObj.width * 0.2 / imageInfo.height; return { circleSet: { x: imageInfo.width * scale / 2, y: bgObj.width * 0.2 / 2, r: bgObj.width * 0.2 / 2 }, // 圆形图片 , 若circleSet与roundRectSet一同设置 优先circleSet设置
dWidth: imageInfo.width * scale, // 因为设置了圆形图片 所以要乘以2
dHeight: bgObj.width * 0.2, /* roundRectSet: { // 圆角矩形 r: imageInfo.width * .1 } */ } } }, { type: 'text', fontStyle: 'italic', text: '取舍', size: fontSize, color: 'white', alpha: .5, textAlign: 'left', textBaseline: 'middle', infoCallBack(textLength) { _app.log('index页面的text的infocallback ,textlength:' + textLength); return { dx: bgObj.width - textLength - fontSize, dy: bgObj.height - lineHeight * 3 } }, serialNum: 0, id: 'tag1' //自定义标识
}, { type: 'text', text: '取舍', fontWeight: 'bold', size: fontSize, color: 'white', alpha: .75, textAlign: 'left', textBaseline: 'middle', serialNum: 1, allInfoCallback({ //v3.0.1 更新 可以获取drawArray中全部数据
drawArray } = {}) { const obj = drawArray.find(item => item.id === 'tag1'); /* return { dx: obj.dx, dy: obj.dy + lineHeight } */ //也可以return promise对象
return new Promise((rs, rj) => { setTimeout(() => { rs({ dx: obj.dx, dy: obj.dy + lineHeight }); }, 1); }); } }, { type: 'text', text: '取舍', size: fontSize, color: 'white', alpha: 1, textAlign: 'left', textBaseline: 'middle', infoCallBack(textLength) { return { dx: bgObj.width - textLength - fontSize, dy: bgObj.height - lineHeight } } }, { type: 'qrcode', text: '你好,我是取舍', // size: bgObj.width * 0.2,
size: 80, dx: bgObj.width * 0.05, // dy: bgObj.height - bgObj.width * 0.25
dy: 380 } ]); }) }, setCanvasWH: ({ bgObj, type, bgScale }) => { // 为动态设置画布宽高的方法,
this.poster = bgObj; } }); console.log('海报生成成功, 时间:' + new Date() + ', 临时路径: ' + d.poster.tempFilePath) this.poster.finalPath = d.poster.tempFilePath; this.qrShow = true; } catch (e) { _app.hideLoading(); _app.showToast(JSON.stringify(e)); console.log(JSON.stringify(e)); } },
setData: function (obj) { let that = this; let keys = []; let val, data; Object.keys(obj).forEach(function (key) { keys = key.split('.'); val = obj[key]; data = that.$data; keys.forEach(function (key2, index) { if (index + 1 == keys.length) { that.$set(data, key2, val); } else { if (!data[key2]) { that.$set(data, key2, {}); } }
data = data[key2]; }); }); } }, computed: {}, watch: {}};</script>
<style rel="stylesheet/less" lang="less"> @import "detail";</style>
|