|
|
|
@ -8,83 +8,97 @@
|
|
|
|
|
Edit Prospecting List
|
|
|
|
|
</h1>
|
|
|
|
|
|
|
|
|
|
<!-- Inline table for updating existing items and adding a new one -->
|
|
|
|
|
<!-- Main form: Updates list details, updates existing items, and adds one new item inline -->
|
|
|
|
|
<form method="POST" action="{% url 'editprospecting-list' list.id %}">
|
|
|
|
|
{% csrf_token %}
|
|
|
|
|
<div class="w-full flex flex-col gap-5 justify-center items-center mt-5">
|
|
|
|
|
<div class="w-full">
|
|
|
|
|
<label class="text-gray-500">Name:</label>
|
|
|
|
|
<input name="name" type="text" value="{{ list.name }}"
|
|
|
|
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 rounded-md mt-1" required>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- List Details -->
|
|
|
|
|
<div class="w-full">
|
|
|
|
|
<label class="text-gray-500">Name:</label>
|
|
|
|
|
<input name="name" type="text" value="{{ list.name }}" class="w-full h-[50px] py-1 px-3 border border-gray-300 rounded-md mt-1" required>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="w-full">
|
|
|
|
|
<label class="text-gray-500">Description:</label>
|
|
|
|
|
<input name="description" type="text" value="{{ list.description }}" class="w-full h-[50px] py-1 px-3 border border-gray-300 rounded-md mt-1">
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="w-full">
|
|
|
|
|
<label class="text-gray-500">Description:</label>
|
|
|
|
|
<input name="description" type="text" value="{{ list.description }}"
|
|
|
|
|
class="w-full h-[50px] py-1 px-3 border border-gray-300 rounded-md mt-1">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="w-full">
|
|
|
|
|
<label class="text-gray-500">Items:</label>
|
|
|
|
|
<table class="min-w-full border">
|
|
|
|
|
<thead>
|
|
|
|
|
<tr>
|
|
|
|
|
<th class="border px-4 py-2">Contact</th>
|
|
|
|
|
<th class="border px-4 py-2">Attention</th>
|
|
|
|
|
</tr>
|
|
|
|
|
</thead>
|
|
|
|
|
<tbody>
|
|
|
|
|
<!-- Existing ProspectingListItems -->
|
|
|
|
|
{% for item in list_items %}
|
|
|
|
|
<tr>
|
|
|
|
|
<td class="border px-4 py-2">
|
|
|
|
|
{{ item.addressbook.first_name }} {{ item.addressbook.last_name }}
|
|
|
|
|
<!-- Hidden field to identify existing items -->
|
|
|
|
|
<input type="hidden" name="list_item_id[]" value="{{ item.id }}">
|
|
|
|
|
</td>
|
|
|
|
|
<td class="border px-4 py-2 text-center">
|
|
|
|
|
<input type="checkbox" name="attention_existing_{{ item.id }}"
|
|
|
|
|
{% if item.attention %} checked {% endif %}>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
{% empty %}
|
|
|
|
|
<tr>
|
|
|
|
|
<td colspan="2" class="border px-4 py-2 text-center text-gray-400 italic">
|
|
|
|
|
No contacts yet.
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
{% endfor %}
|
|
|
|
|
<!-- Inline Table of Items -->
|
|
|
|
|
<div class="w-full">
|
|
|
|
|
<label class="text-gray-500">Items:</label>
|
|
|
|
|
<table class="min-w-full border">
|
|
|
|
|
<thead>
|
|
|
|
|
<tr>
|
|
|
|
|
<th class="border px-4 py-2">Contact</th>
|
|
|
|
|
<th class="border px-4 py-2">Attention</th>
|
|
|
|
|
<th class="border px-4 py-2">Comments</th>
|
|
|
|
|
</tr>
|
|
|
|
|
</thead>
|
|
|
|
|
<tbody>
|
|
|
|
|
<!-- Existing items -->
|
|
|
|
|
{% for item in list_items %}
|
|
|
|
|
<tr>
|
|
|
|
|
<td class="border px-4 py-2">
|
|
|
|
|
{{ item.addressbook.first_name }} {{ item.addressbook.last_name }}
|
|
|
|
|
<input type="hidden" name="list_item_id[]" value="{{ item.id }}">
|
|
|
|
|
</td>
|
|
|
|
|
<td class="border px-4 py-2 text-center">
|
|
|
|
|
<input type="checkbox" name="attention_existing_{{ item.id }}" {% if item.attention %} checked {% endif %}>
|
|
|
|
|
</td>
|
|
|
|
|
<td class="border px-4 py-2">
|
|
|
|
|
{% if item.comments.all %}
|
|
|
|
|
<ul class="list-disc list-inside text-sm">
|
|
|
|
|
{% for comment in item.comments.all %}
|
|
|
|
|
<li>{{ comment.content }}</li>
|
|
|
|
|
{% endfor %}
|
|
|
|
|
</ul>
|
|
|
|
|
{% else %}
|
|
|
|
|
<span class="text-gray-400 italic text-sm">No comments</span>
|
|
|
|
|
{% endif %}
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
{% empty %}
|
|
|
|
|
<tr>
|
|
|
|
|
<td colspan="3" class="border px-4 py-2 text-center text-gray-400 italic">
|
|
|
|
|
No contacts yet.
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
{% endfor %}
|
|
|
|
|
|
|
|
|
|
<!-- Blank row for adding a new item inline -->
|
|
|
|
|
<tr class="bg-gray-50">
|
|
|
|
|
<td class="border px-4 py-2">
|
|
|
|
|
<label class="text-gray-500 text-sm">Add New Contact:</label>
|
|
|
|
|
<select name="new_addressbook" id="new-addressbook-select" class="w-full border rounded-md py-1 px-2 mt-1">
|
|
|
|
|
<option value="">Select a contact...</option>
|
|
|
|
|
{% for contact in addresses %}
|
|
|
|
|
<option value="{{ contact.id }}">{{ contact.first_name }} {{ contact.last_name }}</option>
|
|
|
|
|
{% endfor %}
|
|
|
|
|
<option value="new">➕ Add new contact</option>
|
|
|
|
|
</select>
|
|
|
|
|
<!-- Fields for adding a new address if "new" is selected -->
|
|
|
|
|
<div id="new-contact-fields" class="hidden mt-2">
|
|
|
|
|
<input type="text" name="new_first_name" placeholder="First Name" class="w-full border rounded-md py-1 px-2 mb-1">
|
|
|
|
|
<input type="text" name="new_last_name" placeholder="Last Name" class="w-full border rounded-md py-1 px-2">
|
|
|
|
|
</div>
|
|
|
|
|
</td>
|
|
|
|
|
<td class="border px-4 py-2 text-center">
|
|
|
|
|
<label class="text-gray-500 text-sm">Attention?</label>
|
|
|
|
|
<br>
|
|
|
|
|
<input type="checkbox" name="new_attention">
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
</tbody>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flex justify-center mt-4">
|
|
|
|
|
<button type="submit" class="bg-osiblue text-white px-5 py-2 rounded hover:bg-white hover:text-osiblue border border-osiblue duration-300">
|
|
|
|
|
Save Changes
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- New item row -->
|
|
|
|
|
<tr class="bg-gray-50">
|
|
|
|
|
<td class="border px-4 py-2">
|
|
|
|
|
<label class="text-gray-500 text-sm block">Add New Contact:</label>
|
|
|
|
|
<select name="new_addressbook" id="new-addressbook-select" class="w-full border rounded-md py-1 px-2 mt-1">
|
|
|
|
|
<option value="">Select a contact...</option>
|
|
|
|
|
{% for contact in addresses %}
|
|
|
|
|
<option value="{{ contact.id }}">{{ contact.first_name }} {{ contact.last_name }}</option>
|
|
|
|
|
{% endfor %}
|
|
|
|
|
<option value="new">➕ Add new contact</option>
|
|
|
|
|
</select>
|
|
|
|
|
<!-- Inline fields for new contact if "new" is selected -->
|
|
|
|
|
<div id="new-contact-fields" class="hidden mt-2">
|
|
|
|
|
<input type="text" name="new_first_name" placeholder="First Name" class="w-full border rounded-md py-1 px-2 mb-1">
|
|
|
|
|
<input type="text" name="new_last_name" placeholder="Last Name" class="w-full border rounded-md py-1 px-2">
|
|
|
|
|
</div>
|
|
|
|
|
</td>
|
|
|
|
|
<td class="border px-4 py-2 text-center">
|
|
|
|
|
<label class="text-gray-500 text-sm block">Attention?</label>
|
|
|
|
|
<input type="checkbox" name="new_attention">
|
|
|
|
|
</td>
|
|
|
|
|
<td class="border px-4 py-2">
|
|
|
|
|
<label class="text-gray-500 text-sm block">Comments:</label>
|
|
|
|
|
<textarea name="new_comments" placeholder="Enter one comment per line" class="w-full border rounded-md py-1 px-2 mt-1" rows="3"></textarea>
|
|
|
|
|
</td>
|
|
|
|
|
</tr>
|
|
|
|
|
</tbody>
|
|
|
|
|
</table>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="flex justify-center mt-4">
|
|
|
|
|
<button type="submit" class="bg-osiblue text-white px-5 py-2 rounded hover:bg-white hover:text-osiblue border border-osiblue duration-300">
|
|
|
|
|
Save Changes
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
@ -94,7 +108,6 @@
|
|
|
|
|
// Toggle the new-contact fields when "Add new contact" is selected.
|
|
|
|
|
const newSelect = document.getElementById('new-addressbook-select');
|
|
|
|
|
const newContactFields = document.getElementById('new-contact-fields');
|
|
|
|
|
|
|
|
|
|
newSelect.addEventListener('change', function() {
|
|
|
|
|
if (this.value === 'new') {
|
|
|
|
|
newContactFields.classList.remove('hidden');
|
|
|
|
|