alphard/ComfyUI-Lora-Manager
1
0
Fork 0
mirror of https://github.com/willmiao/ComfyUI-Lora-Manager.git synced 2026-03-24 22:52:12 -03:00
Code Issues Packages Projects Releases Wiki Activity

Refactor LoRA template with modular components and script updates

Browse Source
This commit is contained in:
Will Miao
2025-02-04 12:20:56 +08:00
parent 5ed037b219
commit 9489a1989a
14 changed files with 898 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
templates/components/controls.html Normal file
View File

@@ -0,0 +1,16 @@
<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>

9
templates/components/loading.html Normal file
View File

@@ -0,0 +1,9 @@
<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>

15
templates/components/modals.html Normal file
View File

@@ -0,0 +1,15 @@
<!-- Model details Modal -->
<div id="loraModal" class="modal"></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>

51
templates/loras.html
View File

@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html>
<head>
<title>LoRA Management</title>
<title>LoRA Manager</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">
@@ -11,7 +11,7 @@
<!-- 预加载关键资源 -->
<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="/loras_static/js/main.js" as="script" crossorigin="anonymous">
<!-- 优化字体加载 -->
<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>
@@ -38,50 +38,11 @@
<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>
{% include 'components/modals.html' %}
{% include 'components/loading.html' %}
<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>
{% include 'components/controls.html' %}
<!-- Lora卡片容器 -->
<div class="card-grid" id="loraGrid">
@@ -89,6 +50,6 @@
</div>
</div>
<script src="/loras_static/js/script.js" defer></script>
<script type="module" src="/loras_static/js/main.js"></script>
</body>
</html>