Files
core/ui/templates/components/dash_modals.gohtml

126 lines
9.3 KiB
Plaintext
Raw Permalink Normal View History

2026-04-02 10:57:36 -04:00
{{define "dash_modals"}}
<div id="upsellModal" class="modal-overlay" style="display: none;">
<div class="modal-content" style="width: 400px; text-align: center;">
<div style="font-size: 3rem; margin-bottom: 10px;">🚀</div>
<h3 style="margin-top: 0; color: #0f172a;">RiskRancher Pro Required</h3>
<p style="color: #64748b; font-size: 0.95rem; margin-bottom: 20px;">The <strong id="upsellFeatureName">feature</strong> is available in the Pro edition. Scale your operations with automation, advanced RBAC, and branded reports.</p>
<div style="display: flex; gap: 10px; justify-content: center;">
<button class="btn btn-secondary" onclick="document.getElementById('upsellModal').style.display='none'">Close</button>
<a href="https://RiskRancher.com/pro" target="_blank" class="btn" style="background: #8b5cf6; color: white; text-decoration: none;">View Pro Plans</a>
</div>
</div>
</div>
<div id="newTicketModal" class="modal-overlay" style="display: none;">
<div class="modal-content" style="width: 500px; text-align: left;">
<h3 style="margin-top: 0; color: #0f172a; border-bottom: 1px solid #e2e8f0; padding-bottom: 10px;">+ Log Manual Finding</h3>
<div style="margin-bottom: 15px;">
<label style="font-weight: bold; display: block; margin-bottom: 5px; font-size: 0.9rem;">Title:</label>
<input type="text" id="newTicketTitle" placeholder="e.g. Open S3 Bucket found" style="width: 100%; padding: 8px; border: 1px solid #cbd5e1; border-radius: 4px; box-sizing: border-box;">
</div>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 15px;">
<div>
<label style="font-weight: bold; display: block; margin-bottom: 5px; font-size: 0.9rem;">Asset Identifier:</label>
<input type="text" id="newTicketAsset" placeholder="e.g. aws-prod-bucket" style="width: 100%; padding: 8px; border: 1px solid #cbd5e1; border-radius: 4px; box-sizing: border-box;">
</div>
<div>
<label style="font-weight: bold; display: block; margin-bottom: 5px; font-size: 0.9rem;">Severity:</label>
<select id="newTicketSeverity" style="width: 100%; padding: 8px; border: 1px solid #cbd5e1; border-radius: 4px;">
<option value="Critical">Critical</option>
<option value="High" selected>High</option>
<option value="Medium">Medium</option>
<option value="Low">Low</option>
<option value="Info">Info</option>
</select>
</div>
</div>
<div style="margin-bottom: 20px;">
<label style="font-weight: bold; display: block; margin-bottom: 5px; font-size: 0.9rem;">Description (Markdown supported):</label>
<textarea id="newTicketDesc" style="width: 100%; padding: 8px; border: 1px solid #cbd5e1; border-radius: 4px; height: 100px; resize: vertical; box-sizing: border-box;"></textarea>
</div>
<div style="display: flex; justify-content: flex-end; gap: 10px;">
<button class="btn btn-secondary" onclick="document.getElementById('newTicketModal').style.display='none'">Cancel</button>
<button class="btn" style="background: #10b981; color: white; border: none;" onclick="submitNewTicket()">Create Finding</button>
</div>
</div>
</div>
<div id="drawerOverlay" class="drawer-overlay" onclick="closeDrawer()"></div>
<div id="ticketDrawer" class="drawer">
<div class="drawer-header">
<div>
<span id="drawerBadge" class="badge" style="margin-bottom: 8px; display: inline-block;"></span>
<h3 id="drawerTitle" style="margin: 0; color: #0f172a; font-size: 1.25rem;"></h3>
<div id="drawerAsset" style="font-family: monospace; color: #475569; font-size: 0.9rem; margin-top: 8px; background: #e2e8f0; padding: 2px 6px; border-radius: 4px; display: inline-block;"></div>
</div>
<button onclick="closeDrawer()" style="background: none; border: none; font-size: 1.8rem; cursor: pointer; color: #94a3b8;">&times;</button>
</div>
<div class="drawer-body" style="max-height: 75vh; overflow-y: auto; padding-right: 10px;">
<input type="hidden" id="drawerTicketID">
<div id="drawerEvidenceBlock" style="display: none; margin-bottom: 20px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 6px; padding: 15px; border-left: 4px solid #166534;">
<label style="font-weight: bold; color: #14532d; display: block; margin-bottom: 5px;">IT Wrangler Evidence:</label>
<div id="drawerEvidenceText" style="font-family: monospace; font-size: 0.9rem; color: #166534; white-space: pre-wrap; word-break: break-word;"></div>
</div>
<div id="drawerReturnedBlock" style="display: none; margin-bottom: 20px; background: #fef2f2; border: 1px solid #fecaca; border-radius: 6px; padding: 15px; border-left: 4px solid #991b1b;">
<label style="font-weight: bold; color: #7f1d1d; display: block; margin-bottom: 5px;">🔄 Reason for Return:</label>
<div id="drawerReturnedText" style="font-size: 0.9rem; color: #991b1b; white-space: pre-wrap; word-break: break-word;"></div>
</div>
<div style="margin-bottom: 20px;">
<label style="font-weight: bold; color: #334155; display: block; margin-bottom: 5px;">Description (Live Preview):</label>
<div id="drawerDescPreview" style="background: #f8fafc; border: 1px solid #cbd5e1; border-radius: 6px; padding: 15px; font-size: 0.95rem; color: #1e293b; overflow-x: auto;">
</div>
</div>
<div id="drawerEditControls">
<div style="margin-bottom: 20px;">
<label style="font-weight: bold; color: #334155; display: block; margin-bottom: 5px;">Edit Description (Markdown):</label>
<textarea id="drawerDescEdit" onkeyup="updateDrawerPreview()" onchange="updateDrawerPreview()" style="width: 100%; padding: 10px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.9rem; font-family: monospace; resize: vertical; min-height: 120px;"></textarea>
</div>
<div style="margin-bottom: 20px;">
<label style="font-weight: bold; color: #334155; display: block; margin-bottom: 5px;">Edit Recommended Remediation:</label>
<textarea id="drawerRemEdit" style="width: 100%; padding: 10px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.9rem; resize: vertical; min-height: 80px;"></textarea>
</div>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 15px; margin-bottom: 20px;">
<div>
<label style="font-weight: bold; color: #334155; display: block; margin-bottom: 5px;">Adjust Severity:</label>
<select id="drawerSeverity" style="width: 100%; padding: 10px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.95rem;">
<option value="Critical">Critical</option>
<option value="High">High</option>
<option value="Medium">Medium</option>
<option value="Low">Low</option>
<option value="Info">Info</option>
</select>
</div>
<div>
<label style="font-weight: bold; color: #334155; display: block; margin-bottom: 5px;">Assign to IT (Email):</label>
<input type="text" id="drawerAssignee" placeholder="e.g. sysadmin@company.com" style="width: 100%; padding: 10px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.95rem; box-sizing: border-box;">
</div>
</div>
<div style="background: #eff6ff; padding: 15px; border-radius: 6px; border-left: 4px solid #3b82f6;">
<label style="font-weight: bold; color: #1e3a8a; display: block; margin-bottom: 5px;">Audit Trail Comment (Required if altering):</label>
<input type="text" id="drawerComment" style="width: 100%; padding: 10px; border: 1px solid #bfdbfe; border-radius: 6px; box-sizing: border-box; font-size: 0.95rem;" placeholder="e.g., Updated remediation steps and severity...">
</div>
</div>
</div>
<div class="drawer-footer" style="display: flex; justify-content: space-between; width: 100%;">
<button class="btn btn-secondary" onclick="closeDrawer()">Discard</button>
<div id="drawerStandardActions" style="display: flex; gap: 10px;">
<button class="btn btn-secondary" style="color: #ea580c; border-color: #fdba74; background: #fffbeb;" onclick="markFalsePositive()">🚫 Mark False Positive</button>
<button class="btn" id="drawerSubmitBtn" style="background: #2563eb; color: white;">Save & Dispatch</button>
</div>
</div>
</div>
{{end}}