first commit

pages/splash/index.js

@@ -0,0 +1,41 @@
+/**
+ * 启动页 — 每次启动都执行 wx.login → 后端登录
+ * 微信的 code 是一次性的，必须每次重新获取
+ */
+const app = getApp()
+
+Page({
+    data: {
+        loginState: 'loading' // 'loading' | 'success' | 'error'
+    },
+
+    onLoad() {
+        // 每次进入启动页都执行登录流程（不跳过）
+        this._startLogin()
+    },
+
+    /**
+     * 执行静默登录
+     * wx.login() → code → 后端 /auth/miniLogin → token + user
+     */
+    _startLogin() {
+        const self = this
+
+        app.login().then(function (data) {
+            self.setData({ loginState: 'success' })
+
+            // 登录成功，多停留一会儿再跳转（让用户看清启动页）
+            setTimeout(function () {
+                wx.switchTab({ url: '/pages/index/index' })
+            }, 1800)
+        }).catch(function (err) {
+            console.error('[Splash] 登录失败：', err)
+            self.setData({ loginState: 'error' })
+
+            // 登录失败也跳转首页（游客模式浏览）
+            setTimeout(function () {
+                wx.switchTab({ url: '/pages/index/index' })
+            }, 1500)
+        })
+    }
+})

pages/splash/index.json

@@ -0,0 +1,4 @@
+{
+    "usingComponents": {},
+    "navigationStyle": "custom"
+}

pages/splash/index.wxml

@@ -0,0 +1,45 @@
+<!-- 启动页 —— 沉浸式暖棕主题 -->
+<page-meta page-style="overflow:hidden; background:#1A1208;" />
+<view class="splash-page">
+
+  <!-- 环境光 -->
+  <view class="splash-glow"></view>
+
+  <!-- 主内容 -->
+  <view class="splash-content {{loginState === 'success' ? 'fade-out' : ''}}">
+
+    <!-- 收音机图标 + 脉冲 -->
+    <view class="logo-wrap">
+      <view class="pulse-ring" wx:if="{{loginState === 'loading'}}"></view>
+      <view class="pulse-ring pulse-ring-2" wx:if="{{loginState === 'loading'}}"></view>
+      <text class="logo-icon">📻</text>
+    </view>
+
+    <!-- 应用名 + slogan -->
+    <text class="app-title">全声汇</text>
+    <text class="app-sub">QuanShengHui</text>
+    <text class="app-slogan">好内容，随时听</text>
+
+    <!-- 状态 -->
+    <view class="status-area">
+      <view wx:if="{{loginState === 'loading'}}" class="status-row">
+        <view class="loading-dots">
+          <view class="dot" style="animation-delay:0s"></view>
+          <view class="dot" style="animation-delay:0.2s"></view>
+          <view class="dot" style="animation-delay:0.4s"></view>
+        </view>
+      </view>
+      <view wx:elif="{{loginState === 'success'}}" class="status-row">
+        <text class="status-check">✓</text>
+        <text class="status-ok">已就绪</text>
+      </view>
+    </view>
+
+  </view>
+
+  <!-- 底部版权 -->
+  <view class="splash-footer">
+    <text class="footer-text">每天三分钟，精准获取所需</text>
+  </view>
+
+</view>

pages/splash/index.wxss

@@ -0,0 +1,152 @@
+/* 启动页 — 暖棕沉浸主题，与播放器保持一致 */
+
+.splash-page {
+  width: 100%;
+  height: 100vh;
+  background: #1A1208;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+}
+
+/* 环境光晕 */
+.splash-glow {
+  position: absolute;
+  top: -10vh;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 120vw;
+  height: 60vh;
+  background: radial-gradient(ellipse at center, rgba(255,157,66,0.22) 0%, transparent 70%);
+  pointer-events: none;
+}
+
+/* 主内容容器 */
+.splash-content {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  transition: opacity 1.0s ease, transform 1.0s ease, filter 1.0s ease;
+}
+.splash-content.fade-out {
+  opacity: 0;
+  transform: scale(1.06) translateY(-12rpx);
+  filter: blur(6px);
+}
+
+/* ── 图标 ── */
+.logo-wrap {
+  width: 200rpx;
+  height: 200rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 64rpx;
+  position: relative;
+}
+.logo-icon {
+  font-size: 120rpx;
+  filter: drop-shadow(0 16rpx 40rpx rgba(255,120,0,0.4));
+  position: relative;
+  z-index: 2;
+}
+
+/* 双层脉冲环 */
+.pulse-ring {
+  position: absolute;
+  inset: -20rpx;
+  border-radius: 50%;
+  border: 3rpx solid rgba(255, 157, 66, 0.45);
+  animation: pulse-expand 2s ease-out infinite;
+}
+.pulse-ring-2 {
+  animation-delay: 1s;
+}
+@keyframes pulse-expand {
+  0%   { transform: scale(0.7); opacity: 0.8; }
+  100% { transform: scale(1.6); opacity: 0; }
+}
+
+/* ── 文字 ── */
+.app-title {
+  font-size: 64rpx;
+  font-weight: 800;
+  color: rgba(255, 240, 210, 0.95);
+  letter-spacing: -2rpx;
+  margin-bottom: 8rpx;
+}
+.app-sub {
+  font-size: 22rpx;
+  font-weight: 400;
+  color: rgba(255, 200, 120, 0.45);
+  letter-spacing: 6rpx;
+  margin-bottom: 28rpx;
+  text-transform: uppercase;
+}
+.app-slogan {
+  font-size: 26rpx;
+  font-weight: 400;
+  color: rgba(255, 200, 120, 0.55);
+  letter-spacing: 3rpx;
+}
+
+/* ── 状态区 ── */
+.status-area {
+  margin-top: 100rpx;
+  height: 48rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.status-row {
+  display: flex;
+  align-items: center;
+  gap: 12rpx;
+}
+
+/* 三点加载动画 */
+.loading-dots {
+  display: flex;
+  gap: 12rpx;
+  align-items: center;
+}
+.dot {
+  width: 12rpx;
+  height: 12rpx;
+  border-radius: 50%;
+  background: rgba(255, 157, 66, 0.7);
+  animation: dot-bounce 1.2s ease-in-out infinite alternate;
+}
+@keyframes dot-bounce {
+  0%   { transform: translateY(0);     opacity: 0.3; }
+  100% { transform: translateY(-12rpx); opacity: 1; }
+}
+
+/* 成功状态 */
+.status-check {
+  font-size: 32rpx;
+  color: #FF9D42;
+  font-weight: 700;
+}
+.status-ok {
+  font-size: 26rpx;
+  color: rgba(255, 200, 120, 0.7);
+  font-weight: 500;
+}
+
+/* ── 底部版权 ── */
+.splash-footer {
+  position: absolute;
+  bottom: 80rpx;
+  left: 0;
+  right: 0;
+  text-align: center;
+}
+.footer-text {
+  font-size: 20rpx;
+  color: rgba(255, 200, 120, 0.2);
+  letter-spacing: 2rpx;
+}