<!--
|
* @Author: husq 931347610@qq.com
|
* @Date: 2023-09-13 18:21:08
|
* @LastEditors: GuLiMmo 2820890765@qq.com
|
* @LastEditTime: 2024-08-27 16:20:14
|
* @FilePath: /drone-web/src/pages/page-web/index.vue
|
* @Description:
|
*
|
* Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
|
-->
|
<template>
|
<div class="login flex-column flex-justify-center flex-align-center m0 b0">
|
<a-image :preview="false" style="width: 17vw; height: 10vw; margin-bottom: 50px" :src="djiLogo" />
|
<p class="fz35 pb50" style="color: #2d8cf0">无人机操作系统</p>
|
<a-form layout="inline" :model="formState" class="flex-row flex-justify-center flex-align-center">
|
<a-form-item>
|
<a-input v-model:value="formState.username" placeholder="请输入用户名">
|
<template #prefix>
|
<UserOutlined style="color: rgba(0, 0, 0, 0.25)" />
|
</template>
|
</a-input>
|
</a-form-item>
|
<a-form-item>
|
<a-input v-model:value="formState.password" type="password" placeholder="请输入密码">
|
<template #prefix>
|
<LockOutlined style="color: rgba(0, 0, 0, 0.25)" />
|
</template>
|
</a-input>
|
</a-form-item>
|
<a-form-item>
|
<a-button class="m0" type="primary" html-type="submit" :disabled="loginBtnDisabled" @click="onSubmit">
|
登录
|
</a-button>
|
</a-form-item>
|
</a-form>
|
<div class="page-ba"><a href="http://beian.miit.gov.cn/" target="_blank">赣ICP备18011362号-3</a></div>
|
</div>
|
</template>
|
|
<script lang="ts" setup>
|
import djiLogo from '/@/assets/loginBg.jpg'
|
import { LockOutlined, UserOutlined } from '@ant-design/icons-vue'
|
import { message } from 'ant-design-vue'
|
import { reactive, computed, UnwrapRef } from 'vue'
|
import { login, LoginBody } from '/@/api/manage'
|
import { getRoot } from '/@/root'
|
import { ELocalStorageKey, ERouterName, EUserType } from '/@/types'
|
import { encrypt, decrypt } from '/@/utils/crypto'
|
import router from '/@/router'
|
import { useMyStore } from '/@/store'
|
|
const root = getRoot()
|
|
const store = useMyStore()
|
|
const formState: UnwrapRef<LoginBody> = reactive({
|
// 租户ID
|
tenantId: '000000',
|
// 部门ID
|
deptId: '',
|
// 角色ID
|
roleId: '',
|
// 用户名
|
username: '',
|
// 密码
|
password: '',
|
// 账号类型
|
type: 'account',
|
// 验证码的值
|
code: '',
|
// 验证码的索引
|
key: '',
|
// 预加载白色背景
|
image: 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7',
|
flag: EUserType.Web,
|
})
|
|
const loginBtnDisabled = computed(() => {
|
return !formState.username || !formState.password
|
})
|
|
const onSubmit = async () => {
|
store
|
.dispatch('LoginByUsername', formState)
|
.then((res) => {
|
root.$router.push(ERouterName.PROJECT_LIST)
|
})
|
.catch(() => {
|
})
|
// const password = encrypt(formState.password)
|
// const result = await login(formState)
|
// if (result.code === 0) {
|
// localStorage.setItem(ELocalStorageKey.Token, result.data.access_token)
|
// localStorage.setItem(ELocalStorageKey.WorkspaceId, result.data.workspace_id)
|
// localStorage.setItem(ELocalStorageKey.Username, result.data.username)
|
// localStorage.setItem(ELocalStorageKey.UserId, result.data.user_id)
|
// localStorage.setItem(ELocalStorageKey.Flag, EUserType.Web.toString())
|
// root.$router.push(ERouterName.PROJECT_LIST)
|
// } else {
|
// message.error(result.message)
|
// }
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
@import '/@/styles/index.scss';
|
|
.login {
|
background-color: $dark-highlight;
|
height: 100vh;
|
position: relative;
|
.page-ba {
|
position: absolute;
|
bottom: 10px;
|
color: white;
|
}
|
}
|
|
</style>
|
