diff --git a/frontend/src/components/Controls/DatePicker.vue b/frontend/src/components/Controls/DatePicker.vue
index 1c080b2e..a1579bac 100644
--- a/frontend/src/components/Controls/DatePicker.vue
+++ b/frontend/src/components/Controls/DatePicker.vue
@@ -14,6 +14,7 @@
           'form-input  block h-7 w-full cursor-pointer select-none rounded border-gray-400 text-sm placeholder-gray-500',
           inputClass,
         ]"
+        v-bind="$attrs"
       />
     </template>
     <template #body="{ togglePopover }">
diff --git a/frontend/src/components/Filter.vue b/frontend/src/components/Filter.vue
index 36f8be13..5159b559 100644
--- a/frontend/src/components/Filter.vue
+++ b/frontend/src/components/Filter.vue
@@ -276,6 +276,8 @@ function getOperators(fieldtype, fieldname) {
   if (typeDate.includes(fieldtype)) {
     options.push(
       ...[
+        { label: __('Equals'), value: 'equals' },
+        { label: __('Not Equals'), value: 'not equals' },
         { label: __('Is'), value: 'is' },
         { label: __('>'), value: '>' },
         { label: __('<'), value: '<' },
diff --git a/frontend/src/components/ViewControls.vue b/frontend/src/components/ViewControls.vue
index f4ff3e9c..9c2a1c53 100644
--- a/frontend/src/components/ViewControls.vue
+++ b/frontend/src/components/ViewControls.vue
@@ -61,6 +61,14 @@
           :placeholder="filter.label"
           @change="(data) => applyQuickFilter(filter, data)"
         />
+        <component
+          v-else-if="['Date', 'Datetime'].includes(filter.type)"
+          class="border-none"
+          :is="filter.type === 'Date' ? DatePicker : DatetimePicker"
+          :value="filter.value"
+          @change="(v) => applyQuickFilter(filter, v)"
+          :placeholder="filter.label"
+        />
         <FormControl
           v-else
           :value="filter.value"
@@ -181,6 +189,8 @@
   </Dialog>
 </template>
 <script setup>
+import DatePicker from '@/components/Controls/DatePicker.vue'
+import DatetimePicker from '@/components/Controls/DatetimePicker.vue'
 import Link from '@/components/Controls/Link.vue'
 import RefreshIcon from '@/components/Icons/RefreshIcon.vue'
 import EditIcon from '@/components/Icons/EditIcon.vue'
@@ -444,7 +454,7 @@ const quickFilterList = computed(() => {
   filters.forEach((filter) => {
     filter['value'] = filter.type == 'Check' ? false : ''
     if (list.value.params?.filters[filter.name]) {
-      if (['Check', 'Select'].includes(filter.type)) {
+      if (['Check', 'Select', 'Date', 'Datetime'].includes(filter.type)) {
         filter['value'] = list.value.params.filters[filter.name]
       } else {
         let value = list.value.params.filters[filter.name]
@@ -467,7 +477,7 @@ function applyQuickFilter(filter, value) {
   let filters = { ...list.value.params.filters }
   let field = filter.name
   if (value) {
-    if (['Check', 'Select'].includes(filter.type)) {
+    if (['Check', 'Select', 'Date', 'Datetime'].includes(filter.type)) {
       filters[field] = value
     } else {
       filters[field] = ['LIKE', `%${value}%`]