调整页面显示信息， 修复部分模块选中时会出现两个页签的问题

chenhaozhe

2025-11-20 fef9871c3efaa8ba8f1c4ba09cd3cc8f55a6351d

 src/views/login.vue

@@ -1,48 +1,92 @@
<template>
  <div class="login">
    <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
      <h3 class="title" v-if="!loginForm.HLogoLabel"> 智云迈思L-MOM管理系统</h3>
      <h3 class="title" v-if="!loginForm.HLogoLabel">智云迈思L-MOM管理系统</h3>
      <h3 class="title" v-else>{{ loginForm.HLogoLabel }}</h3>
      <el-form-item label="语言">
        <el-select v-model="loginForm.HTranSlate" :placeholder="languageSel" @change="languageChange">
          <el-option v-for="item in tranSlateList" :key="item.value" :label="item.label" :value="item.value">
        <el-select
          v-model="loginForm.HTranSlate"
          :placeholder="languageSel"
          @change="languageChange"
        >
          <el-option
            v-for="item in tranSlateList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="组织">
        <el-select v-model="loginForm.HOrgName" placeholder="请选择" @change="OrgChange">
          <el-option v-for="item in organizationList" :key="item.ID" :label="item.Name" :value="item.ID">
          <el-option
            v-for="item in organizationList"
            :key="item.ID"
            :label="item.Name"
            :value="item.ID"
          >
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item prop="username">
        <el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
        <el-input
          v-model="loginForm.username"
          type="text"
          auto-complete="off"
          placeholder="账号"
        >
          <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
        </el-input>
      </el-form-item>
      <el-form-item prop="password">
        <el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码"
          @keyup.enter.native="handleLogin">
          <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
        <el-input
          v-model="loginForm.password"
          type="password"
          auto-complete="off"
          placeholder="密码"
          @keyup.enter.native="handleLogin"
        >
          <svg-icon
            slot="prefix"
            icon-class="password"
            class="el-input__icon input-icon"
          />
        </el-input>
      </el-form-item>
      <el-form-item prop="code" v-if="captchaEnabled">
        <el-input v-model="loginForm.code" auto-complete="off" placeholder="验证码" style="width: 63%"
          @keyup.enter.native="handleLogin">
          <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
        <el-input
          v-model="loginForm.code"
          auto-complete="off"
          placeholder="验证码"
          style="width: 63%"
          @keyup.enter.native="handleLogin"
        >
          <svg-icon
            slot="prefix"
            icon-class="validCode"
            class="el-input__icon input-icon"
          />
        </el-input>
        <div class="login-code">
          <img :src="codeUrl" @click="getCode" class="login-code-img" />
        </div>
      </el-form-item>
      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
      <el-form-item style="width:100%;">
        <el-button :loading="loading" size="medium" type="primary" style="width:100%;"
          @click.native.prevent="handleLogin">
      <el-checkbox v-model="loginForm.rememberMe" style="margin: 0px 0px 25px 0px"
        >记住密码</el-checkbox
      >
      <el-form-item style="width: 100%">
        <el-button
          :loading="loading"
          size="medium"
          type="primary"
          style="width: 100%"
          @click.native.prevent="handleLogin"
        >
          <span v-if="!loading">登 录</span>
          <span v-else>登 录 中...</span>
        </el-button>
        <div style="float: right;" v-if="register">
        <div style="float: right" v-if="register">
          <router-link class="link-type" :to="'/register'">立即注册</router-link>
        </div>
      </el-form-item>
@@ -55,18 +99,22 @@
</template>

<script>
import { getCodeImg, getOrganizations, webBaseInfo, webGetDataBases } from "@/api/login"
import Cookies from "js-cookie"
import { encrypt, decrypt } from '@/utils/jsencrypt'
import { getCodeImg, getOrganizations, webBaseInfo, webGetDataBases } from "@/api/login";
import Cookies from "js-cookie";
import { encrypt, decrypt } from "@/utils/jsencrypt";

export default {
  name: "Login",
  data() {
    return {
      tranSlateList: [{ label: '中文', value: '1' }, { label: 'Eeglish', value: '2' }, { label: 'Spanish', value: '3' },],
      tranSlateList: [
        { label: "中文", value: "1" },
        { label: "Eeglish", value: "2" },
        { label: "Spanish", value: "3" },
      ],
      tranData: {},
      languageSel: '语言',
      organizationList: [],//组织列表
      languageSel: "语言",
      organizationList: [], //组织列表
      title: process.env.VUE_APP_TITLE,
      codeUrl: "",
      loginForm: {
@@ -76,47 +124,42 @@
        HOrgName: 1,
        code: "",
        uuid: "",
        HTranSlate: '1',
        HLogoLabel: '智云迈思L-MOM管理系统',
        HTranSlate: "1",
        HLogoLabel: "智云迈思L-MOM管理系统",
        HMenuLabel: null,
        HCusName: null,
        Organization: null,
      },
      loginRules: {
        username: [
          { required: true, trigger: "blur", message: "请输入您的账号" }
        ],
        password: [
          { required: true, trigger: "blur", message: "请输入您的密码" }
        ],
        code: [{ required: true, trigger: "change", message: "请输入验证码" }]
        username: [{ required: true, trigger: "blur", message: "请输入您的账号" }],
        password: [{ required: true, trigger: "blur", message: "请输入您的密码" }],
        code: [{ required: true, trigger: "change", message: "请输入验证码" }],
      },
      loading: false,
      // 验证码开关
      captchaEnabled: false,
      // 注册开关
      register: false,
      redirect: undefined
    }
      redirect: undefined,
    };
  },
  watch: {
    $route: {
      handler: function (route) {
        this.redirect = route.query && route.query.redirect
        this.redirect = route.query && route.query.redirect;
      },
      immediate: true
    }
      immediate: true,
    },
  },
  created() {
    // this.getCode()
    this.getInfoData()
    this.getCookie()    
    this.getInfoData();
    this.getCookie();
  },
  methods: {
   
    //语言的选择
    languageChange() {
      this.loginForm.HCusName = this.tranData.HCusName
      this.loginForm.HCusName = this.tranData.HCusName;
      if (this.loginForm.HTranSlate == "1" || !this.loginForm.HTranSlate) {
        this.loginForm.HLogoLabel = this.tranData.HLogoLabel;
        this.loginForm.HMenuLabel = this.tranData.HMenuLabel;
@@ -129,94 +172,100 @@
      }
    },
    OrgChange(val) {
      this.organizationList.map(item => {
      this.organizationList.map((item) => {
        if (item.ID == val) {
          this.loginForm.Organization = item.Name
          this.loginForm.Organization = item.Name;
        }
      })
      });
    },
    //数据
    getInfoData() {
      //组织列表
      getOrganizations().then(res => {
      getOrganizations().then((res) => {
        if (res.count == 1) {
          this.organizationList = res.data
          this.organizationList = res.data;
          sessionStorage[this.organizationList] = res.data;
          this.$nextTick(() => {
            this.OrgChange(this.loginForm.HOrgName)
          })
            this.OrgChange(this.loginForm.HOrgName);
          });
        }
      })
      });
      //语言
      webBaseInfo().then(res => {
      webBaseInfo().then((res) => {
        if (res.count == 1) {
          this.tranData = res.data[0];
          this.$nextTick(() => {
            this.languageChange()
          })
            this.languageChange();
          });
        }
      })
      });
      //数据库
      webGetDataBases().then(res => {
      webGetDataBases().then((res) => {
        if (res.count == 1) {
          sessionStorage["数据库"] = res.data[0].Name
          sessionStorage["数据库"] = res.data[0].Name;
        }
      })
      });
    },
    getCode() {
      getCodeImg().then(res => {
        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled
      getCodeImg().then((res) => {
        this.captchaEnabled =
          res.captchaEnabled === undefined ? true : res.captchaEnabled;
        if (this.captchaEnabled) {
          this.codeUrl = "data:image/gif;base64," + res.img
          this.loginForm.uuid = res.uuid
          this.codeUrl = "data:image/gif;base64," + res.img;
          this.loginForm.uuid = res.uuid;
        }
      })
      });
    },
    getCookie() {
      const username = Cookies.get("username")
      const password = Cookies.get("password")
      const HOrgName = Cookies.get('HOrgName')
      const HTranSlate = Cookies.get('HTranSlate')
      const rememberMe = Cookies.get('rememberMe')
      const username = Cookies.get("username");
      const password = Cookies.get("password");
      const HOrgName = Cookies.get("HOrgName");
      const HTranSlate = Cookies.get("HTranSlate");
      const rememberMe = Cookies.get("rememberMe");
      this.loginForm = {
        HOrgName: HOrgName === undefined ? this.loginForm.HOrgName - 0 : HOrgName - 0,
        username: username === undefined ? this.loginForm.username : username,
        password: password === undefined ? this.loginForm.password : decrypt(password),
        HTranSlate: HTranSlate === undefined ? this.loginForm.HTranSlate : HTranSlate,
        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
      }
        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
      };
    },
    handleLogin() {
      this.$refs.loginForm.validate(valid => {
      this.$refs.loginForm.validate((valid) => {
        if (valid) {
          this.loading = true
          this.loading = true;
          if (this.loginForm.rememberMe) {
            Cookies.set("HTranSlate", this.loginForm.HTranSlate, { expires: 30 })
            Cookies.set("HOrgName", this.loginForm.HOrgName, { expires: 30 })
            Cookies.set("username", this.loginForm.username, { expires: 30 })
            Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 })
            Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 })
            Cookies.set("HTranSlate", this.loginForm.HTranSlate, { expires: 30 });
            Cookies.set("HOrgName", this.loginForm.HOrgName, { expires: 30 });
            Cookies.set("username", this.loginForm.username, { expires: 30 });
            Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
            Cookies.set("rememberMe", this.loginForm.rememberMe, { expires: 30 });
          } else {
            Cookies.remove("HTranSlate")
            Cookies.remove("HOrgName")
            Cookies.remove("username")
            Cookies.remove("password")
            Cookies.remove('rememberMe')
            Cookies.remove("HTranSlate");
            Cookies.remove("HOrgName");
            Cookies.remove("username");
            Cookies.remove("password");
            Cookies.remove("rememberMe");
          }

          this.$store.dispatch("Login", this.loginForm).then(res => {
            this.$router.push({ path: this.redirect || "/" }).catch(() => { })
          }).catch(() => {
            this.loading = false
            if (this.captchaEnabled) {
              this.getCode()
            }
          })
          this.$store
            .dispatch("Login", this.loginForm)
            .then((res) => {
              this.$router.push({ path: this.redirect || "/" }).catch((err) => {
                console.error(err);
              });
            })
            .catch(() => {
              this.loading = false;
              if (this.captchaEnabled) {
                this.getCode();
              }
            });
        }
      })
    }
      });
    },
  },
}
};
</script>

<style rel="stylesheet/scss" lang="scss">