1
李凌
2025-10-09 c17311ba1351cd5e64654c3fc7b2fe765b1e7382
src/views/login/index.vue
@@ -1,15 +1,18 @@
<template>
    <div class="login">
        <div class="top" @click="onRoute('/homePage/index')"><img src="../../assets/image/icon-close.png" alt="" />
        </div>
        <!-- <div class="divider mt-10"></div> -->
    <van-nav-bar :left-arrow="false" class="head">
        <template #left>
            <div class="textColor" @click="onRoute('/')">{{ $t('首页') }}</div>
        </template>
        <template #title>
            <img :src="LOGO" alt="" class="head_logo">
        </template>
        <template #right>
            <img :src="languageObj.image" alt="" class="gq" @click="onRoute('/language')">
        </template>
    </van-nav-bar>
        <div class="log flex items-center justify-center flex-col pt-20 mt-10 mb-20 textColor">
            <img :src="LOGO" alt="">
            <span class="font-bold text-5xl mt-10">
                {{ `${$t('欢迎加入')} ${$title}` }}
            </span>
        </div>
    <div class="login">
        <div class="login_title textColor">{{ $t('login') }}</div>
        <ExInput style="padding-bottom:16px !important;" :placeholderText="getRegType(activeIndex, false)"
            v-model="username" :dialCode="dialCode" @selectArea="onSelectArea" :area="isArea" :icon="icon"
@@ -18,12 +21,17 @@
        <ExInput style="padding-bottom:0 !important;" :placeholderText="$t('entryPassword')" v-model="password"
            typeText="password" @pressEnter="verifyLogin" />
        <div class="forget colorMain" @click="$router.push('/forget')">{{ $t('forgetPassword') }}</div>
        <van-button class="w-full" round style="margin-top:50px;" type="primary" @click="verifyLogin">{{ $t('login') }}
        <div class="forget" @click="$router.push('/forget')">{{ $t('forgetPassword') }}</div>
        <van-button class="w-full btnBackground2 btnText" style="margin-top:2rem;" type="primary"
            @click="verifyLogin">{{
                $t('login')
            }}
        </van-button>
        <div class="noTips textColor">
        <div class="noTips textColor1">
            {{ $t('noAccount') }}?
            <span class="colorMain" @click="$router.push('/register')">
            <span class="textColor" @click="$router.push('/register')">
                {{ $t('goRegister') }}</span>
        </div>
        <nationality-list ref='controlChildRef' :title="$t('selectArea')" @getName="getName"></nationality-list>
@@ -36,13 +44,14 @@
import { _exchangerateuserconfig } from "@/service/trade.api";
import { GET_USERINFO } from '@/store/types.store'
import { useUserStore } from '@/store/user';
import { useLanguageStore } from '@/store/language.store'
import { useI18n } from 'vue-i18n'
import nationalityList from '../authentication/components/nationalityList.vue'
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { showToast } from "vant";
import store from '@/store/store'
import { LOGO } from "@/config";
import { LOGO, lang } from "@/config";
const { t } = useI18n()
const router = useRouter()
@@ -157,19 +166,57 @@
        console.log(res)
    })
}
// 语言切换
const languageStore = useLanguageStore()
const languageObj = lang.find(i => i.key == languageStore.language)
const ddddd = () => {
    if (store.state.vant.theme == 'light') store.commit('vant/SET_THEME', 'dark')
    else store.commit('vant/SET_THEME', 'light')
}
</script>
<style lang="scss" scoped>
.head_logo {
    height: 3rem;
}
.gq {
    height: 2rem;
}
.head {
    @include themify() {
        border-bottom: themed("divi_line") 1px solid;
    }
}
::v-deep .van-nav-bar__text {
    @include themify() {
        color: themed("text_color");
    }
}
.login {
    width: 100%;
    padding: 15px;
    font-size: 13px;
    font-size: 1.3rem;
    box-sizing: border-box;
    background: $mainbgWhiteColor;
    padding: 1.5rem;
    min-height: 100vh;
    @include themify() {
        background: themed("main_background");
    }
    :deep(.textColor) {
        color: $log-c;
    }
    .login_title {
        font-size: 3.5rem;
        margin-top: 5rem;
        margin-bottom: 4rem;
    }
    .divider {
@@ -188,15 +235,9 @@
    }
    .w-full {
        background: $bg_yellow;
        border: none;
        color: $mainBgColor;
        font-size: 16px;
        font-weight: 600;
    }
    .colorMain {
        color: $bg_yellow;
    }
}
@@ -237,12 +278,19 @@
}
.forget {
    font-size: 12px;
    line-height: 14px;
    margin-top: 30px;
    font-size: 1.4rem;
    line-height: 1.6rem;
    margin-top: 3.4rem;
    text-decoration: underline;
}
.noTips {
    margin-top: 22px;
    margin-top: 2.4rem;
    text-align: center;
    font-size: 1.5rem;
    span {
        text-decoration: underline;
    }
}
</style>