perf: use xbutton

This commit is contained in:
xingyu 2022-12-06 21:36:46 +08:00
parent c720b1dff9
commit e442b72706
3 changed files with 33 additions and 21 deletions

View File

@ -17,7 +17,7 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24" style="padding-left: 10px; padding-right: 10px"> <el-col :span="24" style="padding-left: 10px; padding-right: 10px">
<el-form-item prop="tenantName"> <el-form-item prop="tenantName" v-if="loginData.tenantEnable === 'true'">
<el-input <el-input
type="text" type="text"
v-model="loginData.loginForm.tenantName" v-model="loginData.loginForm.tenantName"
@ -69,16 +69,23 @@
<!-- 登录按钮 / 返回按钮 --> <!-- 登录按钮 / 返回按钮 -->
<el-col :span="24" style="padding-left: 10px; padding-right: 10px"> <el-col :span="24" style="padding-left: 10px; padding-right: 10px">
<el-form-item> <el-form-item>
<el-button :loading="loginLoading" type="primary" class="w-[100%]" @click="signIn"> <XButton
{{ t('login.login') }} :loading="loginLoading"
</el-button> type="primary"
class="w-[100%]"
:title="t('login.login')"
@click="signIn()"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="24" style="padding-left: 10px; padding-right: 10px"> <el-col :span="24" style="padding-left: 10px; padding-right: 10px">
<el-form-item> <el-form-item>
<el-button :loading="loginLoading" class="w-[100%]" @click="handleBackLogin"> <XButton
{{ t('login.backLogin') }} :loading="loginLoading"
</el-button> class="w-[100%]"
:title="t('login.backLogin')"
@click="handleBackLogin()"
/>
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
@ -92,8 +99,8 @@ import type { RouteLocationNormalizedLoaded } from 'vue-router'
import { useI18n } from '@/hooks/web/useI18n' import { useI18n } from '@/hooks/web/useI18n'
import { useIcon } from '@/hooks/web/useIcon' import { useIcon } from '@/hooks/web/useIcon'
import { useMessage } from '@/hooks/web/useMessage' import { useMessage } from '@/hooks/web/useMessage'
import { setTenantId, setToken } from '@/utils/auth'
import { required } from '@/utils/formRules' import { required } from '@/utils/formRules'
import { setTenantId, setToken } from '@/utils/auth'
import { usePermissionStore } from '@/store/modules/permission' import { usePermissionStore } from '@/store/modules/permission'
import { getTenantIdByNameApi, sendSmsCodeApi, smsLoginApi } from '@/api/login' import { getTenantIdByNameApi, sendSmsCodeApi, smsLoginApi } from '@/api/login'
import LoginFormTitle from './LoginFormTitle.vue' import LoginFormTitle from './LoginFormTitle.vue'
@ -119,7 +126,7 @@ const rules = {
} }
const loginData = reactive({ const loginData = reactive({
codeImg: '', codeImg: '',
tenantEnable: true, tenantEnable: import.meta.env.VITE_APP_TENANT_ENABLE,
token: '', token: '',
loading: { loading: {
signIn: false signIn: false
@ -169,9 +176,11 @@ watch(
) )
// ID // ID
const getTenantId = async () => { const getTenantId = async () => {
if (loginData.tenantEnable === 'true') {
const res = await getTenantIdByNameApi(loginData.loginForm.tenantName) const res = await getTenantIdByNameApi(loginData.loginForm.tenantName)
setTenantId(res) setTenantId(res)
} }
}
// //
const signIn = async () => { const signIn = async () => {
await getTenantId() await getTenantId()

View File

@ -11,9 +11,7 @@
<el-divider class="enter-x">{{ t('login.qrcode') }}</el-divider> <el-divider class="enter-x">{{ t('login.qrcode') }}</el-divider>
<el-col :span="24" style="padding-left: 10px; padding-right: 10px"> <el-col :span="24" style="padding-left: 10px; padding-right: 10px">
<div class="w-[100%] mt-15px"> <div class="w-[100%] mt-15px">
<el-button class="w-[100%]" @click="handleBackLogin"> <XButton class="w-[100%]" :title="t('login.backLogin')" @click="handleBackLogin()" />
{{ t('sys.login.backSignIn') }}
</el-button>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
@ -21,11 +19,11 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, unref } from 'vue' import { computed, unref } from 'vue'
import { ElRow, ElCol, ElCard, ElDivider } from 'element-plus' import { ElRow, ElCol, ElCard, ElDivider } from 'element-plus'
import { useI18n } from '@/hooks/web/useI18n'
import { useLoginState, LoginStateEnum } from './useLogin'
import LoginFormTitle from './LoginFormTitle.vue'
import { Qrcode } from '@/components/Qrcode' import { Qrcode } from '@/components/Qrcode'
import logoImg from '@/assets/imgs/logo.png' import logoImg from '@/assets/imgs/logo.png'
import { useI18n } from '@/hooks/web/useI18n'
import LoginFormTitle from './LoginFormTitle.vue'
import { useLoginState, LoginStateEnum } from './useLogin'
const { t } = useI18n() const { t } = useI18n()
const { handleBackLogin, getLoginState } = useLoginState() const { handleBackLogin, getLoginState } = useLoginState()

View File

@ -21,14 +21,19 @@
<template #register> <template #register>
<div class="w-[100%]"> <div class="w-[100%]">
<el-button type="primary" class="w-[100%]" :loading="loading" @click="loginRegister"> <XButton
{{ t('login.register') }} :loading="loading"
</el-button> type="primary"
class="w-[100%]"
:title="t('login.register')"
@click="loginRegister()"
/>
</div> </div>
<div class="w-[100%] mt-15px"> <div class="w-[100%] mt-15px">
<el-button class="w-[100%]" @click="handleBackLogin"> <el-button class="w-[100%]" @click="handleBackLogin">
{{ t('login.hasUser') }} {{ t('login.hasUser') }}
</el-button> </el-button>
<XButton class="w-[100%]" :title="t('login.hasUser')" @click="handleBackLogin()" />
</div> </div>
</template> </template>
</Form> </Form>
@ -40,8 +45,8 @@ import { Form } from '@/components/Form'
import { useI18n } from '@/hooks/web/useI18n' import { useI18n } from '@/hooks/web/useI18n'
import { useForm } from '@/hooks/web/useForm' import { useForm } from '@/hooks/web/useForm'
import { useValidator } from '@/hooks/web/useValidator' import { useValidator } from '@/hooks/web/useValidator'
import { useLoginState, LoginStateEnum } from './useLogin'
import LoginFormTitle from './LoginFormTitle.vue' import LoginFormTitle from './LoginFormTitle.vue'
import { useLoginState, LoginStateEnum } from './useLogin'
import { FormSchema } from '@/types/form' import { FormSchema } from '@/types/form'
const { t } = useI18n() const { t } = useI18n()