|
|
|
@ -33,11 +33,11 @@ |
|
|
|
<text class="lf-font-48 lf-color-primary lf-font-bold">8493</text> |
|
|
|
<text class="lf-font-28 lf-color-777 lf-m-l-10">个兑换</text> |
|
|
|
</view> |
|
|
|
<lf-price :iftext="false" :price="111" v-else></lf-price> |
|
|
|
<lf-price :iftext="false" :price="goods_detail.min_price || 0" v-else></lf-price> |
|
|
|
<text class="lf-iconfont icon-fenxiang lf-font-40" @click="shareGraphic()"></text> |
|
|
|
</view> |
|
|
|
<view class="lf-row-between lf-font-24 lf-m-t-20 lf-p-b-20"> |
|
|
|
<view class="lf-font-bold lf-font-32 lf-color-222">颐莲喷雾 500ml</view> |
|
|
|
<view class="lf-font-bold lf-font-32 lf-color-222">{{ goods_detail.name }}</view> |
|
|
|
</view> |
|
|
|
<view class="lf-row-between lf-font-24 lf-p-b-30"> |
|
|
|
<view class="lf-font-28 lf-color-777" v-if="type == 'self'">门店自提</view> |
|
|
|
@ -45,42 +45,45 @@ |
|
|
|
<view v-if="type == 'seckill'">已有38人购买</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<self-line></self-line> |
|
|
|
<view class="bg-white" v-if="type == 'self'"> |
|
|
|
<view class="cu-bar padding-lr"> |
|
|
|
<view class="lf-flex"> |
|
|
|
<text class="lf-color-777 lf-font-28">优惠</text> |
|
|
|
<view v-if="orderDetails.coupon == ''"> |
|
|
|
<text class="lf-color-price lf-font-28 lf-m-l-10" v-for="(item,index) of orderDetails.coupon">{{item.tag}}</text> |
|
|
|
<block v-if="type == 'self'"> |
|
|
|
<self-line></self-line> |
|
|
|
<view class="bg-white" > |
|
|
|
<view class="cu-bar padding-lr"> |
|
|
|
<view class="lf-flex"> |
|
|
|
<text class="lf-color-777 lf-font-28">优惠</text> |
|
|
|
<view v-if="orderDetails.coupon == ''"> |
|
|
|
<text class="lf-color-price lf-font-28 lf-m-l-10" v-for="(item,index) of orderDetails.coupon">{{item.tag}}</text> |
|
|
|
</view> |
|
|
|
<view v-else> |
|
|
|
<text class="lf-color-222 lf-font-26 lf-m-l-30">化妆品教师节满1200减200</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view v-else> |
|
|
|
<text class="lf-color-222 lf-font-26 lf-m-l-30">化妆品教师节满1200减200</text> |
|
|
|
<view> |
|
|
|
<text class="lf-font-24 lf-color-777 lf-iconfont icon-xiangyou"></text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view> |
|
|
|
<text class="lf-font-24 lf-color-777 lf-iconfont icon-xiangyou"></text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<self-line></self-line> |
|
|
|
<view class="bg-white" v-if="type == 'self'"> |
|
|
|
<view class="cu-bar padding-lr"> |
|
|
|
<view class="lf-flex"> |
|
|
|
<text class="lf-color-777 lf-font-28">服务</text> |
|
|
|
<view style="width: 600rpx;flex-wrap: wrap;display: flex;margin-top: 32rpx;"> |
|
|
|
<view class="lf-m-l-30" v-for="i of 5"> |
|
|
|
<text class="lf-iconfont icon-xuanzhong lf-font-30" style="color: #15716E;"></text> |
|
|
|
<text class="lf-m-l-10 lf-font-26 lf-color-black">正品保障</text> |
|
|
|
<self-line></self-line> |
|
|
|
<view class="bg-white"> |
|
|
|
<view class="cu-bar padding-lr"> |
|
|
|
<view class="lf-flex"> |
|
|
|
<text class="lf-color-777 lf-font-28">服务</text> |
|
|
|
<view style="width: 600rpx;flex-wrap: wrap;display: flex;margin-top: 32rpx;"> |
|
|
|
<view class="lf-m-l-30" v-for="i of 5"> |
|
|
|
<text class="lf-iconfont icon-xuanzhong lf-font-30" style="color: #15716E;"></text> |
|
|
|
<text class="lf-m-l-10 lf-font-26 lf-color-black">正品保障</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view> |
|
|
|
<text class="lf-font-24 lf-color-777 lf-iconfont icon-xiangyou"></text> |
|
|
|
<view> |
|
|
|
<text class="lf-font-24 lf-color-777 lf-iconfont icon-xiangyou"></text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</block> |
|
|
|
<block v-else> |
|
|
|
<view class="bg-white"> |
|
|
|
<self-line></self-line> |
|
|
|
<!-- <view class="bg-white"> |
|
|
|
<view class="cu-bar padding-lr"> |
|
|
|
<view class="lf-flex"> |
|
|
|
<view class="lf-color-777 lf-font-28">送至</view> |
|
|
|
@ -90,12 +93,14 @@ |
|
|
|
<text class="lf-font-24 lf-color-777 lf-iconfont icon-xiangyou"></text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> --> |
|
|
|
<view class="bg-white"> |
|
|
|
<view class="cu-bar padding-lr"> |
|
|
|
<view class="cu-bar padding-lr" @click="showFreight"> |
|
|
|
<view class="lf-flex"> |
|
|
|
<view class="lf-color-777 lf-font-28">运费</view> |
|
|
|
<view class="lf-color-222 lf-font-26 lf-m-l-30 lf-line-1" style="width: 550rpx;">在5kg～10kg内，包含5kg；重量在5kg以内按3kg</view> |
|
|
|
<view class="lf-color-222 lf-font-26 lf-m-l-30 lf-line-1" style="width: 550rpx;"> |
|
|
|
<text>1KM以内，包含1KM；重量在5KG以内按6元计费，每超出1KG加收2元</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view> |
|
|
|
<text class="lf-font-24 lf-color-777 lf-iconfont icon-xiangyou"></text> |
|
|
|
@ -124,13 +129,17 @@ |
|
|
|
</view> |
|
|
|
<view class="lf-flex-column lf-m-l-20"> |
|
|
|
<text class="lf-font-28 lf-color-black lf-font-bold">颐莲官方店</text> |
|
|
|
<view class="lf-font-24 lf-color-777"><u-icon name="map" class="lf-m-r-10"></u-icon>L2</view> |
|
|
|
<view class="lf-font-24 lf-color-777"> |
|
|
|
<text class="lf-iconfont icon-dizhi lf-font-24 lf-color-primary"></text> |
|
|
|
<text class="lf-m-l-10">L2</text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view> |
|
|
|
<button class="head-btn" @click="$url('/pages/user/my/chatonline')"> |
|
|
|
<u-icon name="chat" class="lf-m-r-10"></u-icon> |
|
|
|
<text>客服</text> |
|
|
|
<!-- <u-icon name="chat" class="lf-m-r-10"></u-icon> --> |
|
|
|
<text class="lf-iconfont icon-kefuhdpi lf-font-24"></text> |
|
|
|
<text class="lf-m-l-10">客服</text> |
|
|
|
</button> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -156,7 +165,7 @@ |
|
|
|
<!-- 商品详情 --> |
|
|
|
<view class="goods-detail"> |
|
|
|
<view class="lf-font-32 lf-font-bold lf-m-b-20">商品详情</view> |
|
|
|
<rich-text :nodes="formatRichText('商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情商品详情')"></rich-text> |
|
|
|
<rich-text :nodes="goods_detail.content"></rich-text> |
|
|
|
<!-- <image class="goods-img" :src="item" v-for="(item, index) in goods_detail.content" :key="index" v-if="goods_detail.content_type == 'img'"></image> --> |
|
|
|
</view> |
|
|
|
<!-- 修饰专用 --> |
|
|
|
@ -165,16 +174,16 @@ |
|
|
|
<view class="lf-row-between fixed-bottom"> |
|
|
|
<view class="lf-flex lf-p-t-10 lf-p-b-10"> |
|
|
|
<view class="lf-flex-column lf-row-center icon-item" open-type="contact"> |
|
|
|
<text class="lf-iconfont icon-shoucang icon-img"></text> |
|
|
|
<text class="lf-iconfont icon-pinglun- icon-img"></text> |
|
|
|
<view class="lf-m-t-1">客服</view> |
|
|
|
</view> |
|
|
|
<view class="lf-flex-column lf-row-center icon-item" @click="switchCollect"> |
|
|
|
<text class="lf-iconfont icon-shoucang icon-img" v-if="is_collect"></text> |
|
|
|
<text class="lf-iconfont icon-shoucang icon-img" v-else></text> |
|
|
|
<text class="lf-iconfont icon-shoucang2 icon-img" v-if="is_collect"></text> |
|
|
|
<text class="lf-iconfont icon-shoucang11 icon-img" v-else></text> |
|
|
|
<view class="lf-m-t-1">{{ is_collect ? '已收藏' : '收藏' }}</view> |
|
|
|
</view> |
|
|
|
<button class="lf-flex-column lf-row-center icon-item"> |
|
|
|
<text class="lf-iconfont icon-shoucang icon-img"></text> |
|
|
|
<text class="lf-iconfont icon-gouwulan icon-img"></text> |
|
|
|
<view class="lf-m-t-1">购物车</view> |
|
|
|
</button> |
|
|
|
</view> |
|
|
|
@ -221,13 +230,13 @@ |
|
|
|
<view class="lf-font-28 lf-color-555">数量</view> |
|
|
|
<view class="lf-flex"> |
|
|
|
<view class="num-btn"> |
|
|
|
<text class="lf-iconfont icon-xiangyou lf-font-24"></text> |
|
|
|
<text class="lf-iconfont icon-jian1 lf-font-30"></text> |
|
|
|
</view> |
|
|
|
<view> |
|
|
|
<input class="input" value="1" /> |
|
|
|
</view> |
|
|
|
<view class="num-btn lf-text-right"> |
|
|
|
<text class="lf-iconfont icon-xiangyou lf-font-24"></text> |
|
|
|
<text class="lf-iconfont icon-jia lf-font-30"></text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
@ -235,6 +244,18 @@ |
|
|
|
<button class="comfirm-btn" @click="confirm">{{ click_type == 1 ? '加入购物车' : '立即购买' }}</button> |
|
|
|
</view> |
|
|
|
</u-popup> |
|
|
|
<!-- 运费说明 --> |
|
|
|
<u-popup v-model="show_freight" mode="bottom" :round="true" borderRadius="20"> |
|
|
|
<view class="popup-content"> |
|
|
|
<view class="lf-row-between lf-m-b-30"> |
|
|
|
<view class="lf-color-555 lf-font-32 lf-font-bold">店铺运费说明</view> |
|
|
|
<view @click="show_freight = false"> |
|
|
|
<text class="lf-iconfont icon-cuo lf-font-50"></text> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view class="lf-font-28 lf-color-777">1KM以内，包含1KM；重量在5KG以内按6元计费，每超出1KG加收2元</view> |
|
|
|
</view> |
|
|
|
</u-popup> |
|
|
|
<!-- 回到顶部 --> |
|
|
|
<u-back-top :scroll-top="pageScrollTop"></u-back-top> |
|
|
|
</block> |
|
|
|
@ -255,12 +276,9 @@ |
|
|
|
goods_detail: {}, |
|
|
|
is_collect: false, // 1为当前收藏商品了，0为否 |
|
|
|
skeletonLoading: false, |
|
|
|
pictures: [ |
|
|
|
'https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png', |
|
|
|
'https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png', |
|
|
|
'https://hainan.lanzulive.com/storage/images/v2-deb89623e0ee2a2dad34bcded6dfd1ed_1440w.png' |
|
|
|
], |
|
|
|
pictures: [], |
|
|
|
show_popup: false, // 是否显示选规格模态框 |
|
|
|
show_freight: false, // 是否显示运费说明模态框 |
|
|
|
spec_current: null, // 规格下标 |
|
|
|
click_type: null, // 当前点击的是加入购物车[1]还是立即购买[2] |
|
|
|
type: 'mail', // 页面显示类型，mail普通可邮寄商品，self自提商品，point积分商品，seckill秒杀商品 |
|
|
|
@ -272,6 +290,7 @@ |
|
|
|
this.type = options.type || 'mail'; |
|
|
|
console.log('商品',this.goods_id) |
|
|
|
// this.getGoodsDetail(); |
|
|
|
this.getNewdetail(); |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
isRight() { |
|
|
|
@ -281,6 +300,9 @@ |
|
|
|
} |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
showFreight(){ |
|
|
|
this.show_freight = true; |
|
|
|
}, |
|
|
|
shoot(type){ |
|
|
|
// TODO 判断type做不同的逻辑 |
|
|
|
this.click_type = type; |
|
|
|
@ -352,6 +374,18 @@ |
|
|
|
}, 1000); |
|
|
|
}) |
|
|
|
}, |
|
|
|
getNewdetail(){ |
|
|
|
this.$http.get({ |
|
|
|
api: '/api/store/detail/4' |
|
|
|
}).then(res => { |
|
|
|
console.log("===---", res); |
|
|
|
this.goods_detail = res.data.data; |
|
|
|
this.pictures = [res.data.data.img]; |
|
|
|
console.log("this.pictures", this.pictures); |
|
|
|
}).catch(err => { |
|
|
|
console.log("====", err); |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 切换商品收藏 |
|
|
|
switchCollect(){ |
|
|
|
let userInfo = uni.getStorageSync('userinfo') || {}; |
|
|
|
@ -398,8 +432,9 @@ |
|
|
|
// 预览图片 |
|
|
|
lookImg(index){ |
|
|
|
this.$u.throttle(() => { |
|
|
|
let goods_banner = this.goods_detail.banners || []; |
|
|
|
let banners = goods_banner.map(item => item.cover); |
|
|
|
// let goods_banner = this.goods_detail.banners || []; |
|
|
|
// let banners = goods_banner.map(item => item.cover); |
|
|
|
let banners = this.pictures; |
|
|
|
uni.previewImage({ |
|
|
|
urls: banners, |
|
|
|
current: index |
|
|
|
@ -686,6 +721,8 @@ |
|
|
|
.icon-img{ |
|
|
|
height: 50rpx; |
|
|
|
width: 50rpx; |
|
|
|
font-size: 40rpx; |
|
|
|
line-height: 1; |
|
|
|
} |
|
|
|
} |
|
|
|
.btn1{ |
|
|
|
|
邓平艺
4 years ago