Files
ComfyUI-Lora-Manager/templates/components/modals.html
2025-02-10 23:40:38 +08:00

70 lines
3.0 KiB
HTML

<!-- 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>
<!-- Download from URL Modal -->
<div id="downloadModal" class="modal">
<div class="modal-content">
<button class="close" onclick="modalManager.closeModal('downloadModal')">&times;</button>
<h2>Download LoRA from URL</h2>
<!-- Step 1: URL Input -->
<div class="download-step" id="urlStep">
<div class="input-group">
<label for="loraUrl">Civitai URL:</label>
<input type="text" id="loraUrl" placeholder="https://civitai.com/models/..." />
<div class="error-message" id="urlError"></div>
</div>
<div class="modal-actions">
<button class="primary-btn" onclick="downloadManager.validateAndFetchVersions()">Next</button>
</div>
</div>
<!-- Step 2: Version Selection -->
<div class="download-step" id="versionStep" style="display: none;">
<div class="version-list" id="versionList">
<!-- Versions will be inserted here -->
</div>
<div class="modal-actions">
<button class="secondary-btn" onclick="downloadManager.backToUrl()">Back</button>
<button class="primary-btn" onclick="downloadManager.proceedToLocation()">Next</button>
</div>
</div>
<!-- Step 3: Location Selection -->
<div class="download-step" id="locationStep" style="display: none;">
<div class="location-selection">
<div class="input-group">
<label>Select LoRA Root:</label>
<select id="loraRoot"></select>
</div>
<div class="input-group">
<label>Target Folder:</label>
<div class="folder-browser" id="folderBrowser">
<!-- Folder structure will be inserted here -->
</div>
</div>
<div class="input-group">
<label for="newFolder">New Folder (optional):</label>
<input type="text" id="newFolder" placeholder="Enter folder name" />
</div>
</div>
<div class="modal-actions">
<button class="secondary-btn" onclick="downloadManager.backToVersions()">Back</button>
<button class="primary-btn" onclick="downloadManager.startDownload()">Download</button>
</div>
</div>
</div>
</div>