车辆列表滚动效果

src/App.vue

@@ -56,6 +56,11 @@
     height: 0.14rem !important;
   }
 }
+  
+/*替换关闭按钮*/  
+img[src="http://api0.map.bdimg.com/images/iw_close1d3.gif"]{
+  left:calc(3.97rem - 18px) !important;
+}
 
 .BMap_shadow {
   display: none;

src/views/components/carMile.vue

@@ -17,7 +17,7 @@
       </thead>
     </table>
     <div style="width:100%;height:1.5rem;">
-      <vueSeamless :data="carMile" :class-option="calssOption" class="tablebox_item_warp">
+      <vueSeamless v-if="carMile.length >= 1" :data="carMile" :class-option="calssOption" class="tablebox_item_warp">
         <div
           :class="index == 0 ? 'tablebox_item no1' : index == 1 ? 'tablebox_item no2' : index == 2 ? 'tablebox_item no3' : 'tablebox_item'"
           v-for="(item, index) in carMile" :key="'car' + index">
@@ -119,7 +119,8 @@ export default {
   overflow: hidden;
 
   .tablebox_item_warp {
-    height: 1.5rem;
+    height: 1.35rem;
+    margin-top: 0.15rem;
     overflow: hidden;
 
     .tablebox_item {
@@ -157,7 +158,7 @@ export default {
         background: url(~@/assets/img/tab2.png);
         background-size: 100% 100%;
 
-        div {
+        .txt {
           font-family: "FZSK";
           font-size: 0.18rem;
           letter-spacing: 0px;
@@ -176,7 +177,7 @@ export default {
         background: url(~@/assets/img/tab3.png);
         background-size: 100% 100%;
 
-        div {
+        .txt {
           font-family: "FZSK";
           font-size: 0.18rem;
           letter-spacing: 0px;

src/views/components/carWarn.vue

@@ -15,7 +15,7 @@
       </thead>
     </table>
     <div style="width:100%;height:1.5rem;">
-      <vueSeamless :data="carWarn" :class-option="calssOption" class="tablebox_item_warp">
+      <vueSeamless v-if="carWarn.length >= 1" :data="carWarn" :class-option="calssOption" class="tablebox_item_warp">
         <div class="tablebox_item" v-for="(item, index) in carWarn" :key="'carWarn' + index"
           :style="{ paddingTop: index == 0 ? '0' : '0.08rem' }">
           <div style="width:40%;">{{ item.TimeStamp }}</div>
@@ -146,7 +146,8 @@ export default {
   }
 
   .tablebox_item_warp {
-    height: 1.5rem;
+    height: 1.35rem;
+    margin-top: 0.15rem;
     overflow: hidden;
 
     .tablebox_item {

src/views/components/pathMap.vue

@@ -158,7 +158,7 @@ export default {
           //   objdata: { carNo: carNo, deviceId: key, resData: res.Data, res2Data: res2.Data }
           // })
           this.markList.push(marker);
-          let sContent = `<div style="font-size:0.14rem;line-height:0.22rem;padding:0 0.05rem 0 0.25rem;">
+          let sContent = `<div style="font-size:0.14rem;line-height:0.22rem;padding:0 0.05rem 0 0.15rem;">
                             <div style="display:flex;align-items:center;margin-bottom:0.15rem;font-style: italic;font-size:0.2rem;font-family: FZSK;">
                               <div style="color: #ffffff;margin-right:0.1rem;">${carNo}</div>
                               <div style="display:inline-block;color:${res.Data.SbcStatus == 3 ? "#ffffff" : "#062766"};background:${res.Data.SbcStatus == 3 ? "#1dd58e !important" : "#9ab3c6 !important"};width:0.65rem;text-align:center;border-radius:100px;font-size:0.16rem;padding:0.04rem 0;">${this.locationStatus[res.Data.SbcStatus]}</div>
@@ -166,7 +166,7 @@ export default {
                             </div>
                             <div style="display:flex;margin-bottom:0.1rem;max-width:3.5rem;"><div style="color: #ffffff;">设备位置：</div><div style="color: #ffffff;flex:1;">${res2.Data}</div></div>
                             <div style="display:flex;"><div style="color: #ffffff;">最后定位时间：</div><div style="color: #ffffff;flex:1;">${res.Data.GPSTimeStamp.replace("T", " ")}</div></div>
-                            <div style="text-align:center;margin:0.12rem 0 0;max-width:3.25rem;"> <div style="display: inline-block;width:0.88rem;border-radius: 100px;text-align:center;color: #1b2f57;font-style: italic;font-family: FZSK;cursor: pointer;background:#facd89 !important;font-size:0.18rem;font-weight:bold;padding:0.06rem 0;" id="btnPath_${deviceId}">行车轨迹</div></div>
+                            <div style="text-align:center;margin:0.12rem 0 0;max-width:3.25rem;"> <div style="display: inline-block;width:0.88rem;border-radius: 100px;text-align:center;color: #1b2f57;font-style: italic;font-family: FZSK;cursor: pointer;background:#facd89 !important;font-size:0.16rem;font-weight:bold;padding:0.04rem 0;" id="btnPath_${deviceId}">行车轨迹</div></div>
                         </div>`;
           let infoWindow = new BMap.InfoWindow(sContent, { width: 367, height: 220 });
           // marker添加点击事件