瀏覽代碼

feat(dashboard): add clear filters button

ebagabee 5 天之前
父節點
當前提交
c94dfa47c3
共有 1 個文件被更改,包括 28 次插入2 次删除
  1. 28 2
      src/pages/dashboard/DashboardPage.vue

+ 28 - 2
src/pages/dashboard/DashboardPage.vue

@@ -61,6 +61,15 @@
               class="filter-item"
             />
           </template>
+
+          <q-btn
+            outline
+            color="secondary"
+            icon="mdi-filter-remove-outline"
+            label="Limpar filtros"
+            class="clear-filters-button"
+            @click="clearFilters"
+          />
         </template>
       </div>
 
@@ -73,7 +82,7 @@
           icon="mdi-filter"
           :label="filterLabel"
           removable
-          @remove="clearFilters"
+          @remove="clearUnitFilters"
         />
       </div>
     </div>
@@ -357,11 +366,20 @@ const onGroupSelected = (val) => {
   if (val) selectedUnit.value = null;
 };
 
-const clearFilters = () => {
+const clearUnitFilters = () => {
   selectedUnit.value  = null;
   selectedGroup.value = null;
 };
 
+const clearFilters = () => {
+  clearUnitFilters();
+  selectedPeriod.value = "month";
+  startDate.value = "";
+  endDate.value = "";
+  startDateIso.value = "";
+  endDateIso.value = "";
+};
+
 // ─── Dialog openers ──────────────────────────────────────────
 const openActiveStudentsDialog = () => {
   $q.dialog({ component: ActiveStudentsDialog, componentProps: { unitIds: activeUnitIds.value } });
@@ -547,10 +565,18 @@ onMounted(async () => {
   max-width: 300px;
 }
 
+.clear-filters-button {
+  margin-left: auto;
+}
+
 @media (max-width: 599px) {
   .filter-item {
     flex: 1 1 100%;
     max-width: 100%;
   }
+
+  .clear-filters-button {
+    width: 100%;
+  }
 }
 </style>