feat: 项目初始化。

2025-12-18 22:11:37 +08:00
parent 22c072a957
commit e41581f26b
633 changed files with 90998 additions and 0 deletions
--- a/src/pages/mine.vue
+++ b/src/pages/mine.vue
@@ -0,0 +1,131 @@
+<template>
+  <view class="mine-container">
+    <!-- 顶部个人信息栏 -->
+    <view class="header-section">
+      <view class="user-info">
+        <view class="avatar">
+          <uni-icons type="person-filled" size="40" color="#ffffff"></uni-icons>
+        </view>
+        <view class="user-details">
+          <text class="user-name">{{ userInfo.name }}</text>
+          <text class="user-id">ID: {{ userInfo.userId }}</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 内容区域 -->
+    <view class="content-section">
+      <view class="info-card">
+        <view class="info-item">
+          <text class="info-label">手机号</text>
+          <text class="info-value">{{ userInfo.phone }}</text>
+        </view>
+        <view class="info-divider"></view>
+        <view class="info-item">
+          <text class="info-label">邮箱</text>
+          <text class="info-value">{{ userInfo.email }}</text>
+        </view>
+        <view class="info-divider"></view>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+
+// 模拟个人信息
+const userInfo = ref({
+  name: '智聪',
+  userId: '10001',
+  phone: '138****5678',
+  email: 'qdintc@126.com'
+})
+</script>
+
+<style lang="scss" scoped>
+page {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  background-color: #f5f7fa;
+}
+
+.mine-container {
+  width: 100%;
+  height: 100vh;
+  background-color: #f5f7fa;
+  overflow-y: auto;
+
+  .header-section {
+    padding: 40rpx 32rpx;
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    
+    .user-info {
+      display: flex;
+      align-items: center;
+      
+      .avatar {
+        width: 100rpx;
+        height: 100rpx;
+        border-radius: 50rpx;
+        background: rgba(255, 255, 255, 0.3);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        margin-right: 24rpx;
+      }
+      
+      .user-details {
+        flex: 1;
+        
+        .user-name {
+          display: block;
+          color: #ffffff;
+          font-size: 32rpx;
+          font-weight: 600;
+          margin-bottom: 8rpx;
+        }
+        
+        .user-id {
+          color: rgba(255, 255, 255, 0.8);
+          font-size: 24rpx;
+        }
+      }
+    }
+  }
+
+  .content-section {
+    padding: 32rpx;
+    
+    .info-card {
+      background: #ffffff;
+      border-radius: 16rpx;
+      padding: 32rpx;
+      box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
+      
+      .info-item {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 24rpx 0;
+        
+        .info-label {
+          color: #666;
+          font-size: 28rpx;
+        }
+        
+        .info-value {
+          color: #333;
+          font-size: 28rpx;
+        }
+      }
+      
+      .info-divider {
+        height: 1rpx;
+        background-color: #f0f0f0;
+      }
+    }
+  }
+}
+</style>