@@ -7,232 +7,235 @@ import { themeChange } from '@/utils'
import { clearAllDbStore } from '@/utils/localforage'
export function useViewModel() {
type ValidatePayload = zod . infer < typeof schema >
const globalConfig = useStore ( ) . globalConfig
const personConfig = useStore ( ) . personConfig
const prizeConfig = useStore ( ) . prizeConfig
const {
getGlobalConfig : globalConfigData ,
getTopTitle : topTitle ,
getTheme : localTheme ,
getPatterColor : patternColor ,
getPatternList : patternList ,
getCardColor : cardColor ,
getLuckyColor : luckyCardColor ,
getTextColor : textColor ,
getCardSize : cardSize ,
getTextSize : textSize ,
getRowCount : rowCount ,
getIsShowPrizeList : isShowPrizeList ,
getLanguage : userLanguage ,
getBackground : backgroundImage ,
getFont : currentFont ,
getTitleFont : currentTitleFont ,
getTitleFontSyncGlobal : titleFontSyncGlobal ,
getImageList : imageList ,
getIsShowAvatar : isShowAvatar ,
getDefiniteTime : definiteTime ,
getWinMusic : isWinMusic ,
} = storeToRefs ( globalConfig )
const { getAlreadyPersonList : alreadyPersonList , getNotPersonList : notPersonList } = storeToRefs ( personConfig )
type ValidatePayload = zod . infer < typeof schema >
const globalConfig = useStore ( ) . globalConfig
const personConfig = useStore ( ) . personConfig
const prizeConfig = useStore ( ) . prizeConfig
const {
getGlobalConfig : globalConfigData ,
getTopTitle : topTitle ,
getTheme : localTheme ,
getPatterColor : patternColor ,
getPatternList : patternList ,
getCardColor : cardColor ,
getLuckyColor : luckyCardColor ,
getTextColor : textColor ,
getCardSize : cardSize ,
getTextSize : textSize ,
getRowCount : rowCount ,
getIsShowPrizeList : isShowPrizeList ,
getLanguage : userLanguage ,
getBackground : backgroundImage ,
getFont : currentFont ,
getTitleFont : currentTitleFont ,
getTitleFontSyncGlobal : titleFontSyncGlobal ,
getImageList : imageList ,
getIsShowAvatar : isShowAvatar ,
getDefiniteTime : definiteTime ,
getWinMusic : isWinMusic ,
} = storeToRefs ( globalConfig )
const { getAlreadyPersonList : alreadyPersonList , getNotPersonList : notPersonList } = storeToRefs ( personConfig )
const isRowCountChange = ref ( 0 ) // 0未改变, 1改变,2加载中
const themeValue = ref ( localTheme . value . name )
const topTitleValue = ref ( structuredClone ( topTitle . value ) )
const cardColorValue = ref ( structuredClone ( cardColor . value ) )
const luckyCardColorValue = ref ( structuredClone ( luckyCardColor . value ) )
const textColorValue = ref ( structuredClone ( textColor . value ) )
const cardSizeValue = ref ( structuredClone ( cardSize . value ) )
const textSizeValue = ref ( structuredClone ( textSize . value ) )
const rowCountValue = ref ( structuredClone ( rowCount . value ) )
const languageValue = ref ( structuredClone ( userLanguage . value ) )
const isShowPrizeListValue = ref ( structuredClone ( isShowPrizeList . value ) )
const isShowAvatarValue = ref ( structuredClone ( isShowAvatar . value ) )
const patternColorValue = ref ( structuredClone ( patternColor . value ) )
const backgroundImageValue = ref ( backgroundImage . value )
const currentFontValue = ref ( structuredClone ( currentFont . value ) )
const currentTitleFontValue = ref ( structuredClone ( currentTitleFont . value ) )
const titleFontSyncGlobalValue = ref ( structuredClone ( titleFontSyncGlobal . value ) )
const definiteTimeValue = ref ( structuredClone ( definiteTime . value ) )
const isWinMusicValue = ref ( structuredClone ( isWinMusic . value ) )
const formData = ref ( {
rowCount : rowCountValue ,
const isRowCountChange = ref ( 0 ) // 0未改变, 1改变,2加载中
const themeValue = ref ( localTheme . value . name )
const topTitleValue = ref ( structuredClone ( topTitle . value ) )
const cardColorValue = ref ( structuredClone ( cardColor . value ) )
const luckyCardColorValue = ref ( structuredClone ( luckyCardColor . value ) )
const textColorValue = ref ( structuredClone ( textColor . value ) )
const cardSizeValue = ref ( structuredClone ( cardSize . value ) )
const textSizeValue = ref ( structuredClone ( textSize . value ) )
const rowCountValue = ref ( structuredClone ( rowCount . value ) )
const languageValue = ref ( structuredClone ( userLanguage . value ) )
const isShowPrizeListValue = ref ( structuredClone ( isShowPrizeList . value ) )
const isShowAvatarValue = ref ( structuredClone ( isShowAvatar . value ) )
const patternColorValue = ref ( structuredClone ( patternColor . value ) )
const backgroundImageValue = ref ( backgroundImage . value )
const currentFontValue = ref ( structuredClone ( currentFont . value ) )
const currentTitleFontValue = ref ( structuredClone ( currentTitleFont . value ) )
const titleFontSyncGlobalValue = ref ( structuredClone ( titleFontSyncGlobal . value ) )
const definiteTimeValue = ref ( structuredClone ( definiteTime . value ) )
const isWinMusicValue = ref ( structuredClone ( isWinMusic . value ) )
const formData = ref ( {
rowCount : rowCountValue ,
} )
const formErr = ref ( {
rowCount : '' ,
} )
const schema = zod . object ( {
rowCount : zod.number ( {
error : i18n.global.t ( 'error.require' ) ,
// required_error: i18n.global.t('error.require'),
// invalid_type_error: i18n.global.t('error.requireNumber'),
} )
const formErr = ref ( {
rowCount : '' ,
} )
const schema = zod . object ( {
rowCount : zod.number ( {
error : i18n.global.t ( 'error.require' ) ,
// required_error: i18n.global.t('error.require'),
// invalid_type_error: i18n.global.t('error.requireNumber'),
} )
. min ( 1 , i18n . global . t ( 'error.minNumber1' ) )
. max ( 100 , i18n . global . t ( 'error.maxNumber100' ) ) ,
// 格式化
. min ( 1 , i18n . global . t ( 'error.minNumber1' ) )
. max ( 100 , i18n . global . t ( 'error.maxNumber100' ) ) ,
// 格式化
} )
const payload : ValidatePayload = {
rowCount : formData.value.rowCount ,
}
function parseSchema ( props : ValidatePayload ) {
return schema . parseAsync ( props )
}
} )
const payload : ValidatePayload = {
rowCount : formData.value.rowCount ,
}
function parseSchema ( props : ValidatePayload ) {
return schema . parseAsync ( props )
}
function resetPersonLayout() {
isRowCountChange . value = 2
setTimeout ( ( ) = > {
const alreadyLen = alreadyPersonList . value . length
const notLen = notPersonList . value . length
if ( alreadyLen <= 0 && notLen <= 0 ) {
return
}
const allPersonList = alreadyPersonList . value . concat ( notPersonList . value )
const newAlreadyPersonList = allPersonList . slice ( 0 , alreadyLen )
const newNotPersonList = allPersonList . slice ( alreadyLen , notLen + alreadyLen )
personConfig . deleteAllPerson ( )
personConfig . addNotPersonList ( newNotPersonList )
personConfig . addAlreadyPersonList ( newAlreadyPersonList , null )
function resetPersonLayout() {
isRowCountChange . value = 2
setTimeout ( ( ) = > {
const alreadyLen = alreadyPersonList . value . length
const notLen = notPersonList . value . length
if ( alreadyLen <= 0 && notLen <= 0 ) {
return
}
const allPersonList = alreadyPersonList . value . concat ( notPersonList . value )
const newAlreadyPersonList = allPersonList . slice ( 0 , alreadyLen )
const newNotPersonList = allPersonList . slice ( alreadyLen , notLen + alreadyLen )
personConfig . deleteAllPerson ( )
personConfig . addNotPersonList ( newNotPersonList )
personConfig . addAlreadyPersonList ( newAlreadyPersonList , null )
isRowCountChange . value = 0
} , 1000 )
}
isRowCountChange . value = 0
} , 1000 )
}
function clearPattern() {
globalConfig . setPatternList ( [ ] as number [ ] )
}
function resetPattern() {
globalConfig . resetPatternList ( )
}
function clearPattern() {
globalConfig . setPatternList ( [ ] as number [ ] )
}
function resetPattern() {
globalConfig . resetPatternList ( )
}
function resetData() {
globalConfig . reset ( )
personConfig . reset ( )
prizeConfig . resetDefault ( )
// 删除所有indexDb
clearAllDbStore ( )
// 刷新页面
window . location . reload ( )
}
function resetData() {
globalConfig . reset ( )
personConfig . reset ( )
prizeConfig . resetDefault ( )
// 删除所有indexDb
clearAllDbStore ( )
// 刷新页面
window . location . reload ( )
}
function exportAllConfigData() {
// const globalConfigData = globalConfig.getGlobalConfig()
// console.log(globalConfigData.value)
// const globalConfigData = globalConfig.getGlobalConfig()
const dataStr = JSON . stringify ( globalConfigData . value , null , 2 )
const dataUri = ` data:application/json;charset=utf-8, ${ encodeURIComponent ( dataStr ) } `
function exportAllConfigData() {
// const globalConfigData = globalConfig.getGlobalConfig()
// console.log(globalConfigData.value)
// const globalConfigData = globalConfig.getGlobalConfig()
const dataStr = JSON . stringify ( globalConfigData . value , null , 2 )
const dataUri = ` data:application/json;charset=utf-8, ${ encodeURIComponent ( dataStr ) } `
const exportFileDefaultName = 'global-config.json'
const exportFileDefaultName = 'global-config.json'
const linkElement = document . createElement ( 'a' )
linkElement . setAttribute ( 'href' , dataUri )
linkElement . setAttribute ( 'download' , exportFileDefaultName )
linkElement . click ( )
}
function importAllConfigData ( data : any ) {
globalConfig . setGlobalConfig ( data )
window . location . reload ( )
}
const linkElement = document . createElement ( 'a' )
linkElement . setAttribute ( 'href' , dataUri )
linkElement . setAttribute ( 'download' , exportFileDefaultName )
linkElement . click ( )
}
function importAllConfigData ( data : any ) {
globalConfig . setGlobalConfig ( data )
window . location . reload ( )
}
watch ( ( ) = > formData . value . rowCount , ( ) = > {
payload . rowCount = formData . value . rowCount
parseSchema ( payload ) . then ( ( res ) = > {
if ( res . rowCount ) {
isRowCountChange . value = 1
globalConfig . setRowCount ( res . rowCount )
}
} ) . catch ( ( err ) = > {
formErr . value . rowCount = err . issues [ 0 ] . message
} )
watch ( ( ) = > formData . value . rowCount , ( ) = > {
payload . rowCount = formData . value . rowCount
parseSchema ( payload ) . then ( ( res ) = > {
if ( res . rowCount ) {
isRowCountChange . value = 1
globalConfig . setRowCount ( res . rowCount )
}
} ) . catch ( ( err ) = > {
formErr . value . rowCount = err . issues [ 0 ] . message
} )
} )
watch ( topTitleValue , ( val ) = > {
globalConfig . setTopTitle ( val )
} )
watch ( themeValue , ( val : any ) = > {
globalConfig . setTheme ( { name : val } )
themeChange ( val )
} , { deep : true } )
watch ( topTitleValue , ( val ) = > {
globalConfig . setTopTitle ( val )
} )
watch ( themeValue , ( val : any ) = > {
globalConfig . setTheme ( { name : val } )
themeChange ( val )
} , { deep : true } )
watch ( cardColorValue , ( val : string ) = > {
globalConfig . setCardColor ( val )
} , { deep : true } )
watch ( luckyCardColorValue , ( val : string ) = > {
globalConfig . setLuckyCardColor ( val )
} , { deep : true } )
watch ( patternColorValue , ( val : string ) = > {
globalConfig . setPatterColor ( val )
} )
watch ( textColorValue , ( val : string ) = > {
globalConfig . setTextColor ( val )
} , { deep : true } )
watch ( cardColorValue , ( val : string ) = > {
globalConfig . setCardColor ( val )
} , { deep : true } )
watch ( luckyCardColorValue , ( val : string ) = > {
globalConfig . setLuckyCardColor ( val )
} , { deep : true } )
watch ( patternColorValue , ( val : string ) = > {
globalConfig . setPatterColor ( val )
} )
watch ( textColorValue , ( val : string ) = > {
globalConfig . setTextColor ( val )
} , { deep : true } )
watch ( cardSizeValue , ( val : { width : number , height : number } ) = > {
globalConfig . setCardSize ( val )
} , { deep : true } )
watch ( cardSizeValue , ( val : { width : number , height : number } ) = > {
globalConfig . setCardSize ( val )
} , { deep : true } )
watch ( isShowPrizeListValue , ( ) = > {
globalConfig . setIsShowPrizeList ( isShowPrizeListValue . value )
} )
watch ( backgroundImageValue , ( val ) = > {
globalConfig . setBackground ( val )
} )
watch ( currentFontValue , ( val ) = > {
globalConfig . setFont ( val )
document . documentElement . style . setProperty ( '--app-font-family' , ` " ${ val } ", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif ` )
} )
watch ( currentTitleFontValue , ( val ) = > {
globalConfig . setTitleFont ( val )
} )
watch ( titleFontSyncGlobalValue , ( val ) = > {
globalConfig . setTitleFontSyncGlobal ( val )
} )
watch ( languageValue , ( val : string ) = > {
globalConfig . setLanguage ( val )
} )
watch ( isShowAvatarValue , ( ) = > {
globalConfig . setIsShowAvatar ( isShowAvatarValue . value )
} )
watch ( definiteTimeValue , ( ) = > {
globalConfig . setDefiniteTime ( definiteTimeValue . value )
} )
watch ( isWinMusicValue , ( ) = > {
globalConfig . setIsPlayWinMusic ( isWinMusicValue . value )
} )
onMounted ( ( ) = > {
} )
return {
resetData ,
topTitleValue ,
languageValue ,
textSizeValue ,
currentFont Value,
currentTitleFont Value,
titleFontSyncGlobal Value ,
languageList ,
formErr ,
formData ,
cardSizeValue ,
isShowPrizeListValue ,
isShowAvatarValue ,
resetPersonLayout ,
isRowCountChang e ,
theme Value,
backgroundImageValue ,
cardColorValu e,
luckyCardColor Value,
textColor Value,
pattern ColorValue,
imageList ,
rowCount ,
cardColor ,
patternColor ,
patternLis t,
clearPattern ,
resetP attern,
exportAllConfigData ,
importAllConfigData ,
definiteTimeValue ,
isWinMusicValue ,
}
watch ( isShowPrizeListValue , ( ) = > {
globalConfig . setIsShowPrizeList ( isShowPrizeListValue . value )
} )
watch ( backgroundImageValue , ( val ) = > {
globalConfig . setBackground ( val )
} )
watch ( currentFontValue , ( val ) = > {
globalConfig . setFont ( val )
document . documentElement . style . setProperty ( '--app-font-family' , ` " ${ val } ", -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif ` )
} )
watch ( currentTitleFontValue , ( val ) = > {
globalConfig . setTitleFont ( val )
} )
watch ( titleFontSyncGlobalValue , ( val ) = > {
globalConfig . setTitleFontSyncGlobal ( val )
} )
watch ( languageValue , ( val : string ) = > {
globalConfig . setLanguage ( val )
} )
watch ( isShowAvatarValue , ( ) = > {
globalConfig . setIsShowAvatar ( isShowAvatarValue . value )
} )
watch ( definiteTimeValue , ( ) = > {
globalConfig . setDefiniteTime ( definiteTimeValue . value )
} )
watch ( isWinMusicValue , ( ) = > {
globalConfig . setIsPlayWinMusic ( isWinMusicValue . value )
} )
watch ( textSizeValue , ( val : number ) = > {
globalConfig . setTextSize ( val )
} )
onMounted ( ( ) = > {
} )
return {
resetData ,
topTitle Value,
language Value,
textSize Value ,
currentFontValue ,
currentTitleFontValue ,
titleFontSyncGlobalValue ,
languageList ,
formErr ,
formData ,
cardSizeValue ,
isShowPrizeListValu e ,
isShowAvatar Value,
resetPersonLayout ,
isRowCountChang e,
theme Value,
backgroundImage Value,
card ColorValue,
luckyCardColorValue ,
textColorValue ,
patternColorValue ,
imageList ,
rowCoun t,
cardColor ,
p atternColor ,
patternList ,
clearPattern ,
resetPattern ,
exportAllConfigData ,
importAllConfigData ,
definiteTimeValue ,
isWinMusicValue ,
}
}