[6.x] Date filter badges use local time (#13573)

Author: jasonvarga

resources/js/components/ui/Listing/Filters.vue

@@ -164,11 +164,25 @@ function handleStackClosed() {
             :key="handle"
             variant="filled"
             :icon-append="reorderable ? null : 'x'"
-            :text="badge"
             :disabled="reorderable"
             class="last:me-12"
             @click="removeFieldFilter(handle)"
-        />
+        >
+            <template v-if="handle == 'date'">
+                {{ badge.field }}
+                {{ badge.translatedOperator }}
+                <template v-if="badge.operator === 'between'">
+                    <date-time :of="badge.value.start" options="date" />
+                    {{ __('and') }}
+                    <date-time :of="badge.value.end" options="date" />
+                </template>
+                <date-time v-else :of="badge.value" options="date" />
+            </template>
+
+            <template v-else>
+                {{ badge }}
+            </template>
+        </Button>
         <Button
             v-for="(badge, handle, index) in standardBadges"
             :key="handle"

src/Query/Scopes/Filters/Fields/Date.php

@@ -65,13 +65,16 @@ public function badge($values)
     {
         $field = $this->fieldtype->field()->display();
         $operator = $values['operator'];
-        $translatedOperator = Arr::get($this->fieldItems(), "operator.options.{$operator}");
+        $translatedOperator = strtolower(Arr::get($this->fieldItems(), "operator.options.{$operator}"));
 
-        if ($operator == 'between') {
-            return $field.' '.strtolower($translatedOperator).' '.$values['range_value']['start'].' '.__('and').' '.$values['range_value']['end'];
-        }
+        $value = ($operator == 'between')
+            ? [
+                'start' => Carbon::parse($values['range_value']['start'])->toIso8601ZuluString('millisecond'),
+                'end' => Carbon::parse($values['range_value']['end'])->toIso8601ZuluString('millisecond'),
+            ]
+            : Carbon::parse(Arr::get($values, 'value'))->toIso8601ZuluString('millisecond');
 
-        return $field.' '.strtolower($translatedOperator).' '.$values['value'];
+        return compact('field', 'operator', 'translatedOperator', 'value');
     }
 
     public function isComplete($values): bool