chore: add service

taiga-family · Jul 19, 2024 · 1ec0e52 · 1ec0e52
1 parent 8b00de6
commit 1ec0e52
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 9 deletions.
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/music/music.component.html b/apps/taiga-lumbermill/src/dashboards/iot/components/music/music.component.html
@@ -30,10 +30,10 @@ <h2 class="tui-space_top-4 tui-space_bottom-2">Believer</h2>
             tuiSlider
             type="range"
             value="60"
-            [formControl]="play"
+            [formControl]="safetyForm['controls'][0]"
         />
         <div class="numbers">
-            <p class="tui-space_top-0 tui-space_bottom-0">00:013</p>
+            <p class="tui-space_top-0 tui-space_bottom-0">00:13</p>
             <p class="tui-space_top-0 tui-space_bottom-0">00:52</p>
         </div>
     </div>
@@ -52,7 +52,7 @@ <h2 class="tui-space_top-4 tui-space_bottom-2">Believer</h2>
             tuiSlider
             type="range"
             value="60"
-            [formControl]="volume"
+            [formControl]="safetyForm['controls'][1]"
             [style.color]="'var(--tui-status-info)'"
         />
         <tui-icon icon="@tui.volume-2" />

diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/music/music.component.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/music/music.component.ts
@@ -1,12 +1,12 @@
 import {CommonModule} from '@angular/common';
-import {ChangeDetectionStrategy, Component} from '@angular/core';
-import {FormControl, FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
+import {FormArray, FormControl, FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {TuiAppearance, TuiIcon, TuiTitle} from '@taiga-ui/core';
 import {TuiHeader} from '@taiga-ui/experimental';
 import {TuiSliderComponent} from '@taiga-ui/kit';
 import {TuiCardLarge} from '@taiga-ui/layout';
 
-// import {MusicService} from './music.service';
+import {MusicService} from './music.service';
 
 @Component({
     standalone: true,
@@ -27,7 +27,8 @@ import {TuiCardLarge} from '@taiga-ui/layout';
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class MusicComponent {
-    protected value = 4;
-    protected play = new FormControl(60);
-    protected volume = new FormControl(0);
+    protected musicService = inject(MusicService).musicData;
+    protected safetyForm = new FormArray(
+        this.musicService.map((item) => new FormControl(item.value)),
+    );
 }
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/music/music.service.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/music/music.service.ts
@@ -0,0 +1,18 @@
+import {Injectable} from '@angular/core';
+
+interface MusicData {
+    readonly name: string;
+    readonly value: number;
+}
+
+export const INITIAL_DATA: MusicData[] = [
+    {name: 'Play', value: 60},
+    {name: 'Volume', value: 0},
+];
+
+@Injectable({
+    providedIn: 'root',
+})
+export class MusicService {
+    public readonly musicData = INITIAL_DATA;
+}