29 
+    "tslib": "^2.2.0",
30 
+    "zone.js": "~0.11.4"
31 
+  },
32 
+  "devDependencies": {
33 
+    "@angular-devkit/build-angular": "~13.2.3",
34 
+    "@angular-eslint/builder": "~13.0.1",
35 
+    "@angular-eslint/eslint-plugin": "~13.0.1",
36 
+    "@angular-eslint/eslint-plugin-template": "~13.0.1",
37 
+    "@angular-eslint/template-parser": "~13.0.1",
38 
+    "@angular/cli": "~13.2.3",
39 
+    "@angular/compiler": "~13.2.2",
40 
+    "@angular/compiler-cli": "~13.2.2",
41 
+    "@angular/language-service": "~13.2.2",
42 
+    "@capacitor/cli": "3.5.0",
43 
+    "@ionic/angular-toolkit": "^6.0.0",
44 
+    "@types/jasmine": "~3.6.0",
45 
+    "@types/jasminewd2": "~2.0.3",
46 
+    "@types/node": "^12.11.1",
47 
+    "@typescript-eslint/eslint-plugin": "5.3.0",
48 
+    "@typescript-eslint/parser": "5.3.0",
49 
+    "eslint": "^7.6.0",
50 
+    "eslint-plugin-import": "2.22.1",
51 
+    "eslint-plugin-jsdoc": "30.7.6",
52 
+    "eslint-plugin-prefer-arrow": "1.2.2",
53 
+    "jasmine-core": "~3.8.0",
54 
+    "jasmine-spec-reporter": "~5.0.0",
55 
+    "karma": "~6.3.2",
56 
+    "karma-chrome-launcher": "~3.1.0",
57 
+    "karma-coverage": "~2.0.3",
58 
+    "karma-coverage-istanbul-reporter": "~3.0.2",
59 
+    "karma-jasmine": "~4.0.0",
60 
+    "karma-jasmine-html-reporter": "^1.5.0",
61 
+    "protractor": "~7.0.0",
62 
+    "ts-node": "~8.3.0",
63 
+    "typescript": "~4.4.4"
64 
+  },
65 
+  "description": "An Ionic project"
66 
+}

+ 16 - 0
src/app/app-routing.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,16 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
3 
+
4 
+const routes: Routes = [
5 
+  {
6 
+    path: '',
7 
+    loadChildren: () => import('./tabs/tabs.module').then(m => m.TabsPageModule)
8 
+  }
9 
+];
10 
+@NgModule({
11 
+  imports: [
12 
+    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
13 
+  ],
14 
+  exports: [RouterModule]
15 
+})
16 
+export class AppRoutingModule {}

+ 3 - 0
src/app/app.component.html
Dosyayı Görüntüle 

@@ -0,0 +1,3 @@
1 
+<ion-app>
2 
+  <ion-router-outlet></ion-router-outlet>
3 
+</ion-app>

+ 0 - 0
src/app/app.component.scss
Dosyayı Görüntüle


+ 23 - 0
src/app/app.component.spec.ts
Dosyayı Görüntüle 

@@ -0,0 +1,23 @@
1 
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
2 
+import { TestBed, waitForAsync } from '@angular/core/testing';
3 
+
4 
+import { AppComponent } from './app.component';
5 
+
6 
+describe('AppComponent', () => {
7 
+
8 
+  beforeEach(waitForAsync(() => {
9 
+
10 
+    TestBed.configureTestingModule({
11 
+      declarations: [AppComponent],
12 
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
13 
+    }).compileComponents();
14 
+  }));
15 
+
16 
+  it('should create the app', () => {
17 
+    const fixture = TestBed.createComponent(AppComponent);
18 
+    const app = fixture.debugElement.componentInstance;
19 
+    expect(app).toBeTruthy();
20 
+  });
21 
+  // TODO: add more tests!
22 
+
23 
+});

+ 10 - 0
src/app/app.component.ts
Dosyayı Görüntüle 

@@ -0,0 +1,10 @@
1 
+import { Component } from '@angular/core';
2 
+
3 
+@Component({
4 
+  selector: 'app-root',
5 
+  templateUrl: 'app.component.html',
6 
+  styleUrls: ['app.component.scss'],
7 
+})
8 
+export class AppComponent {
9 
+  constructor() {}
10 
+}

+ 17 - 0
src/app/app.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,17 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { BrowserModule } from '@angular/platform-browser';
3 
+import { RouteReuseStrategy } from '@angular/router';
4 
+
5 
+import { IonicModule, IonicRouteStrategy } from '@ionic/angular';
6 
+
7 
+import { AppRoutingModule } from './app-routing.module';
8 
+import { AppComponent } from './app.component';
9 
+
10 
+@NgModule({
11 
+  declarations: [AppComponent],
12 
+  entryComponents: [],
13 
+  imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
14 
+  providers: [{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }],
15 
+  bootstrap: [AppComponent],
16 
+})
17 
+export class AppModule {}

+ 4 - 0
src/app/explore-container/explore-container.component.html
Dosyayı Görüntüle 

@@ -0,0 +1,4 @@
1 
+<div id="container">
2 
+  <strong>{{ name }}</strong>
3 
+  <p>Explore <a target="_blank" rel="noopener noreferrer" href="https://ionicframework.com/docs/components">UI Components</a></p>
4 
+</div>

+ 27 - 0
src/app/explore-container/explore-container.component.scss
Dosyayı Görüntüle 

@@ -0,0 +1,27 @@
1 
+#container {
2 
+  text-align: center;
3 
+
4 
+  position: absolute;
5 
+  left: 0;
6 
+  right: 0;
7 
+  top: 50%;
8 
+  transform: translateY(-50%);
9 
+}
10 
+
11 
+#container strong {
12 
+  font-size: 20px;
13 
+  line-height: 26px;
14 
+}
15 
+
16 
+#container p {
17 
+  font-size: 16px;
18 
+  line-height: 22px;
19 
+
20 
+  color: #8c8c8c;
21 
+
22 
+  margin: 0;
23 
+}
24 
+
25 
+#container a {
26 
+  text-decoration: none;
27 
+}

+ 24 - 0
src/app/explore-container/explore-container.component.spec.ts
Dosyayı Görüntüle 

@@ -0,0 +1,24 @@
1 
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
2 
+import { IonicModule } from '@ionic/angular';
3 
+
4 
+import { ExploreContainerComponent } from './explore-container.component';
5 
+
6 
+describe('ExploreContainerComponent', () => {
7 
+  let component: ExploreContainerComponent;
8 
+  let fixture: ComponentFixture<ExploreContainerComponent>;
9 
+
10 
+  beforeEach(waitForAsync(() => {
11 
+    TestBed.configureTestingModule({
12 
+      declarations: [ ExploreContainerComponent ],
13 
+      imports: [IonicModule.forRoot()]
14 
+    }).compileComponents();
15 
+
16 
+    fixture = TestBed.createComponent(ExploreContainerComponent);
17 
+    component = fixture.componentInstance;
18 
+    fixture.detectChanges();
19 
+  }));
20 
+
21 
+  it('should create', () => {
22 
+    expect(component).toBeTruthy();
23 
+  });
24 
+});

+ 15 - 0
src/app/explore-container/explore-container.component.ts
Dosyayı Görüntüle 

@@ -0,0 +1,15 @@
1 
+import { Component, OnInit, Input } from '@angular/core';
2 
+
3 
+@Component({
4 
+  selector: 'app-explore-container',
5 
+  templateUrl: './explore-container.component.html',
6 
+  styleUrls: ['./explore-container.component.scss'],
7 
+})
8 
+export class ExploreContainerComponent implements OnInit {
9 
+  @Input() name: string;
10 
+
11 
+  constructor() { }
12 
+
13 
+  ngOnInit() {}
14 
+
15 
+}

+ 14 - 0
src/app/explore-container/explore-container.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,14 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { CommonModule } from '@angular/common';
3 
+import { FormsModule } from '@angular/forms';
4 
+
5 
+import { IonicModule } from '@ionic/angular';
6 
+
7 
+import { ExploreContainerComponent } from './explore-container.component';
8 
+
9 
+@NgModule({
10 
+  imports: [ CommonModule, FormsModule, IonicModule],
11 
+  declarations: [ExploreContainerComponent],
12 
+  exports: [ExploreContainerComponent]
13 
+})
14 
+export class ExploreContainerComponentModule {}

+ 16 - 0
src/app/tab1/tab1-routing.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,16 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { RouterModule, Routes } from '@angular/router';
3 
+import { Tab1Page } from './tab1.page';
4 
+
5 
+const routes: Routes = [
6 
+  {
7 
+    path: '',
8 
+    component: Tab1Page,
9 
+  }
10 
+];
11 
+
12 
+@NgModule({
13 
+  imports: [RouterModule.forChild(routes)],
14 
+  exports: [RouterModule]
15 
+})
16 
+export class Tab1PageRoutingModule {}

+ 20 - 0
src/app/tab1/tab1.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,20 @@
1 
+import { IonicModule } from '@ionic/angular';
2 
+import { NgModule } from '@angular/core';
3 
+import { CommonModule } from '@angular/common';
4 
+import { FormsModule } from '@angular/forms';
5 
+import { Tab1Page } from './tab1.page';
6 
+import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
7 
+
8 
+import { Tab1PageRoutingModule } from './tab1-routing.module';
9 
+
10 
+@NgModule({
11 
+  imports: [
12 
+    IonicModule,
13 
+    CommonModule,
14 
+    FormsModule,
15 
+    ExploreContainerComponentModule,
16 
+    Tab1PageRoutingModule
17 
+  ],
18 
+  declarations: [Tab1Page]
19 
+})
20 
+export class Tab1PageModule {}

+ 17 - 0
src/app/tab1/tab1.page.html
Dosyayı Görüntüle 

@@ -0,0 +1,17 @@
1 
+<ion-header [translucent]="true">
2 
+  <ion-toolbar>
3 
+    <ion-title>
4 
+      Tab 1
5 
+    </ion-title>
6 
+  </ion-toolbar>
7 
+</ion-header>
8 
+
9 
+<ion-content [fullscreen]="true">
10 
+  <ion-header collapse="condense">
11 
+    <ion-toolbar>
12 
+      <ion-title size="large">Tab 1</ion-title>
13 
+    </ion-toolbar>
14 
+  </ion-header>
15 
+
16 
+  <app-explore-container name="Tab 1 page"></app-explore-container>
17 
+</ion-content>

+ 0 - 0
src/app/tab1/tab1.page.scss
Dosyayı Görüntüle


+ 25 - 0
src/app/tab1/tab1.page.spec.ts
Dosyayı Görüntüle 

@@ -0,0 +1,25 @@
1 
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
2 
+import { IonicModule } from '@ionic/angular';
3 
+import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
4 
+
5 
+import { Tab1Page } from './tab1.page';
6 
+
7 
+describe('Tab1Page', () => {
8 
+  let component: Tab1Page;
9 
+  let fixture: ComponentFixture<Tab1Page>;
10 
+
11 
+  beforeEach(waitForAsync(() => {
12 
+    TestBed.configureTestingModule({
13 
+      declarations: [Tab1Page],
14 
+      imports: [IonicModule.forRoot(), ExploreContainerComponentModule]
15 
+    }).compileComponents();
16 
+
17 
+    fixture = TestBed.createComponent(Tab1Page);
18 
+    component = fixture.componentInstance;
19 
+    fixture.detectChanges();
20 
+  }));
21 
+
22 
+  it('should create', () => {
23 
+    expect(component).toBeTruthy();
24 
+  });
25 
+});

+ 12 - 0
src/app/tab1/tab1.page.ts
Dosyayı Görüntüle 

@@ -0,0 +1,12 @@
1 
+import { Component } from '@angular/core';
2 
+
3 
+@Component({
4 
+  selector: 'app-tab1',
5 
+  templateUrl: 'tab1.page.html',
6 
+  styleUrls: ['tab1.page.scss']
7 
+})
8 
+export class Tab1Page {
9 
+
10 
+  constructor() {}
11 
+
12 
+}

+ 16 - 0
src/app/tab2/tab2-routing.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,16 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { RouterModule, Routes } from '@angular/router';
3 
+import { Tab2Page } from './tab2.page';
4 
+
5 
+const routes: Routes = [
6 
+  {
7 
+    path: '',
8 
+    component: Tab2Page,
9 
+  }
10 
+];
11 
+
12 
+@NgModule({
13 
+  imports: [RouterModule.forChild(routes)],
14 
+  exports: [RouterModule]
15 
+})
16 
+export class Tab2PageRoutingModule {}

+ 21 - 0
src/app/tab2/tab2.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,21 @@
1 
+import { IonicModule } from '@ionic/angular';
2 
+import { RouterModule } from '@angular/router';
3 
+import { NgModule } from '@angular/core';
4 
+import { CommonModule } from '@angular/common';
5 
+import { FormsModule } from '@angular/forms';
6 
+import { Tab2Page } from './tab2.page';
7 
+import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
8 
+
9 
+import { Tab2PageRoutingModule } from './tab2-routing.module';
10 
+
11 
+@NgModule({
12 
+  imports: [
13 
+    IonicModule,
14 
+    CommonModule,
15 
+    FormsModule,
16 
+    ExploreContainerComponentModule,
17 
+    Tab2PageRoutingModule
18 
+  ],
19 
+  declarations: [Tab2Page]
20 
+})
21 
+export class Tab2PageModule {}

+ 17 - 0
src/app/tab2/tab2.page.html
Dosyayı Görüntüle 

@@ -0,0 +1,17 @@
1 
+<ion-header [translucent]="true">
2 
+  <ion-toolbar>
3 
+    <ion-title>
4 
+      Tab 2
5 
+    </ion-title>
6 
+  </ion-toolbar>
7 
+</ion-header>
8 
+
9 
+<ion-content [fullscreen]="true">
10 
+  <ion-header collapse="condense">
11 
+    <ion-toolbar>
12 
+      <ion-title size="large">Tab 2</ion-title>
13 
+    </ion-toolbar>
14 
+  </ion-header>
15 
+
16 
+  <app-explore-container name="Tab 2 page"></app-explore-container>
17 
+</ion-content>

+ 0 - 0
src/app/tab2/tab2.page.scss
Dosyayı Görüntüle


+ 25 - 0
src/app/tab2/tab2.page.spec.ts
Dosyayı Görüntüle 

@@ -0,0 +1,25 @@
1 
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
2 
+import { IonicModule } from '@ionic/angular';
3 
+import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
4 
+
5 
+import { Tab2Page } from './tab2.page';
6 
+
7 
+describe('Tab2Page', () => {
8 
+  let component: Tab2Page;
9 
+  let fixture: ComponentFixture<Tab2Page>;
10 
+
11 
+  beforeEach(waitForAsync(() => {
12 
+    TestBed.configureTestingModule({
13 
+      declarations: [Tab2Page],
14 
+      imports: [IonicModule.forRoot(), ExploreContainerComponentModule]
15 
+    }).compileComponents();
16 
+
17 
+    fixture = TestBed.createComponent(Tab2Page);
18 
+    component = fixture.componentInstance;
19 
+    fixture.detectChanges();
20 
+  }));
21 
+
22 
+  it('should create', () => {
23 
+    expect(component).toBeTruthy();
24 
+  });
25 
+});

+ 12 - 0
src/app/tab2/tab2.page.ts
Dosyayı Görüntüle 

@@ -0,0 +1,12 @@
1 
+import { Component } from '@angular/core';
2 
+
3 
+@Component({
4 
+  selector: 'app-tab2',
5 
+  templateUrl: 'tab2.page.html',
6 
+  styleUrls: ['tab2.page.scss']
7 
+})
8 
+export class Tab2Page {
9 
+
10 
+  constructor() {}
11 
+
12 
+}

+ 16 - 0
src/app/tab3/tab3-routing.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,16 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { RouterModule, Routes } from '@angular/router';
3 
+import { Tab3Page } from './tab3.page';
4 
+
5 
+const routes: Routes = [
6 
+  {
7 
+    path: '',
8 
+    component: Tab3Page,
9 
+  }
10 
+];
11 
+
12 
+@NgModule({
13 
+  imports: [RouterModule.forChild(routes)],
14 
+  exports: [RouterModule]
15 
+})
16 
+export class Tab3PageRoutingModule {}

+ 22 - 0
src/app/tab3/tab3.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,22 @@
1 
+import { IonicModule } from '@ionic/angular';
2 
+import { RouterModule } from '@angular/router';
3 
+import { NgModule } from '@angular/core';
4 
+import { CommonModule } from '@angular/common';
5 
+import { FormsModule } from '@angular/forms';
6 
+import { Tab3Page } from './tab3.page';
7 
+import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
8 
+
9 
+import { Tab3PageRoutingModule } from './tab3-routing.module';
10 
+
11 
+@NgModule({
12 
+  imports: [
13 
+    IonicModule,
14 
+    CommonModule,
15 
+    FormsModule,
16 
+    ExploreContainerComponentModule,
17 
+    RouterModule.forChild([{ path: '', component: Tab3Page }]),
18 
+    Tab3PageRoutingModule,
19 
+  ],
20 
+  declarations: [Tab3Page]
21 
+})
22 
+export class Tab3PageModule {}

+ 17 - 0
src/app/tab3/tab3.page.html
Dosyayı Görüntüle 

@@ -0,0 +1,17 @@
1 
+<ion-header [translucent]="true">
2 
+  <ion-toolbar>
3 
+    <ion-title>
4 
+      Tab 3
5 
+    </ion-title>
6 
+  </ion-toolbar>
7 
+</ion-header>
8 
+
9 
+<ion-content [fullscreen]="true">
10 
+  <ion-header collapse="condense">
11 
+    <ion-toolbar>
12 
+      <ion-title size="large">Tab 3</ion-title>
13 
+    </ion-toolbar>
14 
+  </ion-header>
15 
+
16 
+  <app-explore-container name="Tab 3 page"></app-explore-container>
17 
+</ion-content>

+ 0 - 0
src/app/tab3/tab3.page.scss
Dosyayı Görüntüle


+ 25 - 0
src/app/tab3/tab3.page.spec.ts
Dosyayı Görüntüle 

@@ -0,0 +1,25 @@
1 
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
2 
+import { IonicModule } from '@ionic/angular';
3 
+import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';
4 
+
5 
+import { Tab3Page } from './tab3.page';
6 
+
7 
+describe('Tab3Page', () => {
8 
+  let component: Tab3Page;
9 
+  let fixture: ComponentFixture<Tab3Page>;
10 
+
11 
+  beforeEach(waitForAsync(() => {
12 
+    TestBed.configureTestingModule({
13 
+      declarations: [Tab3Page],
14 
+      imports: [IonicModule.forRoot(), ExploreContainerComponentModule]
15 
+    }).compileComponents();
16 
+
17 
+    fixture = TestBed.createComponent(Tab3Page);
18 
+    component = fixture.componentInstance;
19 
+    fixture.detectChanges();
20 
+  }));
21 
+
22 
+  it('should create', () => {
23 
+    expect(component).toBeTruthy();
24 
+  });
25 
+});

+ 12 - 0
src/app/tab3/tab3.page.ts
Dosyayı Görüntüle 

@@ -0,0 +1,12 @@
1 
+import { Component } from '@angular/core';
2 
+
3 
+@Component({
4 
+  selector: 'app-tab3',
5 
+  templateUrl: 'tab3.page.html',
6 
+  styleUrls: ['tab3.page.scss']
7 
+})
8 
+export class Tab3Page {
9 
+
10 
+  constructor() {}
11 
+
12 
+}

+ 39 - 0
src/app/tabs/tabs-routing.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,39 @@
1 
+import { NgModule } from '@angular/core';
2 
+import { RouterModule, Routes } from '@angular/router';
3 
+import { TabsPage } from './tabs.page';
4 
+
5 
+const routes: Routes = [
6 
+  {
7 
+    path: 'tabs',
8 
+    component: TabsPage,
9 
+    children: [
10 
+      {
11 
+        path: 'tab1',
12 
+        loadChildren: () => import('../tab1/tab1.module').then(m => m.Tab1PageModule)
13 
+      },
14 
+      {
15 
+        path: 'tab2',
16 
+        loadChildren: () => import('../tab2/tab2.module').then(m => m.Tab2PageModule)
17 
+      },
18 
+      {
19 
+        path: 'tab3',
20 
+        loadChildren: () => import('../tab3/tab3.module').then(m => m.Tab3PageModule)
21 
+      },
22 
+      {
23 
+        path: '',
24 
+        redirectTo: '/tabs/tab1',
25 
+        pathMatch: 'full'
26 
+      }
27 
+    ]
28 
+  },
29 
+  {
30 
+    path: '',
31 
+    redirectTo: '/tabs/tab1',
32 
+    pathMatch: 'full'
33 
+  }
34 
+];
35 
+
36 
+@NgModule({
37 
+  imports: [RouterModule.forChild(routes)],
38 
+})
39 
+export class TabsPageRoutingModule {}

+ 19 - 0
src/app/tabs/tabs.module.ts
Dosyayı Görüntüle 

@@ -0,0 +1,19 @@
1 
+import { IonicModule } from '@ionic/angular';
2 
+import { NgModule } from '@angular/core';
3 
+import { CommonModule } from '@angular/common';
4 
+import { FormsModule } from '@angular/forms';
5 
+
6 
+import { TabsPageRoutingModule } from './tabs-routing.module';
7 
+
8 
+import { TabsPage } from './tabs.page';
9 
+
10 
+@NgModule({
11 
+  imports: [
12 
+    IonicModule,
13 
+    CommonModule,
14 
+    FormsModule,
15 
+    TabsPageRoutingModule
16 
+  ],
17 
+  declarations: [TabsPage]
18 
+})
19 
+export class TabsPageModule {}

+ 20 - 0
src/app/tabs/tabs.page.html
Dosyayı Görüntüle 

@@ -0,0 +1,20 @@
1 
+<ion-tabs>
2 
+
3 
+  <ion-tab-bar slot="bottom">
4 
+    <ion-tab-button tab="tab1">
5 
+      <ion-icon name="triangle"></ion-icon>
6 
+      <ion-label>Tab 1</ion-label>
7 
+    </ion-tab-button>
8 
+
9 
+    <ion-tab-button tab="tab2">
10 
+      <ion-icon name="ellipse"></ion-icon>
11 
+      <ion-label>Tab 2</ion-label>
12 
+    </ion-tab-button>
13 
+
14 
+    <ion-tab-button tab="tab3">
15 
+      <ion-icon name="square"></ion-icon>
16 
+      <ion-label>Tab 3</ion-label>
17 
+    </ion-tab-button>
18 
+  </ion-tab-bar>
19 
+
20 
+</ion-tabs>

+ 1 - 0
src/app/tabs/tabs.page.scss
Dosyayı Görüntüle 

@@ -0,0 +1 @@
1 
+

+ 26 - 0
src/app/tabs/tabs.page.spec.ts
Dosyayı Görüntüle 

@@ -0,0 +1,26 @@
1 
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
2 
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
3 
+
4 
+import { TabsPage } from './tabs.page';
5 
+
6 
+describe('TabsPage', () => {
7 
+  let component: TabsPage;
8 
+  let fixture: ComponentFixture<TabsPage>;
9 
+
10 
+  beforeEach(waitForAsync(() => {
11 
+    TestBed.configureTestingModule({
12 
+      declarations: [TabsPage],
13 
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
14 
+    }).compileComponents();
15 
+  }));
16 
+
17 
+  beforeEach(() => {
18 
+    fixture = TestBed.createComponent(TabsPage);
19 
+    component = fixture.componentInstance;
20 
+    fixture.detectChanges();
21 
+  });
22 
+
23 
+  it('should create', () => {
24 
+    expect(component).toBeTruthy();
25 
+  });
26 
+});

+ 12 - 0
src/app/tabs/tabs.page.ts
Dosyayı Görüntüle 

@@ -0,0 +1,12 @@
1 
+import { Component } from '@angular/core';
2 
+
3 
+@Component({
4 
+  selector: 'app-tabs',
5 
+  templateUrl: 'tabs.page.html',
6 
+  styleUrls: ['tabs.page.scss']
7 
+})
8 
+export class TabsPage {
9 
+
10 
+  constructor() {}
11 
+
12 
+}

BIN
src/assets/icon/favicon.png
Dosyayı Görüntüle


Dosya farkı çok büyük olduğundan ihmal edildi
+ 1 - 0
src/assets/shapes.svg


+ 3 - 0
src/environments/environment.prod.ts
Dosyayı Görüntüle 

@@ -0,0 +1,3 @@
1 
+export const environment = {
2 
+  production: true
3 
+};

+ 16 - 0
src/environments/environment.ts
Dosyayı Görüntüle 

@@ -0,0 +1,16 @@
1 
+// This file can be replaced during build by using the `fileReplacements` array.
2 
+// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
3 
+// The list of file replacements can be found in `angular.json`.
4 
+
5 
+export const environment = {
6 
+  production: false
7 
+};
8 
+
9 
+/*
10 
+ * For easier debugging in development mode, you can import the following file
11 
+ * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
12 
+ *
13 
+ * This import should be commented out in production mode because it will have a negative impact
14 
+ * on performance if an error is thrown.
15 
+ */
16 
+// import 'zone.js/dist/zone-error';  // Included with Angular CLI.

+ 26 - 0
src/global.scss
Dosyayı Görüntüle 

@@ -0,0 +1,26 @@
1 
+/*
2 
+ * App Global CSS
3 
+ * ----------------------------------------------------------------------------
4 
+ * Put style rules here that you want to apply globally. These styles are for
5 
+ * the entire app and not just one component. Additionally, this file can be
6 
+ * used as an entry point to import other CSS/Sass files to be included in the
7 
+ * output CSS.
8 
+ * For more information on global stylesheets, visit the documentation:
9 
+ * https://ionicframework.com/docs/layout/global-stylesheets
10 
+ */
11 
+
12 
+/* Core CSS required for Ionic components to work properly */
13 
+@import "~@ionic/angular/css/core.css";
14 
+
15 
+/* Basic CSS for apps built with Ionic */
16 
+@import "~@ionic/angular/css/normalize.css";
17 
+@import "~@ionic/angular/css/structure.css";
18 
+@import "~@ionic/angular/css/typography.css";
19 
+@import '~@ionic/angular/css/display.css';
20 
+
21 
+/* Optional CSS utils that can be commented out */
22 
+@import "~@ionic/angular/css/padding.css";
23 
+@import "~@ionic/angular/css/float-elements.css";
24 
+@import "~@ionic/angular/css/text-alignment.css";
25 
+@import "~@ionic/angular/css/text-transformation.css";
26 
+@import "~@ionic/angular/css/flex-utils.css";

+ 26 - 0
src/index.html
Dosyayı Görüntüle 

@@ -0,0 +1,26 @@
1 
+<!DOCTYPE html>
2 
+<html lang="en">
3 
+
4 
+<head>
5 
+  <meta charset="utf-8" />
6 
+  <title>Ionic App</title>
7 
+
8 
+  <base href="/" />
9 
+
10 
+  <meta name="color-scheme" content="light dark" />
11 
+  <meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
12 
+  <meta name="format-detection" content="telephone=no" />
13 
+  <meta name="msapplication-tap-highlight" content="no" />
14 
+
15 
+  <link rel="icon" type="image/png" href="assets/icon/favicon.png" />
16 
+
17 
+  <!-- add to homescreen for ios -->
18 
+  <meta name="apple-mobile-web-app-capable" content="yes" />
19 
+  <meta name="apple-mobile-web-app-status-bar-style" content="black" />
20 
+</head>
21 
+
22 
+<body>
23 
+  <app-root></app-root>
24 
+</body>
25 
+
26 
+</html>

+ 12 - 0
src/main.ts
Dosyayı Görüntüle 

@@ -0,0 +1,12 @@
1 
+import { enableProdMode } from '@angular/core';
2 
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3 
+
4 
+import { AppModule } from './app/app.module';
5 
+import { environment } from './environments/environment';
6 
+
7 
+if (environment.production) {
8 
+  enableProdMode();
9 
+}
10 
+
11 
+platformBrowserDynamic().bootstrapModule(AppModule)
12 
+  .catch(err => console.log(err));

+ 65 - 0
src/polyfills.ts
Dosyayı Görüntüle 

@@ -0,0 +1,65 @@
1 
+/**
2 
+ * This file includes polyfills needed by Angular and is loaded before the app.
3 
+ * You can add your own extra polyfills to this file.
4 
+ *
5 
+ * This file is divided into 2 sections:
6 
+ *   1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
7 
+ *   2. Application imports. Files imported after ZoneJS that should be loaded before your main
8 
+ *      file.
9 
+ *
10 
+ * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
11 
+ * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
12 
+ * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
13 
+ *
14 
+ * Learn more in https://angular.io/guide/browser-support
15 
+ */
16 
+
17 
+/***************************************************************************************************
18 
+ * BROWSER POLYFILLS
19 
+ */
20 
+
21 
+/** IE11 requires the following for NgClass support on SVG elements */
22 
+// import 'classlist.js';  // Run `npm install --save classlist.js`.
23 
+
24 
+/**
25 
+ * Web Animations `@angular/platform-browser/animations`
26 
+ * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
27 
+ * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
28 
+ */
29 
+// import 'web-animations-js';  // Run `npm install --save web-animations-js`.
30 
+
31 
+/**
32 
+ * By default, zone.js will patch all possible macroTask and DomEvents
33 
+ * user can disable parts of macroTask/DomEvents patch by setting following flags
34 
+ * because those flags need to be set before `zone.js` being loaded, and webpack
35 
+ * will put import in the top of bundle, so user need to create a separate file
36 
+ * in this directory (for example: zone-flags.ts), and put the following flags
37 
+ * into that file, and then add the following code before importing zone.js.
38 
+ * import './zone-flags';
39 
+ *
40 
+ * The flags allowed in zone-flags.ts are listed here.
41 
+ *
42 
+ * The following flags will work for all browsers.
43 
+ *
44 
+ * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
45 
+ * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
46 
+ * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
47 
+ *
48 
+ *  in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
49 
+ *  with the following flag, it will bypass `zone.js` patch for IE/Edge
50 
+ *
51 
+ *  (window as any).__Zone_enable_cross_context_check = true;
52 
+ *
53 
+ */
54 
+
55 
+import './zone-flags';
56 
+
57 
+/***************************************************************************************************
58 
+ * Zone JS is required by default for Angular itself.
59 
+ */
60 
+import 'zone.js/dist/zone';  // Included with Angular CLI.
61 
+
62 
+
63 
+/***************************************************************************************************
64 
+ * APPLICATION IMPORTS
65 
+ */

+ 25 - 0
src/test.ts
Dosyayı Görüntüle 

@@ -0,0 +1,25 @@
1 
+// This file is required by karma.conf.js and loads recursively all the .spec and framework files
2 
+
3 
+import 'zone.js/dist/zone-testing';
4 
+import { getTestBed } from '@angular/core/testing';
5 
+import {
6 
+  BrowserDynamicTestingModule,
7 
+  platformBrowserDynamicTesting
8 
+} from '@angular/platform-browser-dynamic/testing';
9 
+
10 
+declare const require: {
11 
+  context(path: string, deep?: boolean, filter?: RegExp): {
12 
+    <T>(id: string): T;
13 
+    keys(): string[];
14 
+  };
15 
+};
16 
+
17 
+// First, initialize the Angular testing environment.
18 
+getTestBed().initTestEnvironment(
19 
+  BrowserDynamicTestingModule,
20 
+  platformBrowserDynamicTesting()
21 
+);
22 
+// Then we find all the tests.
23 
+const context = require.context('./', true, /\.spec\.ts$/);
24 
+// And load the modules.
25 
+context.keys().map(context);

+ 236 - 0
src/theme/variables.scss
Dosyayı Görüntüle 

@@ -0,0 +1,236 @@
1 
+// Ionic Variables and Theming. For more info, please see:
2 
+// http://ionicframework.com/docs/theming/
3 
+
4 
+/** Ionic CSS Variables **/
5 
+:root {
6 
+  /** primary **/
7 
+  --ion-color-primary: #3880ff;
8 
+  --ion-color-primary-rgb: 56, 128, 255;
9 
+  --ion-color-primary-contrast: #ffffff;
10 
+  --ion-color-primary-contrast-rgb: 255, 255, 255;
11 
+  --ion-color-primary-shade: #3171e0;
12 
+  --ion-color-primary-tint: #4c8dff;
13 
+
14 
+  /** secondary **/
15 
+  --ion-color-secondary: #3dc2ff;
16 
+  --ion-color-secondary-rgb: 61, 194, 255;
17 
+  --ion-color-secondary-contrast: #ffffff;
18 
+  --ion-color-secondary-contrast-rgb: 255, 255, 255;
19 
+  --ion-color-secondary-shade: #36abe0;
20 
+  --ion-color-secondary-tint: #50c8ff;
21 
+
22 
+  /** tertiary **/
23 
+  --ion-color-tertiary: #5260ff;
24 
+  --ion-color-tertiary-rgb: 82, 96, 255;
25 
+  --ion-color-tertiary-contrast: #ffffff;
26 
+  --ion-color-tertiary-contrast-rgb: 255, 255, 255;
27 
+  --ion-color-tertiary-shade: #4854e0;
28 
+  --ion-color-tertiary-tint: #6370ff;
29 
+
30 
+  /** success **/
31 
+  --ion-color-success: #2dd36f;
32 
+  --ion-color-success-rgb: 45, 211, 111;
33 
+  --ion-color-success-contrast: #ffffff;
34 
+  --ion-color-success-contrast-rgb: 255, 255, 255;
35 
+  --ion-color-success-shade: #28ba62;
36 
+  --ion-color-success-tint: #42d77d;
37 
+
38 
+  /** warning **/
39 
+  --ion-color-warning: #ffc409;
40 
+  --ion-color-warning-rgb: 255, 196, 9;
41 
+  --ion-color-warning-contrast: #000000;
42 
+  --ion-color-warning-contrast-rgb: 0, 0, 0;
43 
+  --ion-color-warning-shade: #e0ac08;
44 
+  --ion-color-warning-tint: #ffca22;
45 
+
46 
+  /** danger **/
47 
+  --ion-color-danger: #eb445a;
48 
+  --ion-color-danger-rgb: 235, 68, 90;
49 
+  --ion-color-danger-contrast: #ffffff;
50 
+  --ion-color-danger-contrast-rgb: 255, 255, 255;
51 
+  --ion-color-danger-shade: #cf3c4f;
52 
+  --ion-color-danger-tint: #ed576b;
53 
+
54 
+  /** dark **/
55 
+  --ion-color-dark: #222428;
56 
+  --ion-color-dark-rgb: 34, 36, 40;
57 
+  --ion-color-dark-contrast: #ffffff;
58 
+  --ion-color-dark-contrast-rgb: 255, 255, 255;
59 
+  --ion-color-dark-shade: #1e2023;
60 
+  --ion-color-dark-tint: #383a3e;
61 
+
62 
+  /** medium **/
63 
+  --ion-color-medium: #92949c;
64 
+  --ion-color-medium-rgb: 146, 148, 156;
65 
+  --ion-color-medium-contrast: #ffffff;
66 
+  --ion-color-medium-contrast-rgb: 255, 255, 255;
67 
+  --ion-color-medium-shade: #808289;
68 
+  --ion-color-medium-tint: #9d9fa6;
69 
+
70 
+  /** light **/
71 
+  --ion-color-light: #f4f5f8;
72 
+  --ion-color-light-rgb: 244, 245, 248;
73 
+  --ion-color-light-contrast: #000000;
74 
+  --ion-color-light-contrast-rgb: 0, 0, 0;
75 
+  --ion-color-light-shade: #d7d8da;
76 
+  --ion-color-light-tint: #f5f6f9;
77 
+}
78 
+
79 
+@media (prefers-color-scheme: dark) {
80 
+  /*
81 
+   * Dark Colors
82 
+   * -------------------------------------------
83 
+   */
84 
+
85 
+  body {
86 
+    --ion-color-primary: #428cff;
87 
+    --ion-color-primary-rgb: 66,140,255;
88 
+    --ion-color-primary-contrast: #ffffff;
89 
+    --ion-color-primary-contrast-rgb: 255,255,255;
90 
+    --ion-color-primary-shade: #3a7be0;
91 
+    --ion-color-primary-tint: #5598ff;
92 
+
93 
+    --ion-color-secondary: #50c8ff;
94 
+    --ion-color-secondary-rgb: 80,200,255;
95 
+    --ion-color-secondary-contrast: #ffffff;
96 
+    --ion-color-secondary-contrast-rgb: 255,255,255;
97 
+    --ion-color-secondary-shade: #46b0e0;
98 
+    --ion-color-secondary-tint: #62ceff;
99 
+
100 
+    --ion-color-tertiary: #6a64ff;
101 
+    --ion-color-tertiary-rgb: 106,100,255;
102 
+    --ion-color-tertiary-contrast: #ffffff;
103 
+    --ion-color-tertiary-contrast-rgb: 255,255,255;
104 
+    --ion-color-tertiary-shade: #5d58e0;
105 
+    --ion-color-tertiary-tint: #7974ff;
106 
+
107 
+    --ion-color-success: #2fdf75;
108 
+    --ion-color-success-rgb: 47,223,117;
109 
+    --ion-color-success-contrast: #000000;
110 
+    --ion-color-success-contrast-rgb: 0,0,0;
111 
+    --ion-color-success-shade: #29c467;
112 
+    --ion-color-success-tint: #44e283;
113 
+
114 
+    --ion-color-warning: #ffd534;
115 
+    --ion-color-warning-rgb: 255,213,52;
116 
+    --ion-color-warning-contrast: #000000;
117 
+    --ion-color-warning-contrast-rgb: 0,0,0;
118 
+    --ion-color-warning-shade: #e0bb2e;
119 
+    --ion-color-warning-tint: #ffd948;
120 
+
121 
+    --ion-color-danger: #ff4961;
122 
+    --ion-color-danger-rgb: 255,73,97;
123 
+    --ion-color-danger-contrast: #ffffff;
124 
+    --ion-color-danger-contrast-rgb: 255,255,255;
125 
+    --ion-color-danger-shade: #e04055;
126 
+    --ion-color-danger-tint: #ff5b71;
127 
+
128 
+    --ion-color-dark: #f4f5f8;
129 
+    --ion-color-dark-rgb: 244,245,248;
130 
+    --ion-color-dark-contrast: #000000;
131 
+    --ion-color-dark-contrast-rgb: 0,0,0;
132 
+    --ion-color-dark-shade: #d7d8da;
133 
+    --ion-color-dark-tint: #f5f6f9;
134 
+
135 
+    --ion-color-medium: #989aa2;
136 
+    --ion-color-medium-rgb: 152,154,162;
137 
+    --ion-color-medium-contrast: #000000;
138 
+    --ion-color-medium-contrast-rgb: 0,0,0;
139 
+    --ion-color-medium-shade: #86888f;
140 
+    --ion-color-medium-tint: #a2a4ab;
141 
+
142 
+    --ion-color-light: #222428;
143 
+    --ion-color-light-rgb: 34,36,40;
144 
+    --ion-color-light-contrast: #ffffff;
145 
+    --ion-color-light-contrast-rgb: 255,255,255;
146 
+    --ion-color-light-shade: #1e2023;
147 
+    --ion-color-light-tint: #383a3e;
148 
+  }
149 
+
150 
+  /*
151 
+   * iOS Dark Theme
152 
+   * -------------------------------------------
153 
+   */
154 
+
155 
+  .ios body {
156 
+    --ion-background-color: #000000;
157 
+    --ion-background-color-rgb: 0,0,0;
158 
+
159 
+    --ion-text-color: #ffffff;
160 
+    --ion-text-color-rgb: 255,255,255;
161 
+
162 
+    --ion-color-step-50: #0d0d0d;
163 
+    --ion-color-step-100: #1a1a1a;
164 
+    --ion-color-step-150: #262626;
165 
+    --ion-color-step-200: #333333;
166 
+    --ion-color-step-250: #404040;
167 
+    --ion-color-step-300: #4d4d4d;
168 
+    --ion-color-step-350: #595959;
169 
+    --ion-color-step-400: #666666;
170 
+    --ion-color-step-450: #737373;
171 
+    --ion-color-step-500: #808080;
172 
+    --ion-color-step-550: #8c8c8c;
173 
+    --ion-color-step-600: #999999;
174 
+    --ion-color-step-650: #a6a6a6;
175 
+    --ion-color-step-700: #b3b3b3;
176 
+    --ion-color-step-750: #bfbfbf;
177 
+    --ion-color-step-800: #cccccc;
178 
+    --ion-color-step-850: #d9d9d9;
179 
+    --ion-color-step-900: #e6e6e6;
180 
+    --ion-color-step-950: #f2f2f2;
181 
+
182 
+    --ion-item-background: #000000;
183 
+
184 
+    --ion-card-background: #1c1c1d;
185 
+  }
186 
+
187 
+  .ios ion-modal {
188 
+    --ion-background-color: var(--ion-color-step-100);
189 
+    --ion-toolbar-background: var(--ion-color-step-150);
190 
+    --ion-toolbar-border-color: var(--ion-color-step-250);
191 
+  }
192 
+
193 
+
194 
+  /*
195 
+   * Material Design Dark Theme
196 
+   * -------------------------------------------
197 
+   */
198 
+
199 
+  .md body {
200 
+    --ion-background-color: #121212;
201 
+    --ion-background-color-rgb: 18,18,18;
202 
+
203 
+    --ion-text-color: #ffffff;
204 
+    --ion-text-color-rgb: 255,255,255;
205 
+
206 
+    --ion-border-color: #222222;
207 
+
208 
+    --ion-color-step-50: #1e1e1e;
209 
+    --ion-color-step-100: #2a2a2a;
210 
+    --ion-color-step-150: #363636;
211 
+    --ion-color-step-200: #414141;
212 
+    --ion-color-step-250: #4d4d4d;
213 
+    --ion-color-step-300: #595959;
214 
+    --ion-color-step-350: #656565;
215 
+    --ion-color-step-400: #717171;
216 
+    --ion-color-step-450: #7d7d7d;
217 
+    --ion-color-step-500: #898989;
218 
+    --ion-color-step-550: #949494;
219 
+    --ion-color-step-600: #a0a0a0;
220 
+    --ion-color-step-650: #acacac;
221 
+    --ion-color-step-700: #b8b8b8;
222 
+    --ion-color-step-750: #c4c4c4;
223 
+    --ion-color-step-800: #d0d0d0;
224 
+    --ion-color-step-850: #dbdbdb;
225 
+    --ion-color-step-900: #e7e7e7;
226 
+    --ion-color-step-950: #f3f3f3;
227 
+
228 
+    --ion-item-background: #1e1e1e;
229 
+
230 
+    --ion-toolbar-background: #1f1f1f;
231 
+
232 
+    --ion-tab-bar-background: #1f1f1f;
233 
+
234 
+    --ion-card-background: #1e1e1e;
235 
+  }
236 
+}

+ 6 - 0
src/zone-flags.ts
Dosyayı Görüntüle 

@@ -0,0 +1,6 @@
1 
+/**
2 
+ * Prevents Angular change detection from
3 
+ * running with certain Web Component callbacks
4 
+ */
5 
+// eslint-disable-next-line no-underscore-dangle
6 
+(window as any).__Zone_disable_customElements = true;

+ 15 - 0
tsconfig.app.json
Dosyayı Görüntüle 

@@ -0,0 +1,15 @@
1 
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
2 
+{
3 
+  "extends": "./tsconfig.json",
4 
+  "compilerOptions": {
5 
+    "outDir": "./out-tsc/app",
6 
+    "types": []
7 
+  },
8 
+  "files": [
9 
+    "src/main.ts",
10 
+    "src/polyfills.ts"
11 
+  ],
12 
+  "include": [
13 
+    "src/**/*.d.ts"
14 
+  ]
15 
+}

+ 23 - 0
tsconfig.json
Dosyayı Görüntüle 

@@ -0,0 +1,23 @@
1 
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
2 
+{
3 
+  "compileOnSave": false,
4 
+  "compilerOptions": {
5 
+    "baseUrl": "./",
6 
+    "outDir": "./dist/out-tsc",
7 
+    "sourceMap": true,
8 
+    "declaration": false,
9 
+    "downlevelIteration": true,
10 
+    "experimentalDecorators": true,
11 
+    "moduleResolution": "node",
12 
+    "importHelpers": true,
13 
+    "target": "es2015",
14 
+    "module": "es2020",
15 
+    "lib": ["es2018", "dom"]
16 
+  },
17 
+  "angularCompilerOptions": {
18 
+    "enableI18nLegacyMessageIdFormat": false,
19 
+    "strictInjectionParameters": true,
20 
+    "strictInputAccessModifiers": true,
21 
+    "strictTemplates": true
22 
+  }
23 
+}

+ 18 - 0
tsconfig.spec.json
Dosyayı Görüntüle 

@@ -0,0 +1,18 @@
1 
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
2 
+{
3 
+  "extends": "./tsconfig.json",
4 
+  "compilerOptions": {
5 
+    "outDir": "./out-tsc/spec",
6 
+    "types": [
7 
+      "jasmine"
8 
+    ]
9 
+  },
10 
+  "files": [
11 
+    "src/test.ts",
12 
+    "src/polyfills.ts"
13 
+  ],
14 
+  "include": [
15 
+    "src/**/*.spec.ts",
16 
+    "src/**/*.d.ts"
17 
+  ]
18 
+}

tum/coi - Gogs: Simplico Git Service
Página Inicial Explorar Ajuda
Entrar
tum
/
coi
Observar 1
Favorito 0
Fork 0
Código Problemas 0 Pull Requests 0 Commits 24 Versões 0 Wiki

Nenhuma Descrição

Árvore: bab3a96546
Branches Tags
coi
/
app
/
report
/
gen_report.py

gen_report.py 12KB
Histórico Cru

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281 
  1. 

  2. from openpyxl import load_workbook, Workbook
    3. 

  3. from datetime import datetime
    4. 

  4. from openpyxl.drawing.image import Image
    5. 

  5. import re
    6. 

  6. 

  7. from openpyxl.drawing.spreadsheet_drawing import AbsoluteAnchor
    8. 

  8. from openpyxl.drawing.xdr import XDRPoint2D, XDRPositiveSize2D
    9. 

  9. from openpyxl.utils.units import pixels_to_EMU
    10. 

  10. from openpyxl.utils import get_column_letter, column_index_from_string
    11. 

  11. from django.db import models
    12. 

  12. import os
    13. 

  13. from django.db.models.fields.files import ImageFieldFile
    14. 

  14. from pprint import pprint
    15. 

  15. from PIL import Image as PILImage
    16. 

  16. from openpyxl.drawing.xdr import XDRPoint2D, XDRPositiveSize2D
    17. 

  17. from openpyxl.utils.units import pixels_to_EMU
    18. 

  18. from openpyxl.drawing.spreadsheet_drawing import AnchorMarker, TwoCellAnchor
    19. 

  19. 

  20. 

  21. def set_image_with_offset_old(sheet, img, cell_coordinate, offset_x=0, offset_y=0):
    22. 

  22.     """
    23. 

  23.     Add an image to the sheet with an offset relative to the top-left corner of a cell.
    24. 

  24. 

  25.     :param sheet: The worksheet
    26. 

  26.     :param img: The openpyxl Image object
    27. 

  27.     :param cell_coordinate: Cell to place the image (e.g., "B2")
    28. 

  28.     :param offset_x: Horizontal offset in pixels
    29. 

  29.     :param offset_y: Vertical offset in pixels
    30. 

  30.     """
    31. 

  31.     col_letter = ''.join(filter(str.isalpha, cell_coordinate))  # Extract column letter
    32. 

  32.     row_number = int(''.join(filter(str.isdigit, cell_coordinate)))  # Extract row number
    33. 

  33. 

  34.     # Get column width and row height in pixels
    35. 

  35.     col_width = sheet.column_dimensions[get_column_letter(column_index_from_string(col_letter))].width or 10
    36. 

  36.     row_height = sheet.row_dimensions[row_number].height or 15
    37. 

  37. 

  38.     # Approximate conversion of Excel units to pixels
    39. 

  39.     col_pixels = col_width * 7.5  # Excel's ~7.5 pixels per width unit
    40. 

  40.     row_pixels = row_height * 0.75  # Approximation for row height in pixels
    41. 

  41. 

  42.     # Calculate absolute positions based on offsets
    43. 

  43.     anchor_x = col_pixels + offset_x
    44. 

  44.     anchor_y = row_pixels + offset_y
    45. 

  45. 

  46.     # Set the anchor for the image
    47. 

  47.     img.anchor = cell_coordinate
    48. 

  48.     img.anchor.dx = int(anchor_x * 9525)  # Convert to EMUs (Excel Measurement Units)
    49. 

  49.     img.anchor.dy = int(anchor_y * 9525)  # Convert to EMUs (Excel Measurement Units)
    50. 

  50. 

  51.     sheet.add_image(img)
    52. 

  52. 

  53. 

  54. def set_image_with_offset(sheet, img, cell_coordinate, offset_x=0, offset_y=0):
    55. 

  55.     """
    56. 

  56.     Add an image to the sheet with an offset relative to the top-left corner of a cell.
    57. 

  57. 

  58.     :param sheet: The worksheet
    59. 

  59.     :param img: The openpyxl Image object
    60. 

  60.     :param cell_coordinate: Cell to place the image (e.g., "B2")
    61. 

  61.     :param offset_x: Horizontal offset in pixels
    62. 

  62.     :param offset_y: Vertical offset in pixels
    63. 

  63.     """
    64. 

  64.     # Extract the column and row from the cell coordinate
    65. 

  65.     col_letter = ''.join(filter(str.isalpha, cell_coordinate))  # Extract column letter
    66. 

  66.     row_number = int(''.join(filter(str.isdigit, cell_coordinate)))  # Extract row number
    67. 

  67. 

  68.     # Get the zero-based indices for the cell
    69. 

  69.     col_idx = column_index_from_string(col_letter) - 1
    70. 

  70.     row_idx = row_number - 1
    71. 

  71. 

  72.     # Approximate column width and row height to pixels
    73. 

  73.     col_width = sheet.column_dimensions[col_letter].width or 10  # Default column width
    74. 

  74.     row_height = sheet.row_dimensions[row_number].height or 15  # Default row height
    75. 

  75. 

  76.     # Convert column width and row height to pixels
    77. 

  77.     col_pixels = col_width * 7.5  # Approximation: ~7.5 pixels per width unit
    78. 

  78.     row_pixels = row_height * 0.75  # Approximation: ~0.75 pixels per height unit
    79. 

  79. 

  80.     # Calculate the position in pixels for the top-left corner of the cell
    81. 

  81.     cell_x = col_idx * col_pixels
    82. 

  82.     cell_y = row_idx * row_pixels
    83. 

  83. 

  84.     # Apply the offsets
    85. 

  85.     final_x = cell_x + offset_x
    86. 

  86.     final_y = cell_y + offset_y
    87. 

  87. 

  88.     # Convert to EMUs
    89. 

  89.     pos = XDRPoint2D(pixels_to_EMU(final_x), pixels_to_EMU(final_y))
    90. 

  90.     size = XDRPositiveSize2D(pixels_to_EMU(img.width), pixels_to_EMU(img.height))
    91. 

  91. 

  92.     # Set the image's anchor with the position and size
    93. 

  93.     img.anchor = AbsoluteAnchor(pos=pos, ext=size)
    94. 

  94. 

  95.     # Add the image to the worksheet
    96. 

  96.     sheet.add_image(img)
    97. 

  97. 

  98. 

  99. 

  100. def center_image_in_cell(sheet, img, cell_coordinate):
    101. 

  101.     """
    102. 

  102.     Center an image inside a specified cell.
    103. 

  103. 

  104.     :param sheet: The worksheet
    105. 

  105.     :param img: The openpyxl Image object
    106. 

  106.     :param cell_coordinate: The cell to center the image in (e.g., "C3")
    107. 

  107.     """
    108. 

  108.     # Extract column and row from the cell coordinate
    109. 

  109.     col_letter = ''.join(filter(str.isalpha, cell_coordinate))  # Extract column letter
    110. 

  110.     row_number = int(''.join(filter(str.isdigit, cell_coordinate)))  # Extract row number
    111. 

  111.     col_idx = column_index_from_string(col_letter) - 1  # Convert to zero-based column index
    112. 

  112. 

  113.     # Get cell dimensions
    114. 

  114.     col_width = sheet.column_dimensions[col_letter].width or 10  # Default width if not set
    115. 

  115.     row_height = sheet.row_dimensions[row_number].height or 15  # Default height if not set
    116. 

  116. 

  117.     # Convert dimensions to pixels (approximation)
    118. 

  118.     col_pixels = col_width * 7.5  # 1 Excel column width unit ≈ 7.5 pixels
    119. 

  119.     row_pixels = row_height * 0.75  # 1 Excel row height unit ≈ 0.75 pixels
    120. 

  120. 

  121.     # Get image dimensions
    122. 

  122.     img_width, img_height = img.width, img.height
    123. 

  123. 

  124.     # Calculate offsets to center the image
    125. 

  125.     offset_x = int((col_pixels - img_width) / 2 * pixels_to_EMU(1))  # Center horizontally
    126. 

  126.     offset_y = int((row_pixels - img_height) / 2 * pixels_to_EMU(1))  # Center vertically
    127. 

  127. 

  128.     # Define the anchor for the image
    129. 

  129.     _from = AnchorMarker(col=col_idx, row=row_number - 1, colOff=offset_x, rowOff=offset_y)
    130. 

  130.     to = AnchorMarker(col=col_idx + 1, row=row_number, colOff=-offset_x, rowOff=-offset_y)
    131. 

  131. 

  132.     # Use TwoCellAnchor for positioning
    133. 

  133.     img.anchor = TwoCellAnchor(editAs="oneCell", _from=_from, to=to)
    134. 

  134. 

  135.     # Add the image to the sheet
    136. 

  136.     sheet.add_image(img)
    137. 

  137. 

  138. 

  139. def gen_xlsx(template_file, selected_sheets, prefix_filename, data):
    140. 

  140.     """
    141. 

  141.     Generate an Excel file from a template, fill placeholders, and include only selected sheets.
    142. 

  142. 

  143.     Args:
    144. 

  144.         template_file (str): Path to the Excel template file.
    145. 

  145.         selected_sheets (list): List of sheet names to include in the output file.
    146. 

  146.         prefix_filename (str): Prefix for the output filename.
    147. 

  147.         data (dict): Data dictionary with sheet-specific keys and fallback keys.
    148. 

  148. 

  149.     Returns:
    150. 

  150.         str: Path of the generated Excel file.
    151. 

  151.     """
    152. 

  152.     checked_image_path = "/app/report/checkbox_checked.jpg"  # Path to the checked checkbox image
    153. 

  153.     unchecked_image_path = "/app/report/checkbox_unchecked.jpg"  # Path to the unchecked checkbox image
    154. 

  154. 

  155.     # Load the template workbook
    156. 

  156.     workbook = load_workbook(template_file)
    157. 

  157. 

  158.     # Remove sheets not in selected_sheets
    159. 

  159.     for sheet_name in workbook.sheetnames:
    160. 

  160.         if sheet_name not in selected_sheets:
    161. 

  161.             del workbook[sheet_name]
    162. 

  162. 

  163.     # Process the selected sheets
    164. 

  164.     for sheet_name in selected_sheets:
    165. 

  165.         if sheet_name not in workbook.sheetnames:
    166. 

  166.             raise ValueError(f"Sheet '{sheet_name}' not found in the template.")
    167. 

  167. 

  168.         sheet = workbook[sheet_name]
    169. 

  169. 

  170.         # Replace placeholders with actual values
    171. 

  171.         # Handle hiding rows based on patterns in data
    172. 

  172.          
    173. 

  173.         for row in sheet.iter_rows():
    174. 

  174.             for cell in row:
    175. 

  175.                 if cell.value and isinstance(cell.value, str) and cell.value.startswith("<") and cell.value.endswith(">"):
    176. 

  176.                     placeholder = cell.value.strip("<>")
    177. 

  177.                     
    178. 

  178.                     # Determine value priority: `sheet_name.key` > `key`
    179. 

  179.                     value = None
    180. 

  180.                     sheet_specific_key = f"{sheet_name}.{placeholder}"
    181. 

  181.                     if sheet_specific_key in data:
    182. 

  182.                         value = data[sheet_specific_key]
    183. 

  183.                     elif placeholder in data:
    184. 

  184.                         value = data[placeholder]
    185. 

  185.                         
    186. 

  186.                     if value is not None:
    187. 

  187.                         if isinstance(value, ImageFieldFile):
    188. 

  188.                             pprint("ImageField")
    189. 

  189.                             image_path = value.path
    190. 

  190.                             if os.path.exists(image_path):
    191. 

  191.                                 # img = Image(image_path)
    192. 

  192.                                 # img.height = 40  # Adjust size as needed
    193. 

  193.                                 pil_img = PILImage.open(image_path)
    194. 

  194.                                 original_width, original_height = pil_img.size
    195. 

  195. 

  196.                                 # Desired height (e.g., 40), calculate the new width to maintain aspect ratio
    197. 

  197.                                 desired_height = 40
    198. 

  198.                                 aspect_ratio = original_width / original_height
    199. 

  199.                                 new_width = int(desired_height * aspect_ratio)
    200. 

  200. 

  201.                                 # Resize the image using Pillow (optional, for saving memory during export)
    202. 

  202.                                 resized_img = pil_img.resize((new_width, desired_height), PILImage.Resampling.LANCZOS)
    203. 

  203.                                 resized_img.save(image_path)  # Save the resized image back to the same path
    204. 

  204. 

  205.                                 # Insert the resized image into the Excel sheet
    206. 

  206.                                 img = Image(image_path)
    207. 

  207.                                 img.width, img.height = new_width, desired_height  # Set the dimensions
    208. 

  208.                                 # sheet.add_image(img, cell.coordinate)
    209. 

  209.                                 center_image_in_cell(sheet, img, cell.coordinate, )
    210. 

  210.                                 cell.value = None  # Clear placeholder
    211. 

  211. 

  212.                         elif value is True:
    213. 

  213.                             img = Image(checked_image_path)
    214. 

  214.                             img.width = img.height = 10
    215. 

  215.                             print(f"{cell.coordinate}")
    216. 

  216.                             # sheet.add_image(img, cell.coordinate)
    217. 

  217.                             # set_image_with_offset(sheet, img, cell.coordinate, offset_x=100)
    218. 

  218.                             center_image_in_cell(sheet,img, cell.coordinate, )
    219. 

  219.                             cell.value = None  # Remove the placeholder text
    220. 

  220.                         elif value is False:
    221. 

  221.                             img = Image(unchecked_image_path)
    222. 

  222.                             img.width = img.height = 10
    223. 

  223.                             # sheet.add_image(img, cell.coordinate)
    224. 

  224.                             # set_image_with_offset(sheet, img, cell.coordinate, offset_x=100)
    225. 

  225.                             center_image_in_cell(sheet, img, cell.coordinate, )
    226. 

  226.                             cell.value = None  # Remove the placeholder text
    227. 

  227.                         else:
    228. 

  228.                             # Insert the text value directly
    229. 

  229.                             cell.value = value
    230. 

  230. 

  231.         for key, value in data.items():
    232. 

  232.             if isinstance(value, str) and re.match(r"^\d+\[\d+:\d+\]$", value):
    233. 

  233.                 # Parse the prefix and row range
    234. 

  234.                 prefix, row_range = value.split("[")
    235. 

  235.                 row_start, row_end = map(int, row_range[:-1].split(":"))
    236. 

  236.                 
    237. 

  237.                 # Hide rows if the prefix matches the condition
    238. 

  238.                 if prefix == "0":  # Adjust the condition as needed
    239. 

  239.                     sheet.row_dimensions.group(row_start, row_end, hidden=True)
    240. 

  240.         
    241. 

  241. 

  242.     # Generate the output filename with a timestamp
    243. 

  243.     timestamp = datetime.now().strftime("%Y%m%d_%H%M%S")
    244. 

  244.     output_path = f"{prefix_filename}_{timestamp}.xlsx"
    245. 

  245.     workbook.save(output_path)
    246. 

  246. 

  247.     return output_path
    248. 

  248. 

  249. if __name__ == "__main__":
    250. 

  250.     # Example usage
    251. 

  251.     data = {
    252. 

  252.         "customer": "Tum Coder",
    253. 

  253.         "inspect_date": "2025-01-15",
    254. 

  254.         "lot_no": "12345",
    255. 

  255.         "staff_name":  "Tum 8888",
    256. 

  256.         "man_name":  "Tum 999",
    257. 

  257.         "size": "Large",
    258. 

  258.         "pcs": "10 pcs",
    259. 

  259.         "spec": "Spec-A",
    260. 

  260.         "hardness.d1_act": "10",
    261. 

  261.         "hardness.d2_act": "0[24:28]",  # Hide rows 24 to 28 if the prefix is "0"
    262. 

  262.         "hardness.acc": True,  # Hide rows 24 to 28 if the prefix is "0"
    263. 

  263.         "hardness.spe_acc": False,  # Hide rows 24 to 28 if the prefix is "0"
    264. 

  264.         "dimension_app.d1_act": "33",
    265. 

  265.         "dimension_app.d2_act": "0[26:32]",  # Hide rows 24 to 28 if the prefix is "0"
    266. 

  266.         "dimension_app.acc": True,  # Hide rows 24 to 28 if the prefix is "0"
    267. 

  267.         "dimension_app.spe_acc": True,  # Hide rows 24 to 28 if the prefix is "0"
    268. 

  268.     }
    269. 

  269. 

  270. 

  271. 

  272. 

  273.     output_file = gen_xlsx(
    274. 

  274.         template_file="./hardness.xlsx",
    275. 

  275.         selected_sheets=["hardness", "dimension_app"],  # Replace with your actual sheet names
    276. 

  276.         prefix_filename="./output/output",
    277. 

  277.         data=data
    278. 

  278.     )
    279. 

  279. 

  280.     print(f"Generated file: {output_file}")
    281. 

  281.