feat: 产品卡片添加复制购买链接按钮

This commit is contained in:
ikmkj
2026-03-19 17:20:09 +08:00
parent 4d6e968368
commit cbdf977b1a

View File

@@ -483,6 +483,28 @@
cursor: pointer; cursor: pointer;
} }
.copy-link-btn {
background: rgba(0, 212, 255, 0.2);
border: 1px solid rgba(0, 212, 255, 0.5);
color: #00d4ff;
padding: 8px 16px;
border-radius: 8px;
font-size: 13px;
cursor: pointer;
transition: all 0.2s;
white-space: nowrap;
}
.copy-link-btn:hover {
background: rgba(0, 212, 255, 0.3);
}
.copy-link-btn.copied {
background: rgba(0, 255, 136, 0.2);
border-color: rgba(0, 255, 136, 0.5);
color: #00ff88;
}
.alert-banner { .alert-banner {
background: linear-gradient(90deg, #ff6b6b, #ff8e53); background: linear-gradient(90deg, #ff6b6b, #ff8e53);
padding: 15px; padding: 15px;
@@ -675,6 +697,31 @@
audio.currentTime = 0; audio.currentTime = 0;
audio.play().catch(e => console.log('音频播放需要用户交互')); audio.play().catch(e => console.log('音频播放需要用户交互'));
} }
function copyLink(url, btn) {
navigator.clipboard.writeText(url).then(() => {
btn.textContent = '已复制';
btn.classList.add('copied');
setTimeout(() => {
btn.textContent = '复制链接';
btn.classList.remove('copied');
}, 2000);
}).catch(() => {
// fallback
const input = document.createElement('input');
input.value = url;
document.body.appendChild(input);
input.select();
document.execCommand('copy');
document.body.removeChild(input);
btn.textContent = '已复制';
btn.classList.add('copied');
setTimeout(() => {
btn.textContent = '复制链接';
btn.classList.remove('copied');
}, 2000);
});
}
function showAlertBanner(products) { function showAlertBanner(products) {
const banner = document.getElementById('alertBanner'); const banner = document.getElementById('alertBanner');
@@ -1000,6 +1047,7 @@
? '<span class="buy-btn sold-out">已售罄</span>' ? '<span class="buy-btn sold-out">已售罄</span>'
: `<a href="${product.buyUrl || ACTIVITY_URL}" target="_blank" class="buy-btn">立即购买</a>` : `<a href="${product.buyUrl || ACTIVITY_URL}" target="_blank" class="buy-btn">立即购买</a>`
} }
${product.buyUrl ? `<button class="copy-link-btn" onclick="copyLink('${product.buyUrl}', this)">复制链接</button>` : ''}
</div> </div>
<div class="product-monitor-checkbox"> <div class="product-monitor-checkbox">
<input type="checkbox" id="monitor-${product.id}" <input type="checkbox" id="monitor-${product.id}"