|     .container { | 
|         position: relative; | 
|     } | 
|     .code { | 
|         background-color: #d9d9d9; | 
|         z-index: 99; | 
|         position: sticky; | 
|         top: 0rpx; | 
|         left: 0; | 
|     } | 
|     .code-title { | 
|         display: flex; | 
|         justify-content: space-around; | 
|         /* height: 50rpx; */ | 
|     } | 
|     .list { | 
|         margin: 20rpx; | 
|         font-size: 14px; | 
|         background-color: #fff; | 
|         border-radius: 20rpx; | 
|         border: 1px solid #eeeeee; | 
|         display: flex; | 
|         position: relative; | 
|     } | 
|     .card-id { | 
|         position: absolute; | 
|         right: 10rpx; | 
|         top: 20rpx; | 
|         padding: 5rpx 10rpx; | 
|         line-height: 1.2; | 
|         text-align: center; | 
|         color: #eeeeee; | 
|         background-color: #30ddb2; | 
|         border-radius: 50%; | 
|         font-size: 10px; | 
|     } | 
|     .list-left { | 
|         flex: 1; | 
|         padding: 20rpx; | 
|         position: relative; | 
|     } | 
|     .list-right { | 
|         width: 70rpx; | 
|         border-left: 1px solid #eeeeee; | 
|         display: flex; | 
|         align-items: center; | 
|         justify-content: center; | 
|     } | 
|     .buttom { | 
|         width: 100%; | 
|         position: fixed; | 
|         bottom: 0; | 
|         left: 0; | 
|         display: flex; | 
|         align-items: center; | 
|         justify-content: space-between; | 
|         height: 100rpx; | 
|         background-color: #FFF; | 
|         box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2) ; | 
|     } | 
|     .card-status-1 { | 
|         position: absolute; | 
|         right: 20rpx; | 
|         top: 30rpx; | 
|         padding: 4rpx 20rpx; | 
|         text-align: center; | 
|         font-size: 10px; | 
|         color: #f5222d; | 
|         background-color: #fff1f0; | 
|         border: 1px solid #ffa39e; | 
|         border-radius: 6rpx; | 
|     } | 
|     .card-status-2 { | 
|         position: absolute; | 
|         right: 20rpx; | 
|         top: 30rpx; | 
|         padding: 4rpx 20rpx; | 
|         text-align: center; | 
|         font-size: 10px; | 
|         color: #52c41a; | 
|         background-color: #f6ffed; | 
|         border: 1px solid #b7eb8f; | 
|         border-radius: 6rpx; | 
|     } | 
|     .card-status-4 { | 
|         position: absolute; | 
|         right: 20rpx; | 
|         top: 30rpx; | 
|         padding: 4rpx 20rpx; | 
|         text-align: center; | 
|         font-size: 10px; | 
|         color: #1890ff; | 
|         background-color: #e6f7ff; | 
|         border: 1px solid #91d5ff; | 
|         border-radius: 6rpx; | 
|     } | 
|     .dropdown { | 
|         position: relative; | 
|         display: flex; | 
|         align-items: center; | 
|         padding: 0rpx 20rpx; | 
|         border-bottom: 1px solid #d9d9d9; | 
|     } | 
|     .dropdown-content { | 
|         position: absolute; | 
|         top: calc(100% + 15rpx); | 
|         left: 0; | 
|         width: calc(100% - 20rpx); | 
|         max-height: 300rpx; | 
|         background-color: #fff; | 
|         box-shadow: 0 0px 6px rgba(0, 0, 0, 0.3); | 
|         border-radius: 8rpx; | 
|         z-index: 10; | 
|     } | 
|     .dropdown-item { | 
|         margin: 12rpx; | 
|         padding: 12rpx; | 
|         line-height: 1; | 
|         font-size: 32rpx; | 
|         color: #3a3a3a; | 
|     } | 
|     .mt-flex { | 
|         display: flex; | 
|         align-items: center; | 
|     } |