feat: 服务名修改

罗广辉

2025-06-19 f27ca082eb0a839449dd50c49007b58e5ed6946f

 src/pages/page-web/index.vue

@@ -1,52 +1,44 @@
<!--
 * @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
      style="width: 17vw; height: 10vw; margin-bottom: 50px"
      :src="djiLogo"
    />
    <p class="fz35 pb50" style="color: #2d8cf0">Cloud API Demo</p>
    <a-form
      layout="inline"
      :model="formState"
      class="flex-row flex-justify-center flex-align-center"
    >
  <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="Username">
          <template #prefix
            ><UserOutlined style="color: rgba(0, 0, 0, 0.25)"
          /></template>
        <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="Password"
        >
          <template #prefix
            ><LockOutlined style="color: rgba(0, 0, 0, 0.25)"
          /></template>
        <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"
        >
          Login
        <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/icons/dji_logo.png'
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'
@@ -55,36 +47,73 @@
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({
  username: 'admin',
  password: 'Yes@!#$20230523',
  // flag: EUserType.Web,
  // 租户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 (e: any) => {
  const password = encrypt(formState.password)
  const result = await login({ ...formState, password })
  if (result.success) {
    localStorage.setItem(ELocalStorageKey.Token, result.data.token)
    localStorage.setItem(ELocalStorageKey.Username, result.data.user.username)
    localStorage.setItem(ELocalStorageKey.UserInfo, JSON.stringify(result.data.user))
    root.$router.push(ERouterName.PROJECT_LIST)
  }
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>