Skip to content

P
portal-apps-manage
Commit 9e284e22 by Ooh-Ao
Options

dashboard

parent 19610b18
Showing with 502 additions and 2882 deletions
angular.json
......@@ -64,8 +64,8 @@
"./node_modules/font-awesome/css/font-awesome.css"
],
"scripts": [
"node_modules/preline/dist/preline.js",
"node_modules/apexcharts/dist/apexcharts.min.js"]
"node_modules/preline/dist/preline.js"
]
},
"configurations": {
"production": {
......
package-lock.json
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json
......@@ -30,7 +30,7 @@
"@fortawesome/angular-fontawesome": "^0.14.1",
"@kolkov/angular-editor": "^3.0.0-beta.0",
"@ks89/angular-modal-gallery": "^11.1.1",
"@ng-bootstrap/ng-bootstrap": "^15.1.1",
"@ng-bootstrap/ng-bootstrap": "^16.0.0",
"@ng-select/ng-select": "^12.0.6",
"@ngx-translate/core": "^15.0.0",
"@ngx-translate/http-loader": "^8.0.0",
......@@ -39,6 +39,7 @@
"@syncfusion/ej2-angular-dropdowns": "^29.2.4",
"@syncfusion/ej2-angular-grids": "^29.2.4",
"@syncfusion/ej2-angular-inputs": "^29.2.4",
"@syncfusion/ej2-angular-layouts": "^29.2.4",
"@syncfusion/ej2-angular-pivotview": "^29.2.4",
"@syncfusion/ej2-base": "^29.2.4",
"@syncfusion/ej2-buttons": "^29.2.4",
......@@ -68,7 +69,6 @@
"keen-slider": "^6.8.6",
"leaflet": "^1.9.4",
"moment": "^2.30.1",
"ng-apexcharts": "^1.8.0",
"ng-drag-drop": "^5.0.0",
"ng-gallery": "^11.0.0",
"ng2-charts": "^5.0.4",
......
src/app/DPU/company-management/home-installer/home-installer.component.ts
import { CommonModule } from '@angular/common';
import { Component, OnInit } from '@angular/core';
import { NgApexchartsModule } from 'ng-apexcharts';
import { SharedModule } from '../../../shared/shared.module';
import { TranslateModule } from '@ngx-translate/core';
import { ActivatedRoute, Router } from '@angular/router';
......@@ -11,7 +10,7 @@ import { TokenService } from '../../../shared/services/token.service';
selector: 'app-home-installer',
templateUrl: './home-installer.component.html',
standalone: true,
imports: [CommonModule, SharedModule, NgApexchartsModule, TranslateModule],
imports: [CommonModule, SharedModule, TranslateModule],
styleUrls: ['./home-installer.component.css']
})
export class HomeInstallerComponent implements OnInit {
......
src/app/DPU/dashboard-management/dashboard-management.component.html 0 → 100644
<div class="flex h-screen">
<!-- Widget Sidebar -->
<div class="w-64 bg-gray-100 p-4 overflow-y-auto">
<h2 class="text-lg font-bold mb-4">Available Widgets</h2>
<div *ngFor="let widget of availableWidgets"
class="p-2 mb-2 bg-white rounded shadow cursor-pointer hover:bg-gray-200"
(click)="addWidgetToDashboard(widget)">
{{ widget.name }}
</div>
</div>
<!-- Dashboard Area -->
<div class="flex-1 flex flex-col">
<div class="p-4 bg-white border-b border-gray-200 flex justify-between items-center">
<h1 class="text-xl font-bold">Dashboard Management for {{ appName | titlecase }}</h1>
<button (click)="saveLayout()" class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded">
Save Layout
</button>
</div>
<div class="flex-1 p-4 overflow-auto">
<ejs-dashboardlayout #dashboard id='dashboard_layout' [columns]="6" [cellSpacing]="cellSpacing" [panels]="panels">
<!-- Note: Dynamic component rendering inside panels requires more advanced setup -->
<!-- This template uses a simple placeholder in the content -->
</ejs-dashboardlayout>
</div>
</div>
</div>
\ No newline at end of file
src/app/DPU/dashboard-management/dashboard-management.component.scss 0 → 100644
/* Add any specific styles for the dashboard management component here */
.e-dashboardlayout .e-panel .e-panel-container .e-panel-header {
font-size: 16px;
font-weight: bold;
}
/* Basic styling for the placeholder content */
.e-dashboardlayout .e-panel .e-panel-container .e-panel-content {
padding: 10px;
text-align: center;
font-style: italic;
color: #888;
}
\ No newline at end of file
src/app/DPU/dashboard-management/dashboard-management.component.ts 0 → 100644
import { Component, OnInit, ViewChild } from '@angular/core';
import { ActivatedRoute, RouterModule } from '@angular/router';
import { DashboardLayoutComponent, DashboardLayoutModule, PanelModel } from '@syncfusion/ej2-angular-layouts';
import { DashboardService } from '../../shared/services/dashboard.service';
import { DashboardLayout, Widget } from '../../shared/models/dashboard.model';
import { switchMap } from 'rxjs/operators';
import { CommonModule, TitleCasePipe } from '@angular/common';
@Component({
selector: 'app-dashboard-management',
standalone: true,
imports: [CommonModule, RouterModule, DashboardLayoutModule, TitleCasePipe],
templateUrl: './dashboard-management.component.html',
styleUrls: ['./dashboard-management.component.scss']
})
export class DashboardManagementComponent implements OnInit {
@ViewChild('dashboard') dashboardComponent!: DashboardLayoutComponent;
public panels: PanelModel[] = [];
public cellSpacing: number[] = [10, 10];
public availableWidgets: Widget[] = [];
private appName: string = '';
private dashboardData!: DashboardLayout;
constructor(
private dashboardService: DashboardService,
private route: ActivatedRoute
) { }
ngOnInit(): void {
this.appName = this.route.snapshot.paramMap.get('appName') || '';
if (this.appName) {
// For simplicity, we'll load the first dashboard for the app
// In a real app, you would have a list of dashboards to choose from
this.dashboardService.getDashboards(this.appName).pipe(
switchMap(dashboards => {
if (dashboards.length > 0) {
return this.dashboardService.getDashboardLayout(dashboards[0].id);
} else {
// Create a new dashboard if none exist
const newDashboard: DashboardLayout = {
id: `dash-${this.appName}-${Date.now()}`,
appName: this.appName,
name: `${this.appName} Dashboard`,
widgets: []
};
return this.dashboardService.saveDashboardLayout(newDashboard);
}
})
).subscribe(dashboard => {
if (dashboard) {
this.dashboardData = dashboard;
this.panels = this.mapWidgetsToPanels(dashboard.widgets);
}
});
// Load widgets available for this app
this.dashboardService.getWidgets(this.appName).subscribe(widgets => {
this.availableWidgets = widgets;
});
}
}
mapWidgetsToPanels(widgets: Widget[]): PanelModel[] {
return widgets.map(widget => ({
id: widget.id,
header: widget.name,
content: `<div id='${widget.component}'></div>`, // Placeholder for component rendering
sizeX: widget.cols,
sizeY: widget.rows,
row: widget.y,
col: widget.x
}));
}
saveLayout(): void {
if (!this.dashboardData) return;
const updatedWidgets: Widget[] = this.dashboardComponent.panels.map(panel => {
const baseWidget = this.dashboardData.widgets.find(w => w.id === panel.id) ||
this.availableWidgets.find(w => w.id === panel.id);
return {
...baseWidget!,
id: panel.id!,
cols: panel.sizeX!,
rows: panel.sizeY!,
y: panel.row!,
x: panel.col!
};
});
this.dashboardData.widgets = updatedWidgets;
this.dashboardService.saveDashboardLayout(this.dashboardData).subscribe(() => {
alert('Dashboard saved successfully!');
});
}
addWidgetToDashboard(widget: Widget): void {
const newPanel: PanelModel = this.mapWidgetsToPanels([widget])[0];
this.dashboardComponent.addPanel(newPanel);
}
}
\ No newline at end of file
src/app/DPU/dashboard-viewer/dashboard-viewer.component.html 0 → 100644
<div class="container mx-auto p-4">
<h2 class="text-2xl font-bold mb-4">Viewing Dashboard: {{ dashboardName }}</h2>
<div class="control-section">
<ejs-dashboardlayout id='dashboard_viewer' #viewerLayout [cellSpacing]="cellSpacing" [panels]="panels" [columns]="6">
</ejs-dashboardlayout>
</div>
</div>
src/app/DPU/dashboard-viewer/dashboard-viewer.component.scss 0 → 100644
/* Add custom styles for your dashboard viewer component here */
src/app/DPU/dashboard-viewer/dashboard-viewer.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ActivatedRoute, RouterModule } from '@angular/router';
import { DashboardLayoutModule, PanelModel } from '@syncfusion/ej2-angular-layouts';
import { DashboardService } from '../../shared/services/dashboard.service';
import { DashboardLayout, Widget } from '../../shared/models/dashboard.model'; // Correctly import DashboardLayout and Widget
import { map, switchMap } from 'rxjs/operators';
import { of } from 'rxjs';
@Component({
selector: 'app-dashboard-viewer',
standalone: true,
imports: [CommonModule, RouterModule, DashboardLayoutModule],
templateUrl: './dashboard-viewer.component.html',
styleUrls: ['./dashboard-viewer.component.scss']
})
export class DashboardViewerComponent implements OnInit {
public panels: PanelModel[] = [];
public cellSpacing: number[] = [10, 10];
public dashboardName: string = '';
constructor(
private route: ActivatedRoute,
private dashboardService: DashboardService
) { }
ngOnInit(): void {
this.route.paramMap.pipe(
map(params => params.get('dashboardId')), // Changed from 'id' to 'dashboardId' to match routing
switchMap(id => {
if (!id) {
// If no ID, return an observable of null or a default dashboard
console.error('Dashboard ID is missing from the route.');
return of(null);
}
// Use the correct service method
return this.dashboardService.getDashboardLayout(id);
})
).subscribe(dashboard => {
if (dashboard) {
this.loadDashboard(dashboard);
}
});
}
loadDashboard(dashboard: DashboardLayout): void {
this.dashboardName = dashboard.name;
// Map widgets from the layout to Syncfusion PanelModels
this.panels = dashboard.widgets.map((widget: Widget) => ({
id: widget.id,
row: widget.y,
col: widget.x,
sizeX: widget.cols,
sizeY: widget.rows,
header: widget.name,
content: `<div id='${widget.component}'></div>` // Placeholder for component rendering
}));
}
}
src/app/DPU/dpu.routes.ts 0 → 100644
import { Routes } from '@angular/router';
import { DashboardManagementComponent } from './dashboard-management/dashboard-management.component';
import { DashboardViewerComponent } from './dashboard-viewer/dashboard-viewer.component';
import { WidgetListComponent } from './widget-management/widget-list.component';
import { WidgetFormComponent } from './widget-management/widget-form.component';
export const dpuRoutes: Routes = [
// Dynamic route for dashboard management per application
{
path: ':appName/dashboard-management',
component: DashboardManagementComponent,
},
// Dynamic routes for widget warehouse per application
{
path: ':appName/widget-warehouse',
component: WidgetListComponent,
},
{
path: ':appName/widget-warehouse/edit/:widgetId',
component: WidgetFormComponent,
},
// Route for viewing a specific dashboard, remains unchanged
{
path: 'dashboard-viewer/:dashboardId',
component: DashboardViewerComponent
},
// Optional: A redirect for the base dpu path
// {
// path: '',
// redirectTo: 'myhr-plus/dashboard-management', // Default to one app
// pathMatch: 'full'
// }
];
src/app/DPU/widget-management/widget-form.component.html 0 → 100644
<div class="container mx-auto p-6">
<h1 class="text-2xl font-bold mb-4">{{ isNew ? 'Add New Widget' : 'Edit Widget' }}</h1>
<form [formGroup]="widgetForm" (ngSubmit)="onSubmit()" class="bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4">
<!-- Widget Name -->
<div class="mb-4">
<label class="block text-gray-700 text-sm font-bold mb-2" for="name">
Widget Name
</label>
<input formControlName="name" id="name" type="text" placeholder="e.g., Company News"
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
<!-- Component Name -->
<div class="mb-4">
<label class="block text-gray-700 text-sm font-bold mb-2" for="component">
Angular Component Name
</label>
<input formControlName="component" id="component" type="text" placeholder="e.g., CompanyNewsComponent"
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
<!-- Sizing -->
<div class="flex flex-wrap -mx-3 mb-4">
<div class="w-full md:w-1/2 px-3 mb-4 md:mb-0">
<label class="block text-gray-700 text-sm font-bold mb-2" for="cols">
Default Columns
</label>
<input formControlName="cols" id="cols" type="number" min="1"
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
<div class="w-full md:w-1/2 px-3">
<label class="block text-gray-700 text-sm font-bold mb-2" for="rows">
Default Rows
</label>
<input formControlName="rows" id="rows" type="number" min="1"
class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
</div>
<!-- Action Buttons -->
<div class="flex items-center justify-end">
<button (click)="cancel()" type="button" class="bg-gray-500 hover:bg-gray-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline mr-2">
Cancel
</button>
<button type="submit" [disabled]="widgetForm.invalid" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline disabled:bg-gray-400">
Save Widget
</button>
</div>
</form>
</div>
src/app/DPU/widget-management/widget-form.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
import { ActivatedRoute, Router, RouterModule } from '@angular/router';
import { DashboardService } from '../../shared/services/dashboard.service';
import { Widget } from '../../shared/models/dashboard.model';
import { CommonModule } from '@angular/common';
@Component({
selector: 'app-widget-form',
standalone: true,
imports: [CommonModule, RouterModule, ReactiveFormsModule],
templateUrl: './widget-form.component.html',
})
export class WidgetFormComponent implements OnInit {
widgetForm!: FormGroup;
isNew = true;
widgetId: string | null = null;
appName: string = '';
constructor(
private fb: FormBuilder,
private dashboardService: DashboardService,
private route: ActivatedRoute,
private router: Router
) { }
ngOnInit(): void {
this.appName = this.route.snapshot.paramMap.get('appName') || '';
this.widgetId = this.route.snapshot.paramMap.get('widgetId');
this.widgetForm = this.fb.group({
id: [null],
name: ['', Validators.required],
component: ['', Validators.required],
cols: [1, [Validators.required, Validators.min(1)]],
rows: [1, [Validators.required, Validators.min(1)]],
x: [0],
y: [0]
});
if (this.widgetId && this.widgetId !== 'new') {
this.isNew = false;
this.dashboardService.getWidget(this.widgetId).subscribe(widget => {
if (widget) {
this.widgetForm.patchValue(widget);
}
});
}
}
onSubmit(): void {
if (this.widgetForm.invalid) {
return;
}
const widgetData: Widget = this.widgetForm.value;
this.dashboardService.saveWidget(widgetData).subscribe(() => {
this.router.navigate(['/dpu', this.appName, 'widget-warehouse']);
});
}
cancel(): void {
this.router.navigate(['/dpu', this.appName, 'widget-warehouse']);
}
}
src/app/DPU/widget-management/widget-list.component.html 0 → 100644
<div class="container mx-auto p-6">
<div class="flex justify-between items-center mb-4">
<h1 class="text-2xl font-bold">Widget Warehouse for {{ appName | titlecase }}</h1>
<button (click)="addNewWidget()" class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">
Add New Widget
</button>
</div>
<div class="bg-white shadow-md rounded my-6">
<table class="min-w-full table-auto">
<thead class="bg-gray-200">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Widget Name</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Component</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Default Size (Cols x Rows)</th>
<th class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<tr *ngFor="let widget of widgets$ | async">
<td class="px-6 py-4 whitespace-nowrap">{{ widget.name }}</td>
<td class="px-6 py-4 whitespace-nowrap">{{ widget.component }}</td>
<td class="px-6 py-4 whitespace-nowrap">{{ widget.cols }} x {{ widget.rows }}</td>
<td class="px-6 py-4 whitespace-nowrap text-right">
<button (click)="editWidget(widget.id)" class="text-indigo-600 hover:text-indigo-900">Edit</button>
</td>
</tr>
<!-- Show a message if there are no widgets -->
<tr *ngIf="!(widgets$ | async)?.length">
<td colspan="4" class="text-center py-4">No widgets found.</td>
</tr>
</tbody>
</table>
</div>
</div>
src/app/DPU/widget-management/widget-list.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router, RouterModule } from '@angular/router';
import { Observable } from 'rxjs';
import { Widget } from '../../shared/models/dashboard.model';
import { DashboardService } from '../../shared/services/dashboard.service';
import { CommonModule, TitleCasePipe } from '@angular/common';
@Component({
selector: 'app-widget-list',
standalone: true,
imports: [CommonModule, RouterModule, TitleCasePipe],
templateUrl: './widget-list.component.html',
})
export class WidgetListComponent implements OnInit {
widgets$!: Observable<Widget[]>;
appName: string = '';
constructor(
private dashboardService: DashboardService,
private route: ActivatedRoute,
private router: Router
) { }
ngOnInit(): void {
this.appName = this.route.snapshot.paramMap.get('appName') || '';
if (this.appName) {
this.widgets$ = this.dashboardService.getWidgets(this.appName);
} else {
// Handle case where appName is not in the URL
console.error('App name is missing from the route.');
}
}
editWidget(widgetId: string): void {
this.router.navigate(['/dpu', this.appName, 'widget-warehouse', 'edit', widgetId]);
}
addNewWidget(): void {
this.router.navigate(['/dpu', this.appName, 'widget-warehouse', 'edit', 'new']);
}
}
src/app/DPU/widget-stock/widget-stock.component.html 0 → 100644
<div class="container mx-auto p-4">
<h2 class="text-2xl font-bold mb-4">Widget Stock</h2>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
<div *ngFor="let widget of availableWidgets$ | async" class="bg-white shadow-md rounded-lg p-4">
<h3 class="text-lg font-semibold">{{ widget.name }}</h3>
<p class="text-gray-600">ID: {{ widget.id }}</p>
<pre class="text-sm bg-gray-100 p-2 mt-2 rounded">Config: {{ widget.config | json }}</pre>
</div>
</div>
</div>
src/app/DPU/widget-stock/widget-stock.component.scss 0 → 100644
/* Add custom styles for your widget stock component here */
src/app/DPU/widget-stock/widget-stock.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { CommonModule } from '@angular/common';
import { Observable } from 'rxjs';
import { IWidget } from '../../shared/models/dashboard.model';
import { DashboardService } from '../../shared/services/dashboard.service';
@Component({
selector: 'app-widget-stock',
standalone: true,
imports: [CommonModule],
templateUrl: './widget-stock.component.html',
styleUrls: ['./widget-stock.component.scss']
})
export class WidgetStockComponent implements OnInit {
public availableWidgets$!: Observable<IWidget[]>;
constructor(private dashboardService: DashboardService) { }
ngOnInit(): void {
this.availableWidgets$ = this.dashboardService.getAvailableWidgets();
}
}
src/app/app.routes.ts
......@@ -23,8 +23,14 @@ export const App_Route: Route[] = [
path: 'auth/reset-password',
component: CoverComponent
},
{
path: 'dpu',
component: ContentLayoutComponent, // Use the main layout
canActivate: [AuthGuard], // Assuming you want to protect these routes
loadChildren: () => import('./DPU/dpu.routes').then(r => r.dpuRoutes)
},
{
path: 'home',
component: HomeComponent
},
]
]
\ No newline at end of file
src/app/components/apps/apps.routes.ts deleted 100644 → 0
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
export const admin: Routes = [
{path:'apps',children:[ {
path: 'fullcalender',
loadComponent: () =>
import('./fullcalender/fullcalender.component').then((m) => m.FullcalenderComponent),
},
{
path: 'gallery',
loadComponent: () =>
import('./gallery/gallery.component').then((m) => m.GalleryComponent),
},
]}
];
@NgModule({
imports: [RouterModule.forChild(admin)],
exports: [RouterModule],
})
export class appsRoutingModule {
static routes = admin;
}
\ No newline at end of file
src/app/components/apps/crm/companies/companies.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { SharedModule } from '../../../../shared/shared.module';
import { NgSelectModule } from '@ng-select/ng-select';
import { RouterModule } from '@angular/router';
const DATA=[
{
id:'1',
img:"./assets/images/company-logos/1.png",
name:'Spruko Technologies',
mail:'sprukotechnologies2981@gmail.com',
phnum:'1678-28993-223',
type:'Information Technology',
bg:'primary/10',
text:'primary',
size:'Corporate',
img2:'./assets/images/faces/4.jpg',
name2:'Lisa Convay',
deals:'258'
},
{
id:'2',
img:"./assets/images/company-logos/3.png",
name:'Spice Infotech',
mail:'spiceinfotech289@gmail.com',
phnum:'8122-2342-4453',
type:'Telecommunications',
bg:'danger/10',
text:'danger',
size:'Small Business',
img2:'./assets/images/faces/12.jpg',
name2:'Jacob Smith',
deals:'335'
},
{
id:'3',
img:"./assets/images/company-logos/4.png",
name:'Logitech ecostics',
mail:'logitecheco789@gmail.com',
phnum:'1902-2001-3023',
type:'Logistics',
bg:'success/10',
text:'success',
size:'Micro Business',
img2:'./assets/images/faces/14.jpg',
name2:'Jake Sully',
deals:'685'
},
{
id:'4',
img:"./assets/images/company-logos/5.png",
name:'Initech Info',
mail:'initechinfo290@gmail.com',
phnum:'1603-2032-1123',
type:'Information Technology',
bg:'light',
text:'default',
size:'Startup',
img2:'./assets/images/faces/6.jpg',
name2:'Kiara Advain',
deals:'425'
},
{
id:'5',
img:"./assets/images/company-logos/6.png",
name:'Massive Dynamic',
mail:'massivedynamic1993@gmail.com',
phnum:'1129-2302-1092',
type:'Professional Services',
bg:'pink/10',
text:'pink',
size:'Large Enterprise',
img2:'./assets/images/faces/8.jpg',
name2:'Brenda Simpson',
deals:'516'
},
{
id:'6',
img:"./assets/images/company-logos/7.png",
name:'Globex Corporation',
mail:'globexcorp345@gmail.com',
phnum:'9923-2344-2003',
type:'Education',
bg:'danger/10',
text:'danger',
size:'Small Business',
img2:'./assets/images/faces/9.jpg',
name2:'ชนะชัย โอดพิมพ์',
deals:'127'
},
{
id:'7',
img:"./assets/images/company-logos/8.png",
name:'Acme Corporation',
mail:'acmecorporation78@gmail.com',
phnum:'7891-2093-1994',
type:'Telecommunications',
bg:'primary/10',
text:'primary',
size:'Corporate',
img2:'./assets/images/faces/15.jpg',
name2:'Dwayne Jhonson',
deals:'368'
},
{
id:'8',
img:"./assets/images/company-logos/9.png",
name:'Soylent Corp',
mail:'soylentcorp678@gmail.com',
phnum:'1899-2993-0923',
type:' Manufacturing',
bg:'warning/10',
text:'warning',
size:'Medium Size',
img2:'./assets/images/faces/1.jpg',
name2:'Emiley Jackson',
deals:'563'
},
{
id:'9',
img:"./assets/images/company-logos/10.png",
name:'Umbrella Corporation',
mail:'umbrellacorp289@gmail.com',
phnum:'1768-2332-4934',
type:' Healthcare',
bg:'success/10',
text:'success',
size:'Micro Business',
img2:'./assets/images/faces/3.jpg',
name2:'Jessica Morris',
deals:'185'
},
{
id:'10',
img:"./assets/images/company-logos/2.png",
name:'Hooli Technologies',
mail:'hoolitech186@gmail.com',
phnum:'4788-7822-4786',
type:' Information Technology',
bg:'success/10',
text:'success',
size:'default',
img2:'./assets/images/faces/9.jpg',
name2:'Michael Jeremy',
deals:'240'
},
]
@Component({
selector: 'app-companies',
standalone: true,
imports: [SharedModule,NgSelectModule,RouterModule],
templateUrl: './companies.component.html',
styleUrls: ['./companies.component.scss']
})
export class CompaniesComponent {
companies=DATA;
click(id:string){
const data = this.companies.filter((x: { id: string }) => {
return x.id != id;
});
this.companies = data;
}
url1:string = '';
handleFileInput(event: any): void {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (e: any) => {
this.url1 = e.target.result;
};
reader.readAsDataURL(file);
}
}
}
src/app/components/apps/crm/contacts/contacts.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { NgSelectModule } from '@ng-select/ng-select';
import flatpickr from 'flatpickr';
import { SharedModule } from '../../../../shared/shared.module';
import { FlatpickrDefaults, FlatpickrModule } from 'angularx-flatpickr';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
const DATA=[
{
id:'1',
img:"./assets/images/faces/4.jpg",
name:'Lisa Convay',
date:'24, Jul 2023 - 4:45PM',
deals:'258',
mail:'lisaconvay2981@gmail.com',
number:'1678-28993-223',
img2:'./assets/images/company-logos/1.png',
company:'Spruko Technologies',
source:'Social Media',
bg:'primary/10',
text:'primary',
bg2:'primary/10',
text2:'primary',
tag1:'New Lead',
tag2:'Prospect',
},
{
id:'2',
img:"./assets/images/faces/12.jpg",
name:'Jacob Smith',
date:'15, Jul 2023 - 11:45AM',
deals:'335',
mail:'jacobsmith289@gmail.com',
number:'8122-2342-4453',
img2:'./assets/images/company-logos/3.png',
company:'Spice Infotech',
source:'Direct mail',
bg:'primary/10',
text:'primary',
bg2:'danger/10',
text2:'danger',
tag1:'Customer',
tag2:'Hot Lead'
},
{
id:'3',
img:"./assets/images/faces/14.jpg",
name:'Jake Sully',
date:'10, Aug 2023 - 3:25PM',
deals:'685',
mail:'jakesully789@gmail.com',
number:'1902-2001-3023',
img2:'./assets/images/company-logos/4.png',
company:'Logitech ecostics',
source:'Blog Articles',
bg:'success/10',
text:'success',
tag1:'Partner',
},
{
id:'4',
img:"./assets/images/faces/6.jpg",
name:'Kiara Advain',
date:'18, Aug 2023 - 10:10AM',
deals:'425',
mail:'kiaraadvain290@gmail.com',
number:'1603-2032-1123',
img2:'./assets/images/company-logos/5.png',
company:'Initech Info',
source:'Affiliates',
bg:'light',
text:'defaulttextcolor',
tag1:'LostCustomer',
tag2:'Influencer',
bg2:'secondary/10',
text2:'secondary',
},
{
id:'5',
img:"./assets/images/faces/8.jpg",
name:'Brenda Simpson',
date:'19, Jul 2023 - 12:41PM',
deals:'516',
mail:'brendasimpson1993@gmail.com',
number:'1129-2302-1092',
img2:'./assets/images/company-logos/5.png',
company:'Massive Dynamic',
source:'Organic search',
bg:'pink/10',
text:'pink',
tag1:'Subscriber',
tag2:'Influencer',
bg2:'success/10',
text2:'success',
},
{
id:'6',
img:"./assets/images/faces/9.jpg",
name:'ชนะชัย โอดพิมพ์',
date:'14, Aug 2023 - 5:18PM',
deals:'127',
mail:'jsontaylor345@gmail.com',
number:'9923-2344-2003',
img2:'./assets/images/company-logos/7.png',
company:'Globex Corporation',
source:'Social media',
bg:'danger/10',
text:'danger',
tag1:'Hot Lead',
tag2:'Referral',
bg2:'info/10',
text2:'info',
},
{
id:'7',
img:"./assets/images/faces/15.jpg",
name:'Dwayne Jhonson',
date:'12, Jun 2023 - 11:38AM',
deals:'368',
mail:'dwayenejhonson78@gmail.com',
number:'7891-2093-1994',
img2:'./assets/images/company-logos/8.png',
company:'Acme Corporation',
source:'Blog Articles',
bg:'warning/10',
text:'warning',
tag1:'Trial User',
tag2:'Cold Lead',
bg2:'purple/10',
text2:'purple',
},
{
id:'8',
img:"./assets/images/faces/1.jpg",
name:'Emiley Jackson',
date:'19, May 2023 - 1:57PM',
deals:'563',
mail:'emileyjackson678@gmail.com',
number:'1899-2993-0923',
img2:'./assets/images/company-logos/9.png',
company:'Soylent Corp',
source:'Organic search',
bg:'success/10',
text:'success',
tag1:'Influencer',
tag2:'Partner',
bg2:'info/10',
text2:'info',
},
{
id:'9',
img:"./assets/images/faces/3.jpg",
name:'Jessica Morris',
date:'28, Jul 2023 - 9:31AM',
deals:'240',
mail:'emileyjackson678@gmail.com',
number:'1899-2993-0923',
img2:'./assets/images/company-logos/10.png',
company:'Umbrella Corporation',
source:'Affiliates',
bg:'primary/10',
text:'primary',
tag1:'New Lead',
tag2:'Lost Customer',
bg2:'light',
text2:'default',
},
{
id:'10',
img:"./assets/images/faces/9.jpg",
name:'Michael Jeremy',
date:'28, Jul 2023 - 9:31AM',
deals:'240',
mail:'michaeljeremy186@gmail.com',
number:'4788-7822-4786',
img2:'./assets/images/company-logos/2.png',
company:'Hooli Technologies',
source:' Direct mail',
bg:'primary/10',
text:'primary',
tag1:'New Lead',
tag2:'Subscriber',
bg2:'pink/10',
text2:'pink',
},
]
@Component({
selector: 'app-contacts',
standalone: true,
imports: [SharedModule,NgSelectModule,FlatpickrModule,FormsModule,ReactiveFormsModule],
providers:[FlatpickrDefaults],
templateUrl: './contacts.component.html',
styleUrls: ['./contacts.component.scss']
})
export class ContactsComponent {
contacts=DATA;
click(id:string){
const data=this.contacts.filter((x: { id: string }) => {
return x.id != id;
});
this.contacts = data;
}
selectedTags=['Select Tag'];
tags=[
{id:1,name:'Kiara advain'},
{id:2,name:'New Lead'},
{id:3,name:'Prospect'},
{id:4,name:'Customer'},
{id:5,name:'Hot Lead'},
{id:6,name:'Partner'},
{id:7,name:'LostCustomer'},
{id:8,name:'Influencer'},
{id:9,name:'Subscriber'},
{id:10,name:'Alex Carey'},
]
flatpickrOptions: any = {
inline: true,
};
// flatpickrOptions: FlatpickrOptions;
constructor() {}
ngOnInit() {
this.flatpickrOptions = {
enableTime: true,
noCalendar: true,
dateFormat: 'H:i',
};
flatpickr('#inlinetime', this.flatpickrOptions);
this.flatpickrOptions = {
enableTime: true,
dateFormat: 'Y-m-d H:i', // Specify the format you want
defaultDate: '2023-11-07 14:30', // Set the default/preloaded time (adjust this to your desired time)
};
flatpickr('#pretime', this.flatpickrOptions);
}
url1:string = '';
handleFileInput(event: any): void {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (e: any) => {
this.url1 = e.target.result;
};
reader.readAsDataURL(file);
}
}
}
src/app/components/apps/crm/crm.routes.ts deleted 100644 → 0
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
export const admin: Routes = [
{path:'apps/crm',children:[ {
path: 'companies',
loadComponent: () =>
import('./companies/companies.component').then((m) => m.CompaniesComponent),
},
{
path: 'contacts',
loadComponent: () =>
import('./contacts/contacts.component').then(
(m) => m.ContactsComponent
),
},
{
path: 'deals',
loadComponent: () =>
import('./deals/deals.component').then(
(m) => m.DealsComponent
),
},
{
path: 'leads',
loadComponent: () =>
import('./leads/leads.component').then((m) => m.LeadsComponent),
},
]}
];
@NgModule({
imports: [RouterModule.forChild(admin)],
exports: [RouterModule],
})
export class crmRoutingModule {
static routes = admin;
}
\ No newline at end of file
src/app/components/apps/crm/leads/leads.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { SharedModule } from '../../../../shared/shared.module';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MaterialModuleModule } from '../../../../material-module/material-module.module';
import { NgSelectModule } from '@ng-select/ng-select';
const DATA=[
{
id:'1',
img:"./assets/images/faces/4.jpg",
name:'Lisa Convay',
mail:'lisaconvay2981&#64;gmail.com',
number:'1678-28993-223',
status:'New',
img2:"./assets/images/company-logos/1.png",
company:'Spruko Technologies',
source:'Social Media',
tag1:'New Lead',
tag2:'Prospect',
bg1:"badge bg-primary/10 text-primary",
bg2:"badge bg-primary/10 text-primary"
},
{
id:'2',
img:"./assets/images/faces/12.jpg",
name:'Jacob Smith',
mail:'jacobsmith289&#64;gmail.com',
number:'8122-2342-4453',
status:'Follow-up',
img2:"./assets/images/company-logos/3.png",
company:'Spice Infotech',
source:'Direct mail',
tag1:'Customer',
tag2:'Hot Lead',
bg1:'badge bg-primary/10 text-primary',
bg2:'badge bg-danger/10 text-danger'
},
{
id:'3',
img:"./assets/images/faces/14.jpg",
name:'Jake Sully',
mail:'jakesully789&#64;gmail.com',
number:'1902-2001-3023',
status:'Closed',
img2:"./assets/images/company-logos/4.png",
company:'Logitech ecostics',
source:'Blog Articles',
tag1:'Partner',
bg1:'badge bg-success/10 text-success',
},
{
id:'4',
img:"./assets/images/faces/6.jpg",
name:'Kiara Advain',
mail:'kiaraadvain290&#64;gmail.com',
number:'1603-2032-1123',
status:'Contacted',
img2:"./assets/images/company-logos/5.png",
company:'Initech Info',
source:'Affiliates',
tag1:'LostCustomer',
bg1:"badge bg-light text-default",
tag2:'Influencer',
bg2:'badge bg-secondary/10 text-secondary'
},
{
id:'5',
img:"./assets/images/faces/8.jpg",
name:'Brenda Simpson',
mail:'brendasimpson1993&#64;gmail.com',
number:'1129-2302-1092',
status:'New',
img2:"./assets/images/company-logos/6.png",
company:'Massive Dynamic',
source:'Organic search',
tag1:'Subscriber',
bg1:"badge bg-pink/10 text-pink",
tag2:'Partner',
bg2:"badge bg-success/10 text-success"
},
{
id:'6',
img:"./assets/images/faces/9.jpg",
name:'ชนะชัย โอดพิมพ์',
mail:'jsontaylor345&#64;gmail.com',
number:'9923-2344-2003',
status:'Follow-up',
img2:"./assets/images/company-logos/7.png",
company:'Globex Corporation',
source:'Social media',
tag1:'Hot Lead',
bg1:"badge bg-danger/10 text-danger",
tag2:'Referral',
bg2:"badge bg-info/10 text-info"
},
{
id:'7',
img:"./assets/images/faces/15.jpg",
name:'Dwayne Jhonson',
mail:'dwayenejhonson78&#64;gmail.com',
number:'7891-2093-1994',
status:'Closed',
img2:"./assets/images/company-logos/8.png",
company:'Acme Corporation',
source:' Blog Articles',
tag1:'Trial User',
bg1:"badge bg-warning/10 text-warning",
tag2:'Cold Lead',
bg2:"badge bg-purple/10 text-purple"
},
{
id:'8',
img:"./assets/images/faces/1.jpg",
name:'Emiley Jackson',
mail:'emileyjackson678&#64;gmail.com',
number:'1899-2993-0923',
status:'Disqualified',
img2:"./assets/images/company-logos/9.png",
company:'Soylent Corp',
source:' Organic search',
tag1:'Influencer',
bg1:"badge bg-success/10 text-success",
tag2:'Partner',
bg2:"badge bg-info/10 text-info"
},
{
id:'9',
img:"./assets/images/faces/3.jpg",
name:'Jessica Morris',
mail:'jessicamorris289&#64;gmail.com',
number:'1768-2332-4934',
status:'Qualified',
img2:"./assets/images/company-logos/10.png",
company:'Umbrella Corporation',
source:' Affiliates',
tag1:'New Lead',
bg1:"badge bg-primary/10 text-primary",
tag2:'Lost Customer',
bg2:"badge bg-light text-default"
},
{
id:'10',
img:"./assets/images/faces/9.jpg",
name:'Michael Jeremy',
mail:'michaeljeremy186&#64;gmail.com',
number:'4788-7822-4786',
status:'Contacted',
img2:"./assets/images/company-logos/2.png",
company:'Hooli Technologies',
source:' Direct mail',
tag1:'New Lead',
bg1:"badge bg-primary/10 text-primary",
tag2:'Subscriber',
bg2:"badge bg-pink/10 text-pink"
},
]
@Component({
selector: 'app-leads',
standalone: true,
imports: [SharedModule,MaterialModuleModule,FormsModule,ReactiveFormsModule,NgSelectModule],
templateUrl: './leads.component.html',
styleUrls: ['./leads.component.scss']
})
export class LeadsComponent {
leads=DATA;
click(id:string){
const data=this.leads.filter((x: { id: string })=>{
return x.id!=id
})
this.leads=data
}
url1:string = '';
handleFileInput(event: any): void {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (e: any) => {
this.url1 = e.target.result;
};
reader.readAsDataURL(file);
}
}
}
src/app/components/apps/crypto/buy-sell/buy-sell.component.scss deleted 100644 → 0
.Buy-crypto-input{
.ng-select .ng-clear-wrapper{
display:none;
}
}
\ No newline at end of file
src/app/components/apps/crypto/buy-sell/buy-sell.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { NgSelectModule } from '@ng-select/ng-select';
import { SharedModule } from '../../../../shared/shared.module';
import { NgApexchartsModule } from 'ng-apexcharts';
@Component({
selector: 'app-buy-sell',
standalone: true,
imports: [SharedModule,NgSelectModule,NgApexchartsModule],
templateUrl: './buy-sell.component.html',
styleUrls: ['./buy-sell.component.scss']
})
export class BuySellComponent {
chartOptions:any
constructor(){
this.chartOptions={
series: [{
name: "Buy",
data: [20, 38, 38, 72, 55, 63, 43, 76, 55, 80, 40, 80],
}, {
name: "Sell",
data: [85, 65, 75, 38, 85, 35, 62, 40, 40, 64, 50, 89]
}],
chart: {
height: 300,
type: 'line',
zoom: {
enabled: false
},
dropShadow: {
enabled: true,
enabledOnSeries: undefined,
top: 5,
left: 0,
blur: 3,
color: '#000',
opacity: 0.1
},
},
dataLabels: {
enabled: false
},
legend: {
position: "top",
horizontalAlign: "center",
offsetX: -15,
fontWeight: "bold",
},
stroke: {
curve: 'smooth',
width: '3',
dashArray: [0, 5],
},
grid: {
borderColor: '#f2f6f7',
},
colors: ["rgb(38, 191, 148)", "rgba(230, 83, 60, 0.3)"],
yaxis: {
title: {
text: 'Statistics',
style: {
color: '#adb5be',
fontSize: '14px',
fontFamily: 'poppins, sans-serif',
fontWeight: 600,
cssClass: 'apexcharts-yaxis-label',
},
},
},
xaxis: {
type: 'month',
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
axisBorder: {
show: true,
color: 'rgba(119, 119, 142, 0.05)',
offsetX: 0,
offsetY: 0,
},
axisTicks: {
show: true,
borderType: 'solid',
color: 'rgba(119, 119, 142, 0.05)',
width: 6,
offsetX: 0,
offsetY: 0
},
labels: {
rotate: -90
}
}
}
}
}
\ No newline at end of file
src/app/components/apps/crypto/crypto.routes.ts deleted 100644 → 0
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
export const admin: Routes = [
{path:'apps/crypto',children:[ {
path: 'buy-sell',
loadComponent: () =>
import('./buy-sell/buy-sell.component').then((m) => m.BuySellComponent),
},
{
path: 'currency-exchange',
loadComponent: () =>
import('./currency-exchange/currency-exchange.component').then(
(m) => m.CurrencyExchangeComponent
),
},
{
path: 'marketcap',
loadComponent: () =>
import('./marketcap/marketcap.component').then(
(m) => m.MarketcapComponent
),
},
{
path: 'transactions',
loadComponent: () =>
import('./transactions/transactions.component').then((m) => m.TransactionsComponent),
},
{
path: 'wallet',
loadComponent: () =>
import('./wallet/wallet.component').then((m) => m.WalletComponent),
},
]}
];
@NgModule({
imports: [RouterModule.forChild(admin)],
exports: [RouterModule],
})
export class cryptoRoutingModule {
static routes = admin;
}
\ No newline at end of file
src/app/components/apps/crypto/currency-exchange/currency-exchange.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { NgSelectModule } from '@ng-select/ng-select';
import {
ChartComponent,
ApexAxisChartSeries,
ApexChart,
ApexXAxis,
ApexDataLabels,
ApexTitleSubtitle,
ApexStroke,
ApexGrid,
NgApexchartsModule,
} from 'ng-apexcharts';
import { SharedModule } from '../../../../shared/shared.module';
export type ChartOptions = {
series: ApexAxisChartSeries;
chart: ApexChart;
xaxis: ApexXAxis;
dataLabels: ApexDataLabels;
grid: ApexGrid;
stroke: ApexStroke;
title: ApexTitleSubtitle;
};
@Component({
selector: 'app-currency-exchange',
standalone: true,
imports: [SharedModule,NgSelectModule,NgApexchartsModule],
templateUrl: './currency-exchange.component.html',
styleUrls: ['./currency-exchange.component.scss']
})
export class CurrencyExchangeComponent {
chartOptions:any
chartOptions1:any
chartOptions2:any
chartOptions3:any
chartOptions4:any
chartOptions5:any
chartOptions6:any
chartOptions7:any
constructor() {
this.chartOptions = {
chart: {
type: 'area',
height: 60,
sparkline: {
enabled: true,
},
dropShadow: {
enabled: true,
enabledOnSeries: undefined,
top: 0,
left: 0,
blur: 1,
color: '#fff',
opacity: 0.05,
},
},
stroke: {
show: true,
curve: 'smooth',
lineCap: 'butt',
colors: undefined,
width: 1.5,
dashArray: 0,
},
fill: {
gradient: {
enabled: false,
},
},
series: [
{
name: 'Value',
data: [54, 38, 56, 35, 65, 43, 53, 45, 62, 80, 35, 48],
},
],
yaxis: {
min: 0,
show: false,
axisBorder: {
show: false,
},
},
xaxis: {
axisBorder: {
show: false,
},
},
colors: ['rgba(132, 90, 223,0.5)'],
tooltip: {
enabled: false,
},
};
this.chartOptions1 = {
chart: {
type: "area",
height: 60,
sparkline: {
enabled: true,
},
dropShadow: {
enabled: true,
enabledOnSeries: undefined,
top: 0,
left: 0,
blur: 1,
color: "#fff",
opacity: 0.05,
},
},
stroke: {
show: true,
curve: "smooth",
lineCap: "butt",
colors: undefined,
width: 1.5,
dashArray: 0,
},
fill: {
gradient: {
enabled: false,
},
},
series: [
{
name: "Value",
data: [54, 38, 56, 35, 65, 43, 53, 45, 62, 80, 35, 48],
},
],
yaxis: {
min: 0,
show: false,
axisBorder: {
show: false,
},
},
xaxis: {
axisBorder: {
show: false,
},
},
colors: ["rgba(35, 183, 229,0.5)"],
tooltip: {
enabled: false,
},
};
this.chartOptions2={
chart: {
type: "area",
height: 60,
sparkline: {
enabled: true,
},
dropShadow: {
enabled: true,
enabledOnSeries: undefined,
top: 0,
left: 0,
blur: 1,
color: "#fff",
opacity: 0.05,
},
},
stroke: {
show: true,
curve: "smooth",
lineCap: "butt",
colors: undefined,
width: 1.5,
dashArray: 0,
},
fill: {
gradient: {
enabled: false,
},
},
series: [
{
name: "Value",
data: [54, 38, 56, 35, 65, 43, 53, 45, 62, 80, 35, 48],
},
],
yaxis: {
min: 0,
show: false,
axisBorder: {
show: false,
},
},
xaxis: {
axisBorder: {
show: false,
},
},
colors: ["rgba(38, 191, 148,0.5)"],
tooltip: {
enabled: false,
},
}
this.chartOptions3={
chart: {
type: "area",
height: 60,
sparkline: {
enabled: true,
},
dropShadow: {
enabled: true,
enabledOnSeries: undefined,
top: 0,
left: 0,
blur: 1,
color: "#fff",
opacity: 0.05,
},
},
stroke: {
show: true,
curve: "smooth",
lineCap: "butt",
colors: undefined,
width: 1.5,
ltcArray: 0,
},
fill: {
gradient: {
enabled: false,
},
},
series: [
{
name: "Value",
data: [54, 38, 56, 35, 65, 43, 53, 45, 62, 80, 35, 48],
},
],
yaxis: {
min: 0,
show: false,
axisBorder: {
show: false,
},
},
xaxis: {
axisBorder: {
show: false,
},
},
colors: ["rgba(245, 184, 73,0.5)"],
tooltip: {
enabled: false,
},
}
this.chartOptions4={
chart: {
type: "area",
height: 60,
sparkline: {
enabled: true,
},
dropShadow: {
enabled: true,
enabledOnSeries: undefined,
top: 0,
left: 0,
blur: 1,
color: "#fff",
opacity: 0.05,
},
},
stroke: {
show: true,
curve: "smooth",
lineCap: "butt",
colors: undefined,
width: 1.5,
ltcArray: 0,
},
fill: {
gradient: {
enabled: false,
},
},
series: [
{
name: "Value",
data: [54, 38, 56, 35, 65, 43, 53, 45, 62, 80, 35, 48],
},
],
yaxis: {
min: 0,
show: false,
axisBorder: {
show: false,
},
},
xaxis: {
axisBorder: {
show: false,
},
},
colors: ["rgba(231, 145, 188,0.5)"],
tooltip: {
enabled: false,
},
}
this.chartOptions5={
chart: {
type: "area",
height: 60,
sparkline: {
enabled: true,
},
dropShadow: {
enabled: true,
enabledOnSeries: undefined,
top: 0,
left: 0,
blur: 1,
color: "#fff",
opacity: 0.05,
},
},
stroke: {
show: true,
curve: "smooth",
lineCap: "butt",
colors: undefined,
width: 1.5,
ltcArray: 0,
},
fill: {
gradient: {
enabled: false,
},
},
series: [
{
name: "Value",
data: [54, 38, 56, 35, 65, 43, 53, 45, 62, 80, 35, 48],
},
],
yaxis: {
min: 0,
show: false,
axisBorder: {
show: false,
},
},
xaxis: {
axisBorder: {
show: false,
},
},
colors: ["rgba(137, 32, 173,0.5)"],
tooltip: {
enabled: false,
},
}
this.chartOptions6={
chart: {
type: "area",
height: 60,
sparkline: {
enabled: true,
},
dropShadow: {
enabled: true,
enabledOnSeries: undefined,
top: 0,
left: 0,
blur: 1,
color: "#fff",
opacity: 0.05,
},
},
stroke: {
show: true,
curve: "smooth",
lineCap: "butt",
colors: undefined,
width: 1.5,
ltcArray: 0,
},
fill: {
gradient: {
enabled: false,
},
},
series: [
{
name: "Value",
data: [54, 38, 56, 35, 65, 43, 53, 45, 62, 80, 35, 48],
},
],
yaxis: {
min: 0,
show: false,
axisBorder: {
show: false,
},
},
xaxis: {
axisBorder: {
show: false,
},
},
colors: ["rgba(230, 83, 60,0.5)"],
tooltip: {
enabled: false,
},
}
this.chartOptions7={
chart: {
type: "area",
height: 60,
sparkline: {
enabled: true,
},
dropShadow: {
enabled: true,
enabledOnSeries: undefined,
top: 0,
left: 0,
blur: 1,
color: "#fff",
opacity: 0.05,
},
},
stroke: {
show: true,
curve: "smooth",
lineCap: "butt",
colors: undefined,
width: 1.5,
ltcArray: 0,
},
fill: {
gradient: {
enabled: false,
},
},
series: [
{
name: "Value",
data: [54, 38, 56, 35, 65, 43, 53, 45, 62, 80, 35, 48],
},
],
yaxis: {
min: 0,
show: false,
axisBorder: {
show: false,
},
},
xaxis: {
axisBorder: {
show: false,
},
},
colors: ["rgba(73, 182, 245,0.5)"],
tooltip: {
enabled: false,
},
}
}
}
src/app/components/apps/crypto/transactions/transactions.component.ts deleted 100644 → 0
import { Component, ElementRef } from '@angular/core';
import { NgSelectModule } from '@ng-select/ng-select';
import { NgApexchartsModule } from 'ng-apexcharts';
import { SharedModule } from '../../../../shared/shared.module';
import { CountUpModule } from 'ngx-countup';
const DATA=[
{
img:"./assets/images/faces/10.jpg",
class:"ti ti-arrow-narrow-up text-success font-semibold text-[1rem]",
name:'ชนะชัย โอดพิมพ์',
id:'#1242232401',
img2:"./assets/images/crypto-currencies/regular/Bitcoin.svg",
coin:'Bitcoin',
date:'24,Jul 2023 - 4:23PM',
amount:'+0.041',
text:'success',
receiver:'Texas Steel',
status:'Success',
bg:"badge bg-success/10 text-success"
},
{
img:"./assets/images/faces/5.jpg",
class:"ti ti-arrow-narrow-down text-danger font-semibold text-[1rem]",
name:'Samantha Taylor',
id:'#1242232402',
img2:"./assets/images/crypto-currencies/regular/Dash.svg",
coin:'Dashcoin',
date:'24,Jul 2023 - 4:23PM',
amount:'-0.284',
text:'danger',
receiver:'Stuart Little',
status:'Pending',
bg:"badge bg-warning/10 text-warning"
},
{
img:"./assets/images/faces/12.jpg",
class:"ti ti-arrow-narrow-up text-success font-semibold text-[1rem]",
name:'Brian Jhonson',
id:'#1242232403',
img2:"./assets/images/crypto-currencies/regular/Euro.svg",
coin:'Euro',
date:'14,Aug 2023 - 10:25AM',
amount:'+0.943',
text:'success',
receiver:'Melissa Smith',
status:'Success',
bg:"badge bg-success/10 text-success"
},
{
img:"./assets/images/faces/15.jpg",
class:"ti ti-arrow-narrow-up text-success font-semibold text-[1rem]",
name:'Liam Anderson',
id:'#1242232404',
img2:"./assets/images/crypto-currencies/regular/Ethereum.svg",
coin:'Ethereum',
date:'10,Jul 2023 - 4:14PM',
amount:'+0.582',
text:'success',
receiver:'Alexander Clark',
status:'Failed',
bg:"badge bg-danger/10 text-danger"
},
{
img:"./assets/images/faces/4.jpg",
class:"ti ti-arrow-narrow-up text-success font-semibold text-[1rem]",
name:'Isabella Brown',
id:'#1242232405',
img2:"./assets/images/crypto-currencies/regular/Golem.svg",
coin:'Golem',
date:'19,Aug 2023 - 11:35AM',
amount:'+0.290',
text:'success',
receiver:'Elijah Davis',
status:'Success',
bg:"badge bg-success/10 text-success"
},
{
img:"./assets/images/faces/7.jpg",
class:"ti ti-arrow-narrow-down text-danger font-semibold text-[1rem]",
name:'Sophia Lee',
id:'#1242232406',
img2:"./assets/images/crypto-currencies/regular/litecoin.svg",
coin:'Litecoin',
date:'12,Jun 2023 - 2:45PM',
amount:'-0.147',
text:'danger',
receiver:'Harper Taylor',
status:'Success',
bg:"badge bg-success/10 text-success"
},
{
img:"./assets/images/faces/6.jpg",
class:"ti ti-arrow-narrow-up text-success font-semibold text-[1rem]",
name:'Evelyn Clark',
id:'#1242232407',
img2:"./assets/images/crypto-currencies/regular/Ripple.svg",
coin:'Ripple',
date:'27,Jul 2023 - 10:18AM',
amount:'+1.05',
text:'success',
receiver:'William Brown',
status:'Success',
bg:"badge bg-success/10 text-success"
},
{
img:"./assets/images/faces/11.jpg",
class:"ti ti-arrow-narrow-up text-success font-semibold text-[1rem]",
name:'Liam Anderson',
id:'#1242232408',
img2:"./assets/images/crypto-currencies/regular/monero.svg",
coin:'Monero',
date:'16,Aug 2023 - 9:25PM',
amount:'+0.625',
text:'success',
receiver:'Amelia Davis',
status:'Success',
bg:"badge bg-info/10 text-info"
},
{
img:"./assets/images/faces/2.jpg",
class:"ti ti-arrow-narrow-down text-danger font-semibold text-[1rem]",
name:'Harper Taylor',
id:'#1242232409',
img2:"./assets/images/crypto-currencies/regular/Zcash.svg",
coin:'Zcash',
date:'24,Jul 2023 - 12:47PM',
amount:'-0.293',
text:'danger',
receiver:'Benjamin Martinez',
status:'Inprogress',
bg:"badge bg-info/10 text-info"
},
{
img:"./assets/images/faces/16.jpg",
class:"ti ti-arrow-narrow-up text-success font-semibold text-[1rem]",
name:'Lucas Taylor',
id:'#1242232410',
img2:"./assets/images/crypto-currencies/regular/Decred.svg",
coin:'Decred',
date:'24,Jul 2023 - 12:47PM',
amount:'+0.893',
text:'success',
receiver:'Benjamin Martinez',
status:'Inprogress',
bg:"badge bg-success/10 text-success"
}
]
@Component({
selector: 'app-transactions',
standalone: true,
imports: [SharedModule,NgSelectModule,NgApexchartsModule,CountUpModule],
templateUrl: './transactions.component.html',
styleUrls: ['./transactions.component.scss']
})
export class TransactionsComponent {
transactions=DATA;
click(id:string){
const data=this.transactions.filter((x:{id:string})=>{
return x.id!=id
})
this.transactions=data;
}
chartOptions:any
constructor(private elementref:ElementRef) {
this.chartOptions = {
series: [
{
name: 'New',
data: [76, 85, 101, 98, 87, 105],
},
{
name: 'Pending',
data: [35, 41, 36, 26, 45, 48],
},
{
name: 'Completed',
data: [44, 55, 57, 56, 61, 58],
},
{
name: 'Inprogress',
data: [13, 27, 31, 29, 35, 25],
},
],
chart: {
type: 'bar',
height: 210,
stacked: true,
},
plotOptions: {
bar: {
horizontal: false,
columnWidth: '25%',
endingShape: 'rounded',
},
},
grid: {
borderColor: '#f2f5f7',
},
dataLabels: {
enabled: false,
},
colors: ['#845adf', '#28d193', '#ffbe14', '#23b7e5'],
stroke: {
show: true,
colors: ['transparent'],
},
xaxis: {
categories: ['Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov'],
labels: {
show: true,
style: {
colors: '#8c9097',
fontSize: '11px',
fontWeight: 600,
cssClass: 'apexcharts-xaxis-label',
},
},
},
yaxis: {
title: {
style: {
color: '#8c9097',
},
},
labels: {
show: true,
style: {
colors: '#8c9097',
fontSize: '11px',
fontWeight: 600,
cssClass: 'apexcharts-xaxis-label',
},
},
},
fill: {
opacity: 1,
},
};
}
ngAfterViewInit(): void {
this.setChartWidth();
}
private setChartWidth(): void {
const chartContainer = this.elementref.nativeElement.querySelector('.chart-container');
const chart1 = new ApexCharts(chartContainer, this.chartOptions);
chart1.render();
}
}
src/app/components/apps/crypto/wallet/wallet.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { NgSelectModule } from '@ng-select/ng-select';
import { NgApexchartsModule } from 'ng-apexcharts';
import { SharedModule } from '../../../../shared/shared.module';
@Component({
selector: 'app-wallet',
standalone: true,
imports: [SharedModule,NgSelectModule,NgApexchartsModule],
templateUrl: './wallet.component.html',
styleUrls: ['./wallet.component.scss']
})
export class WalletComponent {
}
src/app/components/apps/fullcalender/fullcalender.component.scss deleted 100644 → 0
#external-events {
height: 10%;
padding: 0 20px;
// border: 1px solid #ece9fb;
// background: #f7f6fd;
text-align: left;
// border-radius: 5px;
}
#external-events h4 {
font-size: 16px;
margin-top: 0;
padding-top: 1em;
}
#external-events ul {
list-style: none;
padding: 0;
}
#external-events ul li {
margin: 11px 0;
}
#external-events ul li a{
color: #fff;
padding: 1px 6px;
display :block;
font-size: 0.85em;
}
::ng-deep{
app-calendar{
.card.custom-card{
width: 96% !important;
}
@media screen and (min-width:767px) and (max-width:1100px) {
.col-md-4.text-right{
margin-right: 50px !important;
}
}
ul li {
z-index: 9 !important;
}
}
.cal-month-view .cal-day-number{
font-size: 1.1em;
margin-top: 5px;
margin-right: 5px;
color: #1d212f;
}
.cal-month-view .cal-day-cell:not(:last-child) {
border-right-color: #ebf1ff;
}
.main-content-body-calendar .btn {
// border:1px solid #ebf1ff;
border-radius: 4px;
color: #705ec8;
}
.cal-month-view .cal-days .cal-cell-row {
border-bottom-color: #ebf1ff;
}
.dark .cal-month-view .cal-open-day-events {
color: var(--text-white);
background-color:var(--darkbg);
box-shadow: none;
border: 1px solid #f6f6f621;
border-top: 0;
}
.cal-month-view .cal-event-title:hover{
text-decoration: none;
}
.cal-event-action:focus{
outline: 0;
}
mwl-calendar-event-title:focus{
outline: 0;
}
.cal-month-view .cal-days {
border-color: #ebf1ff;
}
.cal-month-view .cal-cell-row:hover {
background-color: #f7f6fd;
}
.cal-month-view .cal-day-cell.cal-today {
background-color: rgb(238, 241, 249);
}
.cal-month-view .cal-cell.cal-has-events.cal-open {
background-color: var(--darkbg);
}
.cal-month-view .cal-cell-row .cal-cell:hover {
background-color: #f7f6fd;
}
.cal-month-view .cal-day-cell.cal-weekend .cal-day-number {
color: #728096;
}
.cal-month-view .cal-day-badge {
background-color: #705ec8;
}
.cal-month-view .cal-cell:focus {
outline: 0;
}
.table.table-bordered {
border-top: 1px solid #ebf1ff;
}
.cal-header {
border-top: 1px solid #ebf1ff;
border-left: 1px solid #ebf1ff;
border-right: 1px solid #ebf1ff;
}
.cal-month-view .cal-header .cal-cell {
padding: 10px 0;
}
.cal-cell {
border-right: 1px solid #ebf1ff;
}
.cal-cell:last-child {
border-right: 0;
}
.dark .cal-month-view .cal-cell.cal-has-events.cal-open {
background: #eef1f9;
}
.cal-month-view .cal-day-cell.cal-today .cal-day-number {
color: #1a1630;
}
@media (max-width: 669px) {
#external-events-1 {
.text-left, .text-right {
text-align: center !important;
margin-top: 5px;
}
}
.cal-month-view {
.cal-cell-top {
min-height: 10px;
}
.cal-day-cell {
min-height: 10px;
min-height: 10px;
}
.cal-day-badge {
display :none;
}
.cal-day-cell.cal-today .cal-day-number {
font-size: 1.2em;
}
}
}
}
\ No newline at end of file
src/app/components/apps/fullcalender/fullcalender.component.ts deleted 100644 → 0
import { Component, OnInit, importProvidersFrom} from '@angular/core';
import { SafeHtml } from '@angular/platform-browser';
import { CalendarDateFormatter, CalendarEvent, CalendarEventAction, CalendarEventTimesChangedEvent, CalendarModule, CalendarMomentDateFormatter, CalendarView, DateAdapter, } from 'angular-calendar';
import { startOfDay, endOfDay, subDays, addDays, endOfMonth, isSameDay, isSameMonth, addHours, } from 'date-fns';
import { Subject, Subscription } from 'rxjs';
import { SharedModule } from '../../../shared/shared.module';
import { SimplebarAngularModule } from 'simplebar-angular';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { adapterFactory } from 'angular-calendar/date-adapters/date-fns';
const colors: any = {
red: {
primary: '#705ec8',
secondary: '#6958be',
},
blue: {
primary: '#5a66f1',
secondary: '#dee0fc',
},
yellow: {
primary: '#ffab00',
secondary: '#f3a403',
},
};
@Component({
selector: 'app-fullcalender',
standalone: true,
imports: [SharedModule,SimplebarAngularModule,FormsModule,ReactiveFormsModule,CalendarModule],
providers:[],
templateUrl: './fullcalender.component.html',
styleUrls: ['./fullcalender.component.scss']
})
export class FullcalenderComponent {
constructor() {}
ngOnInit(): void {
}
CalendarView = CalendarView;
view: CalendarView = CalendarView.Month;
viewDate: Date = new Date();
actions: CalendarEventAction[] = [
{
label: '<i class="fas fa-fw fa-pencil-alt"></i>',
a11yLabel: 'Edit',
onClick: ({ event }: { event: CalendarEvent }): void => {
this.handleEvent('Edited', event);
},
},
{
label: '<i class="fas fa-fw fa-trash-alt"></i>',
a11yLabel: 'Delete',
onClick: ({ event }: { event: CalendarEvent }): void => {
this.events = this.events.filter((iEvent) => iEvent !== event);
this.handleEvent('Deleted', event);
},
},
];
refresh: Subject<any> = new Subject();
events: CalendarEvent[] = [
{
start: subDays(startOfDay(new Date()), 1),
end: addDays(new Date(), 1),
title: 'A 3 day event',
color: colors.red,
actions: this.actions,
allDay: true,
draggable: true,
},
{
start: startOfDay(new Date()),
end: new Date(),
title: 'An event with no end date',
color: colors.yellow,
actions: this.actions,
draggable: true,
},
{
start: subDays(endOfMonth(new Date()), 3),
end: addDays(endOfMonth(new Date()), 3),
title: 'A long event that spans 2 months',
color: colors.blue,
allDay: true,
draggable: true,
},
{
start: addHours(startOfDay(new Date()), 2),
end: addHours(new Date(), 2),
title: 'A draggable and resizable event',
color: colors.blue,
actions: this.actions,
draggable: true,
},
];
activeDayIsOpen = false;
dayClicked({ date, events }: { date: Date; events: CalendarEvent[] }): void {
if (isSameMonth(date, this.viewDate)) {
if (
(isSameDay(this.viewDate, date) && this.activeDayIsOpen === true) ||
events.length === 0
) {
this.activeDayIsOpen = false;
} else {
this.activeDayIsOpen = true;
}
this.viewDate = date;
}
}
eventTimesChanged({
event,
newStart,
newEnd,
}: CalendarEventTimesChangedEvent): void {
this.events = this.events.map((iEvent) => {
if (iEvent === event) {
return {
...event,
start: newStart,
end: newEnd,
};
}
return iEvent;
});
this.handleEvent('Dropped or resized', event);
}
handleEvent(action: string, event: CalendarEvent): void {}
newEvent!: CalendarEvent;
addEvent(): void {
this.newEvent = {
title: 'New event',
start: startOfDay(new Date()),
end: endOfDay(new Date()),
color: colors.red,
draggable: true,
actions: this.actions,
};
this.events.push(this.newEvent);
this.handleEvent('Add new event', this.newEvent);
this.refresh.next;
}
eventDropped({
event,
newStart,
newEnd,
allDay,
}: CalendarEventTimesChangedEvent): void {
const externalIndex = this.events.indexOf(event);
if (typeof allDay !== 'undefined') {
event.allDay = allDay;
}
if (externalIndex > -1) {
this.events.splice(externalIndex, 1);
this.events.push(event);
}
event.start = newStart;
if (newEnd) {
event.end = newEnd;
}
if (this.view === 'month') {
this.viewDate = newStart;
this.activeDayIsOpen = true;
}
this.events = [...this.events];
}
externalDrop(event: CalendarEvent) {
if (this.events.indexOf(event) === -1) {
this.events = this.events.filter((iEvent) => iEvent !== event);
this.events.push(event);
}
}
deleteEvent(eventToDelete: CalendarEvent) {
this.events = this.events.filter((event) => event !== eventToDelete);
}
setView(view: CalendarView) {
this.view = view;
}
closeOpenMonthViewDay() {
this.activeDayIsOpen = false;
}
public windowSubscribe$!: Subscription;
options = { autoHide: false, scrollbarMinSize: 100 };
icon!: SafeHtml;
}
function provideRouter(App_Route: any): import("@angular/core").Provider {
throw new Error('Function not implemented.');
}
src/app/components/apps/gallery/gallery.component.html deleted 100644 → 0
<app-page-header [title]="'Gallery'" [activeTitle]="'Apps'" [title1]="'Gallery'"></app-page-header>
<!-- Start::row-1 -->
<div class="grid grid-cols-12 gap-x-6" gallerize>
@for(img of imageData; track img.id){
<div class="lg:col-span-3 md:col-span-3 sm:col-span-6 col-span-12" >
<a class="glightbox box" data-gallery="gallery1">
<img [src]="img.srcUrl"alt="image" >
</a>
</div>
}
</div>
<!--End::row-1 -->
\ No newline at end of file
src/app/components/apps/gallery/gallery.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { Gallery, GalleryItem, GalleryModule, ImageItem, ImageSize, ThumbnailsPosition } from 'ng-gallery';
import { Lightbox, LightboxModule } from 'ng-gallery/lightbox';
import { SharedModule } from '../../../shared/shared.module';
@Component({
selector: 'app-gallery',
standalone: true,
imports: [SharedModule,FormsModule,ReactiveFormsModule,GalleryModule,LightboxModule],
templateUrl: './gallery.component.html',
styleUrls: ['./gallery.component.scss']
})
export class GalleryComponent {
constructor(public gallery: Gallery, public lightbox: Lightbox) {}
items: GalleryItem[] = [];
imageData=DATA;
ngOnInit() {
/** Basic Gallery Example */
// Creat gallery items
this.items = this.imageData.map(
(item) => new ImageItem({ src: item.srcUrl, thumb: item.previewUrl })
);
/** Lightbox Example */
// Get a lightbox gallery ref
const lightboxRef = this.gallery.ref('lightbox');
// Add custom gallery config to the lightbox (optional)
lightboxRef.setConfig({
imageSize: ImageSize.Cover,
thumbPosition: ThumbnailsPosition.Top,
});
// Load items into the lightbox gallery ref
lightboxRef.load(this.items);
}
}
const DATA = [
{
id:1,
srcUrl: './assets/images/media/media-40.jpg',
previewUrl: './assets/images/media/media-40.jpg',
},
{
id:2,
srcUrl: './assets/images/media/media-41.jpg',
previewUrl: './assets/images/media/media-41.jpg',
},
{
id:3,
srcUrl: './assets/images/media/media-42.jpg',
previewUrl: './assets/images/media/media-42.jpg',
},
{
id:4,
srcUrl: './assets/images/media/media-43.jpg',
previewUrl: './assets/images/media/media-43.jpg',
},
{
id:5,
srcUrl: './assets/images/media/media-44.jpg',
previewUrl: './assets/images/media/media-44.jpg',
},
{
id:6,
srcUrl: './assets/images/media/media-45.jpg',
previewUrl: './assets/images/media/media-45.jpg',
},
{
id:7,
srcUrl: './assets/images/media/media-46.jpg',
previewUrl: './assets/images/media/media-46.jpg',
},
{
id:8,
srcUrl: './assets/images/media/media-60.jpg',
previewUrl: './assets/images/media/media-60.jpg',
},
];
src/app/components/apps/jobs/candidate-details/candidate-details.component.ts deleted 100644 → 0
import { Component, ElementRef } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';
import { CarouselModule, OwlOptions, SlidesOutputData } from 'ngx-owl-carousel-o';
import { fromEvent } from 'rxjs';
import { SharedModule } from '../../../../shared/shared.module';
import { RouterModule } from '@angular/router';
@Component({
selector: 'app-candidate-details',
standalone: true,
imports: [SharedModule, CarouselModule,RouterModule],
templateUrl: './candidate-details.component.html',
styleUrls: ['./candidate-details.component.scss']
})
export class CandidateDetailsComponent {
customOptions: OwlOptions = {
loop: true,
rtl:false,
mouseDrag: true,
touchDrag: true,
pullDrag: false,
dots: false,
navSpeed: 700,
autoplay: true,
navText: ['<', '>'],
autoHeight: true,
autoWidth: true,
responsive: {
0: {items: 1},
400: { items: 1 },
740: { items: 1},
1000: { items: 1},
},
nav: true,
};
activeSlides!: SlidesOutputData;
slidesStore: any[] = [
{
// company: 'Spotech Technical Solutions',
img:'./assets/images/faces/1.jpg',
role:'Software Developer',
name:'Brenda Simpson',
location:'Kondapur, Hyderabad',
rating:"bi bi-star-fill",
rating1:"bi bi-star-half",
ratings:'(142)',
degree:'Graduate',
shift:'sm:flexible-shift',
notice:'Immediate Joinee',
language:'Good at English',
skill1:'HTML',
skill2:'CSS',
skill3:'Javascript',
skill4:'Angular',
bond:'1 year bond accepted',
exp:'Exp : 2 Years'
},
{
// company: 'Dwayne Stort',
img:'./assets/images/faces/3.jpg',
role:'Web Developer',
name:'Brenda Simpson',
location:'Gachibowli, Hyderabad',
rating:"bi bi-star",
rating1:"bi bi-star",
ratings:'(35)',
degree:'Post Graduate',
shift:'sm:flexible-shift',
notice:'Within 10 Days',
language:'Good at English',
skill1:'React',
skill2:'CSS',
skill3:'Javascript',
skill4:'React Navtive',
bond:'2 years bond accepted',
exp:'Exp : 4 Years'
},
{
// company: 'Dwayne Stort',
img:'./assets/images/faces/21.jpg',
role:'Python Developer',
name:'Dwayne Stort',
location:'Gachibowli, Chennai',
rating:"bi bi-star",
rating1:"bi bi-star",
ratings:'(56)',
degree:'MBA',
shift:'Day-shift',
notice:'Within 30 Days',
language:'Avg at English',
skill1:'Python',
skill2:'Java',
skill3:'React',
skill4:'React Navtive',
exp:'Exp : 5 Years'
},
];
constructor(private sanitizer: DomSanitizer,private elementRef: ElementRef, ) {}
getPassedData(data: SlidesOutputData) {
this.activeSlides = data;
console.log(this.activeSlides);
}
ngOnInit(): void {
const ltr = this.elementRef.nativeElement.querySelectorAll('#switcher-ltr');
const rtl = this.elementRef.nativeElement.querySelectorAll('#switcher-rtl');
fromEvent(ltr, 'click').subscribe(() => {
this.customOptions = { ...this.customOptions, rtl: false };
});
fromEvent(rtl, 'click').subscribe(() => {
this.customOptions = { ...this.customOptions, rtl: true, autoplay: true };
});
}
}
src/app/components/apps/jobs/job-details/job-details.component.ts deleted 100644 → 0
import { Component, ElementRef } from '@angular/core';
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
import { CarouselModule, OwlOptions, SlidesOutputData } from 'ngx-owl-carousel-o';
import { fromEvent } from 'rxjs';
import { SharedModule } from '../../../../shared/shared.module';
import { RouterModule } from '@angular/router';
@Component({
selector: 'app-job-details',
standalone: true,
imports: [SharedModule, CarouselModule,RouterModule],
templateUrl: './job-details.component.html',
styleUrls: ['./job-details.component.scss']
})
export class JobDetailsComponent {
customOptions: OwlOptions = {
loop: true,
rtl:false,
mouseDrag: true,
touchDrag: true,
margin:10,
pullDrag: false,
dots: false,
navSpeed: 700,
autoplay: true,
navText: ['<', '>'],
autoHeight: true,
autoWidth: true,
responsive: {
0: {items: 1},
400: { items: 1 },
740: { items: 2},
1000: { items: 2},
},
nav: true,
};
activeSlides!: SlidesOutputData;
slidesStore: any[] = [
{
developer: 'Html Developer',
company: 'Spotech Technical Solutions',
svg: '<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path fill="var(--primary-color)" d="M21.46777,2.3252A1.00007,1.00007,0,0,0,20.73,2H3.27a1.00039,1.00039,0,0,0-.99609,1.08887l1.52,17a.99944.99944,0,0,0,.72851.87451l7.2002,2A.99628.99628,0,0,0,11.99023,23a1.01206,1.01206,0,0,0,.26709-.03613l7.21973-2a1.00055,1.00055,0,0,0,.729-.875l1.52-17A1,1,0,0,0,21.46777,2.3252Zm-3.19238,16.896L11.99072,20.9624,5.72461,19.22168,4.36328,4H19.63672ZM7.81982,13h6.895l-.32714,3.271-2.56788.917L8.65625,16.05811a1.00017,1.00017,0,1,0-.67285,1.88378l3.5,1.25a1.00291,1.00291,0,0,0,.67285,0l3.5-1.25a1.00044,1.00044,0,0,0,.65869-.84228l.5-5A1.00064,1.00064,0,0,0,15.81982,11H8.72461L8.4248,8h7.895a1,1,0,0,0,0-2h-9a1.00064,1.00064,0,0,0-.99511,1.09961l.5,5A1.00012,1.00012,0,0,0,7.81982,13Z"></path></svg>',
},
{
developer: 'React Developer',
company: 'Infra Private Limited',
svg: `<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path fill="var(--primary-color)" d="M11.103,10.43793a1.78593,1.78593,0,1,0,2.43957.65362A1.786,1.786,0,0,0,11.103,10.43793Zm8.0047,1.93768q-.17587-.201-.37116-.40308.13641-.14337.264-.28649c1.60583-1.80427,2.28357-3.61371,1.65558-4.70154-.60217-1.043-2.39343-1.35382-4.63593-.91779q-.33132.06482-.659.14624-.06272-.21624-.13343-.43C14.467,3.49042,13.2381,1.99921,11.98206,2,10.77765,2.00055,9.61359,3.39709,8.871,5.5575q-.10959.31969-.20276.64471-.21908-.05375-.44-.0993c-2.366-.48578-4.27167-.16584-4.89844.9226-.601,1.04376.02753,2.74982,1.52851,4.47211q.22329.25562.45922.49976c-.18542.191-.361.38189-.52465.57171-1.4646,1.698-2.05719,3.37616-1.45716,4.41541.61969,1.07348,2.49854,1.42437,4.7854.97436q.278-.05511.55292-.124.10071.35156.22095.697c.73932,2.11706,1.89685,3.46863,3.097,3.4682,1.23944-.00073,2.48194-1.45288,3.23474-3.65875.05945-.17432.11573-.35535.16907-.54175q.35514.08835.71485.1568c2.20336.41687,3.95251.089,4.55145-.951C21.28058,15.93109,20.64288,14.12933,19.10767,12.37561ZM4.07019,7.45184c.38586-.67,1.94324-.93139,3.98608-.512q.19584.04027.39838.09a20.464,20.464,0,0,0-.42126,2.67767,20.88659,20.88659,0,0,0-2.10389,1.6936q-.21945-.22695-.42718-.4649l.00006.00006C4.21631,9.46057,3.708,8.08081,4.07019,7.45184Zm3.88666,5.72809c-.51056-.3866-.98505-.78265-1.41571-1.181.43036-.39587.90515-.79059,1.41467-1.17615q-.02746.58915-.02722,1.1792Q7.929,12.59117,7.95685,13.17993Zm-.00061,3.94061a7.23675,7.23675,0,0,1-2.63971.09314,1.766,1.766,0,0,1-1.241-.65631c-.36407-.63067.11176-1.978,1.36432-3.43023q.23621-.273.48791-.53174a20.49026,20.49026,0,0,0,2.10712,1.70007,20.80226,20.80226,0,0,0,.42621,2.712Q8.21011,17.07023,7.95624,17.12054Zm7.10113-8.03936q-.50309-.317-1.01861-.61365-.5073-.292-1.0268-.56207c.593-.24933,1.17591-.46228,1.73865-.63581A18.21775,18.21775,0,0,1,15.05737,9.08118ZM9.679,5.83521c.63623-1.85114,1.57763-2.98053,2.30352-2.98084.77308-.00037,1.77753,1.21826,2.43433,3.19763q.064.19355.121.38928a20.478,20.478,0,0,0-2.52716.9712,20.06145,20.06145,0,0,0-2.519-.98194Q9.578,6.13062,9.679,5.83521ZM9.27863,7.259a18.30717,18.30717,0,0,1,1.72967.642Q9.95746,8.4433,8.96094,9.0824C9.0412,8.4444,9.148,7.83313,9.27863,7.259ZM8.9624,14.91968q.49695.31813,1.00843.61273.52174.30039,1.05737.57556a18.19577,18.19577,0,0,1-1.74445.66492C9.15161,16.1908,9.04364,15.56879,8.9624,14.91968Zm5.45569,3.14551A7.23556,7.23556,0,0,1,13.18,20.39844l-.00006.00006a1.76585,1.76585,0,0,1-1.18841.747c-.72821.00042-1.65766-1.085-2.28992-2.89545q-.11169-.32108-.20551-.648a20.10863,20.10863,0,0,0,2.52918-1.0097,20.79976,20.79976,0,0,0,2.54736.97851Q14.50141,17.81983,14.41809,18.06519Zm.36224-1.32422c-.56921-.176-1.16058-.39252-1.76214-.64551q.50867-.2677,1.02472-.56543.52955-.30579,1.0321-.62689A18.1524,18.1524,0,0,1,14.78033,16.741Zm.44629-4.74268q.00111.91095-.05688,1.82044c-.49268.33343-1.01282.659-1.554.97143-.53894.31116-1.07293.59711-1.59674.8559q-.82682-.39624-1.62176-.854-.79047-.455-1.54468-.969-.06894-.90921-.06946-1.82172l.00012.00019q-.00063-.91187.06794-1.82184c.49255-.33637,1.00891-.66168,1.54278-.96991.53632-.30969,1.077-.59442,1.61469-.85248q.81664.39688,1.60382.85065.78992.454,1.549.95868.06519.91443.06524,1.83166Zm.95673-5.09283c1.92133-.37372,3.37-.12232,3.73291.50622.3866.66962-.16748,2.1485-1.55383,3.70636l-.00006.00006q-.1149.12891-.23841.25891A20.06118,20.06118,0,0,0,15.98,9.68915a20.04054,20.04054,0,0,0-.40546-2.64893Q15.88486,6.96387,16.18335,6.90546Zm-.12988,3.8847A18.16447,18.16447,0,0,1,17.51483,11.978a18.11912,18.11912,0,0,1-1.45672,1.20831q.02325-.59391.02288-1.18842Q16.08072,11.39389,16.05347,10.79016Zm3.8681,5.78876c-.36346.63116-1.76788.89435-3.65222.53784q-.32391-.06115-.66474-.14557a20.069,20.069,0,0,0,.38746-2.68176,19.93914,19.93914,0,0,0,2.13708-1.71588q.17643.18329.33563.36487v-.00007a7.23437,7.23437,0,0,1,1.40308,2.23792A1.76563,1.76563,0,0,1,19.92157,16.57892Z"></path></svg>`,
},
{
developer: 'Vuejs Developer',
company: 'G Technical Solutions',
svg: `<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path fill="var(--primary-color)" d="M22.86723,3.374a.99906.99906,0,0,0-.86622-.50195l-4.97064-.00391-.00738-.001-3.64356.001a1.00172,1.00172,0,0,0-.81787.42481l-.55859.7959L11.43851,3.291a.9983.9983,0,0,0-.81591-.42286l-3.646-.001H6.97611l-.00146.00018-.00147-.00018H6.96781l-4.97314.02734a.99989.99989,0,0,0-.85742,1.50586L11.15678,21.50586A1.00068,1.00068,0,0,0,12.01957,22h.001a1.00062,1.00062,0,0,0,.86328-.49609L22.8643,4.376A1.00212,1.00212,0,0,0,22.86723,3.374ZM10.10453,4.86816l1.085,1.53321a.99856.99856,0,0,0,.81641.42285h.00146a1.00252,1.00252,0,0,0,.8169-.42481l1.07519-1.53125,1.36267-.001-3.244,5.45373L8.7432,4.86719Zm1.9126,14.14942L3.7393,4.88477l2.66992-.01465,4.75342,7.918a1.00082,1.00082,0,0,0,.85742.48535H12.022l.001-.00012.001.00012h.002a1,1,0,0,0,.85742-.48926l4.708-7.916,2.66949.00293Z"></path></svg>`,
},
{
developer: 'Wordpress Developer',
company: 'HardWare Private Solutions',
svg: `<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 24 24"><path fill="var(--primary-color)" d="M12,2a10.00009,10.00009,0,1,0,10,9.99976A10.01117,10.01117,0,0,0,12,2ZM3.00928,11.99976a8.95547,8.95547,0,0,1,.77844-3.659L8.07654,20.09131A8.99123,8.99123,0,0,1,3.00928,11.99976ZM12,20.99121a8.98726,8.98726,0,0,1-2.54-.36633l2.69788-7.83869,2.7633,7.57135a.84386.84386,0,0,0,.06446.12391A8.97138,8.97138,0,0,1,12,20.99121ZM13.239,7.78436c.54126-.02844,1.02906-.08539,1.02906-.08539a.37165.37165,0,0,0-.05738-.741s-1.4563.11432-2.39648.11432c-.8833,0-2.3678-.11432-2.3678-.11432a.37165.37165,0,0,0-.057.741s.4585.05695.943.08539l1.40075,3.838-1.968,5.90087L6.49133,7.78436C7.033,7.75592,7.52026,7.699,7.52026,7.699a.37166.37166,0,0,0-.05749-.741s-1.45593.11432-2.39612.11432c-.1687,0-.36768-.00415-.57861-.01093A8.98815,8.98815,0,0,1,18.07117,5.36957c-.0387-.00238-.07654-.0072-.11634-.0072A1.55669,1.55669,0,0,0,16.445,6.958a4.21016,4.21016,0,0,0,.88317,2.1087,4.73577,4.73577,0,0,1,.74122,2.47955,10.88314,10.88314,0,0,1-.68409,2.9065l-.897,2.99634ZM16.52,19.771l2.74609-7.9397A8.489,8.489,0,0,0,19.94983,8.611a6.9105,6.9105,0,0,0-.06043-.92456A8.99224,8.99224,0,0,1,16.52,19.771Z"></path></svg>`,
},
];
constructor(private sanitizer: DomSanitizer,private elementRef: ElementRef ) {}
getPassedData(data: SlidesOutputData) {
this.activeSlides = data;
console.log(this.activeSlides);
}
getSanitizedSVG(svgContent: string): SafeHtml {
return this.sanitizer.bypassSecurityTrustHtml(svgContent);
}
ngOnInit(): void {
const ltr = this.elementRef.nativeElement.querySelectorAll('#switcher-ltr');
const rtl = this.elementRef.nativeElement.querySelectorAll('#switcher-rtl');
fromEvent(ltr, 'click').subscribe(() => {
this.customOptions = { ...this.customOptions, rtl: false };
});
fromEvent(rtl, 'click').subscribe(() => {
this.customOptions = { ...this.customOptions, rtl: true, autoplay: true };
});
}
}
src/app/components/apps/jobs/job-post/job-post.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { SharedModule } from '../../../../shared/shared.module';
import { NgSelectModule } from '@ng-select/ng-select';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
@Component({
selector: 'app-job-post',
standalone: true,
imports: [SharedModule,NgSelectModule,FormsModule,ReactiveFormsModule],
templateUrl: './job-post.component.html',
styleUrls: ['./job-post.component.scss']
})
export class JobPostComponent {
selectedLanguages=['English'];
languages=[
{id:1,name:'French'},
{id:2,name:'Arabic'},
{id:3,name:'Hindi'},
]
selectedQualifications=['Graduate'];
Qualifications=[
{id:1,name:'Diploma'},
{id:2,name:'MBA'},
{id:3,name:'MCA'},
]
selectedSkills=['HTML'];
Skills=[
{id:1,name:'CSS'},
{id:2,name:'JavaScript'},
{id:3,name:'React'},
]
}
src/app/components/apps/jobs/jobs.routes.ts deleted 100644 → 0
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
export const admin: Routes = [
{path:'apps/jobs',children:[ {
path: 'candidate-details',
loadComponent: () =>
import('./candidate-details/candidate-details.component').then((m) => m.CandidateDetailsComponent),
},
{
path: 'job-details',
loadComponent: () =>
import('./job-details/job-details.component').then(
(m) => m.JobDetailsComponent
),
},
{
path: 'job-post',
loadComponent: () =>
import('./job-post/job-post.component').then(
(m) => m.JobPostComponent
),
},
{
path: 'jobs-list',
loadComponent: () =>
import('./jobs-list/jobs-list.component').then(
(m) => m.JobsListComponent
),
},
{
path: 'search-candidate',
loadComponent: () =>
import('./search-candidate/search-candidate.component').then(
(m) => m.SearchCandidateComponent
),
},
{
path: 'search-jobs',
loadComponent: () =>
import('./search-jobs/search-jobs.component').then(
(m) => m.SearchJobsComponent
),
},
{
path: 'search-company',
loadComponent: () =>
import('./search-company/search-company.component').then(
(m) => m.SearchCompanyComponent
),
},
]}
];
@NgModule({
imports: [RouterModule.forChild(admin)],
exports: [RouterModule],
})
export class jobsRoutingModule {
static routes = admin;
}
\ No newline at end of file
src/app/components/apps/jobs/search-candidate/search-candidate.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { SharedModule } from '../../../../shared/shared.module';
import { NgSelectModule } from '@ng-select/ng-select';
import { RouterModule } from '@angular/router';
import { MaterialModuleModule } from '../../../../material-module/material-module.module';
@Component({
selector: 'app-search-candidate',
standalone: true,
imports: [SharedModule,NgSelectModule,RouterModule,MaterialModuleModule],
templateUrl: './search-candidate.component.html',
styleUrls: ['./search-candidate.component.scss']
})
export class SearchCandidateComponent {
}
src/app/components/apps/jobs/search-company/search-company.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { SharedModule } from '../../../../shared/shared.module';
import { NgSelectModule } from '@ng-select/ng-select';
import { RouterModule } from '@angular/router';
@Component({
selector: 'app-search-company',
standalone: true,
imports: [SharedModule,NgSelectModule,RouterModule],
templateUrl: './search-company.component.html',
styleUrls: ['./search-company.component.scss']
})
export class SearchCompanyComponent {
}
src/app/components/apps/jobs/search-jobs/search-jobs.component.scss deleted 100644 → 0
mat-slider {
width: 300px;
}
\ No newline at end of file
src/app/components/apps/jobs/search-jobs/search-jobs.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { Options ,NgxSliderModule} from "ngx-slider-v2";
import { SharedModule } from '../../../../shared/shared.module';
import { NouisliderModule } from 'ng2-nouislider';
import { FormControl, FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MaterialModuleModule } from '../../../../material-module/material-module.module';
@Component({
selector: 'app-search-jobs',
standalone: true,
imports: [SharedModule,NgxSliderModule,MaterialModuleModule,FormsModule,ReactiveFormsModule],
templateUrl: './search-jobs.component.html',
styleUrls: ['./search-jobs.component.scss']
})
export class SearchJobsComponent {
}
src/app/components/apps/nft/create-nft/create-nft.component.ts deleted 100644 → 0
import { Component, ViewChild } from '@angular/core';
import { DropzoneConfigInterface, DropzoneComponent, DropzoneDirective } from 'ngx-dropzone-wrapper';
import { FilePondComponent, FilePondModule } from 'ngx-filepond';
import * as FilePond from 'filepond';
import { SharedModule } from '../../../../shared/shared.module';
import { NgSelectModule } from '@ng-select/ng-select';
@Component({
selector: 'app-create-nft',
standalone: true,
imports: [SharedModule,FilePondModule,NgSelectModule],
templateUrl: './create-nft.component.html',
styleUrls: ['./create-nft.component.scss']
})
export class CreateNftComponent {
public type: string = 'component';
public disabled: boolean = false;
public config: DropzoneConfigInterface = {
clickable: true,
maxFiles: 100,
autoReset: null,
errorReset: null,
cancelReset: null
};
@ViewChild(DropzoneComponent, { static: false }) componentRef?: DropzoneComponent;
@ViewChild(DropzoneDirective, { static: false }) directiveRef?: DropzoneDirective;
constructor() {}
public toggleType(): void {
this.type = (this.type === 'component') ? 'directive' : 'component';
}
public toggleDisabled(): void {
this.disabled = !this.disabled;
}
public toggleAutoReset(): void {
this.config.autoReset = this.config.autoReset ? null : 5000;
this.config.errorReset = this.config.errorReset ? null : 5000;
this.config.cancelReset = this.config.cancelReset ? null : 5000;
}
public toggleMultiUpload(): void {
this.config.maxFiles = this.config.maxFiles ? 0 : 1;
}
public toggleClickAction(): void {
this.config.clickable = !this.config.clickable;
}
public resetDropzoneUploads(): void {
if (this.type === 'directive' && this.directiveRef) {
this.directiveRef.reset();
} else if (this.type === 'component' && this.componentRef && this.componentRef.directiveRef) {
this.componentRef.directiveRef.reset();
}
}
public onUploadInit(args: any): void {
console.log('onUploadInit:', args);
}
public onUploadError(args: any): void {
console.log('onUploadError:', args);
}
public onUploadSuccess(args: any): void {
console.log('onUploadSuccess:', args);
}
ngOnInit(): void {
}
@ViewChild("myPond") myPond!: FilePondComponent;
pondOptions: FilePond.FilePondOptions = {
allowMultiple: true,
labelIdle: "Drop files here to Upload...",
};
singlepondOptions: FilePond.FilePondOptions = {
allowMultiple: false,
labelIdle: "Drop files here to Upload...",
};
pondFiles: FilePond.FilePondOptions["files"] = [
];
pondHandleInit() {
console.log("FilePond has initialised", this.myPond);
}
pondHandleAddFile(event: any) {
console.log("A file was added", event);
}
pondHandleActivateFile(event: any) {
console.log("A file was activated", event);
}
}
src/app/components/apps/nft/live-auction/live-auction.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { NgSelectModule } from '@ng-select/ng-select';
import { SharedModule } from '../../../../shared/shared.module';
@Component({
selector: 'app-live-auction',
standalone: true,
imports: [SharedModule,NgSelectModule],
templateUrl: './live-auction.component.html',
styleUrls: ['./live-auction.component.scss']
})
export class LiveAuctionComponent {
}
src/app/components/apps/nft/market-place/market-place.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { NgSelectModule } from '@ng-select/ng-select';
import { SharedModule } from '../../../../shared/shared.module';
@Component({
selector: 'app-market-place',
standalone: true,
imports: [SharedModule,NgSelectModule],
templateUrl: './market-place.component.html',
styleUrls: ['./market-place.component.scss']
})
export class MarketPlaceComponent {
}
src/app/components/apps/nft/nft-details/nft-details.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { Image } from '@ks89/angular-modal-gallery';
import { GalleryModule } from '@ks89/angular-modal-gallery';
import { SharedModule } from '../../../../shared/shared.module';
@Component({
selector: 'app-nft-details',
standalone: true,
imports: [SharedModule,GalleryModule],
templateUrl: './nft-details.component.html',
styleUrls: ['./nft-details.component.scss']
})
export class NftDetailsComponent {
dotsConfig!: false;
imagesRect: Image[] = [
new Image(
0,
{ img: './assets/images/nft-images/32.png', },
{ img: './assets/images/nft-images/32.png',}
),
new Image(1, { img: './assets/images/nft-images/33.png' }),
new Image(
2,
{
img: './assets/images/nft-images/31.png',
},
{
img: './assets/images/nft-images/31.png',
}
),
new Image(
3,
{
img: './assets/images/nft-images/30.png',
},
{ img: './assets/images/nft-images/30.png',
}
),
// new Image(4, { img: './assets/images/nft-images/33.png' }),
];
}
src/app/components/apps/nft/nft.routes.ts deleted 100644 → 0
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
export const admin: Routes = [
{path:'apps/nft',children:[ {
path: 'create-nft',
loadComponent: () =>
import('./create-nft/create-nft.component').then((m) => m.CreateNftComponent),
},
{
path: 'live-auction',
loadComponent: () =>
import('./live-auction/live-auction.component').then(
(m) => m.LiveAuctionComponent
),
},
{
path: 'market-place',
loadComponent: () =>
import('./market-place/market-place.component').then(
(m) => m.MarketPlaceComponent
),
},
{
path: 'nft-details',
loadComponent: () =>
import('./nft-details/nft-details.component').then(
(m) => m.NftDetailsComponent
),
},
{
path: 'wallet-integration',
loadComponent: () =>
import('./wallet-integration/wallet-integration.component').then(
(m) => m.WalletIntegrationComponent
),
},
]}
];
@NgModule({
imports: [RouterModule.forChild(admin)],
exports: [RouterModule],
})
export class nftRoutingModule {
static routes = admin;
}
\ No newline at end of file
src/app/components/apps/nft/wallet-integration/wallet-integration.component.ts deleted 100644 → 0
import { Component } from '@angular/core';
import { SharedModule } from '../../../../shared/shared.module';
@Component({
selector: 'app-wallet-integration',
standalone: true,
imports: [SharedModule],
templateUrl: './wallet-integration.component.html',
styleUrls: ['./wallet-integration.component.scss']
})
export class WalletIntegrationComponent {
}
src/app/components/apps/projects/create-project/create-project.component.html deleted 100644 → 0
<app-page-header [title]="'Create Project'" [activeTitle]="'Projects'" [title1]="'Create Project'"></app-page-header>
<!-- Start::row-1 -->
<div class="grid grid-cols-12 gap-6">
<div class="xl:col-span-12 col-span-12">
<div class="box custom-box">
<div class="box-header">
<div class="box-title">
Create Project
</div>
</div>
<div class="box-body">
<div class="grid grid-cols-12 gap-4">
<div class="xl:col-span-4 col-span-12">
<label for="input-label" class="form-label">Project Name :</label>
<input type="text" class="form-control" id="input-label" placeholder="Enter Project Name">
</div>
<div class="xl:col-span-4 col-span-12">
<label for="input-label1" class="form-label">Project Manager :</label>
<input type="text" class="form-control" id="input-label1" placeholder="Project Manager Name">
</div>
<div class="xl:col-span-4 col-span-12">
<label for="input-label1" class="form-label">Client / Stakeholder :</label>
<input type="text" class="form-control" placeholder="Enter Client Name">
</div>
<div class="xl:col-span-12 col-span-12 mb-4">
<label for="text-area" class="form-label">Project Description :</label>
<div id="project-descriptioin-editor">
<angular-editor [(ngModel)]="htmlContent" [config]="config">
</angular-editor>
</div>
</div>
<div class="xl:col-span-6 col-span-12">
<label class="form-label">Start Date :</label>
<div class="form-group">
<div class="input-group w-full">
<!-- <div class="input-group-text text-muted"> <i class="ri-calendar-line"></i> </div> -->
<input type="text" class="form-control" id="startDate" placeholder="Choose date and time"
mwlFlatpickr
[enableTime]="true"
[convertModelValue]="true"
[dateFormat]="'Y-m-d H:i'"
>
</div>
</div>
</div>
<div class="xl:col-span-6 col-span-12">
<label class="form-label">End Date :</label>
<div class="form-group">
<div class="input-group w-full">
<!-- <div class="input-group-text text-muted"> <i class="ri-calendar-line"></i> </div> -->
<input mwlFlatpickr
[enableTime]="true"
[convertModelValue]="true"
[dateFormat]="'Y-m-d H:i'" type="text" class="form-control" id="endDate" placeholder="Choose date and time"
>
<!-- <input type="text" class="form-control" id="endDate" placeholder="Choose date and time"> -->
</div>
</div>
</div>
<div class="xl:col-span-6 col-span-12">
<label class="form-label">Status :</label>
<ng-select data-trigger name="choices-single-default" id="choices-single-default" placeholder="Inprogress">
<ng-option value="Inprogress">Inprogress</ng-option>
<ng-option value="On-hold">On-hold</ng-option>
<ng-option value="Completed">Completed</ng-option>
</ng-select>
</div>
<div class="xl:col-span-6 col-span-12">
<label class="form-label">Priority :</label>
<ng-select data-trigger name="choices-single-default2" id="choices-single-default2" placeholder="High">
<ng-option value="High">High</ng-option>
<ng-option value="Medium">Medium</ng-option>
<ng-option value="Low">Low</ng-option>
</ng-select>
</div>
<div class="xl:col-span-6 col-span-12">
<label class="form-label">Assigned To</label>
<ng-select name="assigned-team-members" id="assigned-team-members" [multiple]="true" [(ngModel)]="selectedTags">
@for(tag of tags;track tag.id){
<ng-option [value]="tag.id"
>{{tag.name}}</ng-option>
}
</ng-select>
</div>
<div class="xl:col-span-6 col-span-12">
<label class="form-label">Tags</label>
<input class="form-control" id="choices-text-unique-values" type="text" [ngModel]="tags1.join(', ')"
(ngModelChange)="tags1 = $event.split(',')" placeholder="This is a placeholder">
</div>
<div class="xl:col-span-12 col-span-12">
<label for="text-area" class="form-label">Attachments</label>
<file-pond #myPond [options]="pondOptions" class="multiple-filepond" name="filepond" id="file-input" [files]="pondFiles"
(oninit)="pondHandleInit()" (onaddfile)="pondHandleAddFile($event)"
(onactivatefile)="pondHandleActivateFile($event)">
</file-pond>
</div>
</div>
</div>
<div class="box-footer">
<button type="button" class="ti-btn ti-btn-primary btn-wave ms-auto float-right">Create Project</button>
</div>
</div>
</div>
</div>
<!--End::row-1 -->
\ No newline at end of file
src/app/components/apps/projects/create-project/create-project.component.ts deleted 100644 → 0
import { Component, ViewChild } from '@angular/core';
import { FilePondComponent, FilePondModule } from 'ngx-filepond';
import * as FilePond from 'filepond';
import { AngularEditorConfig, AngularEditorModule } from '@kolkov/angular-editor';
import flatpickr from 'flatpickr';
import { NgSelectModule } from '@ng-select/ng-select';
import { SharedModule } from '../../../../shared/shared.module';
import { FlatpickrDefaults, FlatpickrModule } from 'angularx-flatpickr';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
@Component({
selector: 'app-create-project',
standalone: true,
imports: [SharedModule,NgSelectModule,FilePondModule,FlatpickrModule,FormsModule,ReactiveFormsModule,AngularEditorModule,HttpClientModule],
providers:[FlatpickrDefaults],
templateUrl: './create-project.component.html',
styleUrls: ['./create-project.component.scss']
})
export class CreateProjectComponent {
tags1: string[] = ["Marketing", "Sales", "Development", "Design", "Research"];
selectedTags=['Angelina May'];
tags=[
{id:1,name:'Kiara advain'},
{id:2,name:'Hercules Jhon'},
{id:3,name:'Mayor Kim'},
{id:4,name:'Alexa Biss'},
{id:5,name:'Karley Dia'},
{id:6,name:'Kim Jong'},
{id:7,name:'Darren Sami'},
{id:8,name:'Elizabeth'},
{id:9,name:'Bear Gills'},
{id:10,name:'Alex Carey'},
]
@ViewChild("myPond") myPond!: FilePondComponent;
pondOptions: FilePond.FilePondOptions = {
allowMultiple: true,
labelIdle: "Drop files here to Upload...",
};
singlepondOptions: FilePond.FilePondOptions = {
allowMultiple: false,
labelIdle: "Drop files here to Upload...",
};
pondFiles: FilePond.FilePondOptions["files"] = [
];
pondHandleInit() {
console.log("FilePond has initialised", this.myPond);
}
pondHandleAddFile(event: any) {
console.log("A file was added", event);
}
pondHandleActivateFile(event: any) {
console.log("A file was activated", event);
}
htmlContent:string = '';
config: AngularEditorConfig = {
editable: true,
spellcheck: true,
height: '10rem',
minHeight: '5rem',
translate: 'no',
defaultParagraphSeparator: 'p',
defaultFontName: 'Arial',
toolbarHiddenButtons: [
['bold']
],
customClasses: [
{
name: "quote",
class: "quote",
},
{
name: 'redText',
class: 'redText'
},
{
name: "titleText",
class: "titleText",
tag: "h1",
},
]
};
basicDemoValue = '2017-01-01';
inlineDatePicker: Date = new Date();
timePicker: Date | null = null;
timePicker1: Date | null = null;
timePicker2: Date | null = null;
timePicker3: Date | null = null;
timePicker4: Date | null = null;
flatpickrOptions: any = {
inline: true,
};
// flatpickrOptions: FlatpickrOptions;
constructor() {}
ngOnInit() {
this.flatpickrOptions = {
enableTime: true,
noCalendar: true,
dateFormat: 'H:i',
};
flatpickr('#inlinetime', this.flatpickrOptions);
this.flatpickrOptions = {
enableTime: true,
dateFormat: 'Y-m-d H:i', // Specify the format you want
defaultDate: '2023-11-07 14:30', // Set the default/preloaded time (adjust this to your desired time)
};
flatpickr('#pretime', this.flatpickrOptions);
}
}
src/app/components/dashboards/ecommerce/ecommerce.component.html deleted 100644 → 0
This source diff could not be displayed because it is too large. You can view the blob instead.
src/app/components/dashboards/sales/sales.component.html deleted 100644 → 0
This source diff could not be displayed because it is too large. You can view the blob instead.
src/app/components/widgets/widgets/widgets.component.html deleted 100644 → 0
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment