|
|
@@ -0,0 +1,748 @@
|
|
|
+<template>
|
|
|
+ <view class="content">
|
|
|
+ <view class="car-report-main newjcbgD">
|
|
|
+ <view class="car-report newcar-report">
|
|
|
+ <view class="newcar-reportTs">检测报告</view>
|
|
|
+ <view class="car-report-title report-title-box">
|
|
|
+ <h4>
|
|
|
+ <img :src="detailData.brandLogo" v-if="detailData.brandLogo" alt="" class="car-list-container-icon">
|
|
|
+ <img src="../../static/timg/nocar.png" v-else class="car-list-container-icon">
|
|
|
+ <view class="car-list-container-title">
|
|
|
+ <h5 class="carjcPlateNumber">{{detailData.licensePlateNumber}}</h5> <span class="km-con">{{detailData.currentMileage||'-- '}}km</span>
|
|
|
+ <h3 >{{detailData.carModel?detailData.carModel:'暂无'}}</h3>
|
|
|
+ </view>
|
|
|
+ </h4>
|
|
|
+ </view>
|
|
|
+ <view class="car-report-item">
|
|
|
+ <h5 class="fule hhhhh5">
|
|
|
+ <img src="../../static/img/newshop.png" alt="" class="shop-icon2">
|
|
|
+ <!-- <span class="shop-icon"></span> -->{{detailData.shopName}} <span class="phone" @click="tel"></span>
|
|
|
+ </h5>
|
|
|
+ <h5 class="hxxhhh5"><!-- <span class="user-icon"></span> -->{{detailData.workerName||'--'}} | {{detailData.time||'--'}}</h5>
|
|
|
+ </view>
|
|
|
+ <view class="car-report-item">
|
|
|
+ <view class="car-report-statistics">
|
|
|
+ <view class="car-report-statistics-item">
|
|
|
+ <h3 class="report-color-red">{{detailData.ultimateOutcome&&detailData.ultimateOutcome[3]&&detailData.ultimateOutcome[3].length||0}}</h3>
|
|
|
+ <p>急需处理</p>
|
|
|
+ </view>
|
|
|
+ <view class="car-report-statistics-item">
|
|
|
+ <h3 class="report-color-yellow">
|
|
|
+ {{detailData.ultimateOutcome&&detailData.ultimateOutcome[2]&&detailData.ultimateOutcome[2].length||0}}</h3>
|
|
|
+ <p>密切关注</p>
|
|
|
+ </view>
|
|
|
+ <view class="car-report-statistics-item">
|
|
|
+ <h3 class="report-color-green">
|
|
|
+ {{detailData.ultimateOutcome&&detailData.ultimateOutcome[1]&&detailData.ultimateOutcome[1].length||0}}</h3>
|
|
|
+ <p>状态良好</p>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-for="status in listData">
|
|
|
+ <view :key="status.valueType">
|
|
|
+ <view class="car-report-item flex"
|
|
|
+ :class="{'report-warning':status.valueType===2,'report-error':status.valueType===3,'report-ok':status.valueType===1}"
|
|
|
+ @click="ckd(status)">
|
|
|
+ <view class="report-status-count">{{status.value&&status.value.length||0}}项</view>
|
|
|
+ <view class="report-status">
|
|
|
+ <h3>{{status.name}}</h3>
|
|
|
+ <p v-if="status.valueType===1&&!status.show">点击查看详情</p>
|
|
|
+ <p v-else>{{status.message}}</p>
|
|
|
+ </view>
|
|
|
+ <span class="icon-select-down" :class="{'close':!status.show}"></span>
|
|
|
+ </view>
|
|
|
+ <!-- <collapse-transition> -->
|
|
|
+ <view v-show="status.show">
|
|
|
+ <view class="car-report-item" v-for="item in status.value" :key="item.name">
|
|
|
+ <view class="car-report-item-title"
|
|
|
+ :class="{'warning-title':status.valueType===2,'error-title':status.valueType===3,'ok-title':status.valueType===1}">
|
|
|
+ <h3 class="carjcdItemname">{{item.name}}</h3>
|
|
|
+ <h4 class="carjcZt"><i class="title-icon"></i>{{status.name}}</h4>
|
|
|
+ </view>
|
|
|
+ <view class="car-report-item-info">
|
|
|
+ <view v-if="item.SectionType===0">
|
|
|
+ <p v-for="(item2,index) in item.value" :key="index"><span class="carjcitemSpan">{{item2.ItemName}}：</span>{{item2.Value}}
|
|
|
+ <i class="info-status"
|
|
|
+ :class="{'report-color-red':item2.ValueType===3,'report-color-yellow':item2.ValueType===2}">{{item2.ValueType===3?'急需处理':item2.ValueType===2?'密切关注':'状态良好'}}</i>
|
|
|
+ </p>
|
|
|
+ <p v-if="item.Comment"><span>备注：</span>{{item.Comment}}
|
|
|
+ </p>
|
|
|
+ <p v-if="item.Describe"><span>说明：</span>{{item.Describe}} </p>
|
|
|
+ </view>
|
|
|
+ <view class="warning-lamp" v-if="item.SectionType===2">
|
|
|
+ <span v-for="(item2,index) in item.value" :key="index" class="lamp-item error-lamp" :class="{'check':item2.IsSelect}" v-bind:style="{'background-image':'url('+item2.ItemIcon+')'}"></span>
|
|
|
+ </view>
|
|
|
+ <view v-if="item.SectionType===1">
|
|
|
+ <view class="car-report-rv">
|
|
|
+ <img :src="item.SectionPic" style="width: 100%" alt="图片加载失败">
|
|
|
+ </view>
|
|
|
+ <view class="car-report-rv-buttom"></view>
|
|
|
+ </view>
|
|
|
+ <view class="video-button carjcvideo-button" v-if="item.VideoName&&!item.showVideo">
|
|
|
+ <view class="video-play" @click="ckVideo(item)"></view>
|
|
|
+ {{item.VideoName}}
|
|
|
+ </view>
|
|
|
+ <view class="image-list">
|
|
|
+ <view class="image-list-item" v-for="(file,index) in item.photoPath" :key="file.id">
|
|
|
+ <img :src="file"
|
|
|
+ v-preview="file"
|
|
|
+ :alt="`查看图片${index+1}`"
|
|
|
+ preview-title-enable="true"
|
|
|
+ preview-nav-enable="true"/>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="video-wrapper" v-if="item.showVideo">
|
|
|
+ <video :src="item.VideoURL"></video>
|
|
|
+ <!-- <video-player class="vjs-custom-skin" :options="getPlayerOptions(item.VideoURL)"></video-player> -->
|
|
|
+ </view>
|
|
|
+ <view class="car-report-remarks" v-if="item.SectionType&&item.Comment">
|
|
|
+ <p><span>备注：</span>{{item.Comment}} </p>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- </collapse-transition> -->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+<!-- 手机号授权 -->
|
|
|
+ <view class="authorizBox" v-if="authorizShow" @click="authorizShow=false">
|
|
|
+ <view class="authorizCont" @click.stop="">
|
|
|
+ <view class="authorizName">{{wxOpenData.miniAppName}}</view>
|
|
|
+ <view class="authorizMs">您好，欢迎访问本店，授权手机号登录能获取我们最新的促销活动哦~</view>
|
|
|
+ <button class="authorizContbutton" type="default" open-type="getPhoneNumber" @getphonenumber="decryptPhoneNumber">授权</button>
|
|
|
+ </view>
|
|
|
+ <view style="text-align: center;padding-top: 56rpx;">
|
|
|
+ <image src="../../../static/timg/icon_guanbi@2x.png" mode="" class="authorizCloseImg"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ detailData: {},
|
|
|
+ listData: {},
|
|
|
+ id:'',
|
|
|
+ userInfo:'',
|
|
|
+ ext:'',
|
|
|
+ wxOpenData:'',
|
|
|
+ authorizShow:false,
|
|
|
+ code:'',
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(opt) {
|
|
|
+ this.id=opt.id;
|
|
|
+ this.userInfo=this.$store.state.userInfo;
|
|
|
+ this.ext=this.$common.getExtStoreId();
|
|
|
+ if(this.userInfo){
|
|
|
+ if (this.id) {
|
|
|
+ this.getDetail()
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ this.$common.automaticlogin().then(val => {
|
|
|
+ this.userInfo=this.$store.state.userInfo;
|
|
|
+ this.wxOpenData=this.$store.state.wxOpenData;
|
|
|
+ this.themeColor = uni.getStorageSync("themeColor");
|
|
|
+ if (this.id) {
|
|
|
+ this.getDetail()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ decryptPhoneNumber: function(e) {
|
|
|
+ console.log(e);
|
|
|
+ this.code=e.detail.code
|
|
|
+ this.wxPhoneLogin()
|
|
|
+ this.authorizShow=false;
|
|
|
+ },
|
|
|
+ wxPhoneLogin(){
|
|
|
+ var that=this;
|
|
|
+ this.$http('miniApp2/sys/wxPhoneLogin', {
|
|
|
+ appId:this.ext.appId,
|
|
|
+ unionId:this.ext.unionId,
|
|
|
+ code:this.code,
|
|
|
+ openId:this.wxOpenData.openid
|
|
|
+ },'POST').then(res => {
|
|
|
+ var data = res.data;
|
|
|
+ if(data.loginInfo){
|
|
|
+ this.userInfo=data.loginInfo.openUser;
|
|
|
+ this.wxOpenData=data.loginInfo;
|
|
|
+ this.$store.commit('mutationswxOpenData', data.loginInfo)
|
|
|
+ this.$store.commit('mutationsuserInfo', this.userInfo)
|
|
|
+ this.getDetail()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ tel () {
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: this.detailData.mobilePhone
|
|
|
+ });
|
|
|
+ },
|
|
|
+ ckd(status){
|
|
|
+ status.show=!status.show
|
|
|
+ },
|
|
|
+ ckVideo(item){
|
|
|
+ console.log("点击视频")
|
|
|
+ item.showVideo=!item.showVideo
|
|
|
+ },
|
|
|
+ getPlayerOptions (url) {
|
|
|
+ return {
|
|
|
+ // videojs options
|
|
|
+ muted: true,
|
|
|
+ language: 'zh',
|
|
|
+ width: document.documentElement.clientWidth - 40,
|
|
|
+ height: (document.documentElement.clientWidth - 40) / 16 * 9,
|
|
|
+ playbackRates: [0.7, 1.0, 1.5, 2.0],
|
|
|
+ sources: [{
|
|
|
+ type: 'video/mp4',
|
|
|
+ src: url
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getDetail () {
|
|
|
+ this.$http('opencheckSheet/getTestReportDetails', {
|
|
|
+ sheetId:this.id
|
|
|
+ },'GET').then(res => {
|
|
|
+ let data = [{
|
|
|
+ name: '急需处理',
|
|
|
+ value: res.data.ultimateOutcome[3],
|
|
|
+ valueType: 3,
|
|
|
+ message: '以下项存在异常，请尽快去处理哟~',
|
|
|
+ show: true
|
|
|
+ }, {
|
|
|
+ name: '密切关注',
|
|
|
+ value: res.data.ultimateOutcome[2],
|
|
|
+ valueType: 2,
|
|
|
+ message: '以下项需保持关注~',
|
|
|
+ show: true
|
|
|
+ }, {
|
|
|
+ name: '状态良好',
|
|
|
+ value: res.data.ultimateOutcome[1],
|
|
|
+ valueType: 1,
|
|
|
+ message: '以下项没有异常，请保持定期检测哟~',
|
|
|
+ show: false
|
|
|
+ }]
|
|
|
+ data.forEach((item, index) => {
|
|
|
+ item.value && item.value.forEach((item2, index2) => {
|
|
|
+ this.$set(item2, 'name', Object.keys(item2)[0])
|
|
|
+ this.$set(item2, 'value', item2[Object.keys(item2)[0]])
|
|
|
+ this.$set(item2, 'showVideo', false)
|
|
|
+ this.$set(item2, 'VideoName', item2.value[0].VideoName)
|
|
|
+ this.$set(item2, 'VideoURL', item2.value[0].VideoURL)
|
|
|
+ this.$set(item2, 'photoPath', item2.value[0].photoPath && item2.value[0].photoPath.split(',') || [])
|
|
|
+ this.$set(item2, 'Comment', item2.value[0].Comment)
|
|
|
+ this.$set(item2, 'Describe', item2.value[0].Describe)
|
|
|
+ this.$set(item2, 'SectionType', item2.value[0].SectionType)
|
|
|
+ this.$set(item2, 'SectionPic', item2.value[0].SectionPic)
|
|
|
+ })
|
|
|
+ })
|
|
|
+ console.log(data)
|
|
|
+ this.detailData = res.data
|
|
|
+ this.listData = data
|
|
|
+
|
|
|
+ })
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+ .image-list{
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ .image-list-item {
|
|
|
+ vertical-align: top;
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ width: 33%;
|
|
|
+ margin: 4rpx auto;
|
|
|
+ }
|
|
|
+ .remove {
|
|
|
+ position: absolute;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 20rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ font-size: 20rpx;
|
|
|
+ font-weight: 700;
|
|
|
+ color: rgb(255, 255, 255);
|
|
|
+ right: 10%;
|
|
|
+ top: 0px;
|
|
|
+ height: 20rpx;
|
|
|
+ width: 20rpx;
|
|
|
+ background-color: gray;
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ img {
|
|
|
+ display: block;
|
|
|
+ width: 85rpx;
|
|
|
+ height: 85rpx;
|
|
|
+ vertical-align: center;
|
|
|
+ border: 1px solid rgba(247, 247, 247, 1);
|
|
|
+ border-radius: 10rpx;
|
|
|
+ object-fit: contain;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .newjcbgD .newcar-report{
|
|
|
+ background: url('http://dmsphoto.66km.com.cn/thFiles/58BF776D-0B1D-420A-A7C1-BAE6FA7E8695.png') no-repeat;
|
|
|
+ background-size: 100%;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .newcar-reportTs{
|
|
|
+ font-size: 44rpx;
|
|
|
+ color: #ffffff;
|
|
|
+ font-weight: 600;
|
|
|
+ position: absolute;
|
|
|
+ top: 50rpx;
|
|
|
+ left: 24rpx;
|
|
|
+ }
|
|
|
+ .car-report{
|
|
|
+ background: url("http://dmsphoto.66km.com.cn/thFiles/B5701B43-38A7-48A9-928D-7C8CCCE750D6.png") 100% -70px no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ padding: 30rpx 20rpx 20rpx 20rpx;
|
|
|
+ }
|
|
|
+ .car-report-title{
|
|
|
+ margin-top: 140rpx;
|
|
|
+ }
|
|
|
+ .report-title-box{
|
|
|
+ h4{
|
|
|
+ margin-left: 10rpx;
|
|
|
+ margin-bottom: 30rpx;
|
|
|
+ .car-list-container-title{
|
|
|
+ h5,h3,.km-con{
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .car-list-container-icon{
|
|
|
+ width: 72rpx;
|
|
|
+ height: 72rpx;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ .car-list-container-title{
|
|
|
+ display: inline-block;
|
|
|
+ padding-left: 10rpx;
|
|
|
+ >h5{
|
|
|
+ height:36rpx;
|
|
|
+ font-size:32rpx;
|
|
|
+ font-weight:600;
|
|
|
+ color:rgba(51,51,51,1);
|
|
|
+ line-height:36rpx;
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+ .km-con{
|
|
|
+ height:33rpx;
|
|
|
+ font-size:24rpx;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(102,102,102,1);
|
|
|
+ line-height:33rpx;
|
|
|
+ border-radius:5rpx;
|
|
|
+ border:2rpx solid rgba(221,221,221,1);
|
|
|
+ display: inline-block;
|
|
|
+ padding: 2rpx 11rpx;
|
|
|
+ transform: translateY(-4rpx);
|
|
|
+ }
|
|
|
+ >h3{
|
|
|
+ width: 550rpx;
|
|
|
+ height:33rpx;
|
|
|
+ font-size:24rpx;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(153,153,153,1);
|
|
|
+ line-height:33rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .car-report-item{
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 30rpx 20rpx;
|
|
|
+ box-shadow:0px 0px 10rpx 0px rgba(153,153,153,0.16);
|
|
|
+ border-radius:10rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ position: relative;
|
|
|
+ .car-report-item-info{
|
|
|
+ padding: 15rpx 0;
|
|
|
+ .car-report-rv{
|
|
|
+ width: 331rpx;
|
|
|
+ height: 465rpx;
|
|
|
+ margin: 10rpx auto;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .car-report-rv-buttom{
|
|
|
+ width: 480rpx;
|
|
|
+ height: 70rpx;
|
|
|
+ background: url("http://dmsphoto.66km.com.cn/thFiles/1A42D7CB-072B-4565-95BA-878FA340B852.png") 100% 100% no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ margin: 10rpx auto;
|
|
|
+ }
|
|
|
+ .car-report-remarks{
|
|
|
+ border-top: 2px solid #EEEEEE;
|
|
|
+ padding-top: 10rpx;
|
|
|
+ margin-top: 10rpx;
|
|
|
+ margin-bottom: -10rpx;
|
|
|
+ }
|
|
|
+ .video-wrapper{
|
|
|
+ margin-top: 20rpx;
|
|
|
+ //border-radius:20px;
|
|
|
+ object-fit: fill;
|
|
|
+ overflow: hidden;
|
|
|
+ .vjs-paused{
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .video-button{
|
|
|
+ margin-top: 20rpx;
|
|
|
+ height: 90rpx;
|
|
|
+ background-color: #FEEFD8;
|
|
|
+ display: flex;
|
|
|
+ font-size:28rpx;
|
|
|
+ font-weight:500;
|
|
|
+ color:rgba(185,144,86,1);
|
|
|
+ line-height:90rpx;
|
|
|
+ .video-play{
|
|
|
+ width: 50rpx;
|
|
|
+ height: 50rpx;
|
|
|
+ margin: 20rpx;
|
|
|
+ display: inline-block;
|
|
|
+ background: url("http://dmsphoto.66km.com.cn/thFiles/A7F13529-E889-4B2B-83B7-4CD5E322853D.png") 100% 100% no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .warning-lamp{
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-start;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .lamp-item{
|
|
|
+ margin: 20rpx 30rpx 20rpx 56rpx;
|
|
|
+ width: 80rpx;
|
|
|
+ height: 70rpx;
|
|
|
+ display: block;
|
|
|
+ background: url("http://dmsphoto.66km.com.cn/thFiles/DE80CE12-534E-4AD0-921A-17051A4F5984.png") 100% 100% no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ position: relative;
|
|
|
+ &.check:after{
|
|
|
+ background: url("http://dmsphoto.66km.com.cn/thFiles/7E809DDE-FD2D-4158-A6EF-01FC855A5A2D.png") 100% 100% no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ &:after{
|
|
|
+ content: '';
|
|
|
+ width: 38rpx;
|
|
|
+ height: 38rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ border:2px solid rgba(221,221,221,1);
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ left: -50rpx;
|
|
|
+ top: 18rpx;
|
|
|
+ }
|
|
|
+ &.error-lamp{
|
|
|
+ color: #F03B3B;
|
|
|
+ //filter: drop-shadow(#F03B3B 80px 0);
|
|
|
+ &svg path{
|
|
|
+ fill:rgb(18, 136, 222)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ p{
|
|
|
+ font-size:28rpx;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(153,153,153,1);
|
|
|
+ line-height:150%;
|
|
|
+ padding: 8rpx 0;
|
|
|
+ display: flex;
|
|
|
+ >span{
|
|
|
+ height:28rpx;
|
|
|
+ font-size:28rpx;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(102,102,102,1);
|
|
|
+ line-height:28rpx;
|
|
|
+ padding-top: 5rpx;
|
|
|
+ }
|
|
|
+ .info-status{
|
|
|
+ margin-left: 10rpx;
|
|
|
+ height:38rpx;
|
|
|
+ border-radius:8rpx;
|
|
|
+ border:2rpx solid rgba(221,221,221,1);
|
|
|
+ padding: 2rpx 14rpx;
|
|
|
+ text-decoration: none;
|
|
|
+ font-style: normal;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .car-report-item-title{
|
|
|
+ position: relative;
|
|
|
+ &.error-title{
|
|
|
+ .title-icon{
|
|
|
+ background: url("http://dmsphoto.66km.com.cn/thFiles/69B1087C-79B4-40E3-99DD-7B6F7C334373.png") 100% 100% no-repeat;
|
|
|
+ }
|
|
|
+ >h4{
|
|
|
+ display: flex;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(240,59,59,1);
|
|
|
+ .title-icon{
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ background-size: contain;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ transform: translateY(2rpx);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &.ok-title{
|
|
|
+ .title-icon{
|
|
|
+ background: url("http://dmsphoto.66km.com.cn/thFiles/A331D98F-D90C-4170-BA36-EBD94C2B8EE1.png") 100% 100% no-repeat;
|
|
|
+ }
|
|
|
+ >h4{
|
|
|
+ display: flex;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(38,150,92,1);
|
|
|
+ .title-icon{
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ background-size: contain;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ transform: translateY(2px);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &.warning-title{
|
|
|
+ .title-icon{
|
|
|
+ background: url("http://dmsphoto.66km.com.cn/thFiles/C3B101F2-32E7-4247-A679-52C82C976E0D.png") 100% 100% no-repeat;
|
|
|
+ }
|
|
|
+ >h4{
|
|
|
+ display: flex;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(241,157,1,1);
|
|
|
+ .title-icon{
|
|
|
+ width: 36rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ background-size: contain;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ transform: translateY(2px);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ >h3{
|
|
|
+ height:32rpx;
|
|
|
+ font-size:32rpx;
|
|
|
+ font-weight:600;
|
|
|
+ color:rgba(51,51,51,1);
|
|
|
+ line-height:32rpx;
|
|
|
+ padding-top: 10rpx;
|
|
|
+ padding-bottom: 30rpx;
|
|
|
+ border-bottom: 2px solid #EEEEEE;
|
|
|
+ padding-right: 200rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+ >h4{
|
|
|
+ position: absolute;
|
|
|
+ top: 6rpx;
|
|
|
+ right: 0;
|
|
|
+ height:42rpx;
|
|
|
+ font-size:30rpx;
|
|
|
+ font-weight:400;
|
|
|
+ line-height:42rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &.report-error{
|
|
|
+ .report-status-count{
|
|
|
+ background-color: rgb(255, 77, 15);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &.report-warning{
|
|
|
+ .report-status-count{
|
|
|
+ background-color: rgb(244, 165, 11);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ &.report-ok{
|
|
|
+ .report-status-count{
|
|
|
+ background-color: rgb(41, 162, 87);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .report-status-count{
|
|
|
+ width: 100rpx;
|
|
|
+ height: 100rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ margin: 10rpx 20rpx;
|
|
|
+ line-height: 100rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-size:30rpx;
|
|
|
+ font-weight:500;
|
|
|
+ color:rgba(255,255,255,1);
|
|
|
+ }
|
|
|
+ .report-status{
|
|
|
+ >h3{
|
|
|
+ height:45rpx;
|
|
|
+ font-size:32rpx;
|
|
|
+ font-weight:500;
|
|
|
+ color:rgba(51,51,51,1);
|
|
|
+ line-height:45rpx;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
+ padding-top: 15rpx;
|
|
|
+ }
|
|
|
+ >p{
|
|
|
+ height:33rpx;
|
|
|
+ font-size:24rpx;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(153,153,153,1);
|
|
|
+ line-height:33rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .car-report-statistics{
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ .car-report-statistics-item{
|
|
|
+ >h3{
|
|
|
+ text-align: center;
|
|
|
+ height:62rpx;
|
|
|
+ font-size:44rpx;
|
|
|
+ font-weight:500;
|
|
|
+ line-height:62rpx;
|
|
|
+ }
|
|
|
+ >p{
|
|
|
+ height:40rpx;
|
|
|
+ font-size:28rpx;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(153,153,153,1);
|
|
|
+ line-height:40rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ h5{
|
|
|
+
|
|
|
+ margin:0 0 16rpx 8rpx;
|
|
|
+ width: 600rpx;
|
|
|
+ height:37rpx;
|
|
|
+ font-size:26rpx;
|
|
|
+ font-weight:400;
|
|
|
+ color:rgba(51,51,51,1);
|
|
|
+ line-height:37rpx;
|
|
|
+ .phone{
|
|
|
+ position: absolute;
|
|
|
+ right: 40rpx;
|
|
|
+ top: 24rpx;
|
|
|
+ width: 30rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ display: inline-block;
|
|
|
+ background: url("http://dmsphoto.66km.com.cn/thFiles/36EFD213-1D81-4153-AFFD-33BE701E5DBF.png") 100% no-repeat;
|
|
|
+ background-size: contain;
|
|
|
+ }
|
|
|
+ .shop-icon{
|
|
|
+ vertical-align: sub;
|
|
|
+ transform: translateY(-2rpx);
|
|
|
+ }
|
|
|
+ &:last-child{
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .fule{
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ .newjcbgD .hhhhh5{
|
|
|
+ height: 44rpx !important;
|
|
|
+ font-weight: 500 !important;
|
|
|
+ color: #3C3C3C !important;
|
|
|
+ font-size: 28rpx !important;
|
|
|
+ }
|
|
|
+ .newjcbgD .hxxhhh5{
|
|
|
+ padding-left: 50rpx;
|
|
|
+ color: #999999 !important;
|
|
|
+ }
|
|
|
+ .newjcbgD .shop-icon2{
|
|
|
+ /* background: url(../newimg/icon_store@2x.png);
|
|
|
+ background-size: 100% !important; */
|
|
|
+ width: 40rpx;
|
|
|
+ height: 44rpx;
|
|
|
+ margin-right: 10rpx;
|
|
|
+
|
|
|
+ }
|
|
|
+ .newjcbgD .car-report .car-report-item h5 .phone{
|
|
|
+ background: url('http://dmsphoto.66km.com.cn/thFiles/AA0ED98C-DC25-41D0-B09A-9ACC497D017A.png');
|
|
|
+ background-size: 100% 100% !important;
|
|
|
+ width: 60rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ }
|
|
|
+ .report-color-red{
|
|
|
+ color:rgba(240,59,59,1)!important;
|
|
|
+ border-color: rgba(240,59,59,1)!important;
|
|
|
+ }
|
|
|
+ .report-color-yellow{
|
|
|
+ color: rgb(242, 157, 0)!important;
|
|
|
+ border-color: rgb(242, 157, 0)!important;
|
|
|
+ }
|
|
|
+ .report-color-green{
|
|
|
+ color:rgba(38,150,92,1)!important;
|
|
|
+ border-color: rgba(38,150,92,1)!important;
|
|
|
+ }
|
|
|
+ .authorizBox{
|
|
|
+ width: 100vw;
|
|
|
+ height: 100vh;
|
|
|
+ background: rgba(0, 0, 0, 0.5);
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ }
|
|
|
+ .authorizCont{
|
|
|
+ margin-top: 30vh;
|
|
|
+ width: 564rpx;
|
|
|
+ height: 408rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 24rpx;
|
|
|
+ margin-left: 93rpx;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .authorizCloseImg{
|
|
|
+ width: 62rpx;
|
|
|
+ height: 62rpx;
|
|
|
+ }
|
|
|
+ .sqLogoBox{
|
|
|
+ width: 180rpx;
|
|
|
+ height: 180rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 90rpx;
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ top: -50rpx;
|
|
|
+ left: 192rpx;
|
|
|
+ }
|
|
|
+ .authorizName{
|
|
|
+ color: #333333;
|
|
|
+ line-height: 42rpx;
|
|
|
+ font-size: 30rpx;
|
|
|
+ text-align: center;
|
|
|
+ padding-top: 58rpx;
|
|
|
+ }
|
|
|
+ .authorizMs{
|
|
|
+ color: #999999;
|
|
|
+ line-height: 36rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ width: 452rpx;
|
|
|
+ padding-top: 24rpx;
|
|
|
+ text-align: center;
|
|
|
+ margin-left: 56rpx;
|
|
|
+ }
|
|
|
+ .authorizContbutton{
|
|
|
+ width: 422rpx;
|
|
|
+ height: 88rpx;
|
|
|
+ background: #D53533;
|
|
|
+ border-radius: 44rpx;
|
|
|
+ line-height: 88rpx;
|
|
|
+ text-align: center;
|
|
|
+ font-size:30rpx;
|
|
|
+ color: #FFFFFF;
|
|
|
+ margin-top: 62rpx;
|
|
|
+ margin-left:71rpx;
|
|
|
+ }
|
|
|
+</style>
|
