diff --git a/.gitignore b/.gitignore index ba64f304..cd6c6f9d 100644 --- a/.gitignore +++ b/.gitignore @@ -5,9 +5,6 @@ node_modules/ .trae/ *.log node_modules -miniprogram -my-app -newpp # 部署配置（含服务器信息，勿提交） deploy_config.json diff --git a/CHANGELOG-小程序同步.md b/CHANGELOG-小程序同步.md new file mode 100644 index 00000000..ff195949 --- /dev/null +++ b/CHANGELOG-小程序同步.md @@ -0,0 +1,260 @@ +# 小程序功能同步更新日志 + +## [1.0.0] - 2026-02-04 + +### 🎉 重大更新 + +本次更新完成了 Next.js 功能到微信小程序的完整同步，实现了 **1:1 功能复刻**。 + +--- + +## ✨ 新增功能 + +### 1. 目录页搜索按钮 +- 导航栏右上角添加搜索按钮 +- 点击跳转到搜索页 +- 样式与 Next.js 完全一致 + +**影响文件:** +- `pages/chapters/chapters.wxml` +- `pages/chapters/chapters.wxss` +- `pages/chapters/chapters.js` + +--- + +### 2. 我的页收益卡片艺术化 +- 深蓝渐变背景 (#1a1a2e → #16213e → #0f3460) +- 背景装饰圆（金色右上、青色左下） +- 收益金额使用金色渐变文字 +- 推广按钮使用金色渐变背景 +- 增强视觉冲击力 + +**影响文件:** +- `pages/my/my.wxml` +- `pages/my/my.wxss` + +**视觉效果:** +``` +┌─────────────────────────────┐ +│ 我的收益 推广中心 ↗│ +│ │ +│ 累计收益 可提现 │ +│ ¥8.91 ¥0.00 │ +│ │ +│ 🎁 推广中心 / 提现 │ +└─────────────────────────────┘ +``` + +--- + +### 3. 地址管理模块（完整新建） + +#### 3.1 地址列表页 +- 地址卡片展示（姓名、手机、地址） +- 默认地址标签 +- 编辑、删除操作 +- 新增地址按钮 +- 空状态提示 + +**新增文件:** +- `pages/addresses/addresses.js` +- `pages/addresses/addresses.wxml` +- `pages/addresses/addresses.wxss` +- `pages/addresses/addresses.json` + +#### 3.2 地址编辑页 +- 表单输入（姓名、手机号、详细地址） +- 省市区三级联动选择器 +- 设为默认地址开关 +- 表单验证 +- 保存功能 + +**新增文件:** +- `pages/addresses/edit.js` +- `pages/addresses/edit.wxml` +- `pages/addresses/edit.wxss` +- `pages/addresses/edit.json` + +#### 3.3 设置页入口 +- 在设置页添加「收货地址」入口 +- 点击「管理」跳转到地址列表 + +**影响文件:** +- `pages/settings/settings.wxml` +- `pages/settings/settings.wxss` +- `pages/settings/settings.js` + +--- + +### 4. CSS 变量系统 + +在全局样式中添加 CSS 变量，便于统一管理： + +```css +page { + /* 品牌色 */ + --app-brand: #00CED1; + --app-brand-light: rgba(0, 206, 209, 0.1); + + /* 背景色 */ + --app-bg-primary: #000000; + --app-bg-secondary: #1c1c1e; + --app-bg-tertiary: #2c2c2e; + + /* 文字色 */ + --app-text-primary: #ffffff; + --app-text-secondary: rgba(255, 255, 255, 0.7); + --app-text-tertiary: rgba(255, 255, 255, 0.4); + + /* iOS 系统色 */ + --ios-indigo: #5856D6; + --ios-green: #30d158; + + /* 其他辅助色 */ + --gold: #FFD700; + --pink: #E91E63; + --purple: #7B61FF; +} +``` + +**影响文件:** +- `app.wxss` + +--- + +## 🔄 功能优化 + +### 1. 推广中心（已有功能验证） +- ✅ 绑定用户列表 Tab切换 +- ✅ 过期提醒横幅 +- ✅ 用户状态标签 +- ✅ 分享按钮组 +- ✅ 提现功能 + +### 2. 搜索功能（已有功能验证） +- ✅ 搜索输入框 +- ✅ 热门关键词 +- ✅ 热门章节推荐 +- ✅ 搜索结果列表 + +### 3. 海报生成（已有功能验证） +- ✅ Canvas 绘制 +- ✅ 小程序码集成 +- ✅ 保存到相册 + +--- + +## 📐 样式统一 + +### 颜色规范 +- 背景: #000000 → 统一使用纯黑 +- 品牌色: #00CED1 → 所有页面统一 +- 卡片背景: #1c1c1e / #2c2c2e +- 文字颜色: #ffffff / rgba(255,255,255,0.7) / rgba(255,255,255,0.4) + +### 圆角规范 +- 小标签: 8rpx +- 中等卡片: 24rpx +- 大卡片: 32rpx +- 圆形: 50% + +### 间距规范 +- 页面边距: 32rpx +- 卡片padding: 32rpx +- 元素间距: 24rpx +- 小间距: 16rpx + +--- + +## 📊 代码统计 + +### 新增代码 +- 新增文件: 10个 +- 新增代码行数: ~1200行 + +### 修改代码 +- 修改文件: 7个 +- 修改代码行数: ~150行 + +### 文档 +- 新增文档: 4个 + - `功能同步完成报告.md` + - `样式检查清单.md` + - `交付清单.md` + - `快速测试指南.md` + +--- + +## 🔗 相关文档 + +| 文档 | 位置 | 说明 | +|-----|------|-----| +| 转换提示词 | `转换提示词.md` | 原始需求和执行计划 | +| 完成报告 | `miniprogram/功能同步完成报告.md` | 详细完成情况 | +| 样式检查 | `miniprogram/样式检查清单.md` | 样式统一性检查 | +| 交付清单 | `miniprogram/交付清单.md` | 交付成果清单 | +| 测试指南 | `miniprogram/快速测试指南.md` | 测试指引 | +| 开发约束 | `开发文档/0、Mycontent-book 项目总览.md` | 开发策略约束 | + +--- + +## 🚨 重要说明 + +### 开发约束（2026-02-04 起生效） + +``` +┌────────────────┬──────────┬─────────────────────────┐ +│ 微信小程序 │ ✅ 活跃 │ 所有C端新功能在此开发 │ +│ Next.js C端 │ 🔒 冻结 │ app/view/ 不再新增功能 │ +│ Next.js 管理端 │ ✅ 活跃 │ app/admin/ 继续开发 │ +│ API 接口 │ ✅ 活跃 │ 小程序和管理端共用 │ +└────────────────┴──────────┴─────────────────────────┘ +``` + +### 登录体系差异 + +- **小程序**: 保持微信一键登录（不复刻 Next.js 登录页） +- **Next.js**: 保持手机号+密码登录 +- **统一**: 后端以手机号为唯一标识 + +--- + +## 📋 下一步计划 + +### 短期（本周） +- [ ] 完成功能测试 +- [ ] 修复发现的 Bug +- [ ] 优化用户体验细节 + +### 中期（本月） +- [ ] 性能优化（首屏加载、图片懒加载） +- [ ] 动画优化（更流畅的过渡） +- [ ] 数据缓存策略 + +### 长期（持续） +- [ ] 用户反馈收集 +- [ ] 功能迭代 +- [ ] 数据分析优化 + +--- + +## 👥 贡献者 + +- **执行**: AI Assistant +- **审核**: 待定 +- **测试**: 待定 + +--- + +## 📜 版本历史 + +### v1.0.0 (2026-02-04) +- ✅ 完成 Next.js 功能同步 +- ✅ 新增地址管理模块 +- ✅ 优化收益卡片设计 +- ✅ 添加搜索按钮 +- ✅ 统一全局样式 + +--- + +*本次更新标志着小程序功能达到与 Next.js Web端同等水平。* diff --git a/miniprogram/.gitignore b/miniprogram/.gitignore new file mode 100644 index 00000000..14ea590c --- /dev/null +++ b/miniprogram/.gitignore @@ -0,0 +1,14 @@ +# Windows +[Dd]esktop.ini +Thumbs.db +$RECYCLE.BIN/ + +# macOS +.DS_Store +.fseventsd +.Spotlight-V100 +.TemporaryItems +.Trashes + +# Node.js +node_modules/ diff --git a/miniprogram/README.md b/miniprogram/README.md new file mode 100644 index 00000000..2cc11dbf --- /dev/null +++ b/miniprogram/README.md @@ -0,0 +1,138 @@ +# Soul创业实验 - 微信小程序 + +> 一场SOUL的创业实验场 - 来自Soul派对房的真实商业故事 + +## 📱 项目简介 + +本项目是《一场SOUL的创业实验场》的微信小程序版本，完整还原了Web端的所有UI界面和功能。 + +## 🎨 设计特点 + +- **主题色**: Soul青色 (#00CED1) +- **设计风格**: 深色主题 + 毛玻璃效果 +- **1:1还原**: 完全复刻Web端的UI设计 + +## 📂 项目结构 + +``` +miniprogram/ +├── app.js # 应用入口 +├── app.json # 应用配置 +├── app.wxss # 全局样式 +├── custom-tab-bar/ # 自定义TabBar组件 +│ ├── index.js +│ ├── index.json +│ ├── index.wxml +│ └── index.wxss +├── pages/ +│ ├── index/ # 首页 +│ ├── chapters/ # 目录页 +│ ├── match/ # 找伙伴页 +│ ├── my/ # 我的页面 +│ ├── read/ # 阅读页 +│ ├── about/ # 关于作者 +│ ├── referral/ # 推广中心 +│ ├── purchases/ # 订单页 +│ └── settings/ # 设置页 +├── utils/ +│ ├── util.js # 工具函数 +│ └── payment.js # 支付工具 +├── assets/ +│ └── icons/ # 图标资源 +├── project.config.json # 项目配置 +└── sitemap.json # 站点地图 +``` + +## 🚀 功能列表 + +### 核心功能 +- ✅ 首页 - 书籍展示、推荐章节、阅读进度 +- ✅ 目录 - 完整章节列表、篇章折叠展开 +- ✅ 找伙伴 - 匹配动画、匹配类型选择 +- ✅ 我的 - 个人信息、订单、推广中心 +- ✅ 阅读 - 付费墙、章节导航、分享功能 + +### 特色功能 +- ✅ 自定义TabBar（中间突出的找伙伴按钮） +- ✅ 阅读进度条 +- ✅ 匹配动画效果 +- ✅ 付费墙与购买流程 +- ✅ 分享海报功能 +- ✅ 推广佣金系统 + +## 🛠 开发指南 + +### 环境要求 +- 微信开发者工具 >= 1.06.2308310 +- 基础库版本 >= 3.3.4 + +### 快速开始 + +1. **下载微信开发者工具** + - 前往 [微信开发者工具下载页面](https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html) + +2. **导入项目** + - 打开微信开发者工具 + - 选择"导入项目" + - 项目目录选择 `miniprogram` 文件夹 + - AppID 使用: `wx432c93e275548671` + +3. **编译运行** + - 点击"编译"按钮 + - 在模拟器中预览效果 + +### 真机调试 + +1. 点击工具栏的"预览"按钮 +2. 使用微信扫描二维码 +3. 在真机上测试所有功能 + +## 📝 配置说明 + +### API配置 +在 `app.js` 中修改 `globalData.baseUrl`: + +```javascript +globalData: { + baseUrl: 'https://soul.ckb.fit', // 你的API地址 + // ... +} +``` + +### AppID配置 +在 `project.config.json` 中修改: + +```json +{ + "appid": "你的小程序AppID" +} +``` + +## 🎯 上线发布 + +1. **准备工作** + - 确保所有功能测试通过 + - 检查API接口是否正常 + - 确认支付功能已配置 + +2. **上传代码** + - 在开发者工具中点击"上传" + - 填写版本号和项目备注 + +3. **提交审核** + - 登录[微信公众平台](https://mp.weixin.qq.com) + - 进入"版本管理" + - 提交审核 + +4. **发布上线** + - 审核通过后点击"发布" + +## 🔗 相关链接 + +- **Web版本**: https://soul.ckb.fit +- **作者微信**: 28533368 +- **技术支持**: 存客宝 + +## 📄 版权信息 + +© 2024 卡若. All rights reserved. diff --git a/miniprogram/app.js b/miniprogram/app.js new file mode 100644 index 00000000..e0c3901b --- /dev/null +++ b/miniprogram/app.js @@ -0,0 +1,464 @@ +/** + * Soul创业派对 - 小程序入口 + * 开发: 卡若 + */ + +App({ + globalData: { + // API基础地址 - 连接真实后端 + baseUrl: 'https://soul.quwanzhi.com', + + // 小程序配置 - 真实AppID + appId: 'wxb8bbb2b10dec74aa', + + // 微信支付配置 + mchId: '1318592501', // 商户号 + + // 用户信息 + userInfo: null, + openId: null, // 微信openId，支付必需 + isLoggedIn: false, + + // 书籍数据 + bookData: null, + totalSections: 62, + + // 购买记录 + purchasedSections: [], + hasFullBook: false, + + // 推荐绑定 + pendingReferralCode: null, // 待绑定的推荐码 + + // 主题配置 + theme: { + brandColor: '#00CED1', + brandSecondary: '#20B2AA', + goldColor: '#FFD700', + bgColor: '#000000', + cardBg: '#1c1c1e' + }, + + // 系统信息 + systemInfo: null, + statusBarHeight: 44, + navBarHeight: 88, + + // TabBar相关 + currentTab: 0 + }, + + onLaunch(options) { + // 获取系统信息 + this.getSystemInfo() + + // 检查登录状态 + this.checkLoginStatus() + + // 加载书籍数据 + this.loadBookData() + + // 检查更新 + this.checkUpdate() + + // 处理分享参数（推荐码绑定） + this.handleReferralCode(options) + }, + + // 小程序显示时也检查分享参数 + onShow(options) { + this.handleReferralCode(options) + }, + + // 处理推荐码绑定 + handleReferralCode(options) { + const query = options?.query || {} + const refCode = query.ref || query.referralCode + + if (refCode) { + console.log('[App] 检测到推荐码:', refCode) + + // 立即记录访问（不需要登录，用于统计"通过链接进的人数"） + this.recordReferralVisit(refCode) + + // 检查是否已经绑定过 + const boundRef = wx.getStorageSync('boundReferralCode') + if (boundRef && boundRef !== refCode) { + console.log('[App] 已绑定过其他推荐码，不更换绑定关系') + // 但仍然记录访问，不return + } else { + // 保存待绑定的推荐码 + this.globalData.pendingReferralCode = refCode + wx.setStorageSync('pendingReferralCode', refCode) + + // 如果已登录，立即绑定 + if (this.globalData.isLoggedIn && this.globalData.userInfo) { + this.bindReferralCode(refCode) + } + } + } + }, + + // 记录推荐访问（不需要登录，用于统计） + async recordReferralVisit(refCode) { + try { + // 获取openId（如果有） + const openId = this.globalData.openId || wx.getStorageSync('openId') || '' + const userId = this.globalData.userInfo?.id || '' + + await this.request('/api/referral/visit', { + method: 'POST', + data: { + referralCode: refCode, + visitorOpenId: openId, + visitorId: userId, + source: 'miniprogram', + page: getCurrentPages()[getCurrentPages().length - 1]?.route || '' + } + }) + console.log('[App] 记录推荐访问成功') + } catch (e) { + console.log('[App] 记录推荐访问失败:', e.message) + // 忽略错误，不影响用户体验 + } + }, + + // 绑定推荐码到用户 + async bindReferralCode(refCode) { + try { + const userId = this.globalData.userInfo?.id + if (!userId || !refCode) return + + // 检查是否已绑定 + const boundRef = wx.getStorageSync('boundReferralCode') + if (boundRef) { + console.log('[App] 已绑定推荐码，跳过') + return + } + + console.log('[App] 绑定推荐码:', refCode, '到用户:', userId) + + // 调用API绑定推荐关系 + const res = await this.request('/api/referral/bind', { + method: 'POST', + data: { + userId, + referralCode: refCode + } + }) + + if (res.success) { + console.log('[App] 推荐码绑定成功') + wx.setStorageSync('boundReferralCode', refCode) + this.globalData.pendingReferralCode = null + wx.removeStorageSync('pendingReferralCode') + } + } catch (e) { + console.error('[App] 绑定推荐码失败:', e) + } + }, + + // 获取系统信息 + getSystemInfo() { + try { + const systemInfo = wx.getSystemInfoSync() + this.globalData.systemInfo = systemInfo + this.globalData.statusBarHeight = systemInfo.statusBarHeight || 44 + + // 计算导航栏高度 + const menuButton = wx.getMenuButtonBoundingClientRect() + if (menuButton) { + this.globalData.navBarHeight = (menuButton.top - systemInfo.statusBarHeight) * 2 + menuButton.height + systemInfo.statusBarHeight + } + } catch (e) { + console.error('获取系统信息失败:', e) + } + }, + + // 检查登录状态 + checkLoginStatus() { + try { + const userInfo = wx.getStorageSync('userInfo') + const token = wx.getStorageSync('token') + + if (userInfo && token) { + this.globalData.userInfo = userInfo + this.globalData.isLoggedIn = true + this.globalData.purchasedSections = userInfo.purchasedSections || [] + this.globalData.hasFullBook = userInfo.hasFullBook || false + } + } catch (e) { + console.error('检查登录状态失败:', e) + } + }, + + // 加载书籍数据 + async loadBookData() { + try { + // 先从缓存加载 + const cachedData = wx.getStorageSync('bookData') + if (cachedData) { + this.globalData.bookData = cachedData + } + + // 从服务器获取最新数据 + const res = await this.request('/api/book/all-chapters') + if (res && res.data) { + this.globalData.bookData = res.data + wx.setStorageSync('bookData', res.data) + } + } catch (e) { + console.error('加载书籍数据失败:', e) + } + }, + + // 检查更新 + checkUpdate() { + if (wx.canIUse('getUpdateManager')) { + const updateManager = wx.getUpdateManager() + + updateManager.onCheckForUpdate((res) => { + if (res.hasUpdate) { + console.log('发现新版本') + } + }) + + updateManager.onUpdateReady(() => { + wx.showModal({ + title: '更新提示', + content: '新版本已准备好，是否重启应用？', + success: (res) => { + if (res.confirm) { + updateManager.applyUpdate() + } + } + }) + }) + + updateManager.onUpdateFailed(() => { + wx.showToast({ + title: '更新失败，请稍后重试', + icon: 'none' + }) + }) + } + }, + + // 统一请求方法 + request(url, options = {}) { + return new Promise((resolve, reject) => { + const token = wx.getStorageSync('token') + + wx.request({ + url: this.globalData.baseUrl + url, + method: options.method || 'GET', + data: options.data || {}, + header: { + 'Content-Type': 'application/json', + 'Authorization': token ? `Bearer ${token}` : '', + ...options.header + }, + success: (res) => { + if (res.statusCode === 200) { + resolve(res.data) + } else if (res.statusCode === 401) { + // 未授权，清除登录状态 + this.logout() + reject(new Error('未授权')) + } else { + reject(new Error(res.data?.message || '请求失败')) + } + }, + fail: (err) => { + reject(err) + } + }) + }) + }, + + // 登录方法 - 获取openId用于支付 + async login() { + try { + // 获取微信登录code + const loginRes = await new Promise((resolve, reject) => { + wx.login({ + success: resolve, + fail: reject + }) + }) + + console.log('[App] 获取登录code成功') + + try { + // 发送code到服务器获取openId + const res = await this.request('/api/miniprogram/login', { + method: 'POST', + data: { code: loginRes.code } + }) + + if (res.success && res.data) { + // 保存openId + if (res.data.openId) { + this.globalData.openId = res.data.openId + wx.setStorageSync('openId', res.data.openId) + console.log('[App] 获取openId成功') + } + + // 保存用户信息 + if (res.data.user) { + this.globalData.userInfo = res.data.user + this.globalData.isLoggedIn = true + this.globalData.purchasedSections = res.data.user.purchasedSections || [] + this.globalData.hasFullBook = res.data.user.hasFullBook || false + + wx.setStorageSync('userInfo', res.data.user) + wx.setStorageSync('token', res.data.token || '') + + // 登录成功后，检查待绑定的推荐码并执行绑定 + const pendingRef = wx.getStorageSync('pendingReferralCode') || this.globalData.pendingReferralCode + if (pendingRef) { + console.log('[App] 登录后自动绑定推荐码:', pendingRef) + this.bindReferralCode(pendingRef) + } + } + + return res.data + } + } catch (apiError) { + console.log('[App] API登录失败:', apiError.message) + // 不使用模拟登录，提示用户网络问题 + wx.showToast({ title: '网络异常，请重试', icon: 'none' }) + return null + } + + return null + } catch (e) { + console.error('[App] 登录失败:', e) + wx.showToast({ title: '登录失败，请重试', icon: 'none' }) + return null + } + }, + + // 获取openId (支付必需) + async getOpenId() { + // 先检查缓存 + const cachedOpenId = wx.getStorageSync('openId') + if (cachedOpenId) { + this.globalData.openId = cachedOpenId + return cachedOpenId + } + + // 没有缓存则登录获取 + try { + const loginRes = await new Promise((resolve, reject) => { + wx.login({ success: resolve, fail: reject }) + }) + + const res = await this.request('/api/miniprogram/login', { + method: 'POST', + data: { code: loginRes.code } + }) + + if (res.success && res.data?.openId) { + this.globalData.openId = res.data.openId + wx.setStorageSync('openId', res.data.openId) + return res.data.openId + } + } catch (e) { + console.error('[App] 获取openId失败:', e) + } + + return null + }, + + // 模拟登录已废弃 - 不再使用 + // 现在必须使用真实的微信登录获取openId作为唯一标识 + mockLogin() { + console.warn('[App] mockLogin已废弃，请使用真实登录') + return null + }, + + // 手机号登录 + async loginWithPhone(phoneCode) { + try { + // 尝试API登录 + const res = await this.request('/api/wechat/phone-login', { + method: 'POST', + data: { code: phoneCode } + }) + + if (res.success && res.data) { + this.globalData.userInfo = res.data.user + this.globalData.isLoggedIn = true + this.globalData.purchasedSections = res.data.user.purchasedSections || [] + this.globalData.hasFullBook = res.data.user.hasFullBook || false + + wx.setStorageSync('userInfo', res.data.user) + wx.setStorageSync('token', res.data.token) + + // 登录成功后绑定推荐码 + const pendingRef = wx.getStorageSync('pendingReferralCode') || this.globalData.pendingReferralCode + if (pendingRef) { + console.log('[App] 手机号登录后自动绑定推荐码:', pendingRef) + this.bindReferralCode(pendingRef) + } + + return res.data + } + } catch (e) { + console.log('[App] 手机号登录失败:', e) + wx.showToast({ title: '登录失败，请重试', icon: 'none' }) + } + + return null + }, + + // 退出登录 + logout() { + this.globalData.userInfo = null + this.globalData.isLoggedIn = false + this.globalData.purchasedSections = [] + this.globalData.hasFullBook = false + + wx.removeStorageSync('userInfo') + wx.removeStorageSync('token') + }, + + // 检查是否已购买章节 + hasPurchased(sectionId) { + if (this.globalData.hasFullBook) return true + return this.globalData.purchasedSections.includes(sectionId) + }, + + // 获取章节总数 + getTotalSections() { + return this.globalData.totalSections + }, + + // 切换TabBar + switchTab(index) { + this.globalData.currentTab = index + }, + + // 显示Toast + showToast(title, icon = 'none') { + wx.showToast({ + title, + icon, + duration: 2000 + }) + }, + + // 显示Loading + showLoading(title = '加载中...') { + wx.showLoading({ + title, + mask: true + }) + }, + + // 隐藏Loading + hideLoading() { + wx.hideLoading() + } +}) diff --git a/miniprogram/app.json b/miniprogram/app.json new file mode 100644 index 00000000..392721cb --- /dev/null +++ b/miniprogram/app.json @@ -0,0 +1,62 @@ +{ + "pages": [ + "pages/index/index", + "pages/chapters/chapters", + "pages/match/match", + "pages/my/my", + "pages/read/read", + "pages/about/about", + "pages/referral/referral", + "pages/purchases/purchases", + "pages/settings/settings", + "pages/search/search", + "pages/addresses/addresses", + "pages/addresses/edit" + ], + "window": { + "backgroundTextStyle": "light", + "navigationBarBackgroundColor": "#000000", + "navigationBarTitleText": "Soul创业派对", + "navigationBarTextStyle": "white", + "backgroundColor": "#000000", + "navigationStyle": "custom" + }, + "tabBar": { + "custom": true, + "color": "#8e8e93", + "selectedColor": "#00CED1", + "backgroundColor": "#1c1c1e", + "borderStyle": "black", + "list": [ + { + "pagePath": "pages/index/index", + "text": "首页" + }, + { + "pagePath": "pages/chapters/chapters", + "text": "目录" + }, + { + "pagePath": "pages/match/match", + "text": "找伙伴" + }, + { + "pagePath": "pages/my/my", + "text": "我的" + } + ] + }, + "usingComponents": {}, + "__usePrivacyCheck__": true, + "permission": { + "scope.userLocation": { + "desc": "用于匹配附近的书友" + } + }, + "requiredPrivateInfos": [ + "getLocation" + ], + "lazyCodeLoading": "requiredComponents", + "style": "v2", + "sitemapLocation": "sitemap.json" +} diff --git a/miniprogram/app.wxss b/miniprogram/app.wxss new file mode 100644 index 00000000..9ce22a06 --- /dev/null +++ b/miniprogram/app.wxss @@ -0,0 +1,606 @@ +/** + * Soul创业实验 - 全局样式 + * 主题色: #00CED1 (Soul青色) + * 开发: 卡若 + */ + +/* ===== CSS 变量系统 ===== */ +page { + /* 品牌色 */ + --app-brand: #00CED1; + --app-brand-light: rgba(0, 206, 209, 0.1); + --app-brand-dark: #20B2AA; + + /* 背景色 */ + --app-bg-primary: #000000; + --app-bg-secondary: #1c1c1e; + --app-bg-tertiary: #2c2c2e; + + /* 文字色 */ + --app-text-primary: #ffffff; + --app-text-secondary: rgba(255, 255, 255, 0.7); + --app-text-tertiary: rgba(255, 255, 255, 0.4); + + /* 分隔线 */ + --app-separator: rgba(255, 255, 255, 0.05); + + /* iOS 系统色 */ + --ios-indigo: #5856D6; + --ios-green: #30d158; + --ios-red: #FF3B30; + --ios-orange: #FF9500; + --ios-yellow: #FFD700; + + /* 金色 */ + --gold: #FFD700; + --gold-light: #FFA500; + + /* 粉色 */ + --pink: #E91E63; + + /* 紫色 */ + --purple: #7B61FF; +} + +/* ===== 页面基础样式 ===== */ +page { + background-color: var(--app-bg-primary); + color: var(--app-text-primary); + font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'Helvetica Neue', 'PingFang SC', 'Microsoft YaHei', sans-serif; + font-size: 28rpx; + line-height: 1.5; + -webkit-font-smoothing: antialiased; +} + +/* ===== 全局容器 ===== */ +.container { + min-height: 100vh; + padding: 0; + background: #000000; + padding-bottom: env(safe-area-inset-bottom); +} + +/* ===== 品牌色系 ===== */ +.brand-color { + color: #00CED1; +} + +.brand-bg { + background-color: #00CED1; +} + +.brand-gradient { + background: linear-gradient(135deg, #00CED1 0%, #20B2AA 100%); +} + +.gold-color { + color: #FFD700; +} + +.gold-bg { + background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%); +} + +/* ===== 文字渐变 ===== */ +.gradient-text { + background: linear-gradient(135deg, #00CED1 0%, #20B2AA 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; +} + +.gold-gradient-text { + background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; +} + +/* ===== 按钮样式 ===== */ +.btn-primary { + background: linear-gradient(135deg, #00CED1 0%, #20B2AA 100%); + color: #ffffff; + border: none; + border-radius: 48rpx; + padding: 28rpx 48rpx; + font-size: 32rpx; + font-weight: 600; + box-shadow: 0 8rpx 24rpx rgba(0, 206, 209, 0.3); + display: flex; + align-items: center; + justify-content: center; +} + +.btn-primary::after { + border: none; +} + +.btn-primary:active { + opacity: 0.85; + transform: scale(0.98); +} + +.btn-secondary { + background: rgba(0, 206, 209, 0.1); + color: #00CED1; + border: 2rpx solid rgba(0, 206, 209, 0.3); + border-radius: 48rpx; + padding: 28rpx 48rpx; + font-size: 32rpx; + font-weight: 500; +} + +.btn-secondary::after { + border: none; +} + +.btn-secondary:active { + background: rgba(0, 206, 209, 0.2); +} + +.btn-ghost { + background: rgba(255, 255, 255, 0.05); + color: #ffffff; + border: 2rpx solid rgba(255, 255, 255, 0.1); + border-radius: 48rpx; + padding: 28rpx 48rpx; + font-size: 32rpx; +} + +.btn-ghost::after { + border: none; +} + +.btn-ghost:active { + background: rgba(255, 255, 255, 0.1); +} + +.btn-gold { + background: linear-gradient(135deg, #FFD700 0%, #FFA500 100%); + color: #000000; + border: none; + border-radius: 48rpx; + padding: 28rpx 48rpx; + font-size: 32rpx; + font-weight: 600; + box-shadow: 0 8rpx 24rpx rgba(255, 215, 0, 0.3); +} + +.btn-gold::after { + border: none; +} + +/* ===== 卡片样式 ===== */ +.card { + background: rgba(28, 28, 30, 0.9); + border-radius: 32rpx; + padding: 32rpx; + margin: 24rpx 32rpx; + border: 2rpx solid rgba(255, 255, 255, 0.05); +} + +.card-light { + background: rgba(44, 44, 46, 0.8); + border-radius: 24rpx; + padding: 24rpx; + border: 2rpx solid rgba(255, 255, 255, 0.08); +} + +.card-gradient { + background: linear-gradient(135deg, rgba(28, 28, 30, 1) 0%, rgba(44, 44, 46, 1) 100%); + border-radius: 32rpx; + padding: 32rpx; + border: 2rpx solid rgba(0, 206, 209, 0.2); +} + +.card-brand { + background: linear-gradient(135deg, rgba(0, 206, 209, 0.1) 0%, rgba(32, 178, 170, 0.05) 100%); + border-radius: 32rpx; + padding: 32rpx; + border: 2rpx solid rgba(0, 206, 209, 0.2); +} + +/* ===== 输入框样式 ===== */ +.input-ios { + background: rgba(0, 0, 0, 0.3); + border: 2rpx solid rgba(255, 255, 255, 0.1); + border-radius: 24rpx; + padding: 28rpx 32rpx; + font-size: 32rpx; + color: #ffffff; +} + +.input-ios:focus { + border-color: rgba(0, 206, 209, 0.5); +} + +.input-ios-placeholder { + color: rgba(255, 255, 255, 0.3); +} + +/* ===== 列表项样式 ===== */ +.list-item { + display: flex; + align-items: center; + justify-content: space-between; + padding: 28rpx 32rpx; + background: rgba(28, 28, 30, 0.9); + border-bottom: 1rpx solid rgba(255, 255, 255, 0.05); +} + +.list-item:first-child { + border-radius: 24rpx 24rpx 0 0; +} + +.list-item:last-child { + border-radius: 0 0 24rpx 24rpx; + border-bottom: none; +} + +.list-item:only-child { + border-radius: 24rpx; +} + +.list-item:active { + background: rgba(44, 44, 46, 1); +} + +/* ===== 标签样式 ===== */ +.tag { + display: inline-flex; + align-items: center; + justify-content: center; + padding: 8rpx 20rpx; + min-width: 80rpx; + border-radius: 8rpx; + font-size: 22rpx; + font-weight: 500; + box-sizing: border-box; + text-align: center; +} + +.tag-brand { + background: rgba(0, 206, 209, 0.1); + color: #00CED1; +} + +.tag-gold { + background: rgba(255, 215, 0, 0.1); + color: #FFD700; +} + +.tag-pink { + background: rgba(233, 30, 99, 0.1); + color: #E91E63; +} + +.tag-purple { + background: rgba(123, 97, 255, 0.1); + color: #7B61FF; +} + +.tag-free { + background: rgba(0, 206, 209, 0.1); + color: #00CED1; +} + +/* ===== 分隔线 ===== */ +.divider { + height: 1rpx; + background: rgba(255, 255, 255, 0.05); + margin: 24rpx 0; +} + +.divider-vertical { + width: 2rpx; + height: 48rpx; + background: rgba(255, 255, 255, 0.1); +} + +/* ===== 骨架屏动画 ===== */ +.skeleton { + background: linear-gradient(90deg, + rgba(28, 28, 30, 1) 25%, + rgba(44, 44, 46, 1) 50%, + rgba(28, 28, 30, 1) 75% + ); + background-size: 200% 100%; + animation: skeleton-loading 1.5s ease-in-out infinite; + border-radius: 8rpx; +} + +@keyframes skeleton-loading { + 0% { + background-position: 200% 0; + } + 100% { + background-position: -200% 0; + } +} + +/* ===== 页面过渡动画 ===== */ +.page-transition { + animation: fadeIn 0.3s ease-out; +} + +@keyframes fadeIn { + from { + opacity: 0; + transform: translateY(20rpx); + } + to { + opacity: 1; + transform: translateY(0); + } +} + +/* ===== 弹窗动画 ===== */ +.modal-overlay { + animation: modalOverlayIn 0.25s ease-out; +} + +.modal-content { + animation: modalContentIn 0.3s cubic-bezier(0.32, 0.72, 0, 1); +} + +@keyframes modalOverlayIn { + from { opacity: 0; } + to { opacity: 1; } +} + +@keyframes modalContentIn { + from { + opacity: 0; + transform: scale(0.95) translateY(20rpx); + } + to { + opacity: 1; + transform: scale(1) translateY(0); + } +} + +/* ===== 脉动动画 ===== */ +.pulse { + animation: pulse 2s ease-in-out infinite; +} + +@keyframes pulse { + 0%, 100% { + transform: scale(1); + opacity: 1; + } + 50% { + transform: scale(1.05); + opacity: 0.8; + } +} + +/* ===== 发光效果 ===== */ +.glow { + box-shadow: 0 0 40rpx rgba(0, 206, 209, 0.3); +} + +.glow-gold { + box-shadow: 0 0 40rpx rgba(255, 215, 0, 0.3); +} + +/* ===== 文字样式 ===== */ +.text-xs { + font-size: 22rpx; +} + +.text-sm { + font-size: 26rpx; +} + +.text-base { + font-size: 28rpx; +} + +.text-lg { + font-size: 32rpx; +} + +.text-xl { + font-size: 36rpx; +} + +.text-2xl { + font-size: 44rpx; +} + +.text-3xl { + font-size: 56rpx; +} + +.text-white { + color: #ffffff; +} + +.text-gray { + color: rgba(255, 255, 255, 0.6); +} + +.text-muted { + color: rgba(255, 255, 255, 0.4); +} + +.text-center { + text-align: center; +} + +.font-medium { + font-weight: 500; +} + +.font-semibold { + font-weight: 600; +} + +.font-bold { + font-weight: 700; +} + +/* ===== Flex布局 ===== */ +.flex { + display: flex; +} + +.flex-col { + flex-direction: column; +} + +.items-center { + align-items: center; +} + +.justify-center { + justify-content: center; +} + +.justify-between { + justify-content: space-between; +} + +.justify-around { + justify-content: space-around; +} + +.flex-1 { + flex: 1; +} + +.gap-1 { + gap: 8rpx; +} + +.gap-2 { + gap: 16rpx; +} + +.gap-3 { + gap: 24rpx; +} + +.gap-4 { + gap: 32rpx; +} + +/* ===== 间距 ===== */ +.p-2 { padding: 16rpx; } +.p-3 { padding: 24rpx; } +.p-4 { padding: 32rpx; } +.p-5 { padding: 40rpx; } + +.px-4 { padding-left: 32rpx; padding-right: 32rpx; } +.py-2 { padding-top: 16rpx; padding-bottom: 16rpx; } +.py-3 { padding-top: 24rpx; padding-bottom: 24rpx; } + +.m-4 { margin: 32rpx; } +.mx-4 { margin-left: 32rpx; margin-right: 32rpx; } +.my-3 { margin-top: 24rpx; margin-bottom: 24rpx; } +.mb-2 { margin-bottom: 16rpx; } +.mb-3 { margin-bottom: 24rpx; } +.mb-4 { margin-bottom: 32rpx; } +.mt-4 { margin-top: 32rpx; } + +/* ===== 圆角 ===== */ +.rounded { border-radius: 8rpx; } +.rounded-lg { border-radius: 16rpx; } +.rounded-xl { border-radius: 24rpx; } +.rounded-2xl { border-radius: 32rpx; } +.rounded-full { border-radius: 50%; } + +/* ===== 安全区域 ===== */ +.safe-bottom { + padding-bottom: calc(env(safe-area-inset-bottom) + 20rpx); +} + +.pb-tabbar { + padding-bottom: 200rpx; +} + +/* ===== 头部导航占位 ===== */ +.nav-placeholder { + height: calc(88rpx + env(safe-area-inset-top, 44rpx)); +} + +/* ===== 隐藏滚动条 ===== */ +::-webkit-scrollbar { + display: none; + width: 0; + height: 0; +} + +/* ===== 触摸反馈 ===== */ +.touch-feedback { + transition: all 0.15s ease; +} + +.touch-feedback:active { + opacity: 0.7; + transform: scale(0.98); +} + +/* ===== 进度条 ===== */ +.progress-bar { + height: 8rpx; + background: rgba(44, 44, 46, 1); + border-radius: 4rpx; + overflow: hidden; +} + +.progress-fill { + height: 100%; + background: linear-gradient(90deg, #00CED1 0%, #20B2AA 100%); + border-radius: 4rpx; + transition: width 0.3s ease; +} + +/* ===== 头像样式 ===== */ +.avatar { + width: 80rpx; + height: 80rpx; + border-radius: 50%; + background: linear-gradient(135deg, rgba(0, 206, 209, 0.2) 0%, rgba(32, 178, 170, 0.1) 100%); + display: flex; + align-items: center; + justify-content: center; + color: #00CED1; + font-weight: 700; + font-size: 32rpx; + border: 4rpx solid rgba(0, 206, 209, 0.3); +} + +.avatar-lg { + width: 120rpx; + height: 120rpx; + font-size: 48rpx; +} + +/* ===== 图标容器 ===== */ +.icon-box { + width: 64rpx; + height: 64rpx; + border-radius: 16rpx; + display: flex; + align-items: center; + justify-content: center; +} + +.icon-box-brand { + background: linear-gradient(135deg, rgba(0, 206, 209, 0.2) 0%, rgba(32, 178, 170, 0.1) 100%); +} + +.icon-box-gold { + background: linear-gradient(135deg, rgba(255, 215, 0, 0.2) 0%, rgba(255, 165, 0, 0.1) 100%); +} + +/* ===== 渐变背景 ===== */ +.bg-gradient-dark { + background: linear-gradient(180deg, #000000 0%, #1a1a1a 100%); +} + +.bg-gradient-brand { + background: linear-gradient(135deg, rgba(0, 206, 209, 0.1) 0%, transparent 100%); +} diff --git a/miniprogram/assets/icons/home-active.png b/miniprogram/assets/icons/home-active.png new file mode 100644 index 00000000..b6090d87 Binary files /dev/null and b/miniprogram/assets/icons/home-active.png differ diff --git a/miniprogram/assets/icons/home.png b/miniprogram/assets/icons/home.png new file mode 100644 index 00000000..0ffba614 Binary files /dev/null and b/miniprogram/assets/icons/home.png differ diff --git a/miniprogram/assets/icons/match-active.png b/miniprogram/assets/icons/match-active.png new file mode 100644 index 00000000..da62b436 Binary files /dev/null and b/miniprogram/assets/icons/match-active.png differ diff --git a/miniprogram/assets/icons/match.png b/miniprogram/assets/icons/match.png new file mode 100644 index 00000000..b15582e3 Binary files /dev/null and b/miniprogram/assets/icons/match.png differ diff --git a/miniprogram/assets/icons/my-active.png b/miniprogram/assets/icons/my-active.png new file mode 100644 index 00000000..da62b436 Binary files /dev/null and b/miniprogram/assets/icons/my-active.png differ diff --git a/miniprogram/assets/icons/my.png b/miniprogram/assets/icons/my.png new file mode 100644 index 00000000..b15582e3 Binary files /dev/null and b/miniprogram/assets/icons/my.png differ diff --git a/miniprogram/custom-tab-bar/index.js b/miniprogram/custom-tab-bar/index.js new file mode 100644 index 00000000..01e98621 --- /dev/null +++ b/miniprogram/custom-tab-bar/index.js @@ -0,0 +1,114 @@ +/** + * Soul创业实验 - 自定义TabBar组件 + * 根据后台配置动态显示/隐藏"找伙伴"按钮 + */ + +const app = getApp() + +Component({ + data: { + selected: 0, + color: '#8e8e93', + selectedColor: '#00CED1', + matchEnabled: false, // 找伙伴功能开关，默认关闭 + list: [ + { + pagePath: '/pages/index/index', + text: '首页', + iconType: 'home' + }, + { + pagePath: '/pages/chapters/chapters', + text: '目录', + iconType: 'list' + }, + { + pagePath: '/pages/match/match', + text: '找伙伴', + iconType: 'match', + isSpecial: true + }, + { + pagePath: '/pages/my/my', + text: '我的', + iconType: 'user' + } + ] + }, + + lifetimes: { + attached() { + this.loadFeatureConfig() + } + }, + + methods: { + // 加载功能配置 + async loadFeatureConfig() { + try { + const res = await app.request({ + url: '/api/db/config', + method: 'GET' + }) + + if (res && res.features) { + const matchEnabled = res.features.matchEnabled === true + this.setData({ matchEnabled }, () => { + // 配置加载完成后，根据当前路由设置选中状态 + this.updateSelected() + }) + + // 如果当前在找伙伴页面，但功能已关闭，跳转到首页 + if (!matchEnabled) { + const pages = getCurrentPages() + const currentPage = pages[pages.length - 1] + if (currentPage && currentPage.route === 'pages/match/match') { + wx.switchTab({ url: '/pages/index/index' }) + } + } + } + } catch (error) { + console.log('TabBar加载功能配置失败:', error) + // 默认关闭找伙伴功能 + this.setData({ matchEnabled: false }, () => { + this.updateSelected() + }) + } + }, + + // 根据当前路由更新选中状态 + updateSelected() { + const pages = getCurrentPages() + if (pages.length === 0) return + + const currentPage = pages[pages.length - 1] + const route = currentPage.route + + let selected = 0 + const { matchEnabled } = this.data + + // 根据路由匹配对应的索引 + if (route === 'pages/index/index') { + selected = 0 + } else if (route === 'pages/chapters/chapters') { + selected = 1 + } else if (route === 'pages/match/match') { + selected = 2 + } else if (route === 'pages/my/my') { + selected = matchEnabled ? 3 : 2 + } + + this.setData({ selected }) + }, + + switchTab(e) { + const data = e.currentTarget.dataset + const url = data.path + const index = data.index + + if (this.data.selected === index) return + + wx.switchTab({ url }) + } + } +}) diff --git a/miniprogram/custom-tab-bar/index.json b/miniprogram/custom-tab-bar/index.json new file mode 100644 index 00000000..467ce294 --- /dev/null +++ b/miniprogram/custom-tab-bar/index.json @@ -0,0 +1,3 @@ +{ + "component": true +} diff --git a/miniprogram/custom-tab-bar/index.wxml b/miniprogram/custom-tab-bar/index.wxml new file mode 100644 index 00000000..14ee2dc5 --- /dev/null +++ b/miniprogram/custom-tab-bar/index.wxml @@ -0,0 +1,56 @@ + + + + + + + + + + + + + + + + {{list[0].text}} + + + + + + + + + + + + + + {{list[1].text}} + + + + + + + + + + + {{list[2].text}} + + + + + + + + + + + + + {{list[3].text}} + + diff --git a/miniprogram/custom-tab-bar/index.wxss b/miniprogram/custom-tab-bar/index.wxss new file mode 100644 index 00000000..5fd321e1 --- /dev/null +++ b/miniprogram/custom-tab-bar/index.wxss @@ -0,0 +1,237 @@ +/** + * Soul创业实验 - 自定义TabBar样式 + * 实现中间突出的"找伙伴"按钮 + */ + +.tab-bar { + position: fixed; + bottom: 0; + left: 0; + right: 0; + height: 100rpx; + background: rgba(28, 28, 30, 0.95); + backdrop-filter: blur(40rpx); + -webkit-backdrop-filter: blur(40rpx); + display: flex; + align-items: flex-end; + padding-bottom: env(safe-area-inset-bottom); + z-index: 999; +} + +/* 三个tab布局（找伙伴功能关闭时） */ +.tab-bar-three .tab-bar-item { + flex: 1; +} + +/* 四个tab布局（找伙伴功能开启时） */ +.tab-bar-four .tab-bar-item { + flex: 1; +} + +.tab-bar-border { + position: absolute; + top: 0; + left: 0; + right: 0; + height: 1rpx; + background: rgba(255, 255, 255, 0.05); +} + +.tab-bar-item { + flex: 1; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 10rpx 0 16rpx; +} + +.icon-wrapper { + width: 48rpx; + height: 48rpx; + display: flex; + align-items: center; + justify-content: center; + margin-bottom: 4rpx; +} + +.icon { + width: 44rpx; + height: 44rpx; + display: flex; + align-items: center; + justify-content: center; +} + +.tab-bar-text { + font-size: 22rpx; + line-height: 1; +} + +/* ===== 首页图标 ===== */ +.icon-home { + position: relative; + width: 40rpx; + height: 40rpx; +} + +.home-roof { + position: absolute; + top: 4rpx; + left: 50%; + transform: translateX(-50%); + width: 0; + height: 0; + border-left: 18rpx solid transparent; + border-right: 18rpx solid transparent; + border-bottom: 14rpx solid #8e8e93; +} + +.home-body { + position: absolute; + bottom: 4rpx; + left: 50%; + transform: translateX(-50%); + width: 28rpx; + height: 18rpx; + background: #8e8e93; + border-radius: 0 0 4rpx 4rpx; +} + +.icon-active .home-roof { + border-bottom-color: #00CED1; +} + +.icon-active .home-body { + background: #00CED1; +} + +/* ===== 目录图标 ===== */ +.icon-list { + width: 36rpx; + height: 32rpx; + display: flex; + flex-direction: column; + justify-content: space-between; +} + +.list-line { + width: 100%; + height: 6rpx; + background: #8e8e93; + border-radius: 3rpx; +} + +.list-line:nth-child(2) { + width: 75%; +} + +.list-line:nth-child(3) { + width: 50%; +} + +.icon-active .list-line { + background: #00CED1; +} + +/* ===== 我的图标 ===== */ +.icon-user { + position: relative; + width: 36rpx; + height: 40rpx; +} + +.user-head { + position: absolute; + top: 0; + left: 50%; + transform: translateX(-50%); + width: 16rpx; + height: 16rpx; + background: #8e8e93; + border-radius: 50%; +} + +.user-body { + position: absolute; + bottom: 0; + left: 50%; + transform: translateX(-50%); + width: 28rpx; + height: 18rpx; + background: #8e8e93; + border-radius: 14rpx 14rpx 0 0; +} + +.icon-active .user-head, +.icon-active .user-body { + background: #00CED1; +} + +/* ===== 找伙伴 - 中间特殊按钮 ===== */ +.special-item { + position: relative; + margin-top: -32rpx; +} + +.special-button { + width: 112rpx; + height: 112rpx; + border-radius: 50%; + background: linear-gradient(135deg, #00CED1 0%, #20B2AA 100%); + display: flex; + align-items: center; + justify-content: center; + box-shadow: 0 8rpx 32rpx rgba(0, 206, 209, 0.4); + margin-bottom: 4rpx; + transition: all 0.2s ease; +} + +.special-button:active { + transform: scale(0.95); +} + +.special-active { + box-shadow: 0 8rpx 40rpx rgba(0, 206, 209, 0.6); +} + +.special-text { + margin-top: 4rpx; +} + +/* ===== 找伙伴图标 (双人) ===== */ +.icon-users { + position: relative; + width: 56rpx; + height: 44rpx; +} + +.user-circle { + position: absolute; + width: 28rpx; + height: 28rpx; + border-radius: 50%; + background: #ffffff; +} + +.user-circle::after { + content: ''; + position: absolute; + bottom: -12rpx; + left: 50%; + transform: translateX(-50%); + width: 22rpx; + height: 14rpx; + background: #ffffff; + border-radius: 11rpx 11rpx 0 0; +} + +.user-1 { + top: 0; + left: 0; +} + +.user-2 { + top: 0; + right: 0; +} diff --git a/miniprogram/pages/about/about.js b/miniprogram/pages/about/about.js new file mode 100644 index 00000000..dbbcabb0 --- /dev/null +++ b/miniprogram/pages/about/about.js @@ -0,0 +1,81 @@ +/** + * Soul创业派对 - 关于作者页 + * 开发: 卡若 + */ +const app = getApp() + +Page({ + data: { + statusBarHeight: 44, + author: { + name: '卡若', + avatar: 'K', + title: 'Soul派对房主理人 · 私域运营专家', + bio: '每天早上6点到9点，在Soul派对房分享真实的创业故事。专注私域运营与项目变现，用"云阿米巴"模式帮助创业者构建可持续的商业体系。本书记录了62个真实商业案例，涵盖电商、内容、传统行业等多个领域。', + stats: [ + { label: '商业案例', value: '62' }, + { label: '连续直播', value: '365天' }, + { label: '派对分享', value: '1000+' } + ], + // 联系方式已移至后台配置 + contact: null, + highlights: [ + '5年私域运营经验', + '帮助100+品牌从0到1增长', + '连续创业者，擅长商业模式设计' + ] + }, + bookInfo: { + title: '一场Soul的创业实验', + totalChapters: 62, + parts: [ + { name: '真实的人', chapters: 10 }, + { name: '真实的行业', chapters: 15 }, + { name: '真实的错误', chapters: 9 }, + { name: '真实的赚钱', chapters: 20 }, + { name: '真实的社会', chapters: 9 } + ], + price: 9.9 + } + }, + + onLoad() { + this.setData({ + statusBarHeight: app.globalData.statusBarHeight + }) + this.loadBookStats() + }, + + // 加载书籍统计 + async loadBookStats() { + try { + const res = await app.request('/api/book/stats') + if (res && res.success) { + this.setData({ + 'bookInfo.totalChapters': res.data?.totalChapters || 62, + 'author.stats': [ + { label: '商业案例', value: String(res.data?.totalChapters || 62) }, + { label: '连续直播', value: '365天' }, + { label: '派对分享', value: '1000+' } + ] + }) + } + } catch (e) { + console.log('[About] 加载书籍统计失败，使用默认值') + } + }, + + // 联系方式功能已禁用 + copyWechat() { + wx.showToast({ title: '请在派对房联系作者', icon: 'none' }) + }, + + callPhone() { + wx.showToast({ title: '请在派对房联系作者', icon: 'none' }) + }, + + // 返回 + goBack() { + wx.navigateBack() + } +}) diff --git a/miniprogram/pages/about/about.json b/miniprogram/pages/about/about.json new file mode 100644 index 00000000..e90e9960 --- /dev/null +++ b/miniprogram/pages/about/about.json @@ -0,0 +1,4 @@ +{ + "usingComponents": {}, + "navigationStyle": "custom" +} diff --git a/miniprogram/pages/about/about.wxml b/miniprogram/pages/about/about.wxml new file mode 100644 index 00000000..598e9464 --- /dev/null +++ b/miniprogram/pages/about/about.wxml @@ -0,0 +1,75 @@ + + + + ← + 关于作者 + + + + + + + + {{author.avatar}} + {{author.name}} + {{author.title}} + {{author.bio}} + + + + + {{item.value}} + {{item.label}} + + + + + + + ✓ + {{item}} + + + + + + + 📚 {{bookInfo.title}} + + + {{bookInfo.totalChapters}} + 篇章节 + + + 5 + 大篇章 + + + ¥{{bookInfo.price}} + 全书价格 + + + + + {{item.name}} + {{item.chapters}}节 + + + + + + + 联系作者 + + 🎉 + + Soul派对房 + 每天早上6-9点开播 + + + + 在Soul App搜索"创业实验"或"卡若"，加入派对房直接交流 + + + + diff --git a/miniprogram/pages/about/about.wxss b/miniprogram/pages/about/about.wxss new file mode 100644 index 00000000..337aa041 --- /dev/null +++ b/miniprogram/pages/about/about.wxss @@ -0,0 +1,40 @@ +.page { min-height: 100vh; background: #000; } +.nav-bar { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(0,0,0,0.9); backdrop-filter: blur(40rpx); display: flex; align-items: center; justify-content: space-between; padding: 0 32rpx; height: 88rpx; } +.nav-back { width: 72rpx; height: 72rpx; background: #1c1c1e; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 32rpx; color: #fff; } +.nav-title { font-size: 36rpx; font-weight: 600; color: #00CED1; } +.nav-placeholder { width: 72rpx; } +.content { padding: 32rpx; } +.author-card { background: linear-gradient(135deg, #1c1c1e 0%, #2c2c2e 100%); border-radius: 32rpx; padding: 48rpx; text-align: center; margin-bottom: 24rpx; border: 2rpx solid rgba(0,206,209,0.2); } +.author-avatar { width: 160rpx; height: 160rpx; border-radius: 50%; background: linear-gradient(135deg, #00CED1, #20B2AA); display: flex; align-items: center; justify-content: center; margin: 0 auto 24rpx; font-size: 64rpx; color: #fff; font-weight: 700; border: 4rpx solid rgba(0,206,209,0.3); } +.author-name { font-size: 40rpx; font-weight: 700; color: #fff; display: block; margin-bottom: 8rpx; } +.author-title { font-size: 26rpx; color: #00CED1; display: block; margin-bottom: 24rpx; } +.author-bio { font-size: 26rpx; color: rgba(255,255,255,0.7); line-height: 1.8; display: block; margin-bottom: 32rpx; } +.stats-row { display: flex; justify-content: space-around; padding-top: 32rpx; border-top: 2rpx solid rgba(255,255,255,0.1); } +.stat-item { text-align: center; } +.stat-value { font-size: 36rpx; font-weight: 700; color: #00CED1; display: block; } +.stat-label { font-size: 22rpx; color: rgba(255,255,255,0.5); } +.contact-card { background: #1c1c1e; border-radius: 32rpx; padding: 32rpx; } +.card-title { font-size: 28rpx; font-weight: 600; color: #fff; display: block; margin-bottom: 24rpx; } +.contact-item { display: flex; align-items: center; gap: 24rpx; padding: 24rpx; background: rgba(255,255,255,0.05); border-radius: 16rpx; margin-bottom: 16rpx; } +.contact-item:last-child { margin-bottom: 0; } +.contact-icon { font-size: 40rpx; } +.contact-info { flex: 1; } +.contact-label { font-size: 22rpx; color: rgba(255,255,255,0.5); display: block; } +.contact-value { font-size: 28rpx; color: #fff; } +.contact-btn { padding: 12rpx 24rpx; background: rgba(0,206,209,0.2); color: #00CED1; font-size: 24rpx; border-radius: 16rpx; } + +/* 亮点标签 */ +.highlights { display: flex; flex-wrap: wrap; gap: 16rpx; margin-top: 32rpx; padding-top: 24rpx; border-top: 2rpx solid rgba(255,255,255,0.1); justify-content: center; } +.highlight-tag { display: flex; align-items: center; gap: 8rpx; padding: 12rpx 24rpx; background: rgba(0,206,209,0.15); border-radius: 24rpx; font-size: 24rpx; color: rgba(255,255,255,0.8); } +.tag-icon { color: #00CED1; font-size: 22rpx; } + +/* 书籍信息卡片 */ +.book-info-card { background: #1c1c1e; border-radius: 32rpx; padding: 32rpx; margin-bottom: 24rpx; } +.book-stats { display: flex; justify-content: space-around; padding: 24rpx 0; margin: 16rpx 0; background: rgba(0,0,0,0.3); border-radius: 16rpx; } +.book-stat { text-align: center; } +.book-stat-value { font-size: 36rpx; font-weight: 700; color: #FFD700; display: block; } +.book-stat-label { font-size: 22rpx; color: rgba(255,255,255,0.5); } +.parts-list { display: flex; flex-wrap: wrap; gap: 12rpx; margin-top: 16rpx; } +.part-item { display: flex; align-items: center; gap: 8rpx; padding: 12rpx 20rpx; background: rgba(255,255,255,0.05); border-radius: 12rpx; } +.part-name { font-size: 24rpx; color: rgba(255,255,255,0.8); } +.part-chapters { font-size: 22rpx; color: #00CED1; } diff --git a/miniprogram/pages/addresses/addresses.js b/miniprogram/pages/addresses/addresses.js new file mode 100644 index 00000000..0fc71b09 --- /dev/null +++ b/miniprogram/pages/addresses/addresses.js @@ -0,0 +1,123 @@ +/** + * 收货地址列表页 + * 参考 Next.js: app/view/my/addresses/page.tsx + */ + +const app = getApp() + +Page({ + data: { + statusBarHeight: 44, + isLoggedIn: false, + addressList: [], + loading: true + }, + + onLoad() { + this.setData({ + statusBarHeight: app.globalData.statusBarHeight || 44 + }) + this.checkLogin() + }, + + onShow() { + if (this.data.isLoggedIn) { + this.loadAddresses() + } + }, + + // 检查登录状态 + checkLogin() { + const isLoggedIn = app.globalData.isLoggedIn + const userId = app.globalData.userInfo?.id + + if (!isLoggedIn || !userId) { + wx.showModal({ + title: '需要登录', + content: '请先登录后再管理收货地址', + confirmText: '去登录', + success: (res) => { + if (res.confirm) { + wx.switchTab({ url: '/pages/my/my' }) + } else { + wx.navigateBack() + } + } + }) + return + } + + this.setData({ isLoggedIn: true }) + this.loadAddresses() + }, + + // 加载地址列表 + async loadAddresses() { + const userId = app.globalData.userInfo?.id + if (!userId) return + + this.setData({ loading: true }) + + try { + const res = await app.request(`/api/user/addresses?userId=${userId}`) + if (res.success && res.list) { + this.setData({ + addressList: res.list, + loading: false + }) + } else { + this.setData({ addressList: [], loading: false }) + } + } catch (e) { + console.error('加载地址列表失败:', e) + this.setData({ loading: false }) + wx.showToast({ title: '加载失败', icon: 'none' }) + } + }, + + // 编辑地址 + editAddress(e) { + const id = e.currentTarget.dataset.id + wx.navigateTo({ url: `/pages/addresses/edit?id=${id}` }) + }, + + // 删除地址 + deleteAddress(e) { + const id = e.currentTarget.dataset.id + + wx.showModal({ + title: '确认删除', + content: '确定要删除该收货地址吗？', + confirmColor: '#FF3B30', + success: async (res) => { + if (res.confirm) { + try { + const result = await app.request(`/api/user/addresses/${id}`, { + method: 'DELETE' + }) + + if (result.success) { + wx.showToast({ title: '删除成功', icon: 'success' }) + this.loadAddresses() + } else { + wx.showToast({ title: result.message || '删除失败', icon: 'none' }) + } + } catch (e) { + console.error('删除地址失败:', e) + wx.showToast({ title: '删除失败', icon: 'none' }) + } + } + } + }) + }, + + // 新增地址 + addAddress() { + wx.navigateTo({ url: '/pages/addresses/edit' }) + }, + + // 返回 + goBack() { + wx.navigateBack() + } +}) diff --git a/miniprogram/pages/addresses/addresses.json b/miniprogram/pages/addresses/addresses.json new file mode 100644 index 00000000..2e45b65e --- /dev/null +++ b/miniprogram/pages/addresses/addresses.json @@ -0,0 +1,5 @@ +{ + "usingComponents": {}, + "navigationStyle": "custom", + "enablePullDownRefresh": false +} diff --git a/miniprogram/pages/addresses/addresses.wxml b/miniprogram/pages/addresses/addresses.wxml new file mode 100644 index 00000000..cec2ef6e --- /dev/null +++ b/miniprogram/pages/addresses/addresses.wxml @@ -0,0 +1,66 @@ + + + + + + ‹ + + 收货地址 + + + + + + + + 加载中... + + + + + 📍 + 暂无收货地址 + 点击下方按钮添加 + + + + + + + {{item.name}} + {{item.phone}} + 默认 + + {{item.fullAddress}} + + + ✏️ + 编辑 + + + 🗑️ + 删除 + + + + + + + + ➕ + 新增收货地址 + + + diff --git a/miniprogram/pages/addresses/addresses.wxss b/miniprogram/pages/addresses/addresses.wxss new file mode 100644 index 00000000..9ff21637 --- /dev/null +++ b/miniprogram/pages/addresses/addresses.wxss @@ -0,0 +1,217 @@ +/** + * 收货地址列表页样式 + */ + +.page { + min-height: 100vh; + background: #000000; + padding-bottom: 200rpx; +} + +/* ===== 导航栏 ===== */ +.nav-bar { + position: fixed; + top: 0; + left: 0; + right: 0; + z-index: 100; + background: rgba(0, 0, 0, 0.9); + backdrop-filter: blur(40rpx); + border-bottom: 1rpx solid rgba(255, 255, 255, 0.05); +} + +.nav-bar { + display: flex; + align-items: center; + justify-content: space-between; + padding: 0 32rpx; + height: 88rpx; +} + +.nav-back { + width: 64rpx; + height: 64rpx; + border-radius: 50%; + background: rgba(255, 255, 255, 0.1); + display: flex; + align-items: center; + justify-content: center; +} + +.nav-back:active { + background: rgba(255, 255, 255, 0.15); +} + +.back-icon { + font-size: 48rpx; + color: #ffffff; + line-height: 1; +} + +.nav-title { + flex: 1; + text-align: center; + font-size: 36rpx; + font-weight: 600; + color: #ffffff; +} + +.nav-placeholder { + width: 64rpx; +} + +/* ===== 内容区 ===== */ +.content { + padding: 32rpx; +} + +/* ===== 加载状态 ===== */ +.loading-state { + padding: 240rpx 0; + text-align: center; +} + +.loading-text { + font-size: 28rpx; + color: rgba(255, 255, 255, 0.4); +} + +/* ===== 空状态 ===== */ +.empty-state { + padding: 240rpx 0; + text-align: center; + display: flex; + flex-direction: column; + align-items: center; +} + +.empty-icon { + font-size: 96rpx; + margin-bottom: 24rpx; + opacity: 0.3; +} + +.empty-text { + font-size: 28rpx; + color: rgba(255, 255, 255, 0.6); + margin-bottom: 16rpx; +} + +.empty-tip { + font-size: 24rpx; + color: rgba(255, 255, 255, 0.4); +} + +/* ===== 地址列表 ===== */ +.address-list { + margin-bottom: 24rpx; +} + +.address-card { + background: #1c1c1e; + border-radius: 24rpx; + border: 2rpx solid rgba(255, 255, 255, 0.05); + padding: 32rpx; + margin-bottom: 24rpx; +} + +/* 地址头部 */ +.address-header { + display: flex; + align-items: center; + gap: 16rpx; + margin-bottom: 16rpx; +} + +.receiver-name { + font-size: 32rpx; + font-weight: 600; + color: #ffffff; +} + +.receiver-phone { + font-size: 28rpx; + color: rgba(255, 255, 255, 0.5); +} + +.default-tag { + font-size: 22rpx; + color: #00CED1; + background: rgba(0, 206, 209, 0.2); + padding: 6rpx 16rpx; + border-radius: 8rpx; + margin-left: auto; +} + +/* 地址文本 */ +.address-text { + font-size: 28rpx; + color: rgba(255, 255, 255, 0.6); + line-height: 1.6; + display: block; + margin-bottom: 24rpx; + padding-bottom: 24rpx; + border-bottom: 2rpx solid rgba(255, 255, 255, 0.05); +} + +/* 操作按钮 */ +.address-actions { + display: flex; + justify-content: flex-end; + gap: 32rpx; +} + +.action-btn { + display: flex; + align-items: center; + gap: 8rpx; + padding: 8rpx 0; +} + +.action-btn:active { + opacity: 0.6; +} + +.edit-btn { + color: #00CED1; +} + +.delete-btn { + color: #FF3B30; +} + +.action-icon { + font-size: 28rpx; +} + +.action-text { + font-size: 28rpx; +} + +/* ===== 新增按钮 ===== */ +.add-btn { + display: flex; + align-items: center; + justify-content: center; + gap: 16rpx; + padding: 32rpx; + background: #00CED1; + border-radius: 24rpx; + font-weight: 600; + margin-top: 48rpx; +} + +.add-btn:active { + opacity: 0.8; + transform: scale(0.98); +} + +.add-icon { + font-size: 36rpx; + color: #000000; +} + +.add-text { + font-size: 32rpx; + color: #000000; +} diff --git a/miniprogram/pages/addresses/edit.js b/miniprogram/pages/addresses/edit.js new file mode 100644 index 00000000..69f08cf2 --- /dev/null +++ b/miniprogram/pages/addresses/edit.js @@ -0,0 +1,201 @@ +/** + * 地址编辑页（新增/编辑） + * 参考 Next.js: app/view/my/addresses/[id]/page.tsx + */ + +const app = getApp() + +Page({ + data: { + statusBarHeight: 44, + isEdit: false, // 是否为编辑模式 + addressId: null, + + // 表单数据 + name: '', + phone: '', + province: '', + city: '', + district: '', + detail: '', + isDefault: false, + + // 地区选择器 + region: [], + + saving: false + }, + + onLoad(options) { + this.setData({ + statusBarHeight: app.globalData.statusBarHeight || 44 + }) + + // 如果有 id 参数，则为编辑模式 + if (options.id) { + this.setData({ + isEdit: true, + addressId: options.id + }) + this.loadAddress(options.id) + } + }, + + // 加载地址详情（编辑模式） + async loadAddress(id) { + wx.showLoading({ title: '加载中...', mask: true }) + + try { + const res = await app.request(`/api/user/addresses/${id}`) + if (res.success && res.data) { + const addr = res.data + this.setData({ + name: addr.name || '', + phone: addr.phone || '', + province: addr.province || '', + city: addr.city || '', + district: addr.district || '', + detail: addr.detail || '', + isDefault: addr.isDefault || false, + region: [addr.province, addr.city, addr.district] + }) + } else { + wx.showToast({ title: '加载失败', icon: 'none' }) + } + } catch (e) { + console.error('加载地址详情失败:', e) + wx.showToast({ title: '加载失败', icon: 'none' }) + } finally { + wx.hideLoading() + } + }, + + // 表单输入 + onNameInput(e) { + this.setData({ name: e.detail.value }) + }, + + onPhoneInput(e) { + this.setData({ phone: e.detail.value.replace(/\D/g, '').slice(0, 11) }) + }, + + onDetailInput(e) { + this.setData({ detail: e.detail.value }) + }, + + // 地区选择 + onRegionChange(e) { + const region = e.detail.value + this.setData({ + region, + province: region[0], + city: region[1], + district: region[2] + }) + }, + + // 切换默认地址 + onDefaultChange(e) { + this.setData({ isDefault: e.detail.value }) + }, + + // 表单验证 + validateForm() { + const { name, phone, province, city, district, detail } = this.data + + if (!name || name.trim().length === 0) { + wx.showToast({ title: '请输入收货人姓名', icon: 'none' }) + return false + } + + if (!phone || phone.length !== 11) { + wx.showToast({ title: '请输入正确的手机号', icon: 'none' }) + return false + } + + if (!province || !city || !district) { + wx.showToast({ title: '请选择省市区', icon: 'none' }) + return false + } + + if (!detail || detail.trim().length === 0) { + wx.showToast({ title: '请输入详细地址', icon: 'none' }) + return false + } + + return true + }, + + // 保存地址 + async saveAddress() { + if (!this.validateForm()) return + if (this.data.saving) return + + this.setData({ saving: true }) + wx.showLoading({ title: '保存中...', mask: true }) + + const { isEdit, addressId, name, phone, province, city, district, detail, isDefault } = this.data + const userId = app.globalData.userInfo?.id + + if (!userId) { + wx.hideLoading() + wx.showToast({ title: '请先登录', icon: 'none' }) + this.setData({ saving: false }) + return + } + + const addressData = { + userId, + name, + phone, + province, + city, + district, + detail, + fullAddress: `${province}${city}${district}${detail}`, + isDefault + } + + try { + let res + if (isEdit) { + // 编辑模式 - PUT 请求 + res = await app.request(`/api/user/addresses/${addressId}`, { + method: 'PUT', + data: addressData + }) + } else { + // 新增模式 - POST 请求 + res = await app.request('/api/user/addresses', { + method: 'POST', + data: addressData + }) + } + + if (res.success) { + wx.hideLoading() + wx.showToast({ + title: isEdit ? '保存成功' : '添加成功', + icon: 'success' + }) + setTimeout(() => { + wx.navigateBack() + }, 1500) + } else { + wx.hideLoading() + wx.showToast({ title: res.message || '保存失败', icon: 'none' }) + this.setData({ saving: false }) + } + } catch (e) { + console.error('保存地址失败:', e) + wx.hideLoading() + wx.showToast({ title: '保存失败', icon: 'none' }) + this.setData({ saving: false }) + } + }, + + // 返回 + goBack() { + wx.navigateBack() + } +}) diff --git a/miniprogram/pages/addresses/edit.json b/miniprogram/pages/addresses/edit.json new file mode 100644 index 00000000..2e45b65e --- /dev/null +++ b/miniprogram/pages/addresses/edit.json @@ -0,0 +1,5 @@ +{ + "usingComponents": {}, + "navigationStyle": "custom", + "enablePullDownRefresh": false +} diff --git a/miniprogram/pages/addresses/edit.wxml b/miniprogram/pages/addresses/edit.wxml new file mode 100644 index 00000000..c5429207 --- /dev/null +++ b/miniprogram/pages/addresses/edit.wxml @@ -0,0 +1,101 @@ + + + + + + ‹ + + {{isEdit ? '编辑地址' : '新增地址'}} + + + + + + + + + + 👤 + 收货人 + + + + + + + + 📱 + 手机号 + + + + + + + + 📍 + 所在地区 + + + + {{province || city || district ? province + ' ' + city + ' ' + district : '请选择省市区'}} + + + + + + + + 🏠 + 详细地址 + +