1

PC-20250623MANY\Administrator

2025-08-09 7043590a8a1d24a4c86472051c103a8e4dc2ddb4

 src/page/login/login.vue

@@ -1,16 +1,30 @@
<template>
  <div class="login_page">
    <headers />
    <!-- <headers /> -->
    <tab-head :leftShow="false" :rightShow="false">
      <van-popover v-model="languageShow" trigger="click" :actions="actions" @select="onSelect" placement="bottom-end">
        <template #reference>
          <div class="multilingual">
            <img src="../../assets/img/language.svg" alt="" />
          </div>
        </template>
      </van-popover>
    </tab-head>

    <img src="../../assets/img/logo.png" alt="" class="logo">

    <div class="login_title animated slideInDown">
      <span>{{ $t("登錄賬號") }}</span>
      <span>{{ $t("dlan") }}</span>
    </div>
    <div class="logins_content">
      <div class="login_forms">
        <div class="top_forms">
          <div class="forms_title">{{ $t('hj27') }}</div>
          <el-input :placeholder="$t('hj9')" :size="medium" v-model="userName" clearable>
          </el-input>
          <el-input style="margin-top: 0.46rem" show-password :placeholder="$t('hj10')" :size="medium"
            v-model="userPassword" @input="handleInput()">
          <div class="forms_title">{{ $t('Password') }}</div>
          <el-input show-password :placeholder="$t('hj10')" :size="medium" v-model="userPassword"
            @input="handleInput()">
          </el-input>
        </div>
        <div class="bottom_btns">
@@ -41,7 +55,8 @@
  </div>
</template>
<script>
import headers from "./components/header.vue";
// import headers from "./components/header.vue";
import tabHead from "../../components/tabHead.vue";
import * as api from "@/axios/api";
import { Notify } from "vant";
import { mapActions, mapMutations } from "vuex";
@@ -57,11 +72,21 @@
      userPassword: "",
      userName: "",
      btnClass: false,
      medium: "medium"
      medium: "medium",
      languageShow: false, // 语言选择
      // 多语言配置
      actions: [
        {
          text: "English",
          lang: "en"
        },
        { text: "español", lang: "es" }
      ],
    };
  },
  components: {
    headers
    // headers, 
    tabHead,
  },
  mounted() {
    const ret = window.localStorage.getItem("login_admin");
@@ -128,7 +153,12 @@
        // 支持
        navigator.vibrate([55]);
      }
    }
    },
    // 选择语言
    onSelect(e) {
      window.localStorage.setItem("language", e.lang);
      this.$i18n.locale = e.lang;
    },
  },
  beforeDestroy() { },
  created() { }
@@ -176,11 +206,11 @@
.login_title {
  font-family: "DINPro", serif;
  font-style: normal;
  font-weight: 500;
  font-size: 0.48rem;
  font-weight: 700;
  font-size: 0.7rem;
  line-height: 0.66667rem;
  color: #14181f;
  margin-left: 0.53333rem;
  text-align: center;
}

/deep/ .van-checkbox__label {
@@ -200,6 +230,22 @@
  display: flex;
  flex-direction: column;
  height: 100vh;

  .multilingual {
    width: .8em;
    height: .8em;
    margin-left: 0.25em;

    img {
      width: 100%;
      height: 100%;
    }
  }
}

.logo {
  width: 50vw;
  margin: 10vw auto 15vw;
}

.logins_content {
@@ -229,6 +275,12 @@
      align-items: center;
      flex-wrap: wrap;

      .forms_title {
        font-size: .4rem;
        margin-top: .5rem;
        margin-bottom: .2rem;
      }

      .user_name,
      .password {
        width: 100%;