97 lines
5.6 KiB
HTML
97 lines
5.6 KiB
HTML
{% extends "ui/templates/base/layout.html" %}
|
|
{% block content %}
|
|
{% if is_employee_self %}
|
|
{% include "modules/employees/templates/employees/_my_workspace_tabs.html" %}
|
|
{% else %}
|
|
{% include "modules/managers/templates/managers/_manager_tabs.html" %}
|
|
{% endif %}
|
|
<div class="space-y-6">
|
|
<div class="flex flex-wrap items-start justify-between gap-3">
|
|
<div>
|
|
<h2 class="text-xl font-semibold text-slate-900">Task Communication</h2>
|
|
<p class="mt-1 text-sm text-slate-500">Communication timeline for engagement task notes, clarifications and review remarks.</p>
|
|
</div>
|
|
<a href="{{ back_url }}" class="rounded-xl border border-slate-300 px-4 py-2 text-sm font-semibold text-slate-700 hover:bg-slate-50">Back</a>
|
|
</div>
|
|
|
|
<div class="rounded-2xl border border-slate-200 bg-white p-5 shadow-soft">
|
|
<div class="grid gap-4 md:grid-cols-4">
|
|
<div class="md:col-span-2">
|
|
<div class="text-xs font-semibold uppercase tracking-wide text-slate-500">Task</div>
|
|
<div class="mt-1 text-lg font-semibold text-slate-900">{{ task.task_name }}</div>
|
|
{% if task.description %}<p class="mt-1 text-sm text-slate-600">{{ task.description }}</p>{% endif %}
|
|
</div>
|
|
<div>
|
|
<div class="text-xs font-semibold uppercase tracking-wide text-slate-500">Client</div>
|
|
<div class="mt-1 text-sm font-semibold text-slate-900">{{ task.client.client_name if task.client else 'Unlinked Client' }}</div>
|
|
<div class="text-xs text-slate-500">{{ task.client.client_code if task.client else '' }}</div>
|
|
</div>
|
|
<div>
|
|
<div class="text-xs font-semibold uppercase tracking-wide text-slate-500">Engagement / Service</div>
|
|
<div class="mt-1 text-sm font-semibold text-slate-900">{{ task.engagement_label }}</div>
|
|
<div class="text-xs text-slate-500">Target: {{ task.internal_target_date or '-' }}</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt-4 flex flex-wrap gap-2 text-xs">
|
|
<span class="rounded-full bg-slate-100 px-2.5 py-1 font-semibold text-slate-700">{{ task.status_label }}</span>
|
|
<span class="rounded-full bg-slate-100 px-2.5 py-1 font-semibold text-slate-700">{{ task.priority_label }}</span>
|
|
<span class="rounded-full bg-slate-100 px-2.5 py-1 font-semibold text-slate-700">{{ task.date_bucket }}</span>
|
|
<span class="rounded-full bg-slate-100 px-2.5 py-1 font-semibold text-slate-700">Assigned: {{ task.assigned_to.full_name if task.assigned_to else 'Unassigned' }}</span>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="rounded-2xl border border-slate-200 bg-white p-5 shadow-soft">
|
|
<h3 class="font-semibold text-slate-900">Add communication</h3>
|
|
<form method="post" action="{{ post_url }}" class="mt-4 space-y-4">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token }}">
|
|
<div class="grid gap-3 md:grid-cols-2">
|
|
<label class="block text-sm font-medium text-slate-700">Type
|
|
<select name="comment_type" class="mt-1 w-full rounded-xl border border-slate-300 px-3 py-2 text-sm focus:border-brand-500 focus:outline-none focus:ring-2 focus:ring-brand-100">
|
|
{% for code, label in communication_types %}
|
|
<option value="{{ code }}">{{ label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</label>
|
|
<label class="block text-sm font-medium text-slate-700">Visibility
|
|
<select name="visibility" class="mt-1 w-full rounded-xl border border-slate-300 px-3 py-2 text-sm focus:border-brand-500 focus:outline-none focus:ring-2 focus:ring-brand-100">
|
|
{% for code, label in communication_visibilities %}
|
|
<option value="{{ code }}">{{ label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</label>
|
|
</div>
|
|
<label class="block text-sm font-medium text-slate-700">Message
|
|
<textarea name="message" rows="4" required placeholder="Write note, client clarification, consultant communication, or review remark" class="mt-1 w-full rounded-xl border border-slate-300 px-3 py-2 text-sm focus:border-brand-500 focus:outline-none focus:ring-2 focus:ring-brand-100"></textarea>
|
|
</label>
|
|
<div class="flex justify-end">
|
|
<button type="submit" class="rounded-xl bg-brand-600 px-4 py-2 text-sm font-semibold text-white hover:bg-brand-700">Add to Timeline</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="rounded-2xl border border-slate-200 bg-white shadow-soft">
|
|
<div class="border-b border-slate-100 px-5 py-4">
|
|
<h3 class="font-semibold text-slate-900">Communication Timeline</h3>
|
|
<p class="mt-1 text-sm text-slate-500">Newest communication appears first.</p>
|
|
</div>
|
|
<div class="divide-y divide-slate-100">
|
|
{% for item in task.communication_items %}
|
|
<div class="p-5">
|
|
<div class="flex flex-wrap items-center justify-between gap-3">
|
|
<div class="flex flex-wrap items-center gap-2">
|
|
<span class="rounded-full bg-slate-100 px-2.5 py-1 text-xs font-semibold text-slate-700">{{ item.comment_type.replace('_',' ').title() }}</span>
|
|
<span class="rounded-full bg-slate-100 px-2.5 py-1 text-xs font-semibold text-slate-700">{{ item.visibility.replace('_',' ').title() }}</span>
|
|
</div>
|
|
<div class="text-xs text-slate-500">{{ item.created_at_utc }}</div>
|
|
</div>
|
|
<p class="mt-3 whitespace-pre-wrap text-sm text-slate-800">{{ item.message }}</p>
|
|
<div class="mt-3 text-xs text-slate-500">By {{ item.created_by.full_name if item.created_by else 'System/User' }}</div>
|
|
</div>
|
|
{% else %}
|
|
<div class="p-8 text-center text-sm text-slate-500">No communication has been added for this task yet.</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|