rohit/workflow-automation
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

dev v1.0.0

Browse Source
This commit is contained in:
rohit 2025-07-20 22:53:40 +05:30
commit a0cab8106d
50 changed files with 16573 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
.editorconfig Normal file
View File

@ -0,0 +1,17 @@
# Editor configuration, see https://editorconfig.org
root = true
[*]
charset = utf-8
indent_style = space
indent_size = 2
insert_final_newline = true
trim_trailing_whitespace = true
[*.ts]
quote_type = single
ij_typescript_use_double_quotes = false
[*.md]
max_line_length = off
trim_trailing_whitespace = false

42
.gitignore vendored Normal file
View File

@ -0,0 +1,42 @@
# See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files.
# Compiled output
/dist
/tmp
/out-tsc
/bazel-out
# Node
/node_modules
npm-debug.log
yarn-error.log
# IDEs and editors
.idea/
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace
# Visual Studio Code
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*
# Miscellaneous
/.angular/cache
.sass-cache/
/connect.lock
/coverage
/libpeerconnection.log
testem.log
/typings
# System files
.DS_Store
Thumbs.db

4
.vscode/extensions.json vendored Normal file
View File

@ -0,0 +1,4 @@
{
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=827846
"recommendations": ["angular.ng-template"]
}

20
.vscode/launch.json vendored Normal file
View File

@ -0,0 +1,20 @@
{
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "ng serve",
"type": "chrome",
"request": "launch",
"preLaunchTask": "npm: start",
"url": "http://localhost:4200/"
},
{
"name": "ng test",
"type": "chrome",
"request": "launch",
"preLaunchTask": "npm: test",
"url": "http://localhost:9876/debug.html"
}
]
}

42
.vscode/tasks.json vendored Normal file
View File

@ -0,0 +1,42 @@
{
// For more information, visit: https://go.microsoft.com/fwlink/?LinkId=733558
"version": "2.0.0",
"tasks": [
{
"type": "npm",
"script": "start",
"isBackground": true,
"problemMatcher": {
"owner": "typescript",
"pattern": "$tsc",
"background": {
"activeOnStart": true,
"beginsPattern": {
"regexp": "(.*?)"
},
"endsPattern": {
"regexp": "bundle generation complete"
}
}
}
},
{
"type": "npm",
"script": "test",
"isBackground": true,
"problemMatcher": {
"owner": "typescript",
"pattern": "$tsc",
"background": {
"activeOnStart": true,
"beginsPattern": {
"regexp": "(.*?)"
},
"endsPattern": {
"regexp": "bundle generation complete"
}
}
}
}
]
}

59
README.md Normal file
View File

@ -0,0 +1,59 @@
# IotIndustrialDashboard
This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 19.2.15.
## Development server
To start a local development server, run:
```bash
ng serve
```
Once the server is running, open your browser and navigate to `http://localhost:4200/`. The application will automatically reload whenever you modify any of the source files.
## Code scaffolding
Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
```bash
ng generate component component-name
```
For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
```bash
ng generate --help
```
## Building
To build the project run:
```bash
ng build
```
This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed.
## Running unit tests
To execute unit tests with the [Karma](https://karma-runner.github.io) test runner, use the following command:
```bash
ng test
```
## Running end-to-end tests
For end-to-end (e2e) testing, run:
```bash
ng e2e
```
Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
## Additional Resources
For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.

127
angular.json Normal file
View File

@ -0,0 +1,127 @@
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"iot-industrial-dashboard": {
"projectType": "application",
"schematics": {
"@schematics/angular:component": {
"style": "scss",
"skipTests": true
},
"@schematics/angular:class": {
"skipTests": true
},
"@schematics/angular:directive": {
"skipTests": true
},
"@schematics/angular:guard": {
"skipTests": true
},
"@schematics/angular:interceptor": {
"skipTests": true
},
"@schematics/angular:pipe": {
"skipTests": true
},
"@schematics/angular:resolver": {
"skipTests": true
},
"@schematics/angular:service": {
"skipTests": true
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:application",
"options": {
"outputPath": "dist/iot-industrial-dashboard",
"index": "src/index.html",
"browser": "src/main.ts",
"polyfills": [
"zone.js"
],
"tsConfig": "tsconfig.app.json",
"inlineStyleLanguage": "scss",
"assets": [
{
"glob": "**/*",
"input": "public"
}
],
"styles": [
"src/styles.scss"
],
"scripts": []
},
"configurations": {
"production": {
"budgets": [
{
"type": "initial",
"maximumWarning": "500kB",
"maximumError": "1MB"
},
{
"type": "anyComponentStyle",
"maximumWarning": "4kB",
"maximumError": "8kB"
}
],
"outputHashing": "all"
},
"development": {
"optimization": false,
"extractLicenses": false,
"sourceMap": true
}
},
"defaultConfiguration": "production"
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"buildTarget": "iot-industrial-dashboard:build:production"
},
"development": {
"buildTarget": "iot-industrial-dashboard:build:development"
}
},
"defaultConfiguration": "development"
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n"
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"polyfills": [
"zone.js",
"zone.js/testing"
],
"tsConfig": "tsconfig.spec.json",
"inlineStyleLanguage": "scss",
"assets": [
{
"glob": "**/*",
"input": "public"
}
],
"styles": [
"src/styles.scss"
],
"scripts": []
}
}
}
}
},
"cli": {
"analytics": false
}
}

14423
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

39
package.json Normal file
View File

@ -0,0 +1,39 @@
{
"name": "iot-industrial-dashboard",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"test": "ng test"
},
"private": true,
"dependencies": {
"@angular/common": "^19.2.0",
"@angular/compiler": "^19.2.0",
"@angular/core": "^19.2.0",
"@angular/forms": "^19.2.0",
"@angular/platform-browser": "^19.2.0",
"@angular/platform-browser-dynamic": "^19.2.0",
"@angular/router": "^19.2.0",
"@fortawesome/fontawesome-free": "^6.7.2",
"chart.js": "^4.5.0",
"rxjs": "~7.8.0",
"tslib": "^2.3.0",
"zone.js": "~0.15.0"
},
"devDependencies": {
"@angular-devkit/build-angular": "^19.2.15",
"@angular/cli": "^19.2.15",
"@angular/compiler-cli": "^19.2.0",
"@types/jasmine": "~5.1.0",
"jasmine-core": "~5.6.0",
"karma": "~6.4.0",
"karma-chrome-launcher": "~3.2.0",
"karma-coverage": "~2.2.0",
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.1.0",
"typescript": "~5.7.2"
}
}

BIN
public/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 15 KiB

1248
public/index.html Normal file
View File

File diff suppressed because it is too large Load Diff

65
src/app/alerts/alerts.component.html Normal file
View File

@ -0,0 +1,65 @@
<h1 class="page-title">Real-time Alerts Management</h1>
<div class="dashboard-grid">
<div class="card large-card">
<div class="card-header">
<h3 class="card-title">Active Alerts</h3>
<div class="card-icon alerts">
<i class="fas fa-exclamation-triangle"></i>
</div>
</div>
<div>
<div class="alert-item critical">
<div class="alert-icon">
<i class="fas fa-thermometer-three-quarters"></i>
</div>
<div class="alert-content">
<div class="alert-title">Critical Temperature Alert</div>
<div class="alert-time">Boiler Unit #3 - Temperature: 85°C (Threshold: 75°C) - 2 min ago</div>
</div>
<button class="action-btn danger">Acknowledge</button>
</div>
<div class="alert-item warning">
<div class="alert-icon" style="background: #ffa502;">
<i class="fas fa-bolt"></i>
</div>
<div class="alert-content">
<div class="alert-title">Power Fluctuation Warning</div>
<div class="alert-time">Generator A - Voltage: 215V (Normal: 220V±5V) - 5 min ago</div>
</div>
<button class="action-btn">Investigate</button>
</div>
<div class="alert-item info">
<div class="alert-icon" style="background: #00d4ff;">
<i class="fas fa-wifi"></i>
</div>
<div class="alert-content">
<div class="alert-title">Connection Restored</div>
<div class="alert-time">Sensor Array B - Connection re-established - 8 min ago</div>
</div>
<button class="action-btn success">Clear</button>
</div>
</div>
</div>
<div class="card">
<div class="card-header">
<h3 class="card-title">Alert Statistics</h3>
<div class="card-icon" style="background: linear-gradient(45deg, #a55eea, #26de81);">
<i class="fas fa-chart-pie"></i>
</div>
</div>
<div style="margin-top: 20px;">
<div style="display: flex; justify-content: space-between; margin-bottom: 10px;">
<span>Critical</span>
<span style="color: #ff4757;">12</span>
</div>
<div style="display: flex; justify-content: space-between; margin-bottom: 10px;">
<span>Warning</span>
<span style="color: #ffa502;">28</span>
</div>
<div style="display: flex; justify-content: space-between; margin-bottom: 10px;">
<span>Info</span>
<span style="color: #00d4ff;">45</span>
</div>
</div>
</div>
</div>

0
src/app/alerts/alerts.component.scss Normal file
View File

8
src/app/alerts/alerts.component.ts Normal file
View File

@ -0,0 +1,8 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-alerts',
templateUrl: './alerts.component.html',
styleUrls: ['./alerts.component.scss']
})
export class AlertsComponent {}

1
src/app/analytics/analytics.component.html Normal file
View File

@ -0,0 +1 @@
<p>analytics works!</p>

0
src/app/analytics/analytics.component.scss Normal file
View File

8
src/app/analytics/analytics.component.ts Normal file
View File

@ -0,0 +1,8 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-analytics',
templateUrl: './analytics.component.html',
styleUrls: ['./analytics.component.scss']
})
export class AnalyticsComponent {}

7
src/app/app.component.html Normal file
View File

@ -0,0 +1,7 @@
<div class="dashboard-container">
<app-sidebar></app-sidebar>
<app-header></app-header>
<main class="main-content">
<router-outlet></router-outlet>
</main>
</div>

0
src/app/app.component.scss Normal file
View File

11
src/app/app.component.ts Normal file
View File

@ -0,0 +1,11 @@
import { Component } from '@angular/core';
import { RouterOutlet } from '@angular/router';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent {
title = 'iot-industrial-dashboard';
}

8
src/app/app.config.ts Normal file
View File

@ -0,0 +1,8 @@
import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
import { provideRouter } from '@angular/router';
import { routes } from './app.routes';
export const appConfig: ApplicationConfig = {
providers: [provideZoneChangeDetection({ eventCoalescing: true }), provideRouter(routes)]
};

46
src/app/app.module.ts Normal file
View File

@ -0,0 +1,46 @@
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { RouterModule, Routes } from '@angular/router';
import { AppComponent } from './app.component';
import { SidebarComponent } from './layout/sidebar/sidebar.component';
import { HeaderComponent } from './layout/header/header.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { AlertsComponent } from './alerts/alerts.component';
import { SuggestionsComponent } from './suggestions/suggestions.component';
import { HealingComponent } from './healing/healing.component';
import { DevicesComponent } from './devices/devices.component';
import { AnalyticsComponent } from './analytics/analytics.component';
import { ProfileComponent } from './profile/profile.component';
const routes: Routes = [
{ path: '', redirectTo: 'dashboard', pathMatch: 'full' },
{ path: 'dashboard', component: DashboardComponent },
{ path: 'alerts', component: AlertsComponent },
{ path: 'suggestions', component: SuggestionsComponent },
{ path: 'healing', component: HealingComponent },
{ path: 'devices', component: DevicesComponent },
{ path: 'analytics', component: AnalyticsComponent },
{ path: 'profile', component: ProfileComponent },
];
@NgModule({
declarations: [
AppComponent,
SidebarComponent,
HeaderComponent,
DashboardComponent,
AlertsComponent,
SuggestionsComponent,
HealingComponent,
DevicesComponent,
AnalyticsComponent,
ProfileComponent
],
imports: [
BrowserModule,
RouterModule.forRoot(routes)
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }

19
src/app/app.routes.ts Normal file
View File

@ -0,0 +1,19 @@
import { Routes } from '@angular/router';
import { DashboardComponent } from './dashboard/dashboard.component';
import { AlertsComponent } from './alerts/alerts.component';
import { SuggestionsComponent } from './suggestions/suggestions.component';
import { HealingComponent } from './healing/healing.component';
import { DevicesComponent } from './devices/devices.component';
import { AnalyticsComponent } from './analytics/analytics.component';
import { ProfileComponent } from './profile/profile.component';
export const routes: Routes = [
{ path: '', redirectTo: 'dashboard', pathMatch: 'full' },
{ path: 'dashboard', component: DashboardComponent },
{ path: 'alerts', component: AlertsComponent },
{ path: 'suggestions', component: SuggestionsComponent },
{ path: 'healing', component: HealingComponent },
{ path: 'devices', component: DevicesComponent },
{ path: 'analytics', component: AnalyticsComponent },
{ path: 'profile', component: ProfileComponent },
];

56
src/app/dashboard/dashboard.component.html Normal file
View File

@ -0,0 +1,56 @@
<h1 class="page-title">Industrial IoT Dashboard</h1>
<div class="dashboard-grid">
<!-- System Overview Card -->
<div class="card">
<div class="card-header">
<h3 class="card-title">System Overview</h3>
<div class="card-icon" style="background: linear-gradient(45deg, #00d4ff, #0078ff);">
<i class="fas fa-chart-line"></i>
</div>
</div>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 20px;">
<div style="text-align: center; padding: 15px; background: rgba(255,255,255,0.05); border-radius: 10px;">
<div class="metric-value">98.7%</div>
<div class="metric-label">System Uptime</div>
</div>
<div style="text-align: center; padding: 15px; background: rgba(255,255,255,0.05); border-radius: 10px;">
<div class="metric-value">156</div>
<div class="metric-label">Active Devices</div>
</div>
</div>
</div>
<!-- Recent Alerts Preview -->
<div class="card">
<div class="card-header">
<h3 class="card-title">Recent Alerts</h3>
<div class="card-icon alerts">
<i class="fas fa-bell"></i>
</div>
</div>
<div>
<div class="alert-item critical">
<div class="alert-icon">
<i class="fas fa-thermometer-three-quarters"></i>
</div>
<div class="alert-content">
<div class="alert-title">Critical Temperature</div>
<div class="alert-time">Boiler Unit #3 - 2 min ago</div>
</div>
</div>
</div>
</div>
<!-- Real-time Performance Chart Card -->
<div class="card large-card">
<div class="card-header">
<h3 class="card-title">Real-time Performance Chart</h3>
<div class="card-icon" style="background: linear-gradient(45deg, #2ed573, #1e90ff);">
<i class="fas fa-chart-area"></i>
</div>
</div>
<div style="height: 300px; background: rgba(255,255,255,0.03); border-radius: 10px; margin-top: 20px; display: flex; align-items: center;">
<canvas id="performanceChart" width="600" height="220"></canvas>
</div>
</div>
</div>

0
src/app/dashboard/dashboard.component.scss Normal file
View File

45
src/app/dashboard/dashboard.component.ts Normal file
View File

@ -0,0 +1,45 @@
import { Component, AfterViewInit } from '@angular/core';
import Chart from 'chart.js/auto';
@Component({
selector: 'app-dashboard',
templateUrl: './dashboard.component.html',
styleUrls: ['./dashboard.component.scss']
})
export class DashboardComponent implements AfterViewInit {
ngAfterViewInit(): void {
const ctx = (document.getElementById('performanceChart') as HTMLCanvasElement)?.getContext('2d');
if (ctx) {
const chartData = {
labels: Array.from({length: 30}, (_, i) => ''),
datasets: [
{
label: 'Temperature (°C)',
data: Array.from({length: 30}, () => Math.floor(Math.random() * 10) + 20),
borderColor: '#ff6384',
backgroundColor: 'rgba(255,99,132,0.08)',
tension: 0.4,
fill: true,
}
]
};
const perfChart = new Chart(ctx, {
type: 'line',
data: chartData,
options: {
responsive: true,
plugins: { legend: { display: true, labels: { color: '#fff', font: { size: 14 } } } },
scales: {
y: { min: 10, max: 40, ticks: { color: '#fff' }, grid: { color: '#333' } },
x: { display: false }
}
}
});
setInterval(() => {
chartData.datasets[0].data.push(Math.floor(Math.random() * 10) + 20);
chartData.datasets[0].data.shift();
perfChart.update();
}, 1500);
}
}
}

1
src/app/devices/devices.component.html Normal file
View File

@ -0,0 +1 @@
<p>devices works!</p>

0
src/app/devices/devices.component.scss Normal file
View File

8
src/app/devices/devices.component.ts Normal file
View File

@ -0,0 +1,8 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-devices',
templateUrl: './devices.component.html',
styleUrls: ['./devices.component.scss']
})
export class DevicesComponent {}

1
src/app/healing/healing.component.html Normal file
View File

@ -0,0 +1 @@
<p>healing works!</p>

0
src/app/healing/healing.component.scss Normal file
View File

8
src/app/healing/healing.component.ts Normal file
View File

@ -0,0 +1,8 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-healing',
templateUrl: './healing.component.html',
styleUrls: ['./healing.component.scss']
})
export class HealingComponent {}

16
src/app/layout/header/header.component.html Normal file
View File

@ -0,0 +1,16 @@
<header class="header">
<div class="logo">
<i class="fas fa-microchip"></i> IoT Control Hub
</div>
<div class="header-right">
<div class="notification-bell" tabindex="0" aria-label="Notifications">
<i class="fas fa-bell"></i>
<span class="notification-badge" id="notificationBadge">3</span>
</div>
<div class="user-profile" tabindex="0" aria-label="Profile">
<div class="avatar">AG</div>
<span>Admin Giri</span>
<i class="fas fa-chevron-down"></i>
</div>
</div>
</header>

0
src/app/layout/header/header.component.scss Normal file
View File

8
src/app/layout/header/header.component.ts Normal file
View File

@ -0,0 +1,8 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-header',
templateUrl: './header.component.html',
styleUrls: ['./header.component.scss']
})
export class HeaderComponent {}

46
src/app/layout/sidebar/sidebar.component.html Normal file
View File

@ -0,0 +1,46 @@
<nav class="sidebar">
<ul class="nav-menu">
<li class="nav-item">
<a class="nav-link" routerLink="/dashboard" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }">
<i class="fas fa-tachometer-alt"></i>
Dashboard
</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLink="/alerts" routerLinkActive="active">
<i class="fas fa-exclamation-triangle"></i>
Real-time Alerts
</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLink="/suggestions" routerLinkActive="active">
<i class="fas fa-lightbulb"></i>
AI Suggestions
</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLink="/healing" routerLinkActive="active">
<i class="fas fa-magic"></i>
Self Healing
</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLink="/devices" routerLinkActive="active">
<i class="fas fa-cogs"></i>
Device Config
</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLink="/analytics" routerLinkActive="active">
<i class="fas fa-chart-bar"></i>
Analytics
</a>
</li>
<li class="nav-item">
<a class="nav-link" routerLink="/profile" routerLinkActive="active">
<i class="fas fa-user-cog"></i>
Profile Settings
</a>
</li>
</ul>
</nav>

52
src/app/layout/sidebar/sidebar.component.scss Normal file
View File

@ -0,0 +1,52 @@
.sidebar {
grid-area: sidebar;
background: #15171e;
backdrop-filter: blur(10px);
border-right: 1.5px solid #232837;
padding: 30px 0;
animation: slideRight 0.6s ease-out;
position: fixed;
left: 0;
top: 0;
width: 300px;
height: 100vh;
z-index: 1000;
box-shadow: 4px 0 24px 0 rgba(0, 0, 0, 0.12);
overflow: hidden;
}
@keyframes slideRight {
from { transform: translateX(-100%); }
to { transform: translateX(0); }
}
.nav-menu {
list-style: none;
margin-top: 80px;
}
.nav-item {
margin: 5px 0;
}
.nav-link {
display: flex;
align-items: center;
padding: 15px 25px;
color: #b0bec5;
text-decoration: none;
transition: all 0.2s cubic-bezier(.4,0,.2,1);
border-left: 3px solid transparent;
cursor: pointer;
font-size: 1.08rem;
letter-spacing: 0.02em;
position: relative;
}
.nav-link.active, .nav-link:hover {
color: #00eaff;
background: rgba(0, 234, 255, 0.08);
border-left-color: #00eaff;
box-shadow: 0 2px 12px 0 rgba(0,234,255,0.04);
}
.nav-link i {
margin-right: 15px;
font-size: 18px;
width: 20px;
filter: drop-shadow(0 1px 2px #00eaff22);
}

8
src/app/layout/sidebar/sidebar.component.ts Normal file
View File

@ -0,0 +1,8 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-sidebar',
templateUrl: './sidebar.component.html',
styleUrls: ['./sidebar.component.scss']
})
export class SidebarComponent {}

1
src/app/profile/profile.component.html Normal file
View File

@ -0,0 +1 @@
<p>profile works!</p>

0
src/app/profile/profile.component.scss Normal file
View File

8
src/app/profile/profile.component.ts Normal file
View File

@ -0,0 +1,8 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-profile',
templateUrl: './profile.component.html',
styleUrls: ['./profile.component.scss']
})
export class ProfileComponent {}

37
src/app/suggestions/suggestions.component.html Normal file
View File

@ -0,0 +1,37 @@
<h1 class="page-title">AI-Powered Suggestions</h1>
<div class="dashboard-grid">
<div class="card large-card">
<div class="card-header">
<h3 class="card-title">Optimization Recommendations</h3>
<div class="card-icon suggestions">
<i class="fas fa-lightbulb"></i>
</div>
</div>
<div style="margin-top: 20px;">
<div style="padding: 20px; margin: 15px 0; border-radius: 10px; background: linear-gradient(45deg, rgba(255, 165, 2, 0.1), rgba(255, 99, 72, 0.1)); border: 1px solid rgba(255, 165, 2, 0.3);">
<h4 style="color: #ffa502; margin-bottom: 10px;">🔥 High Priority: Energy Optimization</h4>
<p style="color: #ccc; margin-bottom: 15px;">Based on usage patterns, you can reduce energy consumption by 23% by implementing smart scheduling during off-peak hours (2 AM - 6 AM).</p>
<div style="display: flex; gap: 10px;">
<button class="btn-primary">Implement</button>
<button class="action-btn">Schedule Later</button>
</div>
</div>
<div style="padding: 20px; margin: 15px 0; border-radius: 10px; background: linear-gradient(45deg, rgba(46, 213, 115, 0.1), rgba(30, 144, 255, 0.1)); border: 1px solid rgba(46, 213, 115, 0.3);">
<h4 style="color: #2ed573; margin-bottom: 10px;">⚙️ Predictive Maintenance Alert</h4>
<p style="color: #ccc; margin-bottom: 15px;">Motor Unit #7 showing abnormal vibration patterns. Schedule maintenance within 72 hours to prevent failure.</p>
<div style="display: flex; gap: 10px;">
<button class="btn-primary">Schedule Maintenance</button>
<button class="action-btn">View Details</button>
</div>
</div>
<div style="padding: 20px; margin: 15px 0; border-radius: 10px; background: linear-gradient(45deg, rgba(0, 212, 255, 0.1), rgba(0, 120, 255, 0.1)); border: 1px solid rgba(0, 212, 255, 0.3);">
<h4 style="color: #00d4ff; margin-bottom: 10px;">📊 Performance Enhancement</h4>
<p style="color: #ccc; margin-bottom: 15px;">Adjust pressure settings in Hydraulic System C to improve efficiency by 15%. Optimal pressure: 1.8 bar (current: 2.2 bar).</p>
<div style="display: flex; gap: 10px;">
<button class="btn-primary">Adjust Now</button>
<button class="action-btn">View Details</button>
</div>
</div>
</div>
</div>
</div>

0
src/app/suggestions/suggestions.component.scss Normal file
View File

8
src/app/suggestions/suggestions.component.ts Normal file
View File

@ -0,0 +1,8 @@
import { Component } from '@angular/core';
@Component({
selector: 'app-suggestions',
templateUrl: './suggestions.component.html',
styleUrls: ['./suggestions.component.scss']
})
export class SuggestionsComponent {}

13
src/index.html Normal file
View File

@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>IotIndustrialDashboard</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
</html>

5
src/main.ts Normal file
View File

@ -0,0 +1,5 @@
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.error(err));

1
src/styles.scss Normal file
View File

@ -0,0 +1 @@
/* You can add global styles to this file, and also import other style files */

15
tsconfig.app.json Normal file
View File

@ -0,0 +1,15 @@
/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/app",
"types": []
},
"files": [
"src/main.ts"
],
"include": [
"src/**/*.d.ts"
]
}

27
tsconfig.json Normal file
View File

@ -0,0 +1,27 @@
/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"skipLibCheck": true,
"isolatedModules": true,
"esModuleInterop": true,
"experimentalDecorators": true,
"moduleResolution": "bundler",
"importHelpers": true,
"target": "ES2022",
"module": "ES2022"
},
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": true
}
}

15
tsconfig.spec.json Normal file
View File

@ -0,0 +1,15 @@
/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/spec",
"types": [
"jasmine"
]
},
"include": [
"src/**/*.spec.ts",
"src/**/*.d.ts"
]
}