<template>
  <div class="bottom">
    <div class="footer">
      <div class="outerNet">
        <div class="item" v-for="item in hyperlinkList" @click="goLink(item)">{{ item.mcbt }}</div>
      </div>
      <div class="info">
        <div class="deptName">
          <!--          <div class="logo">-->
          <!--            <img src="@/assets/images/miniLogo.png" alt="">-->
          <!--          </div>-->
          <div class="name">中国石化胜利油田分公司</div>
        </div>
        <div class="department">企管法规部(三基工作办公室)@2024 </div>
        <div class="support">技术支持:XXXXXXXXXXXXXXXXX</div>
        <div class="postcode">邮政编码:257000 </div>
        <div class="telephone">电话:0546-******</div>
      </div>
    </div>
  </div>
</template>

<script>
// import {
//   listHyperlink, //查询超链接维护列表
// } from "@/api/portalWebsite/home.js"
export default {
  name: "footerNav",
  data() {
    return {
      baseURL: process.env.VUE_APP_BASE_API,
      hyperlinkList: []
    }
  },
  mounted() {
    this.getHyperlink()
  },
  methods: {
    /**查询超链接维护列表*/
    getHyperlink() {
      // listHyperlink().then(res => {
      //   console.log('查询超链接维护列表', res)
      //   this.hyperlinkList = res.rows
      // })
    },
    goLink(item) {
      if (item.tzfs == '新页签') {
        const url = window.location.protocol + "//" + item.lj
        window.open(url, '_blank')

      }
      if (item.tzfs == '当前页') {
        window.location.href = window.location.protocol + "//" + item.lj

      }
    }
  }
}
</script>

<style scoped lang="scss">
.bottom {
  z-index: -999;
  //background: url("../../assets/images/background7.png") center no-repeat;
  //background-size: cover;
  //height: 400px;
  //width: 100%;
  //position: absolute;
  //top: 80%;
  //margin-top: 200px;
  //bottom: 0;

  .footer {
    //position: relative;
    width: 100%;
    padding: 3px 100px;
    //position: absolute;
    //bottom: 0;
    //bottom: 10px;
    //top: 0;
    color: rgba(255, 255, 255, 0.74);
    font-size: 12px;

    .outerNet {
      //position: absolute;
      cursor: pointer;
      display: flex;
      justify-content: center;
      align-items: center;
      //bottom: 25px;
      //left: 200px;
      //left: 30%;
      //transform: translate(-50%);
      margin-bottom: 5px;

      .item {
        margin-right: 30px;
        text-align: center;

        //width: 80px;
        //height: 25px;
        line-height: 19px;
        border: 0.5px solid rgba(255, 255, 255, 0.74);
        border-radius: 10px;
        padding: 3px 10px;
      }
    }

    .info {
      display: flex;
      justify-content: space-between;
      align-items: flex-end;

      .deptName {
        display: flex;
        align-items: flex-end;

        .logo {
          margin-right: 5px;

          img {
            width: 30px;
            height: 30px;
          }
        }
      }

    }
  }
}
</style>
