mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-22 13:42:12 -03:00
94 lines
3.9 KiB
HTML
94 lines
3.9 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>LoRA Management</title>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="stylesheet" href="/loras_static/css/style.css">
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" crossorigin="anonymous" referrerpolicy="no-referrer">
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/loras_static/images/favicon-32x32.png">
|
|
<link rel="icon" type="image/png" sizes="16x16" href="/loras_static/images/favicon-16x16.png">
|
|
<link rel="manifest" href="/loras_static/images/site.webmanifest">
|
|
|
|
<!-- 预加载关键资源 -->
|
|
<link rel="preload" href="/loras_static/css/style.css" as="style">
|
|
<link rel="preload" href="/loras_static/js/script.js" as="script">
|
|
|
|
<!-- 优化字体加载 -->
|
|
<link rel="preload" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/webfonts/fa-solid-900.woff2" as="font" type="font/woff2" crossorigin>
|
|
|
|
<!-- 添加性能监控 -->
|
|
<script>
|
|
performance.mark('page-start');
|
|
window.addEventListener('load', () => {
|
|
performance.mark('page-end');
|
|
performance.measure('page-load', 'page-start', 'page-end');
|
|
});
|
|
</script>
|
|
|
|
<!-- 添加安全相关的 meta 标签 -->
|
|
<meta http-equiv="Cross-Origin-Opener-Policy" content="same-origin">
|
|
<meta http-equiv="Cross-Origin-Embedder-Policy" content="require-corp">
|
|
|
|
<!-- 添加资源加载策略 -->
|
|
<link rel="preconnect" href="https://civitai.com">
|
|
<link rel="preconnect" href="https://cdnjs.cloudflare.com">
|
|
</head>
|
|
<body>
|
|
<div class="theme-toggle" onclick="toggleTheme()">
|
|
<img src="/loras_static/images/theme-toggle.svg" alt="Theme">
|
|
</div>
|
|
|
|
<!-- Model details Modal -->
|
|
<div id="loraModal" class="modal"></div>
|
|
|
|
<div id="loading-overlay" class="loading-overlay" style="display: none;">
|
|
<div class="loading-content">
|
|
<div class="loading-spinner"></div>
|
|
<div class="loading-status">Scanning Loras...</div>
|
|
<div class="progress-container">
|
|
<div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Delete Confirmation Modal -->
|
|
<div id="deleteModal" class="modal delete-modal">
|
|
<div class="modal-content delete-modal-content">
|
|
<h2>Delete Model</h2>
|
|
<p class="delete-message">Are you sure you want to delete this model and all associated files?</p>
|
|
<div class="delete-model-info"></div>
|
|
<div class="modal-actions">
|
|
<button class="cancel-btn" onclick="closeDeleteModal()">Cancel</button>
|
|
<button class="delete-btn" onclick="confirmDelete()">Delete</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<!-- 控制栏 -->
|
|
<div class="controls">
|
|
<div class="folder-tags">
|
|
{% for folder in folders %}
|
|
<div class="tag" data-folder="{{ folder }}">{{ folder }}</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
<div class="actions">
|
|
<select id="sortSelect">
|
|
<option value="name">Name</option>
|
|
<option value="date">Date</option>
|
|
</select>
|
|
<button onclick="refreshLoras()"><i class="fas fa-sync"></i> Refresh</button>
|
|
<button onclick="fetchCivitai()" class="secondary"><i class="fas fa-download"></i> Fetch</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Lora卡片容器 -->
|
|
<div class="card-grid" id="loraGrid">
|
|
<!-- Cards will be dynamically inserted here -->
|
|
</div>
|
|
</div>
|
|
|
|
<script src="/loras_static/js/script.js" defer></script>
|
|
</body>
|
|
</html> |