wcs_client_kate_suzhou/src/view/page/JumpPage.vue

<!--  -->
<template>
  <div>

  </div><div class='formBorderMid'>
  <div class='mainTitle'>WCS 设备控制系统</div>
  <div>您的管理员已经禁止直接登陆，请使用主程序跳转</div>
</div>
</template>

<script>
// import  《组件名称》  from '《组件路径》 ';


import {ElMessage, ElMessageBox} from "element-plus";
import userApi from "@/axios/user";
import router from "@/router";

export default {
  // import 引入的组件需要注入到对象中才能使用
  components: {},
  props: [],
  emits: [],
  data() {
    // 这里存放数据
    return {
      loginUser: {
        userId: '',
        userPassword: ''
      },
      loading: false
    }
  },
  // 计算属性 类似于 data 概念
  computed: {},
  // 监控 data 中的数据变化
  watch: {},
  // 方法集合
  methods: {
    // 登陆按钮
    onSubmit(userName) {
      this.loading = true
      userApi.login(this.loginUser).then((response) => {
        const data = response.data
        if(data.code !== 0) {
          // 服务器返回失败
          ElMessageBox.alert(`登陆失败，信息：${data.msg}`, '登陆失败', {
            confirmButtonText: '确定'
          }).catch(()=>{ })
        } else {
          // 登陆成功
          ElMessage({
            message: '登陆成功',
            type: 'success',
          })
          const returnData = data['returnData']
          window.sessionStorage.setItem("userName", returnData.userName)
          window.sessionStorage.setItem("token", returnData.token)
          let userInfo = { userId: this.loginUser.userId, userName: userName}
          this.$store.commit('setUserInfo', userInfo)
          this.loadMenu(returnData.menu) // 加载菜单
          router.push({name: 'wcs'})
        }
        this.loading = false
      }).catch((err) => {
        ElMessageBox.alert(`请求登陆失败，异常信息：${err}`, '登陆失败', {
          type: 'warning',
          confirmButtonText: '确定'
        }).catch(()=>{ })
        this.loading = false
      })
    },
    // 加载菜单
    loadMenu(menu) {
      if(menu === undefined || menu.length < 1) {
        return
      }
      this.$store.commit('setMenuData', menu)
      let menuList = []
      menu.forEach((menuItem, index) => {
        const minor = menuItem.minor
        if(minor === undefined || minor.length < 1) {
          return
        }
        minor.forEach((minorItem, index) => {
          menuList.push(minorItem)
        })
      })
      this.$store.commit('setMenuList', menuList)
      window.sessionStorage.setItem("menuList", JSON.stringify(menuList))
    }
  },
  // 组合式 API
  setup() {
  },
  // 创建之前
  beforeCreate() {
  },
  // 创建完成(可以访问 this 实例)
  created() {
    this.$store.commit('resetMenuData');
    this.$store.commit('resetTabs');

    // 检测url，用于从其他页面直接跳转
    const url = window.location.href
    if (url.includes("?")) {
      const info = url.split("?")[1];
      const userNameInfo = info.split("=");
      if (userNameInfo.length < 1) {
        return;
      }
      const userName = userNameInfo[1];
      this.loginUser.userPassword = 'user';
      this.loginUser.userId = 'user';
      this.onSubmit(userName);
    }
  },
  // 生命周期 - 挂载之前
  beforeMount() {
  },
  // 生命周期 - 挂载完成（可以访问 DOM 元素）
  mounted() {
  },
  // 更新之前
  beforeUpdate() {
  },
  // 更新之后
  updated() {
  },
  // 销毁之前
  beforeUnmount() {
  },
  // 销毁完成
  unmounted() {
  }
}
</script>

<style lang="scss" scoped>
.formBorderMid {
  border: #6b778c50 1px solid;
  border-radius: 15px;
  margin: 250px auto auto auto;
  padding: 30px;
  width: 500px;
}
.mainTitle {
  font-size: 25px;
  margin: auto auto 45px auto;
  text-align: center;
}

</style>