mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-uniapp.git
synced 2026-08-06 10:57:25 +08:00
349ffa4f34
- 将多个组件转换为 `<script setup>` 语法，提升可读性和性能 - 优化状态管理和事件处理逻辑，简化代码结构 - 更新样式和布局以适应新组件结构 - 添加新功能和修复已知问题，提升用户体验
109 lines
2.2 KiB
Vue
109 lines
2.2 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 setup lang="ts">
|
|
import { ref, onMounted } from 'vue'
|
|
import config from "@/config/config"
|
|
import logoImg from "@/icon.png"
|
|
|
|
const weChat = ref(false)
|
|
const logo = logoImg
|
|
|
|
onMounted(() => {
|
|
// #ifdef H5
|
|
// 判断是否是微信浏览器
|
|
var ua = navigator.userAgent.toLowerCase();
|
|
var isWeixin = ua.indexOf("micromessenger") != -1;
|
|
weChat.value = isWeixin ? true : false
|
|
// #endif
|
|
})
|
|
|
|
/**
|
|
* 跳转到下载app页面
|
|
*/
|
|
const downloadApp = () => {
|
|
setTimeout(function () {
|
|
window.location.href = config.downloadLink;
|
|
}, 2000);
|
|
}
|
|
|
|
/**
|
|
* 打开app 仅在h5生效 使用ifream唤醒app
|
|
*/
|
|
const openApp = () => {
|
|
let src: string = ''
|
|
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
|
|
|
|
downloadApp()
|
|
} else {
|
|
var r = document.createElement("iframe");
|
|
(r.src = t), (r.style.display = "none"), document.body.appendChild(r)
|
|
|
|
downloadApp()
|
|
}
|
|
} catch (e) {
|
|
window.location.href = t
|
|
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>
|