// src/components/Footer.vue
<template>
  <footer class="bg-gray-700 text-white py-4 md:py-8">
    <div class="container mx-auto text-center">

      <p class="text-sm mb-4">
        {{appStore.checkLang.isTh ? more : more_en}}
      </p>
      <div class="text-xs space-x-2">
        <template v-for="(menu, key) in appStore.allFooterMenus" :key="key">
          <span v-if="appStore.checkLang.isTh ? menu.active : menu.active_en">
            <span v-if="key > 0">|</span> <a
              v-if="menu.File && menu.File.url"
              :href="`${appStore.imageBaseUrl}${menu.File.url}`"
              target="_blank"
              class="text-white hover:underline"
          >
              {{ appStore.checkLang.isTh ? menu.title : menu.title_en }}
            </a>
            <router-link
                v-else-if="menu.link"
                :to="menu.link"
                class="text-white hover:underline"
            >
              {{ appStore.checkLang.isTh ? menu.title : menu.title_en }}
            </router-link>
            <span v-else>
              {{ appStore.checkLang.isTh ? menu.title : menu.title_en }}
            </span>
          </span>
        </template>
        |<br />
        [ HumanTech Call Center: 0-1234-5678 ]
      </div>
    </div>
  </footer>
</template>

<script setup>
import { ref } from 'vue';
import { useAppStore } from '@/stores/app';
import { RouterLink } from 'vue-router'; // Import RouterLink for internal links

const appStore = useAppStore();

const title = ref("ฮิวแมนเทคไทยแลนด์");
const title_en = ref("HumanTech");
const more = ref("ดำเนินการโดย ฮิวแมนเทคไทยแลนด์ แขวงสายไหม เขตสายไหม กรุงเทพฯ 10220 สงวนลิขสิทธิ พ.ศ.2564 ตามพระราชบัญญัติลิขสิทธิ์ พ.ศ.2537");
const more_en = ref("This website is administered by the HumanTech, Sai Mai, Bangkok 10220 Copyright ©2025 HumanTech all rights reserved.");
</script>

<style scoped>
/* สไตล์เฉพาะ Footer หากไม่ถูกครอบคลุมโดย Tailwind */
</style>