|
@@ -23,25 +23,25 @@
|
|
|
</view>
|
|
|
<view class="list">
|
|
|
<view class="list__item" v-for="(item,index) in data_list" :key="index" @click="clickItem(index)">
|
|
|
- <image v-if="current_index==index" class="image" src="../../static/imgs/read/img_buy_onselect_bi_status.png"></image>
|
|
|
- <image v-else class="image" src="../../static/imgs/read/img_buy_unselect_bi_status.png" mode=""></image>
|
|
|
- <view class="list__item__container">
|
|
|
+ <image v-if="current_index==index" class="image" src="@/static/imgs/read/img_buy_onselect_bi_status.png" mode="aspectFit"></image>
|
|
|
+ <image v-else class="image" src="@/static/imgs/read/img_buy_unselect_bi_status.png" mode="aspectFit"></image>
|
|
|
+ <view class="list__item__container">
|
|
|
<view class="list__item__container__image-info">
|
|
|
<view class="list__item__container__image-info__song">
|
|
|
- <image class="image" src="../../static/imgs/read/img_song_db.png"></image>
|
|
|
+ <image class="image" src="../../static/imgs/read/img_song_db.png" mode="aspectFit"></image>
|
|
|
<text v-if="item.give_coin>0" class="list__item__container__image-info__song__name">
|
|
|
送\n{{item.give_coin}}
|
|
|
</text>
|
|
|
</view>
|
|
|
<view class="list__item__container__image-info__icon">
|
|
|
- <image class="image" src="../../static/imgs/read/img_coin.png" mode=""></image>
|
|
|
+ <image class="image" src="@/static/imgs/read/img_coin.png" mode="aspectFit"></image>
|
|
|
</view>
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
<view class="list__item__container__coin">
|
|
|
{{item.name}}
|
|
|
</view>
|
|
|
<view class="list__item__container__rmb">
|
|
|
- ¥ {{item.amount/100}}
|
|
|
+ <text style="font-size: 13px;">¥</text> {{item.amount/100}}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -222,37 +222,46 @@
|
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
|
width: 50%;
|
|
|
- height: 246rpx;
|
|
|
- position: relative;
|
|
|
+ height: 140px; //246rpx;
|
|
|
+ position: relative;
|
|
|
// background-color: green;
|
|
|
+
|
|
|
.image{
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
|
+ // background-color: blue;
|
|
|
}
|
|
|
&__container{
|
|
|
- position: absolute;
|
|
|
+ z-index: 9;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
// justify-content: center;
|
|
|
align-items: center;
|
|
|
+ height: 100%;
|
|
|
+ // background-color: red;
|
|
|
|
|
|
&__image-info{
|
|
|
- margin-top: 30rpx;
|
|
|
+ margin-top: 20px;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- height: 90rpx;
|
|
|
+ height: 45px; //90rpx;
|
|
|
position: relative;
|
|
|
- // background-color: green;
|
|
|
+
|
|
|
&__song{
|
|
|
position: absolute;
|
|
|
left: -95rpx;
|
|
|
- top: 10rpx;
|
|
|
- width: 80rpx;
|
|
|
- height: 70rpx;
|
|
|
+ top: 3px;//10rpx;
|
|
|
+ width: 45px; //80rpx;
|
|
|
+ height: 40px; //70rpx;
|
|
|
flex-shrink: 0;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
+ flex-shrink: 0;
|
|
|
+
|
|
|
.image {
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
@@ -272,7 +281,7 @@
|
|
|
&__icon{
|
|
|
flex-shrink: 0;
|
|
|
width: 74rpx;
|
|
|
- height: 57rpx;
|
|
|
+ height: 29px; //57rpx;
|
|
|
.image{
|
|
|
width: 100%;
|
|
|
height: 100%;
|
|
@@ -280,13 +289,12 @@
|
|
|
}
|
|
|
}
|
|
|
&__coin{
|
|
|
- margin-top: 0rpx;
|
|
|
+ margin-top: 0px;
|
|
|
font-size: 19px;
|
|
|
color: #6D6D82;
|
|
|
}
|
|
|
&__rmb{
|
|
|
- position: absolute;
|
|
|
- bottom: -33%;
|
|
|
+ margin-top: 11px;
|
|
|
font-size: 17px;
|
|
|
}
|
|
|
}
|