diff --git a/src/ZB.MOM.WW.ScadaBridge.CentralUI/Components/Pages/Monitoring/EventLogs.razor b/src/ZB.MOM.WW.ScadaBridge.CentralUI/Components/Pages/Monitoring/EventLogs.razor
index 5b1366f4..83adeefb 100644
--- a/src/ZB.MOM.WW.ScadaBridge.CentralUI/Components/Pages/Monitoring/EventLogs.razor
+++ b/src/ZB.MOM.WW.ScadaBridge.CentralUI/Components/Pages/Monitoring/EventLogs.razor
@@ -56,21 +56,10 @@
                     <option>Error</option>
                 </select>
             </div>
-            <div class="col-md-2">
-                <label class="form-label small" for="filter-from">From</label>
-                <input id="filter-from"
-                       type="datetime-local"
-                       class="form-control form-control-sm"
-                       aria-label="From timestamp"
-                       @bind="_filterFrom" />
-            </div>
-            <div class="col-md-2">
-                <label class="form-label small" for="filter-to">To</label>
-                <input id="filter-to"
-                       type="datetime-local"
-                       class="form-control form-control-sm"
-                       aria-label="To timestamp"
-                       @bind="_filterTo" />
+            <div class="col-md-4">
+                <DateTimeRangeFilter From="_filterFrom" FromChanged="@(v => _filterFrom = v)"
+                                     To="_filterTo" ToChanged="@(v => _filterTo = v)"
+                                     IdPrefix="filter" />
             </div>
             <div class="col-md-1">
                 <label class="form-label small" for="filter-keyword">Message contains</label>