Add AJAX filtering for preview popover with width lock
- Convert preview filter from client-side JS to server-side AJAX - Add debounce utility function for 300ms delayed AJAX calls - Add filter handlers for all 4 preview types (tab, condition, group, filter-group) - Add filterProductIdsByQuery() method to EntityPreviewHandler - Update all AJAX handlers to support filter parameter - Lock popover width when filtering to prevent resize - Add loading overlay CSS for filter state Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -84,20 +84,55 @@
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: $es-spacing-xs;
|
||||
position: relative;
|
||||
|
||||
// Loading overlay for AJAX filtering
|
||||
&.filtering {
|
||||
pointer-events: none;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.filter-loading-overlay {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: rgba($es-white, 0.7);
|
||||
z-index: 10;
|
||||
|
||||
i {
|
||||
font-size: 20px;
|
||||
color: $es-primary;
|
||||
animation: spin 0.6s linear infinite;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Filter input section
|
||||
.preview-filter {
|
||||
padding: $es-spacing-sm $es-spacing-md;
|
||||
padding: $es-spacing-sm;
|
||||
border-bottom: 1px solid $es-border-color;
|
||||
|
||||
.preview-filter-input {
|
||||
@include input-base;
|
||||
width: 100%;
|
||||
padding: $es-spacing-sm;
|
||||
font-size: $es-font-size-sm;
|
||||
padding: $es-spacing-xs $es-spacing-sm;
|
||||
font-size: $es-font-size-xs;
|
||||
line-height: 1.4;
|
||||
color: $es-text-primary;
|
||||
background-color: $es-white;
|
||||
border: 1px solid $es-border-color;
|
||||
border-radius: $es-radius-sm;
|
||||
box-sizing: border-box;
|
||||
|
||||
&:focus {
|
||||
border-color: $es-primary;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
&::placeholder {
|
||||
color: $es-text-muted;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user