Browse Source

add collection

organize
刘嘉炜 3 years ago
parent
commit
7996618bc9
  1. 112
      src/pages/collection/info/info.vue

112
src/pages/collection/info/info.vue

@ -35,12 +35,32 @@
</view> </view>
</view> </view>
</view> </view>
<view class="ch-tab">
<view class="ct-item">
<view>全部</view>
</view>
<view class="ci-tab">
<view class="ct-item">
<view>全部</view>
</view>
<view class="ct-item">
<view class="active">退款</view>
</view>
</view>
<view class="ci-total">
收款100笔<text>10000.00</text>) 退款2笔<text>200.00</text>
</view>
<view class="ci-ls">
<view class="cl-item">
<view class="ci-name">
<view>线上-订购</view>
<view>+20.00</view>
</view>
<view class="ci-line">
<view>c2021122215468999</view>
<view>退款成功</view>
</view> </view>
<view class="ct-item">
<view>退款</view>
<view class="ci-line">
<view>221-12-12 14:13:25</view>
<view></view>
</view> </view>
</view> </view>
</view> </view>
@ -174,29 +194,87 @@ export default {
} }
} }
.ch-tab{
}
.ci-tab{
@include centerFlex(center);
border-bottom: 2upx solid #D8D8D8;
.ct-item{
flex-grow: 1;
@include centerFlex(center); @include centerFlex(center);
.ct-item{
flex-grow: 1;
@include centerFlex(center);
>view{
position: relative;
display: inline-block;
text-align: center;
line-height: 110upx;
height: 110upx;
>view{
position: relative;
display: inline-block;
text-align: center;
line-height: 110upx;
height: 110upx;
font-size: 32upx;
color: #9C9C9F;
&.active{
color: $themeColor;
&::after{ &::after{
content: ''; content: '';
display: block; display: block;
left: 0;
position: absolute;
left: 50%;
bottom: 0; bottom: 0;
width: 100%;
transform: translateX(-50%);
width: 200%;
height: 8upx; height: 8upx;
border-radius: 4upx; border-radius: 4upx;
background-color: $themeColor; background-color: $themeColor;
} }
} }
}
}
}
.ci-total{
padding: 0 24upx;
line-height: 96upx;
font-size: 24upx;
color: #9C9C9F;
@include textHide(1);
>text{
color: #F6843E;
}
}
.ci-ls{
padding: 0 30upx;
.cl-item{
padding: 30upx 0;
border-bottom: 2upx solid #D8D8D8;
.ci-name{
margin-bottom: 8upx;
@include centerFlex(space-between);
>view{
font-size: 32upx;
color: #1a1a1a;
width: 50%;
@include textHide(1);
&+view{
text-align: right;
font-weight: 500;
color: #F6843E;
}
}
} }
.ci-line{
@include centerFlex(space-between);
>view{
line-height: 34upx;
font-size: 24upx;
color: #9C9C9F;
@include textHide(1);
&+view{
flex-shrink: 0;
max-width: 50%;
}
}
}
} }
} }
} }
Loading…
Cancel
Save