二手车交易，全部接口对接

src/views/secondHandCar/wantBuySale.vue

@@ -8,19 +8,17 @@
     <div class="contentWrap">
       <div class="titleWrap wrapCommon">
         <div class="info">
-          <span>牵引车</span>
-          <span>全落地</span>
-          <span>黄牌</span>
-          <span>帕菲特</span>
-          <span>八万公里</span>
-          <span>国5</span>
+          <span>{{ detailInfo.vehicleType }}</span>
+          <span>{{ detailInfo.boardType?.label }}</span>
+          <span>{{ detailInfo.emissionStandard?.label }}</span>
         </div>
         <div class="time">
-          <span>2025-03-05</span><span>江苏苏州</span><span>发布</span>
+          <span>{{ detailInfo.createTime?.substring(0,10) }}</span><span>发布</span>
         </div>
         <div class="price">
-          <span>20.5</span>
-          <span>万</span>
+          <span class="num">{{formatNumber(detailInfo.minPrice) }}</span> <span  class="danwei">万</span>
+          <span class="su">~</span>
+          <span class="num">{{formatNumber(detailInfo.maxPrice) }}</span> <span  class="danwei">万</span>
         </div>
       </div>
       <div class="detailInfoWrap wrapCommon">
@@ -29,26 +27,24 @@
         </div>
         <div class="descItem descCommon">
           <div class="itemInfo">
-            <span>拖车</span>
+            <span>{{ detailInfo.vehicleType }}</span>
             <span>拖车类型</span>
           </div>
           <div class="suGang"></div>
           <div class="itemInfo">
-            <span>全落地&nbsp;&nbsp;</span>
+            <span>{{ detailInfo.boardType?.label }}&nbsp;&nbsp;</span>
             <span>拖车落板</span>
           </div>
           <div class="suGang"></div>
           <div class="itemInfo">
-            <span>国五</span>
+            <span>{{ detailInfo.emissionStandard?.label }}</span>
             <span>排放标准</span>
           </div>
         </div>
         <div>
           <img class="descImg"  src="@/assets/secondHandCar/description.png" />
         </div>
-        <div class="descCommon desc">
-          事故事故手动阀时空裂缝就能看拉萨你发凯撒老大飞机考拉说法你时空裂缝距离考试纽福克斯就发了斯
-        </div>
+        <div class="descCommon desc">{{detailInfo.desc}}</div>
       </div>
       <div  class="btn"  @click="noMultipleClicks(handle)">我有车源</div>
     </div>
@@ -57,23 +53,54 @@
 
 <script>
 import {myMixins} from "@/utils/myMixins"
+import {carInfoDetail, saveRecord} from "@/api/secondHandCar";
 export default {
   name: "wantBuySale",
   mixins:[myMixins],
   data(){
     return{
-      current: 0,
-      noClick:true
+      noClick:true,
+      id:'',
+      queryType:'',
+      detailInfo:'',
+      duration:'',
+      startTime: null, // 记录进入时间
+      recordType:1,
     }
   },
   async mounted() {
+    // 页面加载时记录进入时间
+    this.startTime = new Date();
+    const urlParams = new URLSearchParams(window.location.search);
+    this.id=this.$route.query.id ||  urlParams.get('id');
+    this.queryType=this.$route.query.queryType || urlParams.get('queryType');
+    if( this.id) {
+      let res = await carInfoDetail({
+        id: this.id,
+        queryType: this.queryType,
+      })
+      this.detailInfo = res?.data
+    }
+  },
+  beforeUnmount() {
+    this.getDuration()
   },
   methods:{
-    onChange(index) {
-      this.current = index;
+    getDuration(){
+      // 页面卸载时记录离开时间并计算浏览时长
+      const endTime = new Date();
+      const duration = (endTime - this.startTime) / 1000; // 计算时长（秒）
+      // console.log('页面卸载时间:', endTime);
+      console.log('浏览时长:', duration, '秒');
+      this.saveRecord(duration);
+    },
+    async saveRecord(duration){
+      await saveRecord({type:this.recordType,carInfoId:this.id,duration})
     },
     handle(){
-
+      this.recordType=2
+      this.getDuration()
+      window.location.href = `tel:${this.detailInfo.contactNumber}`;
     },
   }
 }
@@ -139,21 +166,22 @@ export default {
       span:first-child{
         margin-right: 20px;
       }
-      span:last-child{
-        margin-left: 10px;
-      }
     }
     .price{
       color: #FF5533;
-      line-height: 28px;
       font-weight: 600;
-      span:first-child{
+      display: flex;
+      align-items: center;
+     .num{
         font-size: 20px;
-        margin-right: 4px;
+       margin-right: 4px;
       }
-      span:last-child{
+      .danwei,.su{
         font-size: 11px;
       }
+      .su{
+        margin: 0 4px;
+      }
     }
   }
   .detailInfoWrap{