big progress on saving visible columns.
This commit is contained in:
@@ -1,92 +1,153 @@
|
||||
{% extends 'base.html' %}
|
||||
{% block content %}
|
||||
<div class="h-full flex flex-col">
|
||||
<div class="h-full flex flex-col" x-data="columnConfig()">
|
||||
<h1 class="text-xl font-semibold mb-4">Projects for {{ case_email }}</h1>
|
||||
|
||||
<!-- 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">
|
||||
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 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>
|
||||
<button @click="showColumnModal = 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>
|
||||
|
||||
<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">
|
||||
<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="index"
|
||||
x-model="visibleColumns"
|
||||
:changed="saveColumnSettings()"
|
||||
:checked="visibleColumns.includes(index)"
|
||||
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">
|
||||
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">
|
||||
Apply Changes
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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">Matter Num</th>
|
||||
<th class="px-4 py-3">Client / Property</th>
|
||||
<th class="px-4 py-3">Matter Description</th>
|
||||
<th class="px-4 py-3">Defendant 1</th>
|
||||
<th class="px-4 py-3">Matter Open</th>
|
||||
<th class="px-4 py-3">Practice Area</th>
|
||||
<th class="px-4 py-3">Notice Type</th>
|
||||
<th class="px-4 py-3">Case Number</th>
|
||||
<th class="px-4 py-3">Premises Address</th>
|
||||
<th class="px-4 py-3">Premises City</th>
|
||||
<th class="px-4 py-3">Assigned Attorney</th>
|
||||
<th class="px-4 py-3">Primary Contact</th>
|
||||
<th class="px-4 py-3">Secondary Paralegal</th>
|
||||
<th class="px-4 py-3">Documents</th>
|
||||
<th class="px-4 py-3">Matter Stage</th>
|
||||
<th class="px-4 py-3 w-[400px] ">Completed Tasks</th>
|
||||
<th class="px-4 py-3 w-[400px]">Pending Tasks</th>
|
||||
<th class="px-4 py-3">Notice Service Date</th>
|
||||
<th class="px-4 py-3">Notice Expir. Date</th>
|
||||
<th class="px-4 py-3">Date Case Filed</th>
|
||||
<th class="px-4 py-3">Daily Rent Damages</th>
|
||||
<th class="px-4 py-3">Default Date</th>
|
||||
<th class="px-4 py-3">Default Entered On</th>
|
||||
<th class="px-4 py-3">Motions:</th>
|
||||
<th class="px-4 py-3">Demurrer Hearing Date</th>
|
||||
<th class="px-4 py-3">Motion To Strike Hearing Date</th>
|
||||
<th class="px-4 py-3">Motion to Quash Hearing Date</th>
|
||||
<th class="px-4 py-3">Other Motion Hearing Date</th>
|
||||
<th class="px-4 py-3">MSC Date</th>
|
||||
<th class="px-4 py-3">MSC Time</th>
|
||||
<th class="px-4 py-3">MSC Address</th>
|
||||
<th class="px-4 py-3">MSC Div/ Dept/ Room</th>
|
||||
<th class="px-4 py-3">Trial Date</th>
|
||||
<th class="px-4 py-3">Trial Time</th>
|
||||
<th class="px-4 py-3">Trial Address</th>
|
||||
<th class="px-4 py-3">Trial Div/ Dept/ Room</th>
|
||||
<th class="px-4 py-3">Final Result of Trial/ MSC</th>
|
||||
<th class="px-4 py-3">Date of Settlement</th>
|
||||
<th class="px-4 py-3">Final Obligation Under the Stip</th>
|
||||
<th class="px-4 py-3">Def's Comply with the Stip?</th>
|
||||
<th class="px-4 py-3">Judgment Date</th>
|
||||
<th class="px-4 py-3">Writ Issued Date</th>
|
||||
<th class="px-4 py-3">Scheduled Lockout</th>
|
||||
<th class="px-4 py-3">Oppose Stays?</th>
|
||||
<th class="px-4 py-3">Premises Safety or Access Issues</th>
|
||||
<th class="px-4 py-3">Matter Gate or Entry Code</th>
|
||||
<th class="px-4 py-3">Date Possession Recovered</th>
|
||||
<th class="px-4 py-3">Attorney's Fees</th>
|
||||
<th class="px-4 py-3">Costs</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(0)}">Matter Num</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(1)}">Client / Property</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(2)}">Matter Description</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(3)}">Defendant 1</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(4)}">Matter Open</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(5)}">Practice Area</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(6)}">Notice Type</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(7)}">Case Number</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(8)}">Premises Address</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(9)}">Premises City</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(10)}">Assigned Attorney</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(11)}">Primary Contact</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(12)}">Secondary Paralegal</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(13)}">Documents</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(14)}">Matter Stage</th>
|
||||
<th class="px-4 py-3 w-[400px]" :class="{'hidden': !visibleColumns.includes(15)}">Completed Tasks</th>
|
||||
<th class="px-4 py-3 w-[400px]" :class="{'hidden': !visibleColumns.includes(16)}">Pending Tasks</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(17)}">Notice Service Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(18)}">Notice Expir. Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(19)}">Date Case Filed</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(20)}">Daily Rent Damages</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(21)}">Default Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(22)}">Default Entered On</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(23)}">Motions:</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(24)}">Demurrer Hearing Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(25)}">Motion To Strike Hearing Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(26)}">Motion to Quash Hearing Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(27)}">Other Motion Hearing Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(28)}">MSC Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(29)}">MSC Time</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(30)}">MSC Address</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(31)}">MSC Div/ Dept/ Room</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(32)}">Trial Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(33)}">Trial Time</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(34)}">Trial Address</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(35)}">Trial Div/ Dept/ Room</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(36)}">Final Result of Trial/ MSC</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(37)}">Date of Settlement</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(38)}">Final Obligation Under the Stip</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(39)}">Def's Comply with the Stip?</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(40)}">Judgment Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(41)}">Writ Issued Date</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(42)}">Scheduled Lockout</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(43)}">Oppose Stays?</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(44)}">Premises Safety or Access Issues</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(45)}">Matter Gate or Entry Code</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(46)}">Date Possession Recovered</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(47)}">Attorney's Fees</th>
|
||||
<th class="px-4 py-3" :class="{'hidden': !visibleColumns.includes(48)}">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"></td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800">{{ r.client }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800">{{ r.matter_description }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800">{{ r.defendant_1 }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800">{{ r.matter_open }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800"></td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800">{{ r.notice_type }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800">{{ r.case_number }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800">{{ r.premises_address }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800">{{ r.premises_city }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800">
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(0)}"></td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(1)}">{{ r.client }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(2)}">{{ r.matter_description }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(3)}">{{ r.defendant_1 }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(4)}">{{ r.matter_open }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(5)}"></td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(6)}">{{ r.notice_type }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(7)}">{{ r.case_number }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(8)}">{{ r.premises_address }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(9)}">{{ r.premises_city }}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(10)}">
|
||||
{{ r.responsible_attorney }}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm">
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(11)}">
|
||||
{{ r.staff_person }}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm">
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(12)}">
|
||||
{{ r.staff_person_2 }}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm">
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(13)}">
|
||||
{% if r.documents_url %}
|
||||
<a href="{{ r.documents_url }}">Documents</a>
|
||||
{% endif %}</td>
|
||||
<td class="px-4 py-3 text-sm text-slate-800"> {{ r.phase_name }}</td>
|
||||
<td class="px-4 py-3 text-sm align-top w-[400px] whitespace-normal" x-data="{ showCompletedModal: false}">
|
||||
<td class="px-4 py-3 text-sm text-slate-800" :class="{'hidden': !visibleColumns.includes(14)}"> {{ r.phase_name }}</td>
|
||||
<td class="px-4 py-3 text-sm align-top whitespace-normal w-[400px]" :class="{'hidden': !visibleColumns.includes(15)}" x-data="{ showCompletedModal: false}">
|
||||
{% if r.completed_tasks %}
|
||||
<div>
|
||||
<table class="w-full text-xs">
|
||||
@@ -144,7 +205,7 @@
|
||||
</div>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm align-top whitespace-normal w-[400px] min-w-[400px]" x-data="{ showPendingModal: false }">
|
||||
<td class="px-4 py-3 text-sm align-top whitespace-normal w-[400px] min-w-[400px]" :class="{'hidden': !visibleColumns.includes(16)}" x-data="{ showPendingModal: false }">
|
||||
{% if r.pending_tasks %}
|
||||
<div>
|
||||
<table class="w-full text-xs">
|
||||
@@ -198,38 +259,38 @@
|
||||
</div>
|
||||
{% endif %}
|
||||
</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.notice_service_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.notice_expiration_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.case_field_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{% if r.daily_rent_damages %}${{ "{:,.2f}".format(r.daily_rent_damages) }}{% endif %}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.default_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.default_entered_on_date }}</td>
|
||||
<td class="px-4 py-3 text-sm"></td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.demurrer_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.motion_to_strike_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.motion_to_quash_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.other_motion_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.msc_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.msc_time }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.msc_address }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.msc_div_dept_room }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.trial_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.trial_time }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.trial_address }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.trial_div_dept_room }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.final_result }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.date_of_settlement }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.final_obligation }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.def_comply_stip }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.judgment_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.writ_issued_date }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.scheduled_lockout }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.oppose_stays }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.premises_safety }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.matter_gate_code }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.date_possession_recovered }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.attorney_fees }}</td>
|
||||
<td class="px-4 py-3 text-sm">{{ r.costs }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(17)}">{{ r.notice_service_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(18)}">{{ r.notice_expiration_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(19)}">{{ r.case_field_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(20)}">{% if r.daily_rent_damages %}${{ "{:,.2f}".format(r.daily_rent_damages) }}{% endif %}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(21)}">{{ r.default_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(22)}">{{ r.default_entered_on_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(23)}"></td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(24)}">{{ r.demurrer_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(25)}">{{ r.motion_to_strike_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(26)}">{{ r.motion_to_quash_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(27)}">{{ r.other_motion_hearing_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(28)}">{{ r.msc_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(29)}">{{ r.msc_time }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(30)}">{{ r.msc_address }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(31)}">{{ r.msc_div_dept_room }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(32)}">{{ r.trial_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(33)}">{{ r.trial_time }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(34)}">{{ r.trial_address }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(35)}">{{ r.trial_div_dept_room }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(36)}">{{ r.final_result }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(37)}">{{ r.date_of_settlement }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(38)}">{{ r.final_obligation }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(39)}">{{ r.def_comply_stip }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(40)}">{{ r.judgment_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(41)}">{{ r.writ_issued_date }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(42)}">{{ r.scheduled_lockout }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(43)}">{{ r.oppose_stays }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(44)}">{{ r.premises_safety }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(45)}">{{ r.matter_gate_code }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(46)}">{{ r.date_possession_recovered }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(47)}">{{ r.attorney_fees }}</td>
|
||||
<td class="px-4 py-3 text-sm" :class="{'hidden': !visibleColumns.includes(48)}">{{ r.costs }}</td>
|
||||
</tr>
|
||||
{% else %}
|
||||
<tr>
|
||||
@@ -239,6 +300,103 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<script>
|
||||
function columnConfig() {
|
||||
return {
|
||||
showColumnModal: false,
|
||||
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();
|
||||
},
|
||||
|
||||
loadColumnSettings() {
|
||||
const stored = localStorage.getItem('dashboardColumnVisibility');
|
||||
console.log("STORED", stored)
|
||||
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.map((_, index) => index);
|
||||
this.selectAll = true;
|
||||
}
|
||||
},
|
||||
|
||||
saveColumnSettings() {
|
||||
console.log(JSON.stringify(this.visibleColumns))
|
||||
localStorage.setItem('dashboardColumnVisibility', JSON.stringify(this.visibleColumns));
|
||||
},
|
||||
|
||||
toggleAllColumns() {
|
||||
if (this.selectAll) {
|
||||
this.visibleColumns = this.columns.map((_, index) => index);
|
||||
} else {
|
||||
this.visibleColumns = [];
|
||||
}
|
||||
this.saveColumnSettings();
|
||||
},
|
||||
|
||||
resetToDefault() {
|
||||
this.visibleColumns = this.columns.map((_, index) => index);
|
||||
this.selectAll = true;
|
||||
this.saveColumnSettings();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
|
||||
Reference in New Issue
Block a user