design
This commit is contained in:
oliver
+228
-15
@@ -730,22 +730,11 @@
|
||||
<div
|
||||
class="form-row"
|
||||
style="
|
||||
flex-wrap: nowrap;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
"
|
||||
>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 140px"
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-search"
|
||||
placeholder="Fulltext search by name, company, email, stage, strategy…"
|
||||
oninput="crmRender()"
|
||||
/>
|
||||
</div>
|
||||
<div class="form-group" style="flex: 0 0 auto">
|
||||
<button
|
||||
class="btn btn-danger btn-sm"
|
||||
@@ -773,9 +762,75 @@
|
||||
d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"
|
||||
/>
|
||||
</svg>
|
||||
Delete Selected
|
||||
Delete Checked
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 120px"
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-search-name"
|
||||
placeholder="Search Name…"
|
||||
oninput="crmRender()"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 120px"
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-search-company"
|
||||
placeholder="Search Company…"
|
||||
oninput="crmRender()"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 140px"
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-search-email"
|
||||
placeholder="Search Email…"
|
||||
oninput="crmRender()"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 100px"
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-search-stage"
|
||||
placeholder="Search Stage…"
|
||||
oninput="crmRender()"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 120px"
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-search-strategy"
|
||||
placeholder="Search Strategy…"
|
||||
oninput="crmRender()"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 100px"
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-search-category"
|
||||
placeholder="Search Category…"
|
||||
oninput="crmRender()"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -826,7 +881,6 @@
|
||||
<th>Strategy</th>
|
||||
<th>Category</th>
|
||||
<th>Date Next Contact</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="crm-table-body">
|
||||
@@ -1032,6 +1086,165 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ═══ CRM EDIT MODAL ════════════════════════════════════ -->
|
||||
<div class="modal-backdrop" id="crm-edit-backdrop">
|
||||
<div class="modal" style="max-width: 640px">
|
||||
<div class="modal-header">
|
||||
<span class="modal-title" id="crm-edit-title"
|
||||
>Edit Contact</span
|
||||
>
|
||||
<button
|
||||
class="modal-close"
|
||||
onclick="crmCloseEdit()"
|
||||
aria-label="Close"
|
||||
>
|
||||
✕
|
||||
</button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<input type="hidden" id="crm-edit-id" />
|
||||
<div class="form-row" style="flex-wrap: wrap">
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 160px"
|
||||
>
|
||||
<label>Name</label>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-edit-name"
|
||||
placeholder="Contact name"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 160px"
|
||||
>
|
||||
<label>Company</label>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-edit-company"
|
||||
placeholder="Company"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 200px"
|
||||
>
|
||||
<label>Email</label>
|
||||
<input
|
||||
type="email"
|
||||
id="crm-edit-email"
|
||||
placeholder="email@example.com"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row" style="flex-wrap: wrap">
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 120px"
|
||||
>
|
||||
<label>Stage</label>
|
||||
<select id="crm-edit-stage">
|
||||
<option value="">— Select —</option>
|
||||
<option>Hold</option>
|
||||
<option>Active</option>
|
||||
<option>Won</option>
|
||||
<option>Lost</option>
|
||||
<option>Lead</option>
|
||||
<option>Prospect</option>
|
||||
</select>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 160px"
|
||||
>
|
||||
<label>Strategy</label>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-edit-strategy"
|
||||
placeholder="Strategy"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 120px"
|
||||
>
|
||||
<label>Category</label>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-edit-category"
|
||||
placeholder="Category"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row" style="flex-wrap: wrap">
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 120px"
|
||||
>
|
||||
<label>Affiliate</label>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-edit-affiliate"
|
||||
placeholder="Affiliate"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 120px"
|
||||
>
|
||||
<label>Number</label>
|
||||
<input
|
||||
type="text"
|
||||
id="crm-edit-number"
|
||||
placeholder="Phone number"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="form-group"
|
||||
style="flex: 1; min-width: 160px"
|
||||
>
|
||||
<label>Date Next Contact</label>
|
||||
<input type="date" id="crm-edit-date-next" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group" style="margin-top: 10px">
|
||||
<label>History / Notes</label>
|
||||
<textarea
|
||||
id="crm-edit-history"
|
||||
rows="4"
|
||||
placeholder="Contact history, notes…"
|
||||
style="width: 100%; resize: vertical"
|
||||
></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button class="btn btn-ghost" onclick="crmCloseEdit()">
|
||||
Cancel
|
||||
</button>
|
||||
<button
|
||||
class="btn btn-primary"
|
||||
id="crm-save-btn"
|
||||
onclick="crmSaveEdit()"
|
||||
>
|
||||
<svg
|
||||
width="13"
|
||||
height="13"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="2.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
>
|
||||
<polyline points="20 6 9 17 4 12" />
|
||||
</svg>
|
||||
Save Changes
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ═══ CONFIRM DIALOG ══════════════════════════════════════════════ -->
|
||||
<div class="modal-backdrop" id="confirm-backdrop">
|
||||
<div class="modal" id="confirm-modal" style="max-width: 360px">
|
||||
|
||||
Reference in New Issue
Block a user