91 lines
3.0 KiB
PHP
91 lines
3.0 KiB
PHP
<?php
|
|
/**
|
|
* PerToolBox Front - 二维码生成器页面
|
|
*
|
|
* Copyright (C) 2024 Sea Network Technology Studio
|
|
* Author: Canglan <admin@sea-studio.top>
|
|
* License: AGPL v3
|
|
*/
|
|
|
|
require_once '../config.php';
|
|
include_once '../header.php';
|
|
include_once '../sidebar.php';
|
|
?>
|
|
|
|
<div class="main-content">
|
|
<div class="card">
|
|
<h1 class="text-2xl font-bold mb-6">📱 二维码生成器</h1>
|
|
|
|
<div class="grid md:grid-cols-2 gap-8">
|
|
<div>
|
|
<label class="form-label">内容/链接：</label>
|
|
<textarea id="content" rows="4" placeholder="输入文本或URL..." class="form-input mb-4"></textarea>
|
|
|
|
<label class="form-label">尺寸：<span id="sizeValue">10</span></label>
|
|
<input type="range" id="size" min="5" max="20" value="10" class="w-full mb-4">
|
|
|
|
<button id="generateBtn" class="btn btn-primary w-full">生成二维码</button>
|
|
</div>
|
|
|
|
<div class="text-center">
|
|
<div id="qrContainer" class="bg-gray-50 rounded-lg p-4 min-h-[300px] flex items-center justify-center">
|
|
<div class="text-gray-400">点击生成二维码</div>
|
|
</div>
|
|
<button id="downloadBtn" class="btn btn-secondary mt-4 hidden">下载二维码</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
let currentQRCode = null;
|
|
|
|
async function generateQR() {
|
|
const content = document.getElementById('content').value.trim();
|
|
if (!content) {
|
|
alert('请输入内容');
|
|
return;
|
|
}
|
|
|
|
const size = parseInt(document.getElementById('size').value);
|
|
|
|
try {
|
|
const formData = new URLSearchParams();
|
|
formData.append('content', content);
|
|
formData.append('size', size);
|
|
|
|
const data = await apiRequest('/qrcode/generate', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/x-www-form-urlencoded'
|
|
},
|
|
body: formData
|
|
});
|
|
|
|
currentQRCode = data.qr_code;
|
|
document.getElementById('qrContainer').innerHTML = `<img src="${data.qr_code}" alt="二维码" class="max-w-full mx-auto">`;
|
|
document.getElementById('downloadBtn').classList.remove('hidden');
|
|
} catch (error) {
|
|
console.error('生成失败:', error);
|
|
alert('生成失败: ' + error.message);
|
|
}
|
|
}
|
|
|
|
function downloadQR() {
|
|
if (currentQRCode) {
|
|
const link = document.createElement('a');
|
|
link.download = 'qrcode.png';
|
|
link.href = currentQRCode;
|
|
link.click();
|
|
}
|
|
}
|
|
|
|
document.getElementById('size').addEventListener('input', (e) => {
|
|
document.getElementById('sizeValue').textContent = e.target.value;
|
|
});
|
|
document.getElementById('generateBtn').addEventListener('click', generateQR);
|
|
document.getElementById('downloadBtn').addEventListener('click', downloadQR);
|
|
|
|
</script>
|
|
|
|
<?php include_once '../footer.php'; ?>
|