You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
high-mini/pages/goods/goods.vue

1273 lines
52 KiB

<template>
<view>
<!-- 底部菜单 -->
<view class="footer">
<button v-if="user == '' " class="width100 fotct btnfot" @click="getuserinfo">
立即购买
</button>
<button v-else class="width100 fotct btnfot" @click="buy">
立即购买
</button>
</view>
<!-- 商品主图轮播 -->
<view class="swiper-box">
<swiper circular="true" autoplay="true" @change="swiperChange">
<swiper-item v-for="swiper in swiperList" :key="swiper.id">
4 years ago
<image mode="widthFix" :src="imageUrl+swiper"></image>
</swiper-item>
</swiper>
<view class="indicator">{{currentSwiper+1}}/{{swiperList.length}}</view>
</view>
<!-- 标题 价格 -->
<view class="info-box goods-info">
4 years ago
<view class="price" v-if="goodsData[0].payType == 1">{{goodsData[0].discountPrice}} <text
class="zprice font14 fcor666"
v-if="goodsData[0].discountPrice !=goodsData[0].salesPrice">{{goodsData[0].salesPrice}}</text>
</view>
4 years ago
<view style="width: 100%;height: 30px;" v-else>
<view class="price width30 flleft">
<image style="width: 20px;height: 20px;vertical-align: sub;"
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAAXdElEQVR4Xu1dCZhcVZX+z3v1Xnc6nfSW7qSTdDZAAgkJJC4EERCZEMF0V4UhRlkVRKPCDDKiA44iCIqMCMoyoowLiJAZyGDgC8IgiChLFkgngQAh6e50dzrpfa2qtx2/9yppeqmq917Vq6W7634fX4evzj33nHP/d9dzziXkyoS2AE1o7XPKIweACQ6CHAByAJjgFpjg6udGgBwAJrgFJrj6uREgB4DxZwHehAItf84ylBx3NqSS5YZYdDzkyRUQ5DyQz8fkE0mUBYj5kQ9A7TNID+lshDTSFYUNZQCG3knQm1jre0MYOPi8r+O1l2k1BsabtcbFCMAvwKdOXfVFiJPXQipebuRXFFNeiad9xWofhODBbmh9O0RoTwqTjn2Ijvthq6eNZIDZmAQAN99UoIfUT+nBlitZKjyV8ivKIUhp14XCHd0c7vqbKJfeIx4z9/+JvqxmoA+TajLtRktGWt6z/nhFV29B3rRVyC+dkgwvz+tqoTCCTZtkfeA6WvxQg+f8U8Qw6wHArbfPVLoOX00kXMn55dNSZAcAIZChAawAHAZx5GNmkoAh/zHJAHyxxTB59O59j0OHr8tf/tSm1MnrDeesBoBSe+FVXDDnR8if7tmETkYXSGsBaYcANfKX9A6X1syDIVWCpVmANNP6y0LxKB7cV39YCLbcLJ/y+L0uG0gbeVYCQN3yT9cbRQtvQEFVUbKWENQGkHoAUOph/hscSpZl9PqUD0OqAuQFMOR5YF/lIB2Zi8f2bTfKp76UdUDIKgDwa6etCBcc+ySVLCpHgvdUZPRDUPYAwVoIan1qOtsJVxMQ8rwIIPIWgoUpoO53DkuhfTW0/MVXnbBIB01WAIC3Li8Ii/M2omTpSvLlu9ebQxDDu4HQbgjKfnPmds8jpTUIRt5iGIWnA5pg0L5H7/SVHLiBPoyM7xoyDoDwmxd9lqbM/g3nlbnuefNrp/6XIAa3AtBT2oVeMTekeWB5CXjfc29Jevtq+gz2ecU7ET4ZBYBSe+GvjaKTLydRcic7ByH0vwxx4DUAmru6WULNwjTohwcG0N/2FTmAhzIlVkYAwDurpyvSzC0oXFDlVnGh7wWIwVci27UxXliYDq2lFxRs2yAV4It0LvrTrVLaARB+/dy1KDvlYeSVuvrshfA7EHo3w9zGjadiiLOgNzQCerCOBFwgV2N7OvVLKwDULefcaFScccvgJYwTTfUuiL2bICjvO6EekzSGMBd63TsgNlRBQMBXg6fTpUjaAKBsr/45yld8jUl03KY48AqEvj+lyxYZbYdxDPSGXQCzAcIXZD9+lw6BHHdGMsKob174lFH24fNBDpszwhB7noCgvJNMs2OqLoOghxcAh3ZZchPx9VIN7ki1Eg57JHExwruveAVFx5/qmIN2CL6uP4y7ud6J/kyToXUUgHojd0kE/p7kx81O6iZKk1IAhHesewRlyz7nVDgx9AaEniedko9LOkOcCb2uDsRHzjWIr5Br8N+pUjZlAFDf8N/G5Su+zQ7HfaH/eYj9f02VnmOKL/N86AfeisjMbAgEv8+PlNwspgQAypZVX+YZZ9wP8tnzZwNiz0YI4Z1jqpNSKSxDhNZeAOo/fBQECgk4W6rB37xu176DXLao1q49x5h64rPwFdjzZhVi1x8gqBk9DXWpYXrIDbESel39B1MBuEsiLKIaNHspgX0nuWiN95+Vr+rL2jl/RoFtNdYhdv02ckWbK1EtoKvzwQePTAWR6WCLpGIFrfXu4sNTAIR3XbYDxYuW2PYnM8TuRyfUNs/WJlEImAqgNfWDtCE+DMR3yTW4NhF+0ep4BgB1e+D7RsWK7zoRTOh9GmJwixPSCU9jGFUwGt8dZgcCr5L88OSEzBMAqK996hPGjDP/4uSIVxz4K4S+5yd8xzo1AFMetMYQSB/qycRdkoST6Xwk7fHiCQDCu7/UiaLjRjvFjdCSwu/D152xm0+nNs86OsNYAKNx9wi5+CXZjzOTFTZpAIS2Vv+EZpz+DVtB9B74Ou4Dpconz1aAsUvAQhG0A10jRgFAAK/x+bExGc2SAgBvXT1NKVvSAqlIjCsEG/B1/hKkHUxG1gld11CqYLQMXwswuEFWcBytRcLOEUkBQNl9xWtcdPxH7XrGvMcXg6b3Tq4kagEWp0PfXzeqOjF/VwrglkT5JgyAcO3nFqJ06VuAEJeHeY8vdo3jeb/wE5btqWAJIBaBpbmgvLmAPAdQGoDWe8Fd3pzi6l0l4J4R50DMQUlFBa1FXyIgSBgAyltXvsJTPxT/lo81+NrvGVs3e5MiHWl1qvnX7FjzDEYoAhUsjdjY7Fx5rnN7N3wZ3P6wc/oYlLpwPLjuzWijwA1SAD9MpIGEAMDvXV2u5FUeghD/rN/c7pnbvpSWI19gtDZoSuTrHFYKzxj+/247MxFl9G5w7cxEag6rY8YWaAd6QXpwOC/mw1IVZifiZp4QAMI7v/A0Sk44L65GWltk1Q8jacWtr7HyBqD0Yndfnicte8PEAoDenTQzPTgL3Lp3NB/iq+Qa/NJtA64BwAeunaRwSS+E/Lgrf7HjQQjaAbfyRKefcWMEAGO16D3g2g9CxZJRQ6d54Pq3R7Fg8P48Pxa45e0aANrOi36mlyy9Ol5DpOyFryv5Oe9oG7SkeXBedqtgNtDz4XuBpus9EYXFUuj7m6LyEsDVbv0GXAMg9O61rVRQGTdM29f5W5Bqhmh5U+iUtLvLeyP40V3A4Xu84XeEi9o62YwlGD0KMD+RF8AFbhpzBQB++/KTlCkn7rDc1WIUUpvh63zAjQy2tLTwVWDSSbZ0aSUI7gT0SIwC90YWuhSqteZ5HtjhyXwfSx9dnQc+OHoaALMqqSh1syV0BYDQrsuepOJF1fEMbV3zhvd42xeTloCO+xMgTvWWrw03bv+9FXto7efNjg7XW2HmmS4GzYVRH8vG/CXZj185ldEVAML7vxOENDVmECfp7fC1/9xp2+7oxCJQ2SXWfjxeIaPbCg2PWsx9/YwbnY0m+9d5doDjTlF7ahZKoNfFcAxi/oscwFn2XCIUjgGg1n7xHKN04XPxGAt9z0Ic+LvTtjNGZzelcPdTwL7PZkw+u4bNGAKtIWi6jUchZZZ0zKEL0GjHxxUAwjvWPY6yZWtiMmWGr+0OEGd/Kj2acgZw7ObYqhy8DWi51Yn9Mkajtk0CDcRIbUO8Xq7BfzkRzvEIEH77q02YMi/mcZYZxWM6eI6JYk4n5tYyRuExAAA9WAlujeVMy4/KfjiKx3AEAOabZKVBCELMF2IZTex+DEI4yso0SxERb2s5FgBg6PNgNEW3N4Ob8/yY5cT0jgCg7b70Yr1ocewrPQ5Car3dSXtZQWM7BbT/Hmi4KitkjSWETnPBMXcCgCTyh2g13rNTwhEAwrsuewLFiwKxmAnhXRC7/9eurez5ff6joOLVseUx9/K7T0jpXj5ZYxjCbBh1cfqX+Uo5gAft2nEGgLev2oMpxx4fc/jv2QQhtM2urcz/bl71zrghfucfldLcSh68FdaOIAsLC2bgSLyAGr5P9uNrdqI7A8B73+jGpBkxT2Gk9rsBvdOuLc9+z/qbQRM8HQ/DugNIUWGhDHpdnJ0e83NyACvtmncEgFDdzQb5jqRWH8lR74bU/lO7drz7fQzdDKZ0MWk6ita1xLQrM9fnBTDPzvC2ALCcPyZVHYlSHM1OCG6H2PtHu3Y8+31MXQx55AgS1XhCAbS69rh2lWpYJBuHDFsAhN+84GJM+1jMHYDQ+9SRPH2e9XFcRmMKAOb9wRuTU2MYkqDV98TlzeBFeX4MCS4cTW4LAP2NwI1a+YofxGrJ1/kbkDraWzU1WgM5AByxLE2CVh8/yTUxnyMFEDcMyxYAyo5//imXffRfY3Wo1PYTwOhNVX+P4psDwBGTmP6BdTFnZotIYA74Avi/eJ3jAADrfsdlyy6JysRQILXdlrbONxvKASBibqYS6PU2qQKYL7XLQmoLgPCOSzah7KTPROtlUpusiJ90FlsAmI4aLbeCe1
</image>{{goodsData[0].discountPrice*100}}
4 years ago
</view>
<view class="zprice font14 fcor666 width70 flright">
<image style="width: 20px;height: 20px;vertical-align: sub;"
src="data:image/png;base64,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
</image> {{goodsData[0].salesPrice*100}}
4 years ago
</view>
</view>
<view class="title">
{{goodsData[0].couponName}}
</view>
<view class="mart10 width100">
<view class="font14 fcor666">库存 : {{goodsData[0].stockCount}}</view>
</view>
</view>
<!-- 服务-规则选择 -->
<!-- <view class="info-box spec" @click="jumpstore">
<view class="row">
<view class="text">门店列表</view>
<view class="content"><view class="serviceitem" v-for="(item,index) in goodsData.service" :key="index">{{item.name}}</view></view>
<view class="arrow">
<view class="icon xiangyou"></view>
</view>
</view>
</view> -->
<!-- 赠送 -->
<view class="description" v-if="goodsData[0].handselCouponList != '' ">
<view class="title"> 赠送卡券 </view>
<view class="product-list mart15">
<view class="product" v-for="product in goodsData[0].handselCouponList" :key="product.id">
<image mode="widthFix" :src="imageUrl+product.highCouponModel.couponImg"></image>
<view class="name">{{ product.highCouponModel.couponName }}</view>
4 years ago
<view class="info" v-if="product.highCouponModel.payType == 1">
<view class="price">{{ product.highCouponModel.discountPrice}}</view>
4 years ago
<view class="slogan"
v-if="product.highCouponModel.discountPrice !== product.highCouponModel.salesPrice">
{{ product.highCouponModel.salesPrice}}</view>
</view>
4 years ago
<view class="info" v-else>
<view class="price">
<image style="width: 15px;height: 15px;vertical-align: sub;"
src="data:image/png;base64,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
</image>{{ product.highCouponModel.discountPrice*100}}
</view>
<view class="slogan"
v-if="product.highCouponModel.discountPrice !== product.highCouponModel.salesPrice">
<image style="width: 15px;height: 15px;vertical-align: sub;"
src="data:image/png;base64,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
</image>{{ product.highCouponModel.salesPrice*100}}
</view>
4 years ago
</view>
</view>
</view>
</view>
<!-- 详情 -->
<view class="description">
<view class="title"> 商品详情 </view>
<view class="content marb65">
4 years ago
<image mode="widthFix" class="width100" v-for="codes in couponDesc" :key="codes" :src="imageUrl+codes">
</image>
</view>
</view>
<!-- <authorize></authorize> -->
</view>
</template>
<script>
import {
getCouponById,
GetPhoneNumber,
getUserInfo
} from "../../Utils/Api.js";
// import authorize from '../../components/Authorize.vue'
let app = getApp()
export default {
// components: {
// authorize
// },
data() {
return {
//控制渐变标题栏的参数
beforeHeaderzIndex: 11, //层级
afterHeaderzIndex: 10, //层级
beforeHeaderOpacity: 1, //不透明度
afterHeaderOpacity: 0, //不透明度
//是否显示返回按钮
// #ifndef MP
showBack: true,
// #endif
//轮播主图数据
swiperList: [],
4 years ago
couponDesc: [],
//轮播图下标
currentSwiper: 0,
anchorlist: [], //导航条锚点
selectAnchor: 0, //选中锚点
serviceClass: '', //服务弹窗css类,控制开关动画
specClass: '', //规格弹窗css类,控制开关动画
shareClass: '', //分享弹窗css类,控制开关动画
// 商品信息
goodsData: "",
selectSpec: null, //选中规格
isKeep: false, //收藏
//商品描述html
desid: '',
imageUrl: app.globalData.imgUrl,
user: ''
};
},
onLoad(option) {
this.desid = option.id;
this.user = app.globalData.userInfo;
this.getCouponById();
// #ifdef MP
//小程序隐藏返回按钮
// this.showBack = false;
// #endif
//option为object类型,会序列化上个页面传递的参数
},
onReady() {
// this.calcAnchor(); //计算锚点高度,页面数据是ajax加载时,请把此行放在数据渲染完成事件中执行以保证高度计算正确
},
onPageScroll(e) {
//锚点切换
// this.selectAnchor = e.scrollTop >= this.anchorlist[2].top ? 2 : e.scrollTop >= this.anchorlist[1].top ? 1 : 0;
//导航栏渐变
// let tmpY = 375;
// e.scrollTop = e.scrollTop > tmpY ? 375 : e.scrollTop;
// this.afterHeaderOpacity = e.scrollTop * (1 / tmpY);
// this.beforeHeaderOpacity = 1 - this.afterHeaderOpacity;
//切换层级
// this.beforeHeaderzIndex = e.scrollTop > 0 ? 10 : 11;
// this.afterHeaderzIndex = e.scrollTop > 0 ? 11 : 10;
},
//上拉加载,需要自己在page.json文件中配置"onReachBottomDistance"
onReachBottom() {
// uni.showToast({ title: '触发上拉加载' });
},
mounted() {
},
methods: {
//卡券详情
4 years ago
getCouponById() {
uni.showLoading({
title: '加载中...'
})
let params = {
couponId: this.desid
}
getCouponById(params).then(res => {
if (res.return_code == '000000') {
this.goodsData = [res.return_data];
4 years ago
this.swiperList = res.return_data.couponCarouselImg.split(',');
this.couponDesc = res.return_data.couponDesc.split(',');
uni.hideLoading()
} else {
uni.hideLoading()
}
})
},
//商品跳转
// toGoods(e) {
// console.log('=========='+e);
// // uni.showToast({
// // title: '商品' + e.goods_id,
// // icon: 'none'
// // });
// uni.navigateTo({
// url: 'goods'
// });
// },
/**
* 跳转门店详情
*/
jumpstore() {
uni.navigateTo({
url: './store-list/store-list?id=' + this.desid
})
},
//轮播图指示器
swiperChange(event) {
this.currentSwiper = event.detail.current;
},
//消息列表
toMsg() {
uni.navigateTo({
url: '../msg/msg'
})
},
// 客服
toChat() {
// uni.navigateTo({
// url:"../msg/chat/chat?name=客服008"
// })
},
// 分享
share() {
this.shareClass = 'show';
},
hideShare() {
this.shareClass = 'hide';
setTimeout(() => {
this.shareClass = 'none';
}, 150);
},
//收藏
keep() {
this.isKeep = this.isKeep ? false : true;
},
// 加入购物车
joinCart() {
if (this.selectSpec == null) {
return this.showSpec(() => {
uni.showToast({
title: "已加入购物车"
});
});
}
uni.showToast({
title: "已加入购物车"
});
},
//立即购买
// getPhoneNumber(PhoneNumber) {
// let params = {
// openId: app.globalData.openId,
// iv: PhoneNumber.detail.iv,
// encryptedData: PhoneNumber.detail.encryptedData
// }
// GetPhoneNumber(params).then(res => {
// if (res.return_code == '000000') {
// app.globalData.userInfo = res.return_data
// .object
// .highUser;
// uni.setStorage({
// key: "user",
// data: res.return_data
// .object
// .highUser
// })
// let that = this;
// if (that.goodsData[0].stockCount) {
// uni.showToast({
// title: '提交订单...',
// icon: 'none',
// duration: 2000,
// success() {
// uni.navigateTo({
// url: '../order/confirmation?id=' + that.goodsData[0].id
// })
// }
// })
// } else {
// uni.showToast({
// title: '卡券数量不足',
// icon: 'none',
// duration: 2000
// })
// }
// }
// });
// },
//获取登陆信息
getuserinfo() {
// uni.showLoading({
// title: '提交中...'
// });
let that = this;
// wx.login({
// success(res) {
// if (res.code) {
//发起网络请求
// var code = res.code
// 获取微信用户信息
uni.getUserProfile({
desc: '登录中...',
success: function(res) {
let params = {
openId: app.globalData.openId,
iv: res.iv,
encryptedData: res.encryptedData
}
getUserInfo(params).then(res => {
if (res.return_code == '000000') {
uni.hideLoading();
app.globalData.userInfo = res
.return_data
.object
.highUser;
app.globalData.token = res
.return_data.uniqueCode;
uni.setStorage({
key: "user",
data: res.return_data
.object
.highUser
})
uni.setStorage({
key: "token",
data: res.return_data
.uniqueCode
})
that.buy();
} else {
uni.hideLoading();
uni.showToast({
title: res.return_msg,
icon: 'none',
duration: 2000
})
}
});
},
fail: res => {
uni.hideLoading();
uni.showToast({
title: "微信登录授权失败",
icon: "none"
});
}
})
// } else {
// fail: res => {
// uni.showToast({
// title: "微信登录授权失败",
// icon: "none"
// });
// }
// }
// },
// fail(res) {
// uni.hideLoading();
// }
// })
},
buy() {
4 years ago
let that = this;
if (that.goodsData[0].stockCount) {
uni.showToast({
title: '提交订单...',
icon: 'none',
duration: 2000,
success() {
uni.navigateTo({
url: '../order/confirmation?id=' + that.goodsData[0].id
})
}
})
} else {
uni.showToast({
title: '卡券数量不足',
icon: 'none',
duration: 2000
})
}
4 years ago
},
//商品评论
toRatings() {
uni.navigateTo({
url: 'ratings/ratings'
})
},
//跳转评论列表
showComments(goodsid) {
},
//选择规格
setSelectSpec(index) {
this.selectSpec = index;
},
//减少数量
sub() {
if (this.goodsData.number <= 1) {
return;
}
this.goodsData.number--;
},
//增加数量
add() {
this.goodsData.number++;
},
//跳转锚点
toAnchor(index) {
this.selectAnchor = index;
uni.pageScrollTo({
scrollTop: this.anchorlist[index].top,
duration: 200
});
},
//计算锚点高度
calcAnchor() {
this.anchorlist = [{
name: '主图',
top: 0
},
{
name: '评价',
top: 0
},
{
name: '详情',
top: 0
}
]
let commentsView = uni.createSelectorQuery().select("#comments");
commentsView.boundingClientRect((data) => {
let statusbarHeight = 0;
//APP内还要计算状态栏高度
// #ifdef APP-PLUS
statusbarHeight = plus.navigator.getStatusbarHeight()
// #endif
let headerHeight = uni.upx2px(100);
this.anchorlist[1].top = data.top - headerHeight - statusbarHeight;
this.anchorlist[2].top = data.bottom - headerHeight - statusbarHeight;
}).exec();
},
//返回上一页
back() {
uni.navigateBack();
},
//服务弹窗
showService() {
console.log('show');
this.serviceClass = 'show';
},
//关闭服务弹窗
hideService() {
this.serviceClass = 'hide';
setTimeout(() => {
this.serviceClass = 'none';
}, 200);
},
//规格弹窗
showSpec(fun) {
console.log('show');
this.specClass = 'show';
this.specCallback = fun;
},
specCallback() {
return;
},
//关闭规格弹窗
hideSpec() {
this.specClass = 'hide';
//回调
this.selectSpec && this.specCallback && this.specCallback();
this.specCallback = false;
setTimeout(() => {
this.specClass = 'none';
}, 200);
},
discard() {
//丢弃
}
}
};
</script>
<style lang="scss">
page {
background-color: #f8f8f8;
4 years ago
}
.product-list {
width: 92%;
padding: 0 4% 3vw 4%;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
.product {
width: 48%;
border-radius: 20upx;
background-color: #fff;
margin: 0 0 15upx 0;
box-shadow: 0upx 5upx 25upx rgba(0, 0, 0, 0.1);
image {
width: 100%;
border-radius: 20upx 20upx 0 0;
}
.name {
width: 92%;
padding: 8upx 4%;
4 years ago
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
4 years ago
text-align: justify;
overflow: hidden;
font-size: 30upx;
}
.info {
display: flex;
justify-content: space-between;
align-items: flex-end;
width: 92%;
padding: 10upx 4% 10upx 4%;
.price {
color: #e65339;
font-size: 15px;
font-weight: 600;
}
.slogan {
color: #807c87;
font-size: 24upx;
text-decoration: line-through;
}
}
}
}
@keyframes showPopup {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes hidePopup {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes showLayer {
0% {
transform: translateY(0);
}
100% {
transform: translateY(-100%);
}
}
@keyframes hideLayer {
0% {
transform: translateY(-100%);
}
100% {
transform: translateY(0);
}
}
.icon {
font-size: 26upx;
}
.status {
width: 100%;
height: 0;
position: fixed;
z-index: 10;
top: 0;
/* #ifdef APP-PLUS */
height: var(--status-bar-height); //覆盖样式
/* #endif */
background-color: #f1f1f1;
transition: opacity 0.05s linear;
}
.header {
width: 100%;
height: 100upx;
display: flex;
align-items: center;
position: fixed;
top: 0;
z-index: 10;
/* #ifdef APP-PLUS */
top: var(--status-bar-height);
/* #endif */
.before,
.after {
width: 92%;
padding: 0 4%;
height: 100upx;
display: flex;
align-items: center;
position: fixed;
top: 0;
/* #ifdef APP-PLUS */
top: var(--status-bar-height);
/* #endif */
transition: opacity 0.05s linear;
.back {
width: 125upx;
height: 60upx;
flex-shrink: 0;
.icon {
margin-left: -10%;
width: 60upx;
height: 60upx;
display: flex;
align-items: center;
justify-content: center;
font-size: 42upx;
}
}
.middle {
width: 100%;
}
.icon-btn {
width: 125upx;
height: 60upx;
flex-shrink: 0;
display: flex;
.icon {
&:first-child {
margin-right: 5upx;
}
width: 60upx;
height: 60upx;
display: flex;
justify-content: center;
align-items: center;
font-size: 42upx;
}
}
}
.before {
.back {
.icon {
color: #fff;
background-color: rgba(0, 0, 0, 0.2);
border-radius: 100%;
}
}
.icon-btn {
.icon {
color: #fff;
background-color: rgba(0, 0, 0, 0.2);
border-radius: 100%;
}
}
}
.after {
background-color: #f1f1f1;
.back {
.icon {
color: #666;
}
}
.icon-btn {
.icon {
color: #666;
}
}
.middle {
font-size: 32upx;
height: 90upx;
display: flex;
justify-content: center;
align-items: center;
padding: 0 7%;
view {
width: (100%/3);
padding: 0 3%;
margin: 0 3%;
display: flex;
justify-content: center;
align-items: center;
&.on {
margin-bottom: -4upx;
color: #f47952;
border-bottom: solid 4upx #f47952;
}
}
}
}
}
.swiper-box {
position: relative;
width: 100%;
swiper {
width: 100%;
swiper-item {
image {
width: 100%;
height: 100vw;
}
}
}
.indicator {
display: flex;
justify-content: center;
align-items: center;
padding: 0 25upx;
height: 40upx;
border-radius: 40upx;
font-size: 22upx;
position: absolute;
bottom: 20upx;
right: 20upx;
color: #fff;
background-color: rgba(0, 0, 0, 0.2);
}
}
.info-box {
width: 92%;
padding: 20upx 4%;
background-color: #fff;
margin-bottom: 20upx;
}
.goods-info {
.price {
4 years ago
font-size: 15px;
font-weight: 600;
color: #f47925;
4 years ago
}
4 years ago
.zprice {
text-decoration: line-through;
}
.title {
font-size: 30upx;
}
}
.spec {
.row {
width: 100%;
display: flex;
align-items: center;
margin: 5px 0 5px 0;
.text {
font-size: 24upx;
color: #a2a2a2;
margin-right: 20upx;
}
.content {
font-size: 28upx;
display: flex;
flex-wrap: wrap;
.serviceitem {
margin-right: 10upx;
}
.sp {
width: 100%;
display: flex;
view {
background-color: #f6f6f6;
padding: 5upx 10upx;
color: #999;
margin-right: 10upx;
font-size: 20upx;
border-radius: 5upx;
&.on {
border: solid 1upx #f47952;
padding: 4upx 8upx;
}
}
}
}
.arrow {
position: absolute;
right: 4%;
.icon {
color: #ccc;
}
}
}
}
.comments {
.row {
width: 100%;
height: 40upx;
display: flex;
align-items: center;
margin: 0 0 30upx 0;
.text {
font-size: 30upx;
}
.arrow {
font-size: 28upx;
position: absolute;
right: 4%;
color: #17e6a1;
.show {
display: flex;
align-items: center;
.icon {
color: #17e6a1;
}
}
}
}
.comment {
width: 100%;
.user-info {
width: 100%;
height: 40upx;
display: flex;
align-items: center;
.face {
width: 40upx;
height: 40upx;
margin-right: 8upx;
image {
width: 40upx;
height: 40upx;
border-radius: 100%;
}
}
.username {
font-size: 24upx;
color: #999;
}
}
.content {
margin-top: 10upx;
font-size: 26upx;
}
}
}
.description {
.title {
width: 100%;
height: 80upx;
display: flex;
justify-content: center;
align-items: center;
font-size: 26upx;
color: #999;
}
}
.footer {
position: fixed;
bottom: 0upx;
width: 100%;
height: 99upx;
color: #FFFFFF;
border-top: solid 1upx #eee;
background-color: red;
z-index: 2;
display: flex;
justify-content: space-between;
align-items: center;
.btnfot {
text-align: center;
padding: 0;
border-radius: 0;
height: 48px;
background-color: red;
color: #ffffff;
}
.icons {
display: flex;
height: 80upx;
margin-left: -4%;
.box {
width: 80upx;
height: 80upx;
display: flex;
justify-content: center;
flex-wrap: wrap;
.icon {
font-size: 40upx;
color: #828282;
}
.text {
display: flex;
justify-content: center;
width: 100%;
font-size: 22upx;
color: #666;
}
}
}
.btn {
height: 80upx;
border-radius: 40upx;
overflow: hidden;
display: flex;
margin-right: -2%;
.joinCart,
.buy {
height: 80upx;
padding: 0 40upx;
color: #fff;
display: flex;
align-items: center;
font-size: 28upx;
}
.joinCart {
background-color: #f0b46c;
}
.buy {
background-color: #f06c7a;
}
}
}
.popup {
position: fixed;
top: 0;
width: 100%;
height: 100%;
z-index: 20;
display: none;
.mask {
position: fixed;
top: 0;
width: 100%;
height: 100%;
z-index: 21;
background-color: rgba(0, 0, 0, 0.6);
}
.layer {
position: fixed;
z-index: 22;
bottom: -70%;
width: 92%;
padding: 0 4%;
height: 70%;
border-radius: 20upx 20upx 0 0;
background-color: #fff;
display: flex;
flex-wrap: wrap;
align-content: space-between;
.content {
width: 100%;
padding: 20upx 0;
}
.btn {
width: 100%;
height: 100upx;
.button {
width: 100%;
height: 80upx;
border-radius: 40upx;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
background-color: #f47952;
font-size: 28upx;
}
}
}
&.show {
display: block;
.mask {
animation: showPopup 0.2s linear both;
}
.layer {
animation: showLayer 0.2s linear both;
}
}
&.hide {
display: block;
.mask {
animation: hidePopup 0.2s linear both;
}
.layer {
animation: hideLayer 0.2s linear both;
}
}
&.none {
display: none;
}
&.service {
.row {
margin: 30upx 0;
.title {
font-size: 30upx;
margin: 10upx 0;
}
.description {
font-size: 28upx;
color: #999;
}
}
}
&.spec {
.title {
font-size: 30upx;
margin: 30upx 0;
}
.sp {
display: flex;
view {
font-size: 28upx;
padding: 5upx 20upx;
border-radius: 8upx;
margin: 0 30upx 20upx 0;
background-color: #f6f6f6;
&.on {
padding: 3upx 18upx;
border: solid 1upx #f47925;
}
}
}
.length {
margin-top: 30upx;
border-top: solid 1upx #aaa;
display: flex;
justify-content: space-between;
align-items: center;
padding-top: 20upx;
.text {
font-size: 30upx;
}
.number {
display: flex;
justify-content: center;
align-items: center;
.input {
width: 80upx;
height: 60upx;
margin: 0 10upx;
background-color: #f3f3f3;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
input {
width: 80upx;
height: 60upx;
display: flex;
justify-content: center;
align-items: center;
text-align: center;
font-size: 26upx;
}
}
.sub,
.add {
width: 60upx;
height: 60upx;
background-color: #f3f3f3;
border-radius: 5upx;
.icon {
font-size: 30upx;
width: 60upx;
height: 60upx;
display: flex;
justify-content: center;
align-items: center;
}
}
}
}
}
}
.share {
display: none;
&.show {
display: block;
.mask {
animation: showPopup 0.15s linear both;
}
.layer {
animation: showLayer 0.15s linear both;
}
}
&.hide {
display: block;
.mask {
animation: hidePopup 0.15s linear both;
}
.layer {
animation: hideLayer 0.15s linear both;
}
}
&.none {
display: none;
}
.mask {
background-color: rgba(0, 0, 0, .5);
position: fixed;
width: 100%;
height: 100%;
top: 0;
z-index: 11;
}
.layer {
width: 92%;
position: fixed;
z-index: 12;
padding: 0 4%;
top: 100%;
background-color: rgba(255, 255, 255, 0.9);
.list {
width: 100%;
display: flex;
padding: 10upx 0 30upx 0;
.box {
width: 25%;
display: flex;
justify-content: center;
flex-wrap: wrap;
image {
width: 13.8vw;
height: 13.8vw;
}
.title {
margin-top: 10upx;
display: flex;
justify-content: center;
width: 100%;
font-size: 26upx;
}
}
}
.btn {
width: 100%;
height: 100upx;
display: flex;
justify-content: center;
align-items: center;
font-size: 28upx;
border-top: solid 1upx #666666;
}
.h1 {
width: 100%;
height: 80upx;
display: flex;
justify-content: center;
align-items: center;
font-size: 34upx;
}
}
}
</style>