解决文字消失的问题

src/utils/htmlutil.ts

+export default class HtmlUtil {
+	// 1.用浏览器内部转换器实现html编码
+	static htmlEncode = (html:string)=> {
+		// 创建一个元素容器
+		var tempDiv = document.createElement('div');
+		// 把需要编码的字符串赋值给该元素的innerText(ie支持)或者textContent(火狐、谷歌等) 
+		(tempDiv.textContent != undefined) ? (tempDiv.textContent = html) : (tempDiv.innerText = html);
+		var output = tempDiv.innerHTML;
+		tempDiv.remove();
+		return output;
+	}
+	
+	// 2.用浏览器内部转换器实现html解码
+	static htmlDecode = (text:string) => {
+		// 创建一个元素容器
+		var tempDiv = document.createElement('div');
+		// 把解码字符串赋值给元素innerHTML
+		tempDiv.innerHTML = text;
+		// 最后返回这个元素的innerText(ie支持)或者textContent(火狐、谷歌等支持)
+		var output = tempDiv.innerText || tempDiv.textContent;
+		tempDiv.remove;
+		return output;
+	}
+	// 3.使用正则实现html编码
+	static htmlEncodeByRegExp = (str:string)=> {
+		var s = '';
+		if(str.length === 0) {
+			return '';
+		}
+		s = str.replace(/&/g,'&');
+		s = s.replace(/</g,'&lt;');
+		s = s.replace(/>/g,'&gt;');
+		s = s.replace(/ /g,'&nbsp;');
+		s = s.replace(/\'/g,'&#39;');
+		s= s.replace(/\"/g,'&quot;');
+		return s;
+	}
+	
+	// 4.使用正则实现html解码
+	static htmlDecodeByRegExp = (str:string) => {
+		var s = '';
+		if(str.length === 0) {
+			return '';
+		}
+		s = str.replace(/&amp;/g, '&');
+		s = s.replace(/&lt;/g,'<');
+		s = s.replace(/&gt;/g,'>');
+		s = s.replace(/&nbsp;/g,' ');
+		s = s.replace(/&#39;/g,'\'');
+		s = s.replace(/&quot;/g,'\"');
+		return s;
+	}
+}
\ No newline at end of file

src/utils/psdParser/text.ts

 import { PPTElementShadow, PPTTextElement } from '@/types/slides';
+import HtmlUtil from '../htmlutil';
 
 export const ResolveText = (item: any, index: number,offsetLeft:number,offsetTop:number,groupId:string =''): PPTTextElement => {
 
@@ -69,7 +70,8 @@ export const ResolveText = (item: any, index: number,offsetLeft:number,offsetTop
     if(objectEFFFects && objectEFFFects.data?.FrFX?.enab){
         stroke = getStrokeHandler(objectEFFFects)
     }
-    let content = `<p><span  style="${style}">${value}</span></p>`
+    let content = `<p><span  style="${style}">${HtmlUtil.htmlEncodeByRegExp(value)}</span></p>`
+    
 
     const isVertical = item.layer.adjustments.typeTool.obj.textData.Ornt.value != 'Hrzn'
     if(isVertical) {

src/views/Editor/Thumbnails/index.vue

@@ -82,6 +82,7 @@ import { Slide } from '@/types/slides'
 import { uniqueId } from 'lodash'
 import { useUserStore } from "@/store";
 import themeColor from '@/utils/colorExtraction';
+import HtmlUtil from '@/utils/htmlutil'
 
 const mainStore = useMainStore()
 const slidesStore = useSlidesStore()
@@ -464,6 +465,17 @@ const GetTripTemplate = async () =>{
             }
             newSlides.push(obj)          
           }else if(SlidesData.length>0){
+            SlidesData.forEach((x: any) => {
+              x.elements.forEach((y:any)=>{
+                if(y.contentStr && y.content.includes(y.contentStr)){
+                  let temp = HtmlUtil.htmlEncodeByRegExp(y.contentStr)
+                  if(temp!=y.contentStr) {
+                    console.log('diff',y.contentStr,temp)
+                    y.content = y.content.replace(y.contentStr,temp)
+                  }
+                }
+              })
+            })
             newSlides = SlidesData
           }
           let IDs = []
@@ -699,6 +711,15 @@ const sellGetTripTemplate = async () =>{
           let SlidesData = JSON.parse(dataObj.TempData)
           let newSlides = []
           await SlidesData.forEach((x,i)=>{
+            x.elements.forEach((y:any)=>{
+              if(y.contentStr && y.content.includes(y.contentStr)){
+                let temp = HtmlUtil.htmlEncodeByRegExp(y.contentStr)
+                if(temp!=y.contentStr) {
+                  console.log('diff',y.contentStr,temp)
+                  y.content = y.content.replace(y.contentStr,temp)
+                }
+              }
+            })
             newSlides.push(x)
           })
           slidesStore.setSlides(newSlides)
@@ -979,7 +1000,9 @@ if(!query().ViewSlideshow) GetTripTemplate()
   }
   &.selected {
     .thumbnail {
-      outline-color: $themeColor;
+      // outline-color: $themeColor;
+      outline-color: #0B40FE;
+      box-shadow: 0px 0px 15px 0px rgba(11,64,254,0.8);
     }
   }
 }