From 7f9168d11656fa306e27e177d242f0a18fcae439 Mon Sep 17 00:00:00 2001 From: iHeyTang Date: Sun, 28 Sep 2025 12:58:45 +0800 Subject: [PATCH] refactor(friends-photo): streamline Friends Photo page components and styles --- src/app.config.ts | 2 +- src/app.tsx | 6 +- src/assets/icons/photo.png | Bin 0 -> 14769 bytes .../components/IntroCard/index.css | 63 --------- .../components/IntroCard/index.tsx | 23 --- .../components/SubmitButton/index.css | 80 +++-------- .../components/SubmitButton/index.tsx | 5 +- .../components/UploadCard/index.css | 131 ++++-------------- .../components/UploadCard/index.tsx | 40 ++---- src/pages/friends-photo/components/index.ts | 1 - src/pages/friends-photo/hooks/index.ts | 1 - .../friends-photo/hooks/useUsageGuide.ts | 31 ----- src/pages/friends-photo/index.css | 41 ++---- src/pages/friends-photo/index.tsx | 44 +++--- src/platforms/h5/payment.ts | 2 +- 15 files changed, 84 insertions(+), 386 deletions(-) create mode 100644 src/assets/icons/photo.png delete mode 100644 src/pages/friends-photo/components/IntroCard/index.css delete mode 100644 src/pages/friends-photo/components/IntroCard/index.tsx delete mode 100644 src/pages/friends-photo/hooks/useUsageGuide.ts diff --git a/src/app.config.ts b/src/app.config.ts index afaa24f..8103ce5 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -4,8 +4,8 @@ export default defineAppConfig({ pages: [ 'pages/home/index', // 新的模板卡片首页 'pages/history/index', // 历史记录页面 - 'pages/result/index', 'pages/friends-photo/index', // 好友合照页面 + 'pages/result/index', ], tabBar: { color: '#8E9BAE', diff --git a/src/app.tsx b/src/app.tsx index f7140fd..520e61c 100644 --- a/src/app.tsx +++ b/src/app.tsx @@ -21,7 +21,7 @@ function App({ children }: PropsWithChildren) { } const authorize = createPlatformFactory().createAuthorize() - const payment = createPlatformFactory().createPayment() + // const payment = createPlatformFactory().createPayment() try { // 检查登录状态，包括OAuth 2.0回调处理 const isLoggedIn = await authorize.checkLogin() @@ -29,8 +29,8 @@ function App({ children }: PropsWithChildren) { // 可以根据需要决定是否自动跳转登录 await authorize.login() } - const result = await payment.pay(`character_figurine_v1`, ``) - console.log({ result }) + // const result = await payment.pay(`character_figurine_v1`, ``) + // console.log({ result }) } catch (error) { console.error('登录检查失败:', error) } diff --git a/src/assets/icons/photo.png b/src/assets/icons/photo.png new file mode 100644 index 0000000000000000000000000000000000000000..9bf8b34c9b1f9c68635c5311f2aaebb4c0e99a34 GIT binary patch literal 14769 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 - - 👫 - - {t('friendsPhoto.friendsPhotoGeneration')} - {t('friendsPhoto.uploadTwoPhotosDesc')} - - - - ); -} diff --git a/src/pages/friends-photo/components/SubmitButton/index.css b/src/pages/friends-photo/components/SubmitButton/index.css index f669741..18b81cc 100644 --- a/src/pages/friends-photo/components/SubmitButton/index.css +++ b/src/pages/friends-photo/components/SubmitButton/index.css @@ -4,74 +4,44 @@ bottom: 0; left: 0; right: 0; - padding: 20px; - background: white; - border-top: 1px solid #e5e7eb; - box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.08); - backdrop-filter: blur(10px); + padding: 20px 14px; + padding-bottom: calc(20px + env(safe-area-inset-bottom)); z-index: 10; } /* 提交按钮 */ .submit-button { width: 100%; - height: 56px; - background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%); - border-radius: 28px; + height: 96px; + background: #000; + border-radius: 24px; border: none; - color: white; - font-size: 16px; - font-weight: 600; + outline: none; display: flex; align-items: center; justify-content: center; gap: 8px; - transition: all 0.3s ease; - box-shadow: 0 6px 24px rgba(59, 130, 246, 0.4); - position: relative; - overflow: hidden; -} - -.submit-button::before { - content: ''; - position: absolute; - top: -50%; - left: -50%; - width: 200%; - height: 200%; - background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.2), transparent); - transform: rotate(45deg); - transition: transform 0.6s ease; -} - -.submit-button:not(.disabled):active::before { - transform: rotate(45deg) translateX(100%); -} - -.submit-button.disabled { - background: #d1d5db; - box-shadow: none; - cursor: not-allowed; -} - -.submit-button:not(.disabled):active { - transform: translateY(2px); - box-shadow: 0 3px 16px rgba(59, 130, 246, 0.4); -} - -.submit-icon { - font-size: 18px; + transition: all 0.2s ease; } .submit-text { + color: white; + font-size: 24px; font-weight: 600; } +.submit-button[disabled] { + background-color: #ccc; + cursor: not-allowed; + border: none; + outline: none; +} + /* 加载动画 */ .loading-spinner { width: 16px; height: 16px; - border: 2px solid rgba(255, 255, 255, 0.3); + border: 2px solid rgb(255 255 255 / 30%); border-top: 2px solid white; border-radius: 50%; animation: spin 1s linear infinite; @@ -81,22 +51,8 @@ 0% { transform: rotate(0deg); } + 100% { transform: rotate(360deg); } } - -/* 响应式适配 */ -@media (max-width: 375px) { - .submit-section { - padding: 16px; - } -} - -/* 深色模式适配 */ -@media (prefers-color-scheme: dark) { - .submit-section { - background: #2a2a2a; - border-color: #333; - } -} diff --git a/src/pages/friends-photo/components/SubmitButton/index.tsx b/src/pages/friends-photo/components/SubmitButton/index.tsx index b2356fd..5668270 100644 --- a/src/pages/friends-photo/components/SubmitButton/index.tsx +++ b/src/pages/friends-photo/components/SubmitButton/index.tsx @@ -21,10 +21,7 @@ export default function SubmitButton({ disabled, loading, onSubmit, className = {t('friendsPhoto.generating')} ) : ( - <> - ✨ - {t('friendsPhoto.startGenerating')} - + {t('friendsPhoto.startGenerating')} )} diff --git a/src/pages/friends-photo/components/UploadCard/index.css b/src/pages/friends-photo/components/UploadCard/index.css index f2b181f..17061ad 100644 --- a/src/pages/friends-photo/components/UploadCard/index.css +++ b/src/pages/friends-photo/components/UploadCard/index.css @@ -1,60 +1,29 @@ /* 上传卡片 */ .upload-card { - background: white; - border-radius: 16px; - box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); - overflow: hidden; - transition: all 0.3s ease; + flex: 1; + min-width: 0; + display: flex; + flex-direction: column; + align-items: center; + cursor: pointer; + transition: all 0.2s ease; } .upload-card:active { transform: scale(0.98); - box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12); } -.upload-card-content { - padding: 20px; -} - -/* 上传信息 */ -.upload-info { - margin-bottom: 16px; -} - -.upload-title { - font-size: 16px; - font-weight: 600; - color: #1d1f22; - margin-bottom: 4px; -} - -.upload-description { - font-size: 14px; - color: #8e9bae; -} - -/* 上传区域 */ -.upload-area { +/* 上传内容区域 */ +.upload-content { width: 100%; - height: 160px; - border: 2px dashed #e5e7eb; - border-radius: 12px; + aspect-ratio: 3/4; + background: #f6f7f9; + border-radius: 16px; display: flex; align-items: center; justify-content: center; - background: #fafbfc; - transition: all 0.3s ease; - position: relative; overflow: hidden; -} - -.upload-area:active { - transform: scale(0.98); -} - -.upload-area.has-image { - border: 2px solid #3b82f6; - background: transparent; + position: relative; } /* 上传占位符 */ @@ -62,18 +31,16 @@ display: flex; flex-direction: column; align-items: center; - gap: 8px; + justify-content: center; + width: 100%; + height: 100%; + gap: 24px; } .upload-icon { - font-size: 32px; - color: #8e9bae; -} - -.upload-hint { - font-size: 14px; - color: #8e9bae; - font-weight: 500; + width: 25%; + aspect-ratio: 1; + height: auto; } /* 上传的图片 */ @@ -81,61 +48,13 @@ width: 100%; height: 100%; object-fit: cover; - border-radius: 10px; } -/* 图片覆盖层 */ -.image-overlay { - position: absolute; - inset: 0; - background: rgba(0, 0, 0, 0.6); - display: flex; - align-items: center; - justify-content: center; - opacity: 0; - transition: opacity 0.3s ease; - backdrop-filter: blur(4px); -} - -.upload-area.has-image:active .image-overlay { - opacity: 1; -} - -.overlay-content { - display: flex; - flex-direction: column; - align-items: center; - gap: 8px; -} - -.change-icon { - font-size: 24px; - color: white; -} - -.change-text { - color: white; +/* 标题 */ +.upload-title { font-size: 14px; font-weight: 500; -} - -/* 深色模式适配 */ -@media (prefers-color-scheme: dark) { - .upload-card { - background: #2a2a2a; - border: 1px solid #333; - } - - .upload-title { - color: #fff; - } - - .upload-description { - color: #999; - } - - .upload-area { - background: #333; - border-color: #444; - } + color: #666; + text-align: center; + line-height: 1.2; } diff --git a/src/pages/friends-photo/components/UploadCard/index.tsx b/src/pages/friends-photo/components/UploadCard/index.tsx index 16b08a3..db89c94 100644 --- a/src/pages/friends-photo/components/UploadCard/index.tsx +++ b/src/pages/friends-photo/components/UploadCard/index.tsx @@ -1,43 +1,25 @@ import { View, Image } from '@tarojs/components'; -import { useI18n } from '../../../../hooks/useI18n'; import './index.css'; interface UploadCardProps { imageUrl: string; title: string; - description: string; onUpload: () => void; className?: string; } -export default function UploadCard({ imageUrl, title, description, onUpload, className = '' }: UploadCardProps) { - const { t } = useI18n(); - +export default function UploadCard({ imageUrl, title, onUpload, className = '' }: UploadCardProps) { return ( - - - - {title} - {description} - - - {imageUrl ? ( - <> - - - - 🔄 - {t('friendsPhoto.clickToChange')} - - - - ) : ( - - 📷 - {t('friendsPhoto.clickToUpload')} - - )} - + + + {imageUrl ? ( + + ) : ( + + + {title} + + )} ); diff --git a/src/pages/friends-photo/components/index.ts b/src/pages/friends-photo/components/index.ts index cbafda3..044d379 100644 --- a/src/pages/friends-photo/components/index.ts +++ b/src/pages/friends-photo/components/index.ts @@ -1,3 +1,2 @@ -export { default as IntroCard } from './IntroCard'; export { default as UploadCard } from './UploadCard'; export { default as SubmitButton } from './SubmitButton'; diff --git a/src/pages/friends-photo/hooks/index.ts b/src/pages/friends-photo/hooks/index.ts index acbd67d..8513c14 100644 --- a/src/pages/friends-photo/hooks/index.ts +++ b/src/pages/friends-photo/hooks/index.ts @@ -1,2 +1 @@ -export { useUsageGuide } from './useUsageGuide'; export { useImageUpload } from './useImageUpload'; diff --git a/src/pages/friends-photo/hooks/useUsageGuide.ts b/src/pages/friends-photo/hooks/useUsageGuide.ts deleted file mode 100644 index 1b97eb0..0000000 --- a/src/pages/friends-photo/hooks/useUsageGuide.ts +++ /dev/null @@ -1,31 +0,0 @@ -import { useState, useEffect } from 'react'; -import Taro from '@tarojs/taro'; -import { useI18n } from '../../../hooks/useI18n'; - -export function useUsageGuide() { - const [showGuide, setShowGuide] = useState(true); - const { t } = useI18n(); - - useEffect(() => { - if (!showGuide) return; - - const timer = setTimeout(() => { - Taro.showModal({ - title: t('friendsPhoto.usageTips'), - content: t('friendsPhoto.usageTipsContent'), - confirmText: t('friendsPhoto.iKnow'), - showCancel: false, - success: () => { - setShowGuide(false); - }, - }); - }, 1000); - - return () => clearTimeout(timer); - }, [showGuide, t]); - - return { - showGuide, - setShowGuide, - }; -} diff --git a/src/pages/friends-photo/index.css b/src/pages/friends-photo/index.css index 6fbed15..d033ad9 100644 --- a/src/pages/friends-photo/index.css +++ b/src/pages/friends-photo/index.css @@ -1,45 +1,20 @@ /* 页面容器 */ .friends-photo { height: 100vh; - background: #f5f6f8; + background: #f8f9fa; display: flex; flex-direction: column; position: relative; } -/* 滚动容器 */ -.friends-photo-scroll { - flex: 1; - height: 100%; - padding-bottom: 100px; /* 为固定底部按钮留空间 */ -} - - /* 上传区域 */ .upload-section { - padding: 0 20px; + flex: 1; + padding: 40px 14px 88px; display: flex; - flex-direction: column; - gap: 16px; -} - - -/* 底部间距 */ -.bottom-spacer { - height: 20px; -} - - -/* 响应式适配 */ -@media (max-width: 375px) { - .upload-section { - padding: 0 16px; - } -} - -/* 深色模式适配 */ -@media (prefers-color-scheme: dark) { - .friends-photo { - background: #1a1a1a; - } + flex-direction: row; + align-items: center; + gap: 12px; + min-height: 0; + overflow: hidden; } diff --git a/src/pages/friends-photo/index.tsx b/src/pages/friends-photo/index.tsx index 0501f67..f4be088 100644 --- a/src/pages/friends-photo/index.tsx +++ b/src/pages/friends-photo/index.tsx @@ -1,4 +1,4 @@ -import { View, ScrollView } from '@tarojs/components'; +import { View } from '@tarojs/components'; import { useState, useEffect } from 'react'; import Taro, { navigateTo, useRouter } from '@tarojs/taro'; import { useServerSdk } from '../../hooks/index'; @@ -6,10 +6,10 @@ import { useI18n } from '../../hooks/useI18n'; import { i18nManager } from '../../i18n/manager'; // 导入组件 -import { IntroCard, UploadCard, SubmitButton } from './components'; +import { UploadCard, SubmitButton } from './components'; // 导入hooks -import { useUsageGuide, useImageUpload } from './hooks'; +import { useImageUpload } from './hooks'; import './index.css'; @@ -20,8 +20,6 @@ export default function FriendsPhoto() { const [loading, setLoading] = useState(false); - // 使用自定义hooks - useUsageGuide(); // 自动处理使用指南显示 const { image1, image2, uploadSingleImage } = useImageUpload(); // 设置页面标题 @@ -89,29 +87,19 @@ export default function FriendsPhoto() { return ( - - {/* 顶部介绍卡片 */} - - - {/* 上传区域 */} - - uploadSingleImage(1)} - /> - uploadSingleImage(2)} - /> - - - {/* 底部间距 */} - - + {/* 上传区域 */} + + uploadSingleImage(1)} + /> + uploadSingleImage(2)} + /> + {/* 固定底部按钮 */} diff --git a/src/platforms/h5/payment.ts b/src/platforms/h5/payment.ts index cc22f93..84bef86 100644 --- a/src/platforms/h5/payment.ts +++ b/src/platforms/h5/payment.ts @@ -9,4 +9,4 @@ export class H5Payment extends Payment { } throw new Error(`payment error: ${response}`) } -} \ No newline at end of file +}