|
@@ -1,190 +1,262 @@
|
|
|
<template>
|
|
|
<view class="content">
|
|
|
- <view class="carTop">
|
|
|
- <view class="carCont">
|
|
|
- <view class="carModel">
|
|
|
- <image src="../../static/logo.png" mode="" class="carLogo"></image>
|
|
|
- <view class="carModelCont">
|
|
|
- <view class="carMcTop">
|
|
|
- <view class="plateNumber">鲁A12345</view>
|
|
|
- <view class="carTime">9年4个月</view>
|
|
|
- <view class="carA">A类车</view>
|
|
|
- </view>
|
|
|
- <view class="carMcTxt">2021款 1.2T 无极S-CVT 精英PLUS版 过精英PLUS版精英PLUS版长长...</view>
|
|
|
- <view class="carTitleBox">
|
|
|
- <view class="carTitle">潜在车辆</view>
|
|
|
- <view class="carTitle">矩形</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view>
|
|
|
- <image class="carUpimg" src="../../static/img/icon_arrow_up.png" mode=""></image>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="carData">
|
|
|
- <view class="carDataLine">最新里程:29301km</view>
|
|
|
- <view class="carDataLine">累计消费:2930.00</view>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="carnotes">车辆备注:这是备注信息</view>
|
|
|
- </view>
|
|
|
+ <view class="nodataBox" v-show="nodataShow">
|
|
|
+ <image src="http://dmsphoto.66km.com.cn/thFiles/3C95A4C5-73F8-4B34-902B-703B8A0825C9.png" mode="widthFix" class="nodataImg"></image>
|
|
|
+ <view class="noTxt">暂无数据</view>
|
|
|
</view>
|
|
|
-
|
|
|
- <view class="box">
|
|
|
- <view class="line">
|
|
|
- <view class="lineTop">
|
|
|
- <view class="lineTop1">
|
|
|
- <view class="lineTopNs">
|
|
|
- <view class="nsTxt">年审日期</view>
|
|
|
- <view class="nsStatus">已过期</view>
|
|
|
+ <view class="carLine" v-for="(item,index ) in carList" @click="extCarInfo(item)">
|
|
|
+ <view class="carTop" >
|
|
|
+ <view class="carCont">
|
|
|
+ <view class="carModel">
|
|
|
+ <image :src="item.BrandLogo" mode="" class="carLogo"></image>
|
|
|
+ <view class="carModelCont">
|
|
|
+ <view class="carMcTop">
|
|
|
+ <view class="plateNumber">{{item.PlateNumber}}</view>
|
|
|
+ <view class="carTime">9年4个月</view>
|
|
|
+ <view class="carA">{{item.carType}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="carMcTxt">{{item.CarModel}}</view>
|
|
|
+ <view class="carTitleBox" v-if="item.carDetailInfo.labelName">
|
|
|
+ <view class="carTitle" v-for="(v,i) in item.carDetailInfo.labelName.split(',')">{{v}}</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view class="lineTimeBox">
|
|
|
- <span>2019-01-21</span>
|
|
|
+ <view>
|
|
|
<image class="carUpimg" src="../../static/img/icon_arrow_up.png" mode=""></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="lineTop2">
|
|
|
- <view class="chaoqi">超期天数:10</view>
|
|
|
- <view class="lineBtn">发送提醒</view>
|
|
|
+ <view class="carData">
|
|
|
+ <view class="carDataLine">最新里程:{{item.Milage}}km</view>
|
|
|
+ <view class="carDataLine">累计消费:2930.00</view>
|
|
|
+
|
|
|
</view>
|
|
|
+ <view class="carnotes">车辆备注:{{item.carDetailInfo.Comment}}</view>
|
|
|
</view>
|
|
|
- <view class="lineCont">
|
|
|
- <view class="lcLine">
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="box">
|
|
|
+ <view class="line">
|
|
|
+ <view class="lineTop">
|
|
|
<view class="lineTop1">
|
|
|
<view class="lineTopNs">
|
|
|
- <view class="nsTxt">保险提醒</view>
|
|
|
- <view class="nsStatus">即将到期</view>
|
|
|
+ <view class="nsTxt">年审日期</view>
|
|
|
+ <view class="nsStatus" v-if="!isDateGreater(item.carDetailInfo.NextAuditTime)">
|
|
|
+ <span v-if="daysUntilDate(item.carDetailInfo.NextAuditTime)>30">已过期</span>
|
|
|
+ <span v-else>即将过期</span>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<view class="lineTimeBox">
|
|
|
- <span>2019-01-21</span>
|
|
|
+ <span>{{item.carDetailInfo.NextAuditTime}}</span>
|
|
|
<image class="carUpimg" src="../../static/img/icon_arrow_up.png" mode=""></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="carData">
|
|
|
- <view class="carDataLine">交强险到期:2011-02-12</view>
|
|
|
- <view class="carDataLine">商业险到期:2011-02-12</view>
|
|
|
- </view>
|
|
|
- <view class="carnotes">保险公司:这是保险公司名</view>
|
|
|
<view class="lineTop2">
|
|
|
- <view class="chaoqi">距离天数:10</view>
|
|
|
+ <view class="chaoqi">
|
|
|
+ <span v-if="!isDateGreater(item.carDetailInfo.NextAuditTime)">超期天数:{{daysUntilDate(item.carDetailInfo.NextAuditTime)}}天</span>
|
|
|
+
|
|
|
+ </view>
|
|
|
<view class="lineBtn">发送提醒</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <!-- 提醒商机 -->
|
|
|
- <view class="line">
|
|
|
- <view class="lineTop">
|
|
|
- <view class="lineTop1">
|
|
|
- <view class="lineTopNs">
|
|
|
- <view class="nsTxt">提醒商机</view>
|
|
|
-
|
|
|
- </view>
|
|
|
- <view class="lineTimeBox">
|
|
|
- <span style="color: #FF0000;">2条</span>
|
|
|
- <image class="carUpimg" src="../../static/img/icon_arrow_up.png" mode=""></image>
|
|
|
+ <view class="lineCont">
|
|
|
+ <view class="lcLine">
|
|
|
+ <view class="lineTop1">
|
|
|
+ <view class="lineTopNs">
|
|
|
+ <view class="nsTxt">保险提醒</view>
|
|
|
+ <view class="nsStatus" v-if="!isDateGreater(item.carDetailInfo.InsuranceExpireDate)">
|
|
|
+ <span v-if="daysUntilDate(item.carDetailInfo.InsuranceExpireDate)>30">已过期</span>
|
|
|
+ <span v-else>即将过期</span>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="lineTimeBox" v-if="item.carDetailInfo.InsuranceExpireDate">
|
|
|
+ <span>{{item.carDetailInfo.InsuranceExpireDate.slice(0,10)}}</span>
|
|
|
+ <image class="carUpimg" src="../../static/img/icon_arrow_up.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="carData">
|
|
|
+ <view class="carDataLine">交强险到期:{{item.carDetailInfo.CompulsoryInsuranceTime}}</view>
|
|
|
+ <view class="carDataLine">商业险到期:{{item.carDetailInfo.CommercialInsuranceTime}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="carnotes">保险公司:{{item.carDetailInfo.inscName}}</view>
|
|
|
+ <view class="lineTop2">
|
|
|
+ <view class="chaoqi">距离天数:{{daysUntilDate(item.carDetailInfo.InsuranceExpireDate)}}天</view>
|
|
|
+ <view class="lineBtn">发送提醒</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
+
|
|
|
</view>
|
|
|
-
|
|
|
</view>
|
|
|
- <view class="lineCont">
|
|
|
- <view class="lcLine">
|
|
|
+
|
|
|
+ <!-- 提醒商机 -->
|
|
|
+ <view class="line" v-if="false">
|
|
|
+ <view class="lineTop">
|
|
|
<view class="lineTop1">
|
|
|
<view class="lineTopNs">
|
|
|
- <view class="nsTxt">提醒类别:机油滤清器</view>
|
|
|
+ <view class="nsTxt">提醒商机</view>
|
|
|
+
|
|
|
</view>
|
|
|
- </view>
|
|
|
- <view class="carData">
|
|
|
- <view class="carDataLine">下次服务日期:2024-02-12</view>
|
|
|
- <view class="carDataLine">下次服务里程:93843km</view>
|
|
|
- </view>
|
|
|
- <view class="carnotes">上次到店:2022-01-21</view>
|
|
|
- <view class="lineTop2">
|
|
|
- <view class="chaoqi">超期天数:10</view>
|
|
|
- <view class="lineBtn">发送提醒</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="lcLine">
|
|
|
- <view class="lineTop1">
|
|
|
- <view class="lineTopNs">
|
|
|
- <view class="nsTxt">保养提醒</view>
|
|
|
+ <view class="lineTimeBox">
|
|
|
+ <span style="color: #FF0000;">2条</span>
|
|
|
+ <image class="carUpimg" src="../../static/img/icon_arrow_up.png" mode=""></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="carData">
|
|
|
- <view class="carDataLine">下次服务日期:2024-02-12</view>
|
|
|
- <view class="carDataLine">下次服务里程:93843km</view>
|
|
|
- </view>
|
|
|
- <view class="carnotes">上次到店:2022-01-21</view>
|
|
|
- <view class="lineTop2">
|
|
|
- <view class="chaoqi">超期天数:10</view>
|
|
|
- <view class="lineBtn">发送提醒</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 提醒商机 -->
|
|
|
- <!-- 检测异常商机 -->
|
|
|
- <view class="line">
|
|
|
- <view class="lineTop">
|
|
|
- <view class="lineTop1">
|
|
|
- <view class="lineTopNs">
|
|
|
- <view class="nsTxt">检测异常商机</view>
|
|
|
-
|
|
|
+ </view>
|
|
|
+ <view class="lineCont">
|
|
|
+ <view class="lcLine">
|
|
|
+ <view class="lineTop1">
|
|
|
+ <view class="lineTopNs">
|
|
|
+ <view class="nsTxt">提醒类别:机油滤清器</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="carData">
|
|
|
+ <view class="carDataLine">下次服务日期:2024-02-12</view>
|
|
|
+ <view class="carDataLine">下次服务里程:93843km</view>
|
|
|
+ </view>
|
|
|
+ <view class="carnotes">上次到店:2022-01-21</view>
|
|
|
+ <view class="lineTop2">
|
|
|
+ <view class="chaoqi">超期天数:</view>
|
|
|
+ <view class="lineBtn">发送提醒</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
- <view class="lineTimeBox">
|
|
|
- <span style="color: #FF0000;">2条</span>
|
|
|
- <image class="carUpimg" src="../../static/img/icon_arrow_up.png" mode=""></image>
|
|
|
+ <view class="lcLine">
|
|
|
+ <view class="lineTop1">
|
|
|
+ <view class="lineTopNs">
|
|
|
+ <view class="nsTxt">保养提醒</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="carData">
|
|
|
+ <view class="carDataLine">下次服务日期:2024-02-12</view>
|
|
|
+ <view class="carDataLine">下次服务里程:93843km</view>
|
|
|
+ </view>
|
|
|
+ <view class="carnotes">上次到店:2022-01-21</view>
|
|
|
+ <view class="lineTop2">
|
|
|
+ <view class="chaoqi">超期天数:10</view>
|
|
|
+ <view class="lineBtn">发送提醒</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
+
|
|
|
</view>
|
|
|
-
|
|
|
</view>
|
|
|
- <view class="lineCont">
|
|
|
- <view class="lcLine">
|
|
|
+ <!-- 提醒商机 -->
|
|
|
+ <!-- 检测异常商机 -->
|
|
|
+ <view class="line" v-if="false">
|
|
|
+ <view class="lineTop">
|
|
|
<view class="lineTop1">
|
|
|
<view class="lineTopNs">
|
|
|
<view class="nsTxt">检测异常商机</view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="lineTimeBox">
|
|
|
+ <span style="color: #FF0000;">2条</span>
|
|
|
+ <image class="carUpimg" src="../../static/img/icon_arrow_up.png" mode=""></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
- <view class="carData">
|
|
|
- <view class="carDataLine">下次服务日期:2024-02-12</view>
|
|
|
- <view class="carDataLine" style="color: #FF0000;">距离天数:10</view>
|
|
|
- </view>
|
|
|
- <view class="carnotes">检测结果:长了换行1</view>
|
|
|
- <view class="carData" style="padding-top: 16rpx;">
|
|
|
- <view class="carDataLine">检测日期:2024-02-12</view>
|
|
|
- <view class="carDataLine" >检测里程:9383km</view>
|
|
|
- </view>
|
|
|
- <view class="carnotes">检测门店:这是门店名称长了换行展示1</view>
|
|
|
- <view class="lineTop2">
|
|
|
- <view class="chaoqi"></view>
|
|
|
- <view class="lineBtn">发送提醒</view>
|
|
|
- </view>
|
|
|
+
|
|
|
</view>
|
|
|
-
|
|
|
+ <view class="lineCont">
|
|
|
+ <view class="lcLine">
|
|
|
+ <view class="lineTop1">
|
|
|
+ <view class="lineTopNs">
|
|
|
+ <view class="nsTxt">检测异常商机</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <view class="carData">
|
|
|
+ <view class="carDataLine">下次服务日期:2024-02-12</view>
|
|
|
+ <view class="carDataLine" style="color: #FF0000;">距离天数:10</view>
|
|
|
+ </view>
|
|
|
+ <view class="carnotes">检测结果:长了换行1</view>
|
|
|
+ <view class="carData" style="padding-top: 16rpx;">
|
|
|
+ <view class="carDataLine">检测日期:2024-02-12</view>
|
|
|
+ <view class="carDataLine" >检测里程:9383km</view>
|
|
|
+ </view>
|
|
|
+ <view class="carnotes">检测门店:这是门店名称长了换行展示1</view>
|
|
|
+ <view class="lineTop2">
|
|
|
+ <view class="chaoqi"></view>
|
|
|
+ <view class="lineBtn">发送提醒</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
|
|
|
+
|
|
|
+ </view>
|
|
|
</view>
|
|
|
+ <!-- 检测异常商机 -->
|
|
|
</view>
|
|
|
- <!-- 检测异常商机 -->
|
|
|
+
|
|
|
</view>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
export default {
|
|
|
+ props:['token'],
|
|
|
data() {
|
|
|
return {
|
|
|
-
|
|
|
+ carList:[],
|
|
|
+ carInfo:'',
|
|
|
+ nodataShow:false
|
|
|
}
|
|
|
},
|
|
|
onLoad() {
|
|
|
|
|
|
},
|
|
|
+ computed: {
|
|
|
+ // 计算属性来判断日期是否大于当前日期
|
|
|
+ isDateGreater() {
|
|
|
+ return (val)=>{
|
|
|
+ const currentDate = new Date();
|
|
|
+ const compareDate = new Date(val);
|
|
|
+
|
|
|
+ return compareDate > currentDate;
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
+ daysUntilDate() {
|
|
|
+ return (val)=>{
|
|
|
+ const today = new Date();
|
|
|
+ const specificDate = new Date(val);
|
|
|
+
|
|
|
+ const diffTime = Math.abs(today - specificDate);
|
|
|
+ var time=diffTime / (1000 * 60 * 60 * 24);
|
|
|
+ return parseInt(time);
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
methods: {
|
|
|
-
|
|
|
+ getdata(){
|
|
|
+ this.extCarInfo()
|
|
|
+ /* var that=this;
|
|
|
+ this.$http('enterprise/wechat/extCustomerInfo', {
|
|
|
+ corpID:'wpMGjbBgAA_zIu6wbKy48zFSbGiGeP8g',
|
|
|
+ extUserId:'wmMGjbBgAA0JAbGD5Vu8BzEuYgZhvhOA',
|
|
|
+ token:this.token
|
|
|
+ }, 'GET').then(res => {
|
|
|
+ this.carList=res.data.data.map
|
|
|
+ }) */
|
|
|
+
|
|
|
+ },
|
|
|
+ extCarInfo(item){
|
|
|
+ var that=this;
|
|
|
+ this.customerId=uni.getStorageSync('customerId')
|
|
|
+ if(!this.customerId){
|
|
|
+ this.nodataShow=true
|
|
|
+ }else{
|
|
|
+ this.$http('enterprise/wechat/extCarInfo', {
|
|
|
+ id:this.customerId,
|
|
|
+
|
|
|
+ //token:this.token
|
|
|
+ }, 'GET').then(res => {
|
|
|
+ this.carList=res.data
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
@@ -215,7 +287,7 @@
|
|
|
padding-left: 24rpx;
|
|
|
}
|
|
|
.carModelCont{
|
|
|
- width: 560rpx;
|
|
|
+ width: 540rpx;
|
|
|
padding-left: 12rpx;
|
|
|
}
|
|
|
.carMcTop{
|
|
@@ -363,4 +435,19 @@ color: #FF0000;
|
|
|
.lcLine .carnotes{
|
|
|
padding-left: 0;padding-right: 0;
|
|
|
}
|
|
|
+ .nodataImg{
|
|
|
+ width: 400rpx;
|
|
|
+ padding-top: 100rpx;
|
|
|
+ }
|
|
|
+ .noTxt{
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #999999;
|
|
|
+ padding-top: 50rpx;
|
|
|
+ }
|
|
|
+ .nodataBox{
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .carLine{
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ }
|
|
|
</style>
|