Authored by 张文文

已售出商品添加蒙层 review by zhiming.hu

@@ -2,7 +2,14 @@ @@ -2,7 +2,14 @@
2 <div class="bg" v-if="list.length"> 2 <div class="bg" v-if="list.length">
3 <div class="second-list-item" v-for="(product,index) in list" @click="goDetail(product, index)" 3 <div class="second-list-item" v-for="(product,index) in list" @click="goDetail(product, index)"
4 :key="index" :class="(index) % 2 === 0 && 'magrin-right'"> 4 :key="index" :class="(index) % 2 === 0 && 'magrin-right'">
5 - <ImgSize class="item-imge" :src="product.secondhand_image" :width="343" :height="343"/> 5 +
  6 + <div v-if="product.status === 100" class="dim-background">
  7 + <ImgSize class="dim-imge" :src="product.secondhand_image" :width="343" :height="343"/>
  8 + </div>
  9 + <div v-else class="item-background">
  10 + <ImgSize class="item-imge" :src="product.secondhand_image" :width="343" :height="343"/>
  11 + </div>
  12 +
6 <div class="item-bottom"> 13 <div class="item-bottom">
7 <div class="item-price"> 14 <div class="item-price">
8 <span>{{product.skup_price && '¥'}}</span><span>{{product.skup_price || ' '}}</span> 15 <span>{{product.skup_price && '¥'}}</span><span>{{product.skup_price || ' '}}</span>
@@ -126,6 +133,10 @@ export default { @@ -126,6 +133,10 @@ export default {
126 margin-bottom: 16px; 133 margin-bottom: 16px;
127 } 134 }
128 135
  136 + .item-background {
  137 + background: transparent;
  138 + }
  139 +
129 .item-imge { 140 .item-imge {
130 width: 344px; 141 width: 344px;
131 height: 344px; 142 height: 344px;
@@ -133,6 +144,21 @@ export default { @@ -133,6 +144,21 @@ export default {
133 border-top-right-radius: 16px; 144 border-top-right-radius: 16px;
134 } 145 }
135 146
  147 + .dim-background {
  148 + background: url(~statics/image/list/Group@2x.png) no-repeat;
  149 + background-size: 50% 50%;
  150 + background-position: center;
  151 + }
  152 +
  153 + .dim-imge {
  154 + width: 344px;
  155 + height: 344px;
  156 + border-top-left-radius: 16px;
  157 + border-top-right-radius: 16px;
  158 + opacity:0.6;
  159 + filter: alpha(opacity=60);
  160 + }
  161 +
136 .item-bottom { 162 .item-bottom {
137 padding: 20px 14px 30px 20px; 163 padding: 20px 14px 30px 20px;
138 display: flex; 164 display: flex;