zuel-itsm-3.0.2/src/views/Login.vue

<template>
  <div class="fle bgColor" v-if="!isSSo">
    <load-ing v-show="requesterLgoinType == 'wechat'"></load-ing>
    <h2
      v-if="requesterLgoinType == 'web'"
      style="font-size: 0.36rem; margin-bottom: 0.36rem; font-weight: 700"
    >
      信息化故障报修
    </h2>
    <div v-if="requesterLgoinType == 'web'" style="width: 5rem">
      <cube-input
        v-model="zhanghao"
        placeholder="您的账号为工号或学号"
      ></cube-input>
      <br />
      <cube-input
        v-model="mima"
        type="password"
        placeholder="您的初始密码为学号或工号后四位"
      ></cube-input>
      <br />
      <cube-button @click="zlogin()" style="background: #005395"
        >登录</cube-button
      >
    </div>
  </div>
</template>

<script>
import { decode } from "js-base64";
import LoadIng from "./../views/loading.vue";
export default {
  data() {
    return {
      zhanghao: "",
      mima: "",
      requesterLgoinType: "",
      isSSo: true // 是否单点登录
    };
  },
  components: {
    LoadIng
  },
  methods: {
    // 登陆
    login() {
      var that = this;
      that.$http.post("service/auth/wechatAuth", {}).then(res => {
        if (res.data.url) {
          window.location.href = res.data.url;
        } else {
          if (res.data.user) {
            localStorage.setItem(
              "loginUser",
              JSON.stringify(res.data.user.requester)
            );
            this.loginNext();
          }
        }
      });
    },
    // 获取code
    getCode() {
      var that = this;
      var url = window.location.href.split("?");
      if (!url[1]) {
        that.login();
      } else {
        var code = {
          code: url[1],
          // name: "微信报修"
        };
        that.$http.post("service/auth/wechatLoginEncrypt", code).then(res => {
          if (res.data.state == 200) {
            if (res.data.user) {
              localStorage.setItem(
                "loginUser",
                JSON.stringify(res.data.user.requester)
              );
              this.loginNext();
            }
          } else if (res.data.state == 501) {
            that
              .$createDialog({
                type: "alert",
                title: "您的账号被删除，请联系管理员",
                icon: "cubeic-alert"
              })
              .show();
          } else {
            that
              .$createDialog({
                type: "alert",
                title: res.data.remarks,
                icon: "cubeic-alert"
              })
              .show();
          }
        });
      }
    },
    loginNext() {
      // seimin
      // 获取报修主体
      this.$http
        .post("service/sysinfo/data/fetchDataList/systemConfiguration", {
          idx: 0,
          sum: 1000,
          systemConfiguration: { keyconfig: "repairMain" }
        })
        .then(result => {
          if (result.data.status == 200) {
            var repairMain = result.data.list[0];
            window.localStorage.setItem(
              "repairMain",
              JSON.stringify(repairMain)
            );
            // 获取是否自动建单
            this.$http
              .post("service/sysinfo/data/fetchDataList/systemConfiguration", {
                idx: 0,
                sum: 1000,
                systemConfiguration: { keyconfig: "reqHasCategory" }
              })
              .then(result => {
                if (result.data.status == 200) {
                  var reqHasCategory = result.data.list[0];
                  window.localStorage.setItem(
                    "reqHasCategory",
                    JSON.stringify(reqHasCategory)
                  );
                  this.$router.push({ path: "/main" });
                }
              });
          }
        });
      // seimin
    },
    // 获取报修人登录方式
    getLoginType() {
      this.$http.post("service/wechat/getLoginType", {}).then(result => {
        if (result.data.status == 200) {
          this.requesterLgoinType = result.data.data;
          window.localStorage.setItem(
            "requesterLgoinType",
            this.requesterLgoinType
          );
          if (this.requesterLgoinType == "wechat") {
            this.getCode();
          } else if (this.requesterLgoinType == "web") {
            // this.$router.push({ path: "/login" });
          }
        }
      });
    },
    // 账号密码登录
    zlogin() {
      console.log(this);
      var that = this;
      var ssoStr = "";
      var ssoJson;
      if (this.isSSo) {
        ssoStr = location.search
          .replace("?", "")
          .split("&")[0]
          .split("=")[1];
        ssoStr = decode(decodeURIComponent(ssoStr));
        ssoJson = JSON.parse(ssoStr);
      }
      var postData = this.isSSo
        ? { username: ssoJson.a, password: ssoJson.r, t: false }
        : { username: this.zhanghao, password: this.mima };
      this.$http.post("service/auth/reqlogin", postData).then(res => {
        that.loading = false;
        if (res.data && res.data.state == 200) {
          localStorage.setItem(
            "loginUser",
            JSON.stringify(res.data.data.requester)
          );
          localStorage.setItem(
            "loginConfig",
            JSON.stringify({ username: this.zhanghao, password: this.mima })
          );
          // 判断是否有区域地点或联系电话，没有则需要补充
          var requester = res.data.data.requester;
          if (!requester.place || !requester.mphone) {
            this.$router.push({ path: "/supplementary" });
          } else {
            this.loginNext();
          }
        } else {
          that
            .$createDialog({
              type: "alert",
              title: "系统错误",
              content: "请稍后再试",
              icon: "cubeic-wrong",
              color: "red"
            })
            .show();
        }
      });
    },
    // 获取查询参数
    getQueryString(name) {
  　　var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
  　　var r = window.location.search.substr(1).match(reg);
  　　if (r != null){
        return unescape(r[2]);
      }
      return null;
    },
  },
  created() {
    localStorage.clear();
    if(location.search.length > 0){
      this.isSSo = Boolean(this.getQueryString('t'));
    }else{
      this.isSSo = false;
    }
    if (this.isSSo) {
      this.zlogin();
    }
    this.getLoginType();
  }
};
</script>

<style scoped>
.color {
  color: red;
  font-size: 1rem;
}
.fle {
  display: flex;
  height: 100vh;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background: url(./../../static/images/weChartBackImage.jpg);
  background-size: cover;
}
/* .bgColor{
    background-color: white
  } */
input {
  border: 0.02rem #999999 solid;
  width: 60%;
  height: 0.8rem;
  margin-top: 0.4rem;
  border-radius: 10px;
  padding-left: 0.24rem;
}
input:nth-child(1) {
  margin-top: 0;
}
input:focus {
  outline: none;
}
.sub {
  width: 40%;
  background-color: rgb(60, 162, 254);
  height: 0.7rem;
  color: white;
  font-size: 0.36rem;
  text-align: center;
  line-height: 0.7rem;
  margin-top: 0.3rem;
  border-radius: 10px;
}
</style>