feat: add app shell (angular-material)
Add app shell built using angular-material and flex-layout. Refractor code due to configuration changes. Fixes #52
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
|
||||
import { Route, extract } from '../../app/core';
|
||||
import { Route, extract } from '../core';
|
||||
import { ClientsComponent } from './clients.component';
|
||||
import { CreateClientComponent} from './create-client/create-client.component';
|
||||
import { ViewClientComponent } from './view-client/view-client.component';
|
||||
@@ -9,10 +9,26 @@ import { ViewLoanComponent } from './view-loan/view-loan.component';
|
||||
|
||||
const routes: Routes = [
|
||||
Route.withShell([
|
||||
{ path: 'clients', component: ClientsComponent},
|
||||
{ path: 'clients/create', component: CreateClientComponent},
|
||||
{ path: 'clients/view', component: ViewClientComponent},
|
||||
{ path: 'clients/viewloan', component: ViewLoanComponent}
|
||||
{
|
||||
path: 'clients',
|
||||
component: ClientsComponent,
|
||||
data: { title: extract('Clients') }
|
||||
},
|
||||
{
|
||||
path: 'clients/create',
|
||||
component: CreateClientComponent,
|
||||
data: { title: extract('Create Client') }
|
||||
},
|
||||
{
|
||||
path: 'clients/view',
|
||||
component: ViewClientComponent,
|
||||
data: { title: extract('View Client') }
|
||||
},
|
||||
{
|
||||
path: 'clients/viewloan',
|
||||
component: ViewLoanComponent,
|
||||
data: { title: extract('View Loan') }
|
||||
}
|
||||
])
|
||||
];
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<div class="fluid-container">
|
||||
<!-- <div class="fluid-container">
|
||||
<div class="container">
|
||||
<div class="card mt-5">
|
||||
<div class="card-header">
|
||||
@@ -16,10 +16,8 @@
|
||||
</div>
|
||||
<div class="card-body">
|
||||
|
||||
<!--Table-->
|
||||
<table class="table table-hover table-responsive-md table-fixed">
|
||||
|
||||
<!--Table head-->
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
@@ -31,9 +29,7 @@
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<!--Table head-->
|
||||
|
||||
<!--Table body-->
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">4</th>
|
||||
@@ -90,12 +86,10 @@
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
<!--Table body-->
|
||||
|
||||
</table>
|
||||
<!--Table-->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
.table-fixed {
|
||||
table-layout: fixed;
|
||||
overflow: hidden;
|
||||
}
|
||||
// .table-fixed {
|
||||
// table-layout: fixed;
|
||||
// overflow: hidden;
|
||||
// }
|
||||
|
||||
@@ -1,10 +1,7 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { environment } from '../../environments/environment';
|
||||
|
||||
import { HeaderComponent } from '../core/shell/header/header.component';
|
||||
|
||||
@Component({
|
||||
selector: 'app-clients',
|
||||
selector: 'mifosx-clients',
|
||||
templateUrl: './clients.component.html',
|
||||
styleUrls: ['./clients.component.scss']
|
||||
})
|
||||
|
||||
@@ -1,30 +1,28 @@
|
||||
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
import { ArchwizardModule } from 'angular-archwizard';
|
||||
|
||||
import { ClientsRoutingModule } from './clients-routing.module';
|
||||
import { ClientsComponent } from './clients.component';
|
||||
import { CreateClientComponent} from './create-client/create-client.component';
|
||||
import { ClientsRoutingModule } from './clients-routing.module';
|
||||
import { CoreModule } from '../core/core.module';
|
||||
import { ViewClientComponent } from './view-client/view-client.component';
|
||||
import { ViewLoanComponent } from './view-loan/view-loan.component';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CoreModule,
|
||||
CommonModule,
|
||||
ClientsRoutingModule,
|
||||
ArchwizardModule
|
||||
],
|
||||
declarations: [
|
||||
ClientsComponent,
|
||||
CreateClientComponent,
|
||||
ViewClientComponent,
|
||||
ClientsComponent,
|
||||
CreateClientComponent,
|
||||
ViewClientComponent,
|
||||
ViewLoanComponent
|
||||
],
|
||||
schemas: [
|
||||
CUSTOM_ELEMENTS_SCHEMA
|
||||
],
|
||||
|
||||
],
|
||||
schemas: [
|
||||
CUSTOM_ELEMENTS_SCHEMA
|
||||
]
|
||||
})
|
||||
export class ClientsModule { }
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<div class="container">
|
||||
<!-- <div class="container">
|
||||
|
||||
<aw-wizard class="mt-5" #wizard [navBarLayout]="'large-empty-symbols'">
|
||||
<aw-wizard-step stepTitle="Title of step 1" [navigationSymbol]="{ symbol: '1' }">
|
||||
@@ -62,8 +62,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="btn btn-primary float-right" awNextStep>Next Step</button>
|
||||
<!-- <button type="button" class="btn btn-primary float-right" [awGoToStep]="{stepIndex: 2}">Go directly to third Step</button>
|
||||
--> </div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -72,8 +71,7 @@
|
||||
<aw-wizard-step stepTitle="Title of step 2" [navigationSymbol]="{ symbol: '2' }" >
|
||||
<div class="col-sm-6 mx-auto">
|
||||
<div class="card mt-5">
|
||||
<!-- <div class="card-header"><legend> Loan</legend></div>
|
||||
--> <div class="card-body">
|
||||
<div class="card-body">
|
||||
<form>
|
||||
<fieldset>
|
||||
|
||||
@@ -157,7 +155,6 @@
|
||||
</label>
|
||||
</div>
|
||||
</fieldset>
|
||||
<!-- <button type="submit" class="btn btn-primary">Submit</button> -->
|
||||
</fieldset>
|
||||
</form>
|
||||
|
||||
@@ -174,4 +171,4 @@
|
||||
<button type="button" class="btn btn-primary" >Finish</button>
|
||||
</aw-wizard-step>
|
||||
</aw-wizard>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
@@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CreateClientComponent } from './create-client.component';
|
||||
|
||||
describe('CreateClientComponent', () => {
|
||||
let component: CreateClientComponent;
|
||||
let fixture: ComponentFixture<CreateClientComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ CreateClientComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(CreateClientComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@@ -1,8 +1,7 @@
|
||||
import { Component, OnInit} from '@angular/core';
|
||||
import { HeaderComponent } from '../../core/shell/header/header.component';
|
||||
|
||||
@Component({
|
||||
selector: 'app-create-client',
|
||||
selector: 'mifosx-create-client',
|
||||
templateUrl: './create-client.component.html',
|
||||
styleUrls: ['./create-client.component.scss']
|
||||
})
|
||||
@@ -12,4 +11,5 @@ export class CreateClientComponent implements OnInit {
|
||||
|
||||
ngOnInit() {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@@ -1,19 +0,0 @@
|
||||
/* import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CoreModule } from '../../core/core.module';
|
||||
|
||||
import { CreateClientComponent } from './create-client.component';
|
||||
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
CoreModule
|
||||
],
|
||||
declarations: [CreateClientComponent],
|
||||
schemas: [
|
||||
CUSTOM_ELEMENTS_SCHEMA
|
||||
],
|
||||
})
|
||||
export class CreateClientModule { }
|
||||
*/
|
||||
@@ -1,4 +1,4 @@
|
||||
<div class="fluid-container">
|
||||
<!-- <div class="fluid-container">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
|
||||
@@ -36,7 +36,6 @@
|
||||
<div class="card-body">
|
||||
<table class="table table-hover table-responsive-md table-fixed">
|
||||
|
||||
<!--Table head-->
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
@@ -48,9 +47,7 @@
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<!--Table head-->
|
||||
|
||||
<!--Table body-->
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">4</th>
|
||||
@@ -152,7 +149,6 @@
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
<!--Table body-->
|
||||
|
||||
</table>
|
||||
</div>
|
||||
@@ -160,9 +156,6 @@
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
@@ -1,11 +1,7 @@
|
||||
/* tslint:disable:no-unused-variable */
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { By } from '@angular/platform-browser';
|
||||
import { DebugElement } from '@angular/core';
|
||||
|
||||
import { ViewClientComponent } from './view-client.component';
|
||||
|
||||
describe('ViewClientComponent', () => {
|
||||
describe('CreateClientComponent', () => {
|
||||
let component: ViewClientComponent;
|
||||
let fixture: ComponentFixture<ViewClientComponent>;
|
||||
|
||||
|
||||
@@ -1,8 +1,7 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { HeaderComponent } from '../../core/shell/header/header.component';
|
||||
|
||||
@Component({
|
||||
selector: 'app-view-client',
|
||||
selector: 'mifosx-view-client',
|
||||
templateUrl: './view-client.component.html',
|
||||
styleUrls: ['./view-client.component.scss']
|
||||
})
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
<div class="fluid-container">
|
||||
<!-- <div class="fluid-container">
|
||||
<div class="container">
|
||||
<div class="col text-center">
|
||||
<div class="card border-secondary d-inline-block mt-5">
|
||||
@@ -71,7 +71,6 @@
|
||||
<div class="card ml-4">
|
||||
<table class="table table-hover table-responsive-md table-fixed">
|
||||
|
||||
<!--Table head-->
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
@@ -83,9 +82,7 @@
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<!--Table head-->
|
||||
|
||||
<!--Table body-->
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">4</th>
|
||||
@@ -187,8 +184,6 @@
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
<!--Table body-->
|
||||
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
@@ -201,7 +196,6 @@
|
||||
|
||||
<table class="table table-active table-hover table-responsive-md table-fixed mt-3">
|
||||
|
||||
<!--Table head-->
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
@@ -213,9 +207,7 @@
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<!--Table head-->
|
||||
|
||||
<!--Table body-->
|
||||
<tbody>
|
||||
<tr>
|
||||
<th scope="row">4</th>
|
||||
@@ -300,7 +292,6 @@
|
||||
</tr>
|
||||
|
||||
</tbody>
|
||||
<!--Table body-->
|
||||
|
||||
</table>
|
||||
|
||||
@@ -360,4 +351,4 @@
|
||||
</ngb-tabset>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
@@ -1,14 +1,14 @@
|
||||
.btn-flat {
|
||||
filter:progid:DXImageTransform.Microsoft.Gradient(enabled='false');
|
||||
-webkit-box-shadow: none;
|
||||
-moz-box-shadow: none;
|
||||
box-shadow: none;
|
||||
background-image:none;
|
||||
border:0;
|
||||
}
|
||||
// .btn-flat {
|
||||
// filter:progid:DXImageTransform.Microsoft.Gradient(enabled='false');
|
||||
// -webkit-box-shadow: none;
|
||||
// -moz-box-shadow: none;
|
||||
// box-shadow: none;
|
||||
// background-image:none;
|
||||
// border:0;
|
||||
// }
|
||||
|
||||
.btn {
|
||||
border: 1px solid #DDD;
|
||||
border-right-width: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
// .btn {
|
||||
// border: 1px solid #DDD;
|
||||
// border-right-width: 0;
|
||||
// border-radius: 0;
|
||||
// }
|
||||
|
||||
@@ -1,8 +1,4 @@
|
||||
/* tslint:disable:no-unused-variable */
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
import { By } from '@angular/platform-browser';
|
||||
import { DebugElement } from '@angular/core';
|
||||
|
||||
import { ViewLoanComponent } from './view-loan.component';
|
||||
|
||||
describe('ViewLoanComponent', () => {
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-view-loan',
|
||||
selector: 'mifosx-view-loan',
|
||||
templateUrl: './view-loan.component.html',
|
||||
styleUrls: ['./view-loan.component.scss']
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user