Huaihua-High-tech-Site/src/layout/component/FooterBlock.vue

<script setup lang="ts">
const toOtherLink = (index:number) => {
  if(index == 1){
    window.open('https://gxq.huaihua.gov.cn/gxq/c115221/map2022.shtml')
  }else if(index == 2){
    window.open('https://beian.miit.gov.cn/#/Integrated/index')
  }else if(index == 3){
    window.open('http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=43120202000051')
  }else if(index == 4){
    window.open('https://zfwzgl.www.gov.cn/exposure/jiucuo.html?site_code=4312000019&url=https%3A%2F%2Fgxq.huaihua.gov.cn%2F')
  }else if(index == 5){
    window.open('https://bszs.conac.cn/sitename?method=show&id=2CF7A688A99228FCE053022819ACCEC6')
  }
}
</script>

<template>
  <div class="footerContainer w-100% h-260px">
    <div class="w-1202px ml-a mr-a flex">
      <div class="w-50% line-height-32px text-gray pt-40px text-14px">
        <div class="text-white text-16px cursor-pointer hover:op-70" @click="toOtherLink(1)">网站地图</div>
        <div>主办单位：怀化高新技术产业开发区</div>
        <div>政府网站标识码：4312000019</div>
        <div><span class="cursor-pointer hover:op-70" @click="toOtherLink(2)">备案号：湘ICP备11003356号-1</span> <img src="/public/gat.png" /><span class="cursor-pointer hover:op-70" @click="toOtherLink(3)">湘公网安备 43120202000051号</span></div>
      </div>
      <div class="w-50% flex">
        <div class="mt-40px p-30px pb-10px mb-50px line-height-32px text-gray bg-black bg-opacity-10 text-12px">
          <div class="text-20px text-white">联系方式</div>
          <div>地址：怀化市中方县中方镇</div>
          <div>邮编：418000</div>
          <div>联系电话：0745-2837366</div>
        </div>
        <div class="flex m-20px mt-50px p-30px pb-10px mb-50px line-height-40px text-gray bg-black bg-opacity-10">
          <div class="w-100% h-100% mt-45px">
            <img src="/public/jiucuo.png" @click="toOtherLink(4)" class="cursor-pointer hover:op-70">
          </div>
          <div class="w-100% h-100% mt-35px">
            <img src="/public/footer1.png" @click="toOtherLink(5)" class="cursor-pointer hover:op-70">
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<style scoped>
.footerContainer{
  background-color: #36404d;
}
</style>