risadmin_prod/authsec_angular_clarity_modern
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

unified

Browse Source
This commit is contained in:
Gaurav Kumar
2025-11-04 18:47:53 +05:30
parent 1263805d61
commit 71be18b21f
2 changed files with 33 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/angular-clarity-master/src/app/modules/main/builder/dashboardnew/gadgets/unified-chart/unified-chart.component.html
View File

@@ -1,6 +1,10 @@
<div class="chart-container" *ngIf="!noDataAvailable && !isLoading">
<!-- Dynamic template container -->
<div class="dynamic-template-container" *ngIf="dynamicTemplate" [innerHTML]="dynamicTemplate"></div>
<!-- Debug: Show when dynamic template is loaded -->
<div *ngIf="dynamicTemplate" style="color: red; font-weight: bold; margin: 10px;">
DEBUG: Dynamic template loaded - check browser DevTools Elements tab to see if canvas is in DOM
</div>
<!-- Back button for drilldown navigation -->
<div class="drilldown-back" *ngIf="currentDrilldownLevel > 0">
@@ -132,7 +136,7 @@
</div> -->
<!-- Default/Unknown Chart Type -->
<div *ngIf="!['bar', 'line', 'pie', 'doughnut', 'bubble', 'radar', 'polar', 'scatter'].includes(chartType)" class="chart-canvas-container">
<div *ngIf="!dynamicTemplate && !['bar', 'line', 'pie', 'doughnut', 'bubble', 'radar', 'polar', 'scatter'].includes(chartType)" class="chart-canvas-container">
<canvas baseChart
[datasets]="chartData"
[labels]="chartLabels"

28
frontend/angular-clarity-master/src/app/modules/main/builder/dashboardnew/gadgets/unified-chart/unified-chart.component.ts
View File

@@ -85,6 +85,19 @@ export class UnifiedChartComponent implements OnInit, OnChanges, OnDestroy {
setDynamicTemplate(value: string) {
console.log('Setting dynamic template:', value);
this.dynamicTemplate = value;
// Trigger change detection to ensure the template is rendered
setTimeout(() => {
console.log('Dynamic template updated in DOM');
// Check if the canvas element exists in the DOM
const canvasElements = this.el.nativeElement.querySelectorAll('canvas');
console.log('Canvas elements found in DOM:', canvasElements.length);
if (canvasElements.length > 0) {
console.log('First canvas element:', canvasElements[0]);
// Check if it has the baseChart directive processed
const firstCanvas = canvasElements[0];
console.log('Canvas has baseChart directive processed:', firstCanvas.classList.contains('chartjs-render-monitor'));
}
}, 100);
}
constructor(
@@ -371,6 +384,21 @@ export class UnifiedChartComponent implements OnInit, OnChanges, OnDestroy {
}
}
// Initialize chart after dynamic template is rendered
private initializeDynamicChart(): void {
// This is a complex issue - Angular directives in dynamically inserted HTML
// don't get processed automatically. We would need to use a different approach
// such as creating components dynamically or using a different template mechanism.
console.log('Initializing dynamic chart - this is where we would handle chart initialization');
// NOTE: The baseChart directive in dynamically inserted HTML via [innerHTML]
// will not be processed by Angular. This is a limitation of Angular's change detection.
// Possible solutions:
// 1. Use Angular's dynamic component creation API
// 2. Modify the approach to use a different template mechanism
// 3. Keep the canvas element in the static template and only load options dynamically
}
// Check if filters are available
hasFilters(): boolean {
const hasBaseFilters = this.baseFilters && this.baseFilters.length > 0;