beehive/app/components/AppFooter.vue

<script lang="ts" setup>
import type {NavigationMenuItem} from '@nuxt/ui'

const items: NavigationMenuItem[] = [
  {
    label: '电话:15280659990',
  },
  {
    label: '邮箱:564737095@qq.com',
  },
  {
    label: '地址:福建省福鼎市太姥山镇海埕路13号',
    // to: 'https://github.com/nuxt/ui/releases',
    // target: '_blank'
  }
]
</script>

<template>
  <div
      :style="{ backgroundImage: `url('/img/index/footer_bg.png')` ,    }"
      class="bg-cover bg-no-repeat bg-center w-full ">
    <UFooter>
      <template #left>
        <p class="text-bold text-sm">Copyright © 闽ICP备2023022186号-2</p>
      </template>

      <UNavigationMenu
          :items="items" :ui="{
    link: 'text-gray-800 ', // 默认/悬停颜色

  }" variant="link"/>

      <template #right>
        <!--        <UButton-->
        <!--            aria-label="Discord"-->
        <!--            color="neutral"-->
        <!--            icon="i-simple-icons-discord"-->
        <!--            target="_blank"-->
        <!--            to="https://go.nuxt.com/discord"-->
        <!--            variant="ghost"-->
        <!--        />-->
        <UButton

            color="neutral"
            icon="simple-icons-alibabadotcom"
            target="_blank"
            to="https://chuangtewulian.1688.com/page/index.html"

        />
        <UButton

            color="neutral"
            icon="i-simple-icons-tiktok"
            target="_blank"
            to="https://www.douyin.com/user/MS4wLjABAAAAdPkGyADnJFLrZBwDM9U7faUJs-wmmyEU9L34SS0CKhs"

        />
      </template>
    </UFooter>
  </div>

</template>