Sfoglia il codice sorgente

添加一个新的模板

cxmo 5 mesi fa
parent
commit
89dabd5049

+ 2 - 1
src/views/ppt_manage/mixins/pptMixins.js

@@ -25,6 +25,7 @@ import FormatNine from '../newVersion/components/formatPage/FormatNine.vue';
 import FormatTen from '../newVersion/components/formatPage/FormatTen.vue';
 import FormatEle from '../newVersion/components/formatPage/FormatEle.vue';
 import FormatTwelve from '../newVersion/components/formatPage/FormatTwelve.vue';
+import FormatThirteen from '../newVersion/components/formatPage/FormatThirteen.vue';
 const chunkArray = (array, chunkSize)=>{
     let result = [];
     for (let i = 0; i < array.length; i += chunkSize) {
@@ -34,7 +35,7 @@ const chunkArray = (array, chunkSize)=>{
 }
 export default {
   components:{ FormatOne,FormatTwo,FormatThree,
-    FormatFour,FormatFive,FormatSix,FormatSeven,FormatEight,FormatNine,FormatTen,FormatEle,FormatTwelve},
+    FormatFour,FormatFive,FormatSix,FormatSeven,FormatEight,FormatNine,FormatTen,FormatEle,FormatTwelve,FormatThirteen},
   computed: {
     globalLang() { //全局语言版本 中文ppt可用 英文ppt固定en忽视
       return this.$store.state.lang

+ 8 - 7
src/views/ppt_manage/newVersion/components/editor/AddFormat.vue

@@ -36,6 +36,7 @@ import FormatPreNine from "@/views/ppt_manage/newVersion/components/formatPrevie
 import FormatPreTen from "@/views/ppt_manage/newVersion/components/formatPreview/FormatPreTen";
 import FormatPreEle from "@/views/ppt_manage/newVersion/components/formatPreview/FormatPreEle";
 import FormatPreTwelve from "@/views/ppt_manage/newVersion/components/formatPreview/FormatPreTwelve";
+import FormatPreThirteen from "@/views/ppt_manage/newVersion/components/formatPreview/FormatPreThirteen";
 import {countComponentName} from '@/views/ppt_manage/newVersion/utils/untils';
 export default {
   name: "AddFormat",
@@ -57,7 +58,8 @@ export default {
     FormatPreNine,
     FormatPreTen,
     FormatPreEle,
-    FormatPreTwelve
+    FormatPreTwelve,
+    FormatPreThirteen
   },
   data() {
     return {
@@ -77,23 +79,22 @@ export default {
         this.clickRightTime = this.formatArr.length - this.lineShowNum
         //获取容器宽度,以确定一个format应占宽度
         const parentWidth = $('.format-wrap').width()
-        this.itemOccupyMargin = ((parentWidth/this.lineShowNum).toFixed(2) - this.itemWidth)/2
+        this.itemOccupyMargin = ((parentWidth/this.lineShowNum - this.itemWidth - 0.5)/2).toFixed(2)
     },
     scrollPrev(){
         if(this.clickLeftTime<=0) return 
         this.clickLeftTime--
         this.clickRightTime++
-        this.scrollFormat('prev',this.clickLeftTime)
+        this.scrollFormat(this.clickLeftTime)
     },
     scrollNext(){
         if(this.clickRightTime===0) return
         this.clickRightTime--
         this.clickLeftTime++
-        this.scrollFormat('next',this.clickLeftTime)
+        this.scrollFormat(this.clickLeftTime)
     },
-    scrollFormat(type,multiple){
-        const factor = type==='prev'?1:-1
-        this.scrollOffset = factor*(multiple*this.itemWidth+this.itemOccupyMargin)
+    scrollFormat(multiple){
+        this.scrollOffset = -(multiple*this.itemWidth+Number(this.itemOccupyMargin))
     },
     previewComponentName(modelId) {
       return countComponentName(modelId,'pre')

+ 3 - 1
src/views/ppt_manage/newVersion/components/editor/ChangeFormatDialog.vue

@@ -48,6 +48,7 @@ import FormatPreNine from "@/views/ppt_manage/newVersion/components/formatPrevie
 import FormatPreTen from "@/views/ppt_manage/newVersion/components/formatPreview/FormatPreTen";
 import FormatPreEle from "@/views/ppt_manage/newVersion/components/formatPreview/FormatPreEle";
 import FormatPreTwelve from "@/views/ppt_manage/newVersion/components/formatPreview/FormatPreTwelve";
+import FormatPreThirteen from "@/views/ppt_manage/newVersion/components/formatPreview/FormatPreThirteen";
 import {countComponentName} from '@/views/ppt_manage/newVersion/utils/untils';
 export default {
   props:{
@@ -71,7 +72,8 @@ export default {
     FormatPreNine,
     FormatPreTen,
     FormatPreEle,
-    FormatPreTwelve
+    FormatPreTwelve,
+    FormatPreThirteen
   },
   data() {
     return {

+ 2 - 1
src/views/ppt_manage/newVersion/components/editor/DeletePageDialog.vue

@@ -105,6 +105,7 @@ import FormatNine from '@/views/ppt_manage/newVersion/components/formatPage/Form
 import FormatTen from '@/views/ppt_manage/newVersion/components/formatPage/FormatTen.vue';
 import FormatEle from '@/views/ppt_manage/newVersion/components/formatPage/FormatEle.vue';
 import FormatTwelve from '@/views/ppt_manage/newVersion/components/formatPage/FormatTwelve.vue';
+import FormatThirteen from '@/views/ppt_manage/newVersion/components/formatPage/FormatThirteen.vue';
 import {countComponentName} from '@/views/ppt_manage/newVersion/utils/untils';
 export default {
   props:{
@@ -120,7 +121,7 @@ export default {
     }
   },
   components:{ FormatOne,FormatTwo,FormatThree,
-    FormatFour,FormatFive,FormatSix,FormatSeven,FormatEight,FormatNine,FormatTen,FormatEle,FormatTwelve},  
+    FormatFour,FormatFive,FormatSix,FormatSeven,FormatEight,FormatNine,FormatTen,FormatEle,FormatTwelve,FormatThirteen},  
   data() {
     return {
       startPageNum:null,//开始的页数

+ 80 - 0
src/views/ppt_manage/newVersion/components/formatPage/FormatThirteen.vue

@@ -0,0 +1,80 @@
+<template>
+    <div class="total-wrap flex-column format-thirteen" :style="{'pointer-events' :isPreview?'none':'auto'}">
+      <div class="wrap-full-top flex-center" :style="pageItem.layers&&!isLayerShow()?TypeName(1)==='ChartEl'?'z-index:5':'z-index:3':''">
+        <component
+          :data-position="1"
+          :is="TypeName(1)"
+          :ref="RefName(1)"
+          :index="pageIndex"
+          :position="1"
+          :item="Item(1)"
+          @dragstart.native="onDragStart"
+          @dragover.native="onDragOver"
+          @drop.native="onDrop"
+          @getText="getText($event,1)"
+        ></component>
+      </div>
+      <div class="wrap-full-bottom flex-center" :style="pageItem.layers&&!isLayerShow()?TypeName(2)==='ChartEl'?'z-index:5':'z-index:3':''">
+        <component
+          :data-position="2"
+          :is="TypeName(2)"
+          :ref="RefName(2)"
+          :index="pageIndex"
+          :position="2"
+          :item="Item(2)"
+          @dragstart.native="onDragStart"
+          @dragover.native="onDragOver"
+          @drop.native="onDrop"
+          @getText="getText($event,2)"
+        ></component>
+      </div>
+      <!-- 图层编辑模式 -->
+      <div class="layers" :id="`layers_${pageItem.id}`"
+          v-if="isLayerShow()" @click.stop="clickLayer" @contextmenu.stop="showLayerContentMenu">
+        <template v-for="item in pageItem.layers">
+          <component
+            :is="getLayerElName(item)"
+            :key="item.id"
+            :elementInfo="item"
+            :isActive="item.id===activeLayerEl.id&&!isClickLayer"
+            :isLayerEdit="true"
+            @click.stop.native="changeActEl(item)"
+            @chooseThis="changeActEl(item)"
+            v-on="$listeners"
+          ></component>
+          <!-- @deleteLayer="delLayer" -->
+        </template>
+      </div>
+      <!-- 非图层编辑模式 -->
+      <template v-else>
+        <template v-for="item in pageItem.layers">
+          <component
+            :is="getLayerElName(item)"
+            :key="item.id"
+            :elementInfo="item"
+            :isActive="false"
+            :isLayerEdit="false"
+          ></component>
+        </template>
+      </template>
+    </div>
+  </template>
+  
+  <script>
+  import mixin from "./mixins";
+  import {defaultPosition} from "../../utils/config";
+  export default {
+    name: "formatThirteen",
+    mixins: [mixin],
+    data(){
+      return {
+        modelId:13,
+        positionInfo:defaultPosition[13]
+      }
+    },
+  };
+  </script>
+  
+  <style scoped lang="scss">
+  </style>
+  

+ 4 - 1
src/views/ppt_manage/newVersion/components/formatPreview/FormatPreEle.vue

@@ -31,8 +31,11 @@
   <style scoped lang="scss">
   .format-pre-wrap{
     .line{
+        width:100%;
+        height: 30%;
         img{
-            width:40%;
+            width: 50%;
+            height: 100%;
         }
     }
   }

+ 26 - 0
src/views/ppt_manage/newVersion/components/formatPreview/FormatPreThirteen.vue

@@ -0,0 +1,26 @@
+<template>
+    <div class="format-pre-wrap flex-center" style="flex-direction: column;">
+      <div class="half-top flex-center">
+        <img class="full" style="object-fit:fill !important;"
+          src="~@/assets/img/ppt_m/format-pic.png" />
+      </div>
+      <div class="half-bottom flex-center">
+        <img class="full" style="object-fit:fill !important;"
+          src="~@/assets/img/ppt_m/format-pic.png" />
+      </div>
+    </div>
+  </template>
+  
+  <script>
+  export default {
+    name: "formatPreThirteen",
+    data() {
+      return {};
+    },
+    methods: {},
+  };
+  </script>
+  
+  <style scoped lang="scss">
+  </style>
+  

+ 22 - 1
src/views/ppt_manage/newVersion/css/format.scss

@@ -356,11 +356,14 @@ $marginTop:14%;
         }
     }
 
-    //版式8 9
+    //版式8 9 13
     .wrap-full-top,.wrap-full-bottom{
       width:100%;
       height:50%;
       position:relative;
+      .chart-bottom-insruction-info{
+        top:93%;
+      }
       &.top-70{
         height:70%;
         .chart-bottom-insruction-info{
@@ -426,6 +429,24 @@ $marginTop:14%;
             top:93%;
         }
     }
+    .format-thirteen{
+        .wrap-full-top{
+            .chart-wrap{
+                top: 2%;
+            }
+            .chart-bottom-insruction-info{
+                top:92%;
+            }
+        }
+        .wrap-full-bottom{
+            .chart-wrap{
+                top: 0%;
+            }
+            .chart-bottom-insruction-info{
+                top:90%;
+            }
+        }
+    }
     
     //layer-mask 更改版式345 9布局, ↑原先样式保留不动
     .wrap-full-left-half{

+ 32 - 1
src/views/ppt_manage/newVersion/utils/config.js

@@ -93,6 +93,9 @@ export const formatPre = [{
     },{
         modelId:12,
         text:'上6图'
+    },{
+        modelId:13,
+        text:'xxx'
     }
 ]
 //版式id对应组件名
@@ -108,7 +111,8 @@ export const modelMap = {
     9: 'Nine',
     10:'Ten',
     11:'Ele',
-    12:'Twelve'
+    12:'Twelve',
+    13:'Thirteen'
 }
 //版式信息,用于判断图表/文字插入哪个位置
 export const modelInfo = {
@@ -205,6 +209,13 @@ export const modelInfo = {
         elTextNum:1,
         elTextPosition: 7
     },
+    13:{
+        elNum:2,
+        elType:['chart','chart'],
+        positions:[1,2],
+        elChartNum:2,
+        elTextNum:0
+    }
 }
 
 //给标题预留的位置,单位%
@@ -512,6 +523,22 @@ export const modelConfig = [{
             x:0,
             y:74
         }]
+    },{
+        modelId:13,
+        elements:[{
+            position:1,
+            width:100,
+            height:(restHeight)*0.5*0.9,
+            x:0,
+            y:(restHeight*0.5-restHeight*0.5*0.9)/2
+        },
+        {
+            position:2,
+            width:100,
+            height:(restHeight)*0.5*0.9,
+            x:0,
+            y:(restHeight)*0.5
+        }]
     }
 ]
 //ppt母版
@@ -809,6 +836,10 @@ export const defaultPosition = {
     6:{type:'chart'},
     7:{type:'text'}
   },
+  13:{
+    1:{type:'chart'},
+    2:{type:'chart'}
+  }
 }
 //画笔工具栏
 export const boardTool = [

+ 6 - 0
src/views/ppt_manage/newVersion/utils/untils.js

@@ -355,6 +355,9 @@ export const getTextContentSize = (model,position)=>{
             6:[1,1,0.33,1,0.9],
             7:[1,1,0.9],
         },
+        13:{
+            1:[],2:[]
+        }
     }
     const modelMapHeight = {
         1:{
@@ -409,6 +412,9 @@ export const getTextContentSize = (model,position)=>{
             6:[0.86,0.4,1,0.9],
             7:[0.86,0.18,0.8],
         },
+        13:{
+            1:[],2:[]
+        }
     }
     const baseWidth=900,baseHeight=630
     const width = modelMapWidth[model][position].reduce((pre,curr)=>{