|
|
@ -1,182 +1,188 @@ |
|
|
|
<template> |
|
|
|
<template> |
|
|
|
<view :class="productConClass"> |
|
|
|
<view :class="productConClass"> |
|
|
|
<product-con-swiper :img-urls="storeInfo.sliderImageArr"></product-con-swiper> |
|
|
|
<view v-if="storeInfo.id"> |
|
|
|
<view class="wrapper"> |
|
|
|
<product-con-swiper :img-urls="storeInfo.sliderImageArr"></product-con-swiper> |
|
|
|
<view class="share acea-row row-between row-bottom"> |
|
|
|
<view class="wrapper"> |
|
|
|
<view class="money font-color-red"> |
|
|
|
<view class="share acea-row row-between row-bottom"> |
|
|
|
<text>¥</text> |
|
|
|
<view class="money font-color-red"> |
|
|
|
<text class="num">{{ storeInfo.price }}</text> |
|
|
|
<text>¥</text> |
|
|
|
<text |
|
|
|
<text class="num">{{ storeInfo.price }}</text> |
|
|
|
class="vip-money" |
|
|
|
<text |
|
|
|
v-if="storeInfo.vipPrice && storeInfo.vipPrice > 0" |
|
|
|
class="vip-money" |
|
|
|
>¥{{ storeInfo.vipPrice }}</text> |
|
|
|
v-if="storeInfo.vipPrice && storeInfo.vipPrice > 0" |
|
|
|
<image |
|
|
|
>¥{{ storeInfo.vipPrice }}</text> |
|
|
|
src="@/static/images/vip.png" |
|
|
|
<image |
|
|
|
class="image" |
|
|
|
src="@/static/images/vip.png" |
|
|
|
v-if="storeInfo.vipPrice && storeInfo.vipPrice > 0" |
|
|
|
class="image" |
|
|
|
/> |
|
|
|
v-if="storeInfo.vipPrice && storeInfo.vipPrice > 0" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="iconfont icon-fenxiang" @click="listenerActionSheet"></view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="introduce">{{ storeInfo.storeName }}</view> |
|
|
|
|
|
|
|
<view class="label acea-row row-between-wrapper"> |
|
|
|
|
|
|
|
<text>原价:¥{{ storeInfo.otPrice }}</text> |
|
|
|
|
|
|
|
<text>库存:{{ storeInfo.stock }}{{ storeInfo.unitName }}</text> |
|
|
|
|
|
|
|
<text>销量:{{ storeInfo.sales }}{{ storeInfo.unitName }}</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view |
|
|
|
|
|
|
|
class="coupon acea-row row-between-wrapper" |
|
|
|
|
|
|
|
@click="couponTap" |
|
|
|
|
|
|
|
v-if="couponList.length" |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<text class="hide line1 acea-row"> |
|
|
|
|
|
|
|
<text>优惠券:</text> |
|
|
|
|
|
|
|
<text |
|
|
|
|
|
|
|
class="activity" |
|
|
|
|
|
|
|
v-for="(item, couponListEq) in couponList" |
|
|
|
|
|
|
|
:key="couponListEq" |
|
|
|
|
|
|
|
>满{{ item.use_min_price }}减{{ item.coupon_price }}</text> |
|
|
|
|
|
|
|
</text> |
|
|
|
|
|
|
|
<view class="iconfont icon-jiantou"></view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="iconfont icon-fenxiang" @click="listenerActionSheet"></view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="introduce">{{ storeInfo.storeName }}</view> |
|
|
|
|
|
|
|
<view class="label acea-row row-between-wrapper"> |
|
|
|
|
|
|
|
<text>原价:¥{{ storeInfo.otPrice }}</text> |
|
|
|
|
|
|
|
<text>库存:{{ storeInfo.stock }}{{ storeInfo.unitName }}</text> |
|
|
|
|
|
|
|
<text>销量:{{ storeInfo.sales }}{{ storeInfo.unitName }}</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="coupon acea-row row-between-wrapper" @click="couponTap" v-if="couponList.length"> |
|
|
|
<view class="attribute acea-row row-between-wrapper" @click="selecAttrTap"> |
|
|
|
<text class="hide line1 acea-row"> |
|
|
|
<view> |
|
|
|
<text>优惠券:</text> |
|
|
|
<text>{{ attrTxt }}:</text> |
|
|
|
<text |
|
|
|
<text class="atterTxt">{{ attrValue }}</text> |
|
|
|
class="activity" |
|
|
|
</view> |
|
|
|
v-for="(item, couponListEq) in couponList" |
|
|
|
|
|
|
|
:key="couponListEq" |
|
|
|
|
|
|
|
>满{{ item.use_min_price }}减{{ item.coupon_price }}</text> |
|
|
|
|
|
|
|
</text> |
|
|
|
|
|
|
|
<view class="iconfont icon-jiantou"></view> |
|
|
|
<view class="iconfont icon-jiantou"></view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="store-info"> |
|
|
|
<view class="attribute acea-row row-between-wrapper" @click="selecAttrTap"> |
|
|
|
<view class="title acea-row row-between-wrapper"> |
|
|
|
<view> |
|
|
|
<view>门店信息</view> |
|
|
|
<text>{{ attrTxt }}:</text> |
|
|
|
<text @click="goStoreList()" class="praise"> |
|
|
|
<text class="atterTxt">{{ attrValue }}</text> |
|
|
|
更多 |
|
|
|
</view> |
|
|
|
<text class="iconfont icon-jiantou"></text> |
|
|
|
<view class="iconfont icon-jiantou"></view> |
|
|
|
</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="store-info"> |
|
|
|
<view class="info acea-row row-between-wrapper"> |
|
|
|
<view class="title acea-row row-between-wrapper"> |
|
|
|
<view class="picTxt acea-row row-between-wrapper"> |
|
|
|
<view>门店信息</view> |
|
|
|
<view class="pictrue"> |
|
|
|
<text @click="goStoreList()" class="praise"> |
|
|
|
<image :src="systemStore.image" /> |
|
|
|
更多 |
|
|
|
</view> |
|
|
|
<text class="iconfont icon-jiantou"></text> |
|
|
|
<view class="text"> |
|
|
|
</text> |
|
|
|
<view class="name line1">{{ systemStore.name }}</view> |
|
|
|
</view> |
|
|
|
<view class="address acea-row row-middle" @click="showChang"> |
|
|
|
<view class="info acea-row row-between-wrapper"> |
|
|
|
<text class="addressTxt">{{systemStore.address}}</text> |
|
|
|
<view class="picTxt acea-row row-between-wrapper"> |
|
|
|
<text class="iconfont icon-youjian"></text> |
|
|
|
<view class="pictrue"> |
|
|
|
</view> |
|
|
|
<image :src="systemStore.image" /> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="addressBox"> |
|
|
|
<view class="text"> |
|
|
|
<a |
|
|
|
<view class="name line1">{{ systemStore.name }}</view> |
|
|
|
:href="'tel:'+systemStore.phone" |
|
|
|
<view class="address acea-row row-middle" @click="showChang"> |
|
|
|
class="iconfont icon-dadianhua01 font-color-red phone" |
|
|
|
<text class="addressTxt">{{systemStore.address}}</text> |
|
|
|
></a> |
|
|
|
<text class="iconfont icon-youjian"></text> |
|
|
|
<view class="addressTxt corlor-yshop">距离{{systemStore.distance}}千米</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="addressBox"> |
|
|
|
|
|
|
|
<a |
|
|
|
|
|
|
|
:href="'tel:'+systemStore.phone" |
|
|
|
|
|
|
|
class="iconfont icon-dadianhua01 font-color-red phone" |
|
|
|
|
|
|
|
></a> |
|
|
|
|
|
|
|
<view class="addressTxt corlor-yshop">距离{{systemStore.distance}}千米</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="userEvaluation" v-if="replyCount"> |
|
|
|
<view class="userEvaluation" v-if="replyCount"> |
|
|
|
<view class="title acea-row row-between-wrapper"> |
|
|
|
<view class="title acea-row row-between-wrapper"> |
|
|
|
<view>用户评价({{ replyCount }})</view> |
|
|
|
<view>用户评价({{ replyCount }})</view> |
|
|
|
<text @click="goEvaluateList(id)" class="praise"> |
|
|
|
<text @click="goEvaluateList(id)" class="praise"> |
|
|
|
<text class="font-color-red">{{ replyChance }}%</text>好评率 |
|
|
|
<text class="font-color-red">{{ replyChance }}%</text>好评率 |
|
|
|
<text class="iconfont icon-jiantou"></text> |
|
|
|
<text class="iconfont icon-jiantou"></text> |
|
|
|
</text> |
|
|
|
</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<user-evaluation :reply="reply"></user-evaluation> |
|
|
|
<user-evaluation :reply="reply"></user-evaluation> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="superior"> |
|
|
|
|
|
|
|
<view class="title acea-row row-center-wrapper"> |
|
|
|
|
|
|
|
<image src="@/static/images/ling.png" /> |
|
|
|
|
|
|
|
<text class="titleTxt">优品推荐</text> |
|
|
|
|
|
|
|
<image src="@/static/images/ling.png" /> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<template> |
|
|
|
<view class="superior"> |
|
|
|
<view class="slider-banner banner"> |
|
|
|
<view class="title acea-row row-center-wrapper"> |
|
|
|
<swiper :options="swiperRecommend" v-if="goodList.length > 0"> |
|
|
|
<image src="@/static/images/ling.png" /> |
|
|
|
<swiper-slide v-for="(item, eq2) in goodList" :key="eq2"> |
|
|
|
<text class="titleTxt">优品推荐</text> |
|
|
|
<view class="list acea-row row-middle"> |
|
|
|
<image src="@/static/images/ling.png" /> |
|
|
|
<view class="item" v-for="val in item.list" :key="val.image"> |
|
|
|
</view> |
|
|
|
<view class="pictrue"> |
|
|
|
<template> |
|
|
|
<image :src="val.image" /> |
|
|
|
<view class="slider-banner banner"> |
|
|
|
|
|
|
|
<swiper :options="swiperRecommend" v-if="goodList.length > 0"> |
|
|
|
|
|
|
|
<swiper-slide v-for="(item, eq2) in goodList" :key="eq2"> |
|
|
|
|
|
|
|
<view class="list acea-row row-middle"> |
|
|
|
|
|
|
|
<view class="item" v-for="val in item.list" :key="val.image"> |
|
|
|
|
|
|
|
<view class="pictrue"> |
|
|
|
|
|
|
|
<image :src="val.image" /> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="name line1">{{ val.store_name }}}</view> |
|
|
|
|
|
|
|
<view class="money font-color-red">¥{{ val.price }}</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="name line1">{{ val.store_name }}}</view> |
|
|
|
|
|
|
|
<view class="money font-color-red">¥{{ val.price }}</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</swiper-slide> |
|
|
|
</swiper-slide> |
|
|
|
<view class="swiper-pagination" slot="pagination"></view> |
|
|
|
<view class="swiper-pagination" slot="pagination"></view> |
|
|
|
</swiper> |
|
|
|
</swiper> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="product-intro"> |
|
|
|
|
|
|
|
<text class="title">产品介绍</text> |
|
|
|
|
|
|
|
<view class="conter" v-html="storeInfo.description"></view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view style="height:100rpx;"></view> |
|
|
|
|
|
|
|
<view class="footer acea-row row-between-wrapper"> |
|
|
|
|
|
|
|
<view class="item" @click="setCollect" v-if="storeInfo.userCollect"> |
|
|
|
|
|
|
|
<view class="iconfont icon-shoucang1"></view> |
|
|
|
|
|
|
|
<text>收藏</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="item" @click="setCollect" v-if="!storeInfo.userCollect"> |
|
|
|
<view class="product-intro"> |
|
|
|
<view class="iconfont icon-shoucang"></view> |
|
|
|
<text class="title">产品介绍</text> |
|
|
|
<text>收藏</text> |
|
|
|
<view class="conter" v-html="storeInfo.description"></view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view @click="goShoppingCart()" v-if="animated" class="item animated bounceIn"> |
|
|
|
<view style="height:100rpx;"></view> |
|
|
|
<view class="iconfont icon-gouwuche1"> |
|
|
|
<view class="footer acea-row row-between-wrapper"> |
|
|
|
<text class="num bg-color-red" v-if="CartCount > 0">{{CartCount}}</text> |
|
|
|
<view class="item" @click="setCollect" v-if="storeInfo.userCollect"> |
|
|
|
|
|
|
|
<view class="iconfont icon-shoucang1"></view> |
|
|
|
|
|
|
|
<text>收藏</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<text>购物车</text> |
|
|
|
<view class="item" @click="setCollect" v-if="!storeInfo.userCollect"> |
|
|
|
</view> |
|
|
|
<view class="iconfont icon-shoucang"></view> |
|
|
|
<view @click="goShoppingCart()" class="item animated" v-if="!animated"> |
|
|
|
<text>收藏</text> |
|
|
|
<view class="iconfont icon-gouwuche1"> |
|
|
|
</view> |
|
|
|
<text class="num bg-color-red" v-if="CartCount > 0">{{CartCount}}</text> |
|
|
|
<view @click="goShoppingCart()" v-if="animated" class="item animated bounceIn"> |
|
|
|
|
|
|
|
<view class="iconfont icon-gouwuche1"> |
|
|
|
|
|
|
|
<text class="num bg-color-red" v-if="CartCount > 0">{{CartCount}}</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<text>购物车</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view @click="goShoppingCart()" class="item animated" v-if="!animated"> |
|
|
|
|
|
|
|
<view class="iconfont icon-gouwuche1"> |
|
|
|
|
|
|
|
<text class="num bg-color-red" v-if="CartCount > 0">{{CartCount}}</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<text>购物车</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="bnt acea-row"> |
|
|
|
|
|
|
|
<view class="joinCart" @click="joinCart"> |
|
|
|
|
|
|
|
<text>加入购物车</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="buy" @click="tapBuy"> |
|
|
|
|
|
|
|
<text>立即购买</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<text>购物车</text> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="bnt acea-row"> |
|
|
|
<CouponPop v-on:changeFun="changeFun" :coupon="coupon"></CouponPop> |
|
|
|
<view class="joinCart" @click="joinCart"> |
|
|
|
<ProductWindow v-on:changeFun="changeFun" :attr="attr" :cartNum="cart_num"></ProductWindow> |
|
|
|
<text>加入购物车</text> |
|
|
|
<StorePoster |
|
|
|
|
|
|
|
v-on:setPosterImageStatus="setPosterImageStatus" |
|
|
|
|
|
|
|
:posterImageStatus="posterImageStatus" |
|
|
|
|
|
|
|
:posterData="posterData" |
|
|
|
|
|
|
|
:goodId="id" |
|
|
|
|
|
|
|
></StorePoster> |
|
|
|
|
|
|
|
<ShareInfo v-on:setShareInfoStatus="setShareInfoStatus" :shareInfoStatus="shareInfoStatus"></ShareInfo> |
|
|
|
|
|
|
|
<view class="generate-posters acea-row row-middle on" v-if="posters"> |
|
|
|
|
|
|
|
<view class="item" @click="setPosterImageStatus"> |
|
|
|
|
|
|
|
<view class="iconfont icon-haibao"></view> |
|
|
|
|
|
|
|
<view>生成海报</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="buy" @click="tapBuy"> |
|
|
|
</view> |
|
|
|
<text>立即购买</text> |
|
|
|
<view class="generate-posters acea-row row-middle" v-if="!posters"> |
|
|
|
|
|
|
|
<view class="item" @click="setPosterImageStatus"> |
|
|
|
|
|
|
|
<view class="iconfont icon-haibao"></view> |
|
|
|
|
|
|
|
<view>生成海报</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="mask" @touchmove.prevent @click="listenerActionClose" v-show="posters"></view> |
|
|
|
<CouponPop v-on:changeFun="changeFun" :coupon="coupon"></CouponPop> |
|
|
|
<view class="geoPage" v-if="mapShow"> |
|
|
|
<ProductWindow v-on:changeFun="changeFun" :attr="attr" :cartNum="cart_num"></ProductWindow> |
|
|
|
<iframe |
|
|
|
<StorePoster |
|
|
|
width="100%" |
|
|
|
v-on:setPosterImageStatus="setPosterImageStatus" |
|
|
|
height="100%" |
|
|
|
:posterImageStatus="posterImageStatus" |
|
|
|
frameborder="0" |
|
|
|
:posterData="posterData" |
|
|
|
scrolling="no" |
|
|
|
:goodId="id" |
|
|
|
:src="'https://apis.map.qq.com/uri/v1/geocoder?coord=' +systemStore.latitude +',' +systemStore.longitude +'&referer=' +mapKey" |
|
|
|
></StorePoster> |
|
|
|
></iframe> |
|
|
|
<ShareInfo v-on:setShareInfoStatus="setShareInfoStatus" :shareInfoStatus="shareInfoStatus"></ShareInfo> |
|
|
|
|
|
|
|
<view class="generate-posters acea-row row-middle on" v-if="posters"> |
|
|
|
|
|
|
|
<view class="item" @click="setPosterImageStatus"> |
|
|
|
|
|
|
|
<view class="iconfont icon-haibao"></view> |
|
|
|
|
|
|
|
<view>生成海报</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="posterCanvasWarp"> |
|
|
|
<view class="generate-posters acea-row row-middle" v-if="!posters"> |
|
|
|
<canvas class="posterCanvas" canvas-id="myCanvas"></canvas> |
|
|
|
<view class="item" @click="setPosterImageStatus"> |
|
|
|
|
|
|
|
<view class="iconfont icon-haibao"></view> |
|
|
|
|
|
|
|
<view>生成海报</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="mask" @touchmove.prevent @click="listenerActionClose" v-show="posters"></view> |
|
|
|
|
|
|
|
<view class="geoPage" v-if="mapShow"> |
|
|
|
|
|
|
|
<iframe |
|
|
|
|
|
|
|
width="100%" |
|
|
|
|
|
|
|
height="100%" |
|
|
|
|
|
|
|
frameborder="0" |
|
|
|
|
|
|
|
scrolling="no" |
|
|
|
|
|
|
|
:src="'https://apis.map.qq.com/uri/v1/geocoder?coord=' +systemStore.latitude +',' +systemStore.longitude +'&referer=' +mapKey" |
|
|
|
|
|
|
|
></iframe> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="posterCanvasWarp"> |
|
|
|
|
|
|
|
<canvas class="posterCanvas" canvas-id="myCanvas"></canvas> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
@ -729,7 +735,6 @@ export default { |
|
|
|
width: 0.76 * 100rpx; |
|
|
|
width: 0.76 * 100rpx; |
|
|
|
height: 0.76 * 100rpx; |
|
|
|
height: 0.76 * 100rpx; |
|
|
|
margin-right: 0.2 * 100rpx; |
|
|
|
margin-right: 0.2 * 100rpx; |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.product-con .store-info .info .picTxt .pictrue image { |
|
|
|
.product-con .store-info .info .picTxt .pictrue image { |
|
|
|