|
@@ -4,43 +4,48 @@
|
|
<div v-if="device == 'chrome' || device == 'no-chrome'" class="content">
|
|
<div v-if="device == 'chrome' || device == 'no-chrome'" class="content">
|
|
<v-logo></v-logo>
|
|
<v-logo></v-logo>
|
|
<div class="tool-cover">
|
|
<div class="tool-cover">
|
|
- <img :src="detail.postBizData.linkImagePath" alt="" />
|
|
|
|
|
|
+ <img :src="img_url" alt="">
|
|
</div>
|
|
</div>
|
|
<!-- 非chrome -->
|
|
<!-- 非chrome -->
|
|
<div v-if="device == 'no-chrome'">
|
|
<div v-if="device == 'no-chrome'">
|
|
- <div class="txt">Use chrome browser to access Subway Surfers</div>
|
|
|
|
|
|
+ <div class="txt">Use chrome browser to access {{ detail.postBizData.linkTitle || '' }}</div>
|
|
<install-chrome></install-chrome>
|
|
<install-chrome></install-chrome>
|
|
</div>
|
|
</div>
|
|
<!-- chrome -->
|
|
<!-- chrome -->
|
|
<div v-if="device == 'chrome'">
|
|
<div v-if="device == 'chrome'">
|
|
- <div class="txt">Use chrome browser to access Subway Surfers</div>
|
|
|
|
|
|
+ <div class="txt">Use chrome browser to access {{ detail.postBizData.linkTitle || '' }}</div>
|
|
<install-extension :extensionsInstallUrl="config.extensionsInstallUrl"></install-extension>
|
|
<install-extension :extensionsInstallUrl="config.extensionsInstallUrl"></install-extension>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!-- 移动端 -->
|
|
<!-- 移动端 -->
|
|
- <div v-if="device == 'ios' || device == '安卓'" class="mobile">
|
|
|
|
- <div class="mobile-content">
|
|
|
|
- <img :src="detail.postBizData.linkImagePath" alt="" />
|
|
|
|
- <div class="title">Open link on PC to use Subway Surfers</div>
|
|
|
|
- </div>
|
|
|
|
- <div class="area-button">
|
|
|
|
- <div class="btn1" @click="clickExtension">Install Chrome Extension</div>
|
|
|
|
- <div class="btn2" @click="clickCopy" :data-clipboard-text="copy_link">Copy Link</div>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <!-- <div v-if="device == 'ios' || device == '安卓'" class="mobile">
|
|
|
|
+ <div class="mobile-content">
|
|
|
|
+ <img :src="detail.postBizData.linkImagePath" alt="">
|
|
|
|
+ <div class="title">Open link on PC to use Subway Surfers</div>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="area-button">
|
|
|
|
+ <div class="btn1" @click="clickExtension">
|
|
|
|
+ Install Chrome Extension
|
|
|
|
+ </div>
|
|
|
|
+ <div class="btn2" @click="clickCopy" :data-clipboard-text="copy_link">
|
|
|
|
+ Copy Link
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </div> -->
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
-import VLogo from '@/components/logo.vue';
|
|
|
|
-import InstallChrome from '@/components/InstallChrome.vue';
|
|
|
|
-import InstallExtension from '@/components/InstallExtension.vue';
|
|
|
|
-import { getBrowserType, baseURL, appVersionCode, jumpUrl } from '@/utils/help.js';
|
|
|
|
-import axios from 'axios';
|
|
|
|
-import Cookies from 'js-cookie';
|
|
|
|
|
|
+import VLogo from '@/components/logo.vue'
|
|
|
|
+import InstallChrome from '@/components/InstallChrome.vue'
|
|
|
|
+import InstallExtension from '@/components/InstallExtension.vue'
|
|
|
|
+import { getBrowserType, baseURL, appVersionCode, jumpUrl } from '@/utils/help.js'
|
|
|
|
+import axios from 'axios'
|
|
|
|
+import Cookies from 'js-cookie'
|
|
import { Toast } from 'vant';
|
|
import { Toast } from 'vant';
|
|
|
|
|
|
-var ClipboardJS = require('clipboard');
|
|
|
|
|
|
+
|
|
|
|
+var ClipboardJS = require('clipboard')
|
|
|
|
|
|
export default {
|
|
export default {
|
|
name: 'tool_box',
|
|
name: 'tool_box',
|
|
@@ -52,7 +57,8 @@ export default {
|
|
metaTitle: 'Install DeNet Plugin to Participate',
|
|
metaTitle: 'Install DeNet Plugin to Participate',
|
|
device: '',
|
|
device: '',
|
|
detail: {},
|
|
detail: {},
|
|
- };
|
|
|
|
|
|
+ img_url: ''
|
|
|
|
+ }
|
|
},
|
|
},
|
|
head() {
|
|
head() {
|
|
return {
|
|
return {
|
|
@@ -60,43 +66,43 @@ export default {
|
|
title: this.title,
|
|
title: this.title,
|
|
appVersionCode: appVersionCode,
|
|
appVersionCode: appVersionCode,
|
|
meta: [
|
|
meta: [
|
|
- // facebook
|
|
|
|
|
|
+ // facebook
|
|
{
|
|
{
|
|
name: 'og:url',
|
|
name: 'og:url',
|
|
- content: jumpUrl + 'toolbox/' + this.$route.params.id,
|
|
|
|
|
|
+ content: jumpUrl + 'toolbox/' + this.$route.params.id
|
|
},
|
|
},
|
|
{
|
|
{
|
|
name: 'og:title',
|
|
name: 'og:title',
|
|
- content: this.metaTitle,
|
|
|
|
|
|
+ content: this.metaTitle
|
|
},
|
|
},
|
|
{
|
|
{
|
|
name: 'og:image',
|
|
name: 'og:image',
|
|
- content: this.detail.postBizData.linkImagePath || '',
|
|
|
|
|
|
+ content: this.detail.postBizData.linkImagePath || ''
|
|
},
|
|
},
|
|
// twitter
|
|
// twitter
|
|
{
|
|
{
|
|
name: 'twitter:card',
|
|
name: 'twitter:card',
|
|
- content: 'summary_large_image',
|
|
|
|
|
|
+ content: 'summary_large_image'
|
|
},
|
|
},
|
|
{
|
|
{
|
|
name: 'twitter:url',
|
|
name: 'twitter:url',
|
|
- content: jumpUrl + 'toolbox/' + this.$route.params.id,
|
|
|
|
|
|
+ content: jumpUrl + 'toolbox/' + this.$route.params.id
|
|
},
|
|
},
|
|
{
|
|
{
|
|
name: 'twitter:title',
|
|
name: 'twitter:title',
|
|
- content: this.detail.postBizData.linkTitle || this.metaTitle,
|
|
|
|
|
|
+ content: this.detail.postBizData.linkTitle || this.metaTitle
|
|
},
|
|
},
|
|
{
|
|
{
|
|
name: 'twitter:image',
|
|
name: 'twitter:image',
|
|
- content: this.detail.postBizData.linkImagePath || '',
|
|
|
|
- },
|
|
|
|
- ],
|
|
|
|
- };
|
|
|
|
|
|
+ content: this.detail.postBizData.linkImagePath || ''
|
|
|
|
+ }
|
|
|
|
+ ]
|
|
|
|
+ }
|
|
},
|
|
},
|
|
components: {
|
|
components: {
|
|
VLogo,
|
|
VLogo,
|
|
InstallChrome,
|
|
InstallChrome,
|
|
- InstallExtension,
|
|
|
|
|
|
+ InstallExtension
|
|
},
|
|
},
|
|
async asyncData(params) {
|
|
async asyncData(params) {
|
|
let { route } = params;
|
|
let { route } = params;
|
|
@@ -106,32 +112,42 @@ export default {
|
|
mid: '00000000-0000-0000-0000-000000000000',
|
|
mid: '00000000-0000-0000-0000-000000000000',
|
|
},
|
|
},
|
|
params: {
|
|
params: {
|
|
- postId: route.params.id || '',
|
|
|
|
- },
|
|
|
|
- });
|
|
|
|
|
|
+ postId: route.params.id || ''
|
|
|
|
+ }
|
|
|
|
+ })
|
|
if (data.code == 0) {
|
|
if (data.code == 0) {
|
|
if (data.data && data.data.postBizData && typeof data.data.postBizData == 'string') {
|
|
if (data.data && data.data.postBizData && typeof data.data.postBizData == 'string') {
|
|
- data.data.postBizData = JSON.parse(data.data.postBizData);
|
|
|
|
|
|
+ data.data.postBizData = JSON.parse(data.data.postBizData)
|
|
}
|
|
}
|
|
if (data.data.postBizData === null) {
|
|
if (data.data.postBizData === null) {
|
|
data.data.postBizData = {
|
|
data.data.postBizData = {
|
|
- postUserInfo: {},
|
|
|
|
- };
|
|
|
|
|
|
+ postUserInfo: {}
|
|
|
|
+ }
|
|
}
|
|
}
|
|
- console.log('detail', data.data);
|
|
|
|
|
|
+ console.log('detail', data.data)
|
|
|
|
|
|
return {
|
|
return {
|
|
detail: data.data,
|
|
detail: data.data,
|
|
- };
|
|
|
|
|
|
+ }
|
|
}
|
|
}
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
- this.copy_link = window.location.href;
|
|
|
|
- this.device = getBrowserType();
|
|
|
|
- this.getConfig();
|
|
|
|
- console.log('device', this.device);
|
|
|
|
|
|
+ if (this.detail.postBizData.linkImagePath.indexOf('default') > 0) {
|
|
|
|
+ this.img_url = '/img/img-default.png'
|
|
|
|
+ } else {
|
|
|
|
+ this.img_url = this.detail.postBizData.linkImagePath
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+ this.copy_link = window.location.href
|
|
|
|
+ this.device = getBrowserType()
|
|
|
|
+ console.log('device', this.device)
|
|
|
|
+ if (this.device == 'ios' || this.device == '安卓') {
|
|
|
|
+ return window.location = this.detail.postBizData.convertUrl
|
|
|
|
+ }
|
|
|
|
+ this.getConfig()
|
|
if (this.device == 'chrome') {
|
|
if (this.device == 'chrome') {
|
|
- this.setCookie();
|
|
|
|
|
|
+ this.setCookie()
|
|
}
|
|
}
|
|
},
|
|
},
|
|
|
|
|
|
@@ -141,7 +157,8 @@ export default {
|
|
srcContentId: this.detail.srcContentId || '',
|
|
srcContentId: this.detail.srcContentId || '',
|
|
postNickName: this.detail.srcUserId || '',
|
|
postNickName: this.detail.srcUserId || '',
|
|
createTime: Date.now(),
|
|
createTime: Date.now(),
|
|
- jump_type: 'jump_info',
|
|
|
|
|
|
+ jump_type: 'tool_box',
|
|
|
|
+ postId: this.detail.postBizData.postId || ''
|
|
};
|
|
};
|
|
Cookies.set('jump_info', JSON.stringify(pickupInfo), { expires: 1000 });
|
|
Cookies.set('jump_info', JSON.stringify(pickupInfo), { expires: 1000 });
|
|
},
|
|
},
|
|
@@ -149,10 +166,11 @@ export default {
|
|
let { data } = await axios.post(`${baseURL}/denet/base/config/getFrontConfig`, {
|
|
let { data } = await axios.post(`${baseURL}/denet/base/config/getFrontConfig`, {
|
|
baseInfo: {
|
|
baseInfo: {
|
|
appVersionCode: this.appVersionCode,
|
|
appVersionCode: this.appVersionCode,
|
|
- mid: this.mid,
|
|
|
|
|
|
+ mid: this.mid
|
|
},
|
|
},
|
|
- params: {},
|
|
|
|
- });
|
|
|
|
|
|
+ params: {
|
|
|
|
+ }
|
|
|
|
+ })
|
|
if (data.code == 0) {
|
|
if (data.code == 0) {
|
|
this.config = data.data;
|
|
this.config = data.data;
|
|
}
|
|
}
|
|
@@ -165,17 +183,18 @@ export default {
|
|
e.clearSelection();
|
|
e.clearSelection();
|
|
});
|
|
});
|
|
|
|
|
|
- clipboard.on('error', function () {
|
|
|
|
|
|
+ clipboard.on('error', function (e) {
|
|
Toast('copy error');
|
|
Toast('copy error');
|
|
});
|
|
});
|
|
},
|
|
},
|
|
clickExtension() {
|
|
clickExtension() {
|
|
- window.open(this.config.extensionsInstallUrl);
|
|
|
|
- },
|
|
|
|
- },
|
|
|
|
-};
|
|
|
|
|
|
+ window.open(this.config.extensionsInstallUrl)
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
</script>
|
|
</script>
|
|
-<style lang="scss">
|
|
|
|
|
|
+<style lang="scss" >
|
|
html,
|
|
html,
|
|
body,
|
|
body,
|
|
#__nuxt,
|
|
#__nuxt,
|
|
@@ -184,7 +203,9 @@ body,
|
|
padding: 0;
|
|
padding: 0;
|
|
width: 100%;
|
|
width: 100%;
|
|
height: 100%;
|
|
height: 100%;
|
|
- background: #f5faff;
|
|
|
|
|
|
+ background: #F5FAFF;
|
|
|
|
+
|
|
|
|
+
|
|
}
|
|
}
|
|
|
|
|
|
.main {
|
|
.main {
|
|
@@ -244,6 +265,8 @@ body,
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+
|
|
|
|
+
|
|
.area-button {
|
|
.area-button {
|
|
position: fixed;
|
|
position: fixed;
|
|
width: 100%;
|
|
width: 100%;
|
|
@@ -254,7 +277,7 @@ body,
|
|
.btn1 {
|
|
.btn1 {
|
|
height: 50px;
|
|
height: 50px;
|
|
line-height: 50px;
|
|
line-height: 50px;
|
|
- background: #1d9bf0;
|
|
|
|
|
|
+ background: #1D9BF0;
|
|
border-radius: 100px;
|
|
border-radius: 100px;
|
|
width: 100%;
|
|
width: 100%;
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
@@ -262,7 +285,7 @@ body,
|
|
text-align: center;
|
|
text-align: center;
|
|
letter-spacing: 0.3px;
|
|
letter-spacing: 0.3px;
|
|
|
|
|
|
- color: #ffffff;
|
|
|
|
|
|
+ color: #FFFFFF;
|
|
margin-bottom: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
}
|
|
|
|
|
|
@@ -270,16 +293,17 @@ body,
|
|
height: 50px;
|
|
height: 50px;
|
|
line-height: 50px;
|
|
line-height: 50px;
|
|
background: rgba(29, 155, 240, 0.01);
|
|
background: rgba(29, 155, 240, 0.01);
|
|
- border: 1px solid #1d9bf0;
|
|
|
|
|
|
+ border: 1px solid #1D9BF0;
|
|
border-radius: 100px;
|
|
border-radius: 100px;
|
|
width: 100%;
|
|
width: 100%;
|
|
font-weight: 600;
|
|
font-weight: 600;
|
|
font-size: 18px;
|
|
font-size: 18px;
|
|
text-align: center;
|
|
text-align: center;
|
|
letter-spacing: 0.3px;
|
|
letter-spacing: 0.3px;
|
|
- color: #1d9bf0;
|
|
|
|
|
|
+ color: #1D9BF0;
|
|
|
|
+
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
-</style>
|
|
|
|
|
|
+</style>
|