login.vue

<template>
  <div id="login_box" @click.ctrl.meta.alt="manager">
    <el-row type="flex" justify="center" align="middle" style="height:80%">
      <el-card class="box-card" shadow="hover" style="min-width:25%">
        <div slot="header" style="text-align:center" class="clearfix">
          <span style="font-size:24px">合同管理系统</span>
        </div>
        <div>
          <p id="fankui">使用中出现任何问题请及时反馈</p>
        </div>
        <el-form id="aa" ref="login_form" :model="form" :rules="rules" label-width="60px" label-position="top">
          <el-form-item prop="username">
            <el-input v-model="form.username">
              <template slot="prepend">姓名</template>
            </el-input>
          </el-form-item>
          <el-form-item prop="password">
            <el-input :type="password_type" v-model="form.password" auto-complete="off" @keyup.enter.native="submitForm('login_form')">
              <template slot="prepend">密码</template>
              <el-button slot="append" :icon="view_password" @click="show_password"></el-button>
            </el-input>
          </el-form-item>
          <el-form-item>
            <el-button-group>
              <el-button type="primary" @click="submitForm('login_form')">提交</el-button>
              <el-button @click="resetForm('login_form')">重置</el-button>
            </el-button-group>
          </el-form-item>
        </el-form>
      </el-card>
    </el-row>
  </div>
</template>

<script>
  export default {
    name: "login",
    data() {
      return {
        password_type: "password",
        view_password: "icon i-password-not-view",
        contract_base_url: this.$disparch_data.contract_base_url,
        code_base_url: this.$disparch_data.code_base_url,
        auth_base_url: this.$disparch_data.auth_base_url,
        net_error: false,
        form: {
          username: "",
          password: ""
        },
        rules: {
          username: [{ required: true, message: "请输入用户名", trigger: "blur" }]
          // password: [
          //   { required: true, message: "请输入登录密码", trigger: "blur" }
          // ]
        }
      };
    },
    methods: {
      show_password() {
        if (this.password_type == "password") {
          (this.password_type = "text"),
            (this.view_password = "icon i-password-view");
        } else {
          (this.password_type = "password"),
            (this.view_password = "icon i-password-not-view");
        }
      },
      submitForm(form) {
        this.$refs[form].validate(valid => {
          if (valid) {
            this.$Axios({
              method: "post",
              url: this.auth_base_url + "users/login",
              headers: { "Content-Type": "application/json" },
              data: {
                user_type: "user",
                username: this.form.username,
                password: this.form.password
              }
            })
              .then(res => {
                if (res.data.ecode) {
                  this.$message({
                    message: res.data.enote,
                    type: "error"
                  });
                } else {
                  window.localStorage.setItem("username", this.form.username);
                  sessionStorage.setItem("login_check", true);
                  sessionStorage.setItem("user_unid", res.data.user_unid);
                  sessionStorage.setItem("rtoken", res.data.rtoken);
                  sessionStorage.setItem(
                    "user_roles",
                    JSON.stringify(res.data.roles)
                  );
                  sessionStorage.setItem("user_name", res.data.user_name);
                  this.get_provinces();
                  this.get_contract_state_data();
                  this.get_contract_type_data();
                  this.get_amount_state_unid_data();
                  this.get_mainten_start_point_data();
                  this.get_product_line_type_data();
                  this.get_payment_type_data();
                  this.$router.push({ path: "/nav/main" });
                }
              })
              .catch(err => {
                this.$message({
                  message: "登录错误",
                  type: "error"
                });
              });
          }
        });
      },
      resetForm(form) {
        this.$refs[form].resetFields();
      },
      is_login() {},
      get_provinces() {
        this.$Axios({
          method: "get",
          url: this.code_base_url + "countries/0E229CD043/provinces"
        })
          .then(response => {
            sessionStorage.setItem(
              "provinces",
              JSON.stringify(response.data.list_data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      get_contract_state_data() {
        this.$Axios({
          method: "get",
          url: this.code_base_url + "custom/cates/13BEFACBCF/codes"
        })
          .then(res => {
            sessionStorage.setItem(
              "contract_state_data",
              JSON.stringify(res.data.list_data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      get_contract_type_data() {
        this.$Axios({
          method: "get",
          url: this.code_base_url + "custom/cates/8EC31D08A0/codes"
        })
          .then(res => {
            sessionStorage.setItem(
              "contract_type_data",
              JSON.stringify(res.data.list_data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      get_amount_state_unid_data() {
        this.$Axios({
          method: "get",
          url: this.code_base_url + "custom/cates/42407C5EF2/codes"
        })
          .then(res => {
            sessionStorage.setItem(
              "amount_state_unid_data",
              JSON.stringify(res.data.list_data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      get_mainten_start_point_data() {
        this.$Axios({
          method: "get",
          url: this.code_base_url + "custom/cates/55B997D596/codes"
        })
          .then(res => {
            sessionStorage.setItem(
              "mainten_start_point_data",
              JSON.stringify(res.data.list_data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      get_product_line_type_data() {
        this.$Axios({
          method: "get",
          url: this.code_base_url + "custom/cates/4FC51AD3C9/codes"
        })
          .then(res => {
            sessionStorage.setItem(
              "product_line_type_data",
              JSON.stringify(res.data.list_data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      get_payment_type_data() {
        this.$Axios({
          method: "get",
          url: this.code_base_url + "custom/cates/215649FB93/codes"
        })
          .then(res => {
            sessionStorage.setItem(
              "payment_type_data",
              JSON.stringify(res.data.list_data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      get_salesperson() {
        this.$Axios({
          method: "get",
          url: this.auth_base_url + "users",
          params: {
            norm_type: "employee"
          }
        })
          .then(response => {
            sessionStorage.setItem(
              "salesperson_unid_selected_data",
              JSON.stringify(response.data.list_data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      get_contract_unid() {
        this.$Axios({
          method: "get",
          url: this.contract_base_url + "codes"
        })
          .then(response => {
            sessionStorage.setItem(
              "contract_unid_selected_data",
              JSON.stringify(response.data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      get_projects() {
        this.$Axios({
          method: "get",
          url: this.contract_base_url + "projects",
          headers: { "Content-Type": "application/json" }
        })
          .then(response => {
            sessionStorage.setItem(
              "project_unid_selected_data",
              JSON.stringify(response.data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      },
      manager() {
        sessionStorage.setItem("manager", "1");
        sessionStorage.setItem("login_check", "1");
        this.get_provinces();
        this.get_contract_state_data();
        this.get_contract_type_data();
        this.get_amount_state_unid_data();
        this.get_mainten_start_point_data();
        this.get_product_line_type_data();
        this.get_payment_type_data();
        this.$router.push({ path: "/nav/main" });
      },
      get_customers() {
        this.$Axios({
          method: "get",
          url: this.contract_base_url + "customers",
          headers: { "Content-Type": "application/json" }
        })
          .then(response => {
            sessionStorage.setItem(
              "customer_unid_selected_data",
              JSON.stringify(response.data)
            );
          })
          .catch(err => {
            this.$router.push({ path: "/" });
            this.$message({
              message: "网络错误",
              type: "error"
            });
          });
      }
    },
    mounted() {
      this.form.username = localStorage.getItem("username");
    }
  };
</script>

<style scoped>
#login_box {
  height: 100%;
}
#fankui {
  text-align: center;
  margin-top: 0;
}
</style>