107 lines
5.0 KiB
JavaScript
107 lines
5.0 KiB
JavaScript
/* =============================================
|
|
settings.js — 设置页面
|
|
============================================= */
|
|
|
|
function renderSettings() {
|
|
const page = document.getElementById('page-settings');
|
|
page.innerHTML = `
|
|
<div class="settings-wrap">
|
|
|
|
<!-- 顶部标题 —— 白色底，和美化库Tab栏一致 -->
|
|
<div class="settings-header">
|
|
<div class="settings-header-icon">
|
|
<svg viewBox="0 0 24 24" width="20" height="20"><path fill="#1677ff" d="M12 15.5A3.5 3.5 0 0 1 8.5 12 3.5 3.5 0 0 1 12 8.5a3.5 3.5 0 0 1 3.5 3.5 3.5 3.5 0 0 1-3.5 3.5m7.43-2.92c.04-.34.07-.68.07-1.08s-.03-.75-.07-1.08l2.37-1.84c.21-.17.27-.46.14-.7l-2.24-3.88c-.14-.24-.42-.32-.67-.24l-2.79 1.12c-.58-.44-1.21-.82-1.9-1.1L14 2.42c-.05-.27-.28-.42-.54-.42h-4.46c-.26 0-.49.15-.54.42L8.08 5.18C7.39 5.46 6.76 5.84 6.18 6.28L3.39 5.16c-.25-.08-.53 0-.67.24L.48 9.28c-.13.24-.07.53.14.7l2.37 1.84C2.95 12.25 2.92 12.59 2.92 13s.03.75.07 1.08L.62 15.92c-.21.17-.27.46-.14.7l2.24 3.88c.14.24.42.32.67.24l2.79-1.12c.58.44 1.21.82 1.9 1.1l.46 2.76c.05.27.28.42.54.42h4.46c.26 0 .49-.15.54-.42l.46-2.76c.69-.28 1.32-.66 1.9-1.1l2.79 1.12c.25.08.53 0 .67-.24l2.24-3.88c.13-.24.07-.53-.14-.7l-2.37-1.84z"/></svg>
|
|
</div>
|
|
<div>
|
|
<div class="settings-header-title">设置</div>
|
|
<div class="settings-header-sub">工具配置与换肤管理</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="settings-body">
|
|
|
|
<!-- 清理残留 + 换肤输入框 -->
|
|
<div class="settings-section">
|
|
<div class="settings-section-title">
|
|
<span class="settings-section-icon" style="background:#fff0f0;">
|
|
<svg viewBox="0 0 24 24" width="16" height="16"><path fill="#ff4d4f" d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/></svg>
|
|
</span>
|
|
清理管理
|
|
</div>
|
|
<div class="settings-clean-card">
|
|
<div class="settings-clean-info">
|
|
<div class="settings-clean-title">🧹 清理换肤残留文件</div>
|
|
<div class="settings-clean-desc">清除游戏目录中残留的换肤补丁文件，恢复游戏原始状态，解决因残留文件导致的异常问题。</div>
|
|
<div class="settings-clean-tags">
|
|
<span class="settings-tag tag-warn">⚠ 清理后需重新应用换肤</span>
|
|
<span class="settings-tag tag-safe">✓ 不影响游戏数据</span>
|
|
</div>
|
|
</div>
|
|
<button class="settings-clean-btn" onclick="doCleanResidual()">
|
|
<svg viewBox="0 0 24 24" width="16" height="16"><path fill="currentColor" d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/></svg>
|
|
清理残留
|
|
</button>
|
|
</div>
|
|
<!-- 分隔线 -->
|
|
<div class="settings-divider"></div>
|
|
<!-- 两个互斥复选框 + 提示 -->
|
|
<div class="settings-checks-group">
|
|
<label class="settings-check-label" onclick="toggleSkinCheck('cn')">
|
|
<span class="settings-check-box" id="cnCheckBox"></span>
|
|
<span class="settings-check-text">国服换肤</span>
|
|
</label>
|
|
<label class="settings-check-label" onclick="toggleSkinCheck('all')">
|
|
<span class="settings-check-box" id="allCheckBox"></span>
|
|
<span class="settings-check-text">全服换肤</span>
|
|
</label>
|
|
<span class="settings-check-tip">
|
|
⚠ 国际服只能使用换肤和美化功能，无限视距以及血液补丁不能用
|
|
</span>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
`;
|
|
// 同步默认勾选状态
|
|
const cnBox = document.getElementById('cnCheckBox');
|
|
const allBox = document.getElementById('allCheckBox');
|
|
if (cnBox) cnBox.classList.toggle('checked', _skinCheckVal === 'cn');
|
|
if (allBox) allBox.classList.toggle('checked', _skinCheckVal === 'all');
|
|
// 页面渲染后主动通知后端当前默认值
|
|
API.get('setSkinType', { type: _skinCheckVal || '' });
|
|
}
|
|
|
|
// 当前选中的换肤类型：'cn' | 'all' | null，默认国服
|
|
let _skinCheckVal = 'cn';
|
|
|
|
// 页面加载完成后通知后端默认值（延迟确保后端已启动）
|
|
setTimeout(() => {
|
|
API.get('setSkinType', { type: _skinCheckVal || '' }).catch(() => {});
|
|
}, 500);
|
|
|
|
function toggleSkinCheck(type) {
|
|
_skinCheckVal = (_skinCheckVal === type) ? null : type;
|
|
const cnBox = document.getElementById('cnCheckBox');
|
|
const allBox = document.getElementById('allCheckBox');
|
|
if (!cnBox || !allBox) return;
|
|
cnBox.classList.toggle('checked', _skinCheckVal === 'cn');
|
|
allBox.classList.toggle('checked', _skinCheckVal === 'all');
|
|
// 通知后端
|
|
API.get('setSkinType', { type: _skinCheckVal || '' });
|
|
}
|
|
|
|
async function doCleanResidual() {
|
|
showLoadingToast('正在清理残留文件...');
|
|
try {
|
|
await API.get('cleanResidual');
|
|
hideLoadingToast();
|
|
showToast('✓ 残留文件已清理完成', 'ok');
|
|
} catch(e) {
|
|
hideLoadingToast();
|
|
showToast('清理失败，请检查权限', 'err');
|
|
}
|
|
}
|
|
|
|
|