feat(KIP-13387): 富文本内容兼容和毛玻璃效果

src/pages/parkingFee/parkingFee.vue

@@ -167,6 +167,7 @@
                   <div v-html="description"></div>  
               </div>
             </div>
+            <div v-if="!init_ch && description && description.length > 60" class="top_down_filter"></div>
             <div class="top_down" @click="top_display" v-if="!init_ch && description && description.length > 60"><van-icon name="arrow-down" /></div>
             <div class="top_down" @click="top_display" v-else><van-icon name="arrow-up" /></div>
           </div>
@@ -674,21 +675,22 @@ export default {
         }
 
         .info_show {
-          word-break: break-all;
-          text-overflow: ellipsis;
+          height: 150px;
           overflow: hidden;
-          display: -webkit-box;
-          -webkit-line-clamp: 2;
-          -webkit-box-orient: vertical;
         }
       }
-
+      .top_down_filter {
+        height: 150px;
+        margin-top: -150px;
+        background-color: #FBFCFF;
+        background: linear-gradient(to top, #FBFCFF, rgba(0, 123, 255, 0));
+      }
       .top_down {
         width: 100%;
         text-align: center;
         color: #999999;
-        margin-top: 25px;
-        margin-bottom: 20px;
+        padding-top: 25px;
+        padding-bottom: 20px;
       }
     }
   }

src/pages/parkingFeeV2/parkingFee.vue

@@ -160,6 +160,7 @@
                   <div v-html="description"></div>
               </div>
             </div>
+            <div v-if="!init_ch && description && description.length > 60" class="top_down_filter"></div>
             <div class="top_down" @click="top_display" v-if="!init_ch && description && description.length > 60"><van-icon name="arrow-down" /></div>
             <div class="top_down" @click="top_display" v-else><van-icon name="arrow-up" /></div>
           </div>
@@ -667,21 +668,22 @@ export default {
         }
 
         .info_show {
-          word-break: break-all;
-          text-overflow: ellipsis;
+          height: 150px;
           overflow: hidden;
-          display: -webkit-box;
-          -webkit-line-clamp: 2;
-          -webkit-box-orient: vertical;
         }
       }
-
+      .top_down_filter {
+        height: 150px;
+        margin-top: -150px;
+        background-color: #FBFCFF;
+        background: linear-gradient(to top, #FBFCFF, rgba(0, 123, 255, 0));
+      }
       .top_down {
         width: 100%;
         text-align: center;
         color: #999999;
-        margin-top: 25px;
-        margin-bottom: 20px;
+        padding-top: 25px;
+        padding-bottom: 20px;
       }
     }
   }