[add] website screenshot

src/http/toolBoxApi.js

@@ -14,4 +14,12 @@ export function getAllPostEditorAppData(params) {
         method: 'post',
         data: params
     })
+}
+
+export function screenshotWebsite(params) {
+    return service({
+        url: `/post/editor/screenshotWebsite`,
+        method: 'post',
+        data: params
+    })
 }

src/view/iframe/publish/tool-box/child/editor.vue

@@ -106,7 +106,7 @@ const searchHandler = async () => {
     createType: '',
     defaultUrl: siteUrl.value,
     guideData: '',
-    iconPath: favicon,
+    iconPath: '',
     interactType: '',
     linkImagePath: '',
     name: '',
@@ -129,7 +129,8 @@ const searchHandler = async () => {
     }
     favicon = urlObj.origin + '/favicon.ico';
   }
-
+  currentApp.iconPath = favicon;
+  
   let convertRes = await convertUrl({ params: { originUrl: siteUrl.value } });
   let params = { convertUrl: siteUrl.value, originUrl: siteUrl.value, appId: '', currentApp };
 

src/view/iframe/publish/tool-box/child/preview.vue

@@ -84,28 +84,56 @@ let reviewCanvasParams = reactive({
 });
 let timer = ref(null);
 
-const loadingHide = null;
+let loadingHide = null;
 
 const props = defineProps({
     previewData: {
         type: Object,
-        default: {
-            convertUrl: '',
-            originUrl: '',
-            appId: ''
+        default: () => {
+            return {
+                convertUrl: '',
+                originUrl: '',
+                appId: ''
+            }
         }
     },
-    screenshot: {
+    screenshotWebsiteData: {
+        type: Object,
+        default: () => {
+            return {
+                url: '',
+                status: ''
+            }
+        }
+    },
+    showCom: {
         type: String,
-        default: ''
+        default: 'EDITOR'
     }
 })
 
-watch(() => props.screenshot, (newVal) => {
-    let { appId } = props.previewData;
-    if(loadingHide && newVal && !appId) {
-        submitPublish();
-    }
+watch(() => props.screenshotWebsiteData, 
+    (newVal) => {
+        let { appId } = props.previewData;
+        if(loadingHide && !appId && (newVal.url || newVal.status)) {
+            loadingHide();
+            loadingHide = null;
+            submitPublish();
+        }
+    },
+    {
+        deep: true
+})
+
+watch(() => props.showCom, 
+    (newVal) => {
+        if(newVal == 'EDITOR' && loadingHide) {
+            loadingHide();
+            loadingHide = null;
+        }
+    },
+    {
+        deep: true
 })
 
 const emits = defineEmits(["publishFinish"]);
@@ -165,7 +193,7 @@ const publishHandler = () => {
         return;
     }
 
-    if(!appId && !props.screenshot) {
+    if(!appId && !props.screenshotWebsiteData.url) {
         loadingHide = message.loading('loading...', 0);
         return;
     }
@@ -182,13 +210,14 @@ const submitPublish = () => {
 
     setHistoryData(currentApp);
 
-    let linkTitle = previewData.currentApp.defaultTit ? 'Install DeNet Plugin to Participate' : previewData.currentApp.name;
+    let linkTitle = currentApp.defaultTit ? '' : currentApp.name;
 
     let postBizData = {
         convertUrl,
         originUrl,
         appId,
-        linkTitle: !appId ? linkTitle : ''
+        linkTitle: !appId ? linkTitle : '',
+        linkImagePath: props.screenshotWebsiteData.url
     };
     let data = {
         params: {

src/view/iframe/publish/tool-box/index.vue

@@ -1,14 +1,18 @@
 <template>
     <div class="page-wrapper">
         <editor v-show="showCom == 'EDITOR'" :linkInputDescImage="pageData.linkInputDescImage" @changeShowCom="changeShowCom" />  
-        <preview v-show="showCom == 'PREVIEW'" :previewData="previewData" 
-        @publishFinish="publishFinish" />
+        <preview v-show="showCom == 'PREVIEW'" 
+            :previewData="previewData" 
+            :screenshotWebsiteData="screenshotWebsiteData"
+            :showCom="showCom"
+            @publishFinish="publishFinish" />
     </div>
 </template>
 
 <script setup>
 import { ref, reactive, watch, defineProps, defineEmits } from "vue";
 
+import { screenshotWebsite } from "@/http/toolBoxApi";
 import editor from '@/view/iframe/publish/tool-box/child/editor.vue'
 import preview from '@/view/iframe/publish/tool-box/child/preview.vue'
 
@@ -45,6 +49,11 @@ let previewData = reactive({
     currentApp: {}
 })
 
+let screenshotWebsiteData = reactive({
+    url: '',
+    status: '',
+});
+
 const changeShowCom = (params) => {
     showCom.value = 'PREVIEW';
     previewData.convertUrl = params.convertUrl;
@@ -53,6 +62,31 @@ const changeShowCom = (params) => {
     previewData.linkImagePath = params.linkImagePath || '';
     previewData.currentApp = params.currentApp || {};
 
+    if(!params.appId) {
+        screenshotWebsiteData.url = '';
+        screenshotWebsiteData.status = '';
+        screenshotWebsite({
+            params: {
+                url: params.convertUrl
+            }
+        }).then(res => {
+            if(showCom.value != 'PREVIEW') {
+                return;
+            }
+            if(res.code == 0) {
+                screenshotWebsiteData.url = res.data;
+                screenshotWebsiteData.status = 1;
+            } else {
+                screenshotWebsiteData.status = 1;
+            }
+        }).catch(() => {
+            if(showCom.value != 'PREVIEW') {
+                return;
+            }
+            screenshotWebsiteData.status = 1;
+        })
+    }
+
     emits("onPageChange", {page: showCom.value});
 }