config

src/app/portal-manage/dashboard-management/widgets/simple-kpi-widget/simple-kpi-widget.component.ts

@@ -38,6 +38,9 @@ export class SimpleKpiWidgetComponent extends BaseWidgetComponent {
   public trendValue: string = '';
   public trendType: string = 'percentage';
   public trendColor: string = '#28a745';
+  public trendField: string = '';
+  public trendPeriod: string = '30';
+  public trendThreshold: number = 5;
 
   // Style properties
   public fontSize: number = 16;
@@ -60,7 +63,9 @@ export class SimpleKpiWidgetComponent extends BaseWidgetComponent {
   public animationType: string = 'fade';
   public animationDuration: number = 300;
   public animationDelay: number = 0;
+  public animationEasing: string = 'ease';
   public hoverEffects: boolean = true;
+  public autoRefresh: boolean = false;
 
   // Interaction properties
   public enableTooltip: boolean = true;
@@ -159,13 +164,18 @@ export class SimpleKpiWidgetComponent extends BaseWidgetComponent {
     this.showTrend = this.configObj.showTrend || false;
     this.trendType = this.configObj.trendType || 'percentage';
     this.trendColor = this.configObj.trendColor || '#28a745';
+    this.trendField = this.configObj.trendField || '';
+    this.trendPeriod = this.configObj.trendPeriod || '30';
+    this.trendThreshold = this.configObj.trendThreshold || 5;
 
     // Animation configuration
     this.enableAnimations = this.configObj.enableAnimations !== undefined ? this.configObj.enableAnimations : true;
     this.animationType = this.configObj.animationType || 'fade';
     this.animationDuration = this.configObj.animationDuration || 300;
     this.animationDelay = this.configObj.animationDelay || 0;
+    this.animationEasing = this.configObj.animationEasing || 'ease';
     this.hoverEffects = this.configObj.hoverEffects !== undefined ? this.configObj.hoverEffects : true;
+    this.autoRefresh = this.configObj.autoRefresh !== undefined ? this.configObj.autoRefresh : false;
 
     // Interaction configuration
     this.enableTooltip = this.configObj.enableTooltip !== undefined ? this.configObj.enableTooltip : true;
@@ -387,13 +397,18 @@ export class SimpleKpiWidgetComponent extends BaseWidgetComponent {
     this.trendValue = '';
     this.trendType = 'percentage';
     this.trendColor = '#28a745';
+    this.trendField = '';
+    this.trendPeriod = '30';
+    this.trendThreshold = 5;
 
     // Animation reset
     this.enableAnimations = true;
     this.animationType = 'fade';
     this.animationDuration = 300;
     this.animationDelay = 0;
+    this.animationEasing = 'ease';
     this.hoverEffects = true;
+    this.autoRefresh = false;
 
     // Interaction reset
     this.enableTooltip = true;
@@ -484,7 +499,7 @@ export class SimpleKpiWidgetComponent extends BaseWidgetComponent {
     };
 
     return {
-      'animation': `${animationMap[this.animationType]} ${this.animationDuration}ms ease-in-out`,
+      'animation': `${animationMap[this.animationType]} ${this.animationDuration}ms ${this.animationEasing}`,
       'animation-delay': `${this.animationDelay}ms`,
       'animation-fill-mode': 'both'
     };