formatting improvements.
This commit is contained in:
@@ -2,34 +2,29 @@
|
||||
{% block content %}
|
||||
<div class="h-full flex flex-col" x-data="columnConfig()">
|
||||
<h1 class="text-xl font-semibold mb-4">Projects for {{ case_email }}</h1>
|
||||
|
||||
|
||||
{% set profile = get_user_profile(session.uid) %}
|
||||
{% if profile.is_admin %}
|
||||
<div class="mb-4 flex w-[400px]">
|
||||
<label for="simulateCaseEmail" class=" text-sm font-medium text-slate-700 mb-1">Simulate case email:</label>
|
||||
<input type="text"
|
||||
id="simulateCaseEmail"
|
||||
x-model="case_email_sim"
|
||||
@keyup.debounce.1000ms="window.location.href=`/dashboard/1?case_email=${encodeURIComponent($data.case_email_sim)}`"
|
||||
class="w-full px-3 py-2 border w-64 border-slate-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
placeholder="Enter case email to simulate">
|
||||
<input type="text" id="simulateCaseEmail" x-model="case_email_sim"
|
||||
@keyup.debounce.1000ms="window.location.href=`/dashboard/1?case_email=${encodeURIComponent($data.case_email_sim)}`"
|
||||
class="w-full px-3 py-2 border w-64 border-slate-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
|
||||
placeholder="Enter case email to simulate">
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% endif %}
|
||||
|
||||
<!-- Configure Visible Columns Link -->
|
||||
<div class="mb-4">
|
||||
<button @click="showColumnModal = true"
|
||||
class="text-blue-600 hover:text-blue-800 text-sm font-medium underline">
|
||||
<button @click="showColumnModal = true" class="text-blue-600 hover:text-blue-800 text-sm font-medium underline">
|
||||
Configure Visible Columns...
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- Column Configuration Modal -->
|
||||
<div x-show="showColumnModal"
|
||||
x-cloak
|
||||
x-transition
|
||||
class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
|
||||
@click.self="showColumnModal = false">
|
||||
<div x-show="showColumnModal" x-cloak x-transition
|
||||
class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
|
||||
@click.self="showColumnModal = false">
|
||||
<div class="bg-white rounded-lg p-6 max-w-2xl w-full max-h-[80vh] overflow-y-auto">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 class="text-lg font-semibold">Configure Visible Columns</h3>
|
||||
@@ -39,392 +34,592 @@
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="flex items-center">
|
||||
<input type="checkbox"
|
||||
x-model="selectAll"
|
||||
@change="toggleAllColumns()"
|
||||
class="mr-2 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
|
||||
<input type="checkbox" x-model="selectAll" @change="toggleAllColumns()"
|
||||
class="mr-2 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
|
||||
<span class="text-sm font-medium">Select All / Deselect All</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-3 max-h-96 overflow-y-auto">
|
||||
<template x-for="(column, index) in columns" :key="index">
|
||||
<label class="flex items-center p-2 hover:bg-slate-50 rounded cursor-pointer">
|
||||
<input type="checkbox"
|
||||
:value="column"
|
||||
x-model="visibleColumns"
|
||||
@change="saveColumnSettings()"
|
||||
:checked="visibleColumns.includes(column)"
|
||||
class="mr-2 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
|
||||
<input type="checkbox" :value="column" x-model="visibleColumns" @change="saveColumnSettings()"
|
||||
:checked="visibleColumns.includes(column)"
|
||||
class="mr-2 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
|
||||
<span class="text-sm" x-text="column"></span>
|
||||
</label>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="flex justify-end space-x-3 mt-6">
|
||||
<button @click="resetToDefault()"
|
||||
class="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-100 hover:bg-gray-200 rounded-md transition-colors">
|
||||
class="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-100 hover:bg-gray-200 rounded-md transition-colors">
|
||||
Reset to Default
|
||||
</button>
|
||||
<button @click="showColumnModal = false;"
|
||||
class="px-4 py-2 text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 rounded-md transition-colors">
|
||||
class="px-4 py-2 text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 rounded-md transition-colors">
|
||||
Apply Changes
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% from "_expander.html" import expander %}
|
||||
|
||||
<div class="overflow-scroll">
|
||||
<table class="w-full whitespace-nowrap shadow-md border border-slate-200">
|
||||
<thead class=" text-left text-sm sticky top-0 z-10 border-b border-blue-800 text-white font-medium"
|
||||
style="background-color: rgb(89, 121, 142);">
|
||||
<tr>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Matter Num')}">Matter Num</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Client / Property')}">Client / Property</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Matter Description')}">Matter Description</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Defendant 1')}">Defendant 1</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Matter Open')}">Matter Open</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Practice Area')}">Practice Area</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Notice Type')}">Notice Type</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Case Number')}">Case Number</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Premises Address')}">Premises Address</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Premises City')}">Premises City</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Assigned Attorney')}">Assigned Attorney</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Primary Contact')}">Primary Contact</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Secondary Paralegal')}">Secondary Paralegal</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Documents')}">Documents</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Matter Stage')}">Matter Stage</th>
|
||||
<th class="px-4 py-3 w-[400px]" :class="{'hidden': !isColumnVisible('Completed Tasks')}">Completed Tasks</th>
|
||||
<th class="px-4 py-3 w-[400px]" :class="{'hidden': !isColumnVisible('Pending Tasks')}">Pending Tasks</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Notice Service Date')}">Notice Service Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Notice Expir. Date')}">Notice Expir. Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Date Case Filed')}">Date Case Filed</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Daily Rent Damages')}">Daily Rent Damages</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Default Date')}">Default Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Default Entered On')}">Default Entered On</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Motions:')}">Motions:</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Demurrer Hearing Date')}">Demurrer Hearing Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Motion To Strike Hearing Date')}">Motion To Strike Hearing Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Motion to Quash Hearing Date')}">Motion to Quash Hearing Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Other Motion Hearing Date')}">Other Motion Hearing Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('MSC Date')}">MSC Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('MSC Time')}">MSC Time</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('MSC Address')}">MSC Address</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('MSC Div/ Dept/ Room')}">MSC Div/ Dept/ Room</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Trial Date')}">Trial Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Trial Time')}">Trial Time</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Trial Address')}">Trial Address</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Trial Div/ Dept/ Room')}">Trial Div/ Dept/ Room</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Final Result of Trial/ MSC')}">Final Result of Trial/ MSC</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Date of Settlement')}">Date of Settlement</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Final Obligation Under the Stip')}">Final Obligation Under the Stip</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Def\'s Comply with the Stip?')}">Def's Comply with the Stip?</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Judgment Date')}">Judgment Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Writ Issued Date')}">Writ Issued Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Scheduled Lockout')}">Scheduled Lockout</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Oppose Stays?')}">Oppose Stays?</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Premises Safety or Access Issues')}">Premises Safety or Access Issues</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Matter Gate or Entry Code')}">Matter Gate or Entry Code</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Date Possession Recovered')}">Date Possession Recovered</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Attorney\'s Fees')}">Attorney's Fees</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !isColumnVisible('Costs')}">Costs</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="bg-slate-100 divide-y divide-slate-300">
|
||||
{% for r in rows %}
|
||||
<tr class="hover:bg-slate-200 transition-colors duration-150 ease-in-out">
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Matter Num')}">{{ r.number }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Client / Property')}">{{ r.client }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Matter Description')}">{{ r.matter_description }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Defendant 1')}">{{ r.defendant_1 }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Matter Open')}">{{ r.matter_open }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Practice Area')}"></td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Notice Type')}">{{ r.notice_type }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Case Number')}">{{ r.case_number }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Premises Address')}">{{ r.premises_address }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Premises City')}">{{ r.premises_city }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Assigned Attorney')}">
|
||||
<table class="w-full table-fixed shadow-md border border-slate-200">
|
||||
<thead class=" text-left text-sm z-10 border-b border-blue-800 text-white font-medium"
|
||||
style="background-color: rgb(89, 121, 142);">
|
||||
<tr>
|
||||
<th class="px-4 py-3 w-16 sticky left-0 top-0 z-[40]" style="background-color: rgb(89, 121, 142);"></th>
|
||||
<th class="px-4 py-3 w-32 sticky left-16 top-0 z-[40]" style="background-color: rgb(89, 121, 142);" :class="{'hidden': !isColumnVisible('Matter Num')}">Matter Num</th>
|
||||
<th class="px-4 py-3 w-64 sticky left-48 top-0 z-[40]" style="background-color: rgb(89, 121, 142);" :class="{'hidden': !isColumnVisible('Client / Property')}">Client / Property</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-72 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Matter Description')}">Matter Description</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-48 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Defendant 1')}">Defendant 1</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Matter Open')}">Matter Open</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Practice Area')}">Practice Area</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-64 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Notice Type')}">Notice Type</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Case Number')}">Case Number</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-72 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Premises Address')}">Premises Address</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isCstyle="background-color: rgb(89, 121, 142);" olumnVisible('Premises City')}">Premises City</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-48 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Assigned Attorney')}">Assigned Attorney</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-48 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Primary Contact')}">Primary Contact</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-48 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Secondary Paralegal')}">Secondary Paralegal</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Documents')}">Documents</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-64 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Matter Stage')}">Matter Stage</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-[400px] sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Completed Tasks')}">Completed Tasks</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-[400px] sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Pending Tasks')}">Pending Tasks</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Notice Service Date')}">Notice Service Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Notice Expir. Date')}">Notice Expir. Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Date Case Filed')}">Date Case Filed</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Daily Rent Damages')}">Daily Rent Damages</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Default Date')}">Default Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Default Entered On')}">Default Entered On</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Motions:')}">Motions:</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Demurrer Hearing Date')}">Demurrer Hearing Date </th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Motion To Strike Hearing Date')}">Motion To Strike Hearing Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Motion to Quash Hearing Date')}">Motion to Quash Hearing Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Other Motion Hearing Date')}">Other Motion Hearing Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('MSC Date')}">MSC Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('MSC Time')}">MSC Time</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-72 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('MSC Address')}">MSC Address</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-48 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('MSC Div/ Dept/ Room')}">MSC Div/ Dept/ Room</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Trial Date')}">Trial Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Trial Time')}">Trial Time</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-72 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Trial Address')}">Trial Address</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-48 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Trial Div/ Dept/ Room')}">Trial Div/ Dept/ Room </th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-48 sticky top-0 z-[40]" :class="{'hidden': !isColumnVisible('Final Result of Trial/ MSC')}">Final Result of Trial/ MSC</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0" :class="{'hidden': !isColumnVisible('Date of Settlement')}">Date of Settlement</th> <th class="px-4 py-3 w-32" :class="{'hidden': !isColumnVisible('Final Obligation Under the Stip')}">Final Obligation Under the Stip</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0" :class="{'hidden': !isColumnVisible('Def\'s Comply with the Stip?')}">Def's Comply with the Stip?</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0" :class="{'hidden': !isColumnVisible('Judgment Date')}">Judgment Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0" :class="{'hidden': !isColumnVisible('Writ Issued Date')}">Writ Issued Date</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0" :class="{'hidden': !isColumnVisible('Scheduled Lockout')}">Scheduled Lockout</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0" :class="{'hidden': !isColumnVisible('Oppose Stays?')}">Oppose Stays?</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-64 sticky top-0" :class="{'hidden': !isColumnVisible('Premises Safety or Access Issues')}">Premises Safety or Access Issues</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-64 sticky top-0" :class="{'hidden': !isColumnVisible('Matter Gate or Entry Code')}">Matter Gate or Entry Code</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0" :class="{'hidden': !isColumnVisible('Date Possession Recovered')}">Date Possession Recovered</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0" :class="{'hidden': !isColumnVisible('Attorney\'s Fees')}">Attorney's Fees</th>
|
||||
<th style="background-color: rgb(89, 121, 142);" class="px-4 py-3 w-32 sticky top-0" :class="{'hidden': !isColumnVisible('Costs')}">Costs</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="bg-slate-100 divide-y divide-slate-300">
|
||||
{% for r in rows %}
|
||||
<tr class="hover:bg-slate-200 transition-colors duration-150 ease-in-out group"
|
||||
x-data="{ expanded: false, hasOverflow: false }" x-init="
|
||||
$nextTick(() => {
|
||||
// Check overflow for ANY td in this row
|
||||
const tds = $el.querySelectorAll('td .content');
|
||||
hasOverflow = Array.from(tds).some(td => td.scrollHeight > td.clientHeight + 1);
|
||||
});
|
||||
">
|
||||
<td class="px-4 py-3 sticky left-0 bg-slate-100 z-[30] group-hover:bg-slate-200 ease-in-out duration-150 transition-colors">
|
||||
<button x-show="hasOverflow" x-on:click="expanded = !expanded"
|
||||
class="mt-1 h-5 w-5 flex items-center justify-center rounded border cursor-pointer text-xs">
|
||||
<span class="inline-block transition-transform duration-150" :class="expanded ? 'rotate-90' : ''">▶</span>
|
||||
</button>
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800 left-16 bg-slate-100 sticky z-[30] group-hover:bg-slate-200 ease-in-out duration-150 transition-colors" :class="{'hidden': !isColumnVisible('Matter Num')}">
|
||||
{{ r.number }}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800 sticky bg-slate-100 left-48 w-64 z-[30] group-hover:bg-slate-200 ease-in-out duration-150 transition-colors" :class="{'hidden': !isColumnVisible('Client / Property')}">
|
||||
{% call expander() %}
|
||||
{{ r.client }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800 w-64"
|
||||
:class="{'hidden': !isColumnVisible('Matter Description')}">
|
||||
{% call expander() %}
|
||||
{{ r.matter_description }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Defendant 1')}">
|
||||
{% call expander() %}
|
||||
{{ r.defendant_1 }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Matter Open')}">
|
||||
{% call expander() %}
|
||||
{{ r.matter_open }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Practice Area')}">
|
||||
{% call expander() %}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Notice Type')}">
|
||||
{% call expander() %}
|
||||
{{ r.notice_type }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Case Number')}">
|
||||
{% call expander() %}
|
||||
{{ r.case_number }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800 w-[200px]" :class="{'hidden': !isColumnVisible('Premises Address')}">
|
||||
{% call expander() %}
|
||||
{{ r.premises_address }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Premises City')}">
|
||||
{% call expander() %}
|
||||
{{ r.premises_city }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Assigned Attorney')}">
|
||||
|
||||
{% call expander() %}
|
||||
{{ r.responsible_attorney }}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Primary Contact')}">
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Primary Contact')}">
|
||||
{% call expander() %}
|
||||
{{ r.staff_person }}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Secondary Paralegal')}">
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Secondary Paralegal')}">
|
||||
{% call expander() %}
|
||||
{{ r.staff_person_2 }}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Documents')}">
|
||||
{% if r.documents_url %}
|
||||
<a href="{{ r.documents_url }}">Documents</a>
|
||||
{% endif %}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Matter Stage')}"> {{ r.phase_name }}</td>
|
||||
<td class="px-4 py-3 text-sm align-top whitespace-normal w-[400px]" :class="{'hidden': !isColumnVisible('Completed Tasks')}" x-data="{ showCompletedModal: false}">
|
||||
{% if r.completed_tasks %}
|
||||
<div>
|
||||
<table class="w-full text-xs">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-left pb-1">Task</th>
|
||||
<th class="text-right pb-1">Completed</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for x in r.completed_tasks[:2] %}
|
||||
<tr>
|
||||
<td class="py-1 pr-2 break-words">{{ x.description }}</td>
|
||||
<td class="py-1 text-right whitespace-nowrap">{{ x.completed }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
{% if r.completed_tasks|length > 2 %}
|
||||
<button @click="showCompletedModal = true" class="text-blue-500 hover:text-blue-700 text-sm mt-1">Show more...</button>
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Documents')}">
|
||||
|
||||
{% call expander() %}
|
||||
{% endcall %}
|
||||
{% if r.documents_url %}
|
||||
<a class="text-blue-500 text-underline" href=" {{ r.documents_url }}">Documents</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div x-show="showCompletedModal"
|
||||
x-cloak
|
||||
x-transition
|
||||
class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
|
||||
@click.self="showCompletedModal = false">
|
||||
<div class="bg-white rounded-lg p-6 max-w-lg w-full max-h-[80vh] overflow-y-auto">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 class="text-lg font-semibold">Completed Tasks</h3>
|
||||
<button @click="showCompletedModal = false" class="text-gray-500 hover:text-gray-700">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<table class="w-full">
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !isColumnVisible('Matter Stage')}">
|
||||
{% call expander() %}
|
||||
{{ r.phase_name }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm align-top whitespace-normal w-[400px]"
|
||||
:class="{'hidden': !isColumnVisible('Completed Tasks')}" x-data="{ showCompletedModal: false}">
|
||||
{% call expander() %}
|
||||
{% if r.completed_tasks %}
|
||||
<div>
|
||||
<table class="w-full text-xs">
|
||||
<thead>
|
||||
<tr class="border-b">
|
||||
<th class="text-left pb-2">Task Description</th>
|
||||
<th class="text-right pb-2">Completed Date</th>
|
||||
<tr>
|
||||
<th class="text-left pb-1">Task</th>
|
||||
<th class="text-right pb-1">Completed</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for x in r.completed_tasks %}
|
||||
<tr class="border-b border-slate-200">
|
||||
<td class="py-2 break-words">{{ x.description }}</td>
|
||||
<td class="py-2 text-right whitespace-nowrap">{{ x.completed }}</td>
|
||||
{% for x in r.completed_tasks[:2] %}
|
||||
<tr>
|
||||
<td class="py-1 pr-2 break-words">{{ x.description }}</td>
|
||||
<td class="py-1 text-right whitespace-nowrap">{{ x.completed }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
{% if r.completed_tasks|length > 2 %}
|
||||
<button @click="showCompletedModal = true" class="text-blue-500 hover:text-blue-700 text-sm mt-1">Show
|
||||
more...</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm align-top whitespace-normal w-[400px] min-w-[400px]" :class="{'hidden': !isColumnVisible('Pending Tasks')}" x-data="{ showPendingModal: false }">
|
||||
{% if r.pending_tasks %}
|
||||
<div>
|
||||
<table class="w-full text-xs">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-left pb-1">Task</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for x in r.pending_tasks[:2] %}
|
||||
<tr>
|
||||
<td class="py-1 break-words">{{ x.description }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
{% if r.pending_tasks|length > 2 %}
|
||||
<button @click="showPendingModal = true" class="text-blue-500 hover:text-blue-700 text-sm mt-1">Show more...</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
<div x-show="showPendingModal"
|
||||
x-cloak
|
||||
x-transition
|
||||
class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
|
||||
@click.self="showPendingModal = false">
|
||||
<div class="bg-white rounded-lg p-6 max-w-lg w-full max-h-[80vh] overflow-y-auto">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 class="text-lg font-semibold">Pending Tasks</h3>
|
||||
<button @click="showPendingModal = false" class="text-gray-500 hover:text-gray-700">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div x-show="showCompletedModal" x-cloak x-transition
|
||||
class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
|
||||
@click.self="showCompletedModal = false">
|
||||
<div class="bg-white rounded-lg p-6 max-w-lg w-full max-h-[80vh] overflow-y-auto">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 class="text-lg font-semibold">Completed Tasks</h3>
|
||||
<button @click="showCompletedModal = false" class="text-gray-500 hover:text-gray-700">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12">
|
||||
</path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
<tr class="border-b">
|
||||
<th class="text-left pb-2">Task Description</th>
|
||||
<th class="text-right pb-2">Completed Date</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for x in r.completed_tasks %}
|
||||
<tr class="border-b border-slate-200">
|
||||
<td class="py-2 break-words">{{ x.description }}</td>
|
||||
<td class="py-2 text-right whitespace-nowrap">{{ x.completed }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<table class="w-full">
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm align-top whitespace-normal w-[400px] min-w-[400px]"
|
||||
:class="{'hidden': !isColumnVisible('Pending Tasks')}" x-data="{ showPendingModal: false }">
|
||||
|
||||
{% call expander() %}
|
||||
{% if r.pending_tasks %}
|
||||
<div>
|
||||
<table class="w-full text-xs">
|
||||
<thead>
|
||||
<tr class="border-b">
|
||||
<th class="text-left pb-2">Task Description</th>
|
||||
<tr>
|
||||
<th class="text-left pb-1">Task</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for x in r.pending_tasks %}
|
||||
<tr class="border-b border-slate-200">
|
||||
<td class="py-2 break-words">{{ x.description }}</td>
|
||||
{% for x in r.pending_tasks[:2] %}
|
||||
<tr>
|
||||
<td class="py-1 break-words">{{ x.description }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
{% if r.pending_tasks|length > 2 %}
|
||||
<button @click="showPendingModal = true" class="text-blue-500 hover:text-blue-700 text-sm mt-1">Show
|
||||
more...</button>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Notice Service Date')}">{{ r.notice_service_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Notice Expir. Date')}">{{ r.notice_expiration_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Date Case Filed')}">{{ r.case_field_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Daily Rent Damages')}">{% if r.daily_rent_damages %}${{ "{:,.2f}".format(r.daily_rent_damages) }}{% endif %}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Default Date')}">{{ r.default_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Default Entered On')}">{{ r.default_entered_on_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Motions:')}"></td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Demurrer Hearing Date')}">{{ r.demurrer_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Motion To Strike Hearing Date')}">{{ r.motion_to_strike_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Motion to Quash Hearing Date')}">{{ r.motion_to_quash_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Other Motion Hearing Date')}">{{ r.other_motion_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('MSC Date')}">{{ r.msc_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('MSC Time')}">{{ r.msc_time }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('MSC Address')}">{{ r.msc_address }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('MSC Div/ Dept/ Room')}">{{ r.msc_div_dept_room }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Trial Date')}">{{ r.trial_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Trial Time')}">{{ r.trial_time }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Trial Address')}">{{ r.trial_address }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Trial Div/ Dept/ Room')}">{{ r.trial_div_dept_room }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Final Result of Trial/ MSC')}">{{ r.final_result }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Date of Settlement')}">{{ r.date_of_settlement }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Final Obligation Under the Stip')}">{{ r.final_obligation }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Def\'s Comply with the Stip?')}">{{ r.def_comply_stip }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Judgment Date')}">{{ r.judgment_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Writ Issued Date')}">{{ r.writ_issued_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Scheduled Lockout')}">{{ r.scheduled_lockout }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Oppose Stays?')}">{{ r.oppose_stays }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Premises Safety or Access Issues')}">{{ r.premises_safety }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Matter Gate or Entry Code')}">{{ r.matter_gate_code }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Date Possession Recovered')}">{{ r.date_possession_recovered }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Attorney\'s Fees')}">{{ r.attorney_fees }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Costs')}">{{ r.costs }}</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr>
|
||||
<td colspan="53" class="px-4 py-6 text-center text-slate-500">No matching projects found.</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Pagination -->
|
||||
{% include '_pagination.html' %}
|
||||
<div x-show="showPendingModal" x-cloak x-transition
|
||||
class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50"
|
||||
@click.self="showPendingModal = false">
|
||||
<div class="bg-white rounded-lg p-6 max-w-lg w-full max-h-[80vh] overflow-y-auto">
|
||||
<div class="flex justify-between items-center mb-4">
|
||||
<h3 class="text-lg font-semibold">Pending Tasks</h3>
|
||||
<button @click="showPendingModal = false" class="text-gray-500 hover:text-gray-700">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12">
|
||||
</path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<table class="w-full">
|
||||
<thead>
|
||||
<tr class="border-b">
|
||||
<th class="text-left pb-2">Task Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for x in r.pending_tasks %}
|
||||
<tr class="border-b border-slate-200">
|
||||
<td class="py-2 break-words">{{ x.description }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Notice Service Date')}">
|
||||
{% call expander() %}
|
||||
{{ r.notice_service_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Notice Expir. Date')}">
|
||||
{% call expander() %}
|
||||
{{ r.notice_expiration_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Date Case Filed')}">
|
||||
|
||||
<script>
|
||||
function columnConfig() {
|
||||
return {
|
||||
showColumnModal: false,
|
||||
case_email_sim: '',
|
||||
columns: [
|
||||
'Matter Num',
|
||||
'Client / Property',
|
||||
'Matter Description',
|
||||
'Defendant 1',
|
||||
'Matter Open',
|
||||
'Practice Area',
|
||||
'Notice Type',
|
||||
'Case Number',
|
||||
'Premises Address',
|
||||
'Premises City',
|
||||
'Assigned Attorney',
|
||||
'Primary Contact',
|
||||
'Secondary Paralegal',
|
||||
'Documents',
|
||||
'Matter Stage',
|
||||
'Completed Tasks',
|
||||
'Pending Tasks',
|
||||
'Notice Service Date',
|
||||
'Notice Expir. Date',
|
||||
'Date Case Filed',
|
||||
'Daily Rent Damages',
|
||||
'Default Date',
|
||||
'Default Entered On',
|
||||
'Motions:',
|
||||
'Demurrer Hearing Date',
|
||||
'Motion To Strike Hearing Date',
|
||||
'Motion to Quash Hearing Date',
|
||||
'Other Motion Hearing Date',
|
||||
'MSC Date',
|
||||
'MSC Time',
|
||||
'MSC Address',
|
||||
'MSC Div/ Dept/ Room',
|
||||
'Trial Date',
|
||||
'Trial Time',
|
||||
'Trial Address',
|
||||
'Trial Div/ Dept/ Room',
|
||||
'Final Result of Trial/ MSC',
|
||||
'Date of Settlement',
|
||||
'Final Obligation Under the Stip',
|
||||
'Def\'s Comply with the Stip?',
|
||||
'Judgment Date',
|
||||
'Writ Issued Date',
|
||||
'Scheduled Lockout',
|
||||
'Oppose Stays?',
|
||||
'Premises Safety or Access Issues',
|
||||
'Matter Gate or Entry Code',
|
||||
'Date Possession Recovered',
|
||||
'Attorney\'s Fees',
|
||||
'Costs'
|
||||
],
|
||||
selectAll: true,
|
||||
visibleColumns: [],
|
||||
|
||||
init() {
|
||||
this.loadColumnSettings();
|
||||
|
||||
// Extract case_email from URL query parameter
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const caseEmail = urlParams.get('case_email');
|
||||
if (caseEmail) {
|
||||
this.case_email_sim = caseEmail;
|
||||
{% call expander() %}
|
||||
{{ r.case_field_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Daily Rent Damages')}">
|
||||
|
||||
{% call expander() %}
|
||||
{% if r.daily_rent_damages %}${{ "{:,.2f}".format(r.daily_rent_damages) }}{% endif %}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Default Date')}">
|
||||
{% call expander() %}
|
||||
{{ r.default_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Default Entered On')}">
|
||||
{% call expander() %}
|
||||
{{ r.default_entered_on_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Motions:')}"></td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Demurrer Hearing Date')}">
|
||||
{% call expander() %}
|
||||
{{ r.demurrer_hearing_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Motion To Strike Hearing Date')}">
|
||||
{% call expander() %}
|
||||
{{ r.motion_to_strike_hearing_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Motion to Quash Hearing Date')}">
|
||||
|
||||
{% call expander() %}
|
||||
{{ r.motion_to_quash_hearing_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Other Motion Hearing Date')}">
|
||||
{% call expander() %}
|
||||
{{ r.other_motion_hearing_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('MSC Date')}">
|
||||
{% call expander() %}
|
||||
{{ r.msc_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('MSC Time')}">
|
||||
{% call expander() %}
|
||||
{{ r.msc_time }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('MSC Address')}">
|
||||
{% call expander() %}
|
||||
{{ r.msc_address }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('MSC Div/ Dept/ Room')}">
|
||||
{% call expander() %}
|
||||
{{ r.msc_div_dept_room }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Trial Date')}">
|
||||
|
||||
{% call expander() %}
|
||||
{{ r.trial_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Trial Time')}">
|
||||
{% call expander() %}
|
||||
{{ r.trial_time }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Trial Address')}">
|
||||
{% call expander() %}
|
||||
{{ r.trial_address }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Trial Div/ Dept/ Room')}">
|
||||
{% call expander() %}
|
||||
{{ r.trial_div_dept_room }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Final Result of Trial/ MSC')}">
|
||||
{% call expander() %}
|
||||
{{ r.final_result }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Date of Settlement')}">
|
||||
{% call expander() %}
|
||||
{{ r.date_of_settlement }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Final Obligation Under the Stip')}">
|
||||
|
||||
{% call expander() %}
|
||||
{{ r.final_obligation }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Def\'s Comply with the Stip?')}">
|
||||
|
||||
{% call expander() %}
|
||||
{{ r.def_comply_stip }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Judgment Date')}">
|
||||
{% call expander() %}
|
||||
{{ r.judgment_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Writ Issued Date')}">
|
||||
{% call expander() %}
|
||||
{{ r.writ_issued_date }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Scheduled Lockout')}">
|
||||
{% call expander() %}
|
||||
{{ r.scheduled_lockout }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Oppose Stays?')}">
|
||||
{% call expander() %}
|
||||
{{ r.oppose_stays }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Premises Safety or Access Issues')}">
|
||||
{% call expander() %}
|
||||
{{ r.premises_safety }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Matter Gate or Entry Code')}">
|
||||
{% call expander() %}
|
||||
{{ r.matter_gate_code }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Date Possession Recovered')}">
|
||||
{% call expander() %}
|
||||
{{ r.date_possession_recovered }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Attorney\'s Fees')}">
|
||||
{% call expander() %}
|
||||
{{ r.attorney_fees }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !isColumnVisible('Costs')}">
|
||||
{% call expander() %}
|
||||
{{ r.costs }}
|
||||
{% endcall %}
|
||||
</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr>
|
||||
<td colspan="53" class="px-4 py-6 text-center text-slate-500">No matching projects found.</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- Pagination -->
|
||||
{% include '_pagination.html' %}
|
||||
|
||||
<script>
|
||||
function columnConfig() {
|
||||
return {
|
||||
showColumnModal: false,
|
||||
case_email_sim: '',
|
||||
columns: [
|
||||
'Matter Num',
|
||||
'Client / Property',
|
||||
'Matter Description',
|
||||
'Defendant 1',
|
||||
'Matter Open',
|
||||
'Practice Area',
|
||||
'Notice Type',
|
||||
'Case Number',
|
||||
'Premises Address',
|
||||
'Premises City',
|
||||
'Assigned Attorney',
|
||||
'Primary Contact',
|
||||
'Secondary Paralegal',
|
||||
'Documents',
|
||||
'Matter Stage',
|
||||
'Completed Tasks',
|
||||
'Pending Tasks',
|
||||
'Notice Service Date',
|
||||
'Notice Expir. Date',
|
||||
'Date Case Filed',
|
||||
'Daily Rent Damages',
|
||||
'Default Date',
|
||||
'Default Entered On',
|
||||
'Motions:',
|
||||
'Demurrer Hearing Date',
|
||||
'Motion To Strike Hearing Date',
|
||||
'Motion to Quash Hearing Date',
|
||||
'Other Motion Hearing Date',
|
||||
'MSC Date',
|
||||
'MSC Time',
|
||||
'MSC Address',
|
||||
'MSC Div/ Dept/ Room',
|
||||
'Trial Date',
|
||||
'Trial Time',
|
||||
'Trial Address',
|
||||
'Trial Div/ Dept/ Room',
|
||||
'Final Result of Trial/ MSC',
|
||||
'Date of Settlement',
|
||||
'Final Obligation Under the Stip',
|
||||
'Def\'s Comply with the Stip?',
|
||||
'Judgment Date',
|
||||
'Writ Issued Date',
|
||||
'Scheduled Lockout',
|
||||
'Oppose Stays?',
|
||||
'Premises Safety or Access Issues',
|
||||
'Matter Gate or Entry Code',
|
||||
'Date Possession Recovered',
|
||||
'Attorney\'s Fees',
|
||||
'Costs'
|
||||
],
|
||||
selectAll: true,
|
||||
visibleColumns: [],
|
||||
|
||||
init() {
|
||||
this.loadColumnSettings();
|
||||
|
||||
// Extract case_email from URL query parameter
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const caseEmail = urlParams.get('case_email');
|
||||
if (caseEmail) {
|
||||
this.case_email_sim = caseEmail;
|
||||
}
|
||||
},
|
||||
|
||||
isColumnVisible(columnName) {
|
||||
return this.visibleColumns.includes(columnName);
|
||||
},
|
||||
|
||||
loadColumnSettings() {
|
||||
const stored = localStorage.getItem('dashboardColumnVisibility');
|
||||
if (stored) {
|
||||
this.visibleColumns = JSON.parse(stored);
|
||||
this.selectAll = this.visibleColumns.length === this.columns.length;
|
||||
} else {
|
||||
// Default to showing all columns
|
||||
this.visibleColumns = [...this.columns];
|
||||
this.selectAll = true;
|
||||
}
|
||||
},
|
||||
|
||||
saveColumnSettings() {
|
||||
localStorage.setItem('dashboardColumnVisibility', JSON.stringify(this.visibleColumns));
|
||||
},
|
||||
|
||||
toggleAllColumns() {
|
||||
if (this.visibleColumns.length === 0) {
|
||||
this.visibleColumns = [...this.columns];
|
||||
this.selectAll = true;
|
||||
} else {
|
||||
this.visibleColumns = [];
|
||||
this.selectAll = false;
|
||||
}
|
||||
this.saveColumnSettings();
|
||||
},
|
||||
|
||||
resetToDefault() {
|
||||
this.visibleColumns = [...this.columns];
|
||||
this.selectAll = true;
|
||||
this.saveColumnSettings();
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
isColumnVisible(columnName) {
|
||||
return this.visibleColumns.includes(columnName);
|
||||
},
|
||||
|
||||
loadColumnSettings() {
|
||||
const stored = localStorage.getItem('dashboardColumnVisibility');
|
||||
if (stored) {
|
||||
this.visibleColumns = JSON.parse(stored);
|
||||
this.selectAll = this.visibleColumns.length === this.columns.length;
|
||||
} else {
|
||||
// Default to showing all columns
|
||||
this.visibleColumns = [...this.columns];
|
||||
this.selectAll = true;
|
||||
}
|
||||
},
|
||||
|
||||
saveColumnSettings() {
|
||||
localStorage.setItem('dashboardColumnVisibility', JSON.stringify(this.visibleColumns));
|
||||
},
|
||||
|
||||
toggleAllColumns() {
|
||||
if (this.selectAll) {
|
||||
this.visibleColumns = [];
|
||||
} else {
|
||||
this.visibleColumns = [...this.columns];
|
||||
}
|
||||
this.selectAll = !this.selectAll;
|
||||
this.saveColumnSettings();
|
||||
},
|
||||
|
||||
resetToDefault() {
|
||||
this.visibleColumns = [...this.columns];
|
||||
this.selectAll = true;
|
||||
this.saveColumnSettings();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</script>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
|
||||
Reference in New Issue
Block a user