52 lines
2.6 KiB
HTML
52 lines
2.6 KiB
HTML
{% load i18n %}
|
|
<section class="bg-white rounded-2xl p-4 shadow-sm border border-slate-100">
|
|
<h3 class="font-bold text-navy mb-4 flex items-center gap-2">
|
|
<i data-lucide="message-square" class="w-5 h-5 text-blue"></i>
|
|
{% trans "Notes" %}
|
|
</h3>
|
|
|
|
{% if request.user.is_authenticated %}
|
|
<form method="post" action="{% url 'core:add_note' %}" class="mb-4"
|
|
data-on:submit="@post('{% url 'core:add_note' %}', {contentType:'form'})">
|
|
{% csrf_token %}
|
|
<input type="hidden" name="content_type_id" value="{{ content_type_id }}">
|
|
<input type="hidden" name="object_id" value="{{ object_id }}">
|
|
<textarea name="note" rows="3"
|
|
class="w-full px-4 py-3 border-2 border-slate-200 rounded-xl focus:outline-none focus:border-navy focus:ring-2 focus:ring-navy/20 resize-none text-sm mb-3"
|
|
placeholder="{% trans 'Add a note...' %}" required></textarea>
|
|
<div class="flex justify-end">
|
|
<button type="submit" class="px-4 py-2 bg-navy text-white rounded-xl font-semibold hover:bg-blue transition text-sm inline-flex items-center gap-2">
|
|
<i data-lucide="plus-circle" class="w-4 h-4"></i>
|
|
{% trans "Add Note" %}
|
|
</button>
|
|
</div>
|
|
</form>
|
|
{% endif %}
|
|
|
|
{% if notes %}
|
|
<div class="space-y-4">
|
|
{% for note in notes %}
|
|
<div class="border border-slate-100 rounded-xl p-4 bg-slate-50">
|
|
<div class="flex items-center justify-between mb-2">
|
|
<div class="flex items-center gap-2">
|
|
<div class="w-7 h-7 bg-navy rounded-full flex items-center justify-center text-white font-bold text-[10px]">
|
|
{% if note.created_by %}{{ note.created_by.first_name|first }}{{ note.created_by.last_name|first }}{% else %}?{% endif %}
|
|
</div>
|
|
<span class="text-sm font-semibold text-navy">
|
|
{% if note.created_by %}{{ note.created_by.get_full_name }}{% else %}{% trans "Unknown" %}{% endif %}
|
|
</span>
|
|
</div>
|
|
<span class="text-xs text-slate">{{ note.created_at|date:"M d, Y h:i A" }}</span>
|
|
</div>
|
|
<p class="text-sm text-slate-700 leading-relaxed pl-9">{{ note.note|linebreaksbr }}</p>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<div class="text-center py-8">
|
|
<i data-lucide="message-square" class="w-12 h-12 mx-auto text-slate-300 mb-3"></i>
|
|
<p class="text-slate text-sm">{% trans "No notes yet" %}</p>
|
|
</div>
|
|
{% endif %}
|
|
</section>
|