no message

src/hooks/useImport.ts

@@ -120,6 +120,7 @@ export default () => {
           id: nanoid(10),
           elements: [],
           background,
+          pageType: 1
         }
 
         const parseElements = (elements: Element[]) => {

src/hooks/useSlideHandler.ts

@@ -35,6 +35,7 @@ export default () => {
         type: 'solid',
         color: theme.value.backgroundColor,
       },
+      pageType: 1
     }
     slidesStore.updateSlideIndex(0)
     mainStore.setActiveElementIdList([])
@@ -84,6 +85,7 @@ export default () => {
         type: 'solid',
         color: theme.value.backgroundColor,
       },
+      pageType: 1,
     }
     mainStore.setActiveElementIdList([])
     slidesStore.addSlide(emptySlide)

src/mocks/layout.ts

@@ -5,6 +5,7 @@ import type { Slide } from '@/types/slides'
 export const layouts: Slide[] = [
   {
     id: 'template',
+    pageType: 1,
     elements: [
       {
         type: 'shape',
@@ -80,6 +81,7 @@ export const layouts: Slide[] = [
   },
   {
     id: 'template',
+    pageType: 2,
     elements: [
       {
         type: 'text',
@@ -139,6 +141,7 @@ export const layouts: Slide[] = [
   },
   {
     id: 'template',
+    pageType: 3,
     elements: [
       {
         type: 'shape',
@@ -188,6 +191,7 @@ export const layouts: Slide[] = [
   },
   {
     id: 'MZVO1kkj',
+    pageType: 4,
     elements: [
       {
         type: 'shape',
@@ -273,6 +277,7 @@ export const layouts: Slide[] = [
   },
   {
     id: 'template',
+    pageType: 4,
     elements: [
       {
         type: 'shape',
@@ -457,6 +462,7 @@ export const layouts: Slide[] = [
   },
   {
     id: 'template',
+    pageType: 4,
     elements: [
       {
         type: 'shape',
@@ -510,6 +516,7 @@ export const layouts: Slide[] = [
   },
   {
     id: 'template',
+    pageType: 1,
     elements: [
       {
         type: 'text',
@@ -573,6 +580,7 @@ export const layouts: Slide[] = [
   },
   {
     id: 'template',
+    pageType: 1,
     elements: [
       {
         type: 'text',
@@ -690,6 +698,7 @@ export const layouts: Slide[] = [
   },
   {
     id: 'template',
+    pageType: 1,
     elements: [
       {
         type: 'text',
@@ -766,6 +775,7 @@ export const layouts: Slide[] = [
   },
   {
     id: 'template',
+    pageType: 1,
     elements: [
       {
         type: 'shape',

src/mocks/slides.ts

 import type { Slide } from '@/types/slides'
 
+// pageType 1基础 2酒店 3景 4餐
 export const slides: Slide[] = [
   {
     id: 'test-slide-1',
+    pageType: 1,
     elements: [
       {
         type: 'shape',
@@ -77,6 +79,7 @@ export const slides: Slide[] = [
   },
   {
     id: 'test-slide-2',
+    pageType: 2,
     elements: [
       {
         type: 'text',
@@ -136,6 +139,7 @@ export const slides: Slide[] = [
   },
   {
     id: 'test-slide-3',
+    pageType: 3,
     elements: [
       {
         type: 'shape',

src/types/slides.ts

@@ -676,6 +676,7 @@ export interface Slide {
   background?: SlideBackground
   animations?: PPTAnimation[]
   turningMode?: TurningMode
+  pageType: number
 }
 
 /**

src/views/Editor/DataaSource/index.vue

@@ -69,24 +69,27 @@
         let obj = slidesData.find((x,index)=>{
             return slideIndex.value == index
         })
-        obj&&obj.elements&&obj.elements.forEach(x=>{
-            let dataObj = datas.DataSource.DataSourceList.find(y=>{
-                return y.id == x.id
+        if(obj){
+            obj.elements.forEach(x=>{
+                let dataObj = datas.DataSource.DataSourceList.find(y=>{
+                    return y.id == x.id
+                })
+                if(dataObj){
+                    x = dataObj
+                }
+                savelides.push(x)
             })
-            if(dataObj){
-                x = dataObj
-            }
-            savelides.push(x)
-        })
-        obj.elements = savelides
-        slidesData.forEach((x,index)=>{
-            if(slideIndex.value == index){
-                x.elements = obj.elements
+            obj.elements = savelides
+            slidesData.forEach((x,index)=>{
+                if(slideIndex.value == index){
+                    x.pgaeType = datas.DataSource.pgaeType
+                    x.elements = obj.elements
+                }
+                newSlides.push(x)
+            })
+            if(obj&&obj.TemplateDataSource&&obj.TemplateDataSource.Id){
+                slidesStore.setSlides(newSlides)
             }
-            newSlides.push(x)
-        })
-        if(obj.TemplateDataSource&&obj.TemplateDataSource.Id){
-            slidesStore.setSlides(newSlides)
         }
     })
     watch(datas.DataSource, (n, o) => {

src/views/Editor/EditorHeader/index.vue

@@ -109,7 +109,7 @@ import PopoverMenuItem from '@/components/PopoverMenuItem.vue'
 
 const mainStore = useMainStore()
 const slidesStore = useSlidesStore()
-const { title } = storeToRefs(slidesStore)
+const { title, slides } = storeToRefs(slidesStore)
 const { enterScreening, enterScreeningFromStart } = useScreening()
 const { importSpecificFile, importPPTXFile, exporting } = useImport()
 const { resetSlides } = useSlideHandler()
@@ -137,9 +137,11 @@ const UploadPsd = () => {
 
 // 保存
 const setTemplate = async () =>{
-  console.log(datas.DataSource.DataSourceList,'----保存接口',queryObj.value)
+  // console.log(JSON.stringify(slides.value),'----保存接口',queryObj.value)
+  console.log(slides.value,'=============')
   if(queryObj.value.Title==''||!queryObj.value.LineId||!queryObj.value.LtId
-  ||queryObj.value.CoverImg==''||queryObj.value.CountryName==''||queryObj.value.SeasonName==''
+  // ||queryObj.value.CoverImg==''
+  ||queryObj.value.CountryName==''||queryObj.value.SeasonName==''
   ||queryObj.value.ColorName==''||queryObj.value.ColorStr==''||queryObj.value.LineName==''){
     return ElMessage({
       showClose: true,
@@ -147,21 +149,21 @@ const setTemplate = async () =>{
       type: 'warning',
     })
   }
-  if(datas.DataSource.DataSourceList.length>0){
-    let obj = datas.DataSource.DataSourceList.find(x=>{
-      return !x.TemplateDataSource.Id||!x.TemplateDataSource
-    })
-    if(!obj){
-      return ElMessage({
-        showClose: true,
-        message: '请绑定数据源',
-        type: 'warning',
-      })
+  for(let i=0;i<slides.value.length;i++){
+    for(let j=0;j<slides.value[i].elements.length;j++){
+      if(slides.value[i].elements[j].type=="text"||slides.value[i].elements[j].type=="image"){
+        if(!slides.value[i].elements[j].TemplateDataSource
+        ||!slides.value[i].elements[j].TemplateDataSource.Id) {
+          return ElMessage({
+            showClose: true,
+            message: `请完善 第 ${i+1} 页 需要绑定的数据源`,
+            type: 'warning',
+          })
+        }
+      }
     }
   }
-  queryObj.value.TempData = JSON.stringify(datas.DataSource.DataSourceList)
-  
-  return
+  queryObj.value.TempData = JSON.stringify(slides.value)
   datas.loading = true
   try {
       let TemplateRes = await ConfigService.SetTripTemplateSlide(queryObj.value);

src/views/Editor/Thumbnails/index.vue

@@ -57,6 +57,7 @@ import useSlideHandler from '@/hooks/useSlideHandler'
 import useScreening from '@/hooks/useScreening'
 import useLoadSlides from '@/hooks/useLoadSlides'
 import { injectKeyDataSource } from '@/types/injectKey'
+import ConfigService from '@/services/ConfigService'
 
 import ThumbnailSlide from '@/views/components/ThumbnailSlide/index.vue'
 import LayoutPool from './LayoutPool.vue'
@@ -91,12 +92,40 @@ const {
 const datas = reactive({
   DataSource:{}
 })
+const queryObj = ref({} as any)
 datas.DataSource = inject(injectKeyDataSource)
+// 获取行程模版数据
+const GetTripTemplate = async () =>{
+  try {
+      let queryMsg = {
+        TempId:datas.DataSource.queryObj.TempId
+      }
+      let dataRes = await ConfigService.GetTripTemplateSlide(queryMsg);
+      if (dataRes.data.resultCode == 1) {
+        const newSlides = JSON.parse(dataRes.data.data.TempData)
+        slidesStore.setSlides(newSlides)
+        queryObj.value.TempId = dataRes.data.data.TempId
+        queryObj.value.LineId = dataRes.data.data.LineId
+        queryObj.value.LineName = dataRes.data.data.LineName
+        queryObj.value.LtId = dataRes.data.data.LtId
+        queryObj.value.Title = dataRes.data.data.Title
+        queryObj.value.TempData = dataRes.data.data.TempData
+        queryObj.value.CoverImg = dataRes.data.data.CoverImg
+        queryObj.value.CountryName = dataRes.data.data.CountryName
+        queryObj.value.SeasonName = dataRes.data.data.SeasonName
+        queryObj.value.ColorName = dataRes.data.data.ColorName
+        queryObj.value.ColorStr = dataRes.data.data.ColorStr
+        queryObj.value.TempType = dataRes.data.data.TempType
+      }
+  } catch (error) {
+      console.log("GetTripTemplateSlide", error);
+  }
+}
+GetTripTemplate()
 
 // 页面被切换时
 const thumbnailsRef = ref<InstanceType<typeof Draggable>>()
 watch(() => slideIndex.value, () => {
-
   // 清除多选状态的幻灯片
   if (selectedSlidesIndex.value.length) {
     mainStore.updateSelectedSlidesIndex([])
@@ -124,7 +153,11 @@ const getHtmlPlainText = (html_str) => {
       return ''
     }
 }
-
+queryObj.value = inject(injectKeyDataSource).queryObj
+let pageObj = slides.value.find((slide,indexs) => {
+  return slideIndex.value==indexs
+})
+// pageType.value = pageObj.pageType
 // 切换页面
 const changeSlideIndex = (index: number) => {
   mainStore.setActiveElementIdList([])
@@ -132,45 +165,36 @@ const changeSlideIndex = (index: number) => {
   const newElements = slides.value.find((slide,indexs) => {
     return index==indexs
   })
+  datas.DataSource.pageType = newElements.pageType
+  let TemplateList
+  if(newElements.pageType==1) TemplateList = datas.DataSource.jc
+  else if(newElements.pageType==2) TemplateList = datas.DataSource.jd
+  else if(newElements.pageType==3) TemplateList = datas.DataSource.jq
+  else if(newElements.pageType==4) TemplateList = datas.DataSource.cs
   datas.DataSource.DataSourceList = []
   newElements.elements.forEach(slide=>{
+    if(slide.type!="text"&&slide.type!="image") return
+    let FiledTypeStr
+    if(slide.type=="text") FiledTypeStr = getHtmlPlainText(slide.content)
+    if(slide.type=="image") FiledTypeStr = slide.src
     let Obj = {}
-    if(slide.type=="text"){
-      if(slide.FiledTypeStr){
-        Obj = {
-          ...slide,
-        }
-      }else{
-        Obj = {
-          ...slide,
-          FiledTypeStr: getHtmlPlainText(slide.content),
-          TemplateList: datas.DataSource.jc,
-          TemplateDataSource: {
-            Content: '',
-            Name: '',
-            Id: null as Number
-          },
-        }
+    if(slide.FiledTypeStr){
+      Obj = {
+        ...slide,
       }
-      datas.DataSource.DataSourceList.push(Obj)
-    }
-    if(slide.type=="image"){
-      if(slide.FiledTypeStr){
-        Obj = {
-          ...slide,
-        }
-      }else{
-        Obj = {
-          ...slide,
-          FiledTypeStr: getHtmlPlainText(slide.content),
-          TemplateList: datas.DataSource.jd,
-          TemplateDataSource: {
-            Content: '',
-            Name: '',
-            Id: null as Number
-          },
-        }
+    }else{
+      Obj = {
+        ...slide,
+        FiledTypeStr: FiledTypeStr,
+        TemplateList: TemplateList,
+        TemplateDataSource: {
+          Content: '',
+          Name: '',
+          Id: null as Number
+        },
       }
+    }
+    if(Obj){
       datas.DataSource.DataSourceList.push(Obj)
     }
   })

src/views/Editor/Toolbar/ElementTemplateData.vue

@@ -4,6 +4,18 @@
             <div class="row">
                 <Button style="flex: 1;" @click="AllDataSource()">数据源</Button>
               </div>
+            <p class="q-mt-md"><span class="Required q-mr-md">*</span>页面类型：</p>
+            <div class="row wrap q-mt-md">
+                <el-select v-model="datas.DataSource.pageType" class="m-2" 
+                    placeholder="请页面类型">
+                        <el-option
+                            v-for="item in pageTypesList"
+                            :key="item.key"
+                            :label="item.label"
+                            :value="item.key"
+                        />
+                </el-select>
+            </div>
             <p class="q-mt-md"><span class="Required q-mr-md">*</span>模版名称：</p>
             <div class="row wrap q-mt-md">
                 <el-input v-model="queryObj.Title" placeholder="输入模板名称" class="input-with-select"></el-input>
@@ -31,9 +43,6 @@
                             :value="item.LineID"
                         />
                 </el-select>
-                <!-- <el-check-tag :checked="queryObj.LineId == x.LineID" 
-                @change="onLineChangeHandler(x)"
-                class="text-small q-mr-md" v-for="x in lines" :key="x.LineID">{{x.LineName}}</el-check-tag> -->
             </div>
             <template v-if="Series.length>0">
                 <p class="q-mt-md"><span class="Required q-mr-md">*</span>选择系列：</p>
@@ -95,62 +104,81 @@
     const lines = ref([] as Array < any > ) //线路
     const Series = ref([] as Array < any > ) //系列
 
+    const pageTypesList = ref([
+        { label: '基础', key: 1 },
+        { label: '酒店', key: 2 },
+        { label: '景', key: 3 },
+        { label: '餐', key: 4 },
+    ])
+
     const slidesStore = useSlidesStore()
     const { slides, slideIndex } = storeToRefs(slidesStore)
     const setCountryValue = () =>{
-        let obj = dispositionObj.value.ColorList.filter(x=>{
-            return x.ColorValue == queryObj.ColorStr
+        let obj = dispositionObj.value.ColorList.find(x=>{
+            return x.ColorValue == queryObj.value.ColorStr
         })
         queryObj.value.ColorName = obj.ColorName
     }
+
+    //提取字符串中的文字
+    const getHtmlPlainText = (html_str) => {
+    let re = new RegExp('<[^<>]+>', 'g')
+    if (html_str) {
+    let text = html_str.replace(re, '')
+        return text
+        } else {
+        return ''
+        }
+    }
+
+    let pageObj = slides.value.find((slide,indexs) => {
+            return slideIndex.value==indexs
+    })
+    watch(() => datas.DataSource.pageType, () => {
+        const newSlides = slides.value
+        newSlides.forEach((slide,indexs)=>{
+            if(slideIndex.value==indexs){
+                slide.pageType = datas.DataSource.pageType
+            }
+        })
+        slidesStore.setSlides(newSlides)
+    })
     // 所有数据源
     const AllDataSource = () => {
-        datas.DataSource.DataSourceOverlay = !datas.DataSource.DataSourceOverlay
         // 绑定数据源
         const newElements = slides.value.find((slide,indexs) => {
             return slideIndex.value==indexs
         })
+        datas.DataSource.DataSourceOverlay = !datas.DataSource.DataSourceOverlay
+        let TemplateList
+        if(newElements.pageType==1) TemplateList = datas.DataSource.jc
+        else if(newElements.pageType==2) TemplateList = datas.DataSource.jd
+        else if(newElements.pageType==3) TemplateList = datas.DataSource.jq
+        else if(newElements.pageType==4) TemplateList = datas.DataSource.cs
         datas.DataSource.DataSourceList = []
         newElements.elements.forEach(slide=>{
+            if(slide.type!="text"&&slide.type!="image") return
+            let FiledTypeStr
+            if(slide.type=="text") FiledTypeStr = getHtmlPlainText(slide.content)
+            if(slide.type=="image") FiledTypeStr = slide.src
             let Obj = {}
-            if(slide.type=="text"){
             if(slide.FiledTypeStr){
                 Obj = {
                 ...slide,
                 }
             }else{
                 Obj = {
-                ...slide,
-                FiledTypeStr: getHtmlPlainText(slide.content),
-                TemplateList: datas.DataSource.jc,
-                TemplateDataSource: {
-                    Content: '',
-                    Name: '',
-                    Id: null as Number
-                },
+                    ...slide,
+                    FiledTypeStr: FiledTypeStr,
+                    TemplateList: TemplateList,
+                    TemplateDataSource: {
+                        Content: '',
+                        Name: '',
+                        Id: null as Number
+                    },
                 }
             }
             datas.DataSource.DataSourceList.push(Obj)
-            }
-            if(slide.type=="image"){
-            if(slide.FiledTypeStr){
-                Obj = {
-                ...slide,
-                }
-            }else{
-                Obj = {
-                ...slide,
-                FiledTypeStr: getHtmlPlainText(slide.content),
-                TemplateList: datas.DataSource.jd,
-                TemplateDataSource: {
-                    Content: '',
-                    Name: '',
-                    Id: null as Number
-                },
-                }
-            }
-            datas.DataSource.DataSourceList.push(Obj)
-            }
         })
     }
 
@@ -173,7 +201,7 @@
      * 获取系列列表
      */
     const onLineChangeHandler = async () =>{
-        let obj = Series.value.filter(x=>{
+        let obj = lines.value.find(x=>{
             return x.LineID == queryObj.value.LineId
         })
         queryObj.value.LtId = null

src/views/Editor/Toolbar/SlideDesignPanel.vue

@@ -99,10 +99,6 @@
     <div class="row">
       <Button style="flex: 1;" @click="applyBackgroundAllSlide()">应用背景到全部</Button>
     </div>
-
-    <!-- <div class="row">
-      <Button style="flex: 1;" @click="AllDataSource()">数据源</Button>
-    </div> -->
     
     <Divider />
 
@@ -355,68 +351,6 @@ const {
   applyThemeToAllSlides,
 } = useSlideTheme()
 
-
-//提取字符串中的文字
-const getHtmlPlainText = (html_str) => {
-  let re = new RegExp('<[^<>]+>', 'g')
-  if (html_str) {
-  let text = html_str.replace(re, '')
-      return text
-    } else {
-      return ''
-    }
-}
-// 所有数据源
-const AllDataSource = () => {
-  datas.DataSource.DataSourceOverlay = !datas.DataSource.DataSourceOverlay
-  // 绑定数据源
-  const newElements = slides.value.find((slide,indexs) => {
-    return slideIndex.value==indexs
-  })
-  datas.DataSource.DataSourceList = []
-  newElements.elements.forEach(slide=>{
-    let Obj = {}
-    if(slide.type=="text"){
-      if(slide.FiledTypeStr){
-        Obj = {
-          ...slide,
-        }
-      }else{
-        Obj = {
-          ...slide,
-          FiledTypeStr: getHtmlPlainText(slide.content),
-          TemplateList: datas.DataSource.jc,
-          TemplateDataSource: {
-            Content: '',
-            Name: '',
-            Id: null as Number
-          },
-        }
-      }
-      datas.DataSource.DataSourceList.push(Obj)
-    }
-    if(slide.type=="image"){
-      if(slide.FiledTypeStr){
-        Obj = {
-          ...slide,
-        }
-      }else{
-        Obj = {
-          ...slide,
-          FiledTypeStr: getHtmlPlainText(slide.content),
-          TemplateList: datas.DataSource.jd,
-          TemplateDataSource: {
-            Content: '',
-            Name: '',
-            Id: null as Number
-          },
-        }
-      }
-      datas.DataSource.DataSourceList.push(Obj)
-    }
-  })
-}
-
 // 设置背景模式：纯色、图片、渐变色
 const updateBackgroundType = (type: 'solid' | 'image' | 'gradient') => {
   if (type === 'solid') {

src/views/Editor/index.vue

@@ -53,6 +53,7 @@ import ConfigService from '@/services/ConfigService'
 
 const datas = reactive({
     DataSource:{
+        pageType: 1,
         DataSourceOverlay: false,
         DataSourceList:[],
         TemplateDataSource:[],
@@ -61,8 +62,9 @@ const datas = reactive({
         jq:[],//景区
         cs:[],//餐食
         queryObj:{
-          TempId: 0,//编号(新增传0)	是	[int]
+          TempId: 10,//编号(新增传0)	是	[int]
           LineId: null,//线路Id	是	[int]
+          LineName: '',//线路名称	是	[string]
           LtId: null,//系列Id	是	[int]
           Title: '',//名称	是	[string]
           TempData: null,//模板数据	是	[json]
@@ -71,46 +73,19 @@ const datas = reactive({
           SeasonName: '',//季节	是	[string]
           ColorName: '',//颜色名称	是	[string]
           ColorStr: null,//颜色值	是	[string]
-          LineName: '',//线路名称	是	[string]
           TempType: 1,//	版面类型(1-横版，2-竖版)
         }
     },
 
 })
 
-const queryObj = reactive({
-  TempId: 0,
-})
+
 const slidesStore = useSlidesStore()
 const { slides, slideIndex } = storeToRefs(slidesStore)
 
-// 获取行程模版数据
-const GetTripTemplate = async () =>{
-  try {
-      let queryObj = {
-        TempId: datas.DataSource.queryObj.TempId
-      }
-      let TemplateRes = await ConfigService.GetTripTemplateSlide(queryObj);
-      if (TemplateRes.data.resultCode == 1) {
-          datas.DataSource.TemplateDataSource = TemplateRes.data.data
-          datas.DataSource.jc = datas.DataSource.TemplateDataSource.filter(x => {
-            return x.FiledType==1
-          })
-          datas.DataSource.jd = datas.DataSource.TemplateDataSource.filter(x => {
-            return x.FiledType==2
-          })
-          datas.DataSource.jq = datas.DataSource.TemplateDataSource.filter(x => {
-            return x.FiledType==3
-          })
-          datas.DataSource.cs = datas.DataSource.TemplateDataSource.filter(x => {
-            return x.FiledType==4
-          })
-      }
-  } catch (error) {
-      console.log("TemplateGetTripFiled", error);
-  }
-}
-
+watch(() => datas.DataSource, () => {
+  provide(injectKeyDataSource,datas.DataSource)
+})
 // 数据源
 const GetTripFiled = async () =>{
     try {