index.vue 56 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814
  1. <template>
  2. <view>
  3. <!-- 冷启动 splash overlay — 覆盖首页直到数据加载完毕(tab 切回时不显示) -->
  4. <view class="splash-overlay" :class="{'fade-out': splashOverlayFading}" v-if="splashOverlay || splashOverlayFading">
  5. <view class="splash-overlay-bg">
  6. <view class="bg-circle bg-circle-1"></view>
  7. <view class="bg-circle bg-circle-2"></view>
  8. <view class="bg-circle bg-circle-3"></view>
  9. </view>
  10. <view class="splash-overlay-body">
  11. <view class="splash-logo-wrap">
  12. <image class="splash-logo-img" src="/static/logo.png" mode="aspectFit" />
  13. </view>
  14. <text class="splash-brand-name">浠艾福</text>
  15. <text class="splash-brand-en">Care Family</text>
  16. <view class="splash-dims-row">
  17. <view class="splash-dim-item">
  18. <view class="splash-dim-circle" style="background:rgba(255,140,66,0.3);"><text class="splash-dim-icon">🌏</text></view>
  19. <text class="splash-dim-label">身</text>
  20. </view>
  21. <view class="splash-dim-item">
  22. <view class="splash-dim-circle" style="background:rgba(255,107,157,0.3);"><text class="splash-dim-icon">🔥</text></view>
  23. <text class="splash-dim-label">心</text>
  24. </view>
  25. <view class="splash-dim-item">
  26. <view class="splash-dim-circle" style="background:rgba(99,102,241,0.3);"><text class="splash-dim-icon">⚡</text></view>
  27. <text class="splash-dim-label">智</text>
  28. </view>
  29. <view class="splash-dim-item">
  30. <view class="splash-dim-circle" style="background:rgba(16,185,129,0.3);"><text class="splash-dim-icon">🌿</text></view>
  31. <text class="splash-dim-label">行</text>
  32. </view>
  33. <view class="splash-dim-item">
  34. <view class="splash-dim-circle" style="background:rgba(245,158,11,0.3);"><text class="splash-dim-icon">💧</text></view>
  35. <text class="splash-dim-label">富</text>
  36. </view>
  37. </view>
  38. <text class="splash-tagline">给全家的一站式幸福提案</text>
  39. <view class="splash-overlay-loading">
  40. <view class="splash-overlay-dot"></view>
  41. <view class="splash-overlay-dot"></view>
  42. <view class="splash-overlay-dot"></view>
  43. </view>
  44. </view>
  45. </view>
  46. <!-- 首次选择意图弹层 — 改版v1 -->
  47. <IntentPicker
  48. :show="showIntentPicker"
  49. @select="handleIntentSelect"
  50. @close="handleIntentClose" />
  51. <!-- 登录态 — 直接内嵌,保持底签可见 -->
  52. <view v-if="currentRole" class="logged-in-container">
  53. <!-- 品牌头部 -->
  54. <PageBanner theme="action"
  55. tagline="知行合一 · 快乐成长"
  56. quote="千里之行,始于足下" />
  57. <!-- 旅程状态卡 — 改版v1 需求驱动(A类·随便看看 不展示旅程卡) -->
  58. <JourneyCard
  59. v-if="userIntent && userIntent.intentType !== 'A'"
  60. :intent="userIntent"
  61. @action="handleJourneyAction" />
  62. <!-- 能量沙盘 — Canvas 五行星图 -->
  63. <WuxingSandbox
  64. v-if="sandboxData"
  65. mode="live"
  66. :scores="sandboxScores"
  67. :overallScore="sandboxData.overallScore || 0"
  68. :members="sandboxData.members || []"
  69. showDimensionBar
  70. starHeight="480rpx" />
  71. <!-- 动态 -->
  72. <FamilyFeed
  73. :items="familyFeed"
  74. :notices="notices"
  75. :showHeader="true" />
  76. <!-- 会员入口:非会员显示开通 / 快到期显示续费 -->
  77. <view v-if="showMemberEntry" class="member-entry" @click="goMembership">
  78. <view class="member-entry-icon-wrap">
  79. <text class="member-entry-icon">👑</text>
  80. </view>
  81. <view class="member-entry-texts">
  82. <text class="member-entry-title">{{ memberEntryTitle }}</text>
  83. <text class="member-entry-desc">{{ memberEntryDesc }}</text>
  84. </view>
  85. <view class="member-entry-btn">
  86. <text class="member-entry-btn-text">{{ memberEntryBtn }}</text>
  87. </view>
  88. </view>
  89. <!-- 快捷功能入口(单排) -->
  90. <view class="section">
  91. <view class="quick-bar">
  92. <view class="quick-item" @click="navTo('/pages/tasks/tasks')">
  93. <view class="quick-icon" style="background:rgba(99,102,241,0.15)"><text>📋</text></view>
  94. <text class="quick-label">任务</text>
  95. </view>
  96. <view class="quick-item" @click="navTo('/pages/action-detail/interaction-log')">
  97. <view class="quick-icon" style="background:rgba(16,185,129,0.15)"><text>💬</text></view>
  98. <text class="quick-label">互动</text>
  99. </view>
  100. <view class="quick-item" @click="navTo('/pages/mind-detail/family-dashboard')">
  101. <view class="quick-icon" style="background:rgba(139,92,246,0.15)"><text>🏠</text></view>
  102. <text class="quick-label">天盘</text>
  103. </view>
  104. <view class="quick-item" @click="navTo('/pages/profile-extra/family-members')">
  105. <view class="quick-icon" style="background:rgba(245,158,11,0.15)"><text>👨‍👩‍👧‍👦</text></view>
  106. <text class="quick-label">成员</text>
  107. </view>
  108. <view class="quick-item" @click="navTo('/pages/discover/circles')">
  109. <view class="quick-icon" style="background:rgba(255,107,157,0.15)"><text>🤝</text></view>
  110. <text class="quick-label">圈子</text>
  111. </view>
  112. <view class="quick-item" @click="navTo('/pages/shop/index/index')">
  113. <view class="quick-icon" style="background:rgba(249,115,22,0.15)"><text>🛒</text></view>
  114. <text class="quick-label">商城</text>
  115. </view>
  116. </view>
  117. </view>
  118. <!-- 我的任务(仅当有待完成时显示) -->
  119. <view v-if="hasPendingTasks" class="section">
  120. <view class="section-header">
  121. <text class="section-title">📝 我的任务</text>
  122. <text class="section-more" @click="navTo('/pages/tasks/tasks')">全部 ›</text>
  123. </view>
  124. <view class="task-quick-list">
  125. <view
  126. v-for="task in pendingTasks"
  127. :key="task.id"
  128. class="task-quick-item"
  129. >
  130. <view class="task-quick-info">
  131. <text class="task-quick-title line-clamp-1">{{ task.title }}</text>
  132. <text class="task-quick-meta">+{{ task.points }}分</text>
  133. </view>
  134. <button class="btn-quick-complete" @click="quickCompleteTask(task)">完成</button>
  135. </view>
  136. </view>
  137. </view>
  138. <!-- 家庭挑战任务 -->
  139. <view class="section">
  140. <view class="section-header">
  141. <text class="section-title">🔥 家庭挑战</text>
  142. <text class="section-more" @click="goChallengeManage">管理 ›</text>
  143. </view>
  144. <FamilyChallengeCard
  145. v-for="ch in activeChallenges"
  146. :key="ch.id"
  147. :challenge="ch"
  148. :showCheckin="showCheckinBtn"
  149. @checkin="onChallengeCheckin"
  150. @respond="onChallengeRespond" />
  151. <view v-if="activeChallenges.length === 0" class="challenge-empty">
  152. <text class="challenge-empty-icon">🏆</text>
  153. <text class="challenge-empty-text">您还没有挑战,去添加吧</text>
  154. <button class="challenge-add-btn" @click="goChallengeManage">去添加</button>
  155. </view>
  156. </view>
  157. <!-- 推荐商品 -->
  158. <view class="section">
  159. <view class="section-header">
  160. <text class="section-title">🛍️ 推荐商品</text>
  161. <text class="section-more" @click="goMoreProducts">更多 ›</text>
  162. </view>
  163. <DimensionProducts
  164. :isLoggedIn="true"
  165. :showMore="false"
  166. @productClick="goProductDetail" />
  167. </view>
  168. <!-- 推荐文章 -->
  169. <view class="section">
  170. <view class="section-header">
  171. <text class="section-title">📖 推荐阅读</text>
  172. <text class="section-more" @click="goMoreArticles">更多 ›</text>
  173. </view>
  174. <ArticleBookshelf
  175. :articles="actionArticles"
  176. :isLoggedIn="true"
  177. @articleClick="goArticleDetail" />
  178. </view>
  179. <!-- 底部占位 -->
  180. <view class="bottom-spacer" style="height: 40rpx;"></view>
  181. </view>
  182. <!-- 未登录态 — 发现页/引流内容,直接内嵌,不跳转 -->
  183. <view v-else class="discover-container">
  184. <!-- 品牌头部 -->
  185. <PageBanner theme="home"
  186. tagline="家庭健康成长俱乐部"
  187. quote="给全家的一站式幸福提案" />
  188. <!-- 品牌定位语 -->
  189. <view class="brand-strap">
  190. <text class="brand-strap-text">身 · 心 · 智 · 行 · 富 &nbsp;五维幸福成长</text>
  191. </view>
  192. <!-- 五行沙盘预览 -->
  193. <wuxing-sandbox mode="preview" badgeText="登录查看完整报告" @point-click="handleLogin" />
  194. <!-- 活动/商品推荐 -->
  195. <view class="recommend-section">
  196. <view class="section-header">
  197. <text class="section-title">🔥 热门推荐</text>
  198. <text class="section-more" @click="goShop">查看更多 ›</text>
  199. </view>
  200. <scroll-view scroll-x enable-flex show-scrollbar="false" class="type-filter-scroll">
  201. <view
  202. v-for="item in typeList"
  203. :key="item.value"
  204. :class="['filter-chip', currentType === item.value ? 'active' : '']"
  205. @click="onTypeChange(item.value)"
  206. >
  207. {{ item.label }}
  208. </view>
  209. </scroll-view>
  210. <view v-if="loading" class="loading-state">
  211. <text class="loading-text">加载中...</text>
  212. </view>
  213. <view v-else-if="products.length === 0" class="empty-state">
  214. <text class="empty-text">暂无商品,去商城看看吧</text>
  215. </view>
  216. <view v-else class="product-grid">
  217. <view
  218. v-for="item in products"
  219. :key="item.id"
  220. class="product-card"
  221. @click="goDetail(item.id)"
  222. >
  223. <image class="product-cover" :src="getImageUrl(item.coverImage) || '/static/default-product.png'" mode="aspectFill" />
  224. <view class="product-info">
  225. <text class="product-name">{{ item.name }}</text>
  226. <view class="product-price-row">
  227. <text class="product-price" v-if="item.price && item.price > 0">¥{{ (item.price / 100).toFixed(0) }}</text>
  228. <text class="product-price-free" v-else>免费</text>
  229. </view>
  230. </view>
  231. </view>
  232. </view>
  233. </view>
  234. <!-- 热门活动(无条件展示) -->
  235. <view class="section">
  236. <view class="section-header">
  237. <text class="section-title">🔥 热门活动</text>
  238. <text class="section-more" @click="goActivities">查看更多 ›</text>
  239. </view>
  240. <view v-if="dimensionActivities.length === 0" class="empty-state" style="padding: 40rpx 0;">
  241. <text class="empty-text">暂无活动</text>
  242. </view>
  243. <view class="activity-list" v-else>
  244. <view class="activity-card" v-for="act in dimensionActivities" :key="act.id" @click="goActivityDetail(act)">
  245. <image class="activity-cover" :src="getImageUrl(act.coverImage) || '/static/default-activity.png'" mode="aspectFill" />
  246. <view class="activity-info">
  247. <text class="activity-name line-clamp-1">{{ act.title }}</text>
  248. <view class="activity-meta">
  249. <text class="activity-time">{{ act.startTime }}</text>
  250. </view>
  251. <view class="activity-bottom">
  252. <text class="activity-status" :class="'status-' + (act.status || 'upcoming')">{{ act.status === 'ongoing' ? '进行中' : act.status === 'ended' ? '已结束' : '即将开始' }}</text>
  253. <text class="activity-fee" v-if="act.price && act.price > 0">¥{{ (act.price / 100).toFixed(0) }}</text>
  254. <text class="activity-fee fee-free" v-else>免费</text>
  255. </view>
  256. </view>
  257. </view>
  258. </view>
  259. </view>
  260. <!-- 推荐阅读(无条件展示) -->
  261. <view class="section">
  262. <view class="section-header">
  263. <text class="section-title">📖 推荐阅读</text>
  264. <text class="section-more" @click="goArticles">更多 ›</text>
  265. </view>
  266. <view class="article-list">
  267. <view v-if="articlesLoading" class="loading-state" style="padding: 40rpx 0;">
  268. <text class="loading-text">加载中...</text>
  269. </view>
  270. <!-- 无数据时显示占位卡片 -->
  271. <template v-else-if="indexArticles.length === 0">
  272. <view class="article-card" v-for="(item, i) in [1,2,3]" :key="i">
  273. <view class="article-category" :style="{ background: gradientColors[(i-1) % gradientColors.length] }">
  274. <text class="article-category-text">推荐文章</text>
  275. </view>
  276. <text class="article-title">暂无推荐文章</text>
  277. <text class="article-summary">精彩内容即将上线,敬请期待</text>
  278. <view class="article-meta">
  279. <view class="meta-item">
  280. <text class="meta-icon">&#x1F4D6;</text>
  281. <text class="meta-text">0</text>
  282. </view>
  283. <text class="article-date">--</text>
  284. </view>
  285. </view>
  286. </template>
  287. <!-- 有数据时显示文章卡片 -->
  288. <template v-else>
  289. <view class="article-card" v-for="article in indexArticles" :key="article.id" @click="goArticleDetail(article.id)">
  290. <view class="article-category" :style="{ background: article.categoryColor }">
  291. <text class="article-category-text">{{ article.category }}</text>
  292. </view>
  293. <text class="article-title">{{ article.title }}</text>
  294. <text class="article-summary">{{ article.summary }}</text>
  295. <view class="article-meta">
  296. <view class="meta-item">
  297. <text class="meta-icon">&#x1F4D6;</text>
  298. <text class="meta-text">{{ article.views }}</text>
  299. </view>
  300. <text class="article-date">{{ article.date }}</text>
  301. </view>
  302. </view>
  303. </template>
  304. </view>
  305. </view>
  306. <!-- 底部登录按钮 -->
  307. <view class="login-footer">
  308. <button class="login-btn" @click="handleLogin">登录 / 注册</button>
  309. <text class="login-footer-text">登录即表示同意《用户协议》和《隐私政策》</text>
  310. </view>
  311. <!-- 底部占位 -->
  312. <view style="height: 120rpx;"></view>
  313. </view>
  314. </view>
  315. </template>
  316. <script>
  317. import store from '../../store/index.js'
  318. import WuxingSandbox from '../../components/wuxing-sandbox.vue'
  319. import PageBanner from '../../components/PageBanner.vue'
  320. import FamilyFeed from '../../components/FamilyFeed.vue'
  321. import DimensionProducts from '../../components/DimensionProducts.vue'
  322. import ArticleBookshelf from '../../components/ArticleBookshelf.vue'
  323. import FamilyChallengeCard from '../../components/FamilyChallengeCard.vue'
  324. import IntentPicker from '../../components/intent-picker.vue'
  325. import JourneyCard from '../../components/journey-card.vue'
  326. import { acceptParentInvite, productList, getActivityList, getFeaturedArticles, getFamilyEnergySandbox, getVisibleFamilyMembers, getChildren, getChallengeList, switchToFamilyMember, getMyMembership, updateChallengeProgress, respondChallenge, getTodayTasks, completeTask as completeTaskApi, getTodayParentTasks, completeParentTask as completeParentTaskApi, getTaskHistory, getNotices, getNotificationList, getUserIntent, chooseUserIntent } from '../../utils/api.js'
  327. import nav from '../../utils/nav.js'
  328. import config from '@/config.js'
  329. import { parseDate } from '../../utils/format.js'
  330. export default {
  331. components: {
  332. PageBanner,
  333. WuxingSandbox,
  334. FamilyFeed,
  335. DimensionProducts,
  336. ArticleBookshelf,
  337. FamilyChallengeCard,
  338. IntentPicker,
  339. JourneyCard
  340. },
  341. data() {
  342. // 从 storage 预取登录态/角色,确保首次渲染即正确(WeChat 渲染层/逻辑层分离架构下 onLoad 执行前已渲染)
  343. var _token = uni.getStorageSync('token')
  344. var _currentRole = ''
  345. if (_token) {
  346. _currentRole = uni.getStorageSync('currentRole') || uni.getStorageSync('role') || ''
  347. }
  348. // 冷启动标记(由 App.vue onLaunch 设置,仅在冷启动时存在)
  349. var _isFirstLaunch = (uni.getStorageSync('_showSplashOverlay') === '1')
  350. return {
  351. currentRole: _currentRole,
  352. // splash loading overlay(冷启动时展示,数据加载完关闭)
  353. splashOverlay: _isFirstLaunch,
  354. splashOverlayFading: false,
  355. _splashReady: false,
  356. _watchPageReadyDone: false,
  357. typeList: [
  358. { label: '全部', value: '' },
  359. { label: '活动', value: 'activity' },
  360. { label: '课程', value: 'course' },
  361. { label: '实物', value: 'physical' },
  362. { label: '数字', value: 'digital' },
  363. { label: '服务', value: 'service' }
  364. ],
  365. currentType: '',
  366. products: [],
  367. loading: false,
  368. dimensionActivities: [],
  369. indexArticles: [],
  370. articlesLoading: false,
  371. gradientColors: [
  372. 'linear-gradient(135deg, #10B981, #34D399)',
  373. 'linear-gradient(135deg, #5B9BD5, #8FC5E8)',
  374. 'linear-gradient(135deg, #8B5CF6, #C084FC)',
  375. 'linear-gradient(135deg, #F97316, #FB923C)',
  376. 'linear-gradient(135deg, #6366F1, #818CF8)'
  377. ],
  378. // 登录态数据
  379. familyMembersVisible: [],
  380. // 接口数据是否已检查(避免"暂无数据"闪烁)
  381. childrenChecked: false,
  382. membersChecked: false,
  383. selectedMemberId: null,
  384. sandboxData: null,
  385. articles: [],
  386. children: [],
  387. currentChildId: null,
  388. activeChallenges: [],
  389. pendingTasks: [],
  390. familyFeed: [],
  391. notices: [],
  392. loggedInInitDone: false,
  393. // 会员状态(沙盘下方会员入口使用)
  394. isMember: false,
  395. isLifetime: false,
  396. membershipDays: 0,
  397. // 改版v1 用户意图/旅程
  398. userIntent: null,
  399. showIntentPicker: false,
  400. intentPickerDismissed: false
  401. }
  402. },
  403. computed: {
  404. isFamilyAdmin: function() {
  405. if (!this.familyMembersVisible || this.familyMembersVisible.length === 0) return false
  406. return this.familyMembersVisible[0].isAdmin === true
  407. },
  408. sandboxScores: function() {
  409. var d = this.sandboxData || {}
  410. return {
  411. body: d.bodyScore || 0,
  412. mind: d.mindScore || 0,
  413. wisdom: d.wisdomScore || 0,
  414. action: d.actionScore || 0,
  415. wealth: d.wealthScore || 0
  416. }
  417. },
  418. hasPendingTasks: function() {
  419. return (this.pendingTasks && this.pendingTasks.length > 0)
  420. },
  421. actionArticles: function() {
  422. if (!this.articles || this.articles.length === 0) return []
  423. return this.articles.slice(0, 5)
  424. },
  425. // 会员入口显示:非会员显示开通;会员剩余≤30天显示续费
  426. showMemberEntry: function() {
  427. if (!this.isLoggedIn()) return false
  428. if (this.isLifetime) return false
  429. if (!this.isMember) return true
  430. return this.membershipDays > 0 && this.membershipDays <= 30
  431. },
  432. showCheckinBtn: function() {
  433. return (uni.getStorageSync('role') || 'parent') === 'child'
  434. },
  435. memberEntryTitle: function() {
  436. if (this.isLifetime) return '终身会员 · 永久有效'
  437. if (!this.isMember) return '开通会员,解锁全部特权'
  438. return '会员即将到期,续费恢复权益'
  439. },
  440. memberEntryDesc: function() {
  441. if (this.isLifetime) return '享全平台权益,无需续费'
  442. if (!this.isMember) return '享专属折扣 · 成长服务 · 规划指导'
  443. return '剩余 ' + this.membershipDays + ' 天,续费保持权益不中断'
  444. },
  445. memberEntryBtn: function() {
  446. if (this.isLifetime) return '已拥有'
  447. return this.isMember ? '立即续费' : '立即开通'
  448. }
  449. },
  450. onLoad(options) {
  451. this._doInit(options)
  452. },
  453. onShow() {
  454. // splash overlay 已在 data() 中根据 storage 标记初始化,此处只需配置关闭条件
  455. if (this.splashOverlay) {
  456. uni.removeStorageSync('_showSplashOverlay')
  457. this._splashLoadCount = 0
  458. this._splashMinPassed = false
  459. var self = this
  460. // 最低展示 800ms
  461. setTimeout(function() {
  462. self._splashMinPassed = true
  463. self._tryHideSplash()
  464. }, 800)
  465. // 最多展示 5s
  466. setTimeout(function() {
  467. if (self.splashOverlay) self._hideSplashOverlay()
  468. }, 5000)
  469. }
  470. // 始终执行初始化,确保登录态变更后及时切换视图
  471. this._doInit()
  472. },
  473. methods: {
  474. _checkSplashReady() {
  475. this._splashLoadCount++
  476. this._tryHideSplash()
  477. },
  478. _tryHideSplash() {
  479. if (this.splashOverlayFading) return
  480. if (!this._splashMinPassed) return
  481. if (this.isLoggedIn()) {
  482. // 登录用户:等待子组件的 ready 信号
  483. if (this._splashReady) this._hideSplashOverlay()
  484. } else {
  485. // 游客:等待 3 个 API 全部返回
  486. if (this._splashLoadCount >= 3) this._hideSplashOverlay()
  487. }
  488. },
  489. _hideSplashOverlay() {
  490. if (this.splashOverlayFading) return
  491. this.splashOverlayFading = true
  492. var self = this
  493. setTimeout(function() {
  494. self.splashOverlay = false
  495. self.splashOverlayFading = false
  496. }, 400)
  497. },
  498. // ===== 登录态数据加载 =====
  499. loadLoggedInData: function() {
  500. this.loadFamilyMembers()
  501. this.loadChildren()
  502. },
  503. loadChildren: function() {
  504. var self = this
  505. getChildren().then(function(res) {
  506. if (res.code === 200 && res.data) {
  507. self.children = res.data
  508. var savedChildId = uni.getStorageSync('currentChildId')
  509. if (savedChildId) {
  510. self.currentChildId = savedChildId
  511. }
  512. self.loadDimensionData()
  513. }
  514. self.childrenChecked = true
  515. self.loadTodayTasks()
  516. self.loadFamilyFeed()
  517. self.loadNotices()
  518. self.loadNotifications()
  519. }).catch(function(e) {
  520. console.log('获取孩子列表失败', e)
  521. self.childrenChecked = true
  522. })
  523. },
  524. loadDimensionData: function() {
  525. this.loadSandboxData()
  526. this.loadActionArticles()
  527. this.loadChallenges()
  528. },
  529. loadSandboxData: function() {
  530. var self = this
  531. getFamilyEnergySandbox().then(function(res) {
  532. if (res && res.data) {
  533. self.sandboxData = res.data
  534. self._splashReady = true
  535. self._tryHideSplash()
  536. }
  537. }).catch(function() {})
  538. },
  539. loadActionArticles: function() {
  540. var self = this
  541. getFeaturedArticles({ size: 5 }).then(function(res) {
  542. if (res.code === 200 && res.data) {
  543. var gradientColors = [
  544. 'linear-gradient(135deg, #10B981, #34D399)',
  545. 'linear-gradient(135deg, #5B9BD5, #8FC5E8)',
  546. 'linear-gradient(135deg, #8B5CF6, #C084FC)',
  547. 'linear-gradient(135deg, #F97316, #FB923C)',
  548. 'linear-gradient(135deg, #6366F1, #818CF8)'
  549. ]
  550. var list = Array.isArray(res.data) ? res.data : (res.data.records || [])
  551. self.articles = list.map(function(item, index) {
  552. return {
  553. id: item.id,
  554. category: item.categoryName || '行动社交',
  555. categoryColor: gradientColors[index % gradientColors.length],
  556. title: item.title || '',
  557. summary: item.summary || '',
  558. dimensionWeights: item.dimensionWeights || null,
  559. views: item.viewCount ? String(item.viewCount) : '0',
  560. likes: '0',
  561. date: item.publishedAt ? item.publishedAt.slice(0, 10) : '',
  562. relatedDimensions: self.parseRelatedDimensions(item.relatedDimensions),
  563. coverImage: item.coverImage
  564. }
  565. })
  566. }
  567. }).catch(function() {})
  568. },
  569. loadChallenges: function() {
  570. var self = this
  571. getChallengeList({}).then(function(res) {
  572. if (res.code === 200 && Array.isArray(res.data)) {
  573. self.activeChallenges = res.data
  574. }
  575. }).catch(function() {
  576. self.activeChallenges = []
  577. })
  578. },
  579. loadTodayTasks: function() {
  580. var self = this
  581. if (!self.currentChildId) {
  582. self.pendingTasks = []
  583. return
  584. }
  585. getTodayTasks(self.currentChildId).then(function(res) {
  586. if (res.code === 200 && Array.isArray(res.data)) {
  587. self.pendingTasks = res.data.filter(function(t) {
  588. return t.status === 'pending'
  589. })
  590. }
  591. }).catch(function() {
  592. self.pendingTasks = []
  593. })
  594. },
  595. loadFamilyFeed: function() {
  596. var self = this
  597. var children = self.children || []
  598. if (children.length === 0) {
  599. self.familyFeed = []
  600. return
  601. }
  602. var promises = children.map(function(child) {
  603. return getTaskHistory(child.id, 1, 3).then(function(res) {
  604. var tasks = []
  605. if (res.code === 200) {
  606. var data = res.data
  607. tasks = (data && data.records) ? data.records : (Array.isArray(data) ? data : [])
  608. }
  609. return tasks.filter(function(t) { return t.status === 'completed' }).map(function(t) {
  610. var points = t.pointsEarned || t.points || 0
  611. var timeStr = ''
  612. if (t.completedAt && typeof t.completedAt === 'string') {
  613. timeStr = t.completedAt.substring(11, 16)
  614. }
  615. return {
  616. text: '✅ ' + (child.nickname || '小名') + ' 完成「' + (t.title || '任务') + '」 +' + points + '分',
  617. time: timeStr,
  618. type: 'task'
  619. }
  620. })
  621. }).catch(function() { return [] })
  622. })
  623. Promise.all(promises).then(function(results) {
  624. var all = []
  625. for (var i = 0; i < results.length; i++) {
  626. for (var j = 0; j < results[i].length; j++) {
  627. all.push(results[i][j])
  628. }
  629. }
  630. self.familyFeed = all.slice(0, 10)
  631. }).catch(function() {
  632. self.familyFeed = []
  633. })
  634. },
  635. loadNotices: function() {
  636. var self = this
  637. getNotices().then(function(res) {
  638. if (res.code === 200 && res.data) {
  639. var notices = res.data.map(function(n) {
  640. var timeStr = ''
  641. if (n.createdAt) {
  642. var d = new Date(n.createdAt)
  643. timeStr = (d.getMonth() + 1) + '月' + d.getDate() + '日'
  644. }
  645. return {
  646. text: '📢 ' + n.title,
  647. time: timeStr,
  648. type: 'notice',
  649. notice: n
  650. }
  651. })
  652. self.notices = notices
  653. // 合并 notices 到 familyFeed(优先显示)
  654. self.familyFeed = notices.concat(self.familyFeed).slice(0, 10)
  655. }
  656. }).catch(function() {})
  657. },
  658. // W3: 用户通知入动态(未读优先显示在 familyFeed 顶部)
  659. loadNotifications: function() {
  660. var self = this
  661. getNotificationList().then(function(res) {
  662. if (res.code === 200 && res.data) {
  663. var notifications = res.data.map(function(n) {
  664. var timeStr = ''
  665. if (n.createdAt) {
  666. var d = parseDate(n.createdAt)
  667. if (d) {
  668. timeStr = (d.getMonth() + 1) + '月' + d.getDate() + '日'
  669. }
  670. }
  671. return {
  672. text: '📬 ' + n.title,
  673. time: timeStr,
  674. type: 'notification',
  675. unread: (n.isRead === 0),
  676. notice: n
  677. }
  678. })
  679. var unread = notifications.filter(function(n) { return n.unread })
  680. var read = notifications.filter(function(n) { return !n.unread })
  681. // 未读在前,已读在后,合并到 familyFeed 顶部
  682. self.familyFeed = unread.concat(read, self.familyFeed).slice(0, 10)
  683. }
  684. }).catch(function() {})
  685. },
  686. quickCompleteTask: function(task) {
  687. var self = this
  688. completeTaskApi(task.id, self.currentChildId, '').then(function(res) {
  689. if (res.code === 200) {
  690. uni.showToast({ title: '获得 ' + (res.data && res.data.pointsEarned || 0) + ' 积分', icon: 'success' })
  691. self.loadTodayTasks()
  692. } else {
  693. uni.showToast({ title: (res && res.message) || '完成失败', icon: 'none' })
  694. }
  695. }).catch(function() {
  696. uni.showToast({ title: '完成失败,请重试', icon: 'none' })
  697. })
  698. },
  699. onChallengeCheckin: function(payload) {
  700. var self = this
  701. updateChallengeProgress({ challengeId: payload.challengeId, delta: 1 }).then(function(res) {
  702. if (res && res.code === 200) {
  703. uni.showToast({ title: '打卡成功', icon: 'success' })
  704. self.loadChallenges()
  705. } else {
  706. uni.showToast({ title: (res && res.message) || '打卡失败', icon: 'none' })
  707. }
  708. }).catch(function() {
  709. uni.showToast({ title: '打卡失败,请重试', icon: 'none' })
  710. })
  711. },
  712. onChallengeRespond: function(payload) {
  713. var self = this
  714. respondChallenge({ challengeId: payload.challengeId, action: payload.action }).then(function(res) {
  715. if (res && res.code === 200) {
  716. uni.showToast({ title: payload.action === 'agree' ? '已同意' : '已拒绝', icon: 'success' })
  717. self.loadChallenges()
  718. } else {
  719. uni.showToast({ title: (res && res.message) || '操作失败', icon: 'none' })
  720. self.loadChallenges()
  721. }
  722. }).catch(function() {
  723. uni.showToast({ title: '操作失败,请重试', icon: 'none' })
  724. })
  725. },
  726. loadFamilyMembers: function() {
  727. var self = this
  728. getVisibleFamilyMembers().then(function(res) {
  729. if (res.code === 200 && res.data) {
  730. self.familyMembersVisible = Array.isArray(res.data) ? res.data : (res.data.list || [])
  731. }
  732. self.membersChecked = true
  733. }).catch(function(e) {
  734. console.log('获取可见家庭成员失败', e)
  735. self.familyMembersVisible = []
  736. self.membersChecked = true
  737. })
  738. },
  739. parseRelatedDimensions: function(val) {
  740. if (!val) return []
  741. if (Array.isArray(val)) return val
  742. if (typeof val === 'string') {
  743. try {
  744. var parsed = JSON.parse(val)
  745. return Array.isArray(parsed) ? parsed : []
  746. } catch (e) {
  747. return val.split(',').map(function(s) { return s.trim() }).filter(function(s) { return s })
  748. }
  749. }
  750. return []
  751. },
  752. onFamilyMemberSelect: function(member) {
  753. this.selectedMemberId = member.id
  754. },
  755. onFamilyMemberSwitch: function(member) {
  756. var self = this
  757. if (!member || !member.id) return
  758. switchToFamilyMember(member.id, member.source || 'family_member').then(function(res) {
  759. if (res.code === 200 && res.data) {
  760. store.commit('switchToMember', {
  761. memberId: res.data.memberId,
  762. effectiveRole: res.data.effectiveRole
  763. })
  764. uni.showToast({ title: '已切换到' + (member.nickname || '该成员'), icon: 'success' })
  765. setTimeout(function() {
  766. uni.reLaunch({ url: '/pages/index-home/index' })
  767. }, 1000)
  768. } else {
  769. uni.showToast({ title: res.message || '切换失败', icon: 'none' })
  770. }
  771. }).catch(function() {
  772. uni.showToast({ title: '切换失败', icon: 'none' })
  773. })
  774. },
  775. navTo: function(url) {
  776. nav.goPage(url)
  777. },
  778. goActivityDetail: function(act) {
  779. if (!act || !act.id) return
  780. uni.navigateTo({ url: '/pages/activity/activity-detail/activity-detail?id=' + act.id })
  781. },
  782. goMoreActivities: function() {
  783. uni.navigateTo({ url: '/pages/activity/index' })
  784. },
  785. goProductDetail: function(prod) {
  786. uni.navigateTo({ url: '/pages/discover-detail/product-detail/product-detail?id=' + prod.id })
  787. },
  788. goMoreProducts: function() {
  789. uni.navigateTo({ url: '/pages/shop/index/index' })
  790. },
  791. goArticleDetail: function(article) {
  792. var id = article.id || article
  793. uni.navigateTo({ url: '/pages/article-center/article-detail?id=' + id })
  794. },
  795. goMoreArticles: function() {
  796. uni.navigateTo({ url: '/pages/article-center/index?dimension=action' })
  797. },
  798. _doInit(options) {
  799. options = options || {}
  800. if (!this.isLoggedIn()) {
  801. this.currentRole = ''
  802. this.loadProducts()
  803. this.loadDimensionActivities()
  804. this.loadFeaturedArticles()
  805. return
  806. }
  807. this.syncRoleAndTabBar()
  808. if (options.inviteCode && options.type === 'parent_invite') {
  809. this.handleParentInvite(options.inviteCode)
  810. return
  811. }
  812. var storedCode = uni.getStorageSync('inviteCode')
  813. var storedType = uni.getStorageSync('inviteType')
  814. if (storedCode && storedType === 'parent_invite') {
  815. this.handleParentInvite(storedCode)
  816. uni.removeStorageSync('inviteCode')
  817. uni.removeStorageSync('inviteType')
  818. return
  819. }
  820. // 登录用户:直接在 TabBar 页面内联渲染,保持底签可见
  821. if (!this.loggedInInitDone) {
  822. this.loggedInInitDone = true
  823. this.loadLoggedInData()
  824. }
  825. this.checkMemberStatus()
  826. this.checkUserIntent()
  827. this._watchPageReady()
  828. },
  829. _watchPageReady() {
  830. if (this._watchPageReadyDone) return
  831. this._watchPageReadyDone = true
  832. var that = this
  833. that.$watch('_splashReady', function(newVal) {
  834. if (newVal) that._tryHideSplash()
  835. })
  836. },
  837. isLoggedIn() {
  838. return !!uni.getStorageSync('token')
  839. },
  840. // ===== 会员状态(沙盘下方会员入口) =====
  841. checkMemberStatus: function() {
  842. var that = this
  843. getMyMembership().then(function(res) {
  844. var m = res.data || {}
  845. var level = m.memberLevel || m.levelCode || ''
  846. that.isLifetime = (level === 'LIFETIME')
  847. that.isMember = that.isLifetime || !!(level && level !== 'FREE')
  848. var mem = m.membership || m
  849. if (mem.daysRemaining != null) {
  850. that.membershipDays = mem.daysRemaining
  851. } else if (that.isLifetime) {
  852. // 终身会员:永久有效,不显示剩余天数
  853. that.membershipDays = 0
  854. }
  855. }).catch(function() {})
  856. },
  857. goMembership: function() {
  858. uni.navigateTo({ url: '/pages/membership/upgrade' })
  859. },
  860. normalizeCurrentRole() {
  861. const role = uni.getStorageSync('role') || 'parent'
  862. const currentRole = uni.getStorageSync('currentRole')
  863. if (!currentRole) {
  864. return role
  865. }
  866. // 非规划师账号不允许落到规划师首页
  867. if (currentRole === 'teacher' && role !== 'teacher') {
  868. return role
  869. }
  870. // 只有家长账号允许切换到孩子视角
  871. if (currentRole === 'child' && role !== 'parent') {
  872. return role
  873. }
  874. return currentRole
  875. },
  876. syncRoleAndTabBar() {
  877. this.currentRole = this.normalizeCurrentRole()
  878. uni.setStorageSync('currentRole', this.currentRole)
  879. },
  880. // ===== 发现页 / 未登录态方法 =====
  881. loadProducts: function() {
  882. this.loading = true
  883. var params = { page: 1, size: 10 }
  884. if (this.currentType) {
  885. params.productType = this.currentType
  886. }
  887. var self = this
  888. productList(params).then(function(res) {
  889. self.loading = false
  890. if (res && res.code === 200) {
  891. // res.data is the response wrapper, products are in res.data.data or res.data.records
  892. var rawData = res.data && (Array.isArray(res.data) ? res.data : (res.data.data || res.data.records || []))
  893. self.products = Array.isArray(rawData) ? rawData : []
  894. }
  895. self._checkSplashReady()
  896. }).catch(function() {
  897. self.loading = false
  898. self._checkSplashReady()
  899. })
  900. },
  901. loadDimensionActivities: function() {
  902. var self = this
  903. getActivityList({ dimensionCode: '', page: 1, size: 3 }).then(function(res) {
  904. if (res && res.code === 200) {
  905. // res.data is the response wrapper, activities are in res.data.data or res.data.records
  906. var rawData = res.data && (Array.isArray(res.data) ? res.data : (res.data.data || res.data.records || []))
  907. self.dimensionActivities = Array.isArray(rawData) ? rawData.slice(0, 3) : []
  908. }
  909. self._checkSplashReady()
  910. }).catch(function() {
  911. self._checkSplashReady()
  912. })
  913. },
  914. loadFeaturedArticles: function() {
  915. var self = this
  916. this.articlesLoading = true
  917. getFeaturedArticles({ size: 5 }).then(function(res) {
  918. self.articlesLoading = false
  919. if (res && res.code === 200) {
  920. var gradientColors = [
  921. 'linear-gradient(135deg, #10B981, #34D399)',
  922. 'linear-gradient(135deg, #5B9BD5, #8FC5E8)',
  923. 'linear-gradient(135deg, #8B5CF6, #C084FC)',
  924. 'linear-gradient(135deg, #F97316, #FB923C)',
  925. 'linear-gradient(135deg, #6366F1, #818CF8)'
  926. ]
  927. // res.data is the response wrapper, articles are in res.data.data
  928. var rawList = res.data && (Array.isArray(res.data) ? res.data : (res.data.data || res.data.records || []))
  929. var list = Array.isArray(rawList) ? rawList : []
  930. self.indexArticles = list.map(function(item, index) {
  931. return {
  932. id: item.id,
  933. category: item.categoryName || item.category || '热门文章',
  934. categoryColor: gradientColors[index % gradientColors.length],
  935. title: item.title || '',
  936. summary: item.summary || '',
  937. views: item.viewCount ? String(item.viewCount) : '0',
  938. date: item.publishedAt ? item.publishedAt.slice(0, 10) : '',
  939. coverImage: item.coverImage
  940. }
  941. })
  942. }
  943. self._checkSplashReady()
  944. }).catch(function() {
  945. self.articlesLoading = false
  946. self._checkSplashReady()
  947. })
  948. },
  949. goActivities: function() {
  950. uni.navigateTo({ url: '/pages/activity/index' })
  951. },
  952. goChallengeManage: function() {
  953. uni.navigateTo({ url: '/pages/health/challenge-manage' })
  954. },
  955. goArticles: function() {
  956. uni.navigateTo({ url: '/pages/mind-detail/articles' })
  957. },
  958. goArticleDetail: function(article) {
  959. var id = article && article.id ? article.id : article
  960. uni.navigateTo({ url: '/pages/article-center/article-detail?id=' + id })
  961. },
  962. onTypeChange(value) {
  963. this.currentType = value
  964. this.loadProducts()
  965. },
  966. goShop() {
  967. uni.navigateTo({ url: '/pages/shop/index/index' })
  968. },
  969. goDetail(id) {
  970. uni.navigateTo({ url: '/pages/discover-detail/product-detail/product-detail?id=' + id })
  971. },
  972. handleLogin() {
  973. uni.navigateTo({ url: '/pages/login/login?redirect=' + encodeURIComponent('/pages/index-home/index') })
  974. },
  975. async handleParentInvite(code) {
  976. // 延迟显示,等待登录完成
  977. setTimeout(async () => {
  978. const hasToken = uni.getStorageSync('token')
  979. if (!hasToken) {
  980. // 未登录,先去登录
  981. uni.reLaunch({
  982. url: '/pages/login/login?inviteCode=' + code
  983. })
  984. return
  985. }
  986. // 已登录,显示确认框
  987. uni.showModal({
  988. title: '加入家庭',
  989. content: '您已被邀请加入家庭,是否接受?',
  990. success: async (res) => {
  991. if (res.confirm) {
  992. try {
  993. uni.showLoading({ title: '加入中...' })
  994. const result = await acceptParentInvite(code)
  995. uni.hideLoading()
  996. if (result.code === 200) {
  997. const { role, token } = result.data
  998. uni.setStorageSync('role', role)
  999. uni.setStorageSync('token', token)
  1000. uni.showToast({ title: '加入成功', icon: 'success' })
  1001. // 刷新页面
  1002. setTimeout(() => {
  1003. uni.switchTab({ url: '/pages/index-home/index' })
  1004. }, 1500)
  1005. }
  1006. } catch (e) {
  1007. uni.hideLoading()
  1008. uni.showToast({ title: e.message || '加入失败', icon: 'none' })
  1009. }
  1010. }
  1011. }
  1012. })
  1013. }, 500)
  1014. },
  1015. getImageUrl: function(path) {
  1016. return config.API_BASE_URL + path
  1017. },
  1018. // ===== 改版v1 用户意图/旅程 =====
  1019. checkUserIntent: function() {
  1020. var self = this
  1021. var role = uni.getStorageSync('currentRole') || uni.getStorageSync('role') || ''
  1022. // teacher 角色不弹意图选择
  1023. if (role === 'teacher') return
  1024. getUserIntent().then(function(res) {
  1025. var intent = res && res.data
  1026. if (intent) {
  1027. self.userIntent = intent
  1028. } else {
  1029. // 无意图且未跳过,弹选择层
  1030. if (!self.intentPickerDismissed) {
  1031. self.intentPickerDismissed = true
  1032. self.showIntentPicker = true
  1033. }
  1034. }
  1035. }).catch(function() {
  1036. // 静默:接口异常时不弹
  1037. })
  1038. },
  1039. handleIntentSelect: function(payload) {
  1040. var self = this
  1041. self.showIntentPicker = false
  1042. uni.showLoading({ title: '处理中...', mask: true })
  1043. var data = { intentType: payload.intentType }
  1044. if (payload.intentType === 'C' && payload.problemDomainCode) {
  1045. data.problemDomainCode = payload.problemDomainCode
  1046. }
  1047. chooseUserIntent(data).then(function(res) {
  1048. uni.hideLoading()
  1049. if (res && (res.code === 0 || res.code === 200)) {
  1050. // 选择成功后刷新意图
  1051. getUserIntent().then(function(r) {
  1052. self.userIntent = r && r.data
  1053. }).catch(function() {})
  1054. // 按类型跳转(A类·随便看看 不跳转,留在首页浏览)
  1055. if (payload.intentType === 'B') {
  1056. uni.navigateTo({ url: '/pages/problem/domain-list' })
  1057. } else if (payload.intentType === 'C') {
  1058. uni.navigateTo({
  1059. url: '/pages/problem/flow-intro?code=' + (payload.problemDomainCode || '')
  1060. })
  1061. }
  1062. } else {
  1063. uni.showToast({ title: res.message || '选择失败', icon: 'none' })
  1064. }
  1065. }).catch(function() {
  1066. uni.hideLoading()
  1067. uni.showToast({ title: '选择失败,请重试', icon: 'none' })
  1068. })
  1069. },
  1070. handleIntentClose: function() {
  1071. this.showIntentPicker = false
  1072. uni.setStorageSync('intent_skipped', '1')
  1073. },
  1074. handleJourneyAction: function(payload) {
  1075. var action = payload && payload.action
  1076. var code = payload && payload.code
  1077. if (action === 'flow-intro') {
  1078. uni.navigateTo({ url: '/pages/problem/flow-intro?code=' + (code || '') })
  1079. } else if (action === 'survey') {
  1080. uni.navigateTo({ url: '/pages/problem/survey?code=' + (code || '') })
  1081. } else if (action === 'package') {
  1082. uni.navigateTo({ url: '/pages/problem/package-match?code=' + (code || '') })
  1083. } else if (action === 'logistics') {
  1084. uni.navigateTo({ url: '/pages/problem/logistics?code=' + (code || '') })
  1085. } else if (action === 'report') {
  1086. uni.navigateTo({ url: '/pages/problem/plan-confirm?code=' + (code || '') })
  1087. } else if (action === 'plan-confirm') {
  1088. uni.navigateTo({ url: '/pages/problem/plan-confirm?code=' + (code || '') })
  1089. } else if (action === 'tasks') {
  1090. uni.navigateTo({ url: '/pages/tasks/tasks' })
  1091. } else if (action === 'purchase') {
  1092. uni.navigateTo({ url: '/pages/assessment/purchase' })
  1093. } else if (action === 'recommend') {
  1094. uni.navigateTo({ url: '/pages/problem/domain-list' })
  1095. }
  1096. }
  1097. }
  1098. }
  1099. </script>
  1100. <style>
  1101. .discover-container {
  1102. min-height: 100vh;
  1103. background: #f5f7fa;
  1104. padding-bottom: 100rpx;
  1105. }
  1106. /* ===== 品牌定位语 ===== */
  1107. .brand-strap {
  1108. margin: 16rpx 30rpx 0;
  1109. padding: 20rpx 28rpx;
  1110. background: linear-gradient(135deg, #FFF7ED, rgba(249,115,22,0.10));
  1111. border-radius: 16rpx;
  1112. border-left: 4rpx solid #F97316;
  1113. }
  1114. .brand-strap-text {
  1115. font-size: 26rpx;
  1116. color: #9A3412;
  1117. font-weight: 500;
  1118. }
  1119. /* ===== 会员入口卡(能量沙盘下方) ===== */
  1120. .member-entry {
  1121. display: flex;
  1122. align-items: center;
  1123. margin: 20rpx 30rpx 0;
  1124. background: linear-gradient(135deg, #F97316, #FB923C);
  1125. border-radius: 20rpx;
  1126. padding: 24rpx 30rpx;
  1127. }
  1128. .member-entry-icon-wrap {
  1129. width: 64rpx;
  1130. height: 64rpx;
  1131. border-radius: 50%;
  1132. background: rgba(255,255,255,0.2);
  1133. display: flex;
  1134. align-items: center;
  1135. justify-content: center;
  1136. margin-right: 16rpx;
  1137. flex-shrink: 0;
  1138. }
  1139. .member-entry-icon {
  1140. font-size: 36rpx;
  1141. }
  1142. .member-entry-texts {
  1143. flex: 1;
  1144. display: flex;
  1145. flex-direction: column;
  1146. min-width: 0;
  1147. }
  1148. .member-entry-title {
  1149. font-size: 30rpx;
  1150. font-weight: bold;
  1151. color: #fff;
  1152. }
  1153. .member-entry-desc {
  1154. font-size: 22rpx;
  1155. color: rgba(255,255,255,0.85);
  1156. margin-top: 4rpx;
  1157. overflow: hidden;
  1158. text-overflow: ellipsis;
  1159. white-space: nowrap;
  1160. }
  1161. .member-entry-btn {
  1162. margin-left: 16rpx;
  1163. padding: 10rpx 24rpx;
  1164. background: #fff;
  1165. border-radius: 30rpx;
  1166. flex-shrink: 0;
  1167. }
  1168. .member-entry-btn-text {
  1169. font-size: 24rpx;
  1170. color: #F97316;
  1171. font-weight: bold;
  1172. }
  1173. /* ===== 推荐 ===== */
  1174. .recommend-section {
  1175. margin: 20rpx 30rpx;
  1176. }
  1177. .type-filter-scroll {
  1178. white-space: nowrap;
  1179. margin-bottom: 20rpx;
  1180. }
  1181. .filter-chip {
  1182. display: inline-block;
  1183. padding: 8rpx 24rpx;
  1184. font-size: 24rpx;
  1185. color: #666;
  1186. background: #f0f0f0;
  1187. border-radius: 30rpx;
  1188. margin-right: 16rpx;
  1189. }
  1190. .filter-chip.active {
  1191. background: #5B9BD5;
  1192. color: #fff;
  1193. }
  1194. .loading-state,
  1195. .empty-state {
  1196. display: flex;
  1197. justify-content: center;
  1198. padding: 60rpx 0;
  1199. }
  1200. .loading-text,
  1201. .empty-text {
  1202. font-size: 26rpx;
  1203. color: #999;
  1204. }
  1205. .product-grid {
  1206. display: flex;
  1207. flex-wrap: wrap;
  1208. justify-content: space-between;
  1209. }
  1210. .product-card {
  1211. width: 48%;
  1212. background: #fff;
  1213. border-radius: 16rpx;
  1214. overflow: hidden;
  1215. margin-bottom: 20rpx;
  1216. box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.06);
  1217. }
  1218. .product-cover {
  1219. width: 100%;
  1220. height: 200rpx;
  1221. background: #f0f0f0;
  1222. }
  1223. .product-info {
  1224. padding: 14rpx;
  1225. }
  1226. .product-name {
  1227. display: block;
  1228. font-size: 26rpx;
  1229. color: #333;
  1230. margin-bottom: 10rpx;
  1231. overflow: hidden;
  1232. text-overflow: ellipsis;
  1233. white-space: nowrap;
  1234. }
  1235. .product-price-row {
  1236. display: flex;
  1237. align-items: baseline;
  1238. }
  1239. .product-price {
  1240. font-size: 28rpx;
  1241. color: #5B9BD5;
  1242. font-weight: bold;
  1243. margin-right: 10rpx;
  1244. }
  1245. .product-price-login {
  1246. font-size: 24rpx;
  1247. color: #999;
  1248. }
  1249. .product-member {
  1250. font-size: 20rpx;
  1251. color: #999;
  1252. }
  1253. /* ===== 五维全景幸福矩阵 ===== */
  1254. /* ===== 底部登录 ===== */
  1255. .login-footer {
  1256. margin: 40rpx 30rpx;
  1257. display: flex;
  1258. flex-direction: column;
  1259. align-items: center;
  1260. }
  1261. .login-btn {
  1262. width: 100%;
  1263. height: 88rpx;
  1264. line-height: 88rpx;
  1265. background: linear-gradient(135deg, #5B9BD5, #3A7CC4);
  1266. color: #fff;
  1267. font-size: 32rpx;
  1268. font-weight: bold;
  1269. border-radius: 44rpx;
  1270. text-align: center;
  1271. border: none;
  1272. }
  1273. .login-btn::after {
  1274. border: none;
  1275. }
  1276. .login-footer-text {
  1277. font-size: 20rpx;
  1278. color: #bbb;
  1279. margin-top: 16rpx;
  1280. }
  1281. /* ===== 加载占位 ===== */
  1282. .loading-container {
  1283. display: flex;
  1284. justify-content: center;
  1285. align-items: center;
  1286. height: 100vh;
  1287. }
  1288. /* ===== 角色切换淡入淡出 ===== */
  1289. .role-switch-wrapper {
  1290. width: 100%;
  1291. min-height: 100vh;
  1292. }
  1293. .fade-enter-active,
  1294. .fade-leave-active {
  1295. transition: opacity 0.3s ease;
  1296. }
  1297. .fade-enter,
  1298. .fade-leave-to {
  1299. opacity: 0;
  1300. }
  1301. /* ===== 通用区块样式 ===== */
  1302. .section {
  1303. margin: 20rpx 30rpx;
  1304. }
  1305. .section-header {
  1306. display: flex;
  1307. justify-content: space-between;
  1308. align-items: center;
  1309. margin-bottom: 20rpx;
  1310. }
  1311. .section-title {
  1312. font-size: 30rpx;
  1313. font-weight: bold;
  1314. color: #333;
  1315. }
  1316. .section-more {
  1317. font-size: 24rpx;
  1318. color: #5B9BD5;
  1319. }
  1320. .empty-state {
  1321. display: flex;
  1322. justify-content: center;
  1323. padding: 60rpx 0;
  1324. }
  1325. .empty-text {
  1326. font-size: 26rpx;
  1327. color: #999;
  1328. }
  1329. /* ===== 活动列表 ===== */
  1330. .activity-list {
  1331. display: flex;
  1332. flex-direction: column;
  1333. gap: 16rpx;
  1334. }
  1335. .activity-card {
  1336. background: #fff;
  1337. border-radius: 16rpx;
  1338. overflow: hidden;
  1339. display: flex;
  1340. flex-direction: row;
  1341. box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
  1342. }
  1343. .activity-card:active {
  1344. opacity: 0.8;
  1345. }
  1346. .activity-cover {
  1347. width: 200rpx;
  1348. height: 160rpx;
  1349. flex-shrink: 0;
  1350. background: #f0f0f0;
  1351. }
  1352. .activity-info {
  1353. flex: 1;
  1354. padding: 16rpx;
  1355. display: flex;
  1356. flex-direction: column;
  1357. justify-content: space-between;
  1358. }
  1359. .activity-name {
  1360. font-size: 28rpx;
  1361. font-weight: bold;
  1362. color: #333;
  1363. margin-bottom: 8rpx;
  1364. }
  1365. .line-clamp-1 {
  1366. overflow: hidden;
  1367. text-overflow: ellipsis;
  1368. white-space: nowrap;
  1369. }
  1370. .activity-meta {
  1371. display: flex;
  1372. align-items: center;
  1373. margin-bottom: 8rpx;
  1374. }
  1375. .activity-time {
  1376. font-size: 22rpx;
  1377. color: #999;
  1378. }
  1379. .activity-bottom {
  1380. display: flex;
  1381. align-items: center;
  1382. gap: 12rpx;
  1383. }
  1384. .activity-status {
  1385. font-size: 20rpx;
  1386. padding: 2rpx 10rpx;
  1387. border-radius: 8rpx;
  1388. background: #E8F5E9;
  1389. color: #2E7D32;
  1390. }
  1391. .activity-status.status-upcoming {
  1392. background: #E3F2FD;
  1393. color: #1565C0;
  1394. }
  1395. .activity-status.status-ended {
  1396. background: #F5F5F5;
  1397. color: #999;
  1398. }
  1399. .activity-fee {
  1400. font-size: 24rpx;
  1401. color: #F97316;
  1402. font-weight: bold;
  1403. }
  1404. .activity-fee.fee-free {
  1405. color: #4CAF50;
  1406. }
  1407. /* ===== 文章列表 ===== */
  1408. .article-list {
  1409. display: flex;
  1410. flex-direction: column;
  1411. gap: 16rpx;
  1412. }
  1413. .article-card {
  1414. background: #fff;
  1415. border-radius: 16rpx;
  1416. padding: 24rpx;
  1417. box-shadow: 0 2rpx 12rpx rgba(0,0,0,0.06);
  1418. }
  1419. .article-card:active {
  1420. opacity: 0.8;
  1421. }
  1422. .article-category {
  1423. display: inline-block;
  1424. padding: 4rpx 14rpx;
  1425. border-radius: 8rpx;
  1426. margin-bottom: 10rpx;
  1427. }
  1428. .article-category-text {
  1429. font-size: 20rpx;
  1430. color: #fff;
  1431. }
  1432. .article-title {
  1433. display: block;
  1434. font-size: 28rpx;
  1435. font-weight: bold;
  1436. color: #333;
  1437. margin-bottom: 8rpx;
  1438. line-height: 1.4;
  1439. }
  1440. .article-summary {
  1441. display: block;
  1442. font-size: 24rpx;
  1443. color: #888;
  1444. line-height: 1.5;
  1445. margin-bottom: 12rpx;
  1446. overflow: hidden;
  1447. text-overflow: ellipsis;
  1448. display: -webkit-box;
  1449. -webkit-line-clamp: 2;
  1450. -webkit-box-orient: vertical;
  1451. }
  1452. .article-meta {
  1453. display: flex;
  1454. align-items: center;
  1455. gap: 16rpx;
  1456. }
  1457. .meta-item {
  1458. display: flex;
  1459. align-items: center;
  1460. gap: 4rpx;
  1461. }
  1462. .meta-icon {
  1463. font-size: 24rpx;
  1464. }
  1465. .meta-text {
  1466. font-size: 22rpx;
  1467. color: #999;
  1468. }
  1469. .article-date {
  1470. font-size: 22rpx;
  1471. color: #bbb;
  1472. }
  1473. /* ===== Splash Loading Overlay(冷启动蒙板,来自 merge splash.vue) ===== */
  1474. .splash-overlay {
  1475. position: fixed;
  1476. top: 0; left: 0; right: 0; bottom: 0;
  1477. z-index: 9999;
  1478. display: flex;
  1479. align-items: center;
  1480. justify-content: center;
  1481. background: linear-gradient(160deg, #FFF7ED 0%, #FFEDD5 50%, #FED7AA 100%);
  1482. overflow: hidden;
  1483. opacity: 1;
  1484. transition: opacity 0.4s ease;
  1485. }
  1486. .splash-overlay.fade-out {
  1487. opacity: 0;
  1488. pointer-events: none;
  1489. }
  1490. /* ---- bg circles from splash.vue ---- */
  1491. .splash-overlay-bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; }
  1492. .bg-circle {
  1493. position: absolute;
  1494. border-radius: 50%;
  1495. opacity: 0.12;
  1496. }
  1497. .bg-circle-1 {
  1498. width: 400rpx; height: 400rpx;
  1499. background: #FF8C42;
  1500. top: -100rpx; right: -80rpx;
  1501. animation: splash-float-1 4s ease-in-out infinite;
  1502. }
  1503. .bg-circle-2 {
  1504. width: 280rpx; height: 280rpx;
  1505. background: #FF6B9D;
  1506. bottom: 80rpx; left: -60rpx;
  1507. animation: splash-float-2 5s ease-in-out infinite;
  1508. }
  1509. .bg-circle-3 {
  1510. width: 180rpx; height: 180rpx;
  1511. background: #6366F1;
  1512. top: 50%; right: -40rpx;
  1513. animation: splash-float-3 6s ease-in-out infinite;
  1514. }
  1515. @keyframes splash-float-1 {
  1516. 0%, 100% { transform: translateY(0) scale(1); }
  1517. 50% { transform: translateY(-30rpx) scale(1.05); }
  1518. }
  1519. @keyframes splash-float-2 {
  1520. 0%, 100% { transform: translateY(0) scale(1); }
  1521. 50% { transform: translateY(20rpx) scale(1.08); }
  1522. }
  1523. @keyframes splash-float-3 {
  1524. 0%, 100% { transform: translateY(0) rotate(0deg); }
  1525. 50% { transform: translateY(-20rpx) rotate(10deg); }
  1526. }
  1527. /* ---- body fade-in ---- */
  1528. .splash-overlay-body {
  1529. display: flex;
  1530. flex-direction: column;
  1531. align-items: center;
  1532. animation: splash-body-in 0.8s cubic-bezier(0.16,1,0.3,1) forwards;
  1533. }
  1534. @keyframes splash-body-in {
  1535. from { opacity: 0; transform: translateY(40rpx) scale(0.96); }
  1536. to { opacity: 1; transform: translateY(0) scale(1); }
  1537. }
  1538. /* ---- logo ---- */
  1539. .splash-logo-wrap {
  1540. width: 160rpx; height: 160rpx;
  1541. border-radius: 40rpx;
  1542. background: rgba(255,255,255,0.95);
  1543. display: flex; align-items: center; justify-content: center;
  1544. margin-bottom: 16rpx;
  1545. box-shadow: 0 8rpx 32rpx rgba(249,115,22,0.25);
  1546. animation: splash-logo-pulse 2.5s ease-in-out infinite;
  1547. }
  1548. @keyframes splash-logo-pulse {
  1549. 0%, 100% { box-shadow: 0 8rpx 32rpx rgba(249,115,22,0.25); }
  1550. 50% { box-shadow: 0 8rpx 48rpx rgba(249,115,22,0.45); }
  1551. }
  1552. .splash-logo-img { width: 100rpx; height: 100rpx; }
  1553. /* ---- brand ---- */
  1554. .splash-brand-name {
  1555. font-size: 64rpx; font-weight: 800;
  1556. color: #7C2D12;
  1557. letter-spacing: 10rpx;
  1558. margin-bottom: 2rpx;
  1559. }
  1560. .splash-brand-en {
  1561. font-size: 20rpx;
  1562. color: rgba(124,45,18,0.5);
  1563. letter-spacing: 6rpx;
  1564. margin-bottom: 30rpx;
  1565. }
  1566. .splash-tagline {
  1567. font-size: 26rpx;
  1568. color: rgba(124,45,18,0.7);
  1569. letter-spacing: 4rpx;
  1570. margin-top: 24rpx;
  1571. }
  1572. /* ---- dims row from splash.vue (rounded circles) ---- */
  1573. .splash-dims-row {
  1574. display: flex; flex-direction: row;
  1575. align-items: center; justify-content: center;
  1576. gap: 28rpx;
  1577. }
  1578. .splash-dim-item {
  1579. display: flex; flex-direction: column;
  1580. align-items: center; gap: 8rpx;
  1581. }
  1582. .splash-dim-circle {
  1583. width: 80rpx; height: 80rpx;
  1584. border-radius: 50%;
  1585. display: flex; align-items: center; justify-content: center;
  1586. }
  1587. .splash-dim-icon { font-size: 36rpx; line-height: 1; }
  1588. .splash-dim-label {
  1589. font-size: 22rpx; font-weight: 500;
  1590. color: rgba(124,45,18,0.75);
  1591. line-height: 1;
  1592. }
  1593. /* ---- staggered dim entry from splash.vue ---- */
  1594. .splash-dim-item:nth-child(1) { animation: splash-dim-in 0.5s ease 0.1s both; }
  1595. .splash-dim-item:nth-child(2) { animation: splash-dim-in 0.5s ease 0.2s both; }
  1596. .splash-dim-item:nth-child(3) { animation: splash-dim-in 0.5s ease 0.3s both; }
  1597. .splash-dim-item:nth-child(4) { animation: splash-dim-in 0.5s ease 0.4s both; }
  1598. .splash-dim-item:nth-child(5) { animation: splash-dim-in 0.5s ease 0.5s both; }
  1599. @keyframes splash-dim-in {
  1600. from { opacity: 0; transform: translateY(16rpx) scale(0.8); }
  1601. to { opacity: 1; transform: translateY(0) scale(1); }
  1602. }
  1603. /* ---- loading dots ---- */
  1604. .splash-overlay-loading {
  1605. position: absolute;
  1606. bottom: 120rpx;
  1607. left: 0; right: 0;
  1608. display: flex;
  1609. justify-content: center;
  1610. align-items: center;
  1611. gap: 12rpx;
  1612. }
  1613. .splash-overlay-dot {
  1614. width: 14rpx; height: 14rpx;
  1615. border-radius: 50%;
  1616. background: rgba(249,115,22,0.6);
  1617. animation: splash-dot-bounce 1.4s ease-in-out infinite both;
  1618. }
  1619. .splash-overlay-dot:nth-child(1) { animation-delay: -0.32s; }
  1620. .splash-overlay-dot:nth-child(2) { animation-delay: -0.16s; }
  1621. .splash-overlay-dot:nth-child(3) { animation-delay: 0s; }
  1622. @keyframes splash-dot-bounce {
  1623. 0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
  1624. 40% { transform: scale(1); opacity: 1; }
  1625. }
  1626. /* ---- 登录态内容布局 ---- */
  1627. .logged-in-container {
  1628. padding-bottom: 120rpx;
  1629. }
  1630. /* ===== 快捷功能入口(单排,6个横向排列) ===== */
  1631. .quick-bar {
  1632. display: flex;
  1633. flex-direction: row;
  1634. justify-content: space-between;
  1635. align-items: center;
  1636. background: #fff;
  1637. border-radius: 20rpx;
  1638. padding: 20rpx 10rpx;
  1639. }
  1640. .quick-item {
  1641. flex: 1;
  1642. display: flex;
  1643. flex-direction: column;
  1644. align-items: center;
  1645. gap: 8rpx;
  1646. }
  1647. .quick-icon {
  1648. width: 80rpx;
  1649. height: 80rpx;
  1650. border-radius: 20rpx;
  1651. display: flex;
  1652. align-items: center;
  1653. justify-content: center;
  1654. }
  1655. .quick-icon text {
  1656. font-size: 36rpx;
  1657. }
  1658. .quick-item .quick-label {
  1659. font-size: 26rpx;
  1660. color: #666;
  1661. }
  1662. /* ===== 我的任务快捷列表 ===== */
  1663. .task-quick-list {
  1664. display: flex;
  1665. flex-direction: column;
  1666. gap: 12rpx;
  1667. }
  1668. .task-quick-item {
  1669. display: flex;
  1670. flex-direction: row;
  1671. align-items: center;
  1672. justify-content: space-between;
  1673. background: #fff;
  1674. border-radius: 16rpx;
  1675. padding: 18rpx 24rpx;
  1676. box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.04);
  1677. }
  1678. .task-quick-info {
  1679. display: flex;
  1680. flex-direction: column;
  1681. min-width: 0;
  1682. flex: 1;
  1683. }
  1684. .task-quick-title {
  1685. font-size: 26rpx;
  1686. color: #333;
  1687. font-weight: 500;
  1688. line-height: 1.4;
  1689. }
  1690. .task-quick-meta {
  1691. font-size: 22rpx;
  1692. color: #F97316;
  1693. margin-top: 4rpx;
  1694. font-weight: bold;
  1695. }
  1696. .btn-quick-complete {
  1697. margin-left: 16rpx;
  1698. padding: 8rpx 24rpx;
  1699. background: linear-gradient(135deg, #F97316, #FB923C);
  1700. color: #fff;
  1701. font-size: 24rpx;
  1702. font-weight: bold;
  1703. border-radius: 20rpx;
  1704. border: none;
  1705. line-height: 1;
  1706. height: 44rpx;
  1707. flex-shrink: 0;
  1708. }
  1709. .btn-quick-complete::after {
  1710. border: none;
  1711. }
  1712. /* ===== 家庭挑战空态 ===== */
  1713. .challenge-empty {
  1714. display: flex;
  1715. flex-direction: column;
  1716. align-items: center;
  1717. padding: 40rpx 0 20rpx;
  1718. }
  1719. .challenge-empty-icon {
  1720. font-size: 64rpx;
  1721. margin-bottom: 12rpx;
  1722. line-height: 1;
  1723. }
  1724. .challenge-empty-text {
  1725. font-size: 26rpx;
  1726. color: #999;
  1727. margin-bottom: 20rpx;
  1728. }
  1729. .challenge-add-btn {
  1730. padding: 10rpx 32rpx;
  1731. background: linear-gradient(135deg, #F97316, #FB923C);
  1732. color: #fff;
  1733. font-size: 24rpx;
  1734. font-weight: bold;
  1735. border-radius: 24rpx;
  1736. border: none;
  1737. line-height: 1;
  1738. height: 48rpx;
  1739. }
  1740. .challenge-add-btn::after {
  1741. border: none;
  1742. }
  1743. </style>