mine.vue 52 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664
  1. <template>
  2. <view class="matchmaker-mine">
  3. <!-- 顶部导航栏 -->
  4. <view class="header">
  5. <view class="back-btn" @click="goBack"></view>
  6. <text class="header-title">我的</text>
  7. <view class="placeholder"></view>
  8. </view>
  9. <scroll-view scroll-y class="content">
  10. <view class="content-container">
  11. <!-- 个人信息卡片 -->
  12. <view class="profile-card">
  13. <view class="profile-header">
  14. <view class="profile-avatar" :style="{ backgroundImage: `url(${profile.avatarUrl})` }"></view>
  15. <view class="profile-info">
  16. <text class="profile-name">{{ profile.realName }}</text>
  17. <view class="profile-badge">{{ profile.badge }}</view>
  18. </view>
  19. </view>
  20. <!-- 等级和积分 -->
  21. <view class="level-points">
  22. <view class="level-info">
  23. <view class="level-icon"></view>
  24. <text class="level-name">{{ profile.levelName }}</text>
  25. </view>
  26. <text class="points-value">{{ profile.points }}</text>
  27. <text class="points-label">积分</text>
  28. </view>
  29. <!-- 等级进度 -->
  30. <view class="level-progress">
  31. <text class="progress-label">距离下一等级</text>
  32. <view class="progress-bar">
  33. <view class="progress-fill" :style="{ width: profile.levelProgress + '%' }"></view>
  34. </view>
  35. <view class="progress-values">
  36. <text class="current-value">当前{{ profile.points }}</text>
  37. <text class="target-value">目标{{ profile.nextLevelPoints }}</text>
  38. </view>
  39. <view class="upgrade-tip">再获得{{ profile.pointsToNextLevel }}积分即可晋升{{ profile.nextLevelName }}等级</view>
  40. </view>
  41. </view>
  42. <!-- 功能菜单 -->
  43. <view class="function-grid">
  44. <view class="function-item" @click="showSignInPopup">
  45. <view class="function-icon calendar">22</view>
  46. <text class="function-text">签到</text>
  47. </view>
  48. <view class="function-item" @click="handleMyResources">
  49. <view class="function-icon resources"></view>
  50. <text class="function-text">我的资源</text>
  51. </view>
  52. <view class="function-item" @click="handleActivityCenter">
  53. <view class="function-icon heart-book"></view>
  54. <text class="function-text">我的活动</text>
  55. </view>
  56. <view class="function-item" @click="handlePointsMall">
  57. <view class="function-icon money"></view>
  58. <text class="function-text">我的积分</text>
  59. </view>
  60. </view>
  61. <!-- 设置选项 -->
  62. <view class="settings-section">
  63. <view class="settings-item" @click="handleEditProfile">
  64. <view class="settings-icon user"></view>
  65. <text class="settings-text">编辑资料</text>
  66. <view class="arrow-right"></view>
  67. </view>
  68. <!-- 设置选项 -->
  69. <view class="settings-section">
  70. <view class="settings-item" @click="handleSuccessCaseUpload">
  71. <view class="settings-icon success-case"></view>
  72. <text class="settings-text">撮合成功审核</text>
  73. <view class="arrow-right"></view>
  74. </view>
  75. <view class="settings-item" @click="handleEditProfile">
  76. <view class="settings-icon user"></view>
  77. <text class="settings-text">编辑资料</text>
  78. <view class="arrow-right"></view>
  79. </view>
  80. <view class="settings-item" @click="handleAccountSettings">
  81. <view class="settings-icon info"></view>
  82. <text class="settings-text">关于我们</text>
  83. <view class="arrow-right"></view>
  84. </view>
  85. <view class="settings-item" @click="handleLogout">
  86. <view class="settings-icon logout"></view>
  87. <text class="settings-text">退出登录</text>
  88. <view class="arrow-right"></view>
  89. </view>
  90. </view>
  91. </view>
  92. </scroll-view>
  93. <!-- 底部导航 -->
  94. <view class="tabbar">
  95. <view class="tabbar-item home" @click="navigateToWorkbench">
  96. <view class="tabbar-icon"></view>
  97. <text class="tabbar-text">工作台</text>
  98. </view>
  99. <view class="tabbar-item resources" @click="navigateToMyResources">
  100. <view class="tabbar-icon"></view>
  101. <text class="tabbar-text">我的资源</text>
  102. </view>
  103. <view class="tabbar-item trophy" @click="navigateToRanking">
  104. <view class="tabbar-icon"></view>
  105. <text class="tabbar-text">排行榜</text>
  106. </view>
  107. <view class="tabbar-item message" @click="navigateToMessage">
  108. <view class="tabbar-icon">
  109. <view v-if="unreadCount > 0" class="badge">{{ unreadCount }}</view>
  110. </view>
  111. <text class="tabbar-text">消息</text>
  112. </view>
  113. <view class="tabbar-item mine active" @click="navigateToMine">
  114. <view class="tabbar-icon"></view>
  115. <text class="tabbar-text">我的</text>
  116. </view>
  117. </view>
  118. <!-- 签到弹框 -->
  119. <uni-popup ref="signInPopup" type="center" :mask-click="false">
  120. <view class="sign-in-popup">
  121. <view class="popup-header">
  122. <text class="popup-title">每日签到</text>
  123. <view class="close-btn" @click="closeSignInPopup"></view>
  124. </view>
  125. <view class="popup-content">
  126. <!-- 签到统计 -->
  127. <view class="checkin-stats">
  128. <view class="stats-item">
  129. <text class="stats-label">已连续签到</text>
  130. <text class="stats-value">{{ continuousDays }}</text>
  131. <text class="stats-unit">天</text>
  132. </view>
  133. <view class="stats-item">
  134. <text class="stats-label">累计签到</text>
  135. <text class="stats-value">{{ totalDays }}</text>
  136. <text class="stats-unit">天</text>
  137. </view>
  138. </view>
  139. <view class="calendar-container">
  140. <view class="calendar-header">
  141. <text class="calendar-title">{{ calendarTitle }}</text>
  142. </view>
  143. <view class="calendar-week">
  144. <text class="week-day">日</text>
  145. <text class="week-day">一</text>
  146. <text class="week-day">二</text>
  147. <text class="week-day">三</text>
  148. <text class="week-day">四</text>
  149. <text class="week-day">五</text>
  150. <text class="week-day">六</text>
  151. </view>
  152. <view class="calendar-days">
  153. <view
  154. v-for="(day, index) in calendarDays"
  155. :key="index"
  156. :class="[
  157. 'calendar-day',
  158. { 'other-month': !day.isCurrentMonth },
  159. { 'today': day.isToday },
  160. { 'checked': day.isChecked },
  161. { 'today-checked': day.isToday && day.isChecked }
  162. ]"
  163. >
  164. <text class="day-text">{{ day.date }}</text>
  165. <view v-if="day.isChecked" class="check-mark">✓</view>
  166. </view>
  167. </view>
  168. </view>
  169. <view class="sign-in-reward">
  170. <text class="reward-title">签到奖励</text>
  171. <text class="reward-points">+5积分</text>
  172. </view>
  173. </view>
  174. <view class="popup-footer">
  175. <button
  176. :class="['sign-in-btn', { 'signed': isSignedToday }]"
  177. @click="doSignIn"
  178. :disabled="isSignedToday"
  179. >
  180. {{ isSignedToday ? '今日已签到' : '立即签到' }}
  181. </button>
  182. </view>
  183. </view>
  184. </uni-popup>
  185. </view>
  186. </template>
  187. <script>
  188. import api from '../../utils/api.js'
  189. export default {
  190. data() {
  191. return {
  192. profile: {
  193. realName: '',
  194. avatarUrl: '',
  195. badge: '',
  196. rating: 5.0,
  197. level: '',
  198. levelName: '',
  199. nextLevelName: '',
  200. points: 0,
  201. currentLevelPoints: 0,
  202. nextLevelPoints: 100,
  203. pointsToNextLevel: 0,
  204. levelProgress: 0
  205. },
  206. // 签到相关
  207. isSignedToday: false,
  208. continuousDays: 0,
  209. totalDays: 0,
  210. currentDate: new Date(),
  211. calendarTitle: '',
  212. calendarDays: [],
  213. signedDays: [] // 存储本月已签到的日期
  214. }
  215. },
  216. onLoad() {
  217. this.loadProfileData()
  218. this.checkSignInStatus()
  219. this.generateCalendar()
  220. },
  221. onShow() {
  222. // 从编辑资料页返回时,自动刷新个人资料
  223. this.loadProfileData()
  224. },
  225. computed: {
  226. unreadCount() {
  227. return this.$store.getters.getTotalUnread || 0
  228. }
  229. },
  230. methods: {
  231. // 生成日历数据
  232. generateCalendar() {
  233. const date = this.currentDate || new Date()
  234. const year = date.getFullYear()
  235. const month = date.getMonth()
  236. // 设置日历标题
  237. this.calendarTitle = `${year}年·${month + 1}月`
  238. // 获取当月第一天
  239. const firstDay = new Date(year, month, 1)
  240. // 获取当月第一天是星期几(0-6,0表示周日)
  241. const firstDayWeek = firstDay.getDay()
  242. // 获取当月最后一天
  243. const lastDay = new Date(year, month + 1, 0)
  244. // 获取当月最后一天的日期
  245. const lastDayDate = lastDay.getDate()
  246. // 获取上个月最后一天的日期
  247. const prevMonthLastDay = new Date(year, month, 0).getDate()
  248. const days = []
  249. // 添加上个月的日期
  250. for (let i = firstDayWeek - 1; i >= 0; i--) {
  251. days.push({
  252. date: prevMonthLastDay - i,
  253. isCurrentMonth: false,
  254. isToday: false,
  255. isChecked: false
  256. })
  257. }
  258. // 添加当月的日期
  259. const today = new Date()
  260. const isCurrentMonth = today.getFullYear() === year && today.getMonth() === month
  261. for (let i = 1; i <= lastDayDate; i++) {
  262. const isToday = isCurrentMonth && today.getDate() === i
  263. // 检查该日期是否已签到
  264. const isChecked = isToday && this.isSignedToday || this.signedDays.includes(i)
  265. days.push({
  266. date: i,
  267. isCurrentMonth: true,
  268. isToday: isToday,
  269. isChecked: isChecked
  270. })
  271. }
  272. // 添加下个月的日期,补满6行
  273. const totalDays = 42 // 6行7列
  274. const nextMonthDays = totalDays - days.length
  275. for (let i = 1; i <= nextMonthDays; i++) {
  276. days.push({
  277. date: i,
  278. isCurrentMonth: false,
  279. isToday: false,
  280. isChecked: false
  281. })
  282. }
  283. this.calendarDays = days
  284. },
  285. // 加载个人资料数据
  286. async loadProfileData() {
  287. try {
  288. const userInfo = uni.getStorageSync('userInfo')
  289. console.log('从本地存储获取到的用户信息:', userInfo)
  290. // 模拟用户信息,用于测试
  291. const testUserId = 19
  292. const userId = userInfo && userInfo.userId ? userInfo.userId : testUserId
  293. console.log('使用的userId:', userId)
  294. // 调用API获取红娘信息
  295. console.log('开始调用API获取红娘信息...')
  296. const matchmakerInfo = await api.matchmaker.getByUserId(userId)
  297. console.log('API调用结果:', matchmakerInfo)
  298. if (matchmakerInfo) {
  299. const levelNames = ['', '青铜', '白银', '黄金', '铂金', '钻石']
  300. const currentLevel = matchmakerInfo.level || 1
  301. const nextLevel = currentLevel < 5 ? currentLevel + 1 : 5
  302. const nextLevelName = levelNames[nextLevel]
  303. const defaultAvatars = {
  304. male: 'http://115.190.125.125:9000/dynamic-comments/dynamics/5c645152-9940-41d3-83a9-69ee6e0c0aaa.png',
  305. female: 'http://115.190.125.125:9000/dynamic-comments/dynamics/c7fb04d7-ee4d-4b3d-bcef-f246da9c841f.png'
  306. }
  307. const avatarUrl = matchmakerInfo.avatarUrl || matchmakerInfo.avatar_url || (matchmakerInfo.gender === 1 ? defaultAvatars.male : defaultAvatars.female)
  308. console.log('获取到的红娘信息:', matchmakerInfo)
  309. this.profile = {
  310. realName: matchmakerInfo.real_name || '',
  311. avatarUrl: avatarUrl,
  312. badge: matchmakerInfo.type_name || '',
  313. rating: matchmakerInfo.rating || 5.0,
  314. level: currentLevel,
  315. levelName: matchmakerInfo.level_name || levelNames[currentLevel],
  316. nextLevelName: nextLevelName,
  317. points: matchmakerInfo.points || 0,
  318. currentLevelPoints: matchmakerInfo.current_level_points || 0,
  319. nextLevelPoints: matchmakerInfo.next_level_points || 100,
  320. pointsToNextLevel: matchmakerInfo.points_to_next_level || 0,
  321. levelProgress: matchmakerInfo.level_progress || 0
  322. }
  323. console.log('更新后的profile数据:', this.profile)
  324. } else {
  325. console.log('matchmakerInfo为空,无法更新profile数据')
  326. }
  327. } catch (error) {
  328. console.error('加载个人资料失败:', error)
  329. uni.showToast({
  330. title: '加载失败,请稍后重试: ' + error.message,
  331. icon: 'none'
  332. })
  333. }
  334. },
  335. // 返回上一页
  336. goBack() {
  337. uni.navigateBack()
  338. },
  339. // 检查今日是否已签到
  340. async checkSignInStatus() {
  341. try {
  342. const userInfo = uni.getStorageSync('userInfo')
  343. if (!userInfo || !userInfo.userId) {
  344. this.isSignedToday = false
  345. this.continuousDays = 0
  346. this.totalDays = 0
  347. this.signedDays = []
  348. console.warn('没有有效的userId,无法检查签到状态')
  349. return
  350. }
  351. // 首先获取红娘信息,以获取makerId
  352. const matchmakerInfo = await api.matchmaker.getByUserId(userInfo.userId)
  353. if (!matchmakerInfo || !matchmakerInfo.matchmakerId && !matchmakerInfo.matchmaker_id) {
  354. this.isSignedToday = false
  355. this.continuousDays = 0
  356. this.totalDays = 0
  357. this.signedDays = []
  358. console.warn('没有有效的makerId,无法检查签到状态')
  359. return
  360. }
  361. const makerId = matchmakerInfo.matchmakerId || matchmakerInfo.matchmaker_id
  362. // 检查今日是否已签到
  363. const res = await api.matchmaker.checkinStatus(makerId)
  364. console.log('检查签到状态返回结果:', res)
  365. let signed = false
  366. if (typeof res === 'boolean') {
  367. signed = res
  368. } else if (typeof res === 'string') {
  369. signed = res === 'true'
  370. } else if (typeof res === 'number') {
  371. signed = res === 1
  372. } else if (res && typeof res === 'object') {
  373. if (typeof res.todaySigned === 'boolean') signed = res.todaySigned
  374. else if (typeof res.signed === 'boolean') signed = res.signed
  375. else if (typeof res.isSignedToday === 'boolean') signed = res.isSignedToday
  376. else if (typeof res.data === 'object' && res.data) {
  377. if (typeof res.data.todaySigned === 'boolean') signed = res.data.todaySigned
  378. else if (typeof res.data.signed === 'boolean') signed = res.data.signed
  379. else if (typeof res.data.isSignedToday === 'boolean') signed = res.data.isSignedToday
  380. }
  381. }
  382. this.isSignedToday = !!signed
  383. // 获取签到统计
  384. const stats = await api.matchmaker.checkinStats(makerId)
  385. console.log('获取签到统计返回结果:', stats)
  386. // 初始化签到记录数组
  387. this.signedDays = []
  388. if (stats) {
  389. this.continuousDays = stats.continuousDays || 0
  390. this.totalDays = stats.totalDays || 0
  391. // 检查stats中是否包含本月的签到记录
  392. let signedDays = []
  393. // 情况1: stats直接包含signedDays数组
  394. if (stats.signedDays && Array.isArray(stats.signedDays)) {
  395. signedDays = stats.signedDays
  396. }
  397. // 情况2: stats.data包含signedDays数组
  398. else if (stats.data && stats.data.signedDays && Array.isArray(stats.data.signedDays)) {
  399. signedDays = stats.data.signedDays
  400. }
  401. // 情况3: stats是对象,直接包含日期属性
  402. else if (typeof stats === 'object') {
  403. // 处理stats对象
  404. const processStats = (obj) => {
  405. const days = []
  406. // 遍历对象,寻找日期相关的属性
  407. for (const key in obj) {
  408. if (obj.hasOwnProperty(key)) {
  409. // 检查是否是日期相关的属性
  410. const value = obj[key]
  411. // 检查是否是日期格式
  412. if (typeof value === 'object' && value !== null && typeof value.isChecked === 'boolean') {
  413. // 如果是包含isChecked属性的对象,且isChecked为true
  414. if (value.isChecked && typeof value.date === 'number') {
  415. days.push(value.date)
  416. }
  417. }
  418. }
  419. }
  420. return days
  421. }
  422. // 先处理stats对象本身
  423. signedDays = processStats(stats)
  424. // 如果stats.data存在,也处理一下
  425. if (stats.data && typeof stats.data === 'object') {
  426. signedDays = [...signedDays, ...processStats(stats.data)]
  427. }
  428. }
  429. // 检查签到状态响应中是否包含签到记录
  430. if (signedDays.length === 0 && res && typeof res === 'object') {
  431. const processRes = (obj) => {
  432. const days = []
  433. if (obj.signedDays && Array.isArray(obj.signedDays)) {
  434. days.push(...obj.signedDays)
  435. }
  436. return days
  437. }
  438. signedDays = processRes(res)
  439. if (res.data && typeof res.data === 'object') {
  440. signedDays = [...signedDays, ...processRes(res.data)]
  441. }
  442. }
  443. // 检查今日是否已签到,如果已签到但不在signedDays中,添加进去
  444. const today = new Date().getDate()
  445. if (this.isSignedToday && !signedDays.includes(today)) {
  446. signedDays.push(today)
  447. }
  448. // 去重并排序
  449. this.signedDays = [...new Set(signedDays)].sort((a, b) => a - b)
  450. }
  451. console.log('最终的signedDays:', this.signedDays)
  452. } catch (error) {
  453. console.error('检查签到状态失败:', error)
  454. this.isSignedToday = false
  455. this.continuousDays = 0
  456. this.totalDays = 0
  457. this.signedDays = []
  458. }
  459. },
  460. // 显示签到弹框
  461. async showSignInPopup() {
  462. // 显示弹窗前刷新签到状态和记录
  463. await this.checkSignInStatus()
  464. this.generateCalendar()
  465. this.$refs.signInPopup.open()
  466. },
  467. // 关闭签到弹框
  468. closeSignInPopup() {
  469. this.$refs.signInPopup.close()
  470. },
  471. // 执行签到
  472. async doSignIn() {
  473. try {
  474. const userInfo = uni.getStorageSync('userInfo')
  475. if (!userInfo || !userInfo.userId) {
  476. uni.showToast({
  477. title: '请先登录',
  478. icon: 'none'
  479. })
  480. setTimeout(() => {
  481. uni.navigateTo({
  482. url: '/pages/page3/page3'
  483. })
  484. }, 1000)
  485. return
  486. }
  487. // 使用userId进行签到(后端会根据userId查询matchmaker并添加积分)
  488. const res = await api.matchmaker.doCheckin(userInfo.userId)
  489. console.log('签到API返回结果:', res)
  490. // 判断签到结果
  491. let success = false
  492. let alreadySigned = false
  493. // 后端返回格式: { code: 200, msg: "签到成功", data: true/false }
  494. if (res === true) {
  495. success = true
  496. } else if (res === false) {
  497. alreadySigned = true
  498. } else if (res && typeof res === 'object') {
  499. if (res.data === true) {
  500. success = true
  501. } else if (res.data === false || res.msg === '今日已签到') {
  502. alreadySigned = true
  503. }
  504. }
  505. if (success) {
  506. uni.showToast({
  507. title: '签到成功,+5积分',
  508. icon: 'success'
  509. })
  510. this.isSignedToday = true
  511. // 更新签到记录
  512. const today = new Date()
  513. const todayDate = today.getDate()
  514. if (!this.signedDays.includes(todayDate)) {
  515. this.signedDays.push(todayDate)
  516. this.signedDays.sort((a, b) => a - b)
  517. }
  518. this.generateCalendar()
  519. // 刷新个人资料(包含积分)
  520. await this.loadProfileData()
  521. this.closeSignInPopup()
  522. } else if (alreadySigned) {
  523. this.isSignedToday = true
  524. uni.showToast({
  525. title: '今日已签到',
  526. icon: 'none'
  527. })
  528. } else {
  529. uni.showToast({
  530. title: '签到失败,请稍后重试',
  531. icon: 'none'
  532. })
  533. }
  534. } catch (error) {
  535. console.error('签到失败:', error)
  536. // 检查是否是已签到的错误
  537. if (error.msg && error.msg.includes('已签到')) {
  538. this.isSignedToday = true
  539. uni.showToast({
  540. title: '今日已签到',
  541. icon: 'none'
  542. })
  543. } else {
  544. uni.showToast({
  545. title: error.msg || '签到失败,请稍后重试',
  546. icon: 'none'
  547. })
  548. }
  549. }
  550. },
  551. // 签到(旧方法,保持兼容)
  552. handleSignIn() {
  553. this.showSignInPopup()
  554. },
  555. // 我的资源
  556. handleMyResources() {
  557. uni.navigateTo({
  558. url: '/pages/matchmaker-workbench/my-resources'
  559. })
  560. },
  561. // 我的活动
  562. handleActivityCenter() {
  563. uni.navigateTo({
  564. url: '/pages/matchmaker-workbench/my-activities'
  565. })
  566. },
  567. // 积分商城
  568. handlePointsMall() {
  569. uni.navigateTo({
  570. url: '/pages/matchmaker-workbench/points-mall'
  571. })
  572. },
  573. // 编辑资料
  574. handleEditProfile() {
  575. console.log('编辑资料')
  576. uni.navigateTo({
  577. url: '/pages/matchmaker-workbench/edit-profile'
  578. })
  579. },
  580. // 关于我们
  581. handleAccountSettings() {
  582. uni.navigateTo({
  583. url: '/pages/settings/about'
  584. })
  585. },
  586. // 退出登录
  587. handleLogout() {
  588. uni.showModal({
  589. title: '退出登录',
  590. content: '确定要退出登录吗?',
  591. success: (res) => {
  592. if (res.confirm) {
  593. uni.removeStorageSync('token')
  594. uni.removeStorageSync('userInfo')
  595. uni.navigateTo({
  596. url: '/pages/page3/page3'
  597. })
  598. }
  599. }
  600. })
  601. },
  602. // 导航到工作台
  603. navigateToWorkbench() {
  604. uni.navigateTo({
  605. url: '/pages/matchmaker-workbench/index'
  606. })
  607. },
  608. // 导航到我的资源
  609. navigateToMyResources() {
  610. uni.navigateTo({
  611. url: '/pages/matchmaker-workbench/my-resources'
  612. })
  613. },
  614. // 导航到排行榜
  615. navigateToRanking() {
  616. uni.navigateTo({
  617. url: '/pages/matchmaker-workbench/ranking'
  618. })
  619. },
  620. // 导航到消息
  621. navigateToMessage() {
  622. uni.navigateTo({
  623. url: '/pages/matchmaker-workbench/message'
  624. })
  625. },
  626. // 导航到我的
  627. navigateToMine() {
  628. // 已在我的页面,无需跳转
  629. }
  630. }
  631. }
  632. import api from '../../utils/api.js'
  633. export default {
  634. data() {
  635. return {
  636. profile: {
  637. realName: '',
  638. avatarUrl: '',
  639. badge: '',
  640. rating: 5.0,
  641. level: '',
  642. levelName: '',
  643. nextLevelName: '',
  644. points: 0,
  645. currentLevelPoints: 0,
  646. nextLevelPoints: 100,
  647. pointsToNextLevel: 0,
  648. levelProgress: 0
  649. },
  650. // 签到相关
  651. isSignedToday: false,
  652. continuousDays: 0,
  653. totalDays: 0,
  654. currentDate: new Date(),
  655. calendarTitle: '',
  656. calendarDays: []
  657. }
  658. },
  659. onLoad() {
  660. this.loadProfileData()
  661. this.checkSignInStatus()
  662. this.generateCalendar()
  663. },
  664. onShow() {
  665. // 从编辑资料页返回时,自动刷新个人资料
  666. this.loadProfileData()
  667. },
  668. computed: {
  669. unreadCount() {
  670. return this.$store.getters.getTotalUnread || 0
  671. }
  672. },
  673. methods: {
  674. // 生成日历数据
  675. generateCalendar() {
  676. const date = this.currentDate || new Date()
  677. const year = date.getFullYear()
  678. const month = date.getMonth()
  679. // 设置日历标题
  680. this.calendarTitle = `${year}年·${month + 1}月`
  681. // 获取当月第一天
  682. const firstDay = new Date(year, month, 1)
  683. // 获取当月第一天是星期几(0-6,0表示周日)
  684. const firstDayWeek = firstDay.getDay()
  685. // 获取当月最后一天
  686. const lastDay = new Date(year, month + 1, 0)
  687. // 获取当月最后一天的日期
  688. const lastDayDate = lastDay.getDate()
  689. // 获取上个月最后一天的日期
  690. const prevMonthLastDay = new Date(year, month, 0).getDate()
  691. const days = []
  692. // 添加上个月的日期
  693. for (let i = firstDayWeek - 1; i >= 0; i--) {
  694. days.push({
  695. date: prevMonthLastDay - i,
  696. isCurrentMonth: false,
  697. isToday: false,
  698. isChecked: false
  699. })
  700. }
  701. // 添加当月的日期
  702. const today = new Date()
  703. const isCurrentMonth = today.getFullYear() === year && today.getMonth() === month
  704. for (let i = 1; i <= lastDayDate; i++) {
  705. const isToday = isCurrentMonth && today.getDate() === i
  706. days.push({
  707. date: i,
  708. isCurrentMonth: true,
  709. isToday: isToday,
  710. isChecked: isToday && this.isSignedToday
  711. })
  712. }
  713. // 添加下个月的日期,补满6行
  714. const totalDays = 42 // 6行7列
  715. const nextMonthDays = totalDays - days.length
  716. for (let i = 1; i <= nextMonthDays; i++) {
  717. days.push({
  718. date: i,
  719. isCurrentMonth: false,
  720. isToday: false,
  721. isChecked: false
  722. })
  723. }
  724. this.calendarDays = days
  725. },
  726. // 加载个人资料数据
  727. async loadProfileData() {
  728. try {
  729. const userInfo = uni.getStorageSync('userInfo')
  730. console.log('从本地存储获取到的用户信息:', userInfo)
  731. // 模拟用户信息,用于测试
  732. const testUserId = 19
  733. const userId = userInfo && userInfo.userId ? userInfo.userId : testUserId
  734. console.log('使用的userId:', userId)
  735. // 调用API获取红娘信息
  736. console.log('开始调用API获取红娘信息...')
  737. const matchmakerInfo = await api.matchmaker.getByUserId(userId)
  738. console.log('API调用结果:', matchmakerInfo)
  739. if (matchmakerInfo) {
  740. const levelNames = ['', '青铜', '白银', '黄金', '铂金', '钻石']
  741. const currentLevel = matchmakerInfo.level || 1
  742. const nextLevel = currentLevel < 5 ? currentLevel + 1 : 5
  743. const nextLevelName = levelNames[nextLevel]
  744. const defaultAvatars = {
  745. male: 'http://115.190.125.125:9000/dynamic-comments/dynamics/5c645152-9940-41d3-83a9-69ee6e0c0aaa.png',
  746. female: 'http://115.190.125.125:9000/dynamic-comments/dynamics/c7fb04d7-ee4d-4b3d-bcef-f246da9c841f.png'
  747. }
  748. const avatarUrl = matchmakerInfo.gender === 1 ? defaultAvatars.male : defaultAvatars.female
  749. console.log('获取到的红娘信息:', matchmakerInfo)
  750. this.profile = {
  751. realName: matchmakerInfo.real_name || '',
  752. avatarUrl: avatarUrl,
  753. badge: matchmakerInfo.type_name || '',
  754. rating: matchmakerInfo.rating || 5.0,
  755. level: currentLevel,
  756. levelName: matchmakerInfo.level_name || levelNames[currentLevel],
  757. nextLevelName: nextLevelName,
  758. points: matchmakerInfo.points || 0,
  759. currentLevelPoints: matchmakerInfo.current_level_points || 0,
  760. nextLevelPoints: matchmakerInfo.next_level_points || 100,
  761. pointsToNextLevel: matchmakerInfo.points_to_next_level || 0,
  762. levelProgress: matchmakerInfo.level_progress || 0
  763. }
  764. console.log('更新后的profile数据:', this.profile)
  765. } else {
  766. console.log('matchmakerInfo为空,无法更新profile数据')
  767. }
  768. } catch (error) {
  769. console.error('加载个人资料失败:', error)
  770. uni.showToast({
  771. title: '加载失败,请稍后重试: ' + error.message,
  772. icon: 'none'
  773. })
  774. }
  775. },
  776. // 返回上一页
  777. goBack() {
  778. uni.navigateBack()
  779. },
  780. // 检查今日是否已签到
  781. async checkSignInStatus() {
  782. try {
  783. const userInfo = uni.getStorageSync('userInfo')
  784. const userId = userInfo && userInfo.userId ? userInfo.userId : null
  785. if (userId) {
  786. const res = await api.matchmaker.checkinStatus(userId)
  787. console.log('检查签到状态返回结果:', res)
  788. let signed = false
  789. if (typeof res === 'boolean') {
  790. signed = res
  791. } else if (typeof res === 'string') {
  792. signed = res === 'true'
  793. } else if (typeof res === 'number') {
  794. signed = res === 1
  795. } else if (res && typeof res === 'object') {
  796. if (typeof res.todaySigned === 'boolean') signed = res.todaySigned
  797. else if (typeof res.signed === 'boolean') signed = res.signed
  798. else if (typeof res.isSignedToday === 'boolean') signed = res.isSignedToday
  799. else if (typeof res.data === 'object' && res.data) {
  800. if (typeof res.data.todaySigned === 'boolean') signed = res.data.todaySigned
  801. else if (typeof res.data.signed === 'boolean') signed = res.data.signed
  802. else if (typeof res.data.isSignedToday === 'boolean') signed = res.data.isSignedToday
  803. }
  804. }
  805. this.isSignedToday = !!signed
  806. const stats = await api.matchmaker.checkinStats(userId)
  807. console.log('获取签到统计返回结果:', stats)
  808. if (stats) {
  809. this.continuousDays = stats.continuousDays || 0
  810. this.totalDays = stats.totalDays || 0
  811. }
  812. } else {
  813. this.isSignedToday = false
  814. this.continuousDays = 0
  815. this.totalDays = 0
  816. console.warn('没有有效的userId,无法检查签到状态')
  817. }
  818. } catch (error) {
  819. console.error('检查签到状态失败:', error)
  820. this.isSignedToday = false
  821. this.continuousDays = 0
  822. this.totalDays = 0
  823. }
  824. },
  825. // 显示签到弹框
  826. showSignInPopup() {
  827. this.$refs.signInPopup.open()
  828. },
  829. // 关闭签到弹框
  830. closeSignInPopup() {
  831. this.$refs.signInPopup.close()
  832. },
  833. // 执行签到
  834. async doSignIn() {
  835. try {
  836. const userInfo = uni.getStorageSync('userInfo')
  837. const userId = userInfo && userInfo.userId ? userInfo.userId : null
  838. if (userId) {
  839. const res = await api.matchmaker.doCheckin(userId)
  840. console.log('签到API返回结果:', res)
  841. let success = false
  842. let alreadySigned = false
  843. if (typeof res === 'boolean') {
  844. success = res
  845. } else if (typeof res === 'string') {
  846. success = res === 'true' || res === 'ok' || res === 'success'
  847. } else if (res && typeof res === 'object') {
  848. if (typeof res.success === 'boolean') success = res.success
  849. if (typeof res.todaySigned === 'boolean') alreadySigned = res.todaySigned
  850. else if (typeof res.signed === 'boolean') alreadySigned = res.signed
  851. else if (typeof res.isSignedToday === 'boolean') alreadySigned = res.isSignedToday
  852. if (res.data && typeof res.data === 'object') {
  853. if (typeof res.data.success === 'boolean') success = res.data.success
  854. if (typeof res.data.todaySigned === 'boolean') alreadySigned = res.data.todaySigned
  855. else if (typeof res.data.signed === 'boolean') alreadySigned = res.data.signed
  856. else if (typeof res.data.isSignedToday === 'boolean') alreadySigned = res.data.isSignedToday
  857. }
  858. }
  859. if (success) {
  860. uni.showToast({
  861. title: '签到成功',
  862. icon: 'success'
  863. })
  864. this.isSignedToday = true
  865. this.generateCalendar()
  866. this.loadProfileData()
  867. this.closeSignInPopup()
  868. } else if (alreadySigned) {
  869. uni.showToast({
  870. title: '今日已签到',
  871. icon: 'none'
  872. })
  873. } else {
  874. uni.showToast({
  875. title: '签到失败,请稍后重试',
  876. icon: 'none'
  877. })
  878. }
  879. } else {
  880. uni.showToast({
  881. title: '请先登录',
  882. icon: 'none'
  883. })
  884. setTimeout(() => {
  885. uni.navigateTo({
  886. url: '/pages/page3/page3'
  887. })
  888. }, 1000)
  889. }
  890. } catch (error) {
  891. console.error('签到失败:', error)
  892. uni.showToast({
  893. title: error.msg || '签到失败,请稍后重试',
  894. icon: 'none'
  895. })
  896. }
  897. },
  898. // 签到(旧方法,保持兼容)
  899. handleSignIn() {
  900. this.showSignInPopup()
  901. },
  902. // 我的资源
  903. handleMyResources() {
  904. uni.navigateTo({
  905. url: '/pages/matchmaker-workbench/my-resources'
  906. })
  907. },
  908. // 活动中心
  909. handleActivityCenter() {
  910. uni.navigateTo({
  911. url: '/pages/activities/list'
  912. })
  913. },
  914. // 积分商城
  915. handlePointsMall() {
  916. console.log('积分商城')
  917. uni.showToast({
  918. title: '积分商城开发中',
  919. icon: 'none'
  920. })
  921. },
  922. // 撮合成功审核
  923. handleSuccessCaseUpload() {
  924. console.log('撮合成功审核')
  925. uni.navigateTo({
  926. url: '/pages/matchmaker-workbench/success-case-upload'
  927. })
  928. },
  929. // 编辑资料
  930. handleEditProfile() {
  931. console.log('编辑资料')
  932. uni.navigateTo({
  933. url: '/pages/matchmaker-workbench/edit-profile'
  934. })
  935. },
  936. // 账户设置
  937. handleAccountSettings() {
  938. console.log('账户设置')
  939. uni.showToast({
  940. title: '账户设置开发中',
  941. icon: 'none'
  942. })
  943. },
  944. // 退出登录
  945. handleLogout() {
  946. uni.showModal({
  947. title: '退出登录',
  948. content: '确定要退出登录吗?',
  949. success: (res) => {
  950. if (res.confirm) {
  951. uni.removeStorageSync('token')
  952. uni.removeStorageSync('userInfo')
  953. uni.navigateTo({
  954. url: '/pages/page3/page3'
  955. })
  956. }
  957. }
  958. })
  959. },
  960. // 导航到工作台
  961. navigateToWorkbench() {
  962. uni.navigateTo({
  963. url: '/pages/matchmaker-workbench/index'
  964. })
  965. },
  966. // 导航到我的资源
  967. navigateToMyResources() {
  968. uni.navigateTo({
  969. url: '/pages/matchmaker-workbench/my-resources'
  970. })
  971. },
  972. // 导航到排行榜
  973. navigateToRanking() {
  974. uni.navigateTo({
  975. url: '/pages/matchmaker-workbench/ranking'
  976. })
  977. },
  978. // 导航到消息
  979. navigateToMessage() {
  980. uni.navigateTo({
  981. url: '/pages/matchmaker-workbench/message'
  982. })
  983. },
  984. // 导航到我的
  985. navigateToMine() {
  986. // 已在我的页面,无需跳转
  987. }
  988. }
  989. }
  990. </script>
  991. <style lang="scss" scoped>
  992. .matchmaker-mine {
  993. min-height: 100vh;
  994. background: #FFF9F9;
  995. display: flex;
  996. flex-direction: column;
  997. }
  998. /* 顶部导航栏 */
  999. .header {
  1000. display: flex;
  1001. align-items: center;
  1002. justify-content: space-between;
  1003. padding: 25rpx 30rpx;
  1004. padding-top: calc(25rpx + env(safe-area-inset-top));
  1005. background: #FFF9F9;
  1006. border-bottom: 1rpx solid #F0F0F0;
  1007. .back-btn {
  1008. width: 70rpx;
  1009. height: 70rpx;
  1010. display: flex;
  1011. align-items: center;
  1012. justify-content: center;
  1013. background: rgba(240, 240, 240, 0.5);
  1014. border-radius: 50%;
  1015. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23333"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"/></svg>');
  1016. background-size: 40rpx 40rpx;
  1017. background-repeat: no-repeat;
  1018. background-position: center;
  1019. }
  1020. .header-title {
  1021. font-size: 38rpx;
  1022. font-weight: bold;
  1023. color: #333;
  1024. }
  1025. .placeholder {
  1026. width: 70rpx;
  1027. }
  1028. }
  1029. .content {
  1030. flex: 1;
  1031. padding: 0;
  1032. }
  1033. .content-container {
  1034. padding: 20rpx 30rpx 120rpx;
  1035. }
  1036. /* 个人信息卡片 */
  1037. .profile-card {
  1038. background: linear-gradient(135deg, #FFEBEE 0%, #FFCDD2 100%);
  1039. border-radius: 25rpx;
  1040. padding: 35rpx;
  1041. margin-bottom: 25rpx;
  1042. box-shadow: 0 4rpx 15rpx rgba(0, 0, 0, 0.1);
  1043. }
  1044. .profile-header {
  1045. display: flex;
  1046. align-items: center;
  1047. margin-bottom: 30rpx;
  1048. .profile-avatar {
  1049. width: 160rpx;
  1050. height: 160rpx;
  1051. border-radius: 50%;
  1052. background-size: cover;
  1053. background-repeat: no-repeat;
  1054. background-position: center;
  1055. margin-right: 25rpx;
  1056. border: 2rpx solid #FFF;
  1057. box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.1);
  1058. }
  1059. .profile-info {
  1060. flex: 1;
  1061. .profile-name {
  1062. display: block;
  1063. font-size: 36rpx;
  1064. font-weight: bold;
  1065. color: #333;
  1066. margin-bottom: 10rpx;
  1067. }
  1068. .profile-badge {
  1069. display: inline-block;
  1070. background: #FFD700;
  1071. color: #FFFFFF;
  1072. font-size: 24rpx;
  1073. font-weight: bold;
  1074. padding: 6rpx 16rpx;
  1075. border-radius: 15rpx;
  1076. margin-bottom: 10rpx;
  1077. }
  1078. .profile-rating {
  1079. display: block;
  1080. font-size: 28rpx;
  1081. color: #666;
  1082. }
  1083. }
  1084. }
  1085. /* 等级和积分 */
  1086. .level-points {
  1087. display: flex;
  1088. align-items: center;
  1089. justify-content: space-between;
  1090. margin-bottom: 30rpx;
  1091. .level-info {
  1092. display: flex;
  1093. align-items: center;
  1094. gap: 10rpx;
  1095. .level-icon {
  1096. width: 44rpx;
  1097. height: 44rpx;
  1098. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FFD700"><path d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"/></svg>');
  1099. background-size: contain;
  1100. background-repeat: no-repeat;
  1101. background-position: center;
  1102. }
  1103. .level-name {
  1104. font-size: 32rpx;
  1105. font-weight: bold;
  1106. color: #FF9800;
  1107. }
  1108. }
  1109. .points-value {
  1110. font-size: 48rpx;
  1111. font-weight: bold;
  1112. color: #E91E63;
  1113. }
  1114. .points-label {
  1115. font-size: 28rpx;
  1116. color: #666;
  1117. }
  1118. }
  1119. /* 等级进度 */
  1120. .level-progress {
  1121. .progress-label {
  1122. display: block;
  1123. font-size: 26rpx;
  1124. color: #333;
  1125. margin-bottom: 15rpx;
  1126. }
  1127. .progress-bar {
  1128. width: 100%;
  1129. height: 12rpx;
  1130. background: rgba(255, 255, 255, 0.5);
  1131. border-radius: 6rpx;
  1132. margin-bottom: 10rpx;
  1133. .progress-fill {
  1134. height: 100%;
  1135. background: #FFB74D;
  1136. border-radius: 6rpx;
  1137. }
  1138. }
  1139. .progress-values {
  1140. display: flex;
  1141. justify-content: space-between;
  1142. margin-bottom: 15rpx;
  1143. .current-value,
  1144. .target-value {
  1145. font-size: 24rpx;
  1146. color: #666;
  1147. }
  1148. }
  1149. .upgrade-tip {
  1150. display: block;
  1151. background: rgba(255, 255, 255, 0.3);
  1152. color: #E91E63;
  1153. font-size: 26rpx;
  1154. font-weight: bold;
  1155. padding: 15rpx;
  1156. border-radius: 15rpx;
  1157. text-align: center;
  1158. }
  1159. }
  1160. /* 功能菜单 */
  1161. .function-grid {
  1162. display: grid;
  1163. grid-template-columns: repeat(4, 1fr);
  1164. gap: 25rpx;
  1165. padding: 35rpx;
  1166. background: #FFFFFF;
  1167. border-radius: 20rpx;
  1168. margin-bottom: 20rpx;
  1169. box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
  1170. .function-item {
  1171. display: flex;
  1172. flex-direction: column;
  1173. align-items: center;
  1174. gap: 15rpx;
  1175. .function-icon {
  1176. width: 90rpx;
  1177. height: 90rpx;
  1178. border-radius: 50%;
  1179. background-size: 50rpx 50rpx;
  1180. background-repeat: no-repeat;
  1181. background-position: center;
  1182. &.calendar {
  1183. background-color: #FFF3E0;
  1184. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FF9800"><path d="M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-3 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"/></svg>');
  1185. display: flex;
  1186. align-items: center;
  1187. justify-content: center;
  1188. font-size: 32rpx;
  1189. font-weight: bold;
  1190. color: #FF9800;
  1191. }
  1192. &.resources {
  1193. background-color: #E8F5E9;
  1194. background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%234CAF50"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>');
  1195. }
  1196. &.heart-book {
  1197. background-color: #FFEBEE;
  1198. background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23F44336"><path d="M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-3 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"/></svg>');
  1199. }
  1200. &.money {
  1201. background-color: #F3E5F5;
  1202. background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12.9-1.63h7.45c.75 0 1.41-.41 1.75-1.03l3.58-6.49c.08-.14.12-.31.12-.48 0-.55-.45-1-1-1H5.21l-.94-2H1zm16 16c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2z"/></svg>');
  1203. }
  1204. }
  1205. .function-text {
  1206. font-size: 26rpx;
  1207. color: #333;
  1208. }
  1209. }
  1210. }
  1211. /* 设置选项 */
  1212. .settings-section {
  1213. background: #FFFFFF;
  1214. border-radius: 20rpx;
  1215. padding: 0;
  1216. box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
  1217. .settings-item {
  1218. display: flex;
  1219. align-items: center;
  1220. justify-content: space-between;
  1221. padding: 25rpx 35rpx;
  1222. margin-bottom: 0;
  1223. background: #FFFFFF;
  1224. border-radius: 20rpx;
  1225. &:last-child {
  1226. margin-bottom: 0;
  1227. }
  1228. .settings-icon {
  1229. width: 44rpx;
  1230. height: 44rpx;
  1231. background-size: contain;
  1232. background-repeat: no-repeat;
  1233. background-position: center;
  1234. margin-right: 20rpx;
  1235. }
  1236. .settings-icon.user {
  1237. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>');
  1238. }
  1239. .settings-icon.gear {
  1240. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M19.14 12.94c.04-.3.06-.61.06-.94 0-.32-.02-.64-.07-.94l2.03-1.58c.18-.14.23-.41.12-.61l-1.92-3.32c-.12-.22-.37-.29-.59-.22l-2.39.96c-.5-.38-1.03-.7-1.62-.94l-.36-2.54c-.04-.24-.24-.41-.48-.41h-3.84c-.24 0-.43.17-.47.41l-.36 2.54c-.59.24-1.13.57-1.62.94l-2.39-.96c-.22-.08-.47 0-.59.22L2.74 8.87c-.12.21-.08.47.12.61l2.03 1.58c-.05.3-.09.63-.09.94s.02.64.07.94l-2.03 1.58c-.18.14-.23.41-.12.61l1.92 3.32c.12.22.37.29.59.22l2.39-.96c.5.38 1.03.7 1.62.94l.36 2.54c.05.24.24.41.48.41h3.84c.24 0 .44-.17.47-.41l.36-2.54c.59-.24 1.13-.56 1.62-.94l2.39.96c.22.08.47 0 .59-.22l1.92-3.32c.12-.22.07-.47-.12-.61l-2.01-1.58zM12 15.6c-1.98 0-3.6-1.62-3.6-3.6s1.62-3.6 3.6-3.6 3.6 1.62 3.6 3.6-1.62 3.6-3.6 3.6z"/></svg>');
  1241. }
  1242. .settings-icon.logout {
  1243. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M17 7l-1.41 1.41L18.17 11H8v2h10.17l-2.58 2.58L17 17l5-5zM4 5h8V3H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h8v-2H4V5z"/></svg>');
  1244. }
  1245. .settings-icon.info {
  1246. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z"/></svg>');
  1247. }
  1248. .settings-text {
  1249. flex: 1;
  1250. font-size: 30rpx;
  1251. color: #333;
  1252. }
  1253. .settings-icon.success-case {
  1254. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23E91E63"><path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/></svg>');
  1255. }
  1256. .settings-text {
  1257. flex: 1;
  1258. font-size: 30rpx;
  1259. color: #333;
  1260. }
  1261. .arrow-right {
  1262. width: 24rpx;
  1263. height: 24rpx;
  1264. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23999"><path d="M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"/></svg>');
  1265. background-size: contain;
  1266. background-repeat: no-repeat;
  1267. background-position: center;
  1268. }
  1269. }
  1270. }
  1271. /* 底部导航 */
  1272. .tabbar {
  1273. position: fixed;
  1274. bottom: 0;
  1275. left: 0;
  1276. right: 0;
  1277. height: 100rpx;
  1278. background: #FFFFFF;
  1279. border-top: 1rpx solid #F0F0F0;
  1280. display: flex;
  1281. justify-content: space-around;
  1282. align-items: center;
  1283. padding-bottom: env(safe-area-inset-bottom);
  1284. .tabbar-item {
  1285. display: flex;
  1286. flex-direction: column;
  1287. align-items: center;
  1288. gap: 8rpx;
  1289. padding: 10rpx 0;
  1290. .tabbar-icon {
  1291. width: 44rpx;
  1292. height: 44rpx;
  1293. background-size: contain;
  1294. background-repeat: no-repeat;
  1295. background-position: center;
  1296. position: relative;
  1297. .badge {
  1298. position: absolute;
  1299. top: -8rpx;
  1300. right: -8rpx;
  1301. background: #FF4444;
  1302. color: #FFFFFF;
  1303. font-size: 20rpx;
  1304. font-weight: bold;
  1305. width: 32rpx;
  1306. height: 32rpx;
  1307. display: flex;
  1308. align-items: center;
  1309. justify-content: center;
  1310. border-radius: 16rpx;
  1311. }
  1312. }
  1313. .tabbar-text {
  1314. font-size: 20rpx;
  1315. color: #999;
  1316. }
  1317. &.active {
  1318. .tabbar-text {
  1319. color: #9C27B0;
  1320. font-weight: bold;
  1321. }
  1322. }
  1323. &.home .tabbar-icon {
  1324. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23999"><path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"/></svg>');
  1325. }
  1326. &.active.home .tabbar-icon {
  1327. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M10 20v-6h4v6h5v-8h3L12 3 2 12h3v8z"/></svg>');
  1328. }
  1329. &.resources .tabbar-icon {
  1330. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23999"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>');
  1331. }
  1332. &.active.resources .tabbar-icon {
  1333. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3zm-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3zm0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5zm8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5z"/></svg>');
  1334. }
  1335. &.trophy .tabbar-icon {
  1336. background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23999"><path d="M19 5h-2V3H7v2H5c-1.1 0-2 .9-2 2v1c0 2.55 1.92 4.63 4.39 4.94.63 1.5 1.98 2.63 3.61 2.96V19H7v2h10v-2h-4v-3.1c1.63-.33 2.98-1.46 3.61-2.96C19.08 12.63 21 10.55 21 8V7c0-1.1-.9-2-2-2zM5 8V7h2v3.82C5.84 10.4 5 9.3 5 8zm14 0c0 1.3-.84 2.4-2 2.82V7h2v1z"/></svg>');
  1337. }
  1338. &.active.trophy .tabbar-icon {
  1339. background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M19 5h-2V3H7v2H5c-1.1 0-2 .9-2 2v1c0 2.55 1.92 4.63 4.39 4.94.63 1.5 1.98 2.63 3.61 2.96V19H7v2h10v-2h-4v-3.1c1.63-.33 2.98-1.46 3.61-2.96C19.08 12.63 21 10.55 21 8V7c0-1.1-.9-2-2-2zM5 8V7h2v3.82C5.84 10.4 5 9.3 5 8zm14 0c0 1.3-.84 2.4-2 2.82V7h2v1z"/></svg>');
  1340. }
  1341. &.message .tabbar-icon {
  1342. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23999"><path d="M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z"/></svg>');
  1343. }
  1344. &.active.message .tabbar-icon {
  1345. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z"/></svg>');
  1346. }
  1347. &.mine .tabbar-icon {
  1348. background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23999"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>');
  1349. }
  1350. &.mine.active .tabbar-icon {
  1351. background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%239C27B0"><path d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"/></svg>');
  1352. }
  1353. }
  1354. }
  1355. /* 签到弹框样式 */
  1356. .sign-in-popup {
  1357. width: 600rpx;
  1358. background: #FFFFFF;
  1359. border-radius: 20rpx;
  1360. overflow: hidden;
  1361. .popup-header {
  1362. display: flex;
  1363. justify-content: space-between;
  1364. align-items: center;
  1365. padding: 30rpx;
  1366. background: #FFEBEE;
  1367. border-bottom: none;
  1368. .popup-title {
  1369. font-size: 36rpx;
  1370. font-weight: bold;
  1371. color: #E91E63;
  1372. }
  1373. .close-btn {
  1374. width: 40rpx;
  1375. height: 40rpx;
  1376. background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23E91E63"><path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/></svg>');
  1377. background-size: contain;
  1378. background-repeat: no-repeat;
  1379. background-position: center;
  1380. }
  1381. }
  1382. .popup-content {
  1383. padding: 20rpx 30rpx 30rpx;
  1384. /* 签到统计 */
  1385. .checkin-stats {
  1386. display: flex;
  1387. justify-content: space-around;
  1388. margin-bottom: 30rpx;
  1389. padding: 20rpx;
  1390. background: #FFF3E0;
  1391. border-radius: 15rpx;
  1392. .stats-item {
  1393. display: flex;
  1394. flex-direction: column;
  1395. align-items: center;
  1396. gap: 10rpx;
  1397. .stats-label {
  1398. font-size: 24rpx;
  1399. color: #666;
  1400. }
  1401. .stats-value {
  1402. font-size: 48rpx;
  1403. font-weight: bold;
  1404. color: #E91E63;
  1405. }
  1406. .stats-unit {
  1407. font-size: 24rpx;
  1408. color: #666;
  1409. }
  1410. }
  1411. }
  1412. .calendar-container {
  1413. background: #FFFFFF;
  1414. border-radius: 15rpx;
  1415. padding: 20rpx;
  1416. margin-bottom: 30rpx;
  1417. box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
  1418. .calendar-header {
  1419. display: flex;
  1420. justify-content: center;
  1421. align-items: center;
  1422. margin-bottom: 20rpx;
  1423. .calendar-title {
  1424. font-size: 28rpx;
  1425. font-weight: bold;
  1426. color: #333;
  1427. }
  1428. }
  1429. .calendar-week {
  1430. display: grid;
  1431. grid-template-columns: repeat(7, 1fr);
  1432. gap: 10rpx;
  1433. margin-bottom: 20rpx;
  1434. .week-day {
  1435. text-align: center;
  1436. font-size: 24rpx;
  1437. color: #999;
  1438. font-weight: bold;
  1439. }
  1440. }
  1441. .calendar-days {
  1442. display: grid;
  1443. grid-template-columns: repeat(7, 1fr);
  1444. gap: 15rpx;
  1445. .calendar-day {
  1446. text-align: center;
  1447. font-size: 28rpx;
  1448. color: #333;
  1449. background: #F5F5F5;
  1450. border-radius: 8rpx;
  1451. height: 70rpx;
  1452. display: flex;
  1453. flex-direction: column;
  1454. align-items: center;
  1455. justify-content: center;
  1456. position: relative;
  1457. &.other-month {
  1458. color: #CCCCCC;
  1459. background: #F9F9F9;
  1460. }
  1461. &.today {
  1462. background: #FFF3E0;
  1463. color: #FF9800;
  1464. font-weight: bold;
  1465. }
  1466. &.checked {
  1467. background: #FFCDD2;
  1468. color: #E91E63;
  1469. font-weight: bold;
  1470. }
  1471. &.today-checked {
  1472. background: #E91E63;
  1473. color: #FFFFFF;
  1474. font-weight: bold;
  1475. }
  1476. .check-mark {
  1477. position: absolute;
  1478. bottom: 5rpx;
  1479. right: 5rpx;
  1480. font-size: 18rpx;
  1481. color: #FFFFFF;
  1482. background: #E91E63;
  1483. border-radius: 50%;
  1484. width: 24rpx;
  1485. height: 24rpx;
  1486. display: flex;
  1487. align-items: center;
  1488. justify-content: center;
  1489. }
  1490. .today-checked .check-mark {
  1491. background: #FFFFFF;
  1492. color: #E91E63;
  1493. }
  1494. }
  1495. }
  1496. }
  1497. .sign-in-reward {
  1498. display: flex;
  1499. flex-direction: column;
  1500. align-items: center;
  1501. gap: 10rpx;
  1502. .reward-title {
  1503. font-size: 28rpx;
  1504. color: #666;
  1505. }
  1506. .reward-points {
  1507. font-size: 48rpx;
  1508. font-weight: bold;
  1509. color: #E91E63;
  1510. }
  1511. }
  1512. }
  1513. .popup-footer {
  1514. padding: 0 30rpx 30rpx;
  1515. .sign-in-btn {
  1516. width: 100%;
  1517. height: 80rpx;
  1518. background: #E91E63;
  1519. color: #FFFFFF;
  1520. font-size: 32rpx;
  1521. border-radius: 40rpx;
  1522. border: none;
  1523. font-weight: bold;
  1524. transition: all 0.3s;
  1525. &:hover {
  1526. background: #C2185B;
  1527. }
  1528. &.signed {
  1529. background: #E0E0E0;
  1530. color: #9E9E9E;
  1531. cursor: not-allowed;
  1532. &:hover {
  1533. background: #E0E0E0;
  1534. }
  1535. }
  1536. }
  1537. }
  1538. }
  1539. </style>