2026-05-10 13:12:44 +08:00

63 lines
2.1 KiB
JavaScript

document.addEventListener('DOMContentLoaded', function() {
// 文件夹切换
const folders = document.querySelectorAll('.folder');
folders.forEach(folder => {
folder.addEventListener('click', function() {
folders.forEach(f => f.classList.remove('active'));
this.classList.add('active');
});
});
// 文件选中
const fileItems = document.querySelectorAll('.file-item');
fileItems.forEach(item => {
item.addEventListener('click', function(e) {
if (e.target.type === 'checkbox' || e.target.closest('.icon-btn')) return;
this.classList.toggle('selected');
const cb = this.querySelector('input[type="checkbox"]');
if (cb) cb.checked = !cb.checked;
updateCount();
});
});
// 上传区域显隐
var uploadBtn = document.getElementById('uploadBtn');
var uploadZone = document.getElementById('uploadZone');
if (uploadBtn && uploadZone) {
uploadBtn.addEventListener('click', function() {
uploadZone.classList.toggle('visible');
});
}
// 拖拽效果
if (uploadZone) {
document.addEventListener('dragover', function(e) {
e.preventDefault();
uploadZone.classList.add('visible');
uploadZone.classList.add('dragover');
});
document.addEventListener('dragleave', function(e) {
if (!e.relatedTarget) uploadZone.classList.remove('dragover');
});
document.addEventListener('drop', function(e) {
e.preventDefault();
uploadZone.classList.remove('dragover');
});
}
// 选中计数
function updateCount() {
var n = document.querySelectorAll('.file-item.selected').length;
var el = document.getElementById('selectedCount');
if (el) el.textContent = '已选择 ' + n + ' 项';
}
// 存储条动画
setTimeout(function() {
var fill = document.querySelector('.storage-fill');
if (fill) fill.style.width = fill.style.width;
}, 500);
console.log('✅ HoloLake 网站云盘系统已加载');
});