admin/wasm-go
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
lychang
2026-05-20 03:25:35 +08:00
parent 5e3dac3020
commit 7f5350db62
30 changed files with 3370 additions and 1752 deletions
Download Patch File Download Diff File Expand all files Collapse all files

546
web/index.html Normal file
View File

@@ -0,0 +1,546 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>WASM企业分析工具套件</title>
<style>
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
max-width: 1200px;
margin: 0 auto;
padding: 20px;
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
min-height: 100vh;
}
.container {
background-color: white;
border-radius: 15px;
padding: 40px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
margin-top: 20px;
}
header {
text-align: center;
margin-bottom: 40px;
}
h1 {
color: #2c3e50;
font-size: 2.5em;
margin-bottom: 10px;
}
.subtitle {
color: #7f8c8d;
font-size: 1.2em;
margin-bottom: 30px;
}
.features {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 20px;
margin: 40px 0;
}
.feature-card {
background: #f8f9fa;
border-radius: 10px;
padding: 20px;
text-align: center;
transition: transform 0.3s ease;
}
.feature-card:hover {
transform: translateY(-5px);
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}
.feature-icon {
font-size: 2.5em;
margin-bottom: 15px;
display: block;
}
.feature-title {
font-size: 1.3em;
color: #2c3e50;
margin-bottom: 10px;
}
.feature-desc {
color: #7f8c8d;
}
.section {
margin: 30px 0;
padding: 25px;
background: #e3f2fd;
border-radius: 10px;
}
label {
display: block;
margin-bottom: 12px;
font-weight: bold;
color: #34495e;
font-size: 1.1em;
}
input[type="text"], textarea, input[type="file"] {
width: 100%;
padding: 12px;
border: 2px solid #bbdefb;
border-radius: 8px;
font-size: 16px;
box-sizing: border-box;
transition: border-color 0.3s;
margin-bottom: 15px;
}
input[type="text"]:focus, textarea:focus {
outline: none;
border-color: #64b5f6;
}
button {
background: linear-gradient(45deg, #2196F3, #21CBF3);
color: white;
padding: 12px 24px;
border: none;
border-radius: 8px;
cursor: pointer;
font-size: 16px;
margin-right: 10px;
margin-top: 10px;
transition: transform 0.2s, box-shadow 0.2s;
}
button:hover {
transform: scale(1.05);
box-shadow: 0 5px 15px rgba(33, 150, 243, 0.4);
}
button:disabled {
background: #b0bec5;
cursor: not-allowed;
transform: none;
box-shadow: none;
}
.result-section {
margin-top: 20px;
padding: 20px;
background-color: #e8f5e9;
border-radius: 10px;
display: none;
}
.result-section.show {
display: block;
animation: fadeIn 0.5s;
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
.result-item {
margin-bottom: 15px;
padding: 15px;
background-color: white;
border-radius: 8px;
border-left: 5px solid #4caf50;
}
.loading {
text-align: center;
padding: 20px;
display: none;
}
.loading.show {
display: block;
}
.error {
color: #f44336;
background-color: #ffebee;
padding: 15px;
border-radius: 8px;
margin-top: 15px;
display: none;
}
.error.show {
display: block;
}
.tab {
overflow: hidden;
border: 1px solid #ccc;
background-color: #f1f1f1;
border-radius: 8px 8px 0 0;
}
.tab button {
background: inherit;
float: left;
border: none;
outline: none;
cursor: pointer;
padding: 14px 16px;
transition: 0.3s;
font-size: 17px;
margin: 0;
box-shadow: none;
}
.tab button:hover {
background-color: #ddd;
}
.tab button.active {
background-color: #2196F3;
color: white;
}
.tabcontent {
display: none;
padding: 20px;
border: 1px solid #ccc;
border-top: none;
border-radius: 0 0 8px 8px;
background-color: white;
}
footer {
text-align: center;
margin-top: 40px;
color: #95a5a6;
font-size: 0.9em;
}
</style>
</head>
<body>
<header>
<h1>🏭 WASM企业分析工具套件</h1>
<p class="subtitle">基于WebAssembly的多功能企业数据分析平台</p>
</header>
<div class="container">
<div class="features">
<div class="feature-card">
<span class="feature-icon">📊</span>
<h3 class="feature-title">行业分析</h3>
<p class="feature-desc">基于企业信息的国民经济行业分类</p>
</div>
<div class="feature-card">
<span class="feature-icon">📄</span>
<h3 class="feature-title">Excel解析</h3>
<p class="feature-desc">在浏览器中直接解析Excel文件</p>
</div>
<div class="feature-card">
<span class="feature-icon">🤖</span>
<h3 class="feature-title">AI分析</h3>
<p class="feature-desc">利用大模型进行智能数据分析</p>
</div>
<div class="feature-card">
<span class="feature-icon">💰</span>
<h3 class="feature-title">税务健康</h3>
<p class="feature-desc">企业税务健康状况评估</p>
</div>
</div>
<div class="tab">
<button class="tablinks active" onclick="openTab(event, 'company')">企业行业分析</button>
<button class="tablinks" onclick="openTab(event, 'excel')">Excel解析</button>
<button class="tablinks" onclick="openTab(event, 'llm')">AI分析</button>
<button class="tablinks" onclick="openTab(event, 'tax')">税务健康</button>
</div>
<!-- 企业行业分析标签页 -->
<div id="company" class="tabcontent" style="display: block;">
<div class="section">
<label for="companyName">🔍 请输入企业全称:</label>
<input type="text" id="companyName" placeholder="例如：深圳市致远速联信息技术有限公司" value="深圳市致远速联信息技术有限公司">
<button id="analyzeCompanyBtn" disabled>分析企业行业</button>
</div>
</div>
<!-- Excel解析标签页 -->
<div id="excel" class="tabcontent">
<div class="section">
<label for="excelFile">📁 请选择Excel文件:</label>
<input type="file" id="excelFile" accept=".xlsx,.xls">
<button id="parseExcelBtn" disabled>解析Excel文件</button>
</div>
</div>
<!-- AI分析标签页 -->
<div id="llm" class="tabcontent">
<div class="section">
<label for="llmPrompt">💬 请输入分析提示:</label>
<textarea id="llmPrompt" rows="4" placeholder="请输入您想要分析的内容...">请分析以下企业数据并给出建议</textarea>
<button id="callLLMBtn" disabled>调用AI分析</button>
</div>
</div>
<!-- 税务健康标签页 -->
<div id="tax" class="tabcontent">
<div class="section">
<label for="taxJson">💼 请输入企业JSON数据:</label>
<textarea id="taxJson" rows="6" placeholder='请输入企业数据，例如: {"revenue": 1000000, "expenses": 800000}'>{"revenue": 1000000, "expenses": 800000, "tax_paid": 50000}</textarea>
<button id="callTaxBtn" disabled>评估税务健康</button>
</div>
</div>
<div class="loading" id="loading">
<p>🔄 正在处理请求...请稍候</p>
</div>
<div class="error" id="error"></div>
<div class="result-section" id="resultSection">
<h2>📊 分析结果</h2>
<div id="resultContent"></div>
</div>
</div>
<footer>
<p>Powered by WebAssembly & Go | 企业分析工具套件 v1.0</p>
</footer>
<!-- 加载WASM运行时 -->
<script src="wasm_exec.js"></script>
<script>
const go = new Go();
WebAssembly.instantiateStreaming(fetch("main.wasm"), go.importObject).then((result) => {
go.run(result.instance);
// WASM加载完成后启用所有按钮
document.getElementById('analyzeCompanyBtn').disabled = false;
document.getElementById('parseExcelBtn').disabled = false;
document.getElementById('callLLMBtn').disabled = false;
document.getElementById('callTaxBtn').disabled = false;
console.log('WASM模块加载完成');
}).catch((err) => {
console.error('WASM加载失败:', err);
showError('WASM模块加载失败: ' + err.message);
});
// 获取DOM元素
const analyzeCompanyBtn = document.getElementById('analyzeCompanyBtn');
const parseExcelBtn = document.getElementById('parseExcelBtn');
const callLLMBtn = document.getElementById('callLLMBtn');
const callTaxBtn = document.getElementById('callTaxBtn');
const companyNameInput = document.getElementById('companyName');
const excelFileInput = document.getElementById('excelFile');
const llmPromptInput = document.getElementById('llmPrompt');
const taxJsonInput = document.getElementById('taxJson');
const resultSection = document.getElementById('resultSection');
const resultContent = document.getElementById('resultContent');
const loadingDiv = document.getElementById('loading');
const errorDiv = document.getElementById('error');
// 企业行业分析按钮事件
analyzeCompanyBtn.addEventListener('click', async () => {
const companyName = companyNameInput.value.trim();
if (!companyName) {
showError('请输入企业名称');
return;
}
showLoading(true);
hideError();
resultSection.classList.remove('show');
try {
const result = await window.analyzeCompanyIndustryAsync(companyName);
if (result && result.error) {
showError(result.error);
} else {
displayResults('企业行业分析结果', result);
}
} catch (error) {
showError('分析过程中发生错误: ' + error.message);
} finally {
showLoading(false);
}
});
// Excel解析按钮事件
parseExcelBtn.addEventListener('click', async () => {
const file = excelFileInput.files[0];
if (!file) {
showError('请选择一个Excel文件');
return;
}
showLoading(true);
hideError();
resultSection.classList.remove('show');
try {
// 读取文件为ArrayBuffer
const arrayBuffer = await file.arrayBuffer();
// 调用WASM中的解析函数
const result = await window.parseExcelAsync(arrayBuffer);
if (result && result.error) {
showError(result.error);
} else {
displayResults('Excel解析结果', result);
}
} catch (error) {
showError('解析Excel过程中发生错误: ' + error.message);
} finally {
showLoading(false);
}
});
// AI分析按钮事件
callLLMBtn.addEventListener('click', async () => {
const prompt = llmPromptInput.value.trim();
if (!prompt) {
showError('请输入分析提示');
return;
}
showLoading(true);
hideError();
resultSection.classList.remove('show');
try {
const result = await window.callLLMAsync(prompt);
if (result && result.error) {
showError(result.error);
} else {
displayResults('AI分析结果', result);
}
} catch (error) {
showError('AI分析过程中发生错误: ' + error.message);
} finally {
showLoading(false);
}
});
// 税务健康按钮事件
callTaxBtn.addEventListener('click', async () => {
const jsonData = taxJsonInput.value.trim();
if (!jsonData) {
showError('请输入企业JSON数据');
return;
}
showLoading(true);
hideError();
resultSection.classList.remove('show');
try {
const result = await window.callTaxHealthAsync(jsonData);
if (result && result.error) {
showError(result.error);
} else {
displayResults('税务健康评估结果', result);
}
} catch (error) {
showError('税务健康评估过程中发生错误: ' + error.message);
} finally {
showLoading(false);
}
});
// 显示加载状态
function showLoading(show) {
if (show) {
loadingDiv.classList.add('show');
// 禁用所有按钮以防止重复点击
analyzeCompanyBtn.disabled = true;
parseExcelBtn.disabled = true;
callLLMBtn.disabled = true;
callTaxBtn.disabled = true;
} else {
loadingDiv.classList.remove('show');
// 重新启用按钮（但保持初始状态由WASM加载决定）
// 这里简单地重新启用
setTimeout(() => {
analyzeCompanyBtn.disabled = false;
parseExcelBtn.disabled = false;
callLLMBtn.disabled = false;
callTaxBtn.disabled = false;
}, 100);
}
}
// 显示错误信息
function showError(message) {
errorDiv.textContent = message;
errorDiv.classList.add('show');
}
// 隐藏错误信息
function hideError() {
errorDiv.classList.remove('show');
}
// 显示结果
function displayResults(title, result) {
if (!result) {
showError('未能获取分析结果');
return;
}
let html = `<div class="result-item"><h3>${title}</h3>`;
// 格式化输出结果
html += '<pre>' + JSON.stringify(result, null, 2) + '</pre>';
html += '</div>';
resultContent.innerHTML = html;
resultSection.classList.add('show');
}
// 标签页功能
function openTab(evt, tabName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(tabName).style.display = "block";
evt.currentTarget.className += " active";
}
// 回车键触发当前活动标签页的分析
document.addEventListener('keypress', function(e) {
if (e.key === 'Enter') {
const activeTab = document.querySelector('.tabcontent[style*="block"]');
if (activeTab.id === 'company') {
analyzeCompanyBtn.click();
} else if (activeTab.id === 'llm') {
callLLMBtn.click();
} else if (activeTab.id === 'tax') {
callTaxBtn.click();
}
}
});
</script>
</body>
</html>