113 lines
2.4 KiB
Vue
113 lines
2.4 KiB
Vue
|
<template>
|
||
|
|
<view>
|
||
|
|
<!-- #ifdef H5 -->
|
||
|
|
<view class="wrapper" v-if="!weChat" @click="openApp()">
|
||
|
|
<!-- 左侧图标 -->
|
||
|
|
<image class="img" :src="logo"></image>
|
||
|
|
<view class="open">
|
||
|
|
打开{{config.name}}
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<!-- #endif -->
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import config from "@/config/config";
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
config,
|
||
|
|
weChat: false,
|
||
|
|
logo: require("@/icon.png"),
|
||
|
|
};
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
// #ifdef H5
|
||
|
|
// 判断是否是微信浏览器
|
||
|
|
var ua = navigator.userAgent.toLowerCase();
|
||
|
|
var isWeixin = ua.indexOf("micromessenger") != -1;
|
||
|
|
if (isWeixin) {
|
||
|
|
this.weChat = true;
|
||
|
|
} else {
|
||
|
|
this.weChat = false;
|
||
|
|
}
|
||
|
|
// #endif
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
downloadApp() {
|
||
|
|
setTimeout(function () {
|
||
|
|
window.location.href = config.downloadLink;
|
||
|
|
}, 2000);
|
||
|
|
},
|
||
|
|
/**
|
||
|
|
* 打开app 仅在h5生效 使用ifream唤醒app
|
||
|
|
*/
|
||
|
|
openApp() {
|
||
|
|
let src;
|
||
|
|
if (location.href) {
|
||
|
|
src = location.href.split("/pages")[1];
|
||
|
|
}
|
||
|
|
let t = `${config.schemeLink}pages${src}`;
|
||
|
|
|
||
|
|
try {
|
||
|
|
var e = navigator.userAgent.toLowerCase(),
|
||
|
|
n = e.match(/cpu iphone os (.*?) like mac os/);
|
||
|
|
if (
|
||
|
|
((n = null !== n ? n[1].replace(/_/g, ".") : 0), parseInt(n) >= 9)
|
||
|
|
) {
|
||
|
|
window.location.href = t;
|
||
|
|
|
||
|
|
this.downloadApp();
|
||
|
|
} else {
|
||
|
|
var r = document.createElement("iframe");
|
||
|
|
(r.src = t), (r.style.display = "none"), document.body.appendChild(r);
|
||
|
|
|
||
|
|
this.downloadApp();
|
||
|
|
}
|
||
|
|
} catch (e) {
|
||
|
|
window.location.href = t;
|
||
|
|
this.downloadApp();
|
||
|
|
}
|
||
|
|
},
|
||
|
|
},
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped lang="scss">
|
||
|
|
.img {
|
||
|
|
margin: 0 4rpx;
|
||
|
|
width: 50rpx;
|
||
|
|
height: 50rpx;
|
||
|
|
border-radius: 50%;
|
||
|
|
border: 5rpx solid #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.open {
|
||
|
|
margin: 0 10rpx;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 26rpx;
|
||
|
|
}
|
||
|
|
.wrapper:hover {
|
||
|
|
transform: translateX(0);
|
||
|
|
}
|
||
|
|
.wrapper {
|
||
|
|
transform: translateX(160rpx);
|
||
|
|
transition: 0.35s;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
display: flex;
|
||
|
|
border-top-left-radius: 20px;
|
||
|
|
border-bottom-left-radius: 20px;
|
||
|
|
color: #fff;
|
||
|
|
// width: 220rpx;
|
||
|
|
background: $light-color;
|
||
|
|
position: fixed;
|
||
|
|
top: 25%;
|
||
|
|
right: 0;
|
||
|
|
height: 60rpx;
|
||
|
|
z-index: 9;
|
||
|
|
}
|
||
|
|
</style>
|