Merge branch 'dev_1.1.5-1' of https://git.yishihui.com/DeNet/de-net 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

@@ -6,7 +6,7 @@
       </div>
       <div class="search-wrapper">
         <input class="input" type="text" v-model="siteUrl" placeholder="Enter link">
-        <div class="btn" @click="searchHandler">
+        <div class="btn" @click="searchHandler()">
           <img :src="require('@/assets/svg/icon-tool-box-search-arrow.svg')" />
         </div>
       </div>
@@ -68,6 +68,7 @@ const props = defineProps({
 let siteUrl = ref('');
 
 let selectAppGuideData = {};
+let selectGuideApp = {};
 let openWindowList = [];
 
 let historyList = ref([])
@@ -76,7 +77,7 @@ let appList = ref();
 
 const emits = defineEmits(["changeShowCom"]);
 
-const searchHandler = async () => {
+const searchHandler = async (_params) => {
   let siteTitle = '', favicon = '';
   let timer = null;
 
@@ -106,15 +107,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 +126,16 @@ const searchHandler = async () => {
         siteTitle = urlObj.hostname;
         currentApp.defaultTit = siteTitle;
       }
+      currentApp.name = siteTitle;
     }
     favicon = urlObj.origin + '/favicon.ico';
   }
+  currentApp.iconPath = favicon;
 
+  if(_params) {
+    currentApp = _params;
+  }
+  
   let convertRes = await convertUrl({ params: { originUrl: siteUrl.value } });
   let params = { convertUrl: siteUrl.value, originUrl: siteUrl.value, appId: '', currentApp };
 
@@ -159,7 +167,7 @@ const clickHistoryAppHandler = (params) => {
     clickAppHandler(params);
   } else {
     siteUrl.value = params.defaultUrl;
-    searchHandler();
+    searchHandler(params);
   }
 };
 
@@ -195,6 +203,7 @@ const openWindow = (params) => {
 const createGuideWindow = (params, isUpdate = false) => {
   openWindowList = [];
   selectAppGuideData = {};
+  selectGuideApp = {};
 
   let windowWith = window.screen.width - 500;
   let guideUrl = chrome.runtime.getURL('/iframe/tool-box-guide.html');
@@ -216,7 +225,7 @@ const createGuideWindow = (params, isUpdate = false) => {
   }, function (window) {
     openWindowList.push(window);
   })
-
+  selectGuideApp = params;
   if (params.guideData) {
     selectAppGuideData = JSON.parse(params.guideData);
   }
@@ -240,13 +249,14 @@ const onRuntimeMsg = () => {
           actionType: "CONTENT_EDIT_SEND_GUIDE_DATA",
           data: {
             guideData: selectAppGuideData,
-            windowData: openWindowList
+            windowData: openWindowList,
+            selectGuideApp
           }
         }, (response) => { });
         break;
       case 'CONTENT_GUIDE_APPLY_APP':
         siteUrl.value = req.data.siteUrl;
-        searchHandler();
+        searchHandler(req.data.selectGuideApp);
         break;
     }
   })

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

@@ -35,7 +35,8 @@ let siteUrl = ref('');
 
 let pageData = reactive({
     guideType: '',
-    guideData: []
+    guideData: [],
+    selectGuideApp: {}
 });
 
 const confirm = () => {
@@ -48,7 +49,8 @@ const confirm = () => {
     chrome.runtime.sendMessage({ 
         actionType: "CONTENT_GUIDE_APPLY_APP", 
         data: {
-            siteUrl: siteUrl.value
+            siteUrl: siteUrl.value,
+            selectGuideApp: pageData.selectGuideApp
         }
     },(response) => {});
 
@@ -68,9 +70,10 @@ const onRuntimeMsg = () => {
         sendResponse('ok')
         switch (req.actionType) {
             case 'CONTENT_EDIT_SEND_GUIDE_DATA':
-                let {guideData, windowData} = req.data;
+                let {guideData, windowData, selectGuideApp} = req.data;
                 pageData.guideData = guideData;
                 pageData.windowData = windowData;
+                pageData.selectGuideApp = selectGuideApp;
                 break;
         }
     })

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});
 }