214 lines
11 KiB
HTML
214 lines
11 KiB
HTML
<div style="margin-bottom: 0.5rem;">
|
|
<div class="tags has-addons" style="display: inline-flex; margin-bottom: 0.4rem;">
|
|
<span class="tag is-dark">
|
|
<i class="fa-solid fa-wand-magic-sparkles" aria-hidden="true"></i>
|
|
</span>
|
|
<span class="tag is-white" style="border: 1px solid rgba(0, 0, 0, 0.2);">
|
|
AI {{ operation_label }}
|
|
</span>
|
|
</div>
|
|
|
|
{% if error %}
|
|
<div class="notification is-danger is-light" style="padding: 0.6rem;">
|
|
{{ result_text }}
|
|
</div>
|
|
{% else %}
|
|
{% if operation == "artifacts" %}
|
|
{% if latest_plan %}
|
|
{% include "partials/ai-workspace-mitigation-panel.html" with person=person plan=latest_plan rules=latest_plan_rules games=latest_plan_games corrections=latest_plan_corrections fundamentals_text=latest_plan.fundamental_items|join:"\n" mitigation_messages=latest_plan_messages latest_export=latest_plan_export notice_message=mitigation_notice_message notice_level=mitigation_notice_level auto_settings=latest_auto_settings active_tab="plan_board" %}
|
|
{% else %}
|
|
<div id="mitigation-shell-{{ person.id }}" class="box" style="padding: 0.65rem; margin-top: 0.2rem; border: 1px dashed rgba(0, 0, 0, 0.25); box-shadow: none;">
|
|
<p class="is-size-7 has-text-grey">No mitigation plan yet. Use the Patterns tab to generate one.</p>
|
|
</div>
|
|
{% endif %}
|
|
{% elif operation == "draft_reply" and draft_replies %}
|
|
<div id="draft-host-{{ person.id }}-{{ operation }}" data-selected="0">
|
|
<div class="columns is-multiline" style="margin: 0 -0.35rem;">
|
|
{% for option in draft_replies %}
|
|
<div class="column is-12-mobile is-4-tablet" style="padding: 0.35rem;">
|
|
<article
|
|
class="draft-option-card {% if forloop.first %}is-selected{% endif %}"
|
|
data-index="{{ forloop.counter0 }}"
|
|
onclick="giaWorkspaceUseDraft('{{ person.id }}', '{{ operation }}', {{ forloop.counter0 }}); return false;"
|
|
style="height: 100%; padding: 0.6rem; border-radius: 9px; border: 1px solid rgba(0, 0, 0, 0.16); background: #fff; cursor: pointer; transition: border-color 120ms ease, box-shadow 120ms ease, background-color 120ms ease;">
|
|
<p class="is-size-7 has-text-weight-semibold is-flex is-align-items-center" style="margin-bottom: 0.35rem; gap: 0.35rem;">
|
|
{% with tone=option.label|default:""|lower %}
|
|
{% if tone == "soft" %}
|
|
<span class="icon is-small has-text-success"><i class="fa-solid fa-leaf"></i></span>
|
|
{% elif tone == "neutral" %}
|
|
<span class="icon is-small has-text-info"><i class="fa-solid fa-scale-balanced"></i></span>
|
|
{% elif tone == "firm" %}
|
|
<span class="icon is-small has-text-danger"><i class="fa-solid fa-shield-heart"></i></span>
|
|
{% else %}
|
|
<span class="icon is-small has-text-grey"><i class="fa-solid fa-comment-dots"></i></span>
|
|
{% endif %}
|
|
{% endwith %}
|
|
<span>{{ option.label|default:"Option" }}</span>
|
|
</p>
|
|
<p class="draft-text" style="white-space: pre-wrap; margin-bottom: 0;">{{ option.text }}</p>
|
|
</article>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
|
|
<div id="draft-send-shell-{{ person.id }}-{{ operation }}" style="margin-top: 0.5rem; padding: 0.6rem; border: 1px solid rgba(0, 0, 0, 0.16); border-radius: 8px;">
|
|
<form
|
|
hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
|
|
hx-post="{% url 'ai_workspace_send' type='widget' person_id=person.id %}"
|
|
hx-target="#draft-send-status-{{ person.id }}-{{ operation }}"
|
|
hx-swap="innerHTML">
|
|
<input type="hidden" id="draft-send-input-{{ person.id }}-{{ operation }}" name="draft_text" value="">
|
|
<input type="hidden" id="draft-send-force-{{ person.id }}-{{ operation }}" name="force_send" value="0">
|
|
<div class="field">
|
|
<label class="label is-small">Draft Preview</label>
|
|
<div class="control">
|
|
<textarea id="draft-send-preview-{{ person.id }}-{{ operation }}" class="textarea is-small" rows="4" readonly></textarea>
|
|
</div>
|
|
</div>
|
|
<div class="field" style="margin-bottom: 0.4rem;">
|
|
<div class="control buttons are-small" style="margin: 0; gap: 0.35rem;">
|
|
<button id="draft-send-btn-{{ person.id }}-{{ operation }}" class="button is-small is-link" {% if not send_state.can_send %}disabled{% endif %}>
|
|
Send Draft
|
|
</button>
|
|
<button
|
|
type="button"
|
|
class="button is-small is-info is-light"
|
|
onclick="giaWorkspaceQueueSelectedDraft('{{ person.id }}'); return false;">
|
|
<span class="icon is-small"><i class="fa-solid fa-inbox-in"></i></span>
|
|
<span>Add To Queue</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div id="draft-send-status-{{ person.id }}-{{ operation }}"></div>
|
|
</form>
|
|
</div>
|
|
{% else %}
|
|
{% if operation == "extract_patterns" %}
|
|
<div class="columns is-multiline" style="margin: 0 -0.35rem;">
|
|
{% for section in result_sections %}
|
|
<div class="column is-12-mobile is-6-tablet" style="padding: 0.35rem;">
|
|
<article class="box ai-section-box" style="height: 100%; padding: 0.65rem; margin-bottom: 0; border: 1px solid rgba(0, 0, 0, 0.14); box-shadow: none;">
|
|
{% if section.level <= 2 %}
|
|
<h3 class="title is-6" style="margin-bottom: 0.45rem;">{{ section.title }}</h3>
|
|
{% elif section.level == 3 %}
|
|
<h4 class="title is-6" style="margin-bottom: 0.45rem;">{{ section.title }}</h4>
|
|
{% else %}
|
|
<h5 class="subtitle is-7 has-text-weight-semibold" style="margin-bottom: 0.45rem;">{{ section.title }}</h5>
|
|
{% endif %}
|
|
|
|
{% for block in section.blocks %}
|
|
{% if block.type == "ul" %}
|
|
<ul style="margin: 0 0 0.45rem 1.15rem;">
|
|
{% for item in block.items %}
|
|
<li style="margin-bottom: 0.25rem;">{{ item }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
{% for item in block.items %}
|
|
<p style="margin-bottom: 0.45rem; white-space: pre-wrap;">{{ item }}</p>
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
</article>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<div class="ai-section-stack">
|
|
{% for section in result_sections %}
|
|
<article class="box ai-section-box" style="padding: 0.65rem; margin-bottom: 0.5rem; border: 1px solid rgba(0, 0, 0, 0.14); box-shadow: none;">
|
|
{% if section.level <= 2 %}
|
|
<h3 class="title is-6" style="margin-bottom: 0.45rem;">{{ section.title }}</h3>
|
|
{% elif section.level == 3 %}
|
|
<h4 class="title is-6" style="margin-bottom: 0.45rem;">{{ section.title }}</h4>
|
|
{% else %}
|
|
<h5 class="subtitle is-7 has-text-weight-semibold" style="margin-bottom: 0.45rem;">{{ section.title }}</h5>
|
|
{% endif %}
|
|
|
|
{% for block in section.blocks %}
|
|
{% if block.type == "ul" %}
|
|
<ul style="margin: 0 0 0.45rem 1.15rem;">
|
|
{% for item in block.items %}
|
|
<li style="margin-bottom: 0.25rem;">{{ item }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
{% for item in block.items %}
|
|
<p style="margin-bottom: 0.45rem; white-space: pre-wrap;">{{ item }}</p>
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% endfor %}
|
|
</article>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
|
|
{% if operation == "extract_patterns" %}
|
|
<article class="box" style="padding: 0.7rem; margin-top: 0.65rem; border: 1px solid rgba(0, 0, 0, 0.14); box-shadow: none;">
|
|
<p class="is-size-7 has-text-weight-semibold" style="margin-bottom: 0.4rem;">Create Framework / Rules / Games</p>
|
|
<form
|
|
hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
|
|
hx-post="{% url 'ai_workspace_mitigation_create' type='widget' person_id=person.id %}"
|
|
hx-target="#mitigation-shell-{{ person.id }}"
|
|
hx-swap="outerHTML"
|
|
hx-indicator="#mitigation-create-loading-{{ person.id }}"
|
|
style="margin-bottom: 0;">
|
|
<input type="hidden" name="ai_result_id" value="{{ ai_result_id|default:'' }}">
|
|
<textarea name="source_text" style="display: none;">{{ result_text }}</textarea>
|
|
|
|
<div class="columns is-multiline" style="margin: 0 -0.3rem;">
|
|
<div class="column is-12-mobile is-6-tablet" style="padding: 0.3rem;">
|
|
<label class="label is-small" style="margin-bottom: 0.25rem;">Output</label>
|
|
<div class="select is-fullwidth is-small">
|
|
<select name="output_profile" required>
|
|
<option value="" selected disabled>Choose one</option>
|
|
<option value="framework">Framework (balanced)</option>
|
|
<option value="rule">Rule (minimal + strict)</option>
|
|
<option value="game">Game (engaging)</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="column is-12-mobile is-6-tablet" style="padding: 0.3rem;">
|
|
<label class="label is-small" style="margin-bottom: 0.25rem;">Context (single freeform input)</label>
|
|
<textarea class="textarea is-small" rows="2" name="user_context" placeholder="Optional context or constraints"></textarea>
|
|
</div>
|
|
</div>
|
|
|
|
<button class="button is-small is-primary is-light">
|
|
<span class="icon is-small"><i class="fa-solid fa-chess-board"></i></span>
|
|
<span>Create Mitigation Plan</span>
|
|
</button>
|
|
<span id="mitigation-create-loading-{{ person.id }}" class="tag is-info is-light htmx-indicator" style="margin-left: 0.45rem;">
|
|
<span class="icon is-small"><i class="fa-solid fa-spinner fa-spin"></i></span>
|
|
<span>Building mitigation plan...</span>
|
|
</span>
|
|
</form>
|
|
</article>
|
|
|
|
<div id="mitigation-shell-{{ person.id }}" class="box" style="padding: 0.65rem; margin-top: 0.65rem; border: 1px dashed rgba(0, 0, 0, 0.25); box-shadow: none;">
|
|
<p class="is-size-7 has-text-grey">
|
|
Plan editing is consolidated in the <strong>Plan</strong> tab.
|
|
</p>
|
|
</div>
|
|
{% endif %}
|
|
{% endif %}
|
|
</div>
|
|
|
|
<style>
|
|
.draft-option-card.is-selected {
|
|
border-color: rgba(54, 54, 54, 0.85) !important;
|
|
border-width: 2px !important;
|
|
box-shadow: inset 0 0 0 1px rgba(54, 54, 54, 0.18);
|
|
background-color: rgba(54, 54, 54, 0.06) !important;
|
|
}
|
|
.htmx-indicator {
|
|
display: none;
|
|
}
|
|
.htmx-request.htmx-indicator {
|
|
display: inline-flex;
|
|
}
|
|
</style>
|