spfm-market-front/src/components/p-header.vue

<template>
  <div class="p-header">
    <!-- <div class="title" @click="menuClose">
      <i v-if="this.$store.state.collapse" class="el-icon-s-fold"></i
      ><i v-else class="el-icon-s-unfold"></i>
    </div> -->
    <!-- <div
      class="title"
      v-for="(item, index) in routeChecked"
      :key="index"
      :style="item.rountPath == $store.state.defaultActive ? 'color:white' : ''"
      @click="change(index, item)"
    >
      <span :class="item.icon"></span>{{ item.name }}
    </div> -->
    <div class="headerspan">
      <!-- <span>市场经济管理平台</span> -->
      <img
        :src="
          parentorgid === '00440063000000000000'
            ? require('../assets/newlogo2.png')
            : require('../assets/newlogo.png')
        "
        style="text-align: center; vertical-align: middle"
        alt=""
      />
    </div>

    <div class="bars">
      <div class="bars-item" @click="handleGoToCalendar">
        <i class="el-icon-date"></i>
        日历
      </div>
      <div class="bars-item user-info">你好{{ username }}</div>

      <div class="bars-item" @click="handleHelp">
        <i class="el-icon-time"></i>
        {{ $formatDate(date, "YYYY-MM-DD") }}
      </div>
      <div class="bars-item" @click="handleGoToKnowledge">
        <i class="el-icon-chat-dot-round"></i>
        知识库
      </div>
      <div class="bars-item" @click="handleLogout">
        <!-- <i class="el-icon-guide"></i> -->
        <svg
          t="1654163202752"
          class="icon"
          viewBox="0 0 1024 1024"
          version="1.1"
          xmlns="http://www.w3.org/2000/svg"
          p-id="9307"
          id="mx_n_1654163202756"
          width="18"
          height="18"
        >
          <path
            d="M768 819.2h-256V204.8L256 102.4h512v102.4h102.4V0H0v819.2l512 204.8v-102.4h358.4v-204.8h-102.4v102.4z"
            p-id="9308"
            fill="#ffffff"
          ></path>
          <path
            d="M1024 460.8l-256-153.6v102.4h-204.8v102.4h204.8v102.4l256-153.6z"
            p-id="9309"
            fill="#ffffff"
          ></path>
        </svg>
        <span>退出</span>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    username: {
      required: false,
      type: String,
      default: "admin",
    },
  },
  data() {
    return {
      parentorgid: "",
      currentIndex: "5",
      date: new Date(),
      routeChecked: [
        {
          name: "数据视图",
          icon: "iconfont icon-icon_huabanfuben",
          rountPath: "/funcInit",
        },
        {
          name: "网格视图",
          icon: "iconfont icon-wanggeshezhi",
          rountPath: "/loginInit",
        },
        {
          name: "工作台",
          icon: "iconfont icon-gongzuotai",
          rountPath: "/excel",
        },
      ],
    };
  },
  created() {
    this.runInitDate();
    // if (!this.collapse) {
    //   this.$store.commit("setCollapse");
    // }
    //this.menuClose();
    this.getDept();
    
  },
  methods: {
    getDept() {
      this.$http({
        url: "/sysmgr/csysdept/queryGroupListByLoginNo",
        method: "post",
        headers: {
          "Content-Type": "application/json",
        },
        data: {},
      }).then((res) => {
        console.log(res.data[0].parentorgid);
        this.parentorgid = res.data[0].parentorgid;
        if (res.data[0].parentorgid === "00440063000000000000") {
          document.title = "IT工作台";
        }
      });
    },
    handleGoToCalendar() {
      this.$http({
        url: "/sysmgr/csysdept/queryGroupListByLoginNo",
        method: "post",
        headers: {
          "Content-Type": "application/json",
        },
        data: {},
      }).then((res) => {
        console.log("header" + res.data[0].parentorgid);
        if (res.data[0].parentorgid === "00440063000000000000") {
          this.$router.push("calendarnet");
        } else {
          this.$router.push("calendar");
        }
      });
    },
    handleGoToKnowledge() {
      this.$http({
        url: "/sysmgr/csysdept/queryGroupListByLoginNo",
        method: "post",
        headers: {
          "Content-Type": "application/json",
        },
        data: {},
      }).then((res) => {
        console.log("header" + res.data[0].parentorgid);
        if (res.data[0].parentorgid === "00440063000000000000") {
          this.$router.push("itknowledgetop");
        } else {
          this.$router.push("knowledgetop");
        }
      });
    },
    handleCall() {
      this.$switchTab(
        this,
        { rountPath: "/knowledgetop", name: "知识库" },
        "knowledgetop"
      );
    },
    change(index, item) {
      this.currentIndex = index;
      let set = new Set(this.$store.state.tabList);
      set.add(item);
      this.$store.commit("setDefaultActive", item.rountPath);
      this.$store.commit("setTabList", Array.from(set));
    },
    initDate() {
      this.date = new Date();
    },
    runInitDate() {
      let _this = this;
      let rn = setTimeout(() => {
        _this.initDate();
        _this.runInitDate();
        clearTimeout(rn);
      }, 500);
    },
    handleLogout() {
      console.log(123);
      this.$confirm("正在退出登录,是否继续", "提示", {
        type: "warning",
      })
        .then((res) => {
          if (res === "confirm") {
            this.$store.commit("setUserInfo", undefined);
            this.$store.commit("setToken", undefined);
            this.$store.commit("setMenus", undefined);
            this.$store.commit("setTabList", []);
            this.$cookie.delete("userInfo");
            this.$cookie.delete("menus");
            this.$cookie.delete("token");
            window.sessionStorage.agileauthtoken = undefined;
            window.sessionStorage.menus = undefined;
            window.sessionStorage.userInfo = undefined;
            window.sessionStorage.childrenMenus = undefined;
            window.sessionStorage.removeItem("antiSpoofingSearchParams");
            window.opener = null;
            window.open(" ", "_self");
            window.close();
            // window.parent.close();
            //返回到登录页面
            // this.$router.push("/login");
            //   this.$http({
            //       url: "http://cas.hl.cmcc/cas/logout",
            //       method: "get",
            //       headers: {
            //           "Access-Control-Allow-Origin": "http://cas.hl.cmcc/cas/logout",
            //       },
            //   }).then((res) => {
            //       //TODO先执行退出登录
            //       this.$store.commit("setUserInfo", undefined);
            //       this.$store.commit("setToken", undefined);
            //       this.$store.commit("setMenus", undefined);
            //       this.$store.commit("setTabList", []);
            //       this.$cookie.delete("userInfo");
            //       this.$cookie.delete("menus");
            //       this.$cookie.delete("token");
            //       window.sessionStorage.agileauthtoken = undefined;
            //       window.sessionStorage.menus = undefined;
            //       window.sessionStorage.userInfo = undefined;
            //       window.sessionStorage.childrenMenus = undefined;
            //
            //       window.location.href = " http://cas.hl.cmcc/cas/login?service=http%3A%2F%2F10.230.26.15%3A8000%2Fspfm%2Fsysmgr%2FssLogin%3FsysFlag%3D0";
            //   });
          }
        })
        .catch((err) => {
          throw err;
        });
    },
    handleSetting() {},
    handleHelp() {},
    menuClose() {
      this.$store.commit("setCollapse");
      this.$emit("collapse");
    },
  },
  computed: {
    collapse() {
      return this.$store.state.collapse;
    },
  },
};
</script>

<style scoped="scoped" lang="scss">
.p-header {
  color: #fff;
  height: 100%;
  background-color: #0056a9;

  .headerspan {
    float: left;
    width: 300px;
    line-height: 60px;
    margin-left: 20px;
    // background: url(../assets/logo.png) no-repeat 20px center;
    // text-indent: 25px;
    // font-size: 18px;
    // font-weight: bolder;
    color: #ffffff;
    // span {
    //   margin-left: 40px;
    // }
    img {
      width: 207px;
      height: 35px;
    }
  }

  .active {
    color: #0b82ff;
  }

  .iconfont {
    vertical-align: bottom;
    font-size: 21px;
  }

  .title {
    padding-top: 16px;
    padding-left: 15px;
    color: rgba(255, 255, 255, 0.6);
    font-size: 14px;
    float: left;
    cursor: pointer;

    span {
      font-size: 15px;
    }

    i {
      font-size: 20px;
    }
  }

  .bars {
    float: right;
    padding-top: 16px;
    padding-right: 31px;

    .bars-item {
      display: inline-block;
      margin-left: 30px;
      cursor: pointer;
      font-family: SourceHanSansCN-Normal;
      font-size: 18px;
      color: #ffffff;
      position: relative;
      letter-spacing: 0;
      svg {
        position: absolute;
        top: 55%;
        bottom: 50%;
        transform: translate(-50%, -50%);
      }
      span {
        margin-left: 15px;
      }
    }

    .user-info {
      font-size: 18px;
    }
  }
}
</style>