补分销中心页面

2025-08-10 01:38:17 +08:00
parent 44fd815fe7
commit afe54770a8
20 changed files with 2499 additions and 4 deletions
--- a/src/dealer/team/index.scss
+++ b/src/dealer/team/index.scss
@@ -0,0 +1,176 @@
+.my-team-page {
+  min-height: 100vh;
+  background-color: #f5f5f5;
+
+  .loading-container {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 200px;
+  }
+
+  .team-stats {
+    background: white;
+    margin: 16px;
+    border-radius: 12px;
+    padding: 20px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+
+    .stats-grid {
+      display: grid;
+      grid-template-columns: repeat(2, 1fr);
+      gap: 20px;
+
+      .stat-item {
+        text-align: center;
+
+        .stat-value {
+          font-size: 20px; // 对应 text-xl
+          font-weight: bold;
+          color: #1f2937;
+          margin-bottom: 4px;
+        }
+
+        .stat-label {
+          font-size: 16px; // 对应 text-base
+          color: #6b7280;
+        }
+      }
+    }
+  }
+
+  .level-stats {
+    background: white;
+    margin: 0 16px 16px;
+    border-radius: 12px;
+    padding: 16px;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+
+    .level-item {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      padding: 12px 0;
+
+      &:not(:last-child) {
+        border-bottom: 1px solid #f3f4f6;
+      }
+
+      .level-info {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        width: 100%;
+
+        .level-title {
+          font-size: 20px; // 对应 text-xl
+          color: #1f2937;
+        }
+
+        .level-count {
+          font-size: 20px; // 对应 text-xl
+          font-weight: bold;
+          color: #3b82f6;
+        }
+      }
+    }
+  }
+
+  .members-container {
+    margin: 0 16px;
+
+    .empty-container {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      height: 300px;
+    }
+
+    .members-list {
+      margin-top: 16px;
+
+      .member-item {
+        background: white;
+        border-radius: 12px;
+        padding: 16px;
+        margin-bottom: 12px;
+        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+        display: flex;
+        align-items: center;
+        cursor: pointer;
+        transition: all 0.2s ease;
+
+        &:active {
+          transform: scale(0.98);
+          background-color: #f9f9f9;
+        }
+
+        .member-info {
+          flex: 1;
+          margin-left: 12px;
+
+          .member-header {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 8px;
+
+            .member-name {
+              font-size: 20px; // 对应 text-xl，成员名称是重要信息
+              font-weight: 500;
+              color: #1f2937;
+            }
+
+            .member-level {
+              font-size: 14px; // 对应 text-sm
+              padding: 4px 10px;
+              border-radius: 12px;
+              color: white;
+
+              &.level-1 {
+                background-color: #3b82f6;
+              }
+
+              &.level-2 {
+                background-color: #10b981;
+              }
+            }
+          }
+
+          .member-stats {
+            display: flex;
+            gap: 16px;
+            margin-bottom: 6px;
+
+            .stat {
+              font-size: 16px; // 对应 text-base
+              color: #6b7280;
+            }
+          }
+
+          .member-time {
+            font-size: 14px; // 对应 text-sm
+            color: #9ca3af;
+          }
+        }
+
+        .member-status {
+          font-size: 14px; // 对应 text-sm
+          padding: 6px 10px;
+          border-radius: 12px;
+          margin-left: 12px;
+
+          &.active {
+            background-color: #d1fae5;
+            color: #10b981;
+          }
+
+          &.inactive {
+            background-color: #fee2e2;
+            color: #ef4444;
+          }
+        }
+      }
+    }
+  }
+}