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

checkpoint

Browse Source
This commit is contained in:
Will Miao
2025-03-14 16:37:52 +08:00
parent b77df8f89f
commit 426e84cfa3
9 changed files with 1591 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

107
templates/components/import_modal.html Normal file
View File

@@ -0,0 +1,107 @@
<div id="importModal" class="modal">
<div class="modal-content">
<div class="modal-header">
<h2>Import Recipe</h2>
<span class="close-modal" onclick="modalManager.closeModal('importModal')">&times;</span>
</div>
<div class="modal-body">
<!-- Step 1: Upload Image -->
<div id="uploadStep" class="import-step">
<p>Upload an image with LoRA metadata to import as a recipe.</p>
<div class="file-input-wrapper">
<input type="file" id="recipeImageUpload" accept="image/*" onchange="importManager.handleImageUpload(event)">
<div class="file-input-button">
<i class="fas fa-upload"></i> Select Image
</div>
</div>
<div id="uploadError" class="error-message"></div>
<div class="modal-actions">
<button class="secondary-btn" onclick="modalManager.closeModal('importModal')">Cancel</button>
</div>
</div>
<!-- Step 2: Recipe Details -->
<div id="detailsStep" class="import-step" style="display: none;">
<div class="recipe-details-layout">
<div class="recipe-image-container">
<div id="recipeImagePreview" class="recipe-image"></div>
</div>
<div class="recipe-form-container">
<div class="recipe-name-container">
<label for="recipeName">Recipe Name</label>
<input type="text" id="recipeName" placeholder="Enter recipe name"
onchange="importManager.handleRecipeNameChange(event)">
</div>
<div class="tags-section">
<label>Tags (optional)</label>
<div class="tag-input-container">
<input type="text" id="tagInput" placeholder="Add a tag">
<button class="secondary-btn" onclick="importManager.addTag()">
<i class="fas fa-plus"></i> Add
</button>
</div>
<div id="tagsContainer" class="tags-container">
<div class="empty-tags">No tags added</div>
</div>
</div>
</div>
</div>
<div class="loras-section">
<label>LoRAs in this Recipe <span id="loraCountInfo" class="lora-count-info">(0/0 in library)</span></label>
<div id="lorasList" class="loras-list">
<!-- LoRAs will be populated here -->
</div>
</div>
<div class="modal-actions">
<button class="secondary-btn" onclick="importManager.backToUpload()">Back</button>
<button class="primary-btn" onclick="importManager.proceedFromDetails()">Next</button>
</div>
</div>
<!-- Step 3: Download Location (if needed) -->
<div id="locationStep" class="import-step" style="display: none;">
<p>The following LoRAs are not in your library and need to be downloaded:</p>
<div id="missingLorasList" class="missing-loras-list">
<!-- Missing LoRAs will be populated here -->
</div>
<div class="input-group">
<label for="importLoraRoot">Select LoRA Root Directory</label>
<select id="importLoraRoot">
<!-- LoRA roots will be populated here -->
</select>
</div>
<div class="input-group">
<label>Select Folder (optional)</label>
<div id="importFolderBrowser" class="folder-browser">
<!-- Folders will be populated here -->
</div>
</div>
<div class="input-group">
<label for="importNewFolder">Create New Folder (optional)</label>
<input type="text" id="importNewFolder" placeholder="Enter folder name">
</div>
<div class="path-preview">
<label>Download Location:</label>
<div id="importTargetPathDisplay" class="path-display"></div>
</div>
<div class="modal-actions">
<button class="secondary-btn" onclick="importManager.backToDetails()">Back</button>
<button class="primary-btn" onclick="importManager.saveRecipe()">Download & Save Recipe</button>
</div>
</div>
</div>
</div>
</div>