supports export

This commit is contained in:
2025-11-20 22:53:16 -08:00
parent 5afb05d261
commit aca18b781b
3 changed files with 358 additions and 66 deletions

View File

@@ -2,80 +2,96 @@
{% 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>
<div class="flex justify-between">
{% 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">
</div>
{% endif %}
<!-- Per Page Dropdown -->
<div class="mb-4 flex items-center">
<label for="perPage" class="mr-2 text-sm font-medium text-slate-700">Items per page:</label>
<select id="perPage" x-model="perPage" @change="window.location.href = `/dashboard/1?per_page=${$data.perPage}${$data.case_email_sim ? '&case_email=' + encodeURIComponent($data.case_email_sim) : ''}`"
class="px-3 py-2 border border-slate-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="10">10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
</div>
<!-- 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>
{% 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">
</div>
{% else %}
<div></div>
{% endif %}
<div class="flex gap-2 items-center">
<!-- Export Button -->
<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>
<a href="{{ url_for('dashboard_export_xls') }}" class="inline-flex items-center px-4 py-2 bg-blue-600 text-white text-sm font-medium rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
<svg class="mr-2 -ml-1 h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"></path>
</svg>
Export to Excel
</a>
</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">
<span class="text-sm" x-text="column"></span>
</label>
</template>
<!-- Per Page Dropdown -->
<div class="mb-4 flex items-center">
<label for="perPage" class="mr-2 text-sm font-medium text-slate-700">Items per page:</label>
<select id="perPage" x-model="perPage" @change="window.location.href = `/dashboard/1?per_page=${$data.perPage}${$data.case_email_sim ? '&case_email=' + encodeURIComponent($data.case_email_sim) : ''}`"
class="px-3 py-2 border border-slate-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="10">10</option>
<option value="25">25</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
</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
<!-- 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="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">
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>
</div>
{% from "_expander.html" import expander %}