appfooter

wujingjing

2025-02-13 4f03e6fb9f0fe11e6c191baed39190fdce307117

 src/components/AppFooter.vue

@@ -1,64 +1,62 @@
<template>
   <footer class="bg-[#393939] text-white py-8">
      <div class="w-[63%] mx-auto">
         <div class="grid grid-cols-5 gap-8">
            <!-- 导航链接 -->
            <div>
               <router-link to="/" class="text-white hover:text-gray-300">首页</router-link>
            </div>
            <div>
               <router-link to="/industrial-software" class="text-white hover:text-gray-300">工业软件|工业APP</router-link>
            </div>
            <div>
               <router-link to="/supply-demand" class="text-white hover:text-gray-300">供需对接</router-link>
            </div>
            <div>
               <router-link to="/application" class="text-white hover:text-gray-300">应用推广</router-link>
            </div>
            <div>
               <router-link to="/public-service" class="text-white hover:text-gray-300">公共服务</router-link>
            </div>
         </div>

         <div class="grid grid-cols-4 gap-8 mt-8">
            <!-- 联系方式 -->
            <div>
               <div class="mb-2">联系方式：010-64102808</div>
               <div>电子邮箱：fengkuan@ccsi.cn</div>
            </div>

            <!-- 快速链接 -->
            <div>
               <div class="mb-2">软件著作权申请通道</div>
               <div class="mb-2">在线图书馆</div>
               <div class="mb-2">优秀案例</div>
               <div class="mb-2">先进标准</div>
               <div>先进标准技术实践</div>
            </div>

            <!-- 更多链接 -->
            <div>
               <div class="mb-2">测试服务</div>
               <div class="mb-2">证书管理</div>
            </div>

            <!-- 二维码 -->
            <div class="flex gap-4">
               <div class="text-center">
                  <!-- <img src="@/assets/qrcode1.png" alt="全国信标委软件与系统工程分委会" class="w-24 h-24 mb-2" /> -->
                  <div class="text-xs">全国信标委软件与系统工程分委会</div>
   <footer class="bg-[#393939] text-[#ccc] py-8 text-small">
      <div class="w-[63%] mx-auto ">
         <div class="flex ">
            <div class="grid grid-cols-5 gap-8">
               <!-- 导航链接 -->
               <div>
                  <router-link to="/" class="text-white hover:text-white hover:underline">首页</router-link>
               </div>
               <div class="text-center">
                  <!-- <img src="@/assets/qrcode2.png" alt="全国信标委工业软件/APP标准工作组" class="w-24 h-24 mb-2" /> -->
                  <div class="text-xs">全国信标委工业软件/APP标准工作组</div>
               <div>
                  <router-link to="/industrial-software" class="text-white hover:text-white hover:underline">工业软件|工业APP</router-link>
               </div>
               <div>
                  <router-link to="/supply-demand" class="text-white hover:text-white hover:underline">供需对接</router-link>
               </div>
               <div class="flex flex-col gap-3">
                  <router-link to="/application" class="text-white hover:text-white cursor-default">应用推广</router-link>
                  <div class="flex flex-col gap-1">
                     <router-link to="/standard" class="text-[#ccc] hover:text-[#ccc] hover:underline">标准库</router-link>
                     <router-link to="/library" class="text-[#ccc] hover:text-[#ccc] hover:underline">在线图书馆</router-link>
                     <router-link to="/cases" class="text-[#ccc] hover:text-[#ccc] hover:underline">优秀案例</router-link>
                     <router-link to="/training" class="text-[#ccc] hover:text-[#ccc] hover:underline">咨询培训</router-link>
                     <router-link to="/community" class="text-[#ccc] hover:text-[#ccc] hover:underline">先进制造业集群</router-link>
                  </div>
               </div>
               <div class="flex flex-col gap-3">
                  <router-link to="/public-service" class="text-white hover:text-white cursor-default">公共服务</router-link>
                  <div class="flex flex-col gap-1">
                     <router-link to="/software-copyright" class="text-[#ccc] hover:text-[#ccc] hover:underline"
                        >软件著作权申请通道</router-link
                     >
                     <router-link to="/key-tech" class="text-[#ccc] hover:text-[#ccc] hover:underline">首重点技术攻关</router-link>
                     <router-link to="/test-service" class="text-[#ccc] hover:text-[#ccc] hover:underline">测试服务</router-link>
                     <router-link to="/cert-manage" class="text-[#ccc] hover:text-[#ccc] hover:underline">证书管理</router-link>
                  </div>
               </div>
            </div>
            <div class=" ml-8 flex flex-col gap-4 pl-8 text-[#ccc]" style="border-left: 1px solid #5f5f60">
               <div class="text-sm">
                  <div>联系方式: 010-64102808</div>
                  <div>电子邮箱: fengkuan@cesi.cn</div>
               </div>
               <div class="flex gap-10">
                  <div class="w-[90px]">
                     <img src="@/assets/footer/1-qrcode.png" alt="全国信标委软件与系统工程分委会" class="w-24 h-24 mb-2" />
                     <div class="text-xs">全国信标委软件与系统工程分委会</div>
                  </div>
                  <div class="w-[90px]">
                     <img src="@/assets/footer/2-qrcode.png" alt="全国信标委工业软件/APP标准工作组" class="w-24 h-24 mb-2" />
                     <div class="text-xs">全国信标委工业软件/APP标准工作组</div>
                  </div>
               </div>
            </div>
         </div>

         <!-- 版权信息 -->
         <div class="mt-8 text-center text-gray-400 text-sm">
         <div class="pt-5 mt-2 text-center text-gray-400 text-sm" >
            Copyright © 2019-2019 js. All Rights Reserved. 版权所有
            <a href="https://beian.miit.gov.cn/" target="_blank" class="text-gray-400 hover:text-gray-300 ml-2"> 京ICP备19033988号 </a>
            <a href="https://beian.miit.gov.cn/" target="_blank" class="text-gray-400 ml-2"> 京ICP备19033988号 </a>
         </div>
      </div>
   </footer>