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.
 
 
 
 
 

998 lines
26 KiB

<template>
<view >
<view ></view>
<view class="audio-main" @click="playAudio" style="top: 1.5%;right: 30upx;" v-if="!!goodsData.bgmusic">
<view class="audio-bg" :class="{ 'stop-audio': !play_Audio }">
<view class="audio-gif" :style="{ 'background-image': 'url(' + imageRoot + 'musicgif.gif)' }">
<view class="audio-png" :style="{ 'background-image': 'url(' + imageRoot + 'music.png)' }"></view>
</view>
</view>
</view>
<loadlogo v-if="!loadlogo" />
<view class="content" v-if="loadlogo">
<view class="titleimg" :style="{ width: imgstyle.width + 'px', height: imgstyle.height + 'px' }" v-if="goodsData.advs.length > 0">
<!-- 轮播图 -->
<view class="b-f">
<swiper
:style="{ width: imgstyle.width + 'px', height: imgstyle.height + 'px' }"
:indicator-dots="true"
indicator-color="#ffffff"
indicator-active-color="#cccccc"
:autoplay="true"
:interval="3000"
:circular="true"
class="goods-swiper"
>
<swiper-item class="swiper-item" v-for="(item, index) in goodsData.advs" :key="index">
<image :style="{ width: imgstyle.width + 'px', height: imgstyle.height + 'px' }" :src="item"></image>
<!-- <view class="swiper-item-img" :style="{backgroundImage: 'url(' + adv_item + ')'}" @load="imageLoad" :data-id="index"></view> -->
</swiper-item>
</swiper>
</view>
<view class="titlenum">{{ goodsData.pv }}人喜欢</view>
</view>
<!-- 商品信息 -->
<view class="goodsdatum">
<view class="goods_name t-l" @click="copy(goodsData.title)">{{ goodsData.title }}</view>
<!-- 价格 -->
<view class="goods_price dis-flex">
<view style="flex: 0.5;height: 50upx;">
<text class="f-20 c-ff4444">¥</text>
<text class="f-50 f-w c-ff4444">{{ goodsData.price }}</text>
<text v-if="goodsData.optionstatus == 1" style="font-size: 20upx;color: #FF4444;padding-left: 10upx;">起</text>
<!-- <text class="f-20" style="text-decoration:line-through;color: #999999;padding-left: 10upx;">¥100.00</text> -->
</view>
<view class="t-r f-20" style="color: #999999;flex: 0.5;height: 50upx;line-height: 70upx;">报名{{ goodsData.salenum }}人</view>
</view>
<!-- 时间 -->
<view class="goods_time dis-flex f-26">
<view class="iconfont icon-shijian" style="height: 60upx;line-height: 60upx;color: #999999;"></view>
<view >
<view class="time-item">
<text>活动时间:</text>
<text class="p-left-right-20">{{ goodsData.activestarttime }}</text>
<text>至</text>
<text class="p-left-right-20">{{ goodsData.activeendtime }}</text>
</view>
<view class="time-item">
<text>报名时间:</text>
<text class="p-left-right-20">{{ goodsData.enrollstarttime }}</text>
<text>至</text>
<text class="p-left-right-20">{{ goodsData.enrollendtime }}</text>
</view>
</view>
</view>
<!-- 图集 -->
<view class="goods_time dis-flex f-20" style="border: none; padding-bottom: 0;" v-if="goodsData.thumbs.length > 0">
<view class="iconfont icon-pic" style="height: 80upx;line-height: 80upx;color: #999999;padding-right: 20upx;"></view>
<view class="img-box dis-flex">
<view class="item-img-box dis-il-block" v-for="(item, index) in goodsData.thumbs" :key="index" v-if="index < 5" @click="lookimg(index)">
<image class="img-item" :src="item" mode=""></image>
</view>
<view class="item-img-box dis-il-block f-50 t-c morebox" v-if="goodsData.thumbs.length > 5">...</view>
</view>
<view class="moreimg" @click="lookimg(0)">
{{ goodsData.thumbs.length }}张
<text class="iconfont icon-right" style="font-size: 28upx;"></text>
</view>
</view>
</view>
<!-- 商家信息 -->
<view class="merchant">
<view ><goodsHeaderTitle :titleName="'商家详情'"></goodsHeaderTitle></view>
<view class="f-30 f-w merchant-title dis-flex" >{{ goodsData.storeinfo.storename }}
<view class="t-r col-f4 flex-box" @click="goStore">
点击进入<text class="iconfont icon-right" ></text>
</view>
</view>
<view class="f-22 merchant-item" >
营业时间:
<text style="padding-left: 20upx;">{{ goodsData.storeinfo.storehours }}</text>
<view class="dis-il-block merchant-icon" @click.stop="goLt"><image :src="imgfixUrls + 'merchant/spLt.png'" /></view>
</view>
<view class="f-22 merchant-item" @click.stop="goStore">
商家电话:
<text style="padding-left: 20upx;">{{ goodsData.storeinfo.mobile }}</text>
<view class="dis-il-block iconfont icon-dianhua merchant-icon" @click.stop="suput"></view>
</view>
<view class="f-22 merchant-item" @click.stop="goStore">
{{ goodsData.address || goodsData.storeinfo.address }}
<view class="dis-il-block iconfont icon-daohang merchant-icon" @click.stop="addear"></view>
</view>
</view>
<!-- 最近参与 -->
<view class="dis-flex recently" v-if="goodsData.memberlist">
<view class="f-30" style="padding-right: 20upx;height: 70upx;line-height: 70upx;">最近参与</view>
<view class="recently-img-box">
<view
class="recently-img-item dis-il-block"
v-for="(item, index) in goodsData.memberlist"
:style="{ left: -(index * 20) + 'rpx', zIndex: 5 - index }"
v-if="index < 4"
>
<image style="width: 100%;height: 100%;border-radius: 50%;" :src="item" mode=""></image>
</view>
<view
class="recently-img-item dis-il-block t-c"
v-if="goodsData.memberlist.length > 5"
style="background-color: #EEEEEE;color: #999999;left: -80upx;top: -30upx;font-weight: 500;"
>
...
</view>
</view>
</view>
<!-- 活动详情 -->
<view class="detailParticulars" v-if="goodsData.detail">
<view><goodsHeaderTitle :titleName="'活动信息'"></goodsHeaderTitle></view>
<view>
<jyf-parser
domain="https://6874-html-foe72-1259071903.tcb.qcloud.la"
gesture-zoom
lazy-load
ref="article"
selectable
show-with-animation
use-anchor
:html="goodsData.detail"
></jyf-parser>
</view>
</view>
<view class="bottom-btn dis-flex">
<view class="dis-flex" style="padding: 0 30upx;flex: 0.5;">
<view class="btn-item" @click="goindex">
<view class="iconfont icon-home btn-icon"></view>
<view class="btn-text">首页</view>
</view>
<view class="btn-item" @click="openshare">
<view class="iconfont icon-share btn-icon"></view>
<view class="btn-text">分享</view>
</view>
<view class="btn-item" @click="goestali">
<view class="iconfont icon-wode btn-icon"></view>
<view class="btn-text">我的</view>
</view>
</view>
<view class="red_btn">
<view class="item-btn" @click="apply">{{ goodsData.status == '1' ? '未开始' : goodsData.status == '2' ? btntext : '已结束' }}</view>
</view>
</view>
<PopManager :show="application" type="bottom" @clickmask="closeapplication">
<view class="showApply" style="height: 750upx;overflow: auto;">
<view class="f-40 f-w p-b-20">报名须知</view>
<view >
<jyf-parser
domain="https://6874-html-foe72-1259071903.tcb.qcloud.la"
gesture-zoom
lazy-load
ref="article"
selectableshow-with-animation
use-anchor
:html="goodsData.enrolldetail"
></jyf-parser>
</view>
</view>
</PopManager>
<PopManager :show="signShow" type="bottom" @clickmask="signShow = false">
<view class="showApply" style="position: relative;" v-if="signShow">
<view class="dis-flex">
<view style="flex: 0.3;"><image class="goodsLogo" :src="goodsData.thumb" mode=""></image></view>
<view style="flex: 0.7;">
<view class="dis-flex" style="padding-top: 10upx;">
<view class="rmb">¥</view>
<view class="picea" v-if="!!goodsData.specarray">{{ goodsData.specarray[checkIndex].price || goodsData.price }}</view>
<view class="picea" v-else>{{ goodsData.price }}</view>
<view class=" f-20" style="margin-top: 5upx;" v-if="goodsData.vipstatus != '0'">
<view class="dis-il-block huiyuan" v-if="goodsData.vipstatus !== '0'">{{ goodsData.levelname }}</view>
<view class="dis-il-block zhekou" v-if="goodsData.vipstatus == '1' && goodsData.specarray">
立减¥{{ goodsData.specarray[checkIndex].discount_price }}
</view>
<view class="dis-il-block zhekou" v-if="goodsData.vipstatus == '1' && !goodsData.specarray">立减¥{{ goodsData.discount_price }}</view>
</view>
<view class="iconfont icon-roundclose roundclose" @click="close"></view>
</view>
<view class="f-26" style="padding: 90upx 0 0 20upx;" v-if="goodsData.specarray">
<text style="padding-right: 10upx;">选择</text>
<text style="padding-right: 10upx;">{{ goodsData.specarray[checkIndex].name }}</text>
<text style="padding-right: 10upx;">{{ goodsNumber }}件</text>
</view>
<view class="f-26" style="padding: 90upx 0 0 20upx;" v-else>
<text style="padding-right: 10upx;">选择</text>
<text style="padding-right: 10upx;">{{ goodsData.title }}</text>
<text style="padding-right: 10upx;">{{ goodsNumber }}件</text>
</view>
</view>
</view>
<view class="f-32" style="font-weight: 500;padding: 30upx 0;" v-if="goodsData.specarray">规格选择</view>
<view
class="tag-a dis-flex"
:style="{ border: checkIndex == index ? '1rpx solid #ff4444' : '1rpx solid #cccccc' }"
v-for="(item, index) in goodsData.specarray"
:key="index"
@click="checkedTag(item, index)"
>
<view class="f-32" style="flex: 0.5;line-height: 60upx;width: 300upx;">{{ item.name }}</view>
<view class="f-32" style="flex: 0.5;">
<view class="dis-flex t-c" style="padding-top: 10upx;">
<view
class=" f-20"
style="margin-top: 5upx;width: 280upx;"
v-if="checkIndex == index && (goodsData.vipstatus != '0' && goodsData.vipstatus == '1')"
>
<view class="dis-il-block huiyuan">{{ goodsData.levelname }}</view>
<view class="dis-il-block zhekou">立减¥{{ item.discount_price }}</view>
</view>
<view
class=" f-20"
style="margin-top: 5upx;width: 200upx;"
v-else-if="checkIndex == index && (goodsData.vipstatus != '0' && goodsData.vipstatus == '2')"
>
<view class="dis-il-block zhekou" style="border-radius: 60upx;">会员特供</view>
</view>
<view style="width: 190upx;" v-else></view>
<text class="rmb">¥</text>
<text class="picea">{{ item.price }}</text>
</view>
</view>
<view class="iconfont icon-check checked" v-if="checkIndex == index"></view>
</view>
<view class="dis-flex">
<view class="f-32" style="flex: 0.8;">数量</view>
<view class="dis-flex" style="flex: 0.2;">
<view class="n-Number btnactive" :style="{ color: goodsNumber == 1 ? '#999999' : '#333333' }" @click="reduce">-</view>
<view class="n-Number" style="box-sizing: border-box;padding-top: 5upx;margin: 0 10upx;">
<input type="number" maxlength="3" @blur="inputNumber" v-model="goodsNumber" />
</view>
<view class="n-Number btnactive" @click="add">+</view>
</view>
</view>
</view>
</PopManager>
<view >
<follow
:followShow="followShow"
:followType="followType"
:followTitleShow="followTitleShow"
@clickmask="openQrShow"
@closeFollowPop="closeFollowPop"
@closeFollowTitle="closeFollowTitle"
:followData="followData"
></follow>
</view>
<shareBottom
:shareBottomShow="shareBottomShow"
@clickmask="closeShareBottom"
:shareShow="shareShow"
@closeShareShow="closeShareShow"
@shareImgShow="shareImgShow"
:isCard="isCard"
:postId="id"
@gohb="goPost"
:postType="'14'"
></shareBottom>
<!-- #ifdef H5 -->
<view class="masking" v-if="isShare" @click="isShare = false"><image :src="imageRoot + 'share.png'" class="to-share" mode="widthFix"></image></view>
<!-- #endif -->
</view>
</view>
</template>
<script>
let innerAudioContext = uni.createInnerAudioContext();
import App from '@/common/js/app.js';
import goodsHeaderTitle from '@/components/template/goodsHeaderTitle.vue';
import jyfParser from '@/components/jyf-parser/jyf-parser.vue';
// #ifdef H5
import wxApi from '@/common/js/wxApi.js';
// #endif
import PopManager from '@/components/template/PopManager';
import Loadlogo from '@/components/template/loadlogo.vue';
import shareBottom from '@/components/template/shareBottom';
import follow from '@/components/template/follow.vue';
import Map from '@/common/js/ms-openMap/openMap.js'
export default {
data() {
return {
imgstyle: {},
imgs: [1, 2, 23, 3, 2, , 1, 1, 1],
gdimgs: [1, 2, 2, 3, 1, 1, 1],
signShow: false,
tags: [1, 2, 3],
checkIndex: 0,
goodsNumber: 1,
goodsData: {
thumbs: [],
advs: []
},
loadlogo: false,
application: false,
shareBottomShow: false,
shareShow: false,
id: '',
isShare: false,
goodsId: {},
btntext: '立即报名',
followTitleShow: true,
followShow: false,
followType: '10',
followData: {},
play_Audio: false
};
},
components: {
goodsHeaderTitle,
jyfParser,
PopManager,
shareBottom,
follow,
Loadlogo
},
onHide() {
let _this = this,
play_Audio = false,
pageAudio = _this.goodsData.bgmusic;
if (!play_Audio) {
innerAudioContext.pause();
innerAudioContext.onPause(() => {
console.log('暂停播放');
});
}
_this.play_Audio = play_Audio;
},
onLoad(e) {
let _this = this;
_this.id = e.id;
_this.imgstyle = uni.getStorageSync('imgstyle');
_this.getGoodsData(e.id);
},
computed: {
isCard() {
let ClientType = App.getClientType();
return ClientType !== '3' ? false : true;
},
cardShare() {
return this.$store.state.isCardshare;
}
},
onShow() {
this.playAudio();
},
methods: {
// 联系商家
goLt() {
let _this = this
// App.navigationTo({
// url: "pages/subPages/homepage/chat/chat?other_party_id=" + _this.dataInfo.sid + '&other_party_type=2' +
// '&type=1'
// })
let getSetInfo = uni.getStorageSync('getSetInfo');
if(getSetInfo.type == 1){
App.navigationTo({
url: 'pagesA/instantMessenger/instantMessenger?other_party_id=' + _this.goodsData.sid + '&other_party_type=' + 2+ '&type=1' + '&id='
})
}else{
App.navigationTo({
url: 'pages/subPages/homepage/chat/chat?other_party_id=' + _this.goodsData.sid + '&other_party_type=' + 2+ '&type=1' + '&id='
})
}
},
goStore(){
App.navigationTo({
url: `pages/mainPages/store/index?sid=${this.goodsData.sid}`
});
},
copy(value) {
//#ifdef H5
App.clipboard(value);
//#endif
uni.setClipboardData({
data: value
});
uni.showToast({
title: '商品名已复制到粘贴板',
icon: 'none'
});
},
closeapplication() {
this.application = false;
this.btntext = '立即报名';
},
closeFollowTitle() {
let _this = this;
_this.followTitleShow = false;
},
closeFollowPop() {
let _this = this;
_this.followShow = false;
},
openQrShow() {
let _this = this;
_this.followShow = true;
},
openshare() {
this.shareBottomShow = true;
},
goPost(data) {
let _this = this;
_this.shareBottomShow = false;
},
shareImgShow() {
let _this = this;
_this.shareShow = true;
_this.shareBottomShow = false;
},
// 关闭分享弹框
closeShareShow() {
let _this = this;
_this.shareShow = false;
_this.shareBottomShow = false;
},
closeShareBottom() {
let _this = this;
_this.shareBottomShow = false;
},
lookimg(index) {
let _this = this;
uni.previewImage({
current: _this.goodsData.thumbs[index],
urls: _this.goodsData.thumbs
});
},
playAudio() {
let _this = this,
play_Audio = _this.play_Audio ? false : true,
pageAudio = _this.goodsData.bgmusic;
if (play_Audio) {
//#ifdef H5
jWeixin.ready(() => {
jWeixin.getLocation({
type: 'gcj02',
success: function(res) {
innerAudioContext.play();
innerAudioContext.loop = true;
}
});
});
//#endif
//#ifndef H5
// innerAudioContext.play();
innerAudioContext.loop = true;
innerAudioContext.play();
//#endif
innerAudioContext.onPlay(() => {
console.log('开始播放');
});
}
if (!play_Audio) {
innerAudioContext.pause();
innerAudioContext.onPause(() => {
console.log('暂停播放');
});
}
innerAudioContext.onError(res => {
// console.log(res.errMsg);
// console.log(res.errCode);
innerAudioContext.destroy();
//发生错误后,销毁实例
});
_this.play_Audio = play_Audio;
},
getGoodsData(id) {
let _this = this;
App._post_form(
`&p=activity&do=activityDetail&id=${id}`,
{},
res => {
console.log(res);
if (res.data.url) {
// uni.redirectTo({
// url:
// });
// debugger
if(res.data.url.indexOf('http') === -1){ //判断是否为外链活动
App.navigationTo({
url:res.data.url
})
}else{ //外链活动则新建视图
let urls = encodeURIComponent(res.data.url);
uni.redirectTo({
url: `/pages/subPages/webview/webview?src=${urls}`
});
}
return;
}
_this.goodsData = res.data;
if (!_this.goodsData.advs) {
_this.goodsData.advs = [];
}
if (!_this.goodsData.thumbs) {
_this.goodsData.thumbs = [];
}
if (_this.goodsData.specarray) {
_this.goodsId = res.data.specarray[0];
}
if (!!res.data.bgmusic) {
// innerAudioContext.src = res.data.bgmusic;
// console.log(innerAudioContext.src);
innerAudioContext.src = encodeURI(res.data.bgmusic);
setTimeout(() => {
//#ifdef H5
jWeixin.ready(() => {
innerAudioContext.loop = true;
innerAudioContext.play();
});
//#endif
//#ifndef H5
innerAudioContext.loop = true;
innerAudioContext.play();
//#endif
// _this.playAudio();
});
}
// console.log(_this.goodsData.)
// debugger
},
false,
() => {
_this.loadlogo = true;
}
);
},
goindex() {
App.navigationTo({
url: `pages/mainPages/index/index`
});
},
goestali() {
console.log(111);
App.navigationTo({
url: `pages/mainPages/userCenter/userCenter`
});
},
addear() {
let location = {};
if(this.goodsData.addresstype == 1){
location = {
location:{
lat:this.goodsData['lat'],
lng:this.goodsData['lng']
},
storename:this.goodsData['address'],
address:this.goodsData['address']
}
}else{
location = this.goodsData.storeinfo;
}
console.log(location)
debugger
// #ifdef H5
wxApi.WxopenLocation(location.location['lat'], location.location['lng'], location['storename'], location['address']);
// #endif
// #ifdef MP-WEIXIN
App.openLocation(location);
// #endif
//#ifdef APP-PLUS
Map.openMap(Number(location.location['lat']),Number(location.location['lng']),location['storename'],'gcj02')
//#endif
},
suput() {
uni.makePhoneCall({
phoneNumber: this.goodsData.storeinfo.mobile //仅为示例
});
},
apply() {
let _this = this;
if (this.goodsData.status !== '2') return;
let data = {
type: '4',
id: _this.id
};
console.log('点了');
// debugger
if (!this.application && !this.signShow && this.goodsData.enrolldetail) {
this.application = true;
this.btntext = '同意';
} else if ((this.application && !this.signShow) || (!this.goodsData.enrolldetail && !this.application && !this.signShow)) {
this.application = false;
this.signShow = true;
this.btntext = '立即报名';
} else if (!this.application && this.signShow) {
App._post_form('&do=follow', data, res => {
if (res.data.status == 0) {
let goods;
if (this.goodsData.specarray) {
this.goodsData.specarray.map(item => {
if (item.id == _this.goodsId.id) {
goods = item;
}
});
} else {
goods = this.goodsData;
}
if (goods.surplus == 0) {
uni.showToast({
title: `当前规格报名人数已满`,
icon: 'none'
});
return;
} else if (goods.surplus < _this.goodsNumber) {
uni.showToast({
title: `当前剩余报名人数为${goods.surplus}`,
icon: 'none'
});
this.goodsNumber = goods.surplus;
return;
}
// 立即购买
App.navigationTo({
url:
'pages/subPages/submitOrder/submitOrder?' +
App.urlEncode({
goods_id: _this.id,
goods_num: _this.goodsNumber,
specid: _this.goodsId.id || '',
plugin: '11',
buystatus: 0,
addressid: 0,
drawid: ''
}),
success() {
// 关闭弹窗
_this.application = false;
_this.signShow = false;
}
});
} else {
_this.followShow = true;
_this.followData = res.data;
}
});
}
},
close() {
this.signShow = false;
},
checkedTag(item, index) {
this.checkIndex = index;
this.goodsNumber = 1;
this.goodsId = item;
},
reduce() {
if (this.goodsNumber == 1) return;
this.goodsNumber--;
},
add() {
if (this.goodsId.surplus == this.goodsNumber) {
uni.showToast({
title: '已达到最大报名数',
icon: 'none'
});
return;
}
this.goodsNumber++;
},
inputNumber() {
if (parseInt(this.goodsNumber) < 1) {
this.goodsNumber = 1;
} else {
this.goodsNumber = parseInt(this.goodsNumber);
}
}
},
destroyed() {
innerAudioContext.stop();
innerAudioContext.onStop(() => {
console.log('页面跳转暂停播放');
});
},
onUnload() {
this.play_Audio = false;
innerAudioContext.stop();
innerAudioContext.onStop(() => {
console.log('页面跳转暂停播放');
});
}
};
</script>
<style>
page {
background-color: #f8f8f8;
}
</style>
<style lang="scss" scoped>
.content {
padding-bottom: 200upx;
.titleimg {
position: relative;
.titlenum {
background-color: rgba(0, 0, 0, 0.3);
height: 50upx;
line-height: 50upx;
padding: 0 20upx;
right: 0upx;
bottom: 50upx;
position: absolute;
border-radius: 60upx 0upx 0 60upx;
font-size: 20upx;
color: #ffffff;
}
}
.goodsdatum {
padding: 20upx 30upx;
background-color: #ffffff;
.goods_name {
font-weight: 500;
}
.goods_price {
padding: 20upx 0;
border-bottom: 2upx solid #f8f8f8;
}
.goods_time {
padding: 20upx 0;
border-bottom: 2upx solid #f8f8f8;
.time-item {
height: 30upx;
line-height: 30upx;
padding-left: 20upx;
}
.img-box {
flex: 0.85;
.item-img-box {
// flex: 0.8;
padding-right: 10upx;
.img-item {
width: 80upx;
height: 80upx;
border-radius: 5upx;
}
}
.morebox {
background-color: #eeeeee;
width: 80upx;
height: 80upx;
border-radius: 8upx;
padding: 0;
line-height: 50upx;
color: #999999;
}
}
.moreimg {
flex: 0.15;
color: #999999;
line-height: 80upx;
text-align: center;
font-size: 26upx;
}
}
}
.merchant {
background-color: #ffffff;
padding: 30upx;
margin-top: 20upx;
.merchant-title {
padding-bottom: 30upx;
}
.merchant-item {
padding-bottom: 30upx;
color: #999999;
position: relative;
.merchant-icon {
height: 50upx;
width: 50upx;
line-height: 50upx;
border-radius: 50%;
font-size: 32upx;
text-align: center;
color: #ffffff;
background-color: #ff4444;
position: absolute;
right: 0;
top: -50%;
transform: translateY(50%);
image{
width: 40upx;
height: 40upx;
margin-top: 6upx;
}
}
}
}
.recently {
padding: 20upx 30upx;
font-weight: 600;
margin: 20upx 0;
height: 70upx;
background-color: #ffffff;
.recently-img-box {
.recently-img-item {
width: 70upx;
height: 70upx;
border-radius: 50%;
position: relative;
}
}
}
.detailParticulars {
padding: 30upx;
background-color: #ffffff;
padding-bottom: 150upx;
overflow: hidden;
}
.bottom-btn {
// padding: 20upx 0upx;
box-shadow: 0px 0px 10px #cccccc;
height: 100upx;
background-color: #ffffff;
position: fixed;
width: 100vw;
z-index: 1000;
bottom: 0;
left: 0;
.btn-item {
width: 50%;
// padding: 5upx 0 0;
line-height: 50upx;
.btn-icon {
font-size: 36upx;
text-align: center;
}
.btn-text {
font-size: 20upx;
text-align: center;
}
}
.red_btn {
padding: 10upx 20upx;
flex: 0.5;
.item-btn {
height: 80upx;
line-height: 80upx;
text-align: center;
background-color: #ff4444;
border-radius: 60upx;
width: 350upx;
font-size: 34upx;
color: #ffffff;
}
}
}
.showApply {
width: 92vw;
padding: 30upx;
height: 800upx;
// overflow: hidden;
background-color: #ffffff;
border-radius: 30upx 30upx 0upx 0upx;
margin-bottom: 100upx;
overflow: auto;
.goodsLogo {
width: 200upx;
height: 200upx;
border-radius: 10upx;
}
.huiyuan {
height: 35upx;
line-height: 35upx;
border-radius: 60upx 0upx 0upx 60upx;
background-color: #eed196;
color: #333333;
padding: 0 10upx;
}
.zhekou {
height: 35upx;
line-height: 35upx;
border-radius: 0 60upx 60upx 0;
background-color: #333333;
color: #eed196;
padding: 0 10upx;
}
.roundclose {
font-size: 50upx;
color: #cccccc;
position: absolute;
right: 15upx;
top: 15upx;
}
.rmb {
font-size: 20upx;
color: #ff4444;
padding-left: 20upx;
vertical-align: bottom;
line-height: 52upx;
}
.picea {
font-size: 40upx;
color: #ff4444;
padding-right: 20upx;
height: 40upx;
line-height: 40upx;
}
.n-Number {
width: 60upx;
height: 60upx;
border-radius: 5upx;
background-color: #f8f8f8;
text-align: center;
line-height: 60upx;
}
.btnactive {
transition: transform 0.3s ease-out;
}
.btnactive:active {
background-color: #999999;
}
}
.tag-a {
padding: 25upx 30upx;
border-radius: 15upx;
// border: 1upx solid #999999;
position: relative;
overflow: hidden;
margin-bottom: 30upx;
.checked {
height: 100upx;
width: 100upx;
color: #ffffff;
background-color: #ff4444;
position: absolute;
bottom: -80upx;
right: -80upx;
border-radius: 50%;
padding: 0upx 20upx 20upx;
}
}
}
.masking {
position: fixed;
/* width: 100%;
height: 100%; */
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 100;
background: rgba(0, 0, 0, 0.5);
/* display: none */
}
</style>