Skip to content

B
bigwood
Commit d003c318 authored by 黄奎's avatar 黄奎
Browse files
Options

新增参数

parent 368514ee
Hide whitespace changes
Inline Side-by-side
Showing with 117 additions and 79 deletions
src/pages/auth/forget.vue
View file @ d003c318
<template> <template>
<div class="row full-height"> <div class="row full-height">
<div class="col q-pa-xl fit row justify-center height">
<div class="col q-pa-xl fit row justify-center height"> <div style="width: 450px" class="column justify-between content-between">
<div style="width:450px;" class="column justify-between content-between"> <div class="row items-center">
<div class="row items-center">
<div class="col"> <div class="col">
<q-btn round flat size="md" @click="goback"> <q-btn round flat size="md" @click="goback">
<svg-icon icon="Navigation/Arrow-left.svg" :size="24" tips="$t('forget.goback')"></svg-icon> <svg-icon
icon="Navigation/Arrow-left.svg"
:size="24"
tips="$t('forget.goback')"
></svg-icon>
</q-btn> </q-btn>
</div> </div>
<div class="text-grey-6 text-weight-bold text-right" > <div class="text-grey-6 text-weight-bold text-right">
<span>{{$t("forget.notaccess")}}</span> <span>{{ $t("forget.notaccess") }}</span>
<router-link :to="{ path: '/auth/login' }" class="text-primary pfb text-subtitle">{{$t("forget.registlink")}}</router-link> <router-link
:to="{ path: '/auth/login' }"
class="text-primary pfb text-subtitle"
>{{ $t("forget.registlink") }}</router-link
>
</div> </div>
</div> </div>
<div class="q-py-xxl full-width"> <div class="q-py-xxl full-width">
<div class="text-h3 text-weight-bold">{{$t("forget.title")}}</div> <div class="text-h3 text-weight-bold">{{ $t("forget.title") }}</div>
<div class="text-grey-6 q-mt-sm q-mb-lg">{{$t("forget.subtitle")}}</div> <div class="text-grey-6 q-mt-sm q-mb-lg">{{ $t("forget.subtitle") }}</div>
<div class="form-box q-my-lg"> <div class="form-box q-my-lg">
<div class="q-mb-lg"> <div class="q-mb-lg">
<q-input :label="$t('forget.account')" standout v-model="account" dense ref="accountRef" :rules="[(val:any, rules:any) => rules.email(val) || $t('login.ruleTipsAccount')]" /> <q-input
:label="$t('forget.account')"
standout
v-model="account"
dense
ref="accountRef"
:rules="[(val:any, rules:any) => rules.email(val) || $t('login.ruleTipsAccount')]"
/>
</div> </div>
</div> </div>
<div class="row items-center" :class="{'row':$q.platform.is.desktop,'column':$q.platform.is.mobile}"> <div
class="row items-center"
:class="{ row: $q.platform.is.desktop, column: $q.platform.is.mobile }"
>
<div class="col"> <div class="col">
<q-btn size="md" class="q-px-lg" color="primary" :loading="loading" @click="sendVerifyCode" unelevated :label="$t('forget.submit')" /> <q-btn
size="md"
class="q-px-lg"
color="primary"
:loading="loading"
@click="sendVerifyCode"
unelevated
:label="$t('forget.submit')"
/>
</div> </div>
</div> </div>
</div> </div>
...@@ -36,11 +61,11 @@ ...@@ -36,11 +61,11 @@
map-options map-options
option-value="langLocale" option-value="langLocale"
option-label="langName" option-label="langName"
style="width:180px" style="width: 180px"
@update:model-value="getLanguage" @update:model-value="getLanguage"
> >
<template v-slot:selected> <template v-slot:selected>
{{$t("lanuage")}}： {{ $t("lanuage") }}：
<q-chip <q-chip
dense dense
square square
...@@ -58,90 +83,103 @@ ...@@ -58,90 +83,103 @@
<div class="col right-bg full-height mobile-hide"></div> <div class="col right-bg full-height mobile-hide"></div>
</div> </div>
<q-dialog no-esc-dismiss persistent v-model="successModel"> <q-dialog no-esc-dismiss persistent v-model="successModel">
<q-card :class="{'q-pa-xl':$q.platform.is.desktop,'q-pa-lg':$q.platform.is.mobile}"> <q-card
<q-card-section> :class="{ 'q-pa-xl': $q.platform.is.desktop, 'q-pa-lg': $q.platform.is.mobile }"
<div class="text-center q-mb-md"> >
<svg-icon icon="Code/Done-circle.svg" color="success" :size="80"></svg-icon> <q-card-section>
</div> <div class="text-center q-mb-md">
<div>{{$t('forget.mailResult')}}</div> <svg-icon icon="Code/Done-circle.svg" color="success" :size="80"></svg-icon>
<div class="text-center q-mt-xl"> </div>
<q-btn color="primary" @click="goback" unelevated :label="$t('forget.resultBtn')" /> <div>{{ $t("forget.mailResult") }}</div>
</div> <div class="text-center q-mt-xl">
</q-card-section> <q-btn
</q-card> color="primary"
@click="goback"
unelevated
:label="$t('forget.resultBtn')"
/>
</div>
</q-card-section>
</q-card>
</q-dialog> </q-dialog>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, reactive, ref, toRefs } from 'vue' import { defineComponent, reactive, ref, toRefs } from "vue";
import useMetaModule from '../../module/meta/metaModule' import useMetaModule from "../../module/meta/metaModule";
import { useI18n } from 'vue-i18n' import { useI18n } from "vue-i18n";
import { getLangs } from "../../utils/tools"; import { getLangs } from "../../utils/tools";
import { SitLang } from '../../@types'; import { SitLang } from "../../@types";
import svgIcon from '../../components/global/svg-icon.vue'; import svgIcon from "../../components/global/svg-icon.vue";
import UserService from '../../api/user'; import UserService from "../../api/user";
import message from '../../utils/message'; import message from "../../utils/message";
import { ApiResult } from '../../@types/enumHelper'; import { ApiResult } from "../../@types/enumHelper";
import { useQuasar } from 'quasar'; import { useQuasar } from "quasar";
export default defineComponent({ export default defineComponent({
components: { svgIcon }, components: { svgIcon },
setup() { setup() {
let { setTitle } = useMetaModule() let { setTitle } = useMetaModule();
const accountRef = ref(null) const accountRef = ref(null);
const {locale,t } = useI18n(); const { locale, t } = useI18n();
setTitle(t("forget.pageTitle")) setTitle(t("forget.pageTitle"));
const data=reactive({ const data = reactive({
currentLang: {} as SitLang, currentLang: {} as SitLang,
langs:[] as SitLang[], langs: [] as SitLang[],
account:'', account: "",
loading:false, loading: false,
successModel:false successModel: false,
}) });
data.langs=getLangs() data.langs = getLangs();
if(data.langs && data.langs.length>0){ if (data.langs && data.langs.length > 0) {
data.currentLang = data.langs.find(x=> x.langLocale==locale.value) ?? {}; data.currentLang = data.langs.find((x) => x.langLocale == locale.value) ?? {};
} }
let methods = { let methods = {
sendVerifyCode(){ sendVerifyCode() {
if(data.loading) return if (data.loading) return;
const accountRefVal=accountRef as any const accountRefVal = accountRef as any;
console.log(accountRef.value) console.log(accountRef.value);
let domainStr = window.location.hostname;
accountRefVal.value.validate() accountRefVal.value.validate();
if(!accountRefVal.value.hasError){ if (!accountRefVal.value.hasError) {
data.loading=true data.loading = true;
//hasError //hasError
UserService.sendVerify({account:data.account,platform:3}).then(r=>{ UserService.sendVerify({
console.log(r) account: data.account,
data.loading=false platform: 3,
if(r.data.resultCode==ApiResult.SUCCESS){ domain: domainStr,
data.successModel=true
}else{
message.errorMsg(r.data.message)
}
}).catch(e=>{
data.loading=false
message.errorMsg(e.message)
}) })
.then((r) => {
console.log(r);
data.loading = false;
if (r.data.resultCode == ApiResult.SUCCESS) {
data.successModel = true;
} else {
message.errorMsg(r.data.message);
}
})
.catch((e) => {
data.loading = false;
message.errorMsg(e.message);
});
} }
}, },
goback(){ goback() {
window.history.go(-1) window.history.go(-1);
}, },
// 切换语言 // 切换语言
getLanguage(val:SitLang) { getLanguage(val: SitLang) {
locale.value = val.langLocale??''; locale.value = val.langLocale ?? "";
localStorage.setItem('lanuage', val.langLocale??'') localStorage.setItem("lanuage", val.langLocale ?? "");
} },
} };
return { ...toRefs(data), ...methods,accountRef } return { ...toRefs(data), ...methods, accountRef };
} },
}) });
</script> </script>
<style> <style>
...@@ -160,14 +198,14 @@ export default defineComponent({ ...@@ -160,14 +198,14 @@ export default defineComponent({
.w-450-only { .w-450-only {
width: 450px; width: 450px;
} }
.right-bg{ .right-bg {
background-image: url(../../assets/images/login-right-bg.png); background-image: url(../../assets/images/login-right-bg.png);
background-position-x: left; background-position-x: left;
background-position-y: center; background-position-y: center;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
} }
.top-bg{ .top-bg {
background-image: url(https://preview.keenthemes.com/metronic8/demo1/assets/media/auth/bg11.png); background-image: url(https://preview.keenthemes.com/metronic8/demo1/assets/media/auth/bg11.png);
background-position-x: -100px; background-position-x: -100px;
background-position-y: -85vh; background-position-y: -85vh;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment