257 lines
6.4 KiB
Vue
257 lines
6.4 KiB
Vue
<template>
|
||
<view class="page">
|
||
<uni-nav-bar @clickLeft="goto(1, 1)" left-icon="back" :border="false" :shadow="false" :fixed="true"
|
||
:title="$t('help.title')" backgroundColor="#fff"></uni-nav-bar>
|
||
<!--<view style="padding: 20px 15px; font-size: 16px; color: #3d3d3d;">
|
||
{{$t('help.text1')}}
|
||
</view>
|
||
<view class="cell_list" @click="open('qq_group')">
|
||
<view class="cell_left txt">
|
||
<image src="/static/images/h1.png" mode="cover"
|
||
style="width: 30px; height: 30px; border-radius: 10px; margin-right: 5px;"></image>
|
||
QQ group
|
||
</view>
|
||
<view class="cell_right arrow"></view>
|
||
</view>
|
||
<view class="cell_list" @click="open('telegram_group')">
|
||
<view class="cell_left txt">
|
||
<image src="/static/images/h2.png" mode="cover"
|
||
style="width: 30px; height: 30px; border-radius: 10px; margin-right: 5px;"></image>
|
||
Telegram
|
||
</view>
|
||
<view class="cell_right arrow"></view>
|
||
</view>
|
||
<view class="cell_list" @click="open('sigua_group')">
|
||
<view class="cell_left txt">
|
||
<image src="/static/images/h3.png" mode="cover"
|
||
style="width: 30px; height: 30px; border-radius: 10px; margin-right: 5px;"></image>
|
||
Loofah group
|
||
</view>
|
||
<view class="cell_right arrow"></view>
|
||
</view> -->
|
||
<view style="padding: 40rpx 30rpx; font-size: 32rpx; color: #3d3d3d;">
|
||
{{$t('help.text2')}}
|
||
</view>
|
||
<view class="cell_list" v-for="(item, index) in aList" :key="index" @click="onPageJump('/pages/about/helpdetail?id='+item.id)">
|
||
<view class="cell_left txt">
|
||
{{item.title}}
|
||
</view>
|
||
<view class="cell_right arrow"></view>
|
||
</view>
|
||
|
||
|
||
<uni-popup ref="popup" type="dialog" :is-mask-click="true" background-color="#fff" borderRadius="40rpx">
|
||
<view class="dialog">
|
||
<view class="title">{{dialogTitle}}</view>
|
||
<view style="padding-bottom: 40rpx; width: 100%;" v-for="(value, key) in list" :key="key">
|
||
<view class="v1" style="margin-left: 20rpx;">{{key}}:</view>
|
||
<view class="v1" style="margin-left: 40rpx;">{{value}} </view>
|
||
<image style="width: 36rpx; height: 30rpx; float: right; margin-left: 20rpx; margin-top: 10rpx;"
|
||
src="/static/images/copy.png" @click="copy(value)" mode="cover"></image>
|
||
<view style="clear: both;"></view>
|
||
</view>
|
||
</view>
|
||
</uni-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {
|
||
mapState,
|
||
mapMutations
|
||
} from 'vuex';
|
||
export default {
|
||
data() {
|
||
return {
|
||
init: {},
|
||
dialogTitle: 'Select a network',
|
||
list: {},
|
||
type: '',
|
||
aList: []
|
||
};
|
||
},
|
||
computed: {},
|
||
//第一次加载
|
||
onLoad(e) {
|
||
this.getlist();
|
||
this.$http.get('/api/common/init?lang=' + this.$i18n.locale).then(res => {
|
||
this.init = res.data;
|
||
});
|
||
|
||
},
|
||
//页面显示
|
||
onShow() {},
|
||
//方法
|
||
methods: {
|
||
open(type) {
|
||
this.type = type;
|
||
switch (type) {
|
||
case 'qq_group':
|
||
this.list = this.init[type];
|
||
this.dialogTitle = 'QQ Group';
|
||
break;
|
||
case 'telegram_group':
|
||
this.list = this.init[type];
|
||
this.dialogTitle = 'Telegram Group';
|
||
break;
|
||
case 'sigua_group':
|
||
this.list = this.init[type];
|
||
this.dialogTitle = 'Loofah Group';
|
||
break;
|
||
}
|
||
this.$refs.popup.open('dialog');
|
||
},
|
||
getlist(){
|
||
this.$http.get('/api/article/list?category_id=9&lang=' + this.$i18n.locale).then(res => {
|
||
this.aList = res.data.data;
|
||
});
|
||
},
|
||
goto(url, type) {
|
||
if (type == 2) {
|
||
return uni.switchTab({ url: url })
|
||
}
|
||
if (type == 1) {
|
||
return uni.navigateBack({ delta: url });
|
||
}
|
||
uni.navigateTo({
|
||
url: url
|
||
})
|
||
},
|
||
onPageJump(url) {
|
||
uni.navigateTo({
|
||
url: url
|
||
});
|
||
},
|
||
onTokenJump(url) {
|
||
this.judgeLogin(() => {
|
||
uni.navigateTo({
|
||
url: url
|
||
});
|
||
});
|
||
},
|
||
handleClose(done) {
|
||
this.dialogVisible = false;
|
||
},
|
||
openQQChat(number) {
|
||
// #ifdef APP-PLUS
|
||
if (plus.os.name === "Android") {
|
||
var main = plus.android.runtimeMainActivity();
|
||
var Intent = plus.android.importClass('android.content.Intent');
|
||
var Uri = plus.android.importClass('android.net.Uri');
|
||
var intent = new Intent(Intent.ACTION_VIEW, Uri.parse("mqqwpa://im/chat?chat_type=wpa&uin=" +
|
||
qqNumber));
|
||
main.startActivity(intent);
|
||
} else if (plus.os.name === "iOS") {
|
||
plus.runtime.launchApplication({
|
||
action: "mqq://im/chat?chat_type=wpa&uin=" + qqNumber + "&version=1&src_type=web"
|
||
}, function(e) {
|
||
if (e.error) {
|
||
plus.nativeUI.confirm("检查到您未安装qq，请先到App Store搜索下载？", function(i) {
|
||
if (i.index === 0) {
|
||
window.location.href = "https://itunes.apple.com/cn/app/mqq/";
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
// #endif
|
||
// #ifdef H5
|
||
location.href = 'mqqwpa://im/chat?chat_type=wpa&uin=' + number + '&version=1&src_type=web';
|
||
// #endif
|
||
},
|
||
copy(val = '') {
|
||
const textArea = document.createElement('textarea');
|
||
textArea.value = val;
|
||
document.body.appendChild(textArea);
|
||
textArea.select();
|
||
try {
|
||
document.execCommand('copy');
|
||
uni.showToast({
|
||
title: this.$t('copySuccess')
|
||
});
|
||
} catch (err) {
|
||
console.error('Could not copy text: ', err);
|
||
}
|
||
document.body.removeChild(textArea);
|
||
},
|
||
// open1(v){
|
||
// switch(this.type){
|
||
// case 'qq_group':
|
||
// openQQChat(v);
|
||
// break;
|
||
// case 'telegram_group':
|
||
// location.href = 'https://t.me/v'
|
||
// //（用户名）
|
||
// break;
|
||
// case 'sigua_group':
|
||
// location.href = 'https://t.me/v'
|
||
// break;
|
||
// }
|
||
// }
|
||
},
|
||
//页面隐藏
|
||
onHide() {},
|
||
//页面卸载
|
||
onUnload() {},
|
||
//页面下来刷新
|
||
onPullDownRefresh() {},
|
||
//页面上拉触底
|
||
onReachBottom() {},
|
||
//用户点击分享
|
||
onShareAppMessage(e) {
|
||
return this.wxShare();
|
||
}
|
||
};
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
@import '@/style/mixin.scss';
|
||
|
||
body {
|
||
background-color: #F8F8F8;
|
||
}
|
||
|
||
.page {
|
||
min-height: 100vh;
|
||
position: relative;
|
||
background-color: #F8F8F8;
|
||
}
|
||
|
||
.cell_list {
|
||
padding: 30rpx 30rpx;
|
||
margin: 0rpx 30rpx;
|
||
border-bottom: 2rpx solid #ddd;
|
||
}
|
||
|
||
.txt {
|
||
font-weight: 500;
|
||
font-size: 32rpx;
|
||
color: #3d3d3d
|
||
}
|
||
|
||
.cell_right image {
|
||
width: 140rpx;
|
||
height: 140rpx;
|
||
border-radius: 50%;
|
||
}
|
||
|
||
.dialog {
|
||
width: 80vw;
|
||
padding: 20rpx 30rpx;
|
||
border-radius: 40rpx;
|
||
line-height: 50rpx;
|
||
}
|
||
|
||
.dialog .title {
|
||
font-size: 36rpx;
|
||
font-weight: bold;
|
||
text-align: center;
|
||
margin-bottom: 30rpx;
|
||
}
|
||
|
||
.dialog .v1 {
|
||
font-weight: 600;
|
||
font-size: 32rpx;
|
||
color: #1D61E7;
|
||
float: left;
|
||
}
|
||
</style> |