feat: admin panel enrichment
This commit is contained in:
mohamad
@@ -0,0 +1,150 @@
|
||||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
|
||||
{% block title %}{{ form_title }}{% endblock %}
|
||||
|
||||
{% block extra_css %}
|
||||
<link rel="stylesheet" href="{% static 'css/brief-wizard.css' %}" />
|
||||
{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<section class="page-hero" aria-labelledby="brief-form-heading">
|
||||
<div class="container">
|
||||
<div class="page-hero-content">
|
||||
<h1 class="page-hero-title" id="brief-form-heading">{{ form_title }}</h1>
|
||||
<p class="page-hero-subtitle">Complete each step to submit your project brief.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="section">
|
||||
<div class="container container--narrow">
|
||||
<div class="glass-card portal-card fade-in">
|
||||
<form method="post" enctype="multipart/form-data" novalidate class="brief-wizard" data-brief-wizard data-initial-step="{{ initial_step }}">
|
||||
{% csrf_token %}
|
||||
|
||||
<div class="wizard-progress" aria-hidden="true">
|
||||
<div class="wizard-progress-track">
|
||||
<div class="wizard-progress-fill" data-wizard-progress-fill></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ol class="wizard-stepper" role="list">
|
||||
{% for step in wizard_steps %}
|
||||
<li class="wizard-stepper-item{% if forloop.first %} is-active{% endif %}" data-wizard-step-indicator="{{ forloop.counter }}">
|
||||
<span class="wizard-stepper-number">{{ forloop.counter }}</span>
|
||||
<span class="wizard-stepper-label">{{ step.title }}</span>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ol>
|
||||
|
||||
{% for step in wizard_steps %}
|
||||
<section
|
||||
class="wizard-panel{% if forloop.first %} is-active{% endif %}"
|
||||
data-wizard-panel="{{ forloop.counter }}"
|
||||
data-step-fields="{{ step.fields|join:',' }}"
|
||||
aria-labelledby="wizard-step-title-{{ forloop.counter }}"
|
||||
{% if not forloop.first %}hidden{% endif %}
|
||||
>
|
||||
<header class="wizard-panel-header">
|
||||
<p class="wizard-panel-eyebrow">Step {{ forloop.counter }} of {{ wizard_steps|length }}</p>
|
||||
<h2 class="wizard-panel-title" id="wizard-step-title-{{ forloop.counter }}">{{ step.title }}</h2>
|
||||
<p class="wizard-panel-subtitle">{{ step.subtitle }}</p>
|
||||
</header>
|
||||
|
||||
{% if step.id == "basics" %}
|
||||
<div class="form-group">
|
||||
<label for="id_title">Project title <span class="required-star">*</span></label>
|
||||
{{ form.title }}
|
||||
{{ form.title.errors }}
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="id_category">Category</label>
|
||||
{{ form.category }}
|
||||
{{ form.category.errors }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if step.id == "scope" %}
|
||||
<div class="form-group">
|
||||
<label for="id_description">Description & goals</label>
|
||||
{{ form.description }}
|
||||
<p class="form-hint">Describe the project scope, context, and the outcomes you expect.</p>
|
||||
{{ form.description.errors }}
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if step.id == "timeline" %}
|
||||
<div class="form-grid form-grid--2">
|
||||
<div class="form-group">
|
||||
<label for="id_budget_range">Budget range</label>
|
||||
{{ form.budget_range }}
|
||||
{{ form.budget_range.errors }}
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="id_desired_deadline">Desired deadline</label>
|
||||
{{ form.desired_deadline }}
|
||||
{{ form.desired_deadline.errors }}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if step.id == "references" %}
|
||||
<div class="form-group">
|
||||
<label for="id_reference_links">Reference links</label>
|
||||
{{ form.reference_links }}
|
||||
<p class="form-hint">One URL per line — docs, mockups, repos, etc.</p>
|
||||
{{ form.reference_links.errors }}
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="id_attachments">Attachments</label>
|
||||
<input type="file" name="attachments" id="id_attachments" multiple
|
||||
accept=".png,.jpg,.jpeg,.gif,.webp,.bmp,.zip,.log,.txt"
|
||||
class="file-input"
|
||||
{% if brief and brief.attachments_locked %}disabled{% endif %} />
|
||||
<p class="form-hint">Images, ZIP, or log/text files — up to 3 files, 10 MB each.</p>
|
||||
{{ form.attachments.errors }}
|
||||
</div>
|
||||
|
||||
{% if brief and brief.attachments.exists %}
|
||||
<div class="portal-attachment-list">
|
||||
<p class="form-hint">Existing attachments:</p>
|
||||
<ul>
|
||||
{% for attachment in brief.attachments.all %}
|
||||
<li>{{ attachment.original_filename }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
<div class="wizard-review" data-wizard-review hidden>
|
||||
<h3 class="wizard-review-title">Review your brief</h3>
|
||||
<dl class="wizard-review-list">
|
||||
<div><dt>Title</dt><dd data-review-field="title">—</dd></div>
|
||||
<div><dt>Category</dt><dd data-review-field="category">—</dd></div>
|
||||
<div><dt>Description & goals</dt><dd data-review-field="description">—</dd></div>
|
||||
<div><dt>Budget</dt><dd data-review-field="budget_range">—</dd></div>
|
||||
<div><dt>Deadline</dt><dd data-review-field="desired_deadline">—</dd></div>
|
||||
<div><dt>Reference links</dt><dd data-review-field="reference_links">—</dd></div>
|
||||
<div><dt>New attachments</dt><dd data-review-field="attachments">None</dd></div>
|
||||
</dl>
|
||||
</div>
|
||||
{% endif %}
|
||||
</section>
|
||||
{% endfor %}
|
||||
|
||||
<div class="wizard-actions">
|
||||
<button type="button" class="btn-ghost" data-wizard-prev hidden>Back</button>
|
||||
<button type="button" class="btn-primary" data-wizard-next>Continue</button>
|
||||
<button type="submit" class="btn-primary btn-submit" data-wizard-submit hidden>{{ submit_label }}</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endblock %}
|
||||
|
||||
{% block extra_js %}
|
||||
<script src="{% static 'js/brief-wizard.js' %}"></script>
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user