吉安感知网项目-前端
shuishen
2026-01-08 5f7b4be87d2a9567f1c26567acf7feb95ec1407e
uniapps/work-app/src/pages/login/index.vue
@@ -2,18 +2,19 @@
<template>
  <view class="login-form-wrap">
    <image class="logo" :src="logoSvg" />
    <div class="title">掌控智飞</div>
    <div class="title">低空经济服务一体化平台系统</div>
    <div class="user-name">
      <image :src="usernameSvg" />
      <!-- <image :src="usernameSvg" /> -->
      <input v-model="loginForm.username" placeholder="请输入用户名" />
    </div>
    <div class="pass-word">
      <image :src="passwordSvg" />
      <!-- <image :src="passwordSvg" /> -->
      <input
        v-model="loginForm.password"
        type="password"
        placeholder="请输入密码"
      />
      <image :src="showPasswordSvg" />
    </div>
    <div class="remember-password">
      <label>
@@ -26,10 +27,16 @@
        </checkbox-group>
        记住密码
      </label>
      <div>忘记密码?</div>
    </div>
    <button class="login-btn" :style="[inputStyle]" @tap="submit">登录</button>
    <image class="lowerRightCorner" :src="droneSvg" />
    <view class="agreement">
      <label>
        <checkbox :checked="agreed" @click="agreed = !agreed" />
        同意《用户协议》与《隐私政策》
      </label>
    </view>
  </view>
</template>
@@ -40,12 +47,17 @@
import { useUserStore } from "@/store/index.js";
import { HOME_PATH, LOGIN_PATH, removeQueryString } from "@/router";
import { onMounted } from "vue";
import { ref } from "vue";
import logoSvg from "@/static/images/logo.svg";
import showPasswordSvg from "@/static/images/show-password.svg";
const droneSvg = getAssetsImage("/images/login/droneSvg.svg");
const usernameSvg = getAssetsImage("/images/login/username.svg");
const passwordSvg = getAssetsImage("/images/login/password.svg");
const logoSvg = getAssetsImage("/images/login/logo.svg");
// const logoSvg = getAssetsImage("/images/login/logo.svg");
const agreed = ref(true);
const userStore = useUserStore();
const loginForm = ref({
@@ -110,20 +122,23 @@
      userInfo.deptId,
      userInfo.roleId,
      userInfo.username,
      md5(userInfo.password),
      // md5(userInfo.password),
      userInfo.password,
      userInfo.type,
      userInfo.key,
      userInfo.code
    );
    userStore.setUserInfo(res.data);
    userStore.setUserInfo(res.data.data);
    uni.reLaunch({
      url: "/pages/map/index",
      url: "/pages/work/index",
    });
  } catch (error) {
    const errorMsg =
      error.data?.error_description !== "Bad credentials"
        ? error.data?.error_description
        : "登录失败,请重试";
      error.data?.msg
        ? error.data.msg
        : (error.data?.error_description && error.data.error_description !== "Bad credentials")
          ? error.data.error_description
          : "登录失败,请重试";
    uni.showToast({
      title: errorMsg,
      icon: "none",
@@ -175,18 +190,20 @@
  .title {
    font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
    font-weight: 400;
    font-size: 84rpx;
    font-size: 52rpx;
    line-height: 82rpx;
    letter-spacing: 1px;
    text-shadow: 0px 8px 8px rgba(0, 0, 0, 0.18);
    text-align: center;
    font-style: normal;
    text-transform: none;
    color: #1452d3;
    color: #161B2C;
    text-align: center;
    margin-bottom: 168rpx;
  }
.user-name{
  margin-bottom: 40rpx;
}
  .user-name,
  .pass-word {
    display: flex;
@@ -194,8 +211,10 @@
    align-items: center;
    margin-left: 62rpx;
    margin-right: 58rpx;
    height: 118rpx;
    border-bottom: 2rpx solid #e3e3e3;
    height: 100rpx;
    background: #F1F4F9;
    border-radius: 8rpx 8rpx 8rpx 8rpx;
    padding: 0 22rpx;
    image {
      width: 40rpx;
@@ -229,7 +248,7 @@
  .remember-password {
    display: flex;
    justify-content: flex-end;
    justify-content:space-between;
    align-items: center;
    margin-left: 62rpx;
    margin-right: 58rpx;
@@ -268,6 +287,21 @@
    }
  }
  .wechat-login-btn {
    z-index: 1;
    @apply flex items-center justify-center py-12rpx px-0 text-30rpx border-none;
    background: #07C160;
    color: white;
    width: 590rpx;
    height: 76rpx;
    border-radius: 40rpx 40rpx 40rpx 40rpx;
    margin-top: 30rpx;
    &::after {
      @apply border-none;
    }
  }
  .alternative {
    @apply flex justify-between mt-30rpx;
    color: $u-tips-color;
@@ -291,4 +325,14 @@
    color: $u-warning;
  }
}
.agreement {
  position: absolute;
  bottom: 40rpx;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
</style>