examcloud-admin-web/src/modules/portal/views/home/HomeSide.vue

<template>
  <el-aside width="200px">
    <el-menu
      default-active="2"
      class="el-menu-vertical-demo"
      background-color="#545c64"
      text-color="#fff"
      active-text-color="#ffd04b"
    >
      <el-submenu index="1">
        <template slot="title">
          <i class="el-icon-location"></i> <span>基础信息</span>
        </template>
        <el-menu-item-group>
          <template slot="title"
            >分组一</template
          >
          <el-menu-item index="1-1">选项1</el-menu-item>
          <el-menu-item index="1-2">选项2</el-menu-item>
        </el-menu-item-group>
        <el-menu-item-group title="分组2">
          <el-menu-item index="1-3">选项3</el-menu-item>
        </el-menu-item-group>
        <el-submenu index="1-4">
          <template slot="title"
            >选项4</template
          >
          <el-menu-item index="1-4-1">选项1</el-menu-item>
        </el-submenu>
      </el-submenu>
      <el-menu-item index="2">
        <i class="el-icon-menu"></i> <span slot="title">考务</span>
      </el-menu-item>
      <el-menu-item index="3">
        <i class="el-icon-document"></i> <span slot="title">题库</span>
      </el-menu-item>
      <el-menu-item index="4">
        <i class="el-icon-setting"></i> <span slot="title">网考</span>
      </el-menu-item>
      <el-menu-item index="5">
        <i class="el-icon-setting"></i> <span slot="title">阅卷</span>
      </el-menu-item>
      <el-menu-item index="6">
        <v-icon name="print" class="el-icon-" />
        <span slot="title">印刷</span>
      </el-menu-item>
      <el-menu-item index="7">
        <v-icon name="flag" class="el-icon-" />
        <span slot="title">报表</span>
      </el-menu-item>
    </el-menu>
  </el-aside>
</template>

<script>
import { mapActions, mapState } from "vuex";
import { USER_SIGNOUT } from "../../store/user";
import { core_api } from "../../constants/constants";

export default {
  name: "HomeSide",
  data() {
    var validatePass = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入密码"));
      } else {
        if (this.passForm.checkPass !== "") {
          this.$refs.passForm.validateField("checkPass");
        }
        callback();
      }
    };
    var validatePass2 = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("请输入确认密码"));
      } else if (value !== this.passForm.pass) {
        callback(new Error("两次输入密码不一致!"));
      } else {
        callback();
      }
    };
    return {
      menuList: [],
      userDialog: false,
      passForm: { pass: "", checkPass: "" },
      passRules: {
        pass: [{ validator: validatePass, trigger: "blur" }],
        checkPass: [{ validator: validatePass2, trigger: "blur" }]
      }
    };
  },
  computed: {
    ...mapState({ user: state => state.user })
  },
  methods: {
    ...mapActions([USER_SIGNOUT]),
    openUserDialog() {
      this.passForm = { pass: "", checkPass: "" };
      this.userDialog = true;
    },
    //保存密码
    submitForm() {
      this.$refs.passForm.validate(valid => {
        if (valid) {
          var userId = this.user.userId;
          var password = encodeURIComponent(this.passForm.pass);
          var url =
            core_api +
            "/user/password?userId=" +
            userId +
            "&password=" +
            password;
          this.$http.put(url).then(() => {
            this.$notify({
              type: "success",
              message: "修改密码成功！"
            });
            this.resetForm();
            this.userDialog = false;
          });
        } else {
          console.log("error submit!");
          return false;
        }
      });
    },
    //重置
    resetForm() {
      this.$refs.passForm.resetFields();
    },
    isSuperAdmin() {
      if (!this.user.roleList) {
        return false;
      }
      for (let role of this.user.roleList) {
        if (role.roleCode == "SUPER_ADMIN") {
          return true;
        }
      }
      return false;
    },
    logout() {
      this.$http
        .post(core_api + "/auth/logout")
        .then(() => {
          const orgId = this.user.rootOrgId;
          this.USER_SIGNOUT();
          window.name = "";
          this.$router.replace({
            path: "/login" + "?orgId=" + orgId
          });
        })
        .catch(response => {
          const orgId = this.user.rootOrgId;
          if (response.status == 500) {
            this.$notify({
              showClose: true,
              message: response.data.desc,
              type: "error"
            });
          }
          this.USER_SIGNOUT();
          window.name = "";
          this.$router.replace({
            path: "/login" + "?orgId=" + orgId
          });
        });
    }
  },
  created() {
    var url = core_api + "/rolePrivilege/getUserPrivileges";
    const params = new URLSearchParams();
    params.append("groupCode", "PORTAL_MENUS");
    params.append("full", false);
    this.$http
      .post(url, params, {
        headers: { "content-type": "application/x-www-form-urlencoded" }
      })
      .then(response => {
        this.menuList = response.data;
      })
      .catch(response => {
        if (response.status == 500) {
          this.$notify({
            showClose: true,
            message: response.data.desc,
            type: "error"
          });
        }
      });
  }
};
</script>

<style lang="css" scoped>
.el-menu-vertical-demo {
  height: calc(100vh - 60px);
}
.el-aside {
  background-color: #D3DCE6;
  color: #333;
  line-height: 200px;
}
</style>