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.
936 lines
22 KiB
936 lines
22 KiB
<template> |
|
<view class="details_body"> |
|
<cu-custom class="main-totextbar bg-main-oil" :isBack="true" bgColor="bg-main-oil"> |
|
<block slot="backText">返回</block> |
|
<block slot="content">评估报告</block> |
|
</cu-custom> |
|
<view class="details_container_bg"></view> |
|
<view class="details_container"> |
|
<seleBar moveBackground='rgba(255, 103, 0, 0.7);' @seleBarFn='seleBarFn' :seleBarData='seleBarData' /> |
|
<swiper :current="current" class="details_swiper" circular> |
|
<swiper-item v-if="scoreData" @touchmove.stop class="swiper_item"> |
|
<view class="fractionCar flex column"> |
|
<view class="fractionCar_top flex"> |
|
<view class="fractionCar_top_left"> |
|
<view class="fractionCar_plateNumber"> |
|
{{ formatCarNumber(scoreData.platenumOrVinnum,0) }}</view> |
|
<view class="fractionCar_time smallText flex ac"> |
|
{{scoreData.queryDate}} |
|
<view class="estimate_plate"> 近{{scoreData.statype}}个月</view> |
|
<br /> |
|
</view> |
|
<view class="smallText"> |
|
评估时间 {{scoreData.createTime}} |
|
</view> |
|
</view> |
|
<view class="fractionCar_top_right"> |
|
<view class="fractionCar_top_right_label"> {{displayChange?'综合等级':'综合分数'}}</view> |
|
<view @click="displayChange=true" v-if="!displayChange" |
|
class="fractionCar_top_right_rank"> |
|
{{scoreData.rate?Number((scoreData.rate)*100).toFixed(1).split('.')[0]:'-'}} |
|
<text style="color: #FF6700;" |
|
class="smallText ">.{{scoreData.rate?(Number(scoreData.rate)*100).toFixed(1).split('.')[1]:'-'}}</text> |
|
</view> |
|
<view @click="displayChange=false" v-else class="fractionCar_top_right_rank"> |
|
{{displayChangeFn(Number(scoreData.rate)*100)}} |
|
</view> |
|
</view> |
|
</view> |
|
<view class="fractionCar_footer flex"> |
|
<view v-for="(item,index) in footerList" :key='index' |
|
class="fractionCar_footer_item flex column"> |
|
<view class="fractionCar_footer_item_label">{{item.label}}</view> |
|
<view class="fractionCar_footer_item_value flex ac jc"> |
|
前 <text class="subjectColor"><text style="margin-left: 10rpx;" class="bigText "> |
|
{{ scoreData[item.field]?Number(scoreData[item.field]).toFixed(2).split('.')[0]:'0' }}</text> |
|
.{{ scoreData[item.field]?Number(scoreData[item.field]).toFixed(2).split('.')[1]:'00' }} |
|
% |
|
<!-- .6% --> |
|
</text> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="voitureCar flex"> |
|
<view class="voitureCar_item"> |
|
<view class="voitureCar_item_label labelColor">车辆类型</view> |
|
<view class="voitureCar_item_value subjectColor">{{scoreData.f12}}</view> |
|
</view> |
|
<view class="voitureCar_item"> |
|
<view class="voitureCar_item_label labelColor">车辆评分基础</view> |
|
<view class="voitureCar_item_value subjectColor">{{scoreData.esc||'---'}}</view> |
|
</view> |
|
</view> |
|
<view class="detailsCar flex"> |
|
<view v-for="(item,index) in detailsList" :key='index' class="detailsCar_item"> |
|
<view class="detailsCar_item_label labelColor">{{item.label}}</view> |
|
<view class="detailsCar_item_value subjectColor"> <text |
|
class="bigText">{{Number(scoreData[item.field]).toFixed(1)}}</text> {{item.unit}} |
|
</view> |
|
</view> |
|
</view> |
|
</swiper-item> |
|
<swiper-item v-if="proposal" @touchmove.stop class="swiper_item flex column"> |
|
<view class="fractionCar flex column"> |
|
<view class="fractionCar_top flex"> |
|
<view class="fractionCar_top_left"> |
|
<view class="fractionCar_plateNumber"> |
|
{{ formatCarNumber(proposal.homeRiskVo.platenumOrVinnum,0)}}</view> |
|
<view class="fractionCar_time smallText flex ac"> |
|
{{proposal.homeRiskVo.safeinfoQueryDate}} |
|
<view class="estimate_plate"> 近{{proposal.homeRiskVo.safeinfoStatype}}个月</view> |
|
<br /> |
|
</view> |
|
<view class="smallText"> |
|
评估时间 {{proposal.homeRiskVo.safeinfoCreateTime||'---'}} |
|
</view> |
|
</view> |
|
<view class="fractionCar_top_right flex column bw "> |
|
<view class="fractionCar_top_right_label">改善建议</view> |
|
<view @click="$refs.popup.open('center')" |
|
class="fractionCar_top_right_suggest flex ac jc "> |
|
查看等级说明 |
|
</view> |
|
</view> |
|
</view> |
|
<view class="fractionCar_footer flex bw" style="padding-bottom: 10rpx;margin-top: 40rpx;"> |
|
<view @click="item2Index=0" |
|
:class="item2Index==0?'fractionCar_footer_item2_select':'fractionCar_footer_item2_' " |
|
class=" flex column"> |
|
<view> |
|
<image style="width: 60rpx;height: 60rpx;" :src="imgURL + 'zjsteering .png'"> |
|
</image> |
|
</view> |
|
<view>驾驶风险</view> |
|
<view style="margin-bottom: 10rpx;">有 <text |
|
class="subjectColor">{{proposal.homeRiskVo.drivingRiskCoefficient||0}}</text> |
|
项风险</view> |
|
</view> |
|
<view @click="item2Index=1" |
|
:class="item2Index==1?'fractionCar_footer_item2_select':'fractionCar_footer_item2_' " |
|
class=" flex column"> |
|
<view> |
|
<image style="width: 60rpx;height: 60rpx;" :src="imgURL + 'zjtruck.png'"></image> |
|
</view> |
|
<view>运营风险</view> |
|
<view style="margin-bottom: 10rpx;">有 <text |
|
class="subjectColor">{{proposal.homeRiskVo.operationalRiskCoefficient||0}}</text> |
|
项风险</view> |
|
</view> |
|
<view @click="item2Index=2" |
|
:class="item2Index==2?'fractionCar_footer_item2_select':'fractionCar_footer_item2_' " |
|
class=" flex column"> |
|
<view> |
|
<image style="width: 60rpx;height: 60rpx;" :src="imgURL + 'zjroad.png'"></image> |
|
</view> |
|
<view>道路风险</view> |
|
<view style="margin-bottom: 10rpx;">有 <text |
|
class="subjectColor">{{proposal.homeRiskVo.roadRiskCoefficient}}</text> 项风险 |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="riskCar"> |
|
<scroll-view class="riskCar_scroller" :scroll-into-view="toView" scroll-y="true" |
|
scroll-with-animation="true"> |
|
<view :id="item.id" class="riskCar_scroller_item" v-for="(item,index) in riskData"> |
|
<view class="riskCar_scroller_item_title flex bw"> |
|
<text style="color: #BBBBBB;">{{item.title}}</text> |
|
<text class="subjectColor">{{proposal.transdisrto||'--'}}</text> |
|
</view> |
|
<view class="riskCar_scroller_item_progress_container"> |
|
<view v-for="(progressItem,progressIndex) in item.progress" class="progress flex"> |
|
<view class="progress_label">{{progressItem[0]}}</view> |
|
<view class="progress_right flex"> |
|
<view :style="{width:`${(proposal[item.id][progressItem[1]] / 1.25)*100}%`}" class="progressBar"> |
|
<view :style="{color:progressItem[2].color}" class="progressBar_tip"> |
|
{{progressItem[2].label}} |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view v-if="proposal.homeRiskVo[item.suggested].length!==0" |
|
class="riskCar_scroller_item_propose"> |
|
<view class="riskCar_scroller_item_propose_title subjectColor"> |
|
风险改善建议 |
|
</view> |
|
<view class="riskCar_scroller_item_propose_data"> |
|
<view style="margin-bottom: 10rpx;" |
|
v-if="proposal.homeScoreVo[item.suggested].length!==0" |
|
v-for="(suggestedItem,suggestedIndex) in proposal.homeRiskVo[item.suggested]" |
|
:key='suggestedIndex' class="riskCar_scroller_item_propose_data_item"> |
|
{{suggestedIndex+1}}.<text>{{suggestedItem}}</text> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="riskCar_scroller_item_propose subjectColor" style="text-align: center;" |
|
v-else> |
|
暂无建议 |
|
</view> |
|
</view> |
|
</scroll-view> |
|
</view> |
|
</swiper-item> |
|
</swiper> |
|
</view> |
|
<!-- <view class="details_footer"> |
|
<view class="sendMail flex ac jc">发送邮件</view> |
|
<view class="download flex ac jc">下载PDF到手机</view> |
|
</view> --> |
|
<uni-popup ref="popup" @change="change"> |
|
<view class="popup_explain flex column"> |
|
<view class="indicatorBar"></view> |
|
<view class="indicatorBarGrade flex column jc"> |
|
<view v-for="(item,index) in indicatorBar" :key='index' class="indicatorBarGrade_item flex jc ac"> |
|
<view :style="{color:item.color}" class="indicatorBarGrade_item_label">{{item.label}}</view> |
|
<view class="indicatorBarGrade_item_value">{{item.value}}</view> |
|
</view> |
|
</view> |
|
<view @click="$refs.popup.close()" class="popup_explain_footer flex jc ac"> |
|
返回 |
|
</view> |
|
</view> |
|
</uni-popup> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import seleBar from '../../components/seleBar.vue' |
|
import Financial from '@/api/Financial.js' |
|
export default { |
|
options: { |
|
styleIsolation: 'shared', // 解除样式隔离 |
|
}, |
|
components: { |
|
seleBar |
|
}, |
|
watch: { |
|
|
|
}, |
|
data() { |
|
return { |
|
displayChange: false, |
|
imgURL: this.global.newImgURL, |
|
item2Index: 0, |
|
detailsList: [{ |
|
label: '车辆载重', |
|
field: 'f9', |
|
unit: 't' |
|
}, |
|
{ |
|
label: '总运营率', |
|
field: 'f10', |
|
unit: '%' |
|
}, |
|
{ |
|
label: '第一常跑路线%', |
|
field: 'f11', |
|
unit: '%' |
|
}, |
|
{ |
|
label: '轨迹完整率', |
|
field: 'f0', |
|
unit: '%' |
|
}, |
|
{ |
|
label: '平均速度', |
|
field: 'f1', |
|
unit: 'km/s' |
|
}, |
|
{ |
|
label: '日疲劳时长偏差', |
|
field: 'f2', |
|
unit: 'h' |
|
}, |
|
{ |
|
label: '日运营时长', |
|
field: 'f3', |
|
unit: 'h' |
|
}, |
|
{ |
|
label: '日均清晨运营时长', |
|
field: 'f4', |
|
unit: 'h' |
|
}, |
|
{ |
|
label: '夜间里程%', |
|
field: 'f5', |
|
unit: '%' |
|
}, |
|
{ |
|
label: '高速里程%', |
|
field: 'f6', |
|
unit: '%' |
|
}, |
|
{ |
|
label: '超速里程%', |
|
field: 'f7', |
|
unit: '%' |
|
}, |
|
{ |
|
label: '严重超速时长%', |
|
field: 'f8', |
|
unit: '%' |
|
} |
|
], |
|
footerList: [{ |
|
label: '全国排名', |
|
field: 'natrnk' |
|
}, |
|
{ |
|
label: '全省排名', |
|
field: 'prornk' |
|
}, |
|
{ |
|
label: '加权赔付率', |
|
field: 'wtlossrto' |
|
} |
|
], |
|
carryData: null, |
|
indicatorBar: [{ |
|
label: '优秀', |
|
value: '[0.00,0.85)', |
|
color: '#17A00E' |
|
}, { |
|
label: '良好', |
|
value: '[0.85,0.95)', |
|
color: '#5DD425' |
|
}, { |
|
label: '正常', |
|
value: '[0.95,1.05)', |
|
color: '#2866FF' |
|
}, { |
|
label: '轻危', |
|
value: '[1.05,1.15)', |
|
color: '#FFB730' |
|
}, { |
|
label: '危险', |
|
value: '[1.15,1.25)', |
|
color: '#BC853B' |
|
}, { |
|
label: '高危', |
|
value: '[1.25,MAX)', |
|
color: '#EE0113' |
|
}], |
|
riskData: [{ |
|
id: 'drive', |
|
title: '驾驶风险', |
|
suggested: 'drivingRecommendations', |
|
progress: [ |
|
['疲劳驾驶', 'rftdrivrto'], |
|
['超速行驶', 'ovsprto'], |
|
['低速行驶', 'lowsprto'], |
|
['路口超速', 'crossovsprto'], |
|
['路口急加速', 'rapdspuprto'], |
|
['路口急减速', 'rapdspdownrto'], |
|
['急转弯', 'sharpturn'], |
|
['驾驶平稳度', 'drivsteadyrto'], |
|
['刹车灵敏度', 'brakesensrto'] |
|
] |
|
}, { |
|
id: 'operation', |
|
title: '运营风险', |
|
suggested: 'operationalRecommendations', |
|
progress: [ |
|
['运营时长', 'rundurrto'], |
|
['行驶里程', 'runmilerto'], |
|
['运营频次', 'runcountrto'], |
|
['夜间行驶', 'nightdrivrto'], |
|
['常跑路线', 'regularlinerto'], |
|
['轨迹完整率', 'trateintgrto'], |
|
['车辆及运营类型', 'optyperto'], |
|
// ['运输距离', 'transdisrto'] |
|
] |
|
}, { |
|
id: 'road', |
|
title: '道路风险', |
|
suggested: 'roadRecommendation', |
|
progress: [ |
|
['高速公路占比', 'hwayrto'], |
|
['危险路段', 'dngroadrto'], |
|
['危险路口', 'dngcrossrto'], |
|
['道路拥堵程度', 'roadfreerto'], |
|
['路口拥堵程度', 'crossfreerto'] |
|
] |
|
}], |
|
toView: '', |
|
current: 0, |
|
seleBarData: [], |
|
scoreData: null, |
|
proposal: null |
|
} |
|
}, |
|
onLoad(e) { |
|
this.carryData = JSON.parse(e.data); |
|
this.initData() |
|
}, |
|
watch: { |
|
item2Index: function(n, o) { |
|
this.toView = this.riskData[n].id |
|
} |
|
}, |
|
methods: { |
|
formatCarNumber(carnum, isAuth) { |
|
if (carnum) { |
|
if (isAuth == 1) { |
|
const numBegin = carnum.substring(0, 2); |
|
const numEnd = carnum.substring(2); |
|
return numBegin + '·' + numEnd; |
|
} else { |
|
const numBegin = carnum.substring(0, 3); |
|
const numEnd = carnum.substring(4, 5); |
|
return numBegin + '***' + numEnd; |
|
} |
|
} |
|
return ""; |
|
}, |
|
displayChangeFn(e) { |
|
console.log('========') |
|
e = e !== '' ? Number(e) : 0; |
|
if (Number(e) >= 80 && Number(e) < 100) { |
|
return 'A' |
|
} else if (Number(e) >= 60 && Number(e) < 80) { |
|
return 'B' |
|
} else if (Number(e) >= 40 && Number(e) < 60) { |
|
return 'C' |
|
} else if (Number(e) >= 20 && Number(e) < 40) { |
|
return 'D' |
|
} else if (Number(e) >= 0 && Number(e) < 20) { |
|
return 'E' |
|
} else { |
|
return '--' |
|
} |
|
}, |
|
colorClassification(e) { |
|
e = e !== '' ? Number(e) : ''; |
|
console.log(e, e > 0.95 && e <= 1.05, 'colorClassification') |
|
if (e >= 0 && e < 0.85) { |
|
return { |
|
color: '#17A00E', |
|
label: '优秀' |
|
} |
|
} else if (e >= 0.85 && e < 0.95) { |
|
return { |
|
color: '#5DD425', |
|
label: '良好' |
|
} |
|
} else if (e >= 0.95 && e < 1.05) { |
|
return { |
|
color: '#2866FF', |
|
label: '正常' |
|
} |
|
} else if (e >= 1.05 && e < 1.15) { |
|
return { |
|
color: '#FFB730', |
|
label: '轻危' |
|
} |
|
} else if (e >= 1.15 && e < 1.25) { |
|
return { |
|
color: '#BC853B', |
|
label: '危险' |
|
} |
|
} else if (e > 1.25) { |
|
return { |
|
color: '#EE0113', |
|
label: '高危' |
|
} |
|
} else { |
|
return { |
|
color: '#EE0113', |
|
label: '---' |
|
} |
|
} |
|
console.log(e, '===') |
|
}, |
|
initData() { |
|
switch (this.carryData.type) { |
|
case 0: |
|
this.getScore(); |
|
this.getProposal(); |
|
break; |
|
case 1: |
|
this.getScore(); |
|
break; |
|
case 2: |
|
this.getProposal(); |
|
break; |
|
} |
|
}, |
|
getScore() { |
|
this.seleBarData.push({ |
|
lable: '综合评分', |
|
value: 0, |
|
open: true |
|
}) |
|
Financial.xoilSinoiovCustomerRiskevalReport({ |
|
id: this.carryData.id |
|
}).then(res => { |
|
this.scoreData = res.data; |
|
|
|
}) |
|
}, |
|
getProposal() { |
|
this.seleBarData.push({ |
|
lable: '改善建议', |
|
value: 1, |
|
open: true |
|
}) |
|
Financial.getEvaluationReportById({ |
|
id: this.carryData.homeRiskVoId |
|
}).then(res => { |
|
this.proposal = res.data; |
|
this.proposal['transdisrto'] = res.data.drive?.transdisrto||res.data.operation?.transdisrto||res.data.road?.transdisrto; |
|
Object.keys(this.proposal).forEach(item=>{ |
|
if( typeof this.proposal[item] == 'object' && this.proposal[item]?.transdisrto ){ |
|
delete this.proposal[item].transdisrto; |
|
} |
|
}) |
|
this.proposalSort() |
|
}) |
|
}, |
|
proposalSort() { |
|
let driveProgress = Object.keys(this.proposal.drive).map(item => { |
|
let data = null |
|
this.riskData[0].progress.forEach(x => { |
|
if (x[1] == item) { |
|
data = x; |
|
x.push(this.colorClassification(this.proposal.drive[item])) |
|
} |
|
}) |
|
return data |
|
}) |
|
let operationProgress = Object.keys(this.proposal.operation).map(item => { |
|
let data |
|
this.riskData[1].progress.forEach(x => { |
|
if (x[1] == item) { |
|
data = x; |
|
x.push(this.colorClassification(this.proposal.operation[item])) |
|
} |
|
}) |
|
return data |
|
}) |
|
let roadProgress = Object.keys(this.proposal.road).map(item => { |
|
let data |
|
this.riskData[2].progress.forEach(x => { |
|
if (x[1] == item) { |
|
data = x; |
|
x.push(this.colorClassification(this.proposal.road[item])) |
|
} |
|
}) |
|
return data |
|
}); |
|
this.riskData[0].progress = driveProgress; |
|
this.riskData[1].progress = operationProgress; |
|
this.riskData[2].progress = roadProgress; |
|
}, |
|
change() {}, |
|
scroll() {}, |
|
seleBarFn(e) { |
|
if (this.seleBarData.length <= 1) return; |
|
this.current = e.value |
|
console.log(e, this.scoreData, this.proposal, 'seleBarFn') |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style> |
|
.samall_text { |
|
font-size: 28rpx; |
|
} |
|
|
|
.popup_explain_footer { |
|
width: 100%; |
|
background-color: #BBBBBB; |
|
border-radius: 20rpx; |
|
color: #FFFFFF; |
|
font-size: 32rpx; |
|
height: 80rpx; |
|
/* position: absolute; |
|
bottom: 0; */ |
|
} |
|
|
|
.indicatorBarGrade_item_value { |
|
margin-left: 30rpx; |
|
} |
|
|
|
.indicatorBarGrade_item:first-child { |
|
margin-top: 0; |
|
} |
|
|
|
.indicatorBarGrade_item { |
|
width: 100%; |
|
margin-top: 20rpx; |
|
} |
|
|
|
.indicatorBarGrade { |
|
flex: 1; |
|
} |
|
|
|
.indicatorBar { |
|
background: linear-gradient(to right, #17A00E, #5DD425, #2866FF, #FFB730, #BC853B, #EE0113); |
|
width: 74rpx; |
|
height: 20rpx; |
|
width: 100%; |
|
font-size: 28rpx; |
|
} |
|
|
|
.popup_explain { |
|
width: 574rpx; |
|
height: 680rpx; |
|
background: #FFFFFF; |
|
border-radius: 20rpx; |
|
padding: 50rpx; |
|
position: relative; |
|
} |
|
|
|
.riskCar_scroller_item_propose_data_item { |
|
font-size: 24rpx; |
|
} |
|
|
|
.progressBar_tip { |
|
position: absolute; |
|
top: -38rpx; |
|
right: 0; |
|
font-size: 22rpx; |
|
} |
|
|
|
.riskCar_scroller_item_propose_title { |
|
width: 100%; |
|
text-align: center; |
|
} |
|
|
|
.riskCar_scroller_item_propose { |
|
font-size: 28rpx; |
|
background-color: #F0F0F0; |
|
width: 100%; |
|
padding: 40rpx; |
|
color: #666666; |
|
} |
|
|
|
.riskCar_scroller_item_progress_container .progressBar { |
|
background: #F0F0F0; |
|
min-width: 15%; |
|
height: 8rpx; |
|
position: relative; |
|
font-size: 24rpx; |
|
} |
|
|
|
.riskCar_scroller_item_progress_container .progress_label { |
|
width: 140rpx; |
|
text-align: right; |
|
font-size: 20rpx; |
|
} |
|
|
|
.riskCar_scroller_item_progress_container .progress_right { |
|
flex: 1; |
|
align-items: flex-end; |
|
margin-left: 20rpx; |
|
} |
|
|
|
.riskCar_scroller_item_progress_container .progress { |
|
margin-bottom: 26rpx; |
|
color: #666666; |
|
} |
|
|
|
.labelColor { |
|
color: #666666; |
|
} |
|
|
|
.detailsCar_item_label {} |
|
|
|
.detailsCar_item_value { |
|
margin-top: 8rpx; |
|
} |
|
|
|
.detailsCar_item { |
|
width: 28%; |
|
text-align: center; |
|
/* background-color: #007AFF; */ |
|
font-size: 20rpx; |
|
} |
|
|
|
.voitureCar_item_value { |
|
font-size: 28rpx; |
|
margin-top: 15rpx; |
|
} |
|
|
|
.voitureCar_item { |
|
width: 50%; |
|
text-align: center; |
|
} |
|
|
|
.voitureCar { |
|
padding: 40rpx 50rpx; |
|
font-size: 24rpx; |
|
|
|
} |
|
|
|
.subjectColor { |
|
color: #FF6700; |
|
} |
|
|
|
.fractionCar_footer { |
|
flex: 1; |
|
align-items: flex-end; |
|
} |
|
|
|
.fractionCar_top {} |
|
|
|
.bigText { |
|
font-size: 48rpx; |
|
} |
|
|
|
.fractionCar_footer_item2_select { |
|
font-size: 24rpx; |
|
color: #666666; |
|
text-align: center; |
|
width: calc((100% / 3) - 20rpx); |
|
border-bottom: solid #FF6700 2px; |
|
} |
|
|
|
.fractionCar_footer_item2_ { |
|
font-size: 24rpx; |
|
color: #666666; |
|
text-align: center; |
|
width: calc((100% / 3) - 20rpx); |
|
padding-bottom: 2px; |
|
} |
|
|
|
.fractionCar_footer_item { |
|
font-size: 24rpx; |
|
color: #666666; |
|
text-align: center; |
|
width: calc(100% / 3); |
|
} |
|
|
|
.fractionCar_footer_item_value {} |
|
|
|
.fractionCar_top_right_label { |
|
color: #666666; |
|
font-size: 28rpx; |
|
} |
|
|
|
.fractionCar_top_left { |
|
flex: 1; |
|
} |
|
|
|
.fractionCar_top_right { |
|
text-align: center; |
|
} |
|
|
|
.fractionCar_top_right_rank { |
|
font-weight: 400; |
|
font-size: 106rpx; |
|
line-height: 112rpx; |
|
color: #FF6700; |
|
} |
|
|
|
.smallText { |
|
font-size: 24rpx; |
|
line-height: 28rpx; |
|
color: #666666; |
|
} |
|
|
|
.fractionCar_time { |
|
margin: 10rpx 0; |
|
} |
|
|
|
.estimate_plate { |
|
/* display: block; */ |
|
background: #F0F0F0; |
|
padding: 0 10rpx; |
|
margin-left: 20rpx; |
|
color: #666666; |
|
font-size: 24rpx; |
|
/* height: 40rpx; */ |
|
display: inline-block; |
|
line-height: 40rpx; |
|
} |
|
|
|
.fractionCar_plateNumber { |
|
font-family: 'Roboto'; |
|
font-style: normal; |
|
font-weight: 400; |
|
font-size: 48rpx; |
|
line-height: 56rpx; |
|
color: #FF6700; |
|
} |
|
|
|
.riskCar_scroller_item { |
|
width: 100%; |
|
min-height: 100%; |
|
font-size: 28rpx; |
|
margin-bottom: 40rpx; |
|
} |
|
|
|
.riskCar_scroller { |
|
height: 100%; |
|
width: 100%; |
|
} |
|
|
|
.bw { |
|
justify-content: space-between; |
|
} |
|
|
|
.riskCar_scroller_item_title { |
|
margin-bottom: 30rpx; |
|
} |
|
|
|
.fractionCar_top_right_suggest { |
|
background: #FF6700; |
|
border-radius: 5px; |
|
height: 60rpx; |
|
width: 236rpx; |
|
color: #FFFFFF; |
|
font-size: 28rpx; |
|
} |
|
|
|
.riskCar { |
|
width: calc(100% - 54rpx); |
|
/* height: 920rpx; */ |
|
border-radius: 10px; |
|
margin: auto; |
|
margin: 40rpx auto; |
|
flex: 1; |
|
overflow: hidden; |
|
background-color: #FFFFFF; |
|
padding: 40rpx; |
|
} |
|
|
|
.detailsCar { |
|
width: calc(100% - 54rpx); |
|
height: calc(100% - 710rpx); |
|
background: #FFFFFF; |
|
border-radius: 10px; |
|
margin: auto; |
|
padding: 40rpx 50rpx; |
|
flex-wrap: wrap; |
|
justify-content: space-between; |
|
overflow: auto; |
|
} |
|
|
|
.voitureCar { |
|
width: calc(100% - 54rpx); |
|
height: 160rpx; |
|
background: #FFFFFF; |
|
border-radius: 10px; |
|
margin: 40rpx auto; |
|
|
|
} |
|
|
|
/* .swiper_item:last-child{ |
|
overflow-y: auto !important; |
|
} */ |
|
.swiper_item { |
|
width: 100%; |
|
/* height: 100%; */ |
|
} |
|
|
|
.details_swiper { |
|
width: 100%; |
|
flex: 1; |
|
/* height: 100%; */ |
|
} |
|
|
|
.scroll-view-item { |
|
width: 100%; |
|
height: 100%; |
|
} |
|
|
|
.scroll-x { |
|
background-color: #007AFF; |
|
height: 380rpx; |
|
width: 100%; |
|
white-space: nowrap |
|
} |
|
|
|
.details_data_container { |
|
flex: 1; |
|
/* background-color: #007AFF; */ |
|
width: 100%; |
|
overflow: auto; |
|
} |
|
|
|
.fractionCar { |
|
width: calc(100% - 54rpx); |
|
min-height: 380rpx; |
|
background: #FFFFFF; |
|
border-radius: 10px; |
|
flex: none; |
|
order: 0; |
|
flex-grow: 0; |
|
left: 0; |
|
right: 0; |
|
margin: auto; |
|
margin-top: 50rpx; |
|
padding: 50rpx; |
|
} |
|
|
|
.flex { |
|
display: flex; |
|
} |
|
|
|
.ac { |
|
align-items: center; |
|
} |
|
|
|
.jc { |
|
justify-content: center; |
|
} |
|
|
|
.download { |
|
height: 100%; |
|
flex: 1; |
|
background-color: #FF6700; |
|
} |
|
|
|
.sendMail { |
|
height: 100%; |
|
flex: 1; |
|
background-color: #17A00E; |
|
} |
|
|
|
.details_footer { |
|
width: 100vw; |
|
background-color: #007AFF; |
|
display: flex; |
|
height: 120rpx; |
|
color: #FFFFFF; |
|
font-size: 32rpx; |
|
position: relative; |
|
z-index: 1; |
|
} |
|
|
|
.details_container_bg { |
|
width: 180%; |
|
background: #FF6700; |
|
border-radius: 0 0 50% 50%; |
|
position: absolute; |
|
height: calc(76rpx + 190px + 20rpx + 340rpx + 45rpx + 90rpx + 20rpx); |
|
z-index: 0; |
|
left: -40%; |
|
} |
|
|
|
.column { |
|
flex-direction: column; |
|
} |
|
|
|
.details_container { |
|
flex: 1; |
|
position: relative; |
|
z-index: 1; |
|
/* padding: 0 54rpx; */ |
|
display: flex; |
|
flex-direction: column; |
|
} |
|
|
|
.details_body { |
|
width: 100vw; |
|
height: 100vh; |
|
background: #E5E5E5; |
|
display: flex; |
|
flex-direction: column; |
|
} |
|
</style>
|
|
|