src/pages/Ticket/TicketList.vue

@@ -1,6 +1,7 @@
 <script setup>
 import axios from 'axios';
-import { computed, ref } from 'vue';
+import { computed, ref, onMounted } from 'vue';
+import { useStateStore } from 'stores/useStateStore';
 import { useI18n } from 'vue-i18n';
 import { toDate, toCurrency } from 'src/filters/index';
 import TicketSummary from './Card/TicketSummary.vue';
@@ -10,6 +11,8 @@ import VnTable from 'src/components/VnTable/VnTable.vue';
 import VnSelect from 'src/components/common/VnSelect.vue';
 import VnInputDate from 'src/components/common/VnInputDate.vue';
 import VnRow from 'src/components/ui/VnRow.vue';
+import RightMenu from 'src/components/common/RightMenu.vue';
+import TicketFilter from './TicketFilter.vue';
 
 const { t } = useI18n();
 const { viewSummary } = useSummaryDialog();
@@ -18,6 +21,15 @@ const clientsOptions = ref([]);
 const addressesOptions = ref([]);
 const agenciesOptions = ref([]);
 const selectedClient = ref();
+const stateStore = useStateStore();
+const from = Date.vnNew();
+const to = Date.vnNew();
+to.setDate(to.getDate() + 1);
+
+const userParams = {
+    from: from.toISOString(),
+    to: to.toISOString(),
+};
 
 const columns = computed(() => [
     {
@@ -187,6 +199,8 @@ const fetchAddresses = async (formData) => {
 const getColor = (row) => {
     return row?.classColor ? `bg-${row.classColor}` : 'bg-orange';
 };
+
+onMounted(() => (stateStore.rightDrawer = true));
 </script>
 
 <template>
@@ -195,6 +209,11 @@ const getColor = (row) => {
         :label="t('Search ticket')"
         :info="t('You can search by ticket id or alias')"
     />
+    <RightMenu>
+        <template #right-panel>
+            <TicketFilter data-key="Tickets" />
+        </template>
+    </RightMenu>
     <VnTable
         ref="tableRef"
         data-key="Tickets"
@@ -206,7 +225,10 @@ const getColor = (row) => {
             formInitialData: {},
         }"
         default-mode="table"
+        order="id DESC"
         :columns="columns"
+        :user-params="userParams"
+        :right-search="false"
         redirect="ticket"
         auto-load
     >