279 lines
8.0 KiB
JavaScript
279 lines
8.0 KiB
JavaScript
/**
|
||
* 配置状态管理模块
|
||
* Requirements: 2.1, 2.2, 3.1, 3.2, 3.3
|
||
*/
|
||
|
||
import { defineStore } from 'pinia'
|
||
import {
|
||
getLastPopupDate, setLastPopupDate,
|
||
getMemberAdClosedDate, setMemberAdClosedDate,
|
||
getMemberAdClosedForever, setMemberAdClosedForever,
|
||
getGenderPreference,
|
||
getDefaultAvatar, setDefaultAvatar
|
||
} from '../utils/storage.js'
|
||
|
||
/**
|
||
* 获取今天的日期字符串 (YYYY-MM-DD)
|
||
* @returns {string}
|
||
*/
|
||
export function getTodayDateString() {
|
||
const now = new Date()
|
||
return `${now.getFullYear()}-${String(now.getMonth() + 1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}`
|
||
}
|
||
|
||
/**
|
||
* 配置状态定义
|
||
* @typedef {Object} ConfigState
|
||
* @property {Array} banners - Banner轮播图列表
|
||
* @property {Array} kingKongs - 金刚位导航列表
|
||
* @property {Object|null} dailyPopup - 每日弹窗配置
|
||
* @property {string} lastPopupDate - 上次显示弹窗的日期
|
||
* @property {string} memberAdClosedDate - 会员广告关闭日期
|
||
* @property {boolean} showGenderPopup - 是否显示性别选择弹窗
|
||
* @property {boolean} showDailyPopup - 是否显示每日弹窗
|
||
* @property {boolean} showMemberAd - 是否显示会员广告
|
||
*/
|
||
|
||
export const useConfigStore = defineStore('config', {
|
||
state: () => ({
|
||
// 首页配置
|
||
banners: [],
|
||
kingKongs: [],
|
||
|
||
// 弹窗配置
|
||
dailyPopup: null,
|
||
memberAdConfig: null, // 会员广告配置（从后台获取）
|
||
lastPopupDate: getLastPopupDate() || '',
|
||
memberAdClosedDate: getMemberAdClosedDate() || '',
|
||
memberAdClosedForever: getMemberAdClosedForever() || false,
|
||
|
||
// 默认头像（从后台配置获取）
|
||
defaultAvatar: getDefaultAvatar() || '/static/logo.png',
|
||
|
||
// 弹窗显示状态
|
||
showGenderPopup: false,
|
||
showDailyPopup: false,
|
||
showMemberAd: false
|
||
}),
|
||
|
||
getters: {
|
||
/**
|
||
* 是否有Banner数据
|
||
*/
|
||
hasBanners: (state) => state.banners.length > 0,
|
||
|
||
/**
|
||
* 是否有金刚位数据
|
||
*/
|
||
hasKingKongs: (state) => state.kingKongs.length > 0,
|
||
|
||
/**
|
||
* 是否有每日弹窗
|
||
*/
|
||
hasDailyPopup: (state) => state.dailyPopup !== null,
|
||
|
||
/**
|
||
* 是否有会员广告配置
|
||
*/
|
||
hasMemberAdConfig: (state) => state.memberAdConfig !== null && state.memberAdConfig.status === 1,
|
||
|
||
/**
|
||
* 获取默认头像URL
|
||
*/
|
||
getDefaultAvatar: (state) => state.defaultAvatar || '/static/logo.png'
|
||
},
|
||
|
||
actions: {
|
||
/**
|
||
* 设置首页配置
|
||
* @param {Object} config - 首页配置
|
||
* @param {Array} config.banners - Banner列表
|
||
* @param {Array} config.kingKongs - 金刚位列表
|
||
* @param {string} config.defaultAvatar - 默认头像URL
|
||
*/
|
||
setHomeConfig(config) {
|
||
if (config.banners) {
|
||
this.banners = config.banners
|
||
}
|
||
if (config.kingKongs) {
|
||
this.kingKongs = config.kingKongs
|
||
}
|
||
if (config.defaultAvatar) {
|
||
this.defaultAvatar = config.defaultAvatar
|
||
setDefaultAvatar(config.defaultAvatar)
|
||
}
|
||
},
|
||
|
||
/**
|
||
* 设置每日弹窗配置
|
||
* @param {Object} popup - 弹窗配置
|
||
*/
|
||
setDailyPopup(popup) {
|
||
this.dailyPopup = popup
|
||
},
|
||
|
||
/**
|
||
* 设置会员广告配置
|
||
* @param {Object} config - 会员广告配置
|
||
*/
|
||
setMemberAdConfig(config) {
|
||
this.memberAdConfig = config
|
||
},
|
||
|
||
/**
|
||
* 检查并决定显示哪个弹窗
|
||
* Property 5: Popup Priority Logic - 性别选择弹窗优先级最高
|
||
* Property 6: Daily Popup Display - 每日首次显示弹窗
|
||
* Property 7: Member Ad Visibility - 非会员且未关闭时显示广告
|
||
*
|
||
* @param {Object} userState - 用户状态
|
||
* @param {number} userState.genderPreference - 性别偏好
|
||
* @param {boolean} userState.isProfileCompleted - 资料是否完成
|
||
* @param {boolean} userState.isMember - 是否会员
|
||
*/
|
||
checkPopupDisplay(userState) {
|
||
const today = getTodayDateString()
|
||
const { genderPreference, isProfileCompleted, isMember } = userState
|
||
|
||
// 重置所有弹窗状态
|
||
this.showGenderPopup = false
|
||
this.showDailyPopup = false
|
||
this.showMemberAd = false
|
||
|
||
// Property 5: 性别选择弹窗优先级最高
|
||
// 当用户未选择性别偏好且未完成资料时显示
|
||
if (genderPreference === 0 && !isProfileCompleted) {
|
||
this.showGenderPopup = true
|
||
return // 性别弹窗优先级最高，显示后不再检查其他弹窗
|
||
}
|
||
|
||
// Property 6: 每日弹窗显示
|
||
// 当今天还没显示过弹窗时显示
|
||
if (this.lastPopupDate !== today && this.dailyPopup) {
|
||
this.showDailyPopup = true
|
||
return // 每日弹窗显示后不再检查会员广告
|
||
}
|
||
|
||
// Property 7: 会员广告可见性
|
||
// 非会员且后台配置启用时，根据显示模式判断是否显示
|
||
if (!isMember && this.memberAdConfig && this.memberAdConfig.status === 1) {
|
||
const displayMode = this.memberAdConfig.displayMode || 2
|
||
|
||
// displayMode: 1每次进入都显示 2关闭后当天不再显示 3关闭后永不显示
|
||
if (displayMode === 1) {
|
||
// 每次进入都显示
|
||
this.showMemberAd = true
|
||
} else if (displayMode === 2) {
|
||
// 关闭后当天不再显示
|
||
if (this.memberAdClosedDate !== today) {
|
||
this.showMemberAd = true
|
||
}
|
||
} else if (displayMode === 3) {
|
||
// 关闭后永不显示
|
||
if (!this.memberAdClosedForever) {
|
||
this.showMemberAd = true
|
||
}
|
||
}
|
||
}
|
||
},
|
||
|
||
/**
|
||
* 关闭性别选择弹窗
|
||
*/
|
||
closeGenderPopup() {
|
||
this.showGenderPopup = false
|
||
},
|
||
|
||
/**
|
||
* 关闭每日弹窗并记录日期
|
||
*/
|
||
closeDailyPopup() {
|
||
const today = getTodayDateString()
|
||
this.showDailyPopup = false
|
||
this.lastPopupDate = today
|
||
setLastPopupDate(today)
|
||
},
|
||
|
||
/**
|
||
* 关闭会员广告
|
||
* 根据显示模式决定关闭行为
|
||
*/
|
||
closeMemberAd() {
|
||
const today = getTodayDateString()
|
||
this.showMemberAd = false
|
||
|
||
const displayMode = this.memberAdConfig?.displayMode || 2
|
||
|
||
if (displayMode === 2) {
|
||
// 关闭后当天不再显示
|
||
this.memberAdClosedDate = today
|
||
setMemberAdClosedDate(today)
|
||
} else if (displayMode === 3) {
|
||
// 关闭后永不显示
|
||
this.memberAdClosedForever = true
|
||
setMemberAdClosedForever(true)
|
||
}
|
||
// displayMode === 1 时不记录，下次进入还会显示
|
||
},
|
||
|
||
/**
|
||
* 判断是否应该显示性别选择弹窗
|
||
* Property 5: Popup Priority Logic
|
||
* @param {number} genderPreference - 性别偏好
|
||
* @param {boolean} isProfileCompleted - 资料是否完成
|
||
* @returns {boolean}
|
||
*/
|
||
shouldShowGenderPopup(genderPreference, isProfileCompleted) {
|
||
return genderPreference === 0 && !isProfileCompleted
|
||
},
|
||
|
||
/**
|
||
* 判断是否应该显示每日弹窗
|
||
* Property 6: Daily Popup Display
|
||
* @param {string} lastShownDate - 上次显示日期
|
||
* @param {string} today - 今天日期
|
||
* @returns {boolean}
|
||
*/
|
||
shouldShowDailyPopup(lastShownDate, today) {
|
||
return lastShownDate !== today
|
||
},
|
||
|
||
/**
|
||
* 判断是否应该显示会员广告
|
||
* Property 7: Member Ad Visibility
|
||
* @param {boolean} isMember - 是否会员
|
||
* @param {string} adClosedDate - 广告关闭日期
|
||
* @param {string} today - 今天日期
|
||
* @returns {boolean}
|
||
*/
|
||
shouldShowMemberAd(isMember, adClosedDate, today) {
|
||
return !isMember && adClosedDate !== today
|
||
},
|
||
|
||
/**
|
||
* 重置配置状态
|
||
*/
|
||
reset() {
|
||
this.banners = []
|
||
this.kingKongs = []
|
||
this.dailyPopup = null
|
||
this.memberAdConfig = null
|
||
this.showGenderPopup = false
|
||
this.showDailyPopup = false
|
||
this.showMemberAd = false
|
||
// 不重置 defaultAvatar，保留后台配置
|
||
},
|
||
|
||
/**
|
||
* 设置默认头像
|
||
* @param {string} avatar - 默认头像URL
|
||
*/
|
||
setDefaultAvatarConfig(avatar) {
|
||
if (avatar) {
|
||
this.defaultAvatar = avatar
|
||
setDefaultAvatar(avatar)
|
||
}
|
||
}
|
||
}
|
||
})
|