kidArtExpo/src/store/auth/index.js

import {ref,computed} from 'vue'
import {createGlobalState,useStorage} from '@vueuse/core'
import {competitionApply, loginRegister, sendCode} from '@/api/auth/index.js'
import {message} from "@/utils/message.js"
import { useRouter } from 'vue-router';
export const useAuth=createGlobalState(()=>{

    const router = useRouter();
    const token = useStorage('token', '', localStorage)
        const telNum =ref('')
    const code=ref('')
    const countdown = ref(0);
    const isCountingDown = ref(false);
    const showTextCode=computed(()=>{
        return  isCountingDown.value ? `${countdown.value}s` : '获取验证码'
    })
    const genderOptions=ref([
        {text:'男',value:'男'},
        {text:'女',value:'女'}
    ])

    const formData=ref({
        name:'',
        age:'',
        gender:'',
        works:[
            {
                picUrl: "", //作品图片url
                workName: "", //作品名称
                length: undefined, //长度
                wide:undefined//宽度
            }
        ]
    })
    const clickAddWorks=()=>{
        formData.value.works.push({
            picUrl: "", //作品图片url
            workName: "", //作品名称
            length: undefined, //长度
            wide:undefined//宽度
        })
    }
    const removeWorks=(index)=>{
        formData.value.works.splice(index,1)
    }
    const clickApply=async ()=>{
        const data={
            ...formData.value
        }
        const res=await competitionApply(data)
        if(res.status===0){
            message.success('报名成功')
        }
    }
    let timer = null;
    const clickLogin=async ()=>{
        const data={
            telNum:telNum.value,
            code:code.value
        }
       const res=await loginRegister(data)
        if(res.status===0){
            message.success('登录成功')
            token.value=res.data.token
            router.push('/signup')
        }
    }
    const clickSendCode=async ()=>{
        if (isCountingDown.value) return;
        if (!code.value){
            message.warning('请输入验证码')
            return
        }
        if (!telNum.value){
            message.warning('请输入手机号')
            return
        }
        const data={
            telNum:telNum.value
        }
       const res=await sendCode(data)
        if (res.status===0){
            countdown.value = 60;
            isCountingDown.value = true;
            message.success('发送成功')
            timer = setInterval(() => {
                if (countdown.value > 0) {
                    countdown.value -= 1;
                } else {
                    clearInterval(timer);
                    isCountingDown.value = false;
                }
            }, 1000);
        }
    }
    return {
        removeWorks,
        clickAddWorks,
        genderOptions,
        formData,
        clickApply,
        clickLogin,
        showTextCode,
        code,
        clickSendCode,
        telNum,
        token
    }

})