Merge branch 'feature_1.1.5_post_editor_publish' into dev_1.1.5-1

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/give-dialog.vue

@@ -123,7 +123,8 @@
                         <template v-if="publishType == 'TOOL_BOX'">
                             <tool-box 
                                 :pageData="{
-                                    'linkInputDescImage': toolBoxPageData.postEditorLinkInputDescImage
+                                    'linkInputDescImage': toolBoxPageData.postEditorLinkInputDescImage,
+                                    'defaultLinkTitle': toolBoxPageData.postEditorDefaultLinkTitle
                                 }"
                                 :activePage="toolBoxPageData.activePage" @onPageChange="onToolBoxPageChange"
                                 @toolBoxPublishFinish="toolBoxPublishFinish"></tool-box>
@@ -764,7 +765,8 @@ let leftTabList = reactive([
 
 let toolBoxPageData = reactive({
     activePage: 'EDITOR', //EDITOR PREVIEW
-    postEditorLinkInputDescImage: ''
+    postEditorLinkInputDescImage: '',
+    postEditorDefaultLinkTitle: ''
 })
 
 
@@ -1828,6 +1830,7 @@ const setFrontConfig = () => {
             paypalHtml.value = res.data.paypalHtml;
             lotteryMaxHourDuration = res.data.lotteryMaxHourDuration;
             toolBoxPageData.postEditorLinkInputDescImage = res.data.postEditorLinkInputDescImage;
+            toolBoxPageData.postEditorDefaultLinkTitle = res.data.postEditorDefaultLinkTitle;
         }
     });
 };

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

@@ -106,15 +106,16 @@ const searchHandler = async () => {
     createType: '',
     defaultUrl: siteUrl.value,
     guideData: '',
-    iconPath: favicon,
+    iconPath: '',
     interactType: '',
-    linkImagePath: "",
-    name: siteTitle,
+    linkImagePath: '',
+    name: '',
   }
 
   if (siteRes) {
-    if (siteRes.headers['content-type'].indexOf('text/html') < 0 || siteRes.request.status > 399) {
-      // 提示
+    if (siteRes.headers['content-type'].indexOf('text/html') < 0 || siteRes.request.status > 403) {
+      loadingHide();
+      message.error('Page loading failed');
       return;
     }
     let urlObj = new URL(siteUrl.value);
@@ -124,10 +125,12 @@ const searchHandler = async () => {
         siteTitle = urlObj.hostname;
         currentApp.defaultTit = siteTitle;
       }
+      currentApp.name = siteTitle;
     }
     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

@@ -35,14 +35,21 @@
                         </div>
                     </div>
                     <div class="card-wrapper" :style="{ 'zoom': reviewCanvasParams.zoom }">
-                        <img class="cover" :src="previewData.linkImagePath || require('@/assets/svg/img-default-site-cover.svg')" />
-                        <!-- v-if="previewData.linkImagePath && previewData.appId" <iframe class="iframe" 
+                        <img class="cover" v-if="previewData.linkImagePath && previewData.appId" :src="previewData.linkImagePath" />
+                        <iframe class="iframe" 
                             :src="previewData.convertUrl"
-                            v-else></iframe>  -->
+                            v-else></iframe> 
 
                         <div class="bottom-bar">
                             <div class="site-url">DeNet.me</div>
-                            <div class="desc">Install DeNet Plugin to Participate</div>
+                            <div class="desc">
+                                <template v-if="previewData.appId">
+                                    {{previewData.currentApp.linkTitle}}
+                                </template>
+                                <template v-else>
+                                    {{previewData.currentApp.defaultTit ? defaultLinkTitle : previewData.currentApp.name}}
+                                </template>
+                            </div>
                         </div>
                     </div>
                 </div>
@@ -58,10 +65,11 @@
 </template>
 
 <script setup>
-import { ref, defineEmits, reactive, defineProps, onMounted, nextTick, onUnmounted } from "vue";
-import { postPublish } from "@/http/publishApi";
-import installCard from '@/view/content/tool-box/index.vue'
+import { ref, defineEmits, reactive, defineProps, onMounted, nextTick, onUnmounted, watch } from "vue";
+import { message } from "ant-design-vue";
 
+import installCard from '@/view/content/tool-box/index.vue'
+import { postPublish } from "@/http/publishApi";
 import { getChromeStorage, setChromeStorage } from "@/uilts/chromeExtension"
 import { getUser } from "@/http/publishApi"
 
@@ -76,17 +84,62 @@ let reviewCanvasParams = reactive({
 });
 let timer = ref(null);
 
+let loadingHide = null;
+
 const props = defineProps({
     previewData: {
         type: Object,
-        default: {
-            convertUrl: '',
-            originUrl: '',
-            appId: ''
+        default: () => {
+            return {
+                convertUrl: '',
+                originUrl: '',
+                appId: ''
+            }
         }
+    },
+    screenshotWebsiteData: {
+        type: Object,
+        default: () => {
+            return {
+                url: '',
+                status: ''
+            }
+        }
+    },
+    defaultLinkTitle: {
+        type: String,
+        default: ''
+    },
+    showCom: {
+        type: String,
+        default: 'EDITOR'
     }
 })
 
+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"]);
 
 const getUserInfo = (cb) => {
@@ -139,17 +192,36 @@ const calcPreviewCanvasParams = () => {
 }
 
 const publishHandler = () => {
-    if(submitIng.value) {
+    let { appId } = props.previewData;
+    if(loadingHide) {
         return;
     }
+
+    if(!appId && !props.screenshotWebsiteData.url) {
+        loadingHide = message.loading('loading...', 0);
+        return;
+    }
+
+    submitPublish();
+}
+
+const submitPublish = () => {
     let {convertUrl, originUrl, appId, currentApp} = props.previewData;
 
+    if(submitIng.value) {
+        return;
+    }
+
     setHistoryData(currentApp);
 
+    let linkTitle = currentApp.defaultTit ? '' : currentApp.name;
+
     let postBizData = {
         convertUrl,
         originUrl,
-        appId
+        appId,
+        linkTitle: !appId ? linkTitle : '',
+        linkImagePath: props.screenshotWebsiteData.url
     };
     let data = {
         params: {
@@ -168,8 +240,7 @@ const publishHandler = () => {
             emits("publishFinish", { publishRes });
         } else {
         }
-    })
-    .catch((err) => {
+    }).catch((err) => {
         console.log(err);
     });
 }

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

@@ -1,14 +1,19 @@
 <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"
+            :defaultLinkTitle="pageData.defaultLinkTitle"
+            @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'
 
@@ -16,7 +21,8 @@ const props = defineProps({
     pageData: {
         type: Object,
         default: {
-            linkInputDescImage: ''
+            linkInputDescImage: '',
+            defaultLinkTitle: ''
         }
     },
     activePage: {
@@ -45,6 +51,11 @@ let previewData = reactive({
     currentApp: {}
 })
 
+let screenshotWebsiteData = reactive({
+    url: '',
+    status: '',
+});
+
 const changeShowCom = (params) => {
     showCom.value = 'PREVIEW';
     previewData.convertUrl = params.convertUrl;
@@ -53,6 +64,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});
 }