feat: 修改页面bug

2026-06-04 00:51:29 +08:00 · 2026-06-04 00:51:29 +08:00 · f768613509
commit f768613509
parent f0b650de26
9 changed files with 209 additions and 210 deletions
--- a/frontend/pages/castlove/craft-select.vue
+++ b/frontend/pages/castlove/craft-select.vue
@ -97,149 +97,149 @@ export default {
        this.applyType(val);
      },
    },
-    computed: {
-        currentCardList() {
-            const categoryName = this.categoryList[this.selectedCategoryIndex].name
-            return this.cardListMap[categoryName] || this.cardList
-        }
+  },
+
+  computed: {
+    currentCardList() {
+      const categoryName = this.categoryList[this.selectedCategoryIndex].name;
+      return this.cardListMap[categoryName] || this.cardList;
    },
-    methods: {
-        // 选择大分类
-        selectCategory(index) {
-            this.selectedCategoryIndex = index
-            this.selectedIndex = 0 // 重置子选项选中
-        },
-        // 触摸开始
-        onTouchStart(e) {
-            this.touchStartY = e.touches[0].clientY
-        },
-        // 触摸结束 - 滑动切换工艺卡片
-        onTouchEnd(e) {
-            const touchEndY = e.changedTouches[0].clientY
-            const diff = this.touchStartY - touchEndY
-            const threshold = 50 // 滑动阈值
-
-            if (diff > threshold) {
-                // 向上滑动 → 下一个工艺卡片
-                let newIndex = this.selectedIndex + 1
-                if (newIndex < this.currentCardList.length) {
-                    this.selectCard(newIndex)
-                }
-            } else if (diff < -threshold) {
-                // 向下滑动 → 上一个工艺卡片
-                let newIndex = this.selectedIndex - 1
-                if (newIndex >= 0) {
-                    this.selectCard(newIndex)
-                }
-            }
-        },
-        // 获取卡片样式 - 循环滚动布局
-        // positions 定义了5个位置的固定样式（位置0最上，位置2中间，位置4最下）
-        // 当选中某个卡片时，该卡片显示在位置2（中间），其他卡片循环填充
-        getCardStyle(index) {
-            const positions = [
-                { left: 9 * 32, top: 2 * 32, rotate: 25, scale: 0.75 },   // 位置0 - 最上
-                { left: 3.75 * 32, top: 9 * 32, rotate: 12, scale: 0.95 },  // 位置1 - 中上
-                { left: 60, top: 580, rotate: 0, scale: 1 },       // 位置2 - 中间
-                { left: 3.75 * 32, top: 27.75 * 32, rotate: -12, scale: 0.95 },     // 位置3 - 中下
-                { left: 7 * 32, top: 34.25 * 32, rotate: -25, scale: 0.75 }    // 位置4 - 最下
-            ];
-
-            // 计算当前卡片应该显示在哪个位置
-            // 循环移位：selectedIndex 的卡片显示在位置2（中间）
-            const cardPos = (index - this.selectedIndex + 2 + 5) % 5;
-            const pos = positions[cardPos];
-
-            // 选中卡片在中间位置时放大
-            if (cardPos === 2) {
-                return {
-                    left: `${pos.left}rpx`,
-                    top: `${pos.top}rpx`,
-                    transform: `scale(${pos.scale * 1.15}) rotate(0deg)`,
-                    zIndex: 100
-                };
-            }
-
-            return {
-                left: `${pos.left}rpx`,
-                top: `${pos.top}rpx`,
-                transform: `scale(${pos.scale}) rotate(${pos.rotate}deg)`,
-                zIndex: 30 - Math.abs(cardPos - 2) * 10
-            };
-        },
-        // 选择卡片
-        selectCard(index) {
-            this.selectedIndex = index;
-        },
-        /** 当前叠卡在弧形布局中的槽位：2=正中主图（最大），1=中上「第二张」叠层，0最上… */
-        getCardStackPosition(index) {
-            return (index - this.selectedIndex + 2 + 5) % 5;
-        },
-        /**
-         * 点击卡图区域：
-         * - 正中主图（槽位 2）→ 进入对应工艺创建页（光栅卡即进入已接入预览的 create）
-         * - 中上叠层（槽位 1，常为拍立得示意）在选中光栅时 → 同样进入光栅卡创建（与设计稿「点第二张进光栅」一致）
-         * - 其余叠层 → 仅切换选中
-         */
-        onCardFrameTap(index) {
-            const card = this.currentCardList[index];
-            if (!card) {
-                return;
-            }
-            const pos = this.getCardStackPosition(index);
-            // 只有中间位置的卡片点击才会进入创建页
-            // 其他位置点击只是切换选中（把卡片移到中间），再次点击中间卡片才进入
-            if (pos === 2) {
-                if (card.name === '光栅卡' || card.name === '镭射卡') {
-                    const route = this.cardRoutes[card.name];
-                    if (route) {
-                        uni.navigateTo({
-                            url: `${route}?name=${encodeURIComponent(card.name)}`,
-                        });
-                    }
-                } else {
-                    uni.showToast({
-                        title: '激情开发中',
-                        icon: 'none',
-                    });
-                }
-                return;
-            }
-            this.selectCard(index);
-        },
-        handleBack() {
-            uni.navigateBack()
-        },
-        scrollUp() {
-            let newIndex = this.selectedCategoryIndex - 1;
-            if (newIndex >= 0) {
-                this.selectCategory(newIndex);
-            }
-        },
-        scrollDown() {
-            let newIndex = this.selectedCategoryIndex + 1;
-            if (newIndex < this.categoryList.length) {
-                this.selectCategory(newIndex);
-            }
-        },
-        handleSkip() {
-            const card = this.cardList[this.selectedIndex]
-            if (card.name === '光栅卡' || card.name === '镭射卡') {
-                const route = this.cardRoutes[card.name]
-                if (route) {
-                    uni.navigateTo({
-                        url: `${route}?name=${encodeURIComponent(card.name)}`
-                    })
-                }
-            } else {
-                uni.showToast({
-                    title: '激情开发中',
-                    icon: 'none',
-                });
-            }
+  },
+  methods: {
+    // 选择大分类
+    selectCategory(index) {
+      this.selectedCategoryIndex = index;
+      this.selectedIndex = 0; // 重置子选项选中
+    },
+    // 触摸开始
+    onTouchStart(e) {
+      this.touchStartY = e.touches[0].clientY;
+    },
+    // 触摸结束 - 滑动切换工艺卡片
+    onTouchEnd(e) {
+      const touchEndY = e.changedTouches[0].clientY;
+      const diff = this.touchStartY - touchEndY;
+      const threshold = 50; // 滑动阈值

+      if (diff > threshold) {
+        // 向上滑动 → 下一个工艺卡片
+        let newIndex = this.selectedIndex + 1;
+        if (newIndex < this.currentCardList.length) {
+          this.selectCard(newIndex);
        }
-    }
+      } else if (diff < -threshold) {
+        // 向下滑动 → 上一个工艺卡片
+        let newIndex = this.selectedIndex - 1;
+        if (newIndex >= 0) {
+          this.selectCard(newIndex);
+        }
+      }
+    },
+    // 获取卡片样式 - 循环滚动布局
+    // positions 定义了5个位置的固定样式（位置0最上，位置2中间，位置4最下）
+    // 当选中某个卡片时，该卡片显示在位置2（中间），其他卡片循环填充
+    getCardStyle(index) {
+      const positions = [
+        { left: 9 * 32, top: 2 * 32, rotate: 25, scale: 0.75 }, // 位置0 - 最上
+        { left: 3.75 * 32, top: 9 * 32, rotate: 12, scale: 0.95 }, // 位置1 - 中上
+        { left: 60, top: 580, rotate: 0, scale: 1 }, // 位置2 - 中间
+        { left: 3.75 * 32, top: 27.75 * 32, rotate: -12, scale: 0.95 }, // 位置3 - 中下
+        { left: 7 * 32, top: 34.25 * 32, rotate: -25, scale: 0.75 }, // 位置4 - 最下
+      ];
+
+      // 计算当前卡片应该显示在哪个位置
+      // 循环移位：selectedIndex 的卡片显示在位置2（中间）
+      const cardPos = (index - this.selectedIndex + 2 + 5) % 5;
+      const pos = positions[cardPos];
+
+      // 选中卡片在中间位置时放大
+      if (cardPos === 2) {
+        return {
+          left: `${pos.left}rpx`,
+          top: `${pos.top}rpx`,
+          transform: `scale(${pos.scale * 1.15}) rotate(0deg)`,
+          zIndex: 100,
+        };
+      }
+
+      return {
+        left: `${pos.left}rpx`,
+        top: `${pos.top}rpx`,
+        transform: `scale(${pos.scale}) rotate(${pos.rotate}deg)`,
+        zIndex: 30 - Math.abs(cardPos - 2) * 10,
+      };
+    },
+    // 选择卡片
+    selectCard(index) {
+      this.selectedIndex = index;
+    },
+    /** 当前叠卡在弧形布局中的槽位：2=正中主图（最大），1=中上「第二张」叠层，0最上… */
+    getCardStackPosition(index) {
+      return (index - this.selectedIndex + 2 + 5) % 5;
+    },
+    /**
+     * 点击卡图区域：
+     * - 正中主图（槽位 2）→ 进入对应工艺创建页（光栅卡即进入已接入预览的 create）
+     * - 中上叠层（槽位 1，常为拍立得示意）在选中光栅时 → 同样进入光栅卡创建（与设计稿「点第二张进光栅」一致）
+     * - 其余叠层 → 仅切换选中
+     */
+    onCardFrameTap(index) {
+      const card = this.currentCardList[index];
+      if (!card) {
+        return;
+      }
+      const pos = this.getCardStackPosition(index);
+      // 只有中间位置的卡片点击才会进入创建页
+      // 其他位置点击只是切换选中（把卡片移到中间），再次点击中间卡片才进入
+      if (pos === 2) {
+        if (card.name === "光栅卡" || card.name === "镭射卡") {
+          const route = this.cardRoutes[card.name];
+          if (route) {
+            uni.navigateTo({
+              url: `${route}?name=${encodeURIComponent(card.name)}`,
+            });
+          }
+        } else {
+          uni.showToast({
+            title: "激情开发中",
+            icon: "none",
+          });
+        }
+        return;
+      }
+      this.selectCard(index);
+    },
+    handleBack() {
+      uni.navigateBack();
+    },
+    scrollUp() {
+      let newIndex = this.selectedCategoryIndex - 1;
+      if (newIndex >= 0) {
+        this.selectCategory(newIndex);
+      }
+    },
+    scrollDown() {
+      let newIndex = this.selectedCategoryIndex + 1;
+      if (newIndex < this.categoryList.length) {
+        this.selectCategory(newIndex);
+      }
+    },
+    handleSkip() {
+      const card = this.cardList[this.selectedIndex];
+      if (card.name === "光栅卡" || card.name === "镭射卡") {
+        const route = this.cardRoutes[card.name];
+        if (route) {
+          uni.navigateTo({
+            url: `${route}?name=${encodeURIComponent(card.name)}`,
+          });
+        }
+      } else {
+        uni.showToast({
+          title: "激情开发中",
+          icon: "none",
+        });
+      }
+    },
  },
  onShow() {
    try {
@ -264,11 +264,11 @@ export default {
      categoryList: [{ name: "星卡" }, { name: "吧唧" }, { name: "海报" }],
      cardListMap: {
        星卡: [
-            {
-              name: "镭射卡",
-              image: "/static/castlove/leisheka.png",
-              comingSoon: false,
-            },
+          {
+            name: "镭射卡",
+            image: "/static/castlove/leisheka.png",
+            comingSoon: false,
+          },
          {
            name: "光栅卡",
            image: "/static/castlove/guangshanka.png",
@ -564,6 +564,13 @@ export default {
              "?name=" +
              encodeURIComponent(card.name),
          });
+        } else if (card.name === "镭射卡") {
+          uni.navigateTo({
+            url:
+              this.cardRoutes["镭射卡"] +
+              "?name=" +
+              encodeURIComponent(card.name),
+          });
        } else {
          uni.showToast({ title: "激情开发中", icon: "none" });
        }
--- a/frontend/pages/components/Header.vue
+++ b/frontend/pages/components/Header.vue
@ -502,13 +502,14 @@ defineExpose({
  display: flex;
  align-items: center;
  justify-content: flex-start;
+  margin-right: 10rpx;
 }

 .star-activity-list {
  display: flex;
  align-items: center;
  gap: 8rpx;
-  width: 68rpx;
+  /* width: 68rpx; */
  /* 控制整体宽度，根据图标大小调整 */
  height: 156rpx;
  /* 预估高度，包含图标和文字块 */
@ -521,7 +522,7 @@ defineExpose({
  /* 控制整体宽度，根据图标大小调整 */
  height: 156rpx;
  /* 预估高度，包含图标和文字块 */
-  margin-right: 24rpx;
+  margin-right: 10rpx;
 }

 /* --- 上层图标样式 --- */
@ -532,7 +533,7 @@ defineExpose({
  left: 50%;
  transform: translateX(-50%);
  /* 水平居中 */
-  width: 34rpx;
+  width: 42.6rpx;
  /* 图标宽度 */
  height: 48rpx;
  /* 图标高度 */
--- a/frontend/pages/dashboard/components/RecentUpgrades.vue
+++ b/frontend/pages/dashboard/components/RecentUpgrades.vue
@ -1,6 +1,6 @@
 <template>
  <view class="recent-upgrades">
-    <text class="card-title">即将升级藏品</text>
+    <text class="card-title">最近升级藏品</text>
    <view v-if="!items || items.length === 0" class="empty-row">
      <text class="empty-text">暂无数据</text>
    </view>
--- a/frontend/pages/dashboard/components/UpcomingUpgrades.vue
+++ b/frontend/pages/dashboard/components/UpcomingUpgrades.vue
@ -137,7 +137,9 @@ defineProps({
 }

 .legend-text {
-  font-size: 8rpx;
+  font-size: 32rpx;
+  white-space: nowrap;
+  transform: scale(0.3);
  color: rgba(255, 241, 163, 1);
  text-shadow: -1px 1px 4px rgba(206, 9, 9, 0.84);
 }
--- a/frontend/pages/square/square.vue
+++ b/frontend/pages/square/square.vue
@ -525,7 +525,7 @@ onUnmounted(() => {
  width: 100%;
  height: 100vh;
  /* margin-top: 160rpx; */
-  padding: 208rpx 24rpx 0;
+  padding: 208rpx 16rpx 0;
  box-sizing: border-box;
 }

--- a/frontend/pages/support-activity/components/ThemeBanner.vue
+++ b/frontend/pages/support-activity/components/ThemeBanner.vue
@ -85,7 +85,7 @@ const progressPercent = computed(() => {
  width: 98%;
  height: 328rpx;
  position: relative;
-  top: 240rpx;
+  top: 208rpx;
  overflow: hidden;
  /* 性能优化：启用硬件加速 */
  transform: translateZ(0);
--- a/frontend/pages/support-activity/components/VerticalProgressBar.vue
+++ b/frontend/pages/support-activity/components/VerticalProgressBar.vue
@ -35,7 +35,7 @@ const props = defineProps({
  current: { type: Number, default: 0 },
  target: { type: Number, default: 100 },
  barHeight: { type: String, default: '200rpx' },
-  barWidth: { type: String, default: '16rpx' },
+  barWidth: { type: String, default: '24rpx' },
  circleSize: { type: String, default: '60rpx' },
  fillColor: {
    type: String,
--- a/frontend/utils/api.js
+++ b/frontend/utils/api.js
@ -1,85 +1,74 @@
 // API 基础配置
 // 自动检测后端环境：探测开发服务器是否可用，能连通则用开发地址，否则用生产地址

-// 团队开发机（Gateway + 团队数据库；注册/登录/余额/铸造）
-// const DEV_BASE = 'http://192.168.110.60:8080'
-const DEV_BASE = 'http://localhost:8081'
-const SEGMENT_BASE = 'http://localhost:8081'
-const LASER_BASE = 'http://localhost:8081' // 镭射 AI 生成 + compositor 走本地 Gateway
+const DEV_BASE = 'http://192.168.110.60:8080'    // 开发环境
 const PROD_BASE = 'http://101.132.250.62:8080'   // 生产环境
 const HEALTH_URL = DEV_BASE + '/health'

-// 默认生产；H5 本地开发先走 DEV，避免 health 探测完成前请求打到生产（生产暂无 /segment）
 // 是否使用模拟数据（开发调试时设为 true，后端API准备好后改为 false）
 const USE_MOCK_API = true

 // 环境检测状态：0=检测中, 1=开发环境, 2=生产环境
 let envStatus = 0
 let baseURL = PROD_BASE
-// #ifdef H5
-if (import.meta.env.DEV) {
-	baseURL = DEV_BASE
-	console.log('[API] H5 开发模式，默认地址:', DEV_BASE)
-}
-// #endif

 // 环境检测 Promise，确保 getApiBaseUrl / getWebSocketBaseUrl 等待检测完成
 const envReadyPromise = new Promise((resolve) => {
-    uni.request({
-        url: HEALTH_URL,
-        method: 'GET',
-        timeout: 2000,
-        success: (res) => {
-            if (res.statusCode === 200) {
-                baseURL = DEV_BASE
-                envStatus = 1
-                console.log('[API] 使用开发环境地址:', DEV_BASE)
-            } else {
-                envStatus = 2
-                console.log('[API] 开发环境返回非200，使用生产环境地址:', PROD_BASE)
-            }
-            resolve(envStatus)
-        },
-        fail: () => {
-            envStatus = 2
-            console.log('[API] 开发环境不可用，使用生产环境地址:', PROD_BASE)
-            resolve(envStatus)
-        }
-    })
+	uni.request({
+		url: HEALTH_URL,
+		method: 'GET',
+		timeout: 2000,
+		success: (res) => {
+			if (res.statusCode === 200) {
+				baseURL = DEV_BASE
+				envStatus = 1
+				console.log('[API] 使用开发环境地址:', DEV_BASE)
+			} else {
+				envStatus = 2
+				console.log('[API] 开发环境返回非200，使用生产环境地址:', PROD_BASE)
+			}
+			resolve(envStatus)
+		},
+		fail: () => {
+			envStatus = 2
+			console.log('[API] 开发环境不可用，使用生产环境地址:', PROD_BASE)
+			resolve(envStatus)
+		}
+	})
 })

 /** 等待环境检测完成（返回 'dev' | 'prod'） */
 export async function waitForEnvReady() {
-    await envReadyPromise
-    return envStatus === 1 ? 'dev' : 'prod'
+	await envReadyPromise
+	return envStatus === 1 ? 'dev' : 'prod'
 }

 /** 网关根地址（供 uni.uploadFile 等无法走 request 封装的场景拼接完整 URL） */
 export async function getApiBaseUrl() {
-    await envReadyPromise
-    return String(baseURL).replace(/\/+$/, '')
+	await envReadyPromise
+	return String(baseURL).replace(/\/+$/, '')
 }

 /** 获取 WebSocket 基础地址（将 http:// 替换为 ws://） */
 export async function getWebSocketBaseUrl() {
-    await envReadyPromise
-    const httpUrl = String(baseURL).replace(/\/+$/, '')
-    return httpUrl.replace(/^http:/, 'ws:').replace(/^https:/, 'wss:')
+	await envReadyPromise
+	const httpUrl = String(baseURL).replace(/\/+$/, '')
+	return httpUrl.replace(/^http:/, 'ws:').replace(/^https:/, 'wss:')
 }

 // 兼容旧代码：同步版本在环境检测完成前返回默认值（生产地址）
 export function getApiBaseUrlSync() {
-    return String(baseURL).replace(/\/+$/, '')
+	return String(baseURL).replace(/\/+$/, '')
 }

 /** 抠图专用 Gateway（可与 DEV_BASE 不同：业务走团队库，segment 走本机） */
 export function getSegmentApiBaseUrl() {
-	return String(SEGMENT_BASE).replace(/\/+$/, '')
+	return String(baseURL).replace(/\/+$/, '')
 }

 /** 镭射专用 Gateway（AI 生成 + compositor 走本地，其他业务走远程） */
 export function getLaserApiBaseUrl() {
-	return String(LASER_BASE).replace(/\/+$/, '')
+	return String(baseURL).replace(/\/+$/, '')
 }

 // 模拟网络延迟
@ -1025,20 +1014,20 @@ const DASHBOARD_PREFIX = '/api/v1/dashboard'
 // mock 触发器：当 USE_MOCK_API 为 true 时短路返回 mock 数据
 // 后端就绪后将 USE_MOCK_API 改为 false 即可
 async function dashboardRequest(endpoint, params = {}) {
-  if (USE_MOCK_API) {
-    const factory = mockRouter[`${DASHBOARD_PREFIX}${endpoint}`]
-    if (factory) return factory(params)
-  }
-  return request({ url: `${DASHBOARD_PREFIX}${endpoint}`, method: 'GET', data: params })
+	if (USE_MOCK_API) {
+		const factory = mockRouter[`${DASHBOARD_PREFIX}${endpoint}`]
+		if (factory) return factory(params)
+	}
+	return request({ url: `${DASHBOARD_PREFIX}${endpoint}`, method: 'GET', data: params })
 }

 export const dashboardApi = {
-  getTodayOverview: (starId) => dashboardRequest('/today-overview', { star_id: starId }),
-  get7DayIncomeCurve: (starId) => dashboardRequest('/income-curve', { star_id: starId }),
-  getExhibitionSummary: (starId) => dashboardRequest('/exhibition-summary', { star_id: starId }),
-  getLikeIncomeByLevel: (starId) => dashboardRequest('/like-income-by-level', { star_id: starId }),
-  getTopAssets: (starId) => dashboardRequest('/top-assets', { star_id: starId }),
-  getLevelDistribution: (starId) => dashboardRequest('/level-distribution', { star_id: starId }),
-  getUpgradeProgress: (starId) => dashboardRequest('/upgrade-progress', { star_id: starId }),
+	getTodayOverview: (starId) => dashboardRequest('/today-overview', { star_id: starId }),
+	get7DayIncomeCurve: (starId) => dashboardRequest('/income-curve', { star_id: starId }),
+	getExhibitionSummary: (starId) => dashboardRequest('/exhibition-summary', { star_id: starId }),
+	getLikeIncomeByLevel: (starId) => dashboardRequest('/like-income-by-level', { star_id: starId }),
+	getTopAssets: (starId) => dashboardRequest('/top-assets', { star_id: starId }),
+	getLevelDistribution: (starId) => dashboardRequest('/level-distribution', { star_id: starId }),
+	getUpgradeProgress: (starId) => dashboardRequest('/upgrade-progress', { star_id: starId }),
 }

--- a/frontend/utils/mock/dashboard.js
+++ b/frontend/utils/mock/dashboard.js
@ -58,7 +58,7 @@ export async function mockExhibitionSummary({ star_id }) {
        { asset_id: 1, asset_name: '璀璨星河', asset_thumb: '/static/sucai/image-07.png', duration_7d: '144:13:56', earnings_7d: 2173, avg_earnings: 15 },
        { asset_id: 2, asset_name: '夏日微风', asset_thumb: '/static/sucai/image-19.png', duration_7d: '77:13:56', earnings_7d: 1332, avg_earnings: 15 },
        { asset_id: 3, asset_name: '夜色霓虹', asset_thumb: '/static/sucai/image-23.png', duration_7d: '64:15:37', earnings_7d: 1201, avg_earnings: 12 },
-        { asset_id: 4, asset_name: '黎明序曲', asset_thumb: '/static/sucai/image-38.png', duration_7d: '51:22:12', earnings_7d: 783, avg_earnings: 12 },
+        { asset_id: 4, asset_name: '黎明序曲', asset_thumb: '/static/sucai/image-35.png', duration_7d: '51:22:12', earnings_7d: 783, avg_earnings: 12 },
        { asset_id: 5, asset_name: '深海回响', asset_thumb: '/static/sucai/image-46.png', duration_7d: '51:22:12', earnings_7d: 783, avg_earnings: 12 },
      ],
    },
@ -76,7 +76,7 @@ export async function mockLikeIncomeByLevel({ star_id }) {
      levels: [
        { level: 'UR',  asset_count: 1, total_income: 723, thumb: '/static/sucai/image-03.png' },
        { level: 'SSR', asset_count: 2, total_income: 381, thumb: '/static/sucai/image-14.png' },
-        { level: 'SR',  asset_count: 5, total_income: 233, thumb: '/static/sucai/image-27.png' },
+        { level: 'SR',  asset_count: 5, total_income: 233, thumb: '/static/sucai/image-23.png' },
        { level: 'SR',  asset_count: 4, total_income: 169, thumb: '/static/sucai/image-35.png' },
        { level: 'R',   asset_count: 6, total_income:  57, thumb: '/static/sucai/image-49.png' },
      ],