no message

src/hooks/useExport.ts

+import { fa } from 'element-plus/es/locale';
 import { ref } from 'vue'
 import { storeToRefs } from 'pinia'
 import { trim } from 'lodash'
@@ -5,7 +6,7 @@ import { saveAs } from 'file-saver'
 import pptxgen from 'pptxgenjs'
 import tinycolor from 'tinycolor2'
 import { toPng, toJpeg } from 'html-to-image'
-import { useSlidesStore } from '@/store'
+import { useSlidesStore, useScreenStore } from '@/store'
 import type { PPTElementOutline, PPTElementShadow, PPTElementLink, Slide } from '@/types/slides'
 import { getElementRange, getLineElementPath, getTableSubThemeColor } from '@/utils/element'
 import { type AST, toAST } from '@/utils/htmlParser'
@@ -25,7 +26,10 @@ interface ExportImageConfig {
 
 export default () => {
   const slidesStore = useSlidesStore()
+  const coverImgStore = useScreenStore()
+  const isCoverImgStore = useScreenStore()
   const { slides, theme, viewportRatio, title } = storeToRefs(slidesStore)
+  const { isCoverImg } = storeToRefs(useScreenStore())
 
   const exporting = ref(false)
 
@@ -33,10 +37,8 @@ export default () => {
   const exportImage = (domRef: HTMLElement, format: string, quality: number, ignoreWebfont = true) => {
     exporting.value = true
     const toImage = format === 'png' ? toPng : toJpeg
-
     const foreignObjectSpans = domRef.querySelectorAll('foreignObject [xmlns]')
     foreignObjectSpans.forEach(spanRef => spanRef.removeAttribute('xmlns'))
-
     setTimeout(() => {
       const config: ExportImageConfig = {
         quality,
@@ -47,6 +49,10 @@ export default () => {
 
       toImage(domRef, config).then(dataUrl => {
         exporting.value = false
+        if (isCoverImg.value) {
+          coverImgStore.setCoverImg(dataUrl)
+          isCoverImgStore.setIsCoverImg(false)
+        }
         saveAs(dataUrl, `${title.value}.${format}`)
       }).catch(() => {
         exporting.value = false

src/store/screen.ts

@@ -7,7 +7,9 @@ export interface ScreenState {
   model:number,
   isModel: boolean,
   ConfigId:number,
-  TemplateType: []
+  TemplateType: [],
+  CoverImg: any,
+  isCoverImg: boolean,
 }
 
 export const useScreenStore = defineStore('screen', {
@@ -18,6 +20,8 @@ export const useScreenStore = defineStore('screen', {
     isModel: false,// 该团是否存在模版
     ConfigId: 0,
     TemplateType: [],
+    CoverImg: null,
+    isCoverImg: false, // 封面
   }),
 
   actions: {
@@ -41,6 +45,13 @@ export const useScreenStore = defineStore('screen', {
     },
     setTemplateType(TemplateType: []) {
       this.TemplateType = TemplateType
+    },
+    setCoverImg(CoverImg: any) {
+      console.log(CoverImg, '-------')
+      this.CoverImg = CoverImg
+    },
+    setIsCoverImg(isCoverImg: boolean) {
+      this.isCoverImg = isCoverImg
     }
   },
 })
\ No newline at end of file

src/views/Editor/EditorHeader/index.vue

@@ -86,6 +86,7 @@
 <script lang="ts" setup>
 import { nextTick, ref, reactive, inject } from 'vue'
 import { storeToRefs } from 'pinia'
+import { Base64 } from 'js-base64'
 import { useMainStore, useSlidesStore } from '@/store'
 import useScreening from '@/hooks/useScreening'
 import useImport from '@/hooks/useImport'
@@ -95,6 +96,7 @@ import { userStore } from "@/store/user";
 import { useScreenStore } from "@/store/screen";
 import ConfigService from '@/services/ConfigService'
 import { injectKeyDataSource, injectKeyTemplate } from '@/types/injectKey'
+import { svg2Base64 } from '@/utils/svg2Base64'
 
 import HotkeyDoc from './HotkeyDoc.vue'
 import FileInput from '@/components/FileInput.vue'
@@ -130,7 +132,7 @@ datas.DataSource = inject(injectKeyDataSource)
 queryObj.value = inject(injectKeyDataSource).queryObj
 searchData.value = inject(injectKeyTemplate)
 const marketStore = useScreenStore()
-const { market, model, ConfigId } = storeToRefs(useScreenStore())
+const { market, model, ConfigId, CoverImg } = storeToRefs(useScreenStore())
 
 const goBack = () =>{
   let list = [
@@ -214,16 +216,21 @@ const SetTripTemplateConfig = async () => {
 // 保存
 const setTemplate = async () =>{
   // console.log(JSON.stringify(slides.value),'----保存接口',queryObj.value)
-  if(queryObj.value.Title==''||!queryObj.value.LineId||!queryObj.value.LtId
-  // ||queryObj.value.CoverImg==''
-  ||queryObj.value.CountryName==''||queryObj.value.SeasonName==''
-  ||queryObj.value.ColorName==''||queryObj.value.ColorStr==''||queryObj.value.LineName==''){
-    return ElMessage({
-      showClose: true,
-      message: '请完善右侧模版数据',
-      type: 'warning',
-    })
+  if(model.value&&userInfo.value.IsEditTripTemplate==1){
+    if(CoverImg&&CoverImg.value) queryObj.value.CoverImg = CoverImg.value
+    
+    if(queryObj.value.Title==''||!queryObj.value.LineId||!queryObj.value.LtId
+    ||queryObj.value.CoverImg==''
+    ||queryObj.value.CountryName==''||queryObj.value.SeasonName==''
+    ||queryObj.value.ColorName==''||queryObj.value.ColorStr==''||queryObj.value.LineName==''){
+      return ElMessage({
+        showClose: true,
+        message: '请完善右侧模版数据',
+        type: 'warning',
+      })
+    }
   }
+  
   for(let i=0;i<slides.value.length;i++){
     if(slides.value[i].elements.length==0) {
         return ElMessage({
@@ -233,14 +240,16 @@ const setTemplate = async () =>{
           })
       }
     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',
-          })
+      if(model.value&&userInfo.value.IsEditTripTemplate==1){
+        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',
+            })
+          }
         }
       }
     }

src/views/Editor/ExportDialog/ExportImage.vue

@@ -91,10 +91,11 @@ const emit = defineEmits<{
   (event: 'close'): void
 }>()
 
+
 const { slides, currentSlide } = storeToRefs(useSlidesStore())
 
 const imageThumbnailsRef = ref<HTMLElement>()
-const rangeType = ref<'all' | 'current' | 'custom'>('all')
+const rangeType = ref<'all' | 'current' | 'custom'>('current')
 const range = ref<[number, number]>([1, slides.value.length])
 const format = ref<'jpeg' | 'png'>('jpeg')
 const quality = ref(1)

src/views/Editor/Toolbar/ElementTemplateData.vue

 <template>
     <div class="q-mt-xs bg-white q-pa-xs rounded ElementTemplateData">
         <div class="column text-mdall">
-            <div class="row">
+            <div class="column">
+                <div v-if="CoverImg"
+                class="origin-image"
+                :style="{ backgroundImage: `url(${CoverImg})` }"
+                ></div>
+                <div class="row">
+                    <Button style="flex: 1;" @click="setDialogForExport('image')">
+                        {{CoverImg?'重新生成封面图':'生成封面图'}}
+                    </Button>
+                </div>
+            </div>
+            <div class="row q-mt-md">
                 <Button style="flex: 1;" @click="AllDataSource()">数据源</Button>
-              </div>
+            </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" 
@@ -16,6 +27,7 @@
                         />
                 </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>
@@ -94,8 +106,6 @@
   import { injectKeyDataSource } from '@/types/injectKey'
   import { getHtmlPlainText } from '@/utils/common'
 
-    const { TemplateType } = storeToRefs(useScreenStore())
-
     const datas = reactive({
         DataSource:{},
         CountryValue: null
@@ -111,16 +121,13 @@
    
     const slidesStore = useSlidesStore()
     const { slides, slideIndex } = storeToRefs(slidesStore)
-    const setCountryValue = () =>{
-        let obj = dispositionObj.value.ColorList.find(x=>{
-            return x.ColorValue == queryObj.value.ColorStr
-        })
-        queryObj.value.ColorName = obj.ColorName
-    }
 
-    let pageObj = slides.value.find((slide,indexs) => {
-            return slideIndex.value==indexs
-    })
+    const isCoverImgStore = useScreenStore()
+    const { TemplateType, CoverImg, isCoverImg } = storeToRefs(useScreenStore())
+
+    const mainStore = useMainStore()
+    const mainMenuVisible = ref(false)
+
     watch(() => datas.DataSource.pageType, () => {
         const newSlides = slides.value
         newSlides.forEach((slide,indexs)=>{
@@ -130,6 +137,24 @@
         })
         slidesStore.setSlides(newSlides)
     })
+
+    const setDialogForExport = (type: DialogForExportTypes) => {
+        mainStore.setDialogForExport(type)
+        mainMenuVisible.value = false
+        isCoverImgStore.setIsCoverImg(true)
+    }
+
+    const setCountryValue = () =>{
+        let obj = dispositionObj.value.ColorList.find(x=>{
+            return x.ColorValue == queryObj.value.ColorStr
+        })
+        queryObj.value.ColorName = obj.ColorName
+    }
+
+    let pageObj = slides.value.find((slide,indexs) => {
+            return slideIndex.value==indexs
+    })
+    
     // 所有数据源
     const AllDataSource = () => {
         if(slides.value.elements&&slides.value.elements.length==0){
@@ -228,6 +253,14 @@
   </script>
   
   <style lang="scss" scoped>
+    .origin-image {
+        height: 100px;
+        background-size: contain;
+        background-repeat: no-repeat;
+        background-position: center;
+        background-color: $lightGray;
+        margin-bottom: 10px;
+    }
     .ElementTemplateData{
         /* min-height: 500px; */
     }