|
|
@@ -4,7 +4,7 @@
|
|
|
<div class="hot-list-wrap">
|
|
|
<el-empty :image-size="200" v-if="bannerList.length < 1"></el-empty>
|
|
|
<!-- arrow="never" indicator-position="none" -->
|
|
|
- <el-carousel indicator-position="none" height="300px" :interval="5000" v-if="bannerList.length > 0">
|
|
|
+ <el-carousel indicator-position="none" height="250px" :interval="5000" v-if="bannerList.length > 0">
|
|
|
<el-carousel-item v-for="(item, index) in bannerList" :key="index">
|
|
|
<!-- <router-link to="/productTrials"> -->
|
|
|
<img style="width: 100%; height: 100%" :src="item.url" class="banner" />
|
|
|
@@ -92,9 +92,13 @@
|
|
|
</p>
|
|
|
</div>
|
|
|
<div class="btn-container">
|
|
|
- <button @click="handleClickExchange(item.skuId)"
|
|
|
- class="ui-btn primary medium default btn">
|
|
|
- {{item.stock == 0 ? '敬请期待' : '立即兑换'}}
|
|
|
+ <button v-if="item.stock == 0" @click="handleClickExchange(item.skuId)"
|
|
|
+ class="ui-btn gray medium btn">
|
|
|
+ 敬请期待
|
|
|
+ </button>
|
|
|
+ <button v-else @click="handleClickExchange(item.skuId)"
|
|
|
+ class="ui-btn primary medium btn">
|
|
|
+ 立即兑换
|
|
|
</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -141,9 +145,13 @@
|
|
|
</p>
|
|
|
</div>
|
|
|
<div class="btn-container">
|
|
|
- <button @click="handleClickExchange(item.skuId)"
|
|
|
+ <button v-if="item.stock == 0" @click="handleClickExchange(item.skuId)"
|
|
|
+ class="ui-btn medium default btn">
|
|
|
+ 敬请期待
|
|
|
+ </button>
|
|
|
+ <button v-else @click="handleClickExchange(item.skuId)"
|
|
|
class="ui-btn primary medium default btn">
|
|
|
- {{item.stock == 0 ? '敬请期待' : '立即兑换'}}
|
|
|
+ 立即兑换
|
|
|
</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -166,13 +174,13 @@ export default {
|
|
|
return {
|
|
|
bannerList: [
|
|
|
{
|
|
|
- url: require('@/assets/image/banner5.jpg')
|
|
|
+ url: require('@/assets/image/banner5.png')
|
|
|
},
|
|
|
{
|
|
|
- url: require('@/assets/image/banner6.jpg')
|
|
|
+ url: require('@/assets/image/banner6.png')
|
|
|
},
|
|
|
{
|
|
|
- url: require('@/assets/image/banner7.jpg')
|
|
|
+ url: require('@/assets/image/banner7.png')
|
|
|
},
|
|
|
],
|
|
|
page: 1,
|
|
|
@@ -416,7 +424,7 @@ button {
|
|
|
-webkit-appearance: none;
|
|
|
-moz-appearance: none;
|
|
|
appearance: none;
|
|
|
- background-color: #007fff;
|
|
|
+ /* background-color: #007fff; */
|
|
|
color: #fff;
|
|
|
border-radius: 2px;
|
|
|
border: none;
|
|
|
@@ -467,8 +475,10 @@ button {
|
|
|
}
|
|
|
|
|
|
.prize-card .img-container .prize-img {
|
|
|
- max-height: 120px;
|
|
|
- max-width: 120px;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ /* max-height: 159px;
|
|
|
+ max-width: 223px; */
|
|
|
}
|
|
|
|
|
|
.prize-card .content {
|
|
|
@@ -519,7 +529,7 @@ button {
|
|
|
font-weight: 500;
|
|
|
font-size: 14px;
|
|
|
line-height: 24px;
|
|
|
- color: #1e80ff;
|
|
|
+ color: #ff8462;
|
|
|
flex: auto;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -545,12 +555,16 @@ button {
|
|
|
border-radius: 16px;
|
|
|
}
|
|
|
|
|
|
-.ui-btn.medium {
|
|
|
+.medium {
|
|
|
padding: 5px 16px;
|
|
|
}
|
|
|
|
|
|
-.ui-btn.primary {
|
|
|
- background-color: #1d7dfa;
|
|
|
+.primary {
|
|
|
+ background-image: linear-gradient(to right, #f5b543,#faa029);
|
|
|
+}
|
|
|
+.gray{
|
|
|
+ background-color: gray;
|
|
|
+ opacity: 0.5;
|
|
|
}
|
|
|
|
|
|
.ui-btn {
|
|
|
@@ -629,7 +643,7 @@ button {
|
|
|
height: 1.8rem;
|
|
|
background-color: #fff;
|
|
|
border-radius: 1rem;
|
|
|
- font-size: 0.5rem;
|
|
|
+ font-size: 12px;
|
|
|
line-height: 1.8rem;
|
|
|
color: #8a9aa9;
|
|
|
padding: 0 0.83rem;
|
