product price tag

@@ -13,9 +13,7 @@
         <p class="product-name">{{product.productName}}</p>
         <div class="price-wrap">
           <div class="price-left">
-            <label v-if="product.collage_activity_id" class="collage-tag">
-              <span>拼团价</span>
-            </label>
+            <label v-if="priceTag" class="price-tag" :class="priceTag"></label>
             <span class="price">￥{{salesPrice}}</span>
           </div>
           <div class="btn-right btn-buy hover-opacity" :class="{'btn-disable': !hasStock}">
@@ -74,6 +72,17 @@ export default {
     hasStock() {
       return this.product.has_stock !== 'N';
     },
+    priceTag() {
+      let className = '';
+
+      if (+this.product.productType === 2) {
+        className = 'ufo-tag';
+      } else if (this.product.collage_activity_id) {
+        className = 'collage-tag';
+      }
+
+      return className;
+    },
     salesPrice() {
       return this.product.collage_activity_id ? this.product.collage_price : this.product.salesPrice;
     }
@@ -215,22 +224,23 @@ export default {
     align-items: center;
   }
 
-  .collage-tag {
+  .price-tag {
     width: 94px;
     height: 28px;
     margin-right: 16px;
-    background-color: #ff5660;
-    color: #fff;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    overflow: hidden;
+    background-size: 100%;
+  }
 
-    > * {
-      font-size: 24px;
-      font-weight: 300;
-      transform: scale(0.7, 0.7);
-    }
+  .collage-tag {
+    background-image: url('~statics/image/article/pt-price.png');
+  }
+
+  .ufo-tag {
+    background-image: url('~statics/image/article/ufo-price.png');
+  }
+
+  .price {
+    line-height: 1;
   }
 }
 

@@ -618,23 +618,24 @@ export default {
 
   .contant-list {
     position: relative;
+
+    .empty-tip {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 28px;
+      color: #ddd;
+      position: absolute;
+      top: 0;
+      bottom: 240px;
+    }
   }
 
   .pannel-wrap {
     background-color: #f7f7f7;
   }
 
-  .empty-tip {
-    width: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    font-size: 28px;
-    color: #ddd;
-    position: absolute;
-    top: 0;
-    bottom: 240px;
-  }
 
   .loading {
     padding: 20px 0;

@@ -613,7 +613,6 @@ ul {
 
 img.lazy-img {
     opacity: 0;
-    transition: opacity 800ms ease-in-out;
 }
 
 img[lazy=loading] {