Commit 5b48fddd47eba0b79310b4948cf6cd1f63190b0b
1 parent
caf060c9
工会商品列表页面，商品列表添加左上角角标“工会选品”
Showing
4 changed files
with
30 additions
and
6 deletions
src/components/columnListBox/columnListBox.less
| @@ -49,6 +49,18 @@ | @@ -49,6 +49,18 @@ | ||
| 49 | break-inside: avoid; | 49 | break-inside: avoid; |
| 50 | // border-radius: 30px; | 50 | // border-radius: 30px; |
| 51 | overflow: hidden; | 51 | overflow: hidden; |
| 52 | + .discount-flag { | ||
| 53 | + position: absolute; | ||
| 54 | + top: 14px; | ||
| 55 | + left: 14px; | ||
| 56 | + z-index: 1; | ||
| 57 | + background: linear-gradient(90deg, #F9EE7A 0%, #FAD844 100%); | ||
| 58 | + padding: 3px 10px 6px 10px; | ||
| 59 | + color: #945A08; | ||
| 60 | + font-size: 22px; | ||
| 61 | + font-weight: 400; | ||
| 62 | + border-radius: 7px; | ||
| 63 | + } | ||
| 52 | } | 64 | } |
| 53 | } | 65 | } |
| 54 | } | 66 | } |
| 55 | \ No newline at end of file | 67 | \ No newline at end of file |
src/components/columnListBox/columnListBox.vue
| @@ -13,8 +13,12 @@ | @@ -13,8 +13,12 @@ | ||
| 13 | <goods-item-7 v-if="com == '7'" @jump="jump" @primary="primary" | 13 | <goods-item-7 v-if="com == '7'" @jump="jump" @primary="primary" |
| 14 | :item="item" | 14 | :item="item" |
| 15 | :goodType="goodType" | 15 | :goodType="goodType" |
| 16 | - :company="company" | ||
| 17 | - > | 16 | + :company="company"> |
| 17 | + | ||
| 18 | + <!-- 折扣角标 --> | ||
| 19 | + <div class="discount-flag" slot="flag" v-if="flag"> | ||
| 20 | + {{flag}} | ||
| 21 | + </div> | ||
| 18 | </goods-item-7> | 22 | </goods-item-7> |
| 19 | </div> | 23 | </div> |
| 20 | </div> | 24 | </div> |
| @@ -29,8 +33,12 @@ | @@ -29,8 +33,12 @@ | ||
| 29 | <goods-item-7 v-if="com == '7'" @jump="jump" @primary="primary" | 33 | <goods-item-7 v-if="com == '7'" @jump="jump" @primary="primary" |
| 30 | :item="item" | 34 | :item="item" |
| 31 | :goodType="goodType" | 35 | :goodType="goodType" |
| 32 | - :company="company" | ||
| 33 | - > | 36 | + :company="company"> |
| 37 | + | ||
| 38 | + <!-- 折扣角标 --> | ||
| 39 | + <div class="discount-flag" slot="flag" v-if="flag"> | ||
| 40 | + {{flag}} | ||
| 41 | + </div> | ||
| 34 | </goods-item-7> | 42 | </goods-item-7> |
| 35 | </div> | 43 | </div> |
| 36 | </div> | 44 | </div> |
| @@ -49,7 +57,7 @@ | @@ -49,7 +57,7 @@ | ||
| 49 | 57 | ||
| 50 | }; | 58 | }; |
| 51 | }, | 59 | }, |
| 52 | - props: ["lists", "com", "goodType", "company"], | 60 | + props: ["lists", "com", "goodType", "company", "flag"], |
| 53 | components: { | 61 | components: { |
| 54 | goodsItem7 | 62 | goodsItem7 |
| 55 | }, | 63 | }, |
src/components/goodsItem_7/goodsItem_7.vue
| @@ -13,6 +13,9 @@ | @@ -13,6 +13,9 @@ | ||
| 13 | <div v-if="goodType == 1" class="goods_tip"> | 13 | <div v-if="goodType == 1" class="goods_tip"> |
| 14 | 积分+现金 | 14 | 积分+现金 |
| 15 | </div> | 15 | </div> |
| 16 | + | ||
| 17 | + <!-- 角标 --> | ||
| 18 | + <slot name="flag"></slot> | ||
| 16 | </div> | 19 | </div> |
| 17 | <div class="content-box"> | 20 | <div class="content-box"> |
| 18 | <div class="title">{{item.title}}</div> | 21 | <div class="title">{{item.title}}</div> |
src/pages/labourUnion/labourUnion.vue
| @@ -76,7 +76,8 @@ | @@ -76,7 +76,8 @@ | ||
| 76 | <column-list-box class="column-list-box" @jump="toDetail" @primary="primary" | 76 | <column-list-box class="column-list-box" @jump="toDetail" @primary="primary" |
| 77 | :lists="lists[tabs.active]" | 77 | :lists="lists[tabs.active]" |
| 78 | com='7' | 78 | com='7' |
| 79 | - goodType='2'> | 79 | + goodType='2' |
| 80 | + flag='工会选品'> | ||
| 80 | </column-list-box> | 81 | </column-list-box> |
| 81 | </div> | 82 | </div> |
| 82 | </van-list> | 83 | </van-list> |