@mixin zj-card { background: #FFFFFF; border-radius: 20rpx; box-shadow: -10rpx 12rpx 96rpx 2rpx rgba(31, 36, 99, 0.1); overflow: hidden; position: relative; } .footer-btn-group { padding: 25rpx 30rpx; display: flex; align-items: center; ::v-deep .u-button { flex-shrink: 0; font-size: 32rpx; margin-right: 30rpx; border-radius: 20rpx !important; &:first-child { flex: 1; } &:last-child { width: 400rpx !important; margin-right: 0; } } } .common-goods-list { .item { margin-top: 30rpx; background: #ffffff; padding: 20rpx 30rpx; position: relative; .soldout { position: absolute; right: 120rpx; top: 50rpx; image { width: 120rpx; } } .top { display: flex; align-items: center; image { width: 80rpx; height: 80rpx; border-radius: 50%; flex-shrink: 0; } .user { margin-left: 20rpx; flex: 1; .name { font-size: 28rpx; } .time { color: $sec-font; font-size: 24rpx; margin-top: 8rpx; } } .price { color: $assist-color; font-weight: 500; } } .title { font-weight: 500; margin-top: 20rpx; } .des { margin-top: 20rpx; font-size: 28rpx; color: $reg-font; } .imgs { display: flex; flex-wrap: wrap; image { width: 140rpx; height: 140rpx; margin-right: 20rpx; margin-top: 20rpx; &:nth-child(4n) { margin-right: 0; } } } .bottom { border-top: 1px solid #eaeaea; margin-top: 20rpx; padding-top: 20rpx; display: flex; align-items: center; justify-content: space-between; .left-location { font-size: 28rpx; color: $sec-font; display: flex; align-items: center; .iconfont { margin-right: 4rpx; } } .right-btn { .u-button { height: 60rpx; } } .right-stats { display: flex; align-items: center; .it { display: flex; align-items: center; margin-left: 30rpx; .iconfont { font-size: 32rpx; color: $sec-font; } .text { font-size: 28rpx; margin-left: 6rpx; color: $sec-font; } } } } } } .common-order-list { .item { margin-top: 30rpx; background: #ffffff; padding: 20rpx 30rpx; .top { display: flex; align-items: center; image { width: 80rpx; height: 80rpx; border-radius: 50%; flex-shrink: 0; } .user { margin-left: 20rpx; flex: 1; display: flex; flex-direction: column; justify-content: center; .name { font-size: 28rpx; } .time { color: $sec-font; font-size: 24rpx; margin-top: 8rpx; } } .status { color: $theme-color; font-size: 28rpx; } } .goods { display: flex; padding: 30rpx 0; image { width: 120rpx; height: 120rpx; } .main { flex: 1; margin-left: 20rpx; .name { font-weight: 500; font-size: 32rpx; text { font-size: 28rpx; color: $sec-font; font-weight: normal; margin-left: 12rpx; } } .des { margin-top: 12rpx; font-size: 28rpx; color: $reg-font; } .price { margin-top: 12rpx; color: $assist-color; font-weight: 500; font-size: 32rpx; } } } .info { border-top: 1px solid #eaeaea; padding: 10rpx 0; .row { display: flex; align-items: center; margin: 10rpx 0; .label { font-size: 28rpx; color: $sec-font; margin-right: 20rpx; } .value { font-size: 28rpx; } .price { color: $assist-color; font-weight: 500; } } } .bottom { border-top: 1px solid #eaeaea; padding-top: 20rpx; display: flex; align-items: center; justify-content: space-between; .left-location { font-size: 28rpx; color: $sec-font; display: flex; align-items: center; .iconfont { margin-right: 4rpx; } } .left-buyer { display: flex; align-items: center; image { width: 40rpx; height: 40rpx; border-radius: 50%; } .name { font-size: 28rpx; margin-left: 12rpx; } .text { color: $sec-font; font-size: 28rpx; margin-left: 16rpx; } } .right-btn { display: flex; .u-button { height: 60rpx; margin-left: 12rpx; } } } } }