xuxueyang
2024-07-12 c58aff5b2a349c6b1fc8a4a3f474f7f8cc529e09
sub_pages/customer/trade/detail.vue
@@ -1,6 +1,16 @@
<template>
   <view>
   <view class="trade-detail">
      <view class="top-img-container">
         <image src="" class="top-img"></image>
         <view class="icon-container">
            <image src="../../../static/common/icon-sc.png" class="icon-sc"></image>
            <view class="num">12</view>
         </view>
         <view class="icon-container">
            <image src="../../../static/common/icon-shop.png" class="icon-shop"></image>
         </view>
      </view>
   </view>
</template>
@@ -17,6 +27,51 @@
   }
</script>
<style>
<style lang="scss" scoped>
.trade-detail{
   .top-img-container{
      position: relative;
      .top-img{
         width: 750rpx;
         height: 764rpx;
      }
      .icon-container{
         position: absolute;
         top: 20rpx;
         width: 80rpx;
         height: 80rpx;
         background: rgba(0,0,0,0.42);
         .icon-sc{
            width: 54rpx;
            height: 54rpx;
            margin: 0 auto;
            margin-top: 12rpx;
         }
         .icon-shop{
            width: 54rpx;
            height: 54rpx;
            margin: 0 auto;
            margin-top: 12rpx;
         }
         .num{
            font-weight: 400;
            font-size: 20rpx;
            color: #FFFFFF;
            line-height: 28rpx;
            position: absolute;
            top: 6prx;
            right: 16rpx;
         }
      }
      .icon-container:last-child{
         left: 120rpx;
      }
      .icon-container:first-child{
         left: 20rpx;
      }
   }
}
</style>