fix: converted queue table to gridstack widget

This commit is contained in:
2025-02-06 16:14:31 +01:00
parent 878801dfee
commit 6e2bf34773
3 changed files with 18 additions and 10 deletions

View File

@ -20,9 +20,13 @@ import { AuthInterceptor } from './core/auth.interceptor';
import { StarRatingModule } from 'angular-star-rating'; import { StarRatingModule } from 'angular-star-rating';
import { GridstackComponent } from 'gridstack/dist/angular'; import { GridstackComponent } from 'gridstack/dist/angular';
import { DeviceBoxComponent } from './device-box/device-box.component'; import { DeviceBoxComponent } from './device-box/device-box.component';
import { QueueTableComponent } from './queue-table/queue-table.component';
const gridconstructor = () => { const gridconstructor = () => {
GridstackComponent.addComponentToSelectorType([DeviceBoxComponent]); GridstackComponent.addComponentToSelectorType([
DeviceBoxComponent,
QueueTableComponent,
]);
}; };
export const appConfig: ApplicationConfig = { export const appConfig: ApplicationConfig = {

View File

@ -27,12 +27,13 @@ export class OverviewGridComponent {
{ w: 1000, c: 10 }, { w: 1000, c: 10 },
], ],
}, },
// disableResize: true, disableResize: true,
disableDrag: true,
children: [ children: [
// or call load()/addWidget() with same data // or call load()/addWidget() with same data
{ {
x: 1, x: 1,
y: 10, y: 5,
minW: 1, minW: 1,
selector: 'app-device-box', selector: 'app-device-box',
input: { device: 'samx', signal_name: 'samx' }, input: { device: 'samx', signal_name: 'samx' },
@ -45,11 +46,11 @@ export class OverviewGridComponent {
input: { device: 'samy', signal_name: 'samy' }, input: { device: 'samy', signal_name: 'samy' },
}, },
{ {
x: 3, x: 0,
y: 5, y: 0,
minW: 1, minW: 12,
selector: 'app-device-box', minH: 3,
input: { device: 'samx', signal_name: 'samx' }, selector: 'app-queue-table',
}, },
// {x:1, y:0, minW:2, selector:'app-a', input: { text: 'bar' }}, // custom input that works using BaseWidget.deserialize() Object.assign(this, w.input) // {x:1, y:0, minW:2, selector:'app-a', input: { text: 'bar' }}, // custom input that works using BaseWidget.deserialize() Object.assign(this, w.input)
// {x:2, y:0, selector:'app-b'}, // {x:2, y:0, selector:'app-b'},

View File

@ -5,6 +5,7 @@ import { MatToolbarModule } from '@angular/material/toolbar';
import { RedisConnectorService } from '../core/redis-connector.service'; import { RedisConnectorService } from '../core/redis-connector.service';
import { MessageEndpoints } from '../core/redis_endpoints'; import { MessageEndpoints } from '../core/redis_endpoints';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { BaseWidget } from 'gridstack/dist/angular';
@Component({ @Component({
selector: 'app-queue-table', selector: 'app-queue-table',
@ -12,12 +13,14 @@ import { CommonModule } from '@angular/common';
templateUrl: './queue-table.component.html', templateUrl: './queue-table.component.html',
styleUrl: './queue-table.component.scss', styleUrl: './queue-table.component.scss',
}) })
export class QueueTableComponent { export class QueueTableComponent extends BaseWidget {
tableSignal!: Signal<any>; tableSignal!: Signal<any>;
tableData!: Signal<any>; tableData!: Signal<any>;
displayedColumns: string[] = ['queue_id', 'scan_id', 'scan_number', 'status']; displayedColumns: string[] = ['queue_id', 'scan_id', 'scan_number', 'status'];
constructor(private redisConnector: RedisConnectorService) {} constructor(private redisConnector: RedisConnectorService) {
super();
}
ngOnInit(): void { ngOnInit(): void {
this.tableSignal = this.redisConnector.register( this.tableSignal = this.redisConnector.register(