|
@@ -2,7 +2,7 @@
|
|
|
<div class="denet-toolbox" :class="{ 'pre-view': pre_view }">
|
|
|
<div class="head">
|
|
|
<span></span>
|
|
|
- <div v-show="state.show_btn && state.status == ''">
|
|
|
+ <div v-show="state.show_btn && state.status == 'iframe'">
|
|
|
<img :src="require('@/assets/svg/icon-iframe-fixed.svg')" alt class="fixed" @click="clickFixed" />
|
|
|
<img :src="require('@/assets/svg/icon-iframe-full.svg')" alt class="full" @click="clickFull" />
|
|
|
</div>
|
|
@@ -11,11 +11,13 @@
|
|
|
<iframe :src="iframe_url" frameborder="0"></iframe>
|
|
|
</div>
|
|
|
<div class="content" v-else>
|
|
|
- <iframe :src="state.iframe_url" v-if="state.status == ''" ref="dom_iframe" frameborder="0" scrolling="yes"
|
|
|
+ <iframe :src="state.iframe_url" v-show="state.status == 'iframe'" ref="dom_iframe" frameborder="0"
|
|
|
+ scrolling="yes"
|
|
|
+ sandbox="allow-same-origin allow-scripts allow-popups allow-top-navigation allow-forms allow-modals allow-popups-to-escape-sandbox"
|
|
|
allow="camera *;microphone *"></iframe>
|
|
|
<!-- 网页错误 -->
|
|
|
- <div class="state" v-if="state.status == '网页错误'">
|
|
|
- <img :src="state.cover_url" alt="" class="cover">
|
|
|
+ <div class="state" v-show="state.status == '网页错误'">
|
|
|
+ <img :src="state.cover_url" alt="" class="cover" />
|
|
|
<div class="info">
|
|
|
<img :src="require('@/assets/svg/icon-iframe-error.svg')" alt />
|
|
|
<div>Oops, this link is invalid</div>
|
|
@@ -23,16 +25,19 @@
|
|
|
</div>
|
|
|
|
|
|
<!-- 加载 -->
|
|
|
- <div class="state" v-if="state.status == '加载'">
|
|
|
- <img :src="require('@/assets/svg/icon-iframe-loading.svg')" alt class="icon-loading" />
|
|
|
+ <div class="state" v-show="state.status == '加载'">
|
|
|
+ <img :src="state.cover_url" alt="" class="cover" />
|
|
|
+ <div class="info">
|
|
|
+ <img :src="require('@/assets/svg/icon-iframe-loading.svg')" alt class="icon-loading" />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
<!-- 关闭 -->
|
|
|
- <div class="state" v-if="state.status == '关闭'">
|
|
|
+ <div class="state" v-show="state.status == '关闭'">
|
|
|
|
|
|
</div>
|
|
|
<!-- 固定右上角 -->
|
|
|
- <div class="state" v-if="state.status == '固定右上角'">
|
|
|
+ <div class="state" v-show="state.status == '固定右上角'">
|
|
|
<div class="info">
|
|
|
<img :src="require('@/assets/svg/icon-iframe-pinned.svg')" alt />
|
|
|
<div class="pinned">Pinned to the top right</div>
|
|
@@ -66,7 +71,7 @@ let dom_iframe = ref(null)
|
|
|
let state = reactive({
|
|
|
status: '', //
|
|
|
show_alert: false,
|
|
|
- show_btn: true,
|
|
|
+ show_btn: false,
|
|
|
list: [],
|
|
|
checkbox: false,
|
|
|
checkbox_id: `denet-${guid()}`,
|
|
@@ -93,10 +98,9 @@ chrome.runtime.onMessage.addListener((req, sender, sendResponse) => {
|
|
|
switch (req.actionType) {
|
|
|
// 事件传输
|
|
|
case 'Set_ToolBox_Fixed':
|
|
|
-
|
|
|
if (req.data.tweetId == state.tweetId && req.data.type == '关闭') {
|
|
|
state.show_btn = true
|
|
|
- state.status = ''
|
|
|
+ state.status = 'iframe'
|
|
|
state.iframe_url = req.data.iframe_url
|
|
|
}
|
|
|
break
|
|
@@ -129,12 +133,7 @@ onMounted(() => {
|
|
|
if (res == state.tweetId) {
|
|
|
state.status = '固定右上角'
|
|
|
} else {
|
|
|
- // state.tweetId == '1547587354935713792' || state.tweetId == '1547550675810525186' ||
|
|
|
- // if (state.tweetId == '1547550154894745600') {
|
|
|
getDetail()
|
|
|
- // } else {
|
|
|
- // state.status = '加载'
|
|
|
- // }
|
|
|
}
|
|
|
})
|
|
|
|
|
@@ -142,11 +141,16 @@ onMounted(() => {
|
|
|
|
|
|
// detail函数
|
|
|
const getDetail = () => {
|
|
|
- state.status = '加载'
|
|
|
let iframe = dom_iframe.value
|
|
|
iframe.onerror = () => {
|
|
|
state.status = '网页错误'
|
|
|
}
|
|
|
+ iframe.onload = () => {
|
|
|
+ if (state.status == '加载' || state.status == 'iframe') {
|
|
|
+ state.show_btn = true
|
|
|
+ state.status = 'iframe'
|
|
|
+ }
|
|
|
+ }
|
|
|
getPostDetail({
|
|
|
params: {
|
|
|
postId: state.postId
|
|
@@ -157,10 +161,15 @@ const getDetail = () => {
|
|
|
console.log('postBizData', state.detail)
|
|
|
// 加载iframe
|
|
|
state.cover_url = state.detail.linkImagePath
|
|
|
- setTimeout(() => {
|
|
|
- state.iframe_url = state.detail.convertUrl
|
|
|
- state.status = ''
|
|
|
- }, 1000)
|
|
|
+ // state.cover_url = 'https://www.keaidian.com/uploads/allimg/190424/24110307_8.jpg'
|
|
|
+ state.status = '加载'
|
|
|
+ state.iframe_url = state.detail.convertUrl
|
|
|
+ // state.detail.urlInBlacklist
|
|
|
+ // state.iframe_url = 'https://www.baidu.com'
|
|
|
+ // setTimeout(() => {
|
|
|
+
|
|
|
+ // state.status = ''
|
|
|
+ // }, 1000)
|
|
|
} else {
|
|
|
state.status = '网页错误'
|
|
|
}
|
|
@@ -172,7 +181,7 @@ const clickCancel = () => {
|
|
|
}
|
|
|
|
|
|
const clickFixed = () => {
|
|
|
- state.handle_type = '固定'
|
|
|
+ state.handle_type = '固定右上角'
|
|
|
getChromeStorage('fullCheck', (res) => {
|
|
|
if (res && res.fullCheck) {
|
|
|
// 固定
|
|
@@ -189,7 +198,6 @@ const handleFull = () => {
|
|
|
return
|
|
|
}
|
|
|
// 切换状态
|
|
|
- state.status = '关闭'
|
|
|
state.status = '固定右上角'
|
|
|
state.show_btn = false
|
|
|
sendChromeTabMessage({
|