|
@@ -115,11 +115,11 @@
|
|
|
{{ t('sys.login.qrSignInFormTitle') }}
|
|
|
</Button>
|
|
|
</ACol>
|
|
|
- <ACol :md="8" :xs="24">
|
|
|
- <Button block @click="setLoginState(LoginStateEnum.REGISTER)">
|
|
|
- {{ t('sys.login.registerButton') }}
|
|
|
- </Button>
|
|
|
- </ACol>
|
|
|
+ <!-- <ACol :md="8" :xs="24">-->
|
|
|
+ <!-- <Button block @click="setLoginState(LoginStateEnum.REGISTER)">-->
|
|
|
+ <!-- {{ t('sys.login.registerButton') }}-->
|
|
|
+ <!-- </Button>-->
|
|
|
+ <!-- </ACol>-->
|
|
|
<ACol :md="8" :xs="24">
|
|
|
<Button block @click="setLoginState(LoginStateEnum.RESET_PASSWORD)">
|
|
|
{{ t('sys.login.forgetFormTitle') }}
|
|
@@ -127,19 +127,19 @@
|
|
|
</ACol>
|
|
|
</ARow>
|
|
|
|
|
|
- <Divider class="enter-x">{{ t('sys.login.otherSignIn') }}</Divider>
|
|
|
+ <!-- <Divider class="enter-x">{{ t('sys.login.otherSignIn') }}</Divider>-->
|
|
|
|
|
|
- <div class="flex justify-evenly enter-x" :class="`${prefixCls}-sign-in-way`">
|
|
|
- <GithubFilled @click="oauthLoginHandler('github')" />
|
|
|
- <!-- <WechatFilled @click="oauthLoginHandler('wechat')" />
|
|
|
- <AlipayCircleFilled @click="oauthLoginHandler('alipay')" /> -->
|
|
|
- <GoogleCircleFilled @click="oauthLoginHandler('google')" />
|
|
|
- <!-- <TwitterCircleFilled @click="oauthLoginHandler('twitter')" /> -->
|
|
|
- </div>
|
|
|
+ <!-- <div class="flex justify-evenly enter-x" :class="`${prefixCls}-sign-in-way`">-->
|
|
|
+ <!-- <GithubFilled @click="oauthLoginHandler('github')" />-->
|
|
|
+ <!-- <!– <WechatFilled @click="oauthLoginHandler('wechat')" />-->
|
|
|
+ <!-- <AlipayCircleFilled @click="oauthLoginHandler('alipay')" /> –>-->
|
|
|
+ <!-- <GoogleCircleFilled @click="oauthLoginHandler('google')" />-->
|
|
|
+ <!-- <!– <TwitterCircleFilled @click="oauthLoginHandler('twitter')" /> –>-->
|
|
|
+ <!-- </div>-->
|
|
|
</Form>
|
|
|
</template>
|
|
|
<script lang="ts" setup>
|
|
|
- import { reactive, ref, unref, computed } from 'vue';
|
|
|
+ import { reactive, ref, unref, computed } from 'vue'
|
|
|
|
|
|
import {
|
|
|
Form,
|
|
@@ -151,45 +151,45 @@
|
|
|
RadioGroup,
|
|
|
RadioButton,
|
|
|
Image,
|
|
|
- } from 'ant-design-vue';
|
|
|
- import { GithubFilled, GoogleCircleFilled } from '@ant-design/icons-vue';
|
|
|
- import LoginFormTitle from './LoginFormTitle.vue';
|
|
|
+ } from 'ant-design-vue'
|
|
|
+ import { GithubFilled, GoogleCircleFilled } from '@ant-design/icons-vue'
|
|
|
+ import LoginFormTitle from './LoginFormTitle.vue'
|
|
|
|
|
|
- import { useI18n } from '@/hooks/web/useI18n';
|
|
|
+ import { useI18n } from '@/hooks/web/useI18n'
|
|
|
|
|
|
- import { useUserStore } from '@/store/modules/user';
|
|
|
- import { LoginStateEnum, useLoginState, useFormRules, useFormValid } from './useLogin';
|
|
|
- import { useDesign } from '@/hooks/web/useDesign';
|
|
|
- import { getCaptcha, getEmailCaptcha, getSmsCaptcha } from '@/api/sys/captcha';
|
|
|
- import { useGo } from '@/hooks/web/usePage';
|
|
|
- import { PageEnum } from '@/enums/pageEnum';
|
|
|
- import { oauthLogin } from '@/api/sys/oauthProvider';
|
|
|
- import { CountdownInput } from '@/components/CountDown';
|
|
|
+ import { useUserStore } from '@/store/modules/user'
|
|
|
+ import { LoginStateEnum, useLoginState, useFormRules, useFormValid } from './useLogin'
|
|
|
+ import { useDesign } from '@/hooks/web/useDesign'
|
|
|
+ import { getCaptcha, getEmailCaptcha, getSmsCaptcha } from '@/api/sys/captcha'
|
|
|
+ import { useGo } from '@/hooks/web/usePage'
|
|
|
+ import { PageEnum } from '@/enums/pageEnum'
|
|
|
+ import { oauthLogin } from '@/api/sys/oauthProvider'
|
|
|
+ import { CountdownInput } from '@/components/CountDown'
|
|
|
|
|
|
- const ACol = Col;
|
|
|
- const ARow = Row;
|
|
|
- const FormItem = Form.Item;
|
|
|
- const InputPassword = Input.Password;
|
|
|
- const ARadioGroup = RadioGroup;
|
|
|
- const ARadioButton = RadioButton;
|
|
|
- const go = useGo();
|
|
|
- const { t } = useI18n();
|
|
|
- const { prefixCls } = useDesign('login');
|
|
|
- const userStore = useUserStore();
|
|
|
+ const ACol = Col
|
|
|
+ const ARow = Row
|
|
|
+ const FormItem = Form.Item
|
|
|
+ const InputPassword = Input.Password
|
|
|
+ const ARadioGroup = RadioGroup
|
|
|
+ const ARadioButton = RadioButton
|
|
|
+ const go = useGo()
|
|
|
+ const { t } = useI18n()
|
|
|
+ const { prefixCls } = useDesign('login')
|
|
|
+ const userStore = useUserStore()
|
|
|
|
|
|
- const { setLoginState, getLoginState } = useLoginState();
|
|
|
- const { getFormRules } = useFormRules();
|
|
|
+ const { setLoginState, getLoginState } = useLoginState()
|
|
|
+ const { getFormRules } = useFormRules()
|
|
|
|
|
|
- const formRef = ref();
|
|
|
- const loading = ref(false);
|
|
|
+ const formRef = ref()
|
|
|
+ const loading = ref(false)
|
|
|
|
|
|
const emailOrPhonePlaceholder = computed(() => {
|
|
|
if (formData.msgType === 'email') {
|
|
|
- return t('sys.login.emailPlaceholder');
|
|
|
+ return t('sys.login.emailPlaceholder')
|
|
|
} else {
|
|
|
- return t('sys.login.mobilePlaceholder');
|
|
|
+ return t('sys.login.mobilePlaceholder')
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
|
|
|
const formData = reactive({
|
|
|
msgType: 'captcha',
|
|
@@ -200,16 +200,16 @@
|
|
|
imgPath: '',
|
|
|
target: '',
|
|
|
captchaVerified: '',
|
|
|
- });
|
|
|
+ })
|
|
|
|
|
|
- const { validForm } = useFormValid(formRef);
|
|
|
+ const { validForm } = useFormValid(formRef)
|
|
|
|
|
|
- const getShow = computed(() => unref(getLoginState) === LoginStateEnum.LOGIN);
|
|
|
+ const getShow = computed(() => unref(getLoginState) === LoginStateEnum.LOGIN)
|
|
|
|
|
|
async function handleLogin() {
|
|
|
- const data = await validForm();
|
|
|
- if (!data) return;
|
|
|
- loading.value = true;
|
|
|
+ const data = await validForm()
|
|
|
+ if (!data) return
|
|
|
+ loading.value = true
|
|
|
if (formData.msgType === 'captcha') {
|
|
|
userStore
|
|
|
.login({
|
|
@@ -221,13 +221,13 @@
|
|
|
mode: 'notice',
|
|
|
})
|
|
|
.then(() => {
|
|
|
- loading.value = false;
|
|
|
- go(PageEnum.BASE_HOME);
|
|
|
+ loading.value = false
|
|
|
+ go(PageEnum.BASE_HOME)
|
|
|
})
|
|
|
.catch(() => {
|
|
|
- getCaptchaData();
|
|
|
- loading.value = false;
|
|
|
- });
|
|
|
+ getCaptchaData()
|
|
|
+ loading.value = false
|
|
|
+ })
|
|
|
} else if (formData.msgType === 'email') {
|
|
|
userStore
|
|
|
.loginByEmail({
|
|
@@ -237,12 +237,12 @@
|
|
|
mode: 'notice',
|
|
|
})
|
|
|
.then(() => {
|
|
|
- loading.value = false;
|
|
|
- go(PageEnum.BASE_HOME);
|
|
|
+ loading.value = false
|
|
|
+ go(PageEnum.BASE_HOME)
|
|
|
})
|
|
|
.catch(() => {
|
|
|
- loading.value = false;
|
|
|
- });
|
|
|
+ loading.value = false
|
|
|
+ })
|
|
|
} else if (formData.msgType === 'sms') {
|
|
|
userStore
|
|
|
.loginBySms({
|
|
@@ -252,49 +252,49 @@
|
|
|
mode: 'notice',
|
|
|
})
|
|
|
.then(() => {
|
|
|
- loading.value = false;
|
|
|
- go(PageEnum.BASE_HOME);
|
|
|
+ loading.value = false
|
|
|
+ go(PageEnum.BASE_HOME)
|
|
|
})
|
|
|
.catch(() => {
|
|
|
- loading.value = false;
|
|
|
- });
|
|
|
+ loading.value = false
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// get captcha
|
|
|
async function getCaptchaData() {
|
|
|
- const captcha = await getCaptcha('none');
|
|
|
+ const captcha = await getCaptcha('none')
|
|
|
if (captcha.code === 0) {
|
|
|
- formData.captchaId = captcha.data.captchaId;
|
|
|
- formData.imgPath = captcha.data.imgPath;
|
|
|
+ formData.captchaId = captcha.data.captchaId
|
|
|
+ formData.imgPath = captcha.data.imgPath
|
|
|
}
|
|
|
}
|
|
|
|
|
|
async function handleSendCaptcha(): Promise<boolean> {
|
|
|
if (formData.msgType == 'email') {
|
|
|
- const result = await getEmailCaptcha({ email: formData.target });
|
|
|
+ const result = await getEmailCaptcha({ email: formData.target })
|
|
|
if (result.code == 0) {
|
|
|
- return true;
|
|
|
+ return true
|
|
|
} else {
|
|
|
- return false;
|
|
|
+ return false
|
|
|
}
|
|
|
} else {
|
|
|
- const result = await getSmsCaptcha({ phoneNumber: formData.target });
|
|
|
+ const result = await getSmsCaptcha({ phoneNumber: formData.target })
|
|
|
if (result.code == 0) {
|
|
|
- return true;
|
|
|
+ return true
|
|
|
} else {
|
|
|
- return false;
|
|
|
+ return false
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- getCaptchaData();
|
|
|
+ getCaptchaData()
|
|
|
|
|
|
async function oauthLoginHandler(provider: string) {
|
|
|
const result = await oauthLogin({
|
|
|
state: new Date().getMilliseconds() + '-' + provider,
|
|
|
provider: provider,
|
|
|
- });
|
|
|
- if (result.code === 0) window.open(result.data.URL);
|
|
|
+ })
|
|
|
+ if (result.code === 0) window.open(result.data.URL)
|
|
|
}
|
|
|
</script>
|