Browse Source

隐藏部分按钮

master
zhouhaibin 5 months ago
parent
commit
f4ae17da5c
  1. 136
      src/views/auth/login/LoginForm.vue
  2. 2
      src/views/auth/personal/center/ChangeEmail.vue
  3. 4
      src/views/auth/personal/center/Security.vue

136
src/views/auth/login/LoginForm.vue

@ -1,49 +1,37 @@
<template>
<LoginFormTitle v-show="getShow" class="enter-x" />
<a-form
class="p-4 enter-x"
:model="formData"
:rules="getFormRules"
ref="formRef"
v-show="getShow"
@keypress.enter="handleLoginClick()"
>
<a-form class="p-4 enter-x" :model="formData" :rules="getFormRules" ref="formRef" v-show="getShow"
@keypress.enter="handleLoginClick()">
<a-alert v-if="hasError" type="error" :message="errorMessage" :banner="true" />
<a-form-item name="username" class="enter-x">
<a-input
size="large"
v-model:value="formData.username"
:placeholder="t('sys.login.userName')"
class="fix-auto-fill"
/>
<a-input size="large" v-model:value="formData.username" :placeholder="t('sys.login.userName')"
class="fix-auto-fill" />
</a-form-item>
<a-form-item name="password" class="enter-x">
<a-input-password
size="large"
visibilityToggle
v-model:value="formData.password"
:placeholder="t('sys.login.password')"
/>
<a-input-password size="large" visibilityToggle v-model:value="formData.password"
:placeholder="t('sys.login.password')" />
</a-form-item>
<a-row class="enter-x">
<a-col :span="12">
<a-form-item>
<!-- 记住我 -->
<!-- <a-col :span="12">
<a-form-item>
<a-checkbox v-model:checked="rememberMe" size="small">
{{ t('sys.login.rememberMe') }}
</a-checkbox>
</a-form-item>
</a-col>
<a-col :span="12">
<a-form-item :style="{ 'text-align': 'right' }">
</a-col> -->
<!-- 忘记密码 -->
<!-- <a-col :span="12">
<a-form-item :style="{ 'text-align': 'right' }">
<a-button type="link" size="small" @click="setLoginState(LoginStateEnum.RESET_PASSWORD)">
{{ t('sys.login.forgetPassword') }}
</a-button>
</a-form-item>
</a-col>
</a-col> -->
</a-row>
<a-form-item class="enter-x">
@ -68,7 +56,7 @@
</a-button>
</a-col> -->
</a-row>
<!--
<!--
<a-divider class="enter-x">{{ t('sys.login.otherSignIn') }}</a-divider>
<div class="flex justify-evenly enter-x" :class="`${prefixCls}-sign-in-way`">
@ -83,77 +71,77 @@
</a-form>
</template>
<script lang="ts" setup>
import { reactive, ref, unref, computed } from 'vue';
import { reactive, ref, unref, computed } from 'vue';
import {
import {
GithubFilled,
WechatFilled,
AlipayCircleFilled,
GoogleCircleFilled,
TwitterCircleFilled,
} from '@ant-design/icons-vue';
import LoginFormTitle from './LoginFormTitle.vue';
import { useI18n } from '@/hooks/web/useI18n';
import { useMessage } from '@/hooks/web/useMessage';
import { useUserStore } from '@/store/modules/user';
import { LoginStateEnum, useLoginState, useFormRules, useFormValid } from './useLogin';
import { useDesign } from '@/hooks/web/useDesign';
import { useModal } from '@/components/Modal';
import { SlideVerifyModal } from '@/components/Verify';
import { getByKey } from '@/api/sys/sysConfig';
import { HashingFactory } from '@/utils/cipher';
const { t } = useI18n();
const { notification } = useMessage();
const { prefixCls } = useDesign('login');
const userStore = useUserStore();
const { setLoginState, getLoginState } = useLoginState();
const { getFormRules } = useFormRules();
const formRef = ref();
const loading = ref<boolean>(false);
const hasError = ref<boolean>(false);
const errorMessage = ref();
const rememberMe = ref<boolean>(false);
//
let loginVerificationCode = true;
getByKey('loginVerificationCode').then((res) => {
} from '@ant-design/icons-vue';
import LoginFormTitle from './LoginFormTitle.vue';
import { useI18n } from '@/hooks/web/useI18n';
import { useMessage } from '@/hooks/web/useMessage';
import { useUserStore } from '@/store/modules/user';
import { LoginStateEnum, useLoginState, useFormRules, useFormValid } from './useLogin';
import { useDesign } from '@/hooks/web/useDesign';
import { useModal } from '@/components/Modal';
import { SlideVerifyModal } from '@/components/Verify';
import { getByKey } from '@/api/sys/sysConfig';
import { HashingFactory } from '@/utils/cipher';
const { t } = useI18n();
const { notification } = useMessage();
const { prefixCls } = useDesign('login');
const userStore = useUserStore();
const { setLoginState, getLoginState } = useLoginState();
const { getFormRules } = useFormRules();
const formRef = ref();
const loading = ref<boolean>(false);
const hasError = ref<boolean>(false);
const errorMessage = ref();
const rememberMe = ref<boolean>(false);
//
let loginVerificationCode = true;
getByKey('loginVerificationCode').then((res) => {
if (res && res.value) {
loginVerificationCode = res.value === 'true';
}
});
});
const formData = reactive({
const formData = reactive({
username: '',
password: '',
});
});
const { validForm } = useFormValid(formRef);
const { validForm } = useFormValid(formRef);
const getShow = computed(() => unref(getLoginState) === LoginStateEnum.LOGIN);
const getShow = computed(() => unref(getLoginState) === LoginStateEnum.LOGIN);
const [registerModal, { openModal: openVerifyModal }] = useModal();
const [registerModal, { openModal: openVerifyModal }] = useModal();
function handleVerifySuccess(captchaVerification) {
function handleVerifySuccess(captchaVerification) {
handleLogin(captchaVerification);
}
}
/**
/**
* 点击登录按钮
*/
function handleLoginClick() {
function handleLoginClick() {
if (loginVerificationCode) {
//
openVerifyModal();
} else {
handleLogin(null);
}
}
}
async function handleLogin(captchaVerification: Nullable<string>) {
async function handleLogin(captchaVerification: Nullable<string>) {
const data = await validForm();
if (!data) return;
try {
@ -181,10 +169,10 @@
} finally {
loading.value = false;
}
}
}
</script>
<style>
.ant-alert {
.ant-alert {
margin-bottom: 10px;
}
}
</style>

2
src/views/auth/personal/center/ChangeEmail.vue

@ -39,7 +39,7 @@
changeOkLoading(true);
const values = await validate();
await applicationBindingEmail(values.email);
createMessage.success('邮件发送成功,请前往邮箱激活邮箱');
// createMessage.success('');
await userStore.refreshCurrentUserAction();
closeModal();
} catch (e) {

4
src/views/auth/personal/center/Security.vue

@ -32,11 +32,11 @@
<Icon :size="26" icon="ant-design:mail-outlined" />
</template>
</a-list-item-meta>
<template #actions>
<!-- <template #actions>
<a-button type="link" @click="openChangeEmailModal(true, {})">
{{ data.email ? '修改' : '绑定' }}
</a-button>
</template>
</template> -->
</a-list-item>
</a-list>

Loading…
Cancel
Save