fix: 完善扫一扫功能

pull/158/head
卢越 2025-07-28 16:49:01 +08:00
parent 030f7525f8
commit e64a9d2e65
2 changed files with 99 additions and 23 deletions

View File

@ -20,14 +20,14 @@
// //
const elBackground = computed(() => { const elBackground = computed(() => {
if (props.styles) { if (props.styles) {
if (props.styles.bgType === 'color') if (props.styles.bgType === 'color') {
return { background: props.styles.bgColor }; return { background: props.styles.bgColor };
if (props.styles.bgType === 'img') }
if (props.styles.bgType === 'img') {
return { return {
background: `url(${sheep.$url.cdn( background: `url(${sheep.$url.cdn(props.styles.bgImg)}) no-repeat top center / 100% auto`,
props.styles.bgImg,
)}) no-repeat top center / 100% auto`,
}; };
}
} }
}); });

View File

@ -25,15 +25,15 @@
<view class="search-input ss-line-1" :style="{ color: fontColor }"> <view class="search-input ss-line-1" :style="{ color: fontColor }">
{{ placeholder }} {{ placeholder }}
</view> </view>
</view> <!-- 右侧扫一扫图标 -->
<!-- 右侧扫一扫图标 --> <view
<view v-if="showScan"
v-if="showScan" class="scan-icon _icon-scan"
class="scan-icon _icon-scan" :style="{ color: fontColor }"
:style="{ color: fontColor }" @tap.stop="onScan"
@tap.stop="onScan" style="margin-left: auto"
style="margin-left: auto" >
> </view>
</view> </view>
<uni-search-bar <uni-search-bar
v-if="!navbar" v-if="!navbar"
@ -51,7 +51,8 @@
class="ss-m-r-16" class="ss-m-r-16"
:style="[{ color: data.textColor }]" :style="[{ color: data.textColor }]"
@tap.stop="sheep.$router.go('/pages/goods/list', { keyword: item })" @tap.stop="sheep.$router.go('/pages/goods/list', { keyword: item })"
>{{ item }} >
{{ item }}
</view> </view>
</view> </view>
</view> </view>
@ -162,9 +163,8 @@
} }
} }
// TODO
/** /**
* 扫一扫 * 扫一扫功能
*/ */
function onScan() { function onScan() {
uni.scanCode({ uni.scanCode({
@ -177,23 +177,99 @@
fail: (err) => { fail: (err) => {
console.error(err); console.error(err);
uni.showToast({ uni.showToast({
title: '扫码失败', title: err.errMsg === 'scanCode:fail cancel' ? '操作已取消' : '扫码失败',
icon: 'none', icon: 'error',
}); });
}, },
}); });
} }
/** /**
* 展示扫码结果 * 检测是否为有效URL
* @param text 扫码内容 * @param {string} str 待检测字符串
* @returns {boolean} 是否为有效URL
*/
function isValidUrl(str) {
try {
//
const url = str.trim();
return (
(url.startsWith('http://') || url.startsWith('https://') || url.startsWith('ftp://')) &&
//
url.length >= 10
);
} catch {
return false;
}
}
/**
* 展示扫码结果并处理用户操作
* @param {string} text 扫码得到的内容
*/ */
function showScanResult(text) { function showScanResult(text) {
const isUrl = isValidUrl(text);
//
uni.showModal({ uni.showModal({
title: '扫描结果', title: '扫描结果',
content: text, content: text,
showCancel: false, confirmText: isUrl ? '访问' : '复制',
confirmText: '知道了', cancelText: '取消',
success: (res) => {
if (res.confirm) {
if (isUrl) {
handleUrl(text);
} else {
handleCopy(text);
}
}
},
});
}
/**
* 处理URL跳转
* @param {string} url 要访问的URL
*/
function handleUrl(url) {
// 1webview
uni.navigateTo({
url: `/pages/public/webview?url=${encodeURIComponent(url)}`,
});
// 2
/*
uni.setClipboardData({
data: url,
success: () => {
uni.showToast({
title: '链接已复制,请在浏览器打开',
icon: 'success',
});
},
});
*/
}
/**
* 处理文本复制
* @param {string} text 要复制的文本
*/
function handleCopy(text) {
uni.setClipboardData({
data: text,
success: () => {
uni.showToast({
title: '已复制到剪贴板',
icon: 'success',
});
},
fail: () => {
uni.showToast({
title: '复制失败,请重试',
icon: 'error',
});
},
}); });
} }
</script> </script>