<template>
  <!-- 展览效果预览图 -->
  <div>
    <div class="container" v-if="info">
      <NavBar />
      <NormalStyle
        v-if="info.themeType == NORMAL_STYLE.value"
        :displayDetail="info"
        :dicts="dicts"
      />
      <ChStyle
        v-if="info.themeType == CH_STYLE.value"
        :displayDetail="info"
        :dicts="dicts"
      />
      <RedStyle
        v-if="info.themeType == RED_STYLE.value"
        :displayDetail="info"
        :dicts="dicts"
      />
      <Footer />
    </div>
    <el-empty v-else />
  </div>
</template>

<script>
import NormalStyle from "@/views/display/components/templates/NormalStyle.vue";
import ChStyle from "@/views/display/components/templates/ChStyle.vue";
import RedStyle from "@/views/display/components/templates/RedStyle.vue";
import NavBar from "@/components/NavBar";
import Footer from "@/components/Footer";
import { THEME_TYPE } from "@/contants/display";
export default {
  components: {
    NormalStyle,
    ChStyle,
    RedStyle,
    NavBar,
    Footer,
  },
  props: {
    // 展览本身信息
    info: {
      type: Object,
      default: () => ({}),
    },
    // 字典值
    dicts: {
      type: Object,
      default: () => ({}),
    },
  },
  data() {
    return {
      ...THEME_TYPE,
    };
  },
};
</script>

<style></style>
