Vue.component("ito-footer", {
  props: ["main"],
  template: `<footer class="footer py-4 bg-green font-white">
    <div class="container">
      <div class="row d-flex align-items-center justify-content-between">
        <div class="col-md-7 order-md-0 order-1 logo-box">
          <div class="logo py-3">
            <a :href="[ main ? 'index.html' : '../index.html' ]">
            <img :src="[ main ? '../assets/img/logo.png' : '../../assets/img/logo.png' ]" alt="logo" />
            <span>이토병원</span>
            </a>
          </div>
          <div class="fw-bold">〒150-8308 도쿄도 시부야구 진구마에 4-3-6</div>
          <div class="fw-bold">TEL:<a href="tel:03-3402-7411">03-3402-7411</a></div>
        </div>
        <div class="col-md-5 order-md-1 order-0">
          <span v-for="(item, index) in footerList" :key="index" class="pointer">
            <a :href="[ main ? item.url : '../'+item.url ]" :target="item.target">{{item.name}}</a>
            <span v-if="index != footerList.length-1">｜</span>
          </span>
        </div>
      </div>
      <div class="py-3 fw-bold text-center">
      Copyright © 이토병원All Rights Reserved.
      </div>
    </div>
  </footer>`,
  data() {
    return {
      footerList: [
        {
          name: "APEC소개",
          url: "../apec/e-index.html",
          target: "_brank",
        },
        {
          name: "사이트 맵",
          url: "26_sitemap/sitemap.html",
        },
      ],
    };
  },
});