|
|
|
<template>
|
|
|
|
<view class="goodsDetail" v-if="product_list.name">
|
|
|
|
<!-- 轮播图区域 -->
|
|
|
|
<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" :circular="true" indicator-active-color="#FFFFFF">
|
|
|
|
<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" :circular="true"
|
|
|
|
indicator-active-color="#FFFFFF">
|
|
|
|
<!-- 循环渲染轮播图的 item 项 -->
|
|
|
|
<swiper-item v-if="product_list.videofiles != null">
|
|
|
|
<!-- 视频 -->
|
|
|
|
<video :src="product_list.videofiles" object-fit="cover" enable-play-gesture class="swiperVideo"></video>
|
|
|
|
<video :src="product_list.videofiles" object-fit="cover" enable-play-gesture
|
|
|
|
class="swiperVideo"></video>
|
|
|
|
</swiper-item>
|
|
|
|
<swiper-item v-for="(item, i) in product_list.images" :key="i">
|
|
|
|
<image :src="item" @click="preview(i)"></image>
|
|
|
|
</swiper-item>
|
|
|
|
<swiper-item v-for="(item, i) in product_list.images" :key="i"><image :src="item" @click="preview(i)"></image></swiper-item>
|
|
|
|
</swiper>
|
|
|
|
<!-- 商品信息区域 -->
|
|
|
|
<view class="goods-info-box" v-if="product_list.spec[0]">
|
|
...
|
...
|
@@ -63,7 +67,8 @@ |
|
|
|
<view class="middelTitle_En">Product details</view>
|
|
|
|
</view>
|
|
|
|
<!-- 视频 -->
|
|
|
|
<view class="videoBox" v-if="product_list.videofiles != null"><video :src="product_list.videofiles" object-fit="cover" enable-play-gesture @fullscreenchange></video></view>
|
|
|
|
<view class="videoBox" v-if="product_list.videofiles != null"><video :src="product_list.videofiles"
|
|
|
|
object-fit="cover" enable-play-gesture @fullscreenchange></video></view>
|
|
|
|
<rich-text :nodes="product_list.content"></rich-text>
|
|
|
|
|
|
|
|
<!-- 商品底部 -->
|
|
...
|
...
|
@@ -91,13 +96,16 @@ |
|
|
|
|
|
|
|
<!-- 判断是否是多规格与单规格 -->
|
|
|
|
<view class="guigeJudge flex" v-if="spec_attr != 0">
|
|
|
|
<view class="kucunTFBox" v-if="goodDetail_guigeNum"><view class="shouqingBox">已售罄</view></view>
|
|
|
|
<view class="kucunTFBox" v-if="goodDetail_guigeNum">
|
|
|
|
<view class="shouqingBox">已售罄</view>
|
|
|
|
</view>
|
|
|
|
<view class="kucunTFBox flex" v-else>
|
|
|
|
<view class="buttonCart" @click="getCart">加入购物车</view>
|
|
|
|
<u-popup v-model="cartShow" mode="bottom" width="750rpx" height="976rpx">
|
|
|
|
<view class="goodDetailPopup" v-if="goodDetail_guigelist.form">
|
|
|
|
<view class="goodsinfo flex" v-if="goodDetail_guigelist.form.goods_price">
|
|
|
|
<image :src="goodDetail_guigelist.form.spec_image || product_list.image" class="goodsinfoImage"></image>
|
|
|
|
<image :src="goodDetail_guigelist.form.spec_image || product_list.image"
|
|
|
|
class="goodsinfoImage"></image>
|
|
|
|
<view class="goodsinfoMessage">
|
|
|
|
<!-- 判断是否有活动价格 -->
|
|
|
|
<view class="jiaqian" v-if="goodDetail_guigelist.form.goods_price == 0">
|
|
...
|
...
|
@@ -126,26 +134,23 @@ |
|
|
|
<view class="bottomNum flex justifyBetween alignC" v-if="goodDetail_guigelist.form">
|
|
|
|
<view class="numText">数量</view>
|
|
|
|
<view class="numNum">
|
|
|
|
<u-number-box
|
|
|
|
disabled-input
|
|
|
|
:input-width="72"
|
|
|
|
:input-height="56"
|
|
|
|
v-model="value"
|
|
|
|
:min="1"
|
|
|
|
:max="goodDetail_guigelist.form.stock_num"
|
|
|
|
@change="valChange"
|
|
|
|
></u-number-box>
|
|
|
|
<u-number-box disabled-input :input-width="72" :input-height="56" v-model="value"
|
|
|
|
:min="1" :max="goodDetail_guigelist.form.stock_num" @change="valChange">
|
|
|
|
</u-number-box>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="goods_bt" @click="addgoodsCart">确定</view>
|
|
|
|
<view class="icout" @click="closeCart"><image src="../../../static/goods/ic_out.png" mode=""></image></view>
|
|
|
|
<view class="icout" @click="closeCart">
|
|
|
|
<image src="../../../static/goods/ic_out.png" mode=""></image>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</u-popup>
|
|
|
|
<view class="buttonGoumai" @click="getGoumai">立即购买</view>
|
|
|
|
<u-popup v-model="cartShow" mode="bottom" width="750rpx" height="976rpx">
|
|
|
|
<view class="goodDetailPopup">
|
|
|
|
<view class="goodsinfo flex" v-if="goodDetail_guigelist.form">
|
|
|
|
<image :src="goodDetail_guigelist.form.spec_image || product_list.image" class="goodsinfoImage"></image>
|
|
|
|
<image :src="goodDetail_guigelist.form.spec_image || product_list.image"
|
|
|
|
class="goodsinfoImage"></image>
|
|
|
|
<view class="goodsinfoMessage">
|
|
|
|
<!-- 判断是否有活动价格 -->
|
|
|
|
<view class="jiaqian" v-if="goodDetail_guigelist.form.goods_price == 0">
|
|
...
|
...
|
@@ -174,26 +179,25 @@ |
|
|
|
<view class="bottomNum flex justifyBetween alignC" v-if="goodDetail_guigelist.form">
|
|
|
|
<view class="numText">数量</view>
|
|
|
|
<view class="numNum">
|
|
|
|
<u-number-box
|
|
|
|
disabled-input
|
|
|
|
:input-width="72"
|
|
|
|
:input-height="56"
|
|
|
|
v-model="value"
|
|
|
|
:min="1"
|
|
|
|
:max="goodDetail_guigelist.form.stock_num"
|
|
|
|
@change="valChange"
|
|
|
|
></u-number-box>
|
|
|
|
<u-number-box disabled-input :input-width="72" :input-height="56" v-model="value"
|
|
|
|
:min="1" :max="goodDetail_guigelist.form.stock_num" @change="valChange">
|
|
|
|
</u-number-box>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="goods_bt" @click="gmGoods(product_list, goodDetail_guigelist)">{{ addCartText ? '确认' : '立即购买' }}</view>
|
|
|
|
<view class="icout" @click="closeGoumai"><image src="../../../static/goods/ic_out.png" mode=""></image></view>
|
|
|
|
<view class="goods_bt" @click="gmGoods(product_list, goodDetail_guigelist)">
|
|
|
|
{{ addCartText ? '确认' : '立即购买' }}</view>
|
|
|
|
<view class="icout" @click="closeGoumai">
|
|
|
|
<image src="../../../static/goods/ic_out.png" mode=""></image>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</u-popup>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<!-- 单规格 -->
|
|
|
|
<view class="guigeJudge" v-else>
|
|
|
|
<view class="kucunTFBox" v-if="product_list.spec[0].stock_num == 0"><view class="shouqingBox">已售罄</view></view>
|
|
|
|
<view class="kucunTFBox" v-if="product_list.spec[0].stock_num == 0">
|
|
|
|
<view class="shouqingBox">已售罄</view>
|
|
|
|
</view>
|
|
|
|
<view class="kucunTFBox flex" v-else>
|
|
|
|
<view class="buttonCart" @click="getCart">加入购物车</view>
|
|
|
|
<u-popup v-model="cartShow" mode="bottom" width="750rpx" height="536rpx">
|
|
...
|
...
|
@@ -224,19 +228,15 @@ |
|
|
|
<view class="bottomNum flex justifyBetween alignC" v-if="product_list.spec[0]">
|
|
|
|
<view class="numText">数量</view>
|
|
|
|
<view class="numNum">
|
|
|
|
<u-number-box
|
|
|
|
disabled-input
|
|
|
|
:input-width="72"
|
|
|
|
:input-height="56"
|
|
|
|
v-model="value"
|
|
|
|
:min="1"
|
|
|
|
:max="product_list.spec[0].stock_num"
|
|
|
|
@change="valChange"
|
|
|
|
></u-number-box>
|
|
|
|
<u-number-box disabled-input :input-width="72" :input-height="56" v-model="value"
|
|
|
|
:min="1" :max="product_list.spec[0].stock_num" @change="valChange">
|
|
|
|
</u-number-box>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="goods_bt" @click="addgoodsCart">确定</view>
|
|
|
|
<view class="icout" @click="closeCart"><image src="../../../static/goods/ic_out.png" mode=""></image></view>
|
|
|
|
<view class="icout" @click="closeCart">
|
|
|
|
<image src="../../../static/goods/ic_out.png" mode=""></image>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</u-popup>
|
|
|
|
<view class="buttonGoumai" @click="getGoumai">立即购买</view>
|
|
...
|
...
|
@@ -268,19 +268,16 @@ |
|
|
|
<view class="bottomNum flex justifyBetween alignC" v-if="product_list.spec[0]">
|
|
|
|
<view class="numText">数量</view>
|
|
|
|
<view class="numNum">
|
|
|
|
<u-number-box
|
|
|
|
disabled-input
|
|
|
|
:input-width="72"
|
|
|
|
:input-height="56"
|
|
|
|
v-model="value"
|
|
|
|
:min="1"
|
|
|
|
:max="product_list.spec[0].stock_num"
|
|
|
|
@change="valChange"
|
|
|
|
></u-number-box>
|
|
|
|
<u-number-box disabled-input :input-width="72" :input-height="56" v-model="value"
|
|
|
|
:min="1" :max="product_list.spec[0].stock_num" @change="valChange">
|
|
|
|
</u-number-box>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="goods_bt" @click="gmGoods(product_list, goodDetail_guigelist)">{{ addCartText ? '确认' : '立即购买' }}</view>
|
|
|
|
<view class="icout" @click="closeCart"><image src="../../../static/goods/ic_out.png" mode=""></image></view>
|
|
|
|
<view class="goods_bt" @click="gmGoods(product_list, goodDetail_guigelist)">
|
|
|
|
{{ addCartText ? '确认' : '立即购买' }}</view>
|
|
|
|
<view class="icout" @click="closeCart">
|
|
|
|
<image src="../../../static/goods/ic_out.png" mode=""></image>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</u-popup>
|
|
|
|
</view>
|
|
...
|
...
|
@@ -290,183 +287,203 @@ |
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
import Login from '../../../login';
|
|
|
|
import BroList from '@/components/Bro-List';
|
|
|
|
export default {
|
|
|
|
components: {
|
|
|
|
BroList
|
|
|
|
},
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
token: '',
|
|
|
|
// 规格
|
|
|
|
spec_attr: [],
|
|
|
|
spec_list: [],
|
|
|
|
// 规格组成的新数组
|
|
|
|
guileList: [],
|
|
|
|
|
|
|
|
show: false,
|
|
|
|
cartShow: false,
|
|
|
|
phone: '',
|
|
|
|
product_list: {},
|
|
|
|
//步进器
|
|
|
|
value: 1,
|
|
|
|
// 商品数量
|
|
|
|
goodDetailsNum: 1,
|
|
|
|
// new 规格函数
|
|
|
|
goodDetail_guigelist: [],
|
|
|
|
//多规格的所有库存
|
|
|
|
goodDetail_guigeNum: false,
|
|
|
|
//控制字体
|
|
|
|
addCartText: false
|
|
|
|
};
|
|
|
|
},
|
|
|
|
onShow() {
|
|
|
|
// 是否截取到code
|
|
|
|
this.$loginCustom();
|
|
|
|
},
|
|
|
|
onLoad(e) {
|
|
|
|
this.getPhone();
|
|
|
|
this.getGoodDetails(e.id);
|
|
|
|
|
|
|
|
console.log(e.uid, 'uid');
|
|
|
|
uni.setStorageSync('uId', e.uid);
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
// 商品详情接口
|
|
|
|
getGoodDetails(id) {
|
|
|
|
let data = {
|
|
|
|
id: id
|
|
|
|
import Login from '../../../login';
|
|
|
|
import BroList from '@/components/Bro-List';
|
|
|
|
export default {
|
|
|
|
components: {
|
|
|
|
BroList
|
|
|
|
},
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
token: '',
|
|
|
|
// 规格
|
|
|
|
spec_attr: [],
|
|
|
|
spec_list: [],
|
|
|
|
// 规格组成的新数组
|
|
|
|
guileList: [],
|
|
|
|
|
|
|
|
show: false,
|
|
|
|
cartShow: false,
|
|
|
|
phone: '',
|
|
|
|
product_list: {},
|
|
|
|
//步进器
|
|
|
|
value: 1,
|
|
|
|
// 商品数量
|
|
|
|
goodDetailsNum: 1,
|
|
|
|
// new 规格函数
|
|
|
|
goodDetail_guigelist: [],
|
|
|
|
//多规格的所有库存
|
|
|
|
goodDetail_guigeNum: false,
|
|
|
|
//控制字体
|
|
|
|
addCartText: false
|
|
|
|
};
|
|
|
|
this.$rqs('/api/goods/detail', data).then(res => {
|
|
|
|
// 对富文本解析
|
|
|
|
res.data.data.detail.content = res.data.data.detail.content.replace(/<img /gi, '<img style="width:100%;display:block;" mode="widthFix"');
|
|
|
|
res.data.data.detail.content = res.data.data.detail.content.replace(/<img style=""/gi, '<img style="width:100%;display:block;" mode="widthFix"');
|
|
|
|
this.product_list = res.data.data.detail;
|
|
|
|
// 对多规格进行处理
|
|
|
|
if (res.data.data.specData) {
|
|
|
|
// 规格
|
|
|
|
this.spec_attr = res.data.data.specData.spec_attr;
|
|
|
|
//规格商品详情
|
|
|
|
this.spec_list = res.data.data.specData.spec_list;
|
|
|
|
// 规格默认值
|
|
|
|
this.spec_attr.map(item => {
|
|
|
|
this.guileList.push(item.spec_items[0].item_id);
|
|
|
|
});
|
|
|
|
var i = this.spec_list.findIndex(x => x.spec_sku_id == this.guileList.join('_'));
|
|
|
|
this.goodDetail_guigelist = this.spec_list[i];
|
|
|
|
this.goodDetail_guigeNum = this.spec_list.every(function(item, index, array) {
|
|
|
|
return item.form.stock_num == 0;
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
//步进器
|
|
|
|
valChange(e) {
|
|
|
|
console.log('当前值为: ' + e.value);
|
|
|
|
this.goodDetailsNum = e.value;
|
|
|
|
onShow() {
|
|
|
|
// 是否截取到code
|
|
|
|
this.$loginCustom();
|
|
|
|
},
|
|
|
|
// 图片变大
|
|
|
|
preview(i) {
|
|
|
|
// 调用 uni.previewImage() 方法预览图片
|
|
|
|
uni.previewImage({
|
|
|
|
// 预览时，默认显示图.item.image_src
|
|
|
|
current: i,
|
|
|
|
// 所有图片 url 地址的数组
|
|
|
|
urls: this.product_list.images
|
|
|
|
});
|
|
|
|
onLoad(e) {
|
|
|
|
this.getPhone();
|
|
|
|
this.getGoodDetails(e.id);
|
|
|
|
|
|
|
|
console.log(e.uid, 'uid');
|
|
|
|
uni.setStorageSync('uId', e.uid);
|
|
|
|
},
|
|
|
|
// 领劵
|
|
|
|
getlingjuanCenter() {
|
|
|
|
if (!uni.getStorageSync('token')) {
|
|
|
|
this.$loginCustom(1);
|
|
|
|
} else {
|
|
|
|
uni.navigateTo({
|
|
|
|
url: '../../my/myYouHuiJuan/yuhuijuanCenter'
|
|
|
|
methods: {
|
|
|
|
// 商品详情接口
|
|
|
|
getGoodDetails(id) {
|
|
|
|
let data = {
|
|
|
|
id: id
|
|
|
|
};
|
|
|
|
this.$rqs('/api/goods/detail', data).then(res => {
|
|
|
|
// 对富文本解析
|
|
|
|
res.data.data.detail.content = res.data.data.detail.content.replace(/<img /gi,
|
|
|
|
'<img style="width:100%;display:block;" mode="widthFix"');
|
|
|
|
res.data.data.detail.content = res.data.data.detail.content.replace(/<img style=""/gi,
|
|
|
|
'<img style="width:100%;display:block;" mode="widthFix"');
|
|
|
|
this.product_list = res.data.data.detail;
|
|
|
|
// 对多规格进行处理
|
|
|
|
if (res.data.data.specData) {
|
|
|
|
// 规格
|
|
|
|
this.spec_attr = res.data.data.specData.spec_attr;
|
|
|
|
//规格商品详情
|
|
|
|
this.spec_list = res.data.data.specData.spec_list;
|
|
|
|
// 规格默认值
|
|
|
|
this.spec_attr.map(item => {
|
|
|
|
this.guileList.push(item.spec_items[0].item_id);
|
|
|
|
});
|
|
|
|
var i = this.spec_list.findIndex(x => x.spec_sku_id == this.guileList.join('_'));
|
|
|
|
this.goodDetail_guigelist = this.spec_list[i];
|
|
|
|
this.goodDetail_guigeNum = this.spec_list.every(function(item, index, array) {
|
|
|
|
return item.form.stock_num == 0;
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
|
|
//分享
|
|
|
|
getShare(id) {
|
|
|
|
if (!uni.getStorageSync('token')) {
|
|
|
|
this.$loginCustom(1);
|
|
|
|
} else {
|
|
|
|
uni.navigateTo({
|
|
|
|
url: 'share?id=' + id
|
|
|
|
},
|
|
|
|
//步进器
|
|
|
|
valChange(e) {
|
|
|
|
console.log('当前值为: ' + e.value);
|
|
|
|
this.goodDetailsNum = e.value;
|
|
|
|
},
|
|
|
|
// 图片变大
|
|
|
|
preview(i) {
|
|
|
|
// 调用 uni.previewImage() 方法预览图片
|
|
|
|
uni.previewImage({
|
|
|
|
// 预览时，默认显示图.item.image_src
|
|
|
|
current: i,
|
|
|
|
// 所有图片 url 地址的数组
|
|
|
|
urls: this.product_list.images
|
|
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
|
|
// 联系客服
|
|
|
|
openkefu() {
|
|
|
|
if (!uni.getStorageSync('token')) {
|
|
|
|
this.$loginCustom(1);
|
|
|
|
} else {
|
|
|
|
this.show = !this.show;
|
|
|
|
}
|
|
|
|
},
|
|
|
|
close() {
|
|
|
|
this.show = false;
|
|
|
|
},
|
|
|
|
getPhone() {
|
|
|
|
this.$rqs('/api/index/basic').then(res => {
|
|
|
|
this.phone = res.data.data;
|
|
|
|
});
|
|
|
|
},
|
|
|
|
open(phone) {
|
|
|
|
let that = this;
|
|
|
|
uni.makePhoneCall({
|
|
|
|
phoneNumber: phone,
|
|
|
|
success() {
|
|
|
|
that.show = false;
|
|
|
|
},
|
|
|
|
// 领劵
|
|
|
|
getlingjuanCenter() {
|
|
|
|
if (!uni.getStorageSync('token')) {
|
|
|
|
this.$loginCustom(1);
|
|
|
|
} else {
|
|
|
|
uni.navigateTo({
|
|
|
|
url: '../../my/myYouHuiJuan/yuhuijuanCenter'
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
// 跳转购物车
|
|
|
|
gotoCart() {
|
|
|
|
uni.switchTab({
|
|
|
|
url: '../../cart/cart'
|
|
|
|
});
|
|
|
|
},
|
|
|
|
// 加入购物车
|
|
|
|
getCart() {
|
|
|
|
this.cartShow = !this.cartShow;
|
|
|
|
this.addCartText = true;
|
|
|
|
},
|
|
|
|
// 关闭
|
|
|
|
closeCart() {
|
|
|
|
this.cartShow = false;
|
|
|
|
},
|
|
|
|
// 立即购买
|
|
|
|
getGoumai() {
|
|
|
|
this.cartShow = !this.cartShow;
|
|
|
|
},
|
|
|
|
//关闭
|
|
|
|
closeGoumai() {
|
|
|
|
this.cartShow = false;
|
|
|
|
},
|
|
|
|
//立即购买
|
|
|
|
gmGoods(product_list, goodDetail_guigelist) {
|
|
|
|
if (!uni.getStorageSync('token')) {
|
|
|
|
this.$loginCustom(1);
|
|
|
|
} else {
|
|
|
|
if (this.addCartText) {
|
|
|
|
// 多规格
|
|
|
|
if (goodDetail_guigelist != 0) {
|
|
|
|
// 判断库存
|
|
|
|
if (goodDetail_guigelist.form.stock_num == 0) {
|
|
|
|
uni.showToast({
|
|
|
|
icon: 'error',
|
|
|
|
title: '库存不足'
|
|
|
|
});
|
|
|
|
},
|
|
|
|
//分享
|
|
|
|
getShare(id) {
|
|
|
|
if (!uni.getStorageSync('token')) {
|
|
|
|
this.$loginCustom(1);
|
|
|
|
} else {
|
|
|
|
uni.navigateTo({
|
|
|
|
url: 'share?id=' + id
|
|
|
|
});
|
|
|
|
}
|
|
|
|
},
|
|
|
|
// 联系客服
|
|
|
|
openkefu() {
|
|
|
|
if (!uni.getStorageSync('token')) {
|
|
|
|
this.$loginCustom(1);
|
|
|
|
} else {
|
|
|
|
this.show = !this.show;
|
|
|
|
}
|
|
|
|
},
|
|
|
|
close() {
|
|
|
|
this.show = false;
|
|
|
|
},
|
|
|
|
getPhone() {
|
|
|
|
this.$rqs('/api/index/basic').then(res => {
|
|
|
|
this.phone = res.data.data;
|
|
|
|
});
|
|
|
|
},
|
|
|
|
open(phone) {
|
|
|
|
let that = this;
|
|
|
|
uni.makePhoneCall({
|
|
|
|
phoneNumber: phone,
|
|
|
|
success() {
|
|
|
|
that.show = false;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
// 跳转购物车
|
|
|
|
gotoCart() {
|
|
|
|
uni.switchTab({
|
|
|
|
url: '../../cart/cart'
|
|
|
|
});
|
|
|
|
},
|
|
|
|
// 加入购物车
|
|
|
|
getCart() {
|
|
|
|
this.cartShow = !this.cartShow;
|
|
|
|
this.addCartText = true;
|
|
|
|
},
|
|
|
|
// 关闭
|
|
|
|
closeCart() {
|
|
|
|
this.cartShow = false;
|
|
|
|
},
|
|
|
|
// 立即购买
|
|
|
|
getGoumai() {
|
|
|
|
this.cartShow = !this.cartShow;
|
|
|
|
},
|
|
|
|
//关闭
|
|
|
|
closeGoumai() {
|
|
|
|
this.cartShow = false;
|
|
|
|
},
|
|
|
|
//立即购买
|
|
|
|
gmGoods(product_list, goodDetail_guigelist) {
|
|
|
|
if (!uni.getStorageSync('token')) {
|
|
|
|
this.$loginCustom(1);
|
|
|
|
} else {
|
|
|
|
if (this.addCartText) {
|
|
|
|
// 多规格
|
|
|
|
if (goodDetail_guigelist != 0) {
|
|
|
|
// 判断库存
|
|
|
|
if (goodDetail_guigelist.form.stock_num == 0) {
|
|
|
|
uni.showToast({
|
|
|
|
icon: 'error',
|
|
|
|
title: '库存不足'
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
let data = {
|
|
|
|
goods_id: product_list.id, //商品id
|
|
|
|
num: this.goodDetailsNum, //数量
|
|
|
|
name: product_list.name, //商品名称
|
|
|
|
image: goodDetail_guigelist.form.spec_image || product_list.image,
|
|
|
|
spec_id: goodDetail_guigelist.spec_sku_id,
|
|
|
|
goods_price: goodDetail_guigelist.form.goods_price,
|
|
|
|
goods_spec_id: goodDetail_guigelist.goods_spec_id
|
|
|
|
};
|
|
|
|
this.$rqs('/api/cart/add', data).then(res => {
|
|
|
|
console.log(res.data.msg);
|
|
|
|
});
|
|
|
|
uni.showToast({
|
|
|
|
title: '添加购物车成功'
|
|
|
|
});
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
// 单规格
|
|
|
|
let data = {
|
|
|
|
goods_id: product_list.id, //商品id
|
|
|
|
num: this.goodDetailsNum, //数量
|
|
|
|
name: product_list.name, //商品名称
|
|
|
|
image: goodDetail_guigelist.form.spec_image || product_list.image,
|
|
|
|
spec_id: goodDetail_guigelist.spec_sku_id,
|
|
|
|
goods_price: goodDetail_guigelist.form.goods_price,
|
|
|
|
goods_spec_id: goodDetail_guigelist.goods_spec_id
|
|
|
|
image: product_list.image,
|
|
|
|
goods_price: product_list.spec[0].goods_price,
|
|
|
|
goods_spec_id: product_list.spec[0].goods_spec_id,
|
|
|
|
spec_id: product_list.spec[0].spec_sku_id || 0
|
|
|
|
};
|
|
|
|
this.$rqs('/api/cart/add', data).then(res => {
|
|
|
|
console.log(res.data.msg);
|
|
...
|
...
|
@@ -475,513 +492,502 @@ export default { |
|
|
|
title: '添加购物车成功'
|
|
|
|
});
|
|
|
|
}
|
|
|
|
this.cartShow = false;
|
|
|
|
} else {
|
|
|
|
// 单规格
|
|
|
|
let data = {
|
|
|
|
goods_id: product_list.id, //商品id
|
|
|
|
num: this.goodDetailsNum, //数量
|
|
|
|
name: product_list.name, //商品名称
|
|
|
|
image: product_list.image,
|
|
|
|
goods_price: product_list.spec[0].goods_price,
|
|
|
|
goods_spec_id: product_list.spec[0].goods_spec_id,
|
|
|
|
spec_id: product_list.spec[0].spec_sku_id || 0
|
|
|
|
};
|
|
|
|
this.$rqs('/api/cart/add', data).then(res => {
|
|
|
|
console.log(res.data.msg);
|
|
|
|
});
|
|
|
|
uni.showToast({
|
|
|
|
title: '添加购物车成功'
|
|
|
|
});
|
|
|
|
}
|
|
|
|
this.cartShow = false;
|
|
|
|
} else {
|
|
|
|
if (goodDetail_guigelist != 0) {
|
|
|
|
// 多规格
|
|
|
|
let data = {
|
|
|
|
goods_id: product_list.id, //商品id
|
|
|
|
num: this.goodDetailsNum, //数量
|
|
|
|
name: product_list.name, //商品名称
|
|
|
|
image: goodDetail_guigelist.form.spec_image || product_list.image,
|
|
|
|
spec_id: goodDetail_guigelist.spec_sku_id,
|
|
|
|
goods_price: goodDetail_guigelist.form.goods_price,
|
|
|
|
goods_spec_id: goodDetail_guigelist.goods_spec_id
|
|
|
|
};
|
|
|
|
uni.navigateTo({
|
|
|
|
url: '../../order/order?goodsInfo=' + encodeURIComponent(JSON.stringify(data))
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
// 单规格
|
|
|
|
let data = {
|
|
|
|
goods_id: product_list.id, //商品id
|
|
|
|
num: this.goodDetailsNum, //数量
|
|
|
|
name: product_list.name, //商品名称
|
|
|
|
image: product_list.image,
|
|
|
|
goods_price: product_list.spec[0].goods_price,
|
|
|
|
goods_spec_id: product_list.spec[0].goods_spec_id,
|
|
|
|
spec_id: product_list.spec[0].spec_sku_id || 0
|
|
|
|
};
|
|
|
|
uni.navigateTo({
|
|
|
|
url: '../../order/order?goodsInfo=' + encodeURIComponent(JSON.stringify(data))
|
|
|
|
});
|
|
|
|
if (goodDetail_guigelist != 0) {
|
|
|
|
if (goodDetail_guigelist.form.stock_num == 0) {
|
|
|
|
uni.showToast({
|
|
|
|
icon: 'error',
|
|
|
|
title: '库存不足'
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
// 多规格
|
|
|
|
let data = {
|
|
|
|
goods_id: product_list.id, //商品id
|
|
|
|
num: this.goodDetailsNum, //数量
|
|
|
|
name: product_list.name, //商品名称
|
|
|
|
image: goodDetail_guigelist.form.spec_image || product_list.image,
|
|
|
|
spec_id: goodDetail_guigelist.spec_sku_id,
|
|
|
|
goods_price: goodDetail_guigelist.form.goods_price,
|
|
|
|
goods_spec_id: goodDetail_guigelist.goods_spec_id
|
|
|
|
};
|
|
|
|
uni.navigateTo({
|
|
|
|
url: '../../order/order?goodsInfo=' + encodeURIComponent(JSON.stringify(data))
|
|
|
|
});
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
// 单规格
|
|
|
|
let data = {
|
|
|
|
goods_id: product_list.id, //商品id
|
|
|
|
num: this.goodDetailsNum, //数量
|
|
|
|
name: product_list.name, //商品名称
|
|
|
|
image: product_list.image,
|
|
|
|
goods_price: product_list.spec[0].goods_price,
|
|
|
|
goods_spec_id: product_list.spec[0].goods_spec_id,
|
|
|
|
spec_id: product_list.spec[0].spec_sku_id || 0
|
|
|
|
};
|
|
|
|
uni.navigateTo({
|
|
|
|
url: '../../order/order?goodsInfo=' + encodeURIComponent(JSON.stringify(data))
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
/**
|
|
|
|
* @规格点击事件
|
|
|
|
* */
|
|
|
|
ItemList(id, index) {
|
|
|
|
this.guileList[index] = id;
|
|
|
|
var i = this.spec_list.findIndex(x => x.spec_sku_id == this.guileList.join('_'));
|
|
|
|
// console.log(i,'adsas');
|
|
|
|
this.goodDetail_guigelist = this.spec_list[i];
|
|
|
|
}
|
|
|
|
},
|
|
|
|
/**
|
|
|
|
* @规格点击事件
|
|
|
|
* */
|
|
|
|
ItemList(id, index) {
|
|
|
|
this.guileList[index] = id;
|
|
|
|
var i = this.spec_list.findIndex(x => x.spec_sku_id == this.guileList.join('_'));
|
|
|
|
// console.log(i,'adsas');
|
|
|
|
this.goodDetail_guigelist = this.spec_list[i];
|
|
|
|
}
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
// 监听规格弹出框 是不弹出
|
|
|
|
cartShow: {
|
|
|
|
handler(newVal, oldVal) {
|
|
|
|
if (!newVal) {
|
|
|
|
setTimeout(() => {
|
|
|
|
this.addCartText = false;
|
|
|
|
}, 300);
|
|
|
|
watch: {
|
|
|
|
// 监听规格弹出框 是不弹出
|
|
|
|
cartShow: {
|
|
|
|
handler(newVal, oldVal) {
|
|
|
|
if (!newVal) {
|
|
|
|
setTimeout(() => {
|
|
|
|
this.addCartText = false;
|
|
|
|
}, 300);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style>
|
|
|
|
/* //富文本视频 */
|
|
|
|
.videoBox {
|
|
|
|
width: 750rpx;
|
|
|
|
height: 370rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.videoBox video {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goodsDetail {
|
|
|
|
padding-bottom: 100rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 价钱样式 */
|
|
|
|
.activePrice {
|
|
|
|
height: 44rpx;
|
|
|
|
color: rgba(220, 158, 94, 1);
|
|
|
|
font-size: 48rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: left;
|
|
|
|
line-height: 44rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.dollorS {
|
|
|
|
height: 32rpx;
|
|
|
|
color: rgba(220, 158, 94, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: center;
|
|
|
|
line-height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.price {
|
|
|
|
height: 32rpx;
|
|
|
|
opacity: 1;
|
|
|
|
color: rgba(150, 151, 153, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
text-align: left;
|
|
|
|
line-height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.td {
|
|
|
|
text-decoration: line-through;
|
|
|
|
}
|
|
|
|
|
|
|
|
swiper {
|
|
|
|
height: 750rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.swiperVideo {
|
|
|
|
width: 750rpx;
|
|
|
|
height: 750rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.swiper-item,
|
|
|
|
image {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods-info-box {
|
|
|
|
width: 750rpx;
|
|
|
|
height: 374rpx;
|
|
|
|
padding: 32rpx;
|
|
|
|
background-color: #ffffff;
|
|
|
|
}
|
|
|
|
|
|
|
|
.lingjuanText {
|
|
|
|
height: 40rpx;
|
|
|
|
color: rgba(252, 67, 56, 1);
|
|
|
|
font-size: 26rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: center;
|
|
|
|
line-height: 40rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.lingjuanCenter {
|
|
|
|
margin-top: 4rpx;
|
|
|
|
width: 32rpx;
|
|
|
|
height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods-name {
|
|
|
|
width: 686rpx;
|
|
|
|
height: 52rpx;
|
|
|
|
margin-top: 26rpx;
|
|
|
|
color: rgba(31, 31, 31, 1);
|
|
|
|
font-size: 32rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: left;
|
|
|
|
line-height: 52rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
white-space: nowrap;
|
|
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods-detail {
|
|
|
|
width: 686rpx;
|
|
|
|
height: 72rpx;
|
|
|
|
margin-top: 4rpx;
|
|
|
|
color: rgba(92, 92, 92, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: left;
|
|
|
|
line-height: 36rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
display: -webkit-box;
|
|
|
|
-webkit-line-clamp: 2;
|
|
|
|
-webkit-box-orient: vertical;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods-model {
|
|
|
|
margin-top: 16rpx;
|
|
|
|
height: 32rpx;
|
|
|
|
color: rgba(92, 92, 92, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
text-align: left;
|
|
|
|
line-height: 32rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.salesShare {
|
|
|
|
margin-top: 24rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.sales {
|
|
|
|
height: 32rpx;
|
|
|
|
color: rgba(194, 194, 194, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: left;
|
|
|
|
line-height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.share image {
|
|
|
|
width: 32rpx;
|
|
|
|
margin-right: 8rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.shareText {
|
|
|
|
height: 34rpx;
|
|
|
|
color: rgba(194, 194, 194, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
.middelBox {
|
|
|
|
width: 750rpx;
|
|
|
|
height: 132rpx;
|
|
|
|
padding: 40rpx 130rpx 0;
|
|
|
|
background-color: #ebebeb;
|
|
|
|
}
|
|
|
|
|
|
|
|
.uline {
|
|
|
|
width: 149rpx;
|
|
|
|
height: 1rpx;
|
|
|
|
background-color: #c2c2c2;
|
|
|
|
}
|
|
|
|
|
|
|
|
.middelTitle {
|
|
|
|
height: 40rpx;
|
|
|
|
color: rgba(31, 31, 31, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 600;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 40rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.middelTitle_En {
|
|
|
|
margin-top: 8rpx;
|
|
|
|
color: rgba(31, 31, 31, 1);
|
|
|
|
font-size: 16rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 20rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods_nav {
|
|
|
|
background-color: #ffffff;
|
|
|
|
// 为商品导航组件添加固定定位
|
|
|
|
position: fixed;
|
|
|
|
bottom: 0;
|
|
|
|
left: 0;
|
|
|
|
width: 100%;
|
|
|
|
height: 120rpx;
|
|
|
|
padding: 20rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.kefu {
|
|
|
|
margin-left: 26rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.kefu image {
|
|
|
|
width: 46rpx;
|
|
|
|
height: 46rpx;
|
|
|
|
margin-top: 3rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.gouwuche {
|
|
|
|
margin-left: 48rpx;
|
|
|
|
transform: translateY(-2rpx);
|
|
|
|
}
|
|
|
|
|
|
|
|
.gouwuche image {
|
|
|
|
width: 50rpx;
|
|
|
|
height: 56rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.optionsText {
|
|
|
|
margin-top: 4rpx;
|
|
|
|
height: 28rpx;
|
|
|
|
color: rgba(50, 50, 51, 1);
|
|
|
|
font-size: 20rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
line-height: 28rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.buttonCart {
|
|
|
|
width: 236rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
margin-left: 30rpx;
|
|
|
|
background: linear-gradient(42.8deg, rgba(129, 145, 136, 1) 0%, rgba(136, 147, 141, 1) 100%);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 30rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.buttonGoumai {
|
|
|
|
width: 236rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
margin-left: 16rpx;
|
|
|
|
background: linear-gradient(119.1deg, rgba(52, 94, 71, 1) 0%, rgba(62, 85, 78, 1) 100%);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 30rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.popup {
|
|
|
|
padding: 48rpx 56rpx 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.popupText {
|
|
|
|
height: 44rpx;
|
|
|
|
color: rgba(50, 50, 51, 1);
|
|
|
|
font-size: 32rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 44rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.popupbutton {
|
|
|
|
margin-top: 70rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.closeBox {
|
|
|
|
width: 244rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
border: 2rpx #dcdee0 solid;
|
|
|
|
color: rgba(50, 50, 51, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.openBox {
|
|
|
|
width: 244rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
border: 2rpx #dcdee0 solid;
|
|
|
|
background: rgba(62, 85, 78, 1);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.icout {
|
|
|
|
position: absolute;
|
|
|
|
top: 32rpx;
|
|
|
|
right: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.icout image {
|
|
|
|
width: 48rpx;
|
|
|
|
height: 48rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 商城详情弹窗*/
|
|
|
|
.goodDetailPopup {
|
|
|
|
padding: 32rpx 16rpx 0;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goodsinfo {
|
|
|
|
padding: 0 16rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
margin-bottom: 38rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goodsinfoImage {
|
|
|
|
width: 200rpx;
|
|
|
|
height: 200rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goodsinfoMessage {
|
|
|
|
margin-left: 24rpx;
|
|
|
|
padding-top: 30rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.kucunBox {
|
|
|
|
margin-top: 40rpx;
|
|
|
|
height: 32rpx;
|
|
|
|
color: rgba(194, 194, 194, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: left;
|
|
|
|
line-height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods_bt {
|
|
|
|
position: fixed;
|
|
|
|
bottom: 20rpx;
|
|
|
|
width: 686rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
background: linear-gradient(119.1deg, rgba(52, 94, 71, 1) 0%, rgba(62, 85, 78, 1) 100%);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 32rpx;
|
|
|
|
font-weight: 600;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
left: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.otherNorms {
|
|
|
|
height: 150rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
|
|
|
|
.norderDetailBox {
|
|
|
|
margin-bottom: 34rpx;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
margin-top: 16rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.norderDetailBox:last-child {
|
|
|
|
margin-bottom: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.norms {
|
|
|
|
color: #5c5c5c;
|
|
|
|
padding-left: 16rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
|
|
|
|
.bottomNum {
|
|
|
|
border-top: 2rpx solid #f2f3f5;
|
|
|
|
height: 144rpx;
|
|
|
|
padding: 0 16rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
|
|
|
|
.normDetail {
|
|
|
|
padding: 8rpx 32rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
border-radius: 24rpx;
|
|
|
|
background-color: #f1f1f3;
|
|
|
|
margin-left: 16rpx;
|
|
|
|
margin-bottom: 16rpx;
|
|
|
|
color: #5c5c5c;
|
|
|
|
font-size: 24rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.normDetailActive {
|
|
|
|
padding: 8rpx 32rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
border-radius: 24rpx;
|
|
|
|
background-color: #f4fffc;
|
|
|
|
margin-left: 16rpx;
|
|
|
|
margin-bottom: 16rpx;
|
|
|
|
color: #3e554e;
|
|
|
|
font-size: 24rpx;
|
|
|
|
border: 2rpx solid #3e554e;
|
|
|
|
}
|
|
|
|
|
|
|
|
.numText {
|
|
|
|
color: #5c5c5c;
|
|
|
|
}
|
|
|
|
|
|
|
|
.mumBox {
|
|
|
|
width: 56rpx;
|
|
|
|
height: 56rpx;
|
|
|
|
background-color: #f2f3f5;
|
|
|
|
border-radius: 8rpx;
|
|
|
|
margin-left: 4rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 已售完 */
|
|
|
|
.shouqingBox {
|
|
|
|
width: 488rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
opacity: 1;
|
|
|
|
margin-left: 30rpx;
|
|
|
|
background: rgba(194, 194, 194, 1);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 30rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
/* //富文本视频 */
|
|
|
|
.videoBox {
|
|
|
|
width: 750rpx;
|
|
|
|
height: 370rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.videoBox video {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goodsDetail {
|
|
|
|
padding-bottom: 100rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 价钱样式 */
|
|
|
|
.activePrice {
|
|
|
|
height: 44rpx;
|
|
|
|
color: rgba(220, 158, 94, 1);
|
|
|
|
font-size: 48rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: left;
|
|
|
|
line-height: 44rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.dollorS {
|
|
|
|
height: 32rpx;
|
|
|
|
color: rgba(220, 158, 94, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: center;
|
|
|
|
line-height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.price {
|
|
|
|
height: 32rpx;
|
|
|
|
opacity: 1;
|
|
|
|
color: rgba(150, 151, 153, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
text-align: left;
|
|
|
|
line-height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.td {
|
|
|
|
text-decoration: line-through;
|
|
|
|
}
|
|
|
|
|
|
|
|
swiper {
|
|
|
|
height: 750rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.swiperVideo {
|
|
|
|
width: 750rpx;
|
|
|
|
height: 750rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.swiper-item,
|
|
|
|
image {
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods-info-box {
|
|
|
|
width: 750rpx;
|
|
|
|
height: 374rpx;
|
|
|
|
padding: 32rpx;
|
|
|
|
background-color: #ffffff;
|
|
|
|
}
|
|
|
|
|
|
|
|
.lingjuanText {
|
|
|
|
height: 40rpx;
|
|
|
|
color: rgba(252, 67, 56, 1);
|
|
|
|
font-size: 26rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: center;
|
|
|
|
line-height: 40rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.lingjuanCenter {
|
|
|
|
margin-top: 4rpx;
|
|
|
|
width: 32rpx;
|
|
|
|
height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods-name {
|
|
|
|
width: 686rpx;
|
|
|
|
height: 52rpx;
|
|
|
|
margin-top: 26rpx;
|
|
|
|
color: rgba(31, 31, 31, 1);
|
|
|
|
font-size: 32rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: left;
|
|
|
|
line-height: 52rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
white-space: nowrap;
|
|
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods-detail {
|
|
|
|
width: 686rpx;
|
|
|
|
height: 72rpx;
|
|
|
|
margin-top: 4rpx;
|
|
|
|
color: rgba(92, 92, 92, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: left;
|
|
|
|
line-height: 36rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
display: -webkit-box;
|
|
|
|
-webkit-line-clamp: 2;
|
|
|
|
-webkit-box-orient: vertical;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods-model {
|
|
|
|
margin-top: 16rpx;
|
|
|
|
height: 32rpx;
|
|
|
|
color: rgba(92, 92, 92, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
text-align: left;
|
|
|
|
line-height: 32rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.salesShare {
|
|
|
|
margin-top: 24rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.sales {
|
|
|
|
height: 32rpx;
|
|
|
|
color: rgba(194, 194, 194, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: left;
|
|
|
|
line-height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.share image {
|
|
|
|
width: 32rpx;
|
|
|
|
margin-right: 8rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.shareText {
|
|
|
|
height: 34rpx;
|
|
|
|
color: rgba(194, 194, 194, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
|
|
|
|
.middelBox {
|
|
|
|
width: 750rpx;
|
|
|
|
height: 132rpx;
|
|
|
|
padding: 40rpx 130rpx 0;
|
|
|
|
background-color: #ebebeb;
|
|
|
|
}
|
|
|
|
|
|
|
|
.uline {
|
|
|
|
width: 149rpx;
|
|
|
|
height: 1rpx;
|
|
|
|
background-color: #c2c2c2;
|
|
|
|
}
|
|
|
|
|
|
|
|
.middelTitle {
|
|
|
|
height: 40rpx;
|
|
|
|
color: rgba(31, 31, 31, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 600;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 40rpx;
|
|
|
|
letter-spacing: 0.6rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.middelTitle_En {
|
|
|
|
margin-top: 8rpx;
|
|
|
|
color: rgba(31, 31, 31, 1);
|
|
|
|
font-size: 16rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 20rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods_nav {
|
|
|
|
background-color: #ffffff;
|
|
|
|
// 为商品导航组件添加固定定位
|
|
|
|
position: fixed;
|
|
|
|
bottom: 0;
|
|
|
|
left: 0;
|
|
|
|
width: 100%;
|
|
|
|
height: 120rpx;
|
|
|
|
padding: 20rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.kefu {
|
|
|
|
margin-left: 26rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.kefu image {
|
|
|
|
width: 46rpx;
|
|
|
|
height: 46rpx;
|
|
|
|
margin-top: 3rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.gouwuche {
|
|
|
|
margin-left: 48rpx;
|
|
|
|
transform: translateY(-2rpx);
|
|
|
|
}
|
|
|
|
|
|
|
|
.gouwuche image {
|
|
|
|
width: 50rpx;
|
|
|
|
height: 56rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.optionsText {
|
|
|
|
margin-top: 4rpx;
|
|
|
|
height: 28rpx;
|
|
|
|
color: rgba(50, 50, 51, 1);
|
|
|
|
font-size: 20rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
line-height: 28rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.buttonCart {
|
|
|
|
width: 236rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
margin-left: 30rpx;
|
|
|
|
background: linear-gradient(42.8deg, rgba(129, 145, 136, 1) 0%, rgba(136, 147, 141, 1) 100%);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 30rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.buttonGoumai {
|
|
|
|
width: 236rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
margin-left: 16rpx;
|
|
|
|
background: linear-gradient(119.1deg, rgba(52, 94, 71, 1) 0%, rgba(62, 85, 78, 1) 100%);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 30rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.popup {
|
|
|
|
padding: 48rpx 56rpx 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.popupText {
|
|
|
|
height: 44rpx;
|
|
|
|
color: rgba(50, 50, 51, 1);
|
|
|
|
font-size: 32rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 44rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.popupbutton {
|
|
|
|
margin-top: 70rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.closeBox {
|
|
|
|
width: 244rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
border: 2rpx #dcdee0 solid;
|
|
|
|
color: rgba(50, 50, 51, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.openBox {
|
|
|
|
width: 244rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
border: 2rpx #dcdee0 solid;
|
|
|
|
background: rgba(62, 85, 78, 1);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.icout {
|
|
|
|
position: absolute;
|
|
|
|
top: 32rpx;
|
|
|
|
right: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.icout image {
|
|
|
|
width: 48rpx;
|
|
|
|
height: 48rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 商城详情弹窗*/
|
|
|
|
.goodDetailPopup {
|
|
|
|
padding: 32rpx 16rpx 0;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goodsinfo {
|
|
|
|
padding: 0 16rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
margin-bottom: 38rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goodsinfoImage {
|
|
|
|
width: 200rpx;
|
|
|
|
height: 200rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goodsinfoMessage {
|
|
|
|
margin-left: 24rpx;
|
|
|
|
padding-top: 30rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.kucunBox {
|
|
|
|
margin-top: 40rpx;
|
|
|
|
height: 32rpx;
|
|
|
|
color: rgba(194, 194, 194, 1);
|
|
|
|
font-size: 24rpx;
|
|
|
|
font-weight: 500;
|
|
|
|
font-family: 'PingFang SC';
|
|
|
|
text-align: left;
|
|
|
|
line-height: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.goods_bt {
|
|
|
|
position: fixed;
|
|
|
|
bottom: 20rpx;
|
|
|
|
width: 686rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
background: linear-gradient(119.1deg, rgba(52, 94, 71, 1) 0%, rgba(62, 85, 78, 1) 100%);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 32rpx;
|
|
|
|
font-weight: 600;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
left: 32rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.otherNorms {
|
|
|
|
height: 150rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
|
|
|
|
.norderDetailBox {
|
|
|
|
margin-bottom: 34rpx;
|
|
|
|
flex-wrap: wrap;
|
|
|
|
margin-top: 16rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.norderDetailBox:last-child {
|
|
|
|
margin-bottom: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
.norms {
|
|
|
|
color: #5c5c5c;
|
|
|
|
padding-left: 16rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
|
|
|
|
.bottomNum {
|
|
|
|
border-top: 2rpx solid #f2f3f5;
|
|
|
|
height: 144rpx;
|
|
|
|
padding: 0 16rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
}
|
|
|
|
|
|
|
|
.normDetail {
|
|
|
|
padding: 8rpx 32rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
border-radius: 24rpx;
|
|
|
|
background-color: #f1f1f3;
|
|
|
|
margin-left: 16rpx;
|
|
|
|
margin-bottom: 16rpx;
|
|
|
|
color: #5c5c5c;
|
|
|
|
font-size: 24rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
.normDetailActive {
|
|
|
|
padding: 8rpx 32rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
border-radius: 24rpx;
|
|
|
|
background-color: #f4fffc;
|
|
|
|
margin-left: 16rpx;
|
|
|
|
margin-bottom: 16rpx;
|
|
|
|
color: #3e554e;
|
|
|
|
font-size: 24rpx;
|
|
|
|
border: 2rpx solid #3e554e;
|
|
|
|
}
|
|
|
|
|
|
|
|
.numText {
|
|
|
|
color: #5c5c5c;
|
|
|
|
}
|
|
|
|
|
|
|
|
.mumBox {
|
|
|
|
width: 56rpx;
|
|
|
|
height: 56rpx;
|
|
|
|
background-color: #f2f3f5;
|
|
|
|
border-radius: 8rpx;
|
|
|
|
margin-left: 4rpx;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 已售完 */
|
|
|
|
.shouqingBox {
|
|
|
|
width: 488rpx;
|
|
|
|
height: 80rpx;
|
|
|
|
opacity: 1;
|
|
|
|
margin-left: 30rpx;
|
|
|
|
background: rgba(194, 194, 194, 1);
|
|
|
|
color: rgba(255, 255, 255, 1);
|
|
|
|
font-size: 30rpx;
|
|
|
|
font-weight: 700;
|
|
|
|
text-align: center;
|
|
|
|
line-height: 80rpx;
|
|
|
|
}
|
|
|
|
</style> |
...
|
...
|
|
