<template>
<view class="info_content">
<view class="topbar_icon_box" :class="bg_show && 'bg_show'">
<text class="info_icon back_icon" @click="backup()"></text>
<view>
<text class="info_icon home_icon" @click="jumpPhpPage()"></text>
<text class="info_icon collection_icon" v-if="data.EquipmentInfo.collect_goods === 1" @click="collectGoods(data.EquipmentInfo.goods_id, 0)"></text>
<text class="info_icon uncollection_icon" v-if="data.EquipmentInfo.collect_goods === 0" @click="collectGoods(data.EquipmentInfo.goods_id, 1)"></text>
</view>
</view>
<swiper class="img_swiper">
<swiper-item v-for="(val, index) in data.EquipmentImgs" :key="index">
<image :src="val.img_url" class="img_item"></image>
</swiper-item>
</swiper>
<view class="goods_info">
<view class="goods_info_flex">
<view>
<text class="symbol" v-if="isLogin">￥</text>
<text class="goods_price">{{isLogin ? e_info.equipment_price : '登录显示价格'}}</text>
<text class="goods_label">分期购 </text>
</view>
</view>
<view class="goods_name">{{data.EquipmentInfo.equipment_name}}</view>
<view class="goods_subname">{{data.EquipmentInfo.goods_subname}}</view>
</view>
<view class="freight common_item_bar">
<view>
<text class="info_commom_title">快递</text>
<text class="info_common_con">0.00</text>
<text class="info_common_label">包邮</text>
</view>
<!-- <view class="info_operation">
<text>选择</text>
<text class="right_arrow_icon"></text>
</view> -->
</view>
<!-- <view class="common_item_bar">
<view>
<text class="info_commom_title">活动</text>
<text class="info_common_label info_common_label2">分期</text>
<text class="info_common_con">采购分期限时免息</text>
</view>
<view class="info_operation">
<text>查看</text>
<text class="right_arrow_icon"></text>
</view>
</view> -->
<view class="common_item_bar">
<view>
<text class="info_commom_title">分期</text>
<text class="info_common_con">已选：x{{Number(e_info.periods_num)+1}}期</text>
</view>
<view class="info_operation" @click="open()">
<text>选择</text>
<text class="right_arrow_icon"></text>
</view>
</view>
<view v-if="isLogin">
<view class="title_label">分期信息</view>
<view class="installment_table_box">
<view class="installment_table">
<view class="table_title">
<view>分期数</view>
<view>定金 (元)</view>
<view>第1期还款</view>
<view>剩余每期还款</view>
<view>利率</view>
</view>
<view class="table_item" v-for="(val, index) in data.Equipmentproperty" :key="index">
<view>{{Number(val.periods_num)+1}}期</view>
<view>{{val.advance_payment}}</view>
<view>{{val.first_payment}}</view>
<view>{{val.remaining_payment}}</view>
<view>{{val.count*100}}%</view>
</view>
</view>
</view>
</view>
<view class="entry_shop">
<view>
<image class="shop_logo" :src="data.StoreInfo.store_logo || $defaultPortrait"></image>
<view class="dlb dlb_box" @click="jumpPhpPage(`app=store&id=${data.StoreInfo.store_id}`)">
<view class="shop_name">{{data.StoreInfo.store_name}}<i class="right_arrow_icon"></i></view>
<view class="focus_num">{{data.StoreInfo.collect_count}}人关注</view>
</view>
</view>
<text class="focus_shop" v-if="data.EquipmentInfo.collect_store === 0" @click="collectShop(data.StoreInfo.store_id, 1)">关注店铺</text>
<text class="focus_shop" v-if="data.EquipmentInfo.collect_store === 1" @click="collectShop(data.StoreInfo.store_id, 0)">已关注</text>
</view>
<view class="shop_goods">
<view class="shop_goods_item" v-for="(val, index) in data.EquipmentList" :key="index" @click="jumpDetail(val.equipment_id)">
<image :src="val.img_url"></image>
<view class="shop_goods_name">{{val.equipment_name}}</view>
<view class="shop_goods_price"><text v-if="isLogin">¥</text>{{isLogin ? val.equipment_price : '登录显示价格'}}</view>
</view>
</view>
<view class="equipment_detail">
<view class="title_label">产品信息</view>
<view v-if="equipment_detail" v-html="equipment_detail"></view>
<view v-if="!equipment_detail" class="no_data">暂无产品信息</view>
</view>
<view class="goods_info_bottom_bar">
<view class="bottom_bar_tool">
<view class="tool contact_tool"></view>
<view class="tool_title">联系客服</view>
</view>
<view class="bottom_bar_tool" @click="jumpPhpPage(`app=store&id=${data.StoreInfo.store_id}`)">
<view class="tool shop_tool"></view>
<view class="tool_title">店铺</view>
</view>
<view class="bottom_bar_tool">
<view class="tool cart_tool" @click="jumpPhpPage('app=cart')"></view>
<view class="tool_title">购物车</view>
</view>
<!-- <view class="bottom_btn join_cart">加入购物车</view> -->
<view class="bottom_btn join_buy" @click="open()">立即分期</view>
</view>
<uni-popup ref="popup" type="bottom">
<view class="poupp_content">
<text class="eosfont close" @click="close()"></text>
<view :style="{padding: '0 24rpx'}">
<view class="poupp_flex">
<image class="poupp_img" :src="data.EquipmentInfo.default_image || $noGoodsImg"></image>
<view class="dlb">
<view class="poupp_goods_name">{{data.StoreInfo.equipment_name}}</view>
<view class="poupp_goods_price">
<text class="symbol">¥</text>{{e_info.equipment_price}}
<text class="poupp_label">分期购</text>
</view>
</view>
</view>
<view class="poupp_nper">
<view><text class="dlb">期数</text>
<!-- <text class="dlb limit_free">限时免息</text> -->
</view>
<view class="poupp_nper_box">
<text v-for="(val,index) in data.Equipmentproperty" :key="index" :class="{act: periodTab === index}" @click="choosePeriod(index)">{{Number(val.periods_num)+1}}期</text>
</view>
</view>
<view class="poupp_deposit">
<text>定金</text>
<text>¥ {{e_info.advance_payment}}</text>
</view>
<view class="poupp_nper_detail">
<view>
<text>第1期 支付</text>
<text>¥ {{(Number(e_info.first_payment)+(Number(e_info.equipment_price)-Number(e_info.advance_payment))*Number(e_info.count)).toFixed(2)}}</text>
</view>
<view>
<text>剩余{{e_info.periods_num}}期 每期支付</text>
<text>¥ {{(Number(e_info.remaining_payment)+(Number(e_info.equipment_price)-Number(e_info.advance_payment))*Number(e_info.count)).toFixed(2)}}</text>
</view>
</view>
<view class="profile">利息每期(元)：¥{{((Number(e_info.equipment_price)-Number(e_info.advance_payment))*Number(e_info.count)).toFixed(2)}}</view>
<view class="sales_box">
<text class="sales_name">销售人员:</text>
<input class="sales_input" type="text" placeholder="销售人员姓名,选填" v-model="sales">
</view>
</view>
<view class="poupp_tips">金融分期需要上传金融资质, 包含法人信息/企业执照/银行流水等…</view>
<view class="poupp_btn" @click="buy_now()">立即分期</view>
</view>
</uni-popup>
</view>
</template>
<script>
import uniPopup from "@/components/uni-popup/uni-popup.vue";
import { php, go } from '../../common/host.js';
export default {
data() {
return {
visible: false,
bg_show: false,
data: {
EquipmentImgs: [],
EquipmentInfo: {},
EquipmentList: [],
Equipmentproperty: [],
StoreInfo: {}
},
e_info: {
equipment_price: 0.00,
advance_payment: 0.00,
remaining_payment: 0.00,
first_payment: 0.00
},
equipment_detail: '',
periodTab: 0,
isLogin: 0,
equipment_id: '',
is_auth: '0',
type: 2,
sales: '',
status: -1,
enable_flg: -1
}
},
onPageScroll(e){
const {scrollTop} = e;
if(scrollTop > 300){
this.bg_show = true;
}else{
this.bg_show = false;
}
},
onLoad(option) {
this.equipment_id = option.id;
this.getData(option.id);
// #ifdef H5
//默认请求微信分享
if (this.$wechat && this.$wechat.isWechat()) {
this.$wechat.share({titie: this.$getNavigationBarTitle()});
}
// #endif
},
methods: {
open() {
if(!this.isLogin) {
uni.showToast({
title: '请登录',
icon: 'none'
});
setTimeout(() => {
this.$jump(`${php}app=member&act=login`)
}, 2000)
return
}
this.$refs.popup.open()
},
close() {
this.$refs.popup.close()
},
getData(id) {
uni.request({
url: `/uni/api/equipment_index/GetEquipmentDetail/${id}`,
method: 'GET',
dataType: 'json',
success: (res) => {
this.data = {
...this.data,
...res.data.data
}
res.data.data.Equipmentproperty.forEach((item, index) => {
if(item.is_def == 1) {
this.e_info = {
...this.e_info,
...item
}
this.periodTab = index
}
});
this.equipment_detail = res.data.data.EquipmentInfo.equipment_details ? res.data.data.EquipmentInfo.equipment_details.replace(/\<img/g, `<image style="max-width: 100%;width: auto !important;height: auto !important"`) : '';
this.isLogin = res.data.login_flg;
this.is_auth = res.data.data.is_auth;
this.type = res.data.data.EquipmentInfo.type;
this.status = res.data.data.status || -1;
this.enable_flg = res.data.data.enable_flg || -1;
}
});
},
choosePeriod(key) {
this.e_info = this.data.Equipmentproperty[key];
this.periodTab = key;
},
jumpPhpPage(url) {
let link = url ? `${php}${url}` : php;
window.location.href = link;
},
backup() {
this.$backup();
},
buy_now() {
const data = {
equipment_id: this.equipment_id,
property_id: this.e_info.property_id
}
if(this.sales) {
uni.setStorage({
key: 'sales',
data: this.sales
});
}
uni.setStorage({
key: 'advance_payment',
data: this.e_info.advance_payment
})
if(this.is_auth === '1') {
if(this.status === 0 || this.status === 2) {
uni.navigateTo({
url: `/pages/theRights/theRights`
});
return
}
uni.setStorage({
key: 'installment',
data: data,
success: () => {
uni.navigateTo({
// url: '/pages/apply/choosetype'
url: `/pages/apply/applypage1?property_id=${this.e_info.property_id}&equipment_id=${this.equipment_id}`
});
}
});
} else if (this.is_auth == 0) {
uni.setStorage({
key: 'installment',
data: data,
success: () => {
uni.navigateTo({
url: `/pages/theRights/theRights?is_auth=${this.is_auth}`
});
}
});
} else {
if(this.enable_flg === '0') {
this.close();
uni.showToast({
title: '您的白条已被禁用',
icon: 'none',
duration: 2000
})
return
}
uni.setStorage({
key: 'installment',
data: data,
success: () => {
uni.navigateTo({
url: '/pages/signcontract/signcontract?type=1'
});
}
});
}
},
collectGoods(id, type) {
uni.request({
url: `/uni/api/collect/UpdateCollectGoods`,
method: 'POST',
dataType: 'json',
data: {
flag: type,
item_id: id
},
success: (res) => {
if(res.data.code === 0) {
this.data.EquipmentInfo.collect_goods = type;
}
}
})
},
collectShop(id, type) {
uni.request({
url: `/uni/api/collect/UpdateCollectStore`,
method: 'POST',
dataType: 'json',
data: {
flag: type,
item_id: id
},
success: (res) => {
if(res.data.code === 0) {
this.data.EquipmentInfo.collect_store = type;
}
}
})
},
jumpDetail(id) {
uni.navigateTo({
url: `/pages/installment/installmentinfo?id=${id}`,
});
},
},
components: {
uniPopup,
}
}
</script>
<style lang="less" scoped>
.info_content {
background: #F5F5F5;
padding-bottom: 100rpx;
}
.topbar_icon_box {
display: flex;
justify-content: space-between;
width: 100%;
padding: 14rpx 20rpx;
box-sizing: border-box;
position: fixed;
left: 0;
top: 0;
background: rgba(255, 255, 255, 0);
z-index: 99;
// border-radius: 100%;
.info_icon {
display: inline-block;
vertical-align: middle;
width: 60rpx;
height: 60rpx;
}
.back_icon {
background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAAAAAAfl4auAAABYUlEQVRIx6XXO46DMBAGYN9zBAWic7aOKFxQ0VJQcQgarkBLARdYbVZJGkiFkKiy5LEPssaD/f+l4ZMQ4PGMuGoz1kUWydD3QxllRT3q7xKatb5UHi3iqbLfhNvkRT590rK4UbQa1Rhxl5IxabeOq4CYBNUKnnLakHzS4SGmTYmH//iyp43ZX17xsNnOeljiKSaLxNMC52SV/C+uyDLVL+4CWxx0Pzgl66TfuCGHNE+sXLB64Ja5bXd41y23d5ww9nT91K0nN9x7nD2/aatDP+PSzRKVM1aOdn5lYvTM9rRmyRtFzdjd+uVaFM6WCpE5W8pE5GwpEtLZkhShs6VQ+PoLB96Sj2HosaEXBn0q6CeBfs/adVPdNga3Jc+mLQkVA6wMcQXwaCqAXOmVR0PpZYu+/DAUfei4wQ466IjFDneorcAaGqyVgpo4rH3EGlesZcaadXBMwAYUcDQChzKLcfALHjIc96F4z0sAAAAASUVORK5CYII=') no-repeat;
background-size: 100% 100%;
border-radius: 100%;
}
.home_icon {
background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAAAAAAfl4auAAACjUlEQVRIx62Xz0sbQRTH5/98bKxpCpYtlWIgCXWFeAluK1EasAQCUqiXYgSDhx68aLAiRJtcpEUF0dJDN8HDdmWbZL89bH7s7M5skk6/p53vvA8sM2/evGEQymlUSzk9lUik9Fyp2nDEUUzgtWuGRpw0o9aeCm4VQuSAL7Qmwk2DpDKasbC1QbHasORwPUkTlKxLYLdMU6jsimA7T1Mpb0fhToamVKYThu2pWaKMzcNunmZQ3uXgMs2kchCu04yqj2FLsr/Zu7usZL+tESzJqy0XcLckuTaEm8LpuUMPZ2fwDueE080BLDwLi9fo7RDt9HC9KDwlPtwSza3ZeFglIlp9gL0mimgBDCgIZvb6uNT9T/0S/T1BSAFgaEfP/kIL3sHI1g48tBai1aENhlrEXrHgFING0YG1EgmrgUWXa7uL2yXeWrpFdzu6ZMwJ/XXyBDieDwfOHwMnoVTSHNbgnfQ9/lREi1vp4S7NWw1W5cabj8BHcU5dA4+bnFNlpeBw34OLihi+wk94+0GnxHLBodPfPZXD67t9J+jkmB4cLhsUA78lYzno6CwViomFeaVY4t/hhBqs9Nt6DPwk+yoO1vmt4uDnRy7Q+SCHc3ySBOEXv+B1bOBICpdC6RmAz3H/mqjSxTsZXA0fjBH80uumiYg+4ZsMbkSO5BAu4rtfCPFbAmtOpBgM4S18JSKip+hKYCNahqaHa9ECOITf4yIe1trR0nuKz6ZpmubBGDZN0zTNHyG4ICj6X0ZNg78P8+MW5I2g6PNLtnZ14+tq3TcOB+Ob82eC60Zy0U1Qc8IVG9vOTbzcY5o56/+0FWoNjVorpdTEqbWPao2rWsus1qwrPhPUHiiKTyPFR9kMz8G/v1mIKuFxp8YAAAAASUVORK5CYII=') no-repeat;
background-size: 100% 100%;
margin-right: 20rpx;
border-radius: 100%;
}
.collection_icon {
background:url('data:image/jpeg;base64,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') no-repeat;
background-size: 100% 100%;
border-radius: 100%;
}
.uncollection_icon {
background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAAAAAAfl4auAAAC6ElEQVRIx6VXz0tqURA+/+eoSQkuDKIoyoWYbYQKyrIIixZh4creSyITIjIFCVx4N6HQpjaSPxBS8de931uovXuPc824s7oz53yXc+bMfDMjwEo7Hw97PS6Hw+XxhuP5Nr9LMLZawmcng9h9idpMYCUoIUf4oPIjuOAjU/EVpoKr+zRV9qvm4Mw8/SDzGRNwN0IzSKTLgZsBmkkCzUlwfZ1mlPW6DG7OjCVabxrB3QD9QgJdAzhCv5KIHpyhX0rmP7jKv68j2W4nHfx7V7/BJnH1FwD+mMTaGFzg190dhELouPnVwghskgtxFImKiJtkyRCsmITxF3aJdvFlEvAKIIAgvxjFBxHRB6L8ehAQqNl5V9dxRER0hDrvcHsNAgn+x6f4tBER2T5xyu9IQJi4y1bG+fDrHGWbictEmzn1gv8ki8bcUJlrIHviX2DO3RZ5g8G5E30oNjQA6nfk7KsAtEbxIbrjNGzOC8Mzrg05alBRErrb+BJKZTDkuDVDIIiwXn1F5enqYINxr2Pj4Oqpgle9LSy8erWHxWm5tIieXvUKj16t4XIa+BI1veoRLr16Bu3MHHumwbDqEsb7XUM1JZWIimujHyQw3UA95rHHKm4kJxqPTUS3UMMcNqziVjK5jA4jIkpiEJrEhgZIyjaP8amIiCiFvl+2+ftITWz0CuaMz8jJphyemZsIhmVCKMmmEpirxKXEGHFIWjalOT7Jcyn5OBlnl3jkUpIhgzfsyaY9vHFkwNBQC8uyaRktloYmCHARnTEXbW2NGagzkW/2Gke923gfUUgZKI8I5R3bHPVOkP4FskREgRLQaAClABFRFhcs6csuu0eMaPVFQyvmdMZa0F5WiWK4Z8uNXOjukF5K9dFPuomI3Mk++qmlNO74QieV2E0VgJZbGesrOQ2AusmXWLm4H1Z7iiE1/EqvemhW3C21FdYaGmutlKUmzlr7aK1xtdYyW2vWLY4J1gYUi6ORxaHsF+PgPyIWgG2yq3F6AAAAAElFTkSuQmCC') no-repeat;
background-size: 100% 100%;
border-radius: 100%;
}
}
.bg_show{
background-color: #f8f8f8;
}
.img_swiper {
width: 750rpx;
height: 716rpx;
background: #fff;
.img_item {
max-width: 100%;
max-height: 100%;
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
width: auto;
height: auto;
}
}
.goods_info {
width: 100%;
height: 210rpx;
padding: 24rpx;
box-sizing: border-box;
background: #fff;
.goods_info_flex {
display: flex;
justify-content: space-between;
align-items: center;
.symbol {
height: 42rpx;
line-height: 42rpx;
font-size: 30rpx;
}
.goods_price {
height: 60rpx;
line-height: 60rpx;
font-size: 44rpx;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
}
.goods_label {
width: 88rpx;
height: 40rpx;
line-height: 40rpx;
background:rgba(234,218,191,1);
border-radius:20rpx;
font-size: 22rpx;
color: #464646;
text-align: center;
display: inline-block;
position: relative;
bottom: 6rpx;
margin-left: 10rpx;
}
.sales_num {
color: #7C7C7C;
height: 34rpx;
line-height: 34rpx;
font-size: 24rpx;
}
}
.goods_name {
height: 42rpx;
line-height: 42rpx;
font-size: 30rpx;
font-family: PingFangSC-Medium,PingFang SC;
font-weight: 500;
margin-top: 16rpx;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.goods_subname {
color: #979797;
font-size: 26rpx;
height: 36rpx;
line-height: 36rpx;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-top: 8rpx;
}
}
.freight {
margin-top: 20rpx;
}
.common_item_bar {
padding: 24rpx;
width: 100%;
box-sizing: border-box;
height: 84rpx;
display: flex;
justify-content: space-between;
align-items: center;
background: #fff;
position: relative;
}
.common_item_bar:after {
width: 650rpx;
height: 1px;
background-color: #ECECEC;
position: absolute;
right: 0;
bottom: 0;
content: '';
}
.info_commom_title {
height:36rpx;
line-height: 36rpx;
font-size:26rpx;
font-family:PingFangSC-Medium,PingFang SC;
margin-right: 24rpx;
color: #212121;
}
.info_common_con {
height:36rpx;
font-size:26rpx;
color: #464646;
margin-right: 26rpx;
}
.info_common_label {
height:40rpx;
line-height: 40rpx;
background:rgba(254,244,232,1);
border-radius:8rpx;
padding: 0 12rpx;
display: inline-block;
color: #AE8A57;
font-size: 26rpx;
}
.info_common_label2 {
height: 30rpx;
line-height: 30rpx;
font-size: 22rpx;
margin-right: 20rpx;
}
.info_operation {
color: #AEAEAE;
font-size: 26rpx;
text {
vertical-align: middle;
}
}
.right_arrow_icon {
display: inline-block;
width: 24rpx;
height: 24rpx;
background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAAElBMVEVubm59fX1/f3+BgYHq6ur/////jxb0AAAAPklEQVQY02MIRQIMZHKCVZA4QYyuCE6IgAiSHkeoFEMokhTENKgUhBMioIqDg6wMxQBko1EsRXEOikMp8jYAjsJZhd56tsAAAAAASUVORK5CYII=') no-repeat;
background-size: 100% 100%;
}
.title_label {
height:44rpx;
line-height: 44rpx;
font-size:32rpx;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
background: #fff;
padding: 36rpx 0 36rpx 24rpx;
}
.installment_table_box {
padding: 0 28rpx 40rpx;
background: #fff;
.installment_table {
background: #FBFBFB;
border-radius:16rpx;
border:1px solid rgba(236,236,236,1);
padding: 40rpx 40rpx 16rpx;
display: flex;
overflow: scroll;
.table_title {
margin-right: 20rpx;
min-width: 160rpx;
view {
height:36rpx;
line-height: 36rpx;
font-size:26rpx;
color: #7C7C7C;
margin-bottom: 24rpx;
}
}
.table_item {
border-right: 1px solid #DCDCDC;
view {
height:34rpx;
line-height: 34rpx;
font-size:24rpx;
color: #464646;
margin-bottom: 26rpx;
min-width: 120rpx;
padding: 0 10rpx;
text-align: center;
}
}
.table_item:last-child {
border-right: none;
}
}
}
.entry_shop {
display: flex;
justify-content: space-between;
align-items: center;
border-radius: 16rpx;
background: #fff;
width: 750rpx;
height: 120rpx;
padding: 24rpx;
box-sizing: border-box;
color: #212121;
margin-top: 20rpx;
.shop_logo {
width: 72rpx;
height: 72rpx;
vertical-align: middle;
margin-right: 20rpx;
}
.dlb_box {
.shop_name {
height: 42rpx;
line-height: 42rpx;
font-size: 30rpx;
font-family: PingFangSC-Medium,PingFang SC;
font-weight: 500;
margin-bottom: 2rpx;
}
.focus_num {
height: 28rpx;
line-height: 28rpx;
font-size: 20rpx;
}
}
.focus_shop {
width: 124rpx;
height: 52rpx;
line-height: 52rpx;
text-align: center;
background-color: #FFCD00;
border-radius: 16rpx;
font-size: 24rpx;
display: block;
}
}
.shop_goods::-webkit-scrollbar {
display: none;
}
.shop_goods {
display: flex;
justify-content: flex-start;
padding: 40rpx 24rpx 24rpx;
background: #FFFFFF;
overflow: scroll;
.shop_goods_item {
width: 160rpx;
margin-right: 20rpx;
image {
width: 120rpx;
height: 120rpx;
margin: 0 auto 16rpx;
display: block;
}
.shop_goods_name {
color: #464646;
font-size: 24rpx;
height: 34rpx;
line-height: 34rpx;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
text-align: center;
margin-bottom: 10rpx;
}
.shop_goods_price {
height: 36rpx;
line-height: 36rpx;
width: 100%;
text-align: center;
font-size: 26rpx;
font-family: PingFangSC-Medium,PingFang SC;
font-weight: 500;
text-align: center;
}
}
.shop_goods_item:last-child {
margin-right: 0;
}
}
.goods_info_bottom_bar {
width: 100%;
height: 100rpx;
background-color: #fff;
padding: 0 24rpx;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: space-between;
position: fixed;
bottom: 0;
left: 0;
.bottom_bar_tool {
width: 72rpx;
text-align: center;
.tool_title {
color: #6E6E6E;
font-size: 18rpx;
line-height: 26rpx;
}
}
.tool {
width: 48rpx;
height: 48rpx;
margin: 0 auto 2rpx;
}
.contact_tool {
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAAAAAByaaZbAAACBklEQVRIx+3Vy0sVcRTAcf+V7/gA9ZpFhYkJvSZRNwWFlRomtjCQoIgasDJz0Y1LcL0bb5nlIhSMe6lWRbjRopRC6WEKRbnxUVgIkZTjaTFzq/nd34y3luHZDed8GOb3O3NOlvxlZK0BN94nu2KxeHI6MzBkFeNGsTW8KnhYgScqBwPBfAMARnmddbapPBuAxk/+4PkGgPrEV+fxW6IRYOOYH3icCxyc+jP9pg7Ie6oHEwWQ3a9+5HUDCid1YK4UCkfTz3G4AMo+asARyBnRnfxoDjSlgwdAv/5ybwGDaWA31Pq1Qy1UqWAImPQDE8ATBZyGBtsP2PXQqoAigJJeXXnPZoD1XvDBbZ2T6fXH3dSMBwykmk3tNbmfyiQ9oAvWvVrYBydU0AI1X16E4JoHRKFNpA8qVbALBkQsiKkgIpIAUwXb4K5IB3T+j+CyyG0N2A53RC6oIA6mLefgsKZT22V5h3oPU8CWKuCGCrqB6hLgnbf5Tjn3b35XwdJOJ3NG6Va71QBqZkXEjptFoVBoa8dn51/PB4zzmiHQ1/tSRGRlf6rdyuZFRCwgMhcwW7t/z8ljIq8PAEcDh3E1ND8bHx+7ArnhCoC9S4GgFO6JiCym3tPyI3jcN8Omi+HwJdMp3/Notf0wYvz6hkORnpkMNlAiz61vz3RlLdzsjEajV9+uLfZ/Bj8BX6KDetsz+VEAAAAASUVORK5CYII=') no-repeat;
background-size: 100% 100%;
}
.shop_tool {
background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAAAAAByaaZbAAABp0lEQVRIx+3Vz0sUcRjHcf+V97qiuZs/8MdFrSSNDuJBw0MJithBPFmXyAQ7mmguqKiFIN3cLYQEPawsYjriYXVvHepihRCLsESgMPZ4mN0VvvN8A0Vv+5w+h+9rhnmeZ2aK5JJVVACXA4dddXrVD52pYBhrxVRQZQfPNLAPLH9SahhCGohAi/qYmQB8UUArTOmNaYM3fpAGkjqYhSY/WIJKS+u/Aj99oB9e2oZVB+9N4JbCig28hscmWIPgqQ2sQ/DEAKP5izgVnX+8tBdu/J6/fdQAIZj20n2Y8dJAvtF98NYAd2HeS+F815vhhZd6IGKAEWh1RUQ2gIrfIiKbQMk3EZGDAKwawAF60yLx2wAPUiIrYYCGbZF4LdS65hyeAsF7Nbn9DJXm0q0ygDXf4P52ZA8Eos+zqfjjWE4tKMvnTpYDtO+JfG4GirtTIok2IPBoV3+n/21+iB168Sixkx3G8dZ25po+As7DUcuZdN+THwq4A44OpmFMAdUXwzFqCl4VwBVBEzR0qlUJ4wqY4D/laNs6aD1esqgvX/LdnFpLvwq/3ZsG53VVe7nay4EpAAAAAElFTkSuQmCC') no-repeat;
background-size: 100% 100%;
}
.cart_tool {
background: url('data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAAXNSR0IArs4c6QAABQ5JREFUaAXtmEtoY2UUgPuYJk1bUCipoLFM2sQ6dpSBgFKluFAXs7DqxkHxgbhS8IHiRmdRR0FwREQZKIOoiy4EV74GHVwEwYUupD5qQk3TQQdLK0Odaottk9TvXO653NxX7o0pUzEX/p7zn/c5//kfaUdH+2tXoF2BdgXaFfg/V6BzPyU/Ojp6eHd391ViGtK4mJe7u7ufKZVK55Vmhwfsk0uNE+xLjKOOOHK1Wu1HaCccdGPa5UW8hLTrPXwvdXV1fexBN0j7poVyuVzP2traJitwoLOz84dyuXyDX9B2+r5ZAYJPS/BmcCV7kEG4KrhkMplMqlqtvkY1ki5m84Rz8Xj8eKFQWPYwkbHRfrbhgahvAgT/JJrHqEqggajMra2tX9GZ9tDLKg2foRMIaqGLarBVkNVcZZz1sWclwLEZOgHfFcBR0Vb9kxh92cdxaHIqldrM5/MVLwV8tTYBjq4CbaS+DnKRrOukWYiNIFVNYLNYLC5TwCBZi+fbQmw28WZkgLFDlsYeIOPj4zHMDotpfJUYoTeebwLz8/PbGCqb8Wanp6ddslz9Q+l0+sORkZEzcmqZsh3QJqF9xThl12P+NONrxiMqK7BSqaQB3SYtdP+LvCso04gB6MuCIMD47OysOKn7uOKfgDAF/yj4s8ok8deh3cx4HL07hE6CSeZCv5HpjFxcKr+zs6PtI6TWJUAgRXVCgNcqrpB9crniQE+cgA068DJkjMYGj3Fx9dl09yYBHFgJkMxe7gMrAZJr3QpQYSsBDLtWwFbBf4taCfT29gYeVU5HgXtgYGDA2AOmkisBktq0GfTEkdkQmVgsZkBTvkpx/lZdZDKCs8p/+TwzVNQFAxOYm5v7A6MrooUTVwsRxGn438MugJ+yWT8B/hu8M8PDw18IXQJj/gZjFdkXuRO2hM7mjgOMIxQfkaov+samEsTv40jMw7tV+NzGQzj+XfBWfdls9hDH6E+mvQ+WlpbujWI7cAXEEBWz2oib2dVGUZx5yVJ1q/9ZmUgbWOw1TAAZayPjwNVGXkFFoVEUK4FmWsj3MadBEHRR30Q4eIFb9EHltQgexK6airwCDRPgArNaCEey2YwNpx5bCWnXhaj2GrYQv01/wfC7GK5FNR5BvoaPmcXFxdUIOoZow1NIDcpxl0wmGyas8lHg+vp6VR6PUXRUNnQCqmC+JB9gLpuvSOXeoXLvKz8I8nq9hZZ8DpkjDPld/ElfX9/JZoMXX5ES4E54D52HRdHxvcn5/ZSDVjdF91EIpxl1q0gBvkkkEpPNJqFv8DpnXhOqdzeb+BXl4Vj6td+c3zQ4OPglL8xzyrdD+a2A7qfQ5NaV7wJDcEnmKi6yGrp58MhfXTWCtAngLuUT/P1s7iuAjykN/pTiTgjvNmhGsujMoJvs6enJge+IrN22U7fRPHQCGEqpsf7+/s8E54FmQJN+tfI9oMUj6LOM3YWFhe+Qk30gt71l20M3kNTwHrBpy6PtdplvbGy8RVu8vb29be974Xt+BGjxqPZxDoI/EZwE1zvF4nsaCCCG3sQ4vQaHc9hKOO0R4EVu7MM89M47eTKXI5jT51v0r/PiQ5viEPD9B66PjkEO3UL0rdySD0mwDoMXoN3nF7zIytMZmWOMupuWeYXxfLPBi+3QKyDC8o2NjV3JqXEnaJaqFqn8R2Fv0ImJicTKyso9rMQRAl9G93OS06e0Yb/9p12BdgXaFfhvVeAf8lrWllSlNkQAAAAASUVORK5CYII=') no-repeat;
background-size: 100% 100%;
}
.bottom_btn {
width: 452rpx;
height: 68rpx;
line-height: 68rpx;
text-align: center;
border-radius: 8rpx;
font-size: 28rpx;
}
.join_cart {
color: #fff;
background-color: #000;
margin-left: 12rpx;
}
.join_buy {
color: #483E2E;
background-color: #EADABF;
font-weight: 500;
font-family: PingFangSC-Medium,PingFang SC;
}
}
.poupp_content {
border-radius:24px 24px 0px 0px;
background-color: #fff;
padding: 40rpx 0 20rpx;
color: #212121;
position: relative;
.close {
width: 28rpx;
height: 28rpx;
position: absolute;
right: 48rpx;
top: 26rpx;
color: #212121;
}
.poupp_flex {
display: flex;
padding-bottom: 40rpx;
border-bottom: 1px solid #ececec;
.poupp_img {
width: 180rpx;
height: 180rpx;
margin-right: 20rpx;
}
.poupp_goods_name {
width: 440rpx;
height: 40rpx;
line-height: 40rpx;
font-size: 28rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-bottom: 10rpx;
}
.poupp_goods_price {
color: #000;
font-size: 40rpx;
line-height: 56rpx;
.symbol {
font-size: 28rpx;
line-height: 40rpx;
}
.poupp_label {
display: inline-block;
height: 40rpx;
line-height: 40rpx;
background-color: #EADABF;
padding: 0 12rpx;
color: #483E2E;
font-size: 22rpx;
margin-left: 6rpx;
border-radius: 20rpx;
position: relative;
bottom: 6rpx;
}
}
}
.poupp_nper {
margin-top: 38rpx;
font-size: 26rpx;
text {
height: 40rpx;
line-height: 40rpx;
vertical-align: middle;
}
.limit_free {
padding: 0 12rpx;
border-radius: 8rpx;
margin-left: 20rpx;
color: #AE8A57;
border: 1px solid #CFAE7F;
background-color: #FEF4E8;
}
}
.poupp_nper_box {
margin-top: 22rpx;
display: flex;
flex-wrap: wrap;
text {
width: 122rpx;
height: 56rpx;
line-height: 56rpx;
border-radius: 28rpx;
text-align: center;
border: 1px solid #DCDCDC;
color: #483E2E;
font-size: 26rpx;
margin-right: 20rpx;
}
.act {
border-color: #000000;
}
}
.poupp_deposit {
height: 80rpx;
background-color: #F8F8F8;
padding: 22rpx 32rpx;
box-sizing: border-box;
display: flex;
justify-content: space-between;
font-size: 28rpx;
color: #464646;
border-radius: 16rpx;
margin-top: 40rpx;
}
.poupp_nper_detail {
padding: 36rpx 32rpx;
background-color: #F8F8F8;
border-radius: 16rpx;
margin-top: 24rpx;
view {
display: flex;
justify-content: space-between;
color: #464646;
font-size: 26rpx;
}
view:nth-of-type(2) {
margin-top: 26rpx;
}
}
.poupp_tips {
width:100%;
height:60rpx;
line-height: 60rpx;
background:rgba(252,248,240,1);
border-radius:8rpx;
color: #A79981;
font-size: 24rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding: 0 14rpx 0 24rpx;
box-sizing: border-box;
margin-top: 172rpx;
}
.poupp_btn {
width: 702rpx;
height: 80rpx;
line-height: 80rpx;
text-align: center;
border-radius: 16rpx;
background-color: #EADABF;
font-size: 28rpx;
margin: 20rpx auto 0;
}
.profile {
color: #BDBDBD;
font-size: 26rpx;
height: 36rpx;
line-height: 36rpx;
margin-top: 24rpx;
}
}
.no_data {
font-size: 32rpx;
padding: 24rpx;
}
.sales_box {
display: flex;
align-items: center;
margin-top: 20rpx;
.sales_name, .sales_input {
font-size: 26rpx;
}
.sales_input {
padding-left: 16rpx;
}
}
</style>