<template>
  <div class="footerlink">
    <div class="link-pic">
      <div class="footerlink-txt">友情链接</div>
      <div class="footerlink-pic">
        <div class="pic-item" @click="openwindown('http://www.nlc.cn/')">
          <div class="pic"><img src="@/assets/linkpic/zgbook.png" alt="" class="pic-size" /> </div>
          <div class="txt">中国国家图书馆</div>
        </div>
        <div class="pic-item" @click="openwindown('http://open.nlc.cn/onlineedu/client/index.htm')">
          <div class="pic"><img src="@/assets/linkpic/gtgkk.png" alt="" class="pic-size" /> </div>
          <div class="txt">国图公开课</div>
        </div>
        <div class="pic-item" @click="openwindown('http://www.cfed.cnki.net/')">
          <div class="pic"><img src="@/assets/linkpic/cnk.png" alt="" class="pic-size" /> </div>
          <div class="txt">CNKI中小学数字图书馆</div>
        </div>
        <div class="pic-item" @click="openwindown('http://www.zhlhh.com/')">
          <div class="pic"><img src="@/assets/linkpic/lhh.png" alt="" class="pic-size" /> </div>
          <div class="txt">中国连环画数字图书馆</div>
        </div>
        <div class="pic-item" @click="openwindown('https://www.wanfangdata.com.cn/index.html')">
          <div class="pic"><img src="@/assets/linkpic/wfsj.png" alt="" class="pic-size" /> </div>
          <div class="txt">万方数据</div>
        </div>
      </div>
    </div>
  </div>
  <div class="box"></div>
  <div class="main">
    <div class="content">
      <!-- <div class="left">
        <div class="mbottom46">中教智隆科技(杭州)股份有限公司</div>
        <div>浙ICP备2020036303号-1</div>
      </div>
      <div class="right">
        <div class="mbottom46">浙江省杭州市余杭区绿城未来park 3号楼A幢606 邮编311100  </div>
        <div class="url" @click="openNewUrl"><img :src="bage"/>浙公网安备 33011002015264号</div>
      </div> -->
      <div
        >Copyright@2021 {{getPng()?'宿迁市智慧教育云平台':'智慧教育云平台'}} 数据版权归属于中教领信(宿迁)信息技术有限公司
        <span
          ><a class="text-color" href="https://beian.miit.gov.cn" target="_blank"
            >沪ICP备19000885号-5</a
          ></span
        ></div
      >
    </div>
  </div>
</template>

<script setup lang="ts">
import bage from '../assets/images/bage.png';

const isLog = import.meta.env.VITE_APP_PATH
const getPng = () => {
        console.log(1)
    if(isLog == 'production'||isLog =='development'){
        return true
    }else{
        console.log(2)
       return false 
    }
}

const openNewUrl = () => {
  window.open(import.meta.env.VITE_APP_NATIONAL_INTERNET_SECURITY_MANAGE_SERVICE_URL as string);
};
const openwindown = (url) => {
  window.open(url);
};
</script>

<style lang="less" scoped>
.box {
  height: 80px;
  background: white;
}
.footerlink {
  width: 100%;
  background: white;
  padding-top: 100px;
  .link-pic {
    display: flex;
    width: 1160px;
    height: 254px;
    border: 1px solid #ffeeeeee;
    margin: 0 auto;
    flex-flow: column wrap;
    .footerlink-txt {
      font-size: 24px;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 500;
      color: #333333;
      margin: 24px 16px;
      padding-bottom: 20px;
      border-bottom: 1px solid #ffeeeeee;
    }
    .footerlink-pic {
      display: flex;
      margin: 0px 16px 24px;
      justify-content: space-between;
      .pic-item {
        display: flex;
        flex-flow: column wrap;
        justify-content: center;
        .pic {
          width: 212px;
          height: 88px;
          .pic-size {
            width: 212px;
            height: 88px;
            cursor: pointer;
          }
        }
        .txt {
          text-align: center;
          cursor: pointer;
          font-size: 14px;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #666666;
        }
      }
    }
  }
}
.main {
  width: 100%;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: @heading-color;
  color: rgba(255, 255, 255, 0.6);
  font-size: 14px;

  .content {
    display: flex;
    justify-content: center;
    .mbottom46 {
      margin-bottom: 25px;
    }
    .left {
      margin-right: 40px;
    }
    .right {
      img {
        width: 18px;
        height: 20px;
        margin-right: 10px;
      }
      .url {
        cursor: pointer;
      }
    }
  }
}

@media screen and (max-width: 600px) {
  .box {
    height: 0px;
    background: white;
  }
  .main {
    width: 100% !important;
  }
  .footerlink {
    width: 100% !important;
    padding-top: 40px;
  }
  .content {
    font-size: 12px;
    transform: scale(0.8);
    div {
      width: 380px;
    }
  }
  .link-pic {
    width: 100% !important;
    height: auto !important;
    display: flex;
    flex-flow: column nowrap;
    .footerlink-txt {
      font-size: 18px !important;
      font-family: PingFangSC-Medium, PingFang SC;
      font-weight: 400;
      text-align: center;
      color: #333333;
      margin: 0px 16px !important;
      padding-bottom: 0px !important;
      border-bottom: 1px solid #ffeeeeee;
    }
    .footerlink-pic {
      display: flex;
      flex-flow: column nowrap;
    }
    .pic-item {
      display: flex;
      flex-flow: column wrap;
      justify-content: center;
      .pic {
        display: none;
        width: 20px !important;
        height: 10px;
        .pic-size {
          width: 20px;
          height: 10px;
          cursor: pointer;
        }
      }
    }
  }
}
.text-color {
  color: rgba(255, 255, 255, 0.6);
}
</style>
