feat(data,my): 实现数据页与我的页界面，新增选择成员抽屉组件

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-08-17 15:48:07 +08:00
parent 6ad51b00b1
commit 0c8285f390
13 changed files with 1098 additions and 7 deletions
@@ -1 +1,131 @@
-/* pages/my/my.wxss */
+.my {
+    width: 100%;
+    height: 100%;
+
+    .header {
+        width: 100%;
+        height: 320rpx;
+        margin-bottom: 26rpx;
+
+        .bg {
+            width: 100%;
+            height: 100%;
+        }
+
+        .user {
+            position: absolute;
+            top: 185rpx;
+            left: 40rpx;
+            right: 40rpx;
+            width: 100%;
+            display: flex;
+            box-sizing: border-box;
+
+            .userAvatar {
+                width: 120rpx;
+                height: 120rpx;
+                margin-right: 30rpx;
+                border-radius: 24rpx;
+                color: #FFFFFF;
+                font-size: 48rpx;
+                font-weight: bold;
+                line-height: 110rpx;
+                text-align: center;
+                box-sizing: border-box;
+                border: 5rpx solid #ffffff;
+                background-color: #1385FA;
+            }
+
+            .userInfo {
+                flex: 1;
+                display: flex;
+                flex-flow: column;
+                justify-content: center;
+                overflow: hidden;
+
+                .userName {
+                    color: #252536;
+                    height: 40rpx;
+                    font-weight: bold;
+                    font-size: 40rpx;
+                    line-height: 40rpx;
+                    margin-bottom: 22rpx;
+                }
+
+                .userSex {
+                    height: 28rpx;
+                    display: flex;
+                    align-items: center;
+
+                    .meta-text {
+                        color: #77849E;
+                        height: 28rpx;
+                        font-size: 28rpx;
+                        line-height: 28rpx;
+                    }
+
+                    .meta-divider {
+                        color: #B6B6B6;
+                        height: 28rpx;
+                        font-size: 28rpx;
+                        line-height: 28rpx;
+                        margin: 0 12rpx;
+                    }
+                }
+            }
+        }
+    }
+
+    .page-container {
+        width: 100%;
+        box-sizing: border-box;
+
+        .list {
+            width: 100%;
+            padding: 0 30rpx;
+            border-radius: 16rpx;
+            box-sizing: border-box;
+            background-color: #ffffff;
+            margin-bottom: 750rpx;
+
+            .list-item {
+                width: 100%;
+                height: 110rpx;
+                display: flex;
+                flex-wrap: nowrap;
+                align-items: center;
+                border-bottom: 2rpx solid #EAECF1;
+
+                &:last-of-type {
+                    border-bottom: none;
+                }
+
+                > view:nth-of-type(1) {
+                    width: 44rpx;
+                    height: 44rpx;
+                    margin-right: 22rpx;
+                }
+
+                > view:nth-of-type(2) {
+                    flex: 1;
+                    height: 32rpx;
+                    color: #394356;
+                    font-weight: bold;
+                    font-size: 32rpx;
+                    line-height: 32rpx;
+                }
+            }
+        }
+
+        .exitBtn {
+            color: #252535;
+            width: 100%;
+            height: 110rpx;
+            font-size: 32rpx;
+            text-align: center;
+            line-height: 110rpx;
+            border-radius: 24rpx;
+            background-color: #FFFFFF;
+        }
+    }
+}