微信小店联盟带货小程序

team.wxss 2.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169
  1. /* pages/distribution/team.wxss */
  2. .container {
  3. min-height: 100vh;
  4. background: #F5F5F5;
  5. }
  6. /* 团队数据总览 */
  7. .team-header {
  8. background: linear-gradient(135deg, #FF4D4F, #FF7875);
  9. color: #FFFFFF;
  10. padding: 32rpx;
  11. }
  12. .header-info {
  13. display: flex;
  14. justify-content: space-between;
  15. }
  16. .team-data {
  17. display: flex;
  18. flex-direction: column;
  19. align-items: center;
  20. }
  21. .data-value {
  22. font-size: 36rpx;
  23. font-weight: 500;
  24. margin-bottom: 8rpx;
  25. }
  26. .data-label {
  27. font-size: 24rpx;
  28. color: rgba(255, 255, 255, 0.8);
  29. }
  30. /* 团队成员筛选 */
  31. .team-filter {
  32. background: #FFFFFF;
  33. display: flex;
  34. justify-content: space-between;
  35. align-items: center;
  36. padding: 24rpx 32rpx;
  37. margin: 24rpx 32rpx;
  38. border-radius: 16rpx;
  39. box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
  40. }
  41. .picker-item {
  42. display: flex;
  43. align-items: center;
  44. font-size: 28rpx;
  45. color: #262626;
  46. }
  47. .picker-item .icon-down {
  48. margin-left: 8rpx;
  49. color: #8C8C8C;
  50. font-size: 24rpx;
  51. }
  52. .search-box {
  53. display: flex;
  54. align-items: center;
  55. background: #F5F5F5;
  56. border-radius: 32rpx;
  57. padding: 12rpx 24rpx;
  58. flex: 1;
  59. margin-left: 24rpx;
  60. }
  61. .search-box .icon-search {
  62. color: #8C8C8C;
  63. margin-right: 12rpx;
  64. font-size: 32rpx;
  65. }
  66. .search-box input {
  67. flex: 1;
  68. font-size: 28rpx;
  69. color: #262626;
  70. }
  71. /* 团队成员列表 */
  72. .team-list {
  73. background: #FFFFFF;
  74. margin: 0 32rpx 24rpx;
  75. border-radius: 16rpx;
  76. box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.04);
  77. }
  78. .team-member {
  79. display: flex;
  80. align-items: center;
  81. padding: 24rpx 32rpx;
  82. border-bottom: 1rpx solid #F5F5F5;
  83. }
  84. .team-member:last-child {
  85. border-bottom: none;
  86. }
  87. .member-avatar {
  88. width: 96rpx;
  89. height: 96rpx;
  90. border-radius: 50%;
  91. margin-right: 24rpx;
  92. }
  93. .member-info {
  94. flex: 1;
  95. }
  96. .member-name {
  97. display: flex;
  98. align-items: center;
  99. margin-bottom: 12rpx;
  100. }
  101. .member-name text:first-child {
  102. font-size: 32rpx;
  103. color: #262626;
  104. font-weight: 500;
  105. margin-right: 16rpx;
  106. }
  107. .member-level {
  108. font-size: 24rpx;
  109. color: #8C8C8C;
  110. background: #F5F5F5;
  111. padding: 4rpx 12rpx;
  112. border-radius: 16rpx;
  113. }
  114. .member-detail {
  115. display: flex;
  116. flex-direction: column;
  117. font-size: 24rpx;
  118. color: #8C8C8C;
  119. }
  120. .member-detail text {
  121. margin-bottom: 8rpx;
  122. }
  123. .member-stats {
  124. display: flex;
  125. flex-direction: column;
  126. align-items: flex-end;
  127. }
  128. .stats-label {
  129. font-size: 24rpx;
  130. color: #8C8C8C;
  131. margin-bottom: 8rpx;
  132. }
  133. .stats-value {
  134. font-size: 32rpx;
  135. color: #FF4D4F;
  136. font-weight: 500;
  137. }
  138. /* 加载状态 */
  139. .loading-status {
  140. padding: 32rpx 0;
  141. text-align: center;
  142. color: #8C8C8C;
  143. font-size: 24rpx;
  144. }