Add project files.

2023-04-29 09:17:17 +03:00
commit 62178f1f32
493 changed files with 45863 additions and 0 deletions
@@ -0,0 +1,154 @@
+import { Component, OnInit } from '@angular/core';
+import {
+	ApexAxisChartSeries,
+	ApexChart,
+	ApexXAxis,
+	ApexDataLabels,
+	ApexStroke,
+	ApexMarkers,
+	ApexYAxis,
+	ApexGrid,
+	ApexTitleSubtitle,
+	ApexTooltip,
+	ApexLegend,
+	ApexFill,
+	ApexResponsive,
+	ApexNonAxisChartSeries,
+} from 'ng-apexcharts';
+
+export type ChartOptions = {
+	series: ApexAxisChartSeries;
+	series2: ApexNonAxisChartSeries;
+	chart: ApexChart;
+	xaxis: ApexXAxis;
+	stroke: ApexStroke;
+	dataLabels: ApexDataLabels;
+	markers: ApexMarkers;
+	colors: string[];
+	yaxis: ApexYAxis;
+	grid: ApexGrid;
+	legend: ApexLegend;
+	tooltip: ApexTooltip;
+	fill: ApexFill;
+	title: ApexTitleSubtitle;
+	responsive: ApexResponsive[];
+	labels: string[];
+};
+
+@Component({
+	selector: 'app-dashboard2',
+	templateUrl: './dashboard2.component.html',
+	styleUrls: ['./dashboard2.component.scss'],
+})
+export class Dashboard2Component implements OnInit {
+	lineChartOptions!: Partial<ChartOptions>;
+	pieChartOptions!: Partial<ChartOptions>;
+
+	//  color: ["#3FA7DC", "#F6A025", "#9BC311"],
+	constructor() {
+		//constructor
+	}
+
+	ngOnInit() {
+		this.chart1();
+		this.chart2();
+	}
+
+	private chart1() {
+		this.lineChartOptions = {
+			series: [
+				{
+					name: 'Product 1',
+					data: [70, 200, 80, 180, 170, 105, 210],
+				},
+				{
+					name: 'Product 2',
+					data: [80, 250, 30, 120, 260, 100, 180],
+				},
+				{
+					name: 'Product 3',
+					data: [85, 130, 85, 225, 80, 190, 120],
+				},
+			],
+			chart: {
+				height: 350,
+				type: 'line',
+				foreColor: '#9aa0ac',
+				dropShadow: {
+					enabled: true,
+					color: '#000',
+					top: 18,
+					left: 7,
+					blur: 10,
+					opacity: 0.2,
+				},
+				toolbar: {
+					show: false,
+				},
+			},
+			colors: ['#00E396', '#775DD0', '#FEB019'],
+			stroke: {
+				curve: 'smooth',
+			},
+			grid: {
+				show: true,
+				borderColor: '#9aa0ac',
+				strokeDashArray: 1,
+			},
+			markers: {
+				size: 3,
+			},
+			xaxis: {
+				categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul'],
+				title: {
+					text: 'Month',
+				},
+			},
+			yaxis: {
+				// opposite: true,
+				title: {
+					text: 'Sales',
+				},
+			},
+			legend: {
+				position: 'top',
+				horizontalAlign: 'right',
+				floating: true,
+				offsetY: -25,
+				offsetX: -5,
+			},
+			tooltip: {
+				theme: 'dark',
+				marker: {
+					show: true,
+				},
+				x: {
+					show: true,
+				},
+			},
+		};
+	}
+
+	private chart2() {
+		this.pieChartOptions = {
+			series2: [44, 55, 13, 43, 22],
+			chart: {
+				type: 'donut',
+				width: 225,
+			},
+			legend: {
+				show: false,
+			},
+			dataLabels: {
+				enabled: false,
+			},
+			labels: ['Science', 'Mathes', 'Economics', 'History', 'Music'],
+			responsive: [
+				{
+					breakpoint: 480,
+					options: {},
+				},
+			],
+		};
+	}
+}