<template>
  <main>
    <div class="detail--container--full">
      <!-- 풀사이즈 배너 텍스트 1줄용 -->
      <fullSizeBannerText
        :height="856"
        :imagePath="bannerTextPath"
        class="video"
        textLocation="topleft"
        type="cover"
        altText="Audi Q4 e-tron"
        btnText="상담신청"
        btnLink="/"
        btnTarget="_blank"
        btnText2="내 차량 만들기"
        btnLink2="/"
        btnTarget2="_blank"
        cautionText=""
      />

      <TrimInfoColumn class="mt--100" :items="trimInfoItems" />

      <!-- 타이틀 비주얼 컴포넌트 -->
      <TitleVisual
        title="Adrenaline, Fully<br/> Charged"
        description=""
        textAlign="center"
        theme="dark"
        :animation="true"
        :animationDelay="300"
      />

      <!-- 링크 리스트 컴포넌트 -->
      <LinkList class="mt--20" :links="reservationLinks" />

      <!-- 
      타이틀 비주얼 컴포넌트

      type : middle 타이틀 중간사이즈면 좌우 여백없음
             middle2 : 타이틀 중간사이즈면서 좌우 여백있음
      -->
      <TitleVisual
        title="가장 순수한 형태의 성능"
        description="아우디 RS e-tron GT performance: 최초의 순수 전기차 RS performance 모델인 동시에, 지금까지 생산된 아우디 양산차 중 가장 강력한 성능을 가장 아름다운 그란 투리스모 디자인에 담아 냈습니다."
        textAlign="left"
        theme="dark"
        type="middle2"
        :animation="true"
        :animationDelay="300"
      />

      <!-- 
        Swiper 배너 (30% + 70% 레이아웃)
        type="vertical", 
        type="horizental"
      -->
      <SwiperBanner
        :slides="bannerSlides"
        title=""
        subtitle=""
        smalldesc=""
        notice=""
        type="vertical"
        :autoplay="{ delay: 0 }"
        :loop="false"
      />

      <!-- 타이틀 비주얼 컴포넌트 -->
      <TitleVisual
        title="한계를 모르는 궁극의 역동성"
        description="아드레날린이 솟구치는 짜릿한 경험이 매 순간 반복됩니다. 아우디 RS e-tron GT performance 모델은 최대 550kW의 강력한 출력을 바탕으로 런치 컨트롤을 통해 극한의 가속을 발휘합니다(전력 소비량: 3.4 km/kWh (복합), CO2 배출량 (복합): 0g/km, 배출 등급: 4등급). 정지 상태에서 단 2.9초(Launch Control 모드: 2.5초)면 100km/h에 도달합니다. 또한 아우디 RS e-tron GT performance의 e-tron 스포츠 사운드 덕분에 감동적인 주행 경험을 음향으로도 느낄 수 있습니다. 절제, 균형, 스포티 등 원하는 사운드 프로필 옵션을 선택하세요."
        textAlign="left"
        theme="dark"
        type="middle2"
        :animation="true"
        :animationDelay="300"
      />

      <SwiperBanner
        :slides="bannerSlides2"
        notice=""
        type=""
        height="62"
        :autoplay="{ delay: 0 }"
        :loop="false"
      />

      <TrimInfoColumn :items="trimInfoItems2" class="mt--180" />

      <!-- 타이틀 비주얼 컴포넌트 -->
      <TitleVisual
        title="숨 막히는 퍼포먼스"
        description="충전하는 동안에도 짜릿한 성능을 만끽하세요. 낮은 온도에서도 최대 320kW의 충전 용량을 이용할 수 있으며, 안정적인 충전 곡선 덕분에 고속 충전의 진가를 느낄 수 있습니다."
        textAlign="left"
        theme="dark"
        type="middle2"
        :animation="true"
        :animationDelay="300"
      />

      <SwiperBanner
        :slides="bannerSlides3"
        :autoplay="false"
        :loop="false"
        type="vertical"
      />

      <SwiperBanner
        :slides="bannerSlides4"
        :autoplay="false"
        :loop="false"
        type="vertical"
        class="mt--60"
      />

      <SwiperBanner
        :slides="bannerSlides5"
        :autoplay="false"
        :loop="false"
        class="mt--80"
        type="vertical"
      />

      <SwiperBanner
        :slides="bannerSlides6"
        :autoplay="false"
        :loop="false"
        class="mt--80"
        type="vertical"
      />

      <!-- 타이틀 비주얼 컴포넌트 -->
      <TitleVisual
        title="눈에 띄는 특별함 – 아우디 익스클루시브"
        description="내가 특별한 만큼, 내 아우디도 특별해야 합니다. 아우디 S e-tron GT에 나만의 독창적인 매력을 더해 보세요."
        textAlign="left"
        type="middle2"
        theme="dark"
        :animation="true"
        :animationDelay="300"
        class="mt--100"
      />

      <ProductCard
        data-type="square"
        image="/img/models/rs-e-tron-gt-pm2025/RSeGTp_2024_6631-S-L.webp"
        title="아우디 RS e-tron GT performance가 마음에 드시나요?"
        subtitle="지금 바로 고품질의 기본 구성부터 시작해보세요."
        buttonText="차량 구성하기"
        buttonUrl="https://www.audi.co.kr/ko/models/e-tron-gt/rs-e-tron-gt-performance-master-2025/konfigurator/?ulid=1762759198233&pr=F8PR8D0_2025%7CL5L5%7CAR#configurator"
        buttonTarget="_blank"
        layout="horizontal"
        imagePosition="left"
      />

      <CareProgramItem data-type-row="3" :items="careProgramItems" />

      <!-- 제품 카드 컴포넌트 -->
      <ProductCard
        data-type="square"
        image="/img/etronms/3_730X730.webp"
        title="Audi
      Warranty 아우디 보증 프로그램"
        smallTitle="아우디 보증 프로그램"
        subtitle="더 오래,
      더 안전한 드라이빙을 위한 아우디 5년 보증 프로그램으로 아우디와 함께 어디든 안심하고
      떠나세요.<br /><br />
      › 대상차량 : 아우디코리아에서 공식 딜러사를 통해 판매하는 모든 21년식 모델부터
      적용<br /><br />
      › 보증 기간 : 5년 보증 또는 최종 주행거리 150,000km 까지 (선도래조건)<br /><br />
      › 대상 부품 : 제조사 보증과 동일<br /><br />
      › 차량당 총 보상한도(누적) : 신차 권장소비자가격(VAT포함)<br /><br />
      * 자세한 내용은 차량과 함께 제공되는 아우디 보증서를 확인하세요."
        layout="horizontal"
        imagePosition="left"
      />

      <ProductCard
        data-type="square"
        image="/img/models/e-tron-gt/2_730X730.webp"
        title="Car Service Plus"
        smallTitle="카 서비스 플러스"
        subtitle="카 서비스 플러스 프로그램은 아우디 공식 서비스센터에서 제공하는 차량 유지관리 서비스 입니다.<br/><br/>
아우디 공식 서비스센터를 통해 제공되는 전문적이고 체계적인 유지관리는 추가 비용 부담없이 고객님 차량의 가치를 더욱 높여줄 것입니다."
        buttonText="카 서비스 플러스 확인하기"
        buttonUrl="/service/program/carserviceplus"
        buttonTarget="_self"
        layout="horizontal"
        imagePosition="right"
      />

      <ProductCard
        data-type="square"
        image="/img/etronms/e-tron_1920x1920.webp"
        title="아우디 전기차
"
        smallTitle="카 서비스 플러스"
        subtitle="아우디 최초의 순수 전기차 아우디 e-tron은 아우디 브랜드 역사의 완전한 새로운 장을 열었습니다.<br/>
아우디 e-tron은 순수 전기 모터로 구동되며 급속 충전 편의성, 주행 중 첨단 에너지 회수 기능을 보유하고 있습니다.<br/>
지속적으로 확장되는 아우디 e-tron 제품군은 전력으로 구동되며, 정교한 차량 디자인과 역동적인 성능 및 핸들링을 제공합니다."
        buttonText="카 서비스 플러스 확인하기"
        buttonUrl="/models/etron"
        buttonTarget="_self"
        layout="horizontal"
        imagePosition="left"
      />

      <CautionText />
    </div>
  </main>
</template>

<script setup>
  // 컴포넌트 import
  import fullSizeBannerText from "~/components/block/fullSizeBannerText1.vue";
  import ParallaxBanner from "~/components/block/parallaxBanner.vue";
  import SwiperBanner from "~/components/block/SwiperBanner.vue";
  import TitleVisual from "~/components/block/TitleVisual.vue";
  import ProductCard from "~/components/block/ProductCard.vue";
  import CautionText from "~/components/block/cautionText3.vue";
  import LinkList from "~/components/block/LinkList.vue";
  import TrimInfoColumn from "~/components/block/TrimInfoColumn.vue";
  import CareProgramItem from "~/components/block/CareProgramItem.vue";

  // Runtime Config 가져오기
  const config = useRuntimeConfig();

  const bannerTextPath = ref("/img/models/q4-etron/Stage_Desktop.avif");

  // Trim 정보 데이터
  const trimInfoItems = ref([
    {
      title: "합산 출력",
      value: "550",
      unit: "kW",
      subText: "",
    },
    {
      title: "가속 (0-100km/h)",
      value: "2.9",
      unit: "초",
      subText: "(Launch Control 모드: 2.5초)",
    },
    {
      title: "최고 속도",
      value: "250",
      unit: "km/h분",
      subText: "",
    },
  ]);

  // 링크 데이터 배열
  const reservationLinks = ref([
    {
      text: "내 차량 만들기",
      url:
        "https://www.audi.co.kr/ko/models/e-tron-gt/rs-e-tron-gt-performance-master-2025/konfigurator/?ulid=1762755892978&pr=F8PR8D0_2025%7CL5L5%7CAR#configurator",
      target: "_blank",
      showIcon: true,
    },
    {
      text: "차량 상담",
      url:
        "https://www.audikoreaevent.co.kr/lms/application/applyTestdrive.do?device=W&inflPathAclsCd=A18&inflPathBclsCd=B03&dealerCd=" +
        config.public.testDriveCode +
        "&selectCar=RSETGTPFM25&step=1&testType=2",
      target: "_blank",
      showIcon: true,
    },
    {
      text: "전시장/AS센터",
      url: "/company/serviceCenter",
      target: "_blank",
      showIcon: true,
    },
    {
      text: "카탈로그 다운로드",
      url:
        "https://www.audikoreaevent.co.kr/aca/ecatalog/download/Audi_SETGT25_&_RSETGTPFM25_catalog.pdf",
      target: "_blank",
      showIcon: true,
    },
    {
      text: "디지털 카탈로그",
      url: "https://indd.adobe.com/view/8aee0a52-9278-4af3-9dea-e7e0fc354ff6",
      target: "_blank",
      showIcon: true,
    },
  ]);

  // Swiper 배너 슬라이드 데이터 (30% + 70% 레이아웃용)
  const bannerSlides = ref([
    {
      video: "/img/models/rs-e-tron-gt-pm2025/rs-e-tron-gt-performance-walkaround-L.mp4",
      alt: "",
      title: "",
      subtitle: "",
      smalldesc: "",
    },
  ]);

  const bannerSlides2 = ref([
    {
      video:
        "/img/models/rs-e-tron-gt-pm2025/EN-240430_Audi_GT_LAUNCH_CONTROL_29s_v11_1x1_CLEAN.mp4",
      alt: "런치 컨트롤과 함께 하늘을 나는 기분",
      title: "런치 컨트롤과 함께 하늘을 나는 기분",
      subtitle:
        "아드레날린이 솟구치는 짜릿한 경험이 매 순간 반복됩니다. 아우디 RS e-tron GT performance 모델은 최대 550kW의 강력한 출력을 바탕으로 런치 컨트롤을 통해 극한의 가속을 선사합니다(전력 소비량: 3.4 km/kWh (복합), CO2 배출량 (복합): 0g/km, 배출 등급: 4등급). 정지 상태에서 단 2.9초(Launch Control 모드: 2.5초)면 100km/h에 도달합니다. 또한 아우디 RS e-tron GT performance 모델의 e-tron 스포츠 사운드 덕분에 감동적인 주행 경험을 귀로도 느낄 수 있습니다. 절제, 균형, 스포티 등 원하는 사운드 프로필 옵션을 선택하세요.",
      cautiondesc:
        "전력 소비량: 3.4 km/kWh (복합), CO2 배출량 (복합): 0g/km, 배출 등급: 4등급",
    },
    {
      video:
        "/img/models/rs-e-tron-gt-pm2025/EN-240430_Audi_GT_BOOST_30s_v08_V5_1x1_CLEAN-L.mp4",
      alt: "버튼 하나로 일시적 출력 상승",
      title: "버튼 하나로 일시적 출력 상승",
      subtitle:
        "푸시-투-패스는 더 쉽게 추월할 수 있도록 차량의 출력을 잠깐 동안 높여주는 기능입니다. 스티어링 휠 상단과 하단의 납작한 제어 버튼으로 기능을 활성화하고, 10초 동안 최대 70kW(유럽 WLTP 기준)의 추가 출력을 누려 보세요.",
      cautiondesc:
        "전력 소비량: 3.4 km/kWh (복합), CO2 배출량 (복합): 0g/km, 배출 등급: 4등급",
    },
    {
      image: "/img/models/rs-e-tron-gt-pm2025/RSeGTp_2024_6587-S-L.avif",
      alt: "노면과 하나 되는 감각",
      title: "노면과 하나 되는 감각",
      subtitle:
        "사륜 스티어링과 전륜 스포츠 스티어링의 조합은 직접적인 조향 비율로 한층 더 편리한 기동과 스포티한 핸들링을 보장합니다. 아우디 드라이브 셀렉트를 통해 RS 모드나 RS performance 모드를 선택하면 운전자의 스타일과 요구사항에 맞게 차량을 더 세밀하게 조율할 수 있습니다.",
      cautiondesc: "",
    },
  ]);

  // Trim 정보 데이터
  const trimInfoItems2 = ref([
    {
      title: "최대 주행 가능 거리 (복합 기준)",
      value: "384",
      unit: "km",
      subText: "",
    },
    {
      title: "충전 용량 10%에서 80%까지 소요 시간 (유럽 WLTP 기준)",
      value: "18",
      unit: "분",
      subText: "최고 320kW의 최대 DC 전력 충전 시",
    },
    {
      title: "최대 DC 충전 전력",
      value: "320",
      unit: "kW",
      subText: "",
    },
  ]);

  const bannerSlides3 = ref([
    {
      image: "/img/models/rs-e-tron-gt-pm2025/RSeGTp_2024_6590-L.avif",
      alt: "내 생애 가장 오래 이어지는 아드레날린 킥",
      title: "내 생애 가장 오래 이어지는 아드레날린 킥",
      subtitle:
        "강력한 성능을 지님에도 불구하고 복합 기준 384km에 달하는 아우디 그란 투리스모 전기차의 기나긴 주행 가능 거리 덕분에 역동적인 주행 경험이 오래도록 지속됩니다.",
      smalldesc: "",
      cautiondesc:
        "전력 소비량: 3.4 km/kWh (복합), CO2 배출량 (복합): 0g/km, 배출 등급: 4등급",
    },
    {
      image: "/img/models/rs-e-tron-gt-pm2025/RRA0356-L-1.jpg",
      alt: "효율성을 위한 방향 전환",
      title: "효율성을 위한 방향 전환",
      subtitle:
        "아우디 e-tron GT를 위해 특별히 개발된 21인치 타이어는 기존 타이어 대비 최적화된 구름 저항으로 효율성이 우수하며, 따라서 주행 가능 거리를 늘리는 데 유리합니다. 이 타이어는 평균 55%의 재생 원료와 재활용 원료를 사용해 제조됩니다.",
      smalldesc: "",
      cautiondesc: "참고: 사진의 모델은 아우디 RS e-tron GT입니다.",
    },
    {
      image: "/img/models/rs-e-tron-gt-pm2025/RSeGTp_2024_6633-L.avif",
      alt: "고출력 충전",
      title: "고출력 충전",
      subtitle:
        "약 18분 안에 10%에서 80%까지 충전됩니다. 또 10분이면 275km를 주행하기에 충분한 전력을 보충할 수 있습니다. 고전압 배터리를 탑재한 덕분에 HPC 충전소에서 이렇게 빠른 대용량 충전(충전 용량 최대 320kW)이 가능합니다.",
      smalldesc: "",
      cautiondesc: "유럽 WLTP 기준",
    },
  ]);

  const bannerSlides4 = ref([
    {
      image: "/img/models/rs-e-tron-gt-pm2025/RSeGTp_2024_6604-L.avif",
      alt: "빛으로 완성되는 존재감",
      title: "빛으로 완성되는 존재감",
      subtitle:
        "매트릭스 LED 헤드라이트와 아우디 레이저 라이트는 아우디의 진보적 디자인을 대표하는 핵심 요소입니다. 아우디 레이저 라이트의 파란색 포인트가 돋보이는 독창적인 조명 시그니처는 이 자동차의 스포티한 개성을 더욱 강조합니다.",
      smalldesc: "",
    },
    {
      video:
        "/img/models/rs-e-tron-gt-pm2025/rs-e-tron-gt-performance-chlh-lights-animation-L.mp4",
      alt: "혁신적인 조명 디자인",
      title: "혁신적인 조명 디자인",
      subtitle:
        "‘커밍 홈/리빙 홈’ 기능의 다이내믹 라이트 시퀀스에서 아우디가 추구하는 진보적인 감각을 엿볼 수 있습니다. 후면 전체를 가로지르는 조명 스트립은 특히 강렬한 인상을 남깁니다.",
      smalldesc: "",
      cautiondesc:
        "전력 소비량: 3.4 km/kWh (복합), CO2 배출량 (복합): 0g/km, 배출 등급: 4등급",
    },
  ]);

  const bannerSlides5 = ref([
    {
      video:
        "/img/models/rs-e-tron-gt-pm2025/Walkaround_Int_Etron_GT_RS_RS_Performance_1920x1080_1.mp4",
      alt: "",
      title: "",
      subtitle: "",
      smalldesc: "",
    },
  ]);

  const bannerSlides6 = ref([
    {
      image: "/img/models/rs-e-tron-gt-pm2025/RSeGTp_2024_6614_EN-L.avif",
      alt: "RS performance를 뒷받침하는 MMI",
      title: "RS performance를 뒷받침하는 MMI",
      subtitle:
        "RS 고유의 레이아웃으로 설계된 아우디 버추얼 콕핏 플러스에서 풍부한 정보를 활용하세요. 속도, 내비게이션, 인포테인먼트는 물론 배터리 온도와 예상 최대 충전 용량까지 확인할 수 있습니다. 다이내믹한 디자인의 “파워 미터” 레이아웃은 RS 모델에만 독점 제공됩니다.",
      smalldesc: "",
    },
    {
      image: "/img/models/rs-e-tron-gt-pm2025/RSeGTp_2024_6615_V2_EN-L.avif",
      alt: "성능에 초점을 맞춘 정보 제공",
      title: "성능에 초점을 맞춘 정보 제공",
      subtitle:
        "10.1인치 MMI 내비게이션 플러스와 MMI 터치는 직관적인 조작 방식과 다양한 인포테인먼트 기능을 제공합니다. 아우디 드라이브 셀렉트에서 ‘RS 1’, ‘RS 2’, ‘RS performance’ 모드를 선택하면 더욱 스포티하고 역동적인 차량으로 변신합니다.",
      smalldesc: "",
    },
    {
      video: "/img/models/rs-e-tron-gt-pm2025/Frunk_Etron_GT_RS_Performance-L.mp4",
      alt: "더 넉넉한 공간",
      title: "더 넉넉한 공간",
      subtitle:
        "긴 보닛 아래에 추가 수납 공간이 마련되어, 수납 용량이 77리터나 더 늘어났습니다.",
      smalldesc: "",
      cautiondesc: "유럽 인증 기준",
    },
  ]);

  const careProgramItems = ref([
    {
      imagePath: "/img/models/e-tron-gt/SeGT_2024_6505-L.avif",
      title: "S e-tron GT",
      description: "",
      linkUrl: "/models/detail/s-etron-gt",
      linkText: "지금 알아보기",
      linkTarget: "_self",
      smallText:
        "전력 소비량: 3.7 km/kWh (복합), CO2 배출량 (복합): 0g/km, 배출 등급: 4등급",
      captionText: "",
    },
    {
      imagePath: "/img/models/e-tron-gt/Q6_2023_5202-cast_1-v2-L.avif",
      title: "Q6 SUV e-tron",
      description: "",
      linkUrl: "/models/detail/q6-suv-e-tron-2025",
      linkText: "지금 알아보기",
      linkTarget: "_self",
      smallText:
        "전력 소비량(복합): 19.8-16.1kWh/100km, CO₂ 배출량(복합): 0g/km, CO₂ 등급: A",
    },
  ]);
</script>
