|
@@ -0,0 +1,105 @@
|
|
|
+<script setup>
|
|
|
+import {ref} from 'vue'
|
|
|
+import {getPPTContentType,getPPTContentItemData,getPPTLayerType} from '../hooks/createPPTContent'
|
|
|
+
|
|
|
+const props=defineProps({
|
|
|
+ pageData:{
|
|
|
+ type:Object,
|
|
|
+ default:{}
|
|
|
+ }
|
|
|
+})
|
|
|
+
|
|
|
+const lang=ref(window.location.pathname.startsWith('/ppten')?'en':'zh')
|
|
|
+
|
|
|
+</script>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <div :class="['ppt-item-box ppt-item-page',lang=='en'?'ppt-item-box_en':'']">
|
|
|
+ <div class="ppt-title-box">{{pageData.title}}</div>
|
|
|
+ <div class="ppt-content-box">
|
|
|
+ <div class="container">
|
|
|
+ <div class="line">
|
|
|
+ <div class="line-item">
|
|
|
+ <component
|
|
|
+ :is="getPPTContentType(1,pageData.elements)"
|
|
|
+ :itemData="getPPTContentItemData(1,pageData)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="line-item">
|
|
|
+ <component
|
|
|
+ :is="getPPTContentType(2,pageData.elements)"
|
|
|
+ :itemData="getPPTContentItemData(2,pageData)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="line-item">
|
|
|
+ <component
|
|
|
+ :is="getPPTContentType(3,pageData.elements)"
|
|
|
+ :itemData="getPPTContentItemData(3,pageData)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="line">
|
|
|
+ <div class="line-item">
|
|
|
+ <component
|
|
|
+ :is="getPPTContentType(4,pageData.elements)"
|
|
|
+ :itemData="getPPTContentItemData(4,pageData)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="line-item">
|
|
|
+ <component
|
|
|
+ :is="getPPTContentType(5,pageData.elements)"
|
|
|
+ :itemData="getPPTContentItemData(5,pageData)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="line-item">
|
|
|
+ <component
|
|
|
+ :is="getPPTContentType(6,pageData.elements)"
|
|
|
+ :itemData="getPPTContentItemData(6,pageData)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="bottom-18">
|
|
|
+ <component
|
|
|
+ :is="getPPTContentType(7,pageData.elements)"
|
|
|
+ :itemData="getPPTContentItemData(7,pageData)"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="layer-wrap">
|
|
|
+ <template v-for="item in pageData.layers" :key="item.id">
|
|
|
+ <component
|
|
|
+ :is="getPPTLayerType(item)"
|
|
|
+ :itemData="item"
|
|
|
+ />
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+// @import '../style/common.scss';
|
|
|
+.ppt-content-box{
|
|
|
+ .container{
|
|
|
+ .line{
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ height:40%;
|
|
|
+ .line-item{
|
|
|
+ width:33%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .bottom-18{
|
|
|
+ width:100%;
|
|
|
+ height:18%;
|
|
|
+
|
|
|
+ .rich-text-box{
|
|
|
+ width:90%;
|
|
|
+ height:100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|