<template>
|
<view>
|
<cu-custom :bgColor="NavBarColor" :isBack="true" backRouterName="index">
|
<block slot="backText">返回</block>
|
<block slot="content">扫一扫</block>
|
</cu-custom>
|
<view class="scanCode">
|
<mumu-get-qrcode :continue="true" @success='qrcodeSucess' @error="qrcodeError"
|
:definition="true"></mumu-get-qrcode>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import mumuGetQrcode from '@/uni_modules/mumu-getQrcode/components/mumu-getQrcode/mumu-getQrcode.vue';
|
|
export default {
|
components: {
|
mumuGetQrcode // 注册
|
},
|
name: 'spare',
|
data() {
|
return {
|
NavBarColor: this.NavBarColor,
|
hasNavigated: false // 标记是否已经跳转
|
};
|
},
|
// mounted() {
|
// window.addEventListener('hashchange', this.handleHashChange);
|
// // 初始解析 hash
|
// this.handleHashChange();
|
// },
|
// beforeDestroy() {
|
// window.removeEventListener('hashchange', this.handleHashChange);
|
// },
|
|
methods: {
|
// handleHashChange() {
|
// if (this.hasNavigated) {
|
// console.log('Already navigated, skipping hash change handling');
|
// return;
|
// }
|
|
// const hash = window.location.hash;
|
// console.log('Hash changed:', hash); // 添加日志
|
// if (!hash || hash.length === 0) {
|
// console.warn('Hash is empty or undefined');
|
// return;
|
// }
|
// const params = new URLSearchParams(hash.split('?')[1]);
|
// const equipmentId = params.get('equipmentId');
|
// console.log('Parsed equipmentId:', equipmentId); // 添加日志
|
// if (equipmentId) {
|
// this.navigateToDeviceDetails(equipmentId);
|
// } else {
|
// console.warn('No equipmentId found in hash');
|
// }
|
// },
|
navigateToDeviceDetails(equipmentId) {
|
this.hasNavigated = true; // 标记已经跳转
|
uni.navigateTo({
|
url: `/pages/device/deviceWebDeils/deviceWebDeils?equipmentId=${encodeURIComponent(equipmentId)}`,
|
success: () => {
|
console.log('Navigated to device details');
|
},
|
fail: (err) => {
|
console.error('Navigation failed:', err);
|
}
|
});
|
},
|
qrcodeSucess(data) { // 扫码成功
|
setTimeout(() => {
|
let equipmentId;
|
try {
|
// 兼容性处理：优先使用URL和URLSearchParams，如果不可用则使用字符串解析
|
if ('URL' in window && 'URLSearchParams' in window) {
|
const url = new URL(data);
|
const params = new URLSearchParams(url.hash.slice(1).split('?')[1]);
|
equipmentId = params.get('equipmentId');
|
} else {
|
// 字符串解析方式
|
const hashIndex = data.indexOf('#');
|
if (hashIndex !== -1) {
|
const hashPart = data.substring(hashIndex + 1);
|
const paramIndex = hashPart.indexOf('?');
|
if (paramIndex !== -1) {
|
const paramStr = hashPart.substring(paramIndex + 1);
|
const pairs = paramStr.split('&');
|
for (let pair of pairs) {
|
const [key, value] = pair.split('=');
|
if (key === 'equipmentId') {
|
equipmentId = value;
|
break;
|
}
|
}
|
}
|
}
|
}
|
|
if (equipmentId) {
|
// 登录成功且获取到equipmentId，跳转到设备详情页面
|
this.navigateToDeviceDetails(equipmentId);
|
} else {
|
uni.showModal({
|
title: '提示',
|
content: "二维码中未找到有效的equipmentId",
|
showCancel: false
|
});
|
}
|
} catch (error) {
|
uni.showModal({
|
title: '错误',
|
content: "解析URL出错，请检查二维码内容",
|
showCancel: false
|
});
|
}
|
}, 200); // 增加100毫秒的延迟
|
},
|
qrcodeError(err) { // 扫码失败
|
uni.showModal({
|
title: '摄像头授权失败',
|
content: '摄像头授权失败，请检测当前浏览器是否有摄像头权限。',
|
success: () => {
|
uni.navigateBack({}); // 返回到上一页
|
}
|
});
|
}
|
}
|
};
|
</script>
|
|
<style>
|
.scanCode {
|
position: fixed;
|
top: 0;
|
left: 0;
|
right: 0;
|
bottom: 0;
|
z-index: 99;
|
height: 100%;
|
width: 100%;
|
background-color: rgba(0, 0, 0, 0.7);
|
}
|
|
.reader-box {
|
position: fixed;
|
top: 0;
|
bottom: 0;
|
left: 0;
|
right: 0;
|
background-color: rgba(0, 0, 0, 0.5);
|
}
|
|
.reader {
|
width: 540rpx;
|
height: 540rpx;
|
position: absolute;
|
top: 50%;
|
left: 50%;
|
transform: translate(-50%, -50%);
|
}
|
</style>
|
