<template>
  <q-page>
    <template v-for="(item,index) in AboutData">
      <div :key="index">
        <!--自訂版型(影片)-->
        <videoOne v-if="item.Id=='white_label_video'&&item.plugData.Type==1" :plugData="item.plugData"></videoOne>
        <videoTwo v-if="item.Id=='white_label_video'&&item.plugData.Type==2" :plugData="item.plugData"></videoTwo>
        <!--自訂版型(圖片)和挑選自有行程(圖片)-->
        <diyImgOne v-if="item.Id=='white_label_picture'&&item.plugData.Type==1" :plugData="item.plugData"></diyImgOne>
        <diyImgTwo v-if="item.Id=='white_label_picture'&&item.plugData.Type==2" :plugData="item.plugData"></diyImgTwo>
        <diyImgThree v-if="item.Id=='white_label_picture'&&item.plugData.Type==3" :plugData="item.plugData">
        </diyImgThree>
        <diyImgFour v-if="item.Id=='white_label_picture'&&item.plugData.Type==4" :plugData="item.plugData"></diyImgFour>
        <diyImgFive v-if="item.Id=='white_label_picture'&&item.plugData.Type==5" :plugData="item.plugData"></diyImgFive>
        <diyImgSix v-if="item.Id=='white_label_picture'&&item.plugData.Type==6" :plugData="item.plugData"></diyImgSix>
        <!--自訂版型(QRcode)white_label_qrcode-->
        <qrLeft v-if="item.Id=='white_label_qrcode'&&item.plugData.Type==1" :plugData="item.plugData"></qrLeft>
        <qrRight v-if="item.Id=='white_label_qrcode'&&item.plugData.Type==2" :plugData="item.plugData"></qrRight>
        <!--自訂版型(其他)white_label_other -Start-->
        <empty v-if="item.Id=='white_label_other'&&item.plugData.Type==1" :plugData="item.plugData"></empty>
        <downloadTable v-if="item.Id=='white_label_other'&&item.plugData.Type==2" :plugData="item.plugData">
        </downloadTable>
        <diyTitle v-if="item.Id=='white_label_other'&&item.plugData.Type==3" :plugData="item.plugData"></diyTitle>
        <paragraph v-if="item.Id=='white_label_other'&&item.plugData.Type==4" :plugData="item.plugData"></paragraph>
        <photo v-if="item.Id=='white_label_other'&&item.plugData.Type==5" :plugData="item.plugData"></photo>
        <!--待完善-->
        <diyForm v-if="item.Id=='white_label_other'&&item.plugData.Type==6" :plugData="item.plugData" :TCID="0"> </diyForm>

        <!--自訂版型(背景圖)white_label_background_article-->
        <bgArticleLeft v-if="item.Id=='white_label_background_article'&&item.plugData.Type==1"
          :plugData="item.plugData"></bgArticleLeft>
        <bgArticleCenter v-if="item.Id=='white_label_background_article'&&item.plugData.Type==2"
          :plugData="item.plugData"></bgArticleCenter>
        <bgArticleRight v-if="item.Id=='white_label_background_article'&&item.plugData.Type==3"
          :plugData="item.plugData"></bgArticleRight>

        <!--自訂版型(段落標題)-->
        <paragraph1 v-if="item.Id=='white_label_paragraph_title'&&item.plugData.Type==1" :plugData="item.plugData">
        </paragraph1>
        <paragraph2 v-if="item.Id=='white_label_paragraph_title'&&item.plugData.Type==2" :plugData="item.plugData">
        </paragraph2>
        <paragraph3 v-if="item.Id=='white_label_paragraph_title'&&item.plugData.Type==3" :plugData="item.plugData">
        </paragraph3>
        <paragraphleft v-if="item.Id=='white_label_paragraph_title'&&item.plugData.Type==4" :plugData="item.plugData">
        </paragraphleft>
        <paragraphright v-if="item.Id=='white_label_paragraph_title'&&item.plugData.Type==5" :plugData="item.plugData">
        </paragraphright>
        <paragraphafter v-if="item.Id=='white_label_paragraph_title'&&item.plugData.Type==6" :plugData="item.plugData">
        </paragraphafter>
        <!--自訂版型(段落連結)和挑選自有行程(段落連結) white_label_link_paragraph和b2b_LinkP -->
        <plinkLeft v-if="(item.Id=='white_label_link_paragraph'||item.Id=='b2b_LinkP')&&item.plugData.Type==1"
          :plugData="item.plugData"></plinkLeft>
        <plinkRight v-if="(item.Id=='white_label_link_paragraph'||item.Id=='b2b_LinkP')&&item.plugData.Type==2"
          :plugData="item.plugData"></plinkRight>

        <!--自訂版型(圖片連結)和挑選自有行程(圖片連結)white_label_link_picture和b2b_LinkPicture-->
        <ilinkLeft v-if="(item.Id=='white_label_link_picture'||item.Id=='b2b_LinkPicture')&&item.plugData.Type==1"
          :plugData="item.plugData"></ilinkLeft>
        <ilinkRight v-if="(item.Id=='white_label_link_picture'||item.Id=='b2b_LinkPicture')&&item.plugData.Type==2"
          :plugData="item.plugData"></ilinkRight>

        <!--自訂版型(輪播圖)white_label_slider-->
        <sliderBig v-if="item.Id=='white_label_slider'&&item.plugData.Type==1" :plugData="item.plugData"></sliderBig>
        <sliderSmall v-if="item.Id=='white_label_slider'&&item.plugData.Type==2" :plugData="item.plugData">
        </sliderSmall>

        <!--出团表-->

        <!--挑选自有行程(图片)b2b -->
        <diyImgOne v-if="item.Id=='b2b'&&item.plugData.Type==1" :plugData="item.plugData"></diyImgOne>
        <diyImgTwo v-if="item.Id=='b2b'&&item.plugData.Type==2" :plugData="item.plugData"></diyImgTwo>
        <diyImgFour v-if="item.Id=='b2b'&&item.plugData.Type==3" :plugData="item.plugData"></diyImgFour>
        <diyImgSix v-if="item.Id=='b2b'&&item.plugData.Type==4" :plugData="item.plugData"></diyImgSix>

        <!--搜尋區塊(Banner)search_b -->
        <searchb1 v-if="item.Id=='search_b'&&item.plugData.Type==1" :plugData="item.plugData"></searchb1>
        <searchb2 v-if="item.Id=='search_b'&&item.plugData.Type==2" :plugData="item.plugData"></searchb2>
        <searchb3 v-if="item.Id=='search_b'&&item.plugData.Type==3" :plugData="item.plugData"></searchb3>
        <searchb4 v-if="item.Id=='search_b'&&item.plugData.Type==4" :plugData="item.plugData"></searchb4>

        <!--搜尋區塊(輪播淡出)search_sf -->
        <searchsf1 v-if="item.Id=='search_sf'&&item.plugData.Type==1" :plugData="item.plugData"></searchsf1>
        <searchsf2 v-if="item.Id=='search_sf'&&item.plugData.Type==2" :plugData="item.plugData"></searchsf2>
        <searchsf3 v-if="item.Id=='search_sf'&&item.plugData.Type==3" :plugData="item.plugData"></searchsf3>

        <!--搜尋區塊(輪播橫)search_s -->
        <searchsf1 v-if="item.Id=='search_s'&&item.plugData.Type==1" :plugData="item.plugData"></searchsf1>
        <searchsf2 v-if="item.Id=='search_s'&&item.plugData.Type==2" :plugData="item.plugData"></searchsf2>
        <searchsf3 v-if="item.Id=='search_s'&&item.plugData.Type==3" :plugData="item.plugData"></searchsf3>

        <!--搜尋區塊(其他)search_el -->
        <searchel1 v-if="item.Id=='search_el'&&item.plugData.Type==1" :plugData="item.plugData"></searchel1>
        <!--出團表group -->
        <travelList v-if="item.Id=='group'" :plugData="item.plugData"></travelList>
      </div>

    </template>
  </q-page>

</template>
<script>
  //出團表 group -Start
  import travelList from "../components/group/travel-list";
  //出團表 group -End

  //搜尋區塊(輪播橫)search_s -Start
  import searchs1 from "../components/search_s/search_s1";
  import searchs2 from "../components/search_s/search_s2";
  import searchs3 from "../components/search_s/search_s3";
  //搜尋區塊(輪播橫)search_s -End

  //搜尋區塊(Banner)search_b -Start
  import searchb1 from "../components/search_b/search_b1";
  import searchb2 from "../components/search_b/search_b2";
  import searchb3 from "../components/search_b/search_b3";
  import searchb4 from "../components/search_b/search_b4";
  //搜尋區塊(Banner)search_b -End

  //搜尋區塊(輪播淡出)search_sf -Start
  import searchsf1 from "../components/search_sf/search_sf1";
  import searchsf2 from "../components/search_sf/search_sf2";
  import searchsf3 from "../components/search_sf/search_sf3";
  //搜尋區塊(輪播淡出)search_sf -End

  //搜尋區塊(其他)search_el -Start
  import searchel1 from "../components/search_el/search_el1";
  //搜尋區塊(其他)search_el -End

  //自訂版型(影片)white_label_video -Start
  import videoOne from "../components/label_video/video-one";
  import videoTwo from "../components/label_video/video-two";
  //自訂版型(影片)white_label_video -End

  //自訂版型(圖片)和挑選自有行程(圖片) white_label_picture和b2b -Start
  import diyImgOne from "../components/label_picture/diy-img-one";
  import diyImgTwo from "../components/label_picture/diy-img-two";
  import diyImgThree from "../components/label_picture/diy-img-three";
  import diyImgFour from "../components/label_picture/diy-img-four";
  import diyImgFive from "../components/label_picture/diy-img-five";
  import diyImgSix from "../components/label_picture/diy-img-six";
  //自訂版型(圖片)和挑選自有行程(圖片) white_label_picture和b2b -End

  //自訂版型(QRcode)white_label_qrcode -Start
  import qrLeft from "../components/label_qrcode/left";
  import qrRight from "../components/label_qrcode/right";
  //自訂版型(QRcode)white_label_qrcode -End

  //自訂版型(背景圖)white_label_background_article  -Start
  import bgArticleLeft from "../components/label_background_article/left";
  import bgArticleRight from "../components/label_background_article/right";
  import bgArticleCenter from "../components/label_background_article/center";
  //自訂版型(背景圖)white_label_background_article  -ENd

  //自訂版型(段落標題)white_label_paragraph_title  -Start
  import paragraph1 from "../components/label_paragraph_title/paragraph1";
  import paragraph2 from "../components/label_paragraph_title/paragraph2";
  import paragraph3 from "../components/label_paragraph_title/paragraph3";
  import paragraphleft from "../components/label_paragraph_title/paragraph-left";
  import paragraphright from "../components/label_paragraph_title/paragraph-right";
  import paragraphafter from "../components/label_paragraph_title/paragraph-after";
  //自訂版型(段落標題)white_label_paragraph_title  -End

  //自訂版型(段落連結)和挑選自有行程(段落連結)white_label_link_paragraph和b2b_LinkP -Start
  import plinkLeft from "../components/label_link_paragraph/left";
  import plinkRight from "../components/label_link_paragraph/right";
  //自訂版型(段落連結)和挑選自有行程(段落連結)white_label_link_paragraph和b2b_LinkP -End

  //自訂版型(圖片連結)和挑選自有行程(圖片連結)white_label_link_picture和b2b_LinkPicture -Start
  import ilinkLeft from "../components/label_link_picture/left";
  import ilinkRight from "../components/label_link_picture/right";
  //自訂版型(圖片連結)和挑選自有行程(圖片連結)white_label_link_picture和b2b_LinkPicture -End

  //自訂版型(輪播圖)white_label_slider -Start
  import sliderBig from "../components/label_slider/big";
  import sliderSmall from "../components/label_slider/small";
  //自訂版型(輪播圖)white_label_slider -End

  //自訂版型(其他)white_label_other-Start
  import empty from "../components/label_other/empty";
  import downloadTable from "../components/label_other/downloadTable";
  import diyTitle from "../components/label_other/diy-title";
  import paragraph from "../components/label_other/paragraph";
  import photo from "../components/label_other/photo";
  import diyForm from "../components/label_other/diy-form";
  //自訂版型(其他)white_label_other-End
  export default {
    name: "PageAbout",
    components: {
      searchs1,
      searchs2,
      searchs3,
      searchb1,
      searchb2,
      searchb3,
      searchb4,
      searchsf1,
      searchsf2,
      searchsf3,
      searchel1,
      videoOne,
      videoTwo,
      diyImgOne,
      diyImgTwo,
      diyImgThree,
      diyImgFour,
      diyImgFive,
      diyImgSix,
      qrLeft,
      qrRight,
      bgArticleLeft,
      bgArticleRight,
      bgArticleCenter,
      paragraph1,
      paragraph2,
      paragraph3,
      paragraphleft,
      paragraphright,
      paragraphafter,
      plinkLeft,
      plinkRight,
      ilinkLeft,
      ilinkRight,
      sliderBig,
      sliderSmall,
      empty,
      downloadTable,
      diyTitle,
      paragraph,
      photo,
      diyForm,
      travelList
    },
    data() {
      return {
        RB_Group_Id: 0,
        AboutData: {},
      };
    },
    created() {
      this.getAbout();
    },
    mounted() {
      var jObj = JSON.parse(localStorage.getItem('groupinfo'));
      this.RB_Group_Id = jObj.GroupId;
      this.getAbout();
    },
    methods: {
      getAbout() {
        this.apipost(
          "ws_get_GetAboutPage", {
            RB_Group_Id: this.RB_Group_Id
          },
          res => {
            if (res.data.resultCode == 1) {
              if (res.data.data) {
                this.AboutData = res.data.data;
              }
            }
          },
          err => {}
        );
      }
    },
  };

</script>
