{% extends 'base.html' %}{% block title %}{{ project.reference }} · {{ project.title }}{% endblock %}{% block breadcrumb %}Project Workspace{% endblock %}{% block content %}
<div class="page-head"><div><p class="small muted">PRIVATE CUSTOMER PROJECT · {{ project.reference }}</p><h2>{{ project.title }}</h2><p>{{ project.get_creative_type_display }} · {{ project.get_delivery_state_display }} · {{ project.delivery_city }} · Quantity {{ project.quantity }}</p></div>{% if user.is_authenticated and project.customer_id == user.pk %}<a class="btn small outline" href="{% url 'genez_projects' %}">All my projects</a>{% if whatsapp_url %}<a class="btn small outline" href="{{ whatsapp_url }}" target="_blank" rel="noopener">Continue to messaging</a>{% endif %}{% endif %}</div>
<div class="v28-project-grid"><div class="stack">
{% if project.order %}<section class="card card-pad v28-order-link"><p class="small muted">CONTINUED AS AN ORDER</p><h3>{{ project.order.order_number }} · {{ project.order.get_status_display }}</h3><p>Payment, production and delivery now use the same Genez order record.</p><a class="btn" href="{% url 'order_detail' project.order.pk %}">Open order timeline</a></section>{% endif %}
{% if is_team and not project.order_id %}<section class="card card-pad v5-project-studio"><div><span class="v5-chip">DESIGN TASK · {{ project.reference }}</span><h3>Design this project in Studio</h3><p>Open the brief beside the canvas, build the design draft, save it, then upload a proof version for the customer to review.</p></div><a class="btn" href="{% url 'studio' %}?project_id={{ project.pk }}{% if project.product_id %}&amp;product_id={{ project.product_id }}{% endif %}">Open task in Design Studio</a></section>{% endif %}<section class="card card-pad"><h3>Project brief</h3><p>{{ project.brief|linebreaksbr }}</p>{% if project.inspiration_file %}<a class="btn small outline" href="{% url 'genez_project_inspiration' project.pk %}">Download private inspiration file</a>{% endif %}<dl class="v28-specs"><dt>Project type</dt><dd>{{ project.get_creative_type_display }}</dd><dt>Quantity</dt><dd>{{ project.quantity }}</dd><dt>Nigeria region</dt><dd>{{ project.delivery_region|default:'Not recorded' }}</dd><dt>State</dt><dd>{{ project.get_delivery_state_display }}</dd><dt>LGA</dt><dd>{{ project.delivery_lga.name|default:'Not recorded' }}</dd><dt>Town / community</dt><dd>{{ project.delivery_city }}</dd><dt>Street address</dt><dd>{{ project.delivery_address|linebreaksbr }}</dd>{% if project.delivery_latitude is not None and project.delivery_longitude is not None %}<dt>Map point</dt><dd><a href="https://maps.google.com/?q={{ project.delivery_latitude }},{{ project.delivery_longitude }}" target="_blank" rel="noopener">{{ project.delivery_latitude }}, {{ project.delivery_longitude }}</a></dd>{% endif %}<dt>Phone</dt><dd>{{ project.contact_phone }}</dd><dt>Requested by</dt><dd>{% if project.requested_date %}{{ project.requested_date|date:'d M Y' }}{% else %}Not specified{% endif %}</dd><dt>Lead designer</dt><dd>{{ project.assigned_to|default:'Being assigned' }}</dd>{% if project.design_team.exists %}<dt>Design team</dt><dd>{% for designer in project.design_team.all %}{{ designer.get_full_name|default:designer.username }}{% if not forloop.last %}, {% endif %}{% endfor %}</dd>{% endif %}<dt>Project stage</dt><dd>{% if project.order %}{{ project.order.get_status_display }}{% else %}{{ project.get_status_display }}{% endif %}</dd></dl></section>
{% if latest_proof %}<section class="card card-pad"><h3>Design proof · v{{ latest_proof.version }}</h3><p>Status: <strong>{{ latest_proof.get_status_display }}</strong> · Uploaded {{ latest_proof.uploaded_at|date:'d M Y H:i' }}</p>{% if latest_proof.decision_note or latest_proof.decision_area or latest_proof.decision_page %}<p class="small muted">Latest feedback: {% if latest_proof.decision_page %}page {{ latest_proof.decision_page }}{% endif %}{% if latest_proof.decision_area %} · {{ latest_proof.decision_area }}{% endif %}{% if latest_proof.decision_note %} · {{ latest_proof.decision_note }}{% endif %}</p>{% endif %}<a class="btn small outline" href="{% url 'genez_project_proof_file' project.pk latest_proof.pk %}">Download private proof</a>{% if can_decide_proof and latest_proof.status == 'pending' %}<form method="post" action="{% url 'genez_project_proof_decision' project.pk latest_proof.pk %}" class="stack v28-form">{% csrf_token %}<label class="field">Your decision{{ proof_decision_form.decision }}</label><label class="field">Page number (optional){{ proof_decision_form.decision_page }}</label><label class="field">Area to change (optional){{ proof_decision_form.decision_area }}</label><label class="field">Change notes{{ proof_decision_form.decision_note }}</label><button class="btn" type="submit">Send proof decision</button></form>{% endif %}</section>{% endif %}
{% if project.quote_issued_at %}<section class="card card-pad v28-quote"><p class="small muted">GENEZ QUOTE · ISSUED {{ project.quote_issued_at|date:'d M Y' }}</p><h3>Print and delivery quote</h3><dl class="v28-specs"><dt>Product / scope</dt><dd>{{ project.product.name }}</dd><dt>Project type</dt><dd>{{ project.get_creative_type_display }}</dd><dt>Quantity</dt><dd>{{ project.quantity }}</dd><dt>Price per unit</dt><dd>₦{{ project.quote_unit_price|floatformat:2 }}</dd><dt>Print subtotal</dt><dd>₦{{ project.quoted_subtotal|floatformat:2 }}</dd><dt>Delivery service</dt><dd>{{ project.quote_carrier_snapshot }} · {{ project.quote_service_snapshot }}</dd><dt>Delivery charge</dt><dd>₦{{ project.quote_delivery_total|floatformat:2 }}</dd><dt>Delivery estimate</dt><dd>{{ project.quote_eta_min_days }}–{{ project.quote_eta_max_days }} days after dispatch</dd><dt>Total</dt><dd><strong>₦{{ project.quoted_total|floatformat:2 }}</strong></dd><dt>Quote expires</dt><dd>{{ project.quote_expires_on|date:'d M Y' }}</dd></dl>{% if project.status == 'quoted' and latest_proof.status == 'approved' and project.customer_id == user.pk %}<form method="post" action="{% url 'genez_project_accept_quote' project.pk %}">{% csrf_token %}<button class="btn" type="submit">Approve quote &amp; create order</button><p class="small muted">This creates an unpaid order. You will review it and continue to secure payment.</p></form>{% endif %}</section>{% endif %}
{% if can_quote %}<section class="card card-pad"><h3>Prepare or update quote</h3><p class="small muted">Issue only after the customer approves the latest design proof. The delivery amount is calculated from the selected active rate card.</p><form method="post" action="{% url 'genez_project_issue_quote' project.pk %}" class="stack v28-form">{% csrf_token %}{{ quote_form.non_field_errors }}{% for field in quote_form %}<label class="field">{{ field.label }}{{ field }}{% if field.help_text %}<small class="muted">{{ field.help_text }}</small>{% endif %}{% for error in field.errors %}<span class="form-error">{{ error }}</span>{% endfor %}</label>{% endfor %}<button class="btn" type="submit">Issue customer quote</button></form></section>{% endif %}
{% if is_team and not project.order %}<section class="card card-pad"><h3>Upload design proof</h3><p class="small muted">Upload a customer-review proof. The customer must approve the latest version before quote approval.</p><form method="post" enctype="multipart/form-data" action="{% url 'genez_project_upload_proof' project.pk %}" class="stack">{% csrf_token %}<label class="field">{{ proof_form.proof_file.label }}{{ proof_form.proof_file }}<small class="muted">PDF, JPG, PNG or WebP, up to 10 MB.</small></label><button class="btn outline" type="submit">Upload new proof version</button></form></section>{% endif %}
{% if order_events %}<section class="card card-pad"><h3>Order and production updates</h3><div class="timeline">{% for event in order_events %}<div class="timeline-item"><div><strong>{{ event.title }}</strong><p>{{ event.created_at|date:'d M Y H:i' }}</p></div></div>{% endfor %}</div></section>{% endif %}
{% if shipments %}<section class="card card-pad"><h3>Delivery tracking</h3>{% for shipment in shipments %}<p><strong>{{ shipment.tracking_number }}</strong> · {{ shipment.get_status_display }} · {{ shipment.carrier_name|default:shipment.courier }}</p><a class="btn small outline" href="{% url 'shipment_detail' shipment.pk %}">Open delivery journey</a>{% endfor %}</section>{% endif %}
</div><aside class="stack"><section class="card card-pad"><h3>Project discussion</h3><div class="v28-thread" id="v28-project-log" role="log" aria-live="polite" aria-label="Project messages" data-updates-url="{% url 'genez_project_message_updates' project.pk %}" data-last-id="{% if project_messages %}{{ project_messages|last.pk }}{% else %}0{% endif %}">{% for msg in project_messages %}<article class="v28-msg {% if msg.sender_id == user.pk %}v28-mine{% endif %}" data-message-id="{{ msg.pk }}"><div><strong>{% if msg.sender_id == user.pk %}You{% elif msg.sender_id == project.customer_id %}Customer{% else %}GENEZ team{% endif %}</strong><time>{{ msg.created_at|date:'d M Y H:i' }}</time></div><p>{{ msg.body|linebreaksbr }}</p></article>{% empty %}<p class="muted">Send a message to begin discussing your brief.</p>{% endfor %}</div>{% if project.customer_id == user.pk or is_team %}<form method="post" action="{% url 'genez_project_message' project.pk %}" class="stack">{% csrf_token %}<label class="field">Message{{ message_form.body }}</label><button class="btn" type="submit">Send message</button></form>{% else %}<p class="muted">You can view project updates for this allocated job. Replies are handled by the customer and assigned GENEZ team.</p>{% endif %}</section><section class="card card-pad"><h3>Journey stages</h3><ol class="v28-stages"><li class="done">Idea and discussion</li><li class="{% if latest_proof and latest_proof.status == 'approved' %}done{% endif %}">Design proof and approval</li><li class="{% if project.quote_issued_at %}done{% endif %}">Print and delivery quote</li><li class="{% if project.order and project.order.status != 'pending_payment' %}done{% elif project.order %}current{% endif %}">Quote approval and payment</li><li class="{% if project.order.status == 'in_production' %}current{% elif project.order.status == 'ready_for_delivery' or project.order.status == 'completed' %}done{% endif %}">Production and quality checks</li><li class="{% if project.status == 'in_transit' %}current{% elif project.order.status == 'completed' %}done{% endif %}">Courier delivery</li></ol></section></aside></div>
<script>(function(){const log=document.getElementById('v28-project-log');if(!log)return;let last=Number(log.dataset.lastId||0),busy=false;async function poll(){if(busy||document.hidden)return;busy=true;try{const r=await fetch(log.dataset.updatesUrl+'?after='+encodeURIComponent(last),{credentials:'same-origin',headers:{'Accept':'application/json'}});if(!r.ok)throw new Error();const data=await r.json();for(const m of data.messages){const article=document.createElement('article');article.className='v28-msg'+(m.mine?' v28-mine':'');article.dataset.messageId=m.id;const meta=document.createElement('div'),who=document.createElement('strong'),time=document.createElement('time'),body=document.createElement('p');who.textContent=m.sender;time.textContent=m.created_at;meta.append(who,time);body.textContent=m.body;article.append(meta,body);log.append(article);last=m.id;}log.scrollTop=log.scrollHeight;}catch(e){}finally{busy=false;}}poll();window.setInterval(poll,12000)})();</script>
<style>.v28-project-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(280px,1fr);gap:1rem;align-items:start}.v28-specs{display:grid;grid-template-columns:minmax(130px,.7fr) 1.3fr;gap:.55rem 1rem}.v28-specs dt{color:var(--muted,#697386)}.v28-specs dd{margin:0}.v28-form{margin-top:1rem}.v28-thread{max-height:55vh;overflow:auto;margin:1rem 0}.v28-msg{padding:.7rem;border-radius:.8rem;background:rgba(90,110,140,.08);margin:.6rem 0}.v28-msg>div{display:flex;justify-content:space-between;gap:.5rem;font-size:.82rem}.v28-msg time{color:var(--muted,#697386)}.v28-msg p{margin-bottom:0}.v28-stages{padding-left:1.2rem}.v28-stages li{padding:.28rem 0;color:var(--muted,#697386)}.v28-stages li.done{color:inherit;font-weight:650}.v28-order-link{border-left:4px solid var(--primary,#1b4fa3)}@media(max-width:800px){.v28-project-grid{grid-template-columns:1fr}}.v5-project-studio{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-left:4px solid var(--primary,#1b4fa3)}.v5-project-studio p{margin-bottom:0}@media(max-width:640px){.v5-project-studio{align-items:flex-start;flex-direction:column}}
</style>
{% endblock %}