703 lines
20 KiB
Vue
703 lines
20 KiB
Vue
<template>
|
|
<view class="head-container" :style="{
|
|
backgroundImage:
|
|
provinceCode === '530000'
|
|
? 'url(https://eshangtech.com/minTestImg/530000bg.png)'
|
|
: '',
|
|
}">
|
|
<div class="new-content">
|
|
<div class="header-card">
|
|
<image :src="'/static/images/revenue/' + provinceCode + '.png'" mode="aspectFit" class="head-log" :style="provinceCode !== 340000 ? 'width: 160rpx;height: 160rpx;' : ''
|
|
"></image>
|
|
<view class="head-cost-text uni-flex ai-center" :style="{ color: provinceCode === '530000' ? '#1D383E' : '' }">
|
|
实时营收
|
|
<div class="date-tag" :style="{
|
|
background: provinceCode === '530000' ? '#FFFFFF' : '',
|
|
color: provinceCode === '530000' ? '#3C6B76' : '',
|
|
}">
|
|
<image class="tagBefore" :src="provinceCode === '530000'
|
|
? '/static/images/revenue/dateIcon530000.png'
|
|
: '/static/images/revenue/date-ico.png'
|
|
" />
|
|
<span>{{ nowDay }} 星期{{ getWeekDay() }}</span>
|
|
</div>
|
|
</view>
|
|
<div class="uni-flex ai-base jc-center top-number">
|
|
<text class="top-number-amount" :style="{
|
|
backgroundImage:
|
|
provinceCode === '530000'
|
|
? '-webkit-linear-gradient(bottom, #1D383E 0%, #1D383E 100%)'
|
|
: '',
|
|
}">{{ today.timeMoney || "0.00" }}</text>
|
|
<span class="top-number-unit" :style="{
|
|
color: provinceCode === '530000' ? '#1D383E' : '',
|
|
}">(元)</span>
|
|
</div>
|
|
|
|
<p class="header-today-info">
|
|
<span style="margin-right: 12rpx" :style="{
|
|
color: provinceCode === '530000' ? '#1D383E' : '',
|
|
}">客单交易</span>
|
|
<text :style="{
|
|
color: provinceCode === '530000' ? '#1D383E' : '',
|
|
}">{{ today.totalTicketCount || 0 }}</text>
|
|
<span style="font-size: 22rpx" :style="{
|
|
color: provinceCode === '530000' ? '#1D383E' : '',
|
|
}">(单)</span>
|
|
<span class="ml-135 fs12" style="margin-right: 12rpx" :style="{
|
|
color: provinceCode === '530000' ? '#1D383E' : '',
|
|
}">客单均价</span>
|
|
<text :style="{
|
|
color: provinceCode === '530000' ? '#1D383E' : '',
|
|
}">{{ today.avrticketCount || "0.00" }}</text>
|
|
<span style="font-size: 22rpx" :style="{
|
|
color: provinceCode === '530000' ? '#1D383E' : '',
|
|
}">(元)</span>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<template v-if="headMsg.cashPay">
|
|
<view class="revenue-card-cont" :style="{
|
|
background: provinceCode === '530000' ? '#fff' : '',
|
|
}">
|
|
<div class="top-revenue-card">
|
|
<div class="uni-flex jc-between header-date ai-center">
|
|
<div class="revenue-card-title">对客营收</div>
|
|
<picker mode="date" @change="bindDateChange" :end="{ lastDay }" start="2019-12-01" :value="selectDate"
|
|
:style="{
|
|
background: provinceCode === '530000' ? '#E3F2EE' : '',
|
|
color: provinceCode === '530000' ? '#36945C' : '',
|
|
}">
|
|
<text :class="provinceCode === '530000'
|
|
? 'revenue-date530000'
|
|
: 'revenue-date'
|
|
">{{ headMsg.dayOfShow }} 星期{{ getWeekDay(selectDate) }}</text>
|
|
</picker>
|
|
</div>
|
|
<div class="uni-flex ai-base jc-center center-amount">
|
|
<text class="revenue-alltime-amount" :style="{
|
|
backgroundImage:
|
|
provinceCode === '530000'
|
|
? '-webkit-linear-gradient(bottom, #1E9B4A 0%, #1E9B4A 100%);'
|
|
: '',
|
|
}">
|
|
{{ headMsg.totalMoneyShow }}
|
|
</text>
|
|
<span class="amount-unit" :style="{
|
|
backgroundImage:
|
|
provinceCode === '530000'
|
|
? '-webkit-linear-gradient(bottom, #1E9B4A 0%, #1E9B4A 100%);'
|
|
: '',
|
|
}">(元)</span>
|
|
</div>
|
|
</div>
|
|
<div class="uni-flex jc-between" v-if="provinceCode == 340000">
|
|
<div class="revenue-tag">
|
|
<span>计划营收</span>
|
|
<div class="amount">{{ headMsg.budgetamoutShow }}</div>
|
|
</div>
|
|
<div class="revenue-tag">
|
|
<span>相比计划</span>
|
|
<div :class="headMsg.budgetAmount < headMsg.cashPay
|
|
? 'up-text-title'
|
|
: 'down-text-title'
|
|
" :style="{
|
|
color: provinceCode === '530000' ? '#81AA51' : '',
|
|
}">
|
|
{{ $util.fmoney(headMsg.diffBudgetTotal) }}
|
|
<span :style="{
|
|
color: provinceCode === '530000' ? '#81AA51' : '',
|
|
fontSize: '24rpx',
|
|
marginLeft: '12rpx',
|
|
}">{{ headMsg.diffBili }}%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uni-flex jc-between" v-if="
|
|
provinceCode == 340000 &&
|
|
groupType == 1000 &&
|
|
headMsg.shareShopCount > 0
|
|
">
|
|
<div class="revenue-tag">
|
|
<div style="font-size: 24rpx; margin-top: 15rpx">
|
|
分润门店:
|
|
<span class="amount" style="font-size: 28rpx; padding-left: 0.5em">
|
|
{{ headMsg.shareShopCount }}个
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="revenue-tag">
|
|
<div style="font-size: 24rpx; margin-top: 15rpx">
|
|
驿达分润:
|
|
<span class="amount" style="font-size: 28rpx; padding-left: 0.5em">
|
|
{{ $util.fmoney(headMsg.royaltyPrice) }}元
|
|
</span>
|
|
</div>
|
|
<!-- <div style="font-size: 24rpx;">
|
|
累计分润
|
|
<span class="amount" style="font-size: 28rpx;padding-left: 0.5em;">272,109.93元</span>
|
|
</div> -->
|
|
</div>
|
|
</div>
|
|
<div class="uni-flex jc-between" v-if="
|
|
provinceCode == 340000 &&
|
|
groupType == 1000 &&
|
|
headMsg.deliverBillCount > 0
|
|
">
|
|
<div class="revenue-tag">
|
|
<div style="font-size: 24rpx; margin-top: 15rpx">
|
|
万佳配送订单:
|
|
<span class="amount" style="font-size: 28rpx; padding-left: 0.5em">
|
|
{{ headMsg.deliverBillCount }}单
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="revenue-tag">
|
|
<div style="font-size: 24rpx; margin-top: 15rpx">
|
|
采购金额:
|
|
<span class="amount" style="font-size: 28rpx; padding-left: 0.5em">
|
|
{{ $util.fmoney(headMsg.deliverPrice) }}元
|
|
</span>
|
|
</div>
|
|
<!-- <div style="font-size: 24rpx;">
|
|
累计分润
|
|
<span class="amount" style="font-size: 28rpx;padding-left: 0.5em;">272,109.93元</span>
|
|
</div> -->
|
|
</div>
|
|
</div>
|
|
<div class="view-bottom" @click="toggleCard">
|
|
<text class="uni-icon uni-icon-arrowup" :class="{ up: isup }"></text>
|
|
</div>
|
|
</view>
|
|
<div class="model-content" :class="{ hidden: isup }">
|
|
<!-- 营收数据总览 -->
|
|
<div class="uni-flex justify-around" style="padding-top: 18rpx" v-if="provinceCode == 620000">
|
|
<div class="check-unit">
|
|
<text>商超营收</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.scCashPay, 2) }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>商超门店</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.scCount }} <text>家</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>餐饮营收</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.cyCashPay, 2) }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>餐饮门店</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.cyCount }} <text>家</text>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uni-flex justify-around" :style="provinceCode == 620000 ? 'padding-top: 0rpx;' : 'padding-top:18rpx;'
|
|
">
|
|
<div class="check-unit">
|
|
<text>长款金额</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.diffMorePrice, 2) }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>短款金额</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.diffLessPrice, 2) }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>客单交易</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.ticketCount, 0) }} <text>笔</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>客单均价</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.tickave, 2) }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uni-flex justify-around mode-content" :style="provinceCode == 620000
|
|
? 'padding-top: 0rpx;'
|
|
: 'padding-bottom:24rpx;'
|
|
">
|
|
<div class="check-unit">
|
|
<text>优惠金额</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.totalOffAmount, 2) }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>移动支付</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.mobilePayment, 2) }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>商品出售</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.totalCount, 0) }} <text>件</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>商品均价</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.countave, 2) }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uni-flex justify-around mode-content" style="padding-bottom: 24rpx" v-if="provinceCode == 620000">
|
|
<div class="check-unit">
|
|
<text>通美</text>
|
|
<div class="check-price-color">
|
|
{{ $util.fmoney(headMsg.tmCrashPay, 2) }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit"></div>
|
|
<div class="check-unit"></div>
|
|
<div class="check-unit"></div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<template v-else>
|
|
<view class="revenue-card-cont">
|
|
<div class="top-revenue-card">
|
|
<div class="uni-flex jc-between header-date ai-center">
|
|
<div class="revenue-card-title">对客营收</div>
|
|
<picker mode="date" @change="bindDateChange" :end="{ lastDay }" start="2019-12-01" :value="selectDate">
|
|
<text class="revenue-date">{{ headMsg.dayOfShow }} 星期{{ getWeekDay(selectDate) }}</text>
|
|
</picker>
|
|
</div>
|
|
<div class="uni-flex ai-base jc-center center-amount">
|
|
<text class="revenue-alltime-amount">
|
|
{{ headMsg.totalMoneyShow }}
|
|
</text>
|
|
<span class="amount-unit">(元)</span>
|
|
</div>
|
|
</div>
|
|
<div class="uni-flex jc-between">
|
|
<div class="revenue-tag">
|
|
<span>计划营收</span>
|
|
<div class="amount">{{ headMsg.budgetamoutShow }}</div>
|
|
</div>
|
|
<div class="revenue-tag">
|
|
<span>相比计划</span>
|
|
<div :class="headMsg.BUDGETAMOUNT < headMsg.totalMoney
|
|
? 'up-text-title'
|
|
: 'down-text-title'
|
|
">
|
|
{{ $util.fmoney(headMsg.diffBudgetTotal) }}
|
|
<span style="font-size: 24rpx; margin-left: 12rpx">{{ headMsg.diffBili }}%</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="view-bottom" @click="toggleCard">
|
|
<text class="uni-icon uni-icon-arrowup" :class="{ up: isup }"></text>
|
|
</div>
|
|
</view>
|
|
<div class="model-content" :class="{ hidden: isup }">
|
|
<!-- 营收数据总览 -->
|
|
<div class="uni-flex justify-around" style="padding-top: 18rpx">
|
|
<div class="check-unit">
|
|
<text>长款金额</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.DIFFERENT_PRICE_MORE }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>短款金额</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.DIFFERENT_PRICE_LESS }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>客单交易</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.TICKETCOUNT }} <text>笔</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>客单均价</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.TICKETAVE }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="uni-flex justify-around mode-content" style="padding-bottom: 24rpx">
|
|
<div class="check-unit">
|
|
<text>优惠金额</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.TOTALOFFAMOUNT }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>移动支付</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.MOBILEPAYMENT }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>商品出售</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.COMMODITY_COUNT }} <text>件</text>
|
|
</div>
|
|
</div>
|
|
<div class="check-unit">
|
|
<text>商品均价</text>
|
|
<div class="check-price-color">
|
|
{{ headMsg.COMMODITYAVE }} <text>元</text>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
export default {
|
|
props: ['headMsg', 'today', 'lastDay', 'nowDay', 'isup', 'selectDate', 'provinceCode', 'groupType', 'currentMoney'],
|
|
|
|
methods: {
|
|
bindDateChange(e) {
|
|
this.$emit('bindDateChange', e)
|
|
},
|
|
toggleCard() {
|
|
this.$emit('toggle', this.isup)
|
|
},
|
|
getWeekDay(dayDate) {
|
|
|
|
let show_day = ['日', '一', '二', '三', '四', '五', '六']
|
|
let date = dayDate ? new Date(dayDate) : new Date();
|
|
let day = date.getDay()
|
|
return show_day[day]
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
|
|
|
|
.new-content {
|
|
color: #fff;
|
|
box-sizing: border-box;
|
|
padding-top: 40rpx;
|
|
}
|
|
|
|
.new-content .text-title {
|
|
flex: 1;
|
|
text-align: center;
|
|
font-weight: 600;
|
|
}
|
|
|
|
.new-content .header-card {
|
|
padding: 0 30rpx;
|
|
color: #bed4f4;
|
|
/* color: #FAD5D2; */
|
|
position: relative;
|
|
}
|
|
|
|
.head-cost-text {
|
|
color: #bed4f4;
|
|
/* color: #FAD5D2; */
|
|
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.head-cost-text .date-tag {
|
|
display: flex;
|
|
border-radius: 20rpx;
|
|
padding: 0 16rpx;
|
|
background: #6179bf;
|
|
color: #c6d1ed;
|
|
/* background: #ECB0A9; */
|
|
/* color: #AD332C; */
|
|
font-size: 22rpx;
|
|
margin-left: 16rpx;
|
|
align-items: center;
|
|
}
|
|
|
|
.tagBefore {
|
|
width: 20rpx;
|
|
height: 20rpx;
|
|
margin-right: 8rpx;
|
|
}
|
|
|
|
/* .date-tag::before {
|
|
content: "";
|
|
background: url(/static/images/revenue/date-ico.png) no-repeat center;
|
|
width: 21rpx;
|
|
height: 32rpx;
|
|
background-size: contain;
|
|
display: block;
|
|
margin-right: 8rpx;
|
|
} */
|
|
.head-log {
|
|
position: absolute;
|
|
right: 19rpx;
|
|
top: -4rpx;
|
|
width: 125rpx;
|
|
height: 91rpx;
|
|
}
|
|
|
|
.new-content .top-number {
|
|
padding-top: 16rpx;
|
|
padding-bottom: 16rpx;
|
|
padding-left: 4rpx;
|
|
letter-spacing: 2rpx;
|
|
line-height: 1.1;
|
|
transition: all 1s;
|
|
}
|
|
|
|
.new-content .top-number-unit {
|
|
font-size: 24rpx;
|
|
font-weight: 600;
|
|
line-height: 72rpx;
|
|
text-align: left;
|
|
font-family: "Bahnschrift Regular";
|
|
}
|
|
|
|
.new-content .top-number-amount {
|
|
background-image: -webkit-linear-gradient(top,
|
|
#ffffff 40%,
|
|
#b3c1e7 100%);
|
|
/*#f8b8b1 100%); */
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
font-size: 76rpx;
|
|
font-family: "Bahnschrift Regular";
|
|
}
|
|
|
|
.new-content p.header-today-info {
|
|
font-size: 24rpx;
|
|
position: relative;
|
|
z-index: 2;
|
|
}
|
|
|
|
.new-content .header-today-info text {
|
|
font-family: "Bahnschrift Regular";
|
|
font-size: 30rpx;
|
|
}
|
|
|
|
.ml-135 {
|
|
margin-left: 135rpx;
|
|
}
|
|
|
|
.heade-text {
|
|
text-align: right;
|
|
line-height: 1;
|
|
letter-spacing: 0;
|
|
color: #bed4f4;
|
|
/* color: #FAD5D2; */
|
|
font-family: "Bahnschrift Regular";
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.header-date {
|
|
padding: 25rpx 0 16rpx 24rpx;
|
|
/* background: linear-gradient( to left,#ffffff 0%, #e3e8fd 100%); */
|
|
margin-bottom: 16rpx;
|
|
}
|
|
|
|
.header-date picker {
|
|
color: #fff;
|
|
padding: 2rpx 46rpx 0rpx 20rpx;
|
|
position: relative;
|
|
/* width: 180rpx; */
|
|
border-radius: 24rpx 0px 0px 25rpx;
|
|
background: #8994b8;
|
|
font-size: 26rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.header-date picker .revenue-date:before {
|
|
content: "";
|
|
position: absolute;
|
|
width: 0rpx;
|
|
height: 0rpx;
|
|
border: 0rpx;
|
|
border-left: 12rpx solid transparent;
|
|
border-right: 12rpx solid transparent;
|
|
border-top: 12rpx solid #fff;
|
|
right: 16rpx;
|
|
top: 20rpx;
|
|
display: block;
|
|
border-radius: 6rpx;
|
|
}
|
|
|
|
.header-date picker .revenue-date530000:before {
|
|
content: "";
|
|
position: absolute;
|
|
width: 0rpx;
|
|
height: 0rpx;
|
|
border: 0rpx;
|
|
border-left: 12rpx solid transparent;
|
|
border-right: 12rpx solid transparent;
|
|
border-top: 12rpx solid #36945c;
|
|
right: 16rpx;
|
|
top: 20rpx;
|
|
display: block;
|
|
border-radius: 6rpx;
|
|
}
|
|
|
|
.revenue-card-cont {
|
|
border-radius: 12rpx;
|
|
margin: 38rpx 32rpx 0 32rpx;
|
|
overflow: hidden;
|
|
box-shadow: 1rpx 2rpx 8rpx 0px rgba(224, 224, 224, 0.4);
|
|
background: linear-gradient(to top, #ffffff 0%, #ffffff 51%, #e5e9fc 100%);
|
|
/*#fbebe7 100%);*/
|
|
}
|
|
|
|
.revenue-card-title {
|
|
font-weight: 500;
|
|
text-align: left;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.center-amount,
|
|
.revenue-alltime-amount {
|
|
background-image: -webkit-linear-gradient(bottom, #e4a061 0%, #e3b890 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
justify-content: center;
|
|
}
|
|
|
|
.amount-unit {
|
|
background-image: -webkit-linear-gradient(bottom, #e4a061 0%, #e3b890 100%);
|
|
-webkit-background-clip: text;
|
|
-webkit-text-fill-color: transparent;
|
|
font-size: 26rpx;
|
|
}
|
|
|
|
.revenue-alltime-amount {
|
|
font-size: 86rpx;
|
|
font-family: "Bahnschrift Regular";
|
|
font-weight: 400;
|
|
text-align: center;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.revenue-tag {
|
|
color: #7e7e7e;
|
|
margin-top: 20rpx;
|
|
text-align: center;
|
|
flex: 1;
|
|
font-size: 24rpx;
|
|
position: relative;
|
|
}
|
|
|
|
.revenue-tag+.revenue-tag::before {
|
|
content: "";
|
|
display: inline-block;
|
|
width: 2rpx;
|
|
height: 66rpx;
|
|
background: #ededed;
|
|
position: absolute;
|
|
left: 0;
|
|
top: 8rpx;
|
|
}
|
|
|
|
.revenue-tag .amount {
|
|
color: #252525;
|
|
}
|
|
|
|
.up-text-title {
|
|
color: #6eb92b;
|
|
}
|
|
|
|
.up-text-title::before {
|
|
content: "+";
|
|
}
|
|
|
|
.up-text-title:after {
|
|
content: "";
|
|
margin-left: 4rpx;
|
|
width: 16rpx;
|
|
height: 18rpx;
|
|
display: inline-block;
|
|
background: url("/static/images/revenue/up-arrow.png") no-repeat center;
|
|
background-size: contain;
|
|
}
|
|
|
|
.down-text-title {
|
|
color: #ee3e3e;
|
|
}
|
|
|
|
.down-text-title::before {
|
|
content: "-";
|
|
}
|
|
|
|
.down-text-title:after {
|
|
content: "";
|
|
margin-left: 4rpx;
|
|
width: 16rpx;
|
|
height: 18rpx;
|
|
display: inline-block;
|
|
background: url("/static/images/revenue/down-arrow.png") no-repeat center;
|
|
background-size: contain;
|
|
}
|
|
|
|
.check-unit {
|
|
font-size: 24rpx;
|
|
|
|
flex: 1;
|
|
text-align: center;
|
|
padding-top: 16rpx;
|
|
}
|
|
|
|
.check-price-color {
|
|
font-size: 32rpx;
|
|
color: #868686;
|
|
line-height: 1.2;
|
|
font-family: "Bahnschrift Regular";
|
|
}
|
|
|
|
.check-price-color text {
|
|
font-size: 22rpx;
|
|
}
|
|
|
|
.view-bottom {
|
|
transition: 0.2s all;
|
|
text-align: center;
|
|
height: 70rpx;
|
|
width: 700rpx;
|
|
margin: 0 auto;
|
|
background-color: #fff;
|
|
line-height: 70rpx;
|
|
}
|
|
|
|
.uni-icon-arrowup {
|
|
color: #5ea9e9;
|
|
font-size: 28rpx;
|
|
transition: all 0.25s;
|
|
}
|
|
|
|
.up {
|
|
transform: rotate(-180deg);
|
|
}
|
|
|
|
.model-content {
|
|
/* max-height: 236rpx; */
|
|
transition: height 0.25s;
|
|
background-color: #f9f9f9;
|
|
box-sizing: border-box;
|
|
margin: 0 20rpx 8px 20rpx;
|
|
border-radius: 0 0 12rpx 12rpx;
|
|
}
|
|
|
|
.hidden {
|
|
/* padding-top: 0rpx; */
|
|
max-height: 0;
|
|
overflow: hidden;
|
|
transition: max-height 0.25s;
|
|
}
|
|
</style>
|