| @@ -50,30 +50,30 @@ | |||
| <div *ngIf="Sstate1 && Sstate2" class="alarm-text" | |||
| [ngClass]="{'alarm-text-on': Sstate1 && Sstate2 }">ALARM: <br>VIBRATION ALERT</div> | |||
| <div class="tooltiptext"> | |||
| <div style="display: flex; | |||
| flex-direction: row; | |||
| justify-content: space-between; | |||
| margin-bottom: 5px"> | |||
| <div style="color: #F33152; | |||
| padding: 5px 13px; | |||
| background-color: rgba(243, 49, 82, 0.1); | |||
| border-radius: 20px; | |||
| text-align: center; | |||
| width: 120px;">Hệ thống báo động 2</div> | |||
| <a href="/overview/camera-stream" target="_blank"> | |||
| <svg width="24px" height="24px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none"> | |||
| <g stroke="currentColor" stroke-width="2"> | |||
| <path d="M16 16V8a1 1 0 00-1-1H5a1 1 0 00-1 1v8a1 1 0 001 1h10a1 1 0 001-1z"/> | |||
| <path stroke-linejoin="round" d="M20 7l-4 3v4l4 3V7z"/> | |||
| </g> | |||
| </svg> | |||
| </a> | |||
| </div> | |||
| <div><strong>Địa điểm:</strong> 120 Xa Lộ Hà Nội, Thành Phố, Thủ Đức, Thành phố Hồ Chí Minh</div> | |||
| <div><strong>Tọa độ:</strong> 10.8661° N, 106.8029° E</div> | |||
| <div><strong>Thời gian:</strong> 01:54, 01/06/2024</div> | |||
| </div> | |||
| <!-- <div class="tooltiptext">--> | |||
| <!-- <div style="display: flex;--> | |||
| <!-- flex-direction: row;--> | |||
| <!-- justify-content: space-between;--> | |||
| <!-- margin-bottom: 5px">--> | |||
| <!-- <div style="color: #F33152;--> | |||
| <!-- padding: 5px 13px;--> | |||
| <!-- background-color: rgba(243, 49, 82, 0.1);--> | |||
| <!-- border-radius: 20px;--> | |||
| <!-- text-align: center;--> | |||
| <!-- width: 120px;">Hệ thống báo động 2</div>--> | |||
| <!-- <a href="/overview/camera-stream" target="_blank">--> | |||
| <!-- <svg width="24px" height="24px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none">--> | |||
| <!-- <g stroke="currentColor" stroke-width="2">--> | |||
| <!-- <path d="M16 16V8a1 1 0 00-1-1H5a1 1 0 00-1 1v8a1 1 0 001 1h10a1 1 0 001-1z"/>--> | |||
| <!-- <path stroke-linejoin="round" d="M20 7l-4 3v4l4 3V7z"/>--> | |||
| <!-- </g>--> | |||
| <!-- </svg>--> | |||
| <!-- </a>--> | |||
| <!-- </div>--> | |||
| <!-- <div><strong>Địa điểm:</strong> 120 Xa Lộ Hà Nội, Thành Phố, Thủ Đức, Thành phố Hồ Chí Minh</div>--> | |||
| <!-- <div><strong>Tọa độ:</strong> 10.8661° N, 106.8029° E</div>--> | |||
| <!-- <div><strong>Thời gian:</strong> 01:54, 01/06/2024</div>--> | |||
| <!-- </div>--> | |||
| </div> | |||
| <div class="state t6 tooltip" id="State6"> | |||
| @@ -88,30 +88,30 @@ | |||
| </div> | |||
| <div *ngIf="Sstate1 && Sstate2" class="alarm-text" | |||
| [ngClass]="{'alarm-text-on': Sstate1 && Sstate2 }">ALARM: <br>SMOKE ALERT</div> | |||
| <div class="tooltiptext"> | |||
| <div style="display: flex; | |||
| flex-direction: row; | |||
| justify-content: space-between; | |||
| margin-bottom: 5px"> | |||
| <div style="color: #F33152; | |||
| padding: 5px 13px; | |||
| background-color: rgba(243, 49, 82, 0.1); | |||
| border-radius: 20px; | |||
| text-align: center; | |||
| width: 120px;">Hệ thống báo động 1</div> | |||
| <a href="/overview/camera-stream" target="_blank"> | |||
| <svg width="24px" height="24px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none"> | |||
| <g stroke="currentColor" stroke-width="2"> | |||
| <path d="M16 16V8a1 1 0 00-1-1H5a1 1 0 00-1 1v8a1 1 0 001 1h10a1 1 0 001-1z"/> | |||
| <path stroke-linejoin="round" d="M20 7l-4 3v4l4 3V7z"/> | |||
| </g> | |||
| </svg> | |||
| </a> | |||
| </div> | |||
| <div><strong>Địa điểm:</strong> 120 Xa Lộ Hà Nội, Thành Phố, Thủ Đức, Thành phố Hồ Chí Minh</div> | |||
| <div><strong>Tọa độ:</strong> 10.8661° N, 106.8029° E</div> | |||
| <div><strong>Thời gian:</strong> 01:54, 01/06/2024</div> | |||
| </div> | |||
| <!-- <div class="tooltiptext">--> | |||
| <!-- <div style="display: flex;--> | |||
| <!-- flex-direction: row;--> | |||
| <!-- justify-content: space-between;--> | |||
| <!-- margin-bottom: 5px">--> | |||
| <!-- <div style="color: #F33152;--> | |||
| <!-- padding: 5px 13px;--> | |||
| <!-- background-color: rgba(243, 49, 82, 0.1);--> | |||
| <!-- border-radius: 20px;--> | |||
| <!-- text-align: center;--> | |||
| <!-- width: 120px;">Hệ thống báo động 1</div>--> | |||
| <!-- <a href="/overview/camera-stream" target="_blank">--> | |||
| <!-- <svg width="24px" height="24px" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="none">--> | |||
| <!-- <g stroke="currentColor" stroke-width="2">--> | |||
| <!-- <path d="M16 16V8a1 1 0 00-1-1H5a1 1 0 00-1 1v8a1 1 0 001 1h10a1 1 0 001-1z"/>--> | |||
| <!-- <path stroke-linejoin="round" d="M20 7l-4 3v4l4 3V7z"/>--> | |||
| <!-- </g>--> | |||
| <!-- </svg>--> | |||
| <!-- </a>--> | |||
| <!-- </div>--> | |||
| <!-- <div><strong>Địa điểm:</strong> 120 Xa Lộ Hà Nội, Thành Phố, Thủ Đức, Thành phố Hồ Chí Minh</div>--> | |||
| <!-- <div><strong>Tọa độ:</strong> 10.8661° N, 106.8029° E</div>--> | |||
| <!-- <div><strong>Thời gian:</strong> 01:54, 01/06/2024</div>--> | |||
| <!-- </div>--> | |||
| </div> | |||
| <!-- <div *ngFor="let state of states; let i = index"--> | |||
| @@ -125,6 +125,7 @@ | |||
| <div fxFlex="30" fxLayout="column" fxLayoutGap="50px"> | |||
| <button [disabled]="!isConnected" mat-flat-button color="{{Sstate1 ? 'accent' : 'primary'}}" (click)="toggleState1()">{{ Sstate1 ? 'DISARM' : 'ARM'}}</button> | |||
| <button [disabled]="!isConnected" mat-flat-button color="{{Sstate2 ? 'accent' : 'primary'}}" (click)="toggleState2()">{{ Sstate2 ? 'TURN OFF WARNING' : 'TURN ON WARNING'}}</button> | |||
| <button mat-stroked-button color="primary" [routerLink]="'/overview/camera-stream'" target="_blank"> LIVE CAMERA </button> | |||
| <a style = "padding: 30px 50px;" mat-stroked-button color="primary" href="/overview/camera-stream" target="_blank"> LIVE CAMERA </a> | |||
| </div> | |||
| </div> | |||