mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2025-12-22 19:57:06 +00:00
Compare commits
5 Commits
v1.2.0-ske
...
v1.2.1
| Author | SHA1 | Date | |
|---|---|---|---|
|
a1bec98d44 | ||
|
|
e8449e340d | ||
|
|
4cb8009c69 | ||
|
|
7f357306eb | ||
|
|
06679343a4 |
@@ -1,10 +1,10 @@
|
||||
import { AppPage } from './app.po';
|
||||
import { Fuse2Page } from './app.po';
|
||||
|
||||
describe('angular5 App', () => {
|
||||
let page: AppPage;
|
||||
describe('Fuse2 App', () => {
|
||||
let page: Fuse2Page;
|
||||
|
||||
beforeEach(() => {
|
||||
page = new AppPage();
|
||||
page = new Fuse2Page();
|
||||
});
|
||||
|
||||
it('should display welcome message', () => {
|
||||
|
||||
@@ -1,14 +1,11 @@
|
||||
import { AppPage } from './app.po';
|
||||
import { browser, by, element } from 'protractor';
|
||||
|
||||
describe('Fuse App', () => {
|
||||
let page: AppPage;
|
||||
export class Fuse2Page {
|
||||
navigateTo() {
|
||||
return browser.get('/');
|
||||
}
|
||||
|
||||
beforeEach(() => {
|
||||
page = new AppPage();
|
||||
});
|
||||
|
||||
it('should display welcome message', () => {
|
||||
page.navigateTo();
|
||||
expect(page.getParagraphText()).toEqual('Welcome to app!');
|
||||
});
|
||||
});
|
||||
getParagraphText() {
|
||||
return element(by.css('app-root h1')).getText();
|
||||
}
|
||||
}
|
||||
|
||||
92
package-lock.json
generated
92
package-lock.json
generated
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "fuse2",
|
||||
"version": "1.2.0",
|
||||
"version": "1.2.1",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
@@ -43,17 +43,17 @@
|
||||
}
|
||||
},
|
||||
"@angular/animations": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/animations/-/animations-5.0.0.tgz",
|
||||
"integrity": "sha1-ta0ZnGf5P3WVREd+/+ZnnhVJkfs=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/animations/-/animations-5.0.1.tgz",
|
||||
"integrity": "sha1-qSsrGGpuWjGp8VhJEd1qp+FsXeE=",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
},
|
||||
"@angular/cdk": {
|
||||
"version": "2.0.0-beta.12",
|
||||
"resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-2.0.0-beta.12.tgz",
|
||||
"integrity": "sha1-OiQ8tiuT9OA5EgunD5ANyeI1Yi4=",
|
||||
"version": "5.0.0-rc0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-5.0.0-rc0.tgz",
|
||||
"integrity": "sha512-wZg/mzHisiTieVt7Q/YNPB+r07PHvjoAT3+0mwyIP7wuC00W8BJLPhTZd/tIM5q7Nd69kuA1HSx1qLkcmlCZkw==",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
@@ -124,25 +124,25 @@
|
||||
}
|
||||
},
|
||||
"@angular/common": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/common/-/common-5.0.0.tgz",
|
||||
"integrity": "sha1-+W1mpRe5ldG6mygwnxXC41lnWCU=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/common/-/common-5.0.1.tgz",
|
||||
"integrity": "sha1-QwBas8i4/68Xaq+zuGupMcPkvfk=",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
},
|
||||
"@angular/compiler": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-5.0.0.tgz",
|
||||
"integrity": "sha1-uf+/GMijnYt9rOxHMZOpDiTMK8k=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-5.0.1.tgz",
|
||||
"integrity": "sha1-f9TH+ku770wUaWL6lGuCczCmyO0=",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
},
|
||||
"@angular/compiler-cli": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-5.0.0.tgz",
|
||||
"integrity": "sha1-Dsu5N9hKT43ZTwwqR7B9LkaUyFM=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-5.0.1.tgz",
|
||||
"integrity": "sha1-Um3BuzlPsWrZFmAe6pqgDrRLT/8=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"chokidar": "1.7.0",
|
||||
@@ -152,9 +152,9 @@
|
||||
}
|
||||
},
|
||||
"@angular/core": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/core/-/core-5.0.0.tgz",
|
||||
"integrity": "sha1-T5dqIl993fNJkvLK2CTJVDpG9Mg=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/core/-/core-5.0.1.tgz",
|
||||
"integrity": "sha1-pKdK/H4gWNMLgmPrbWbarOn0J7o=",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
@@ -168,55 +168,55 @@
|
||||
}
|
||||
},
|
||||
"@angular/forms": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/forms/-/forms-5.0.0.tgz",
|
||||
"integrity": "sha1-x/3fo1OWdZrphSkgowzdqMQe0d4=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/forms/-/forms-5.0.1.tgz",
|
||||
"integrity": "sha1-afMDxME9o8qg3mNDdYg4i2rWKyE=",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
},
|
||||
"@angular/http": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/http/-/http-5.0.0.tgz",
|
||||
"integrity": "sha1-Byiivgz7sHhyfF64fUyF1T/smlE=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/http/-/http-5.0.1.tgz",
|
||||
"integrity": "sha1-NQy99jz6yJOWE9dT/wce1YpgVhs=",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
},
|
||||
"@angular/language-service": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-5.0.0.tgz",
|
||||
"integrity": "sha1-bMu2n0dXJw3QTsWFfTdjSy8CxAw=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/language-service/-/language-service-5.0.1.tgz",
|
||||
"integrity": "sha1-hp4J29bj2VwRfAYtId0f2SCtRNY=",
|
||||
"dev": true
|
||||
},
|
||||
"@angular/material": {
|
||||
"version": "2.0.0-beta.12",
|
||||
"resolved": "https://registry.npmjs.org/@angular/material/-/material-2.0.0-beta.12.tgz",
|
||||
"integrity": "sha1-cbbQt7AhiR5dDjaIwdS9eMdFf1g=",
|
||||
"version": "5.0.0-rc0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/material/-/material-5.0.0-rc0.tgz",
|
||||
"integrity": "sha512-ZW9gy3c8l2NbFfX9DRYSW+i67pPoL9DZoMCb16STQlhdDfwwAWNpjGF0etXkXw30hDnRCMGVVJVU+45cNXJspA==",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
},
|
||||
"@angular/platform-browser": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-5.0.0.tgz",
|
||||
"integrity": "sha1-xwOPfN6AcFtiAUiXIx4YLuyXb+0=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-5.0.1.tgz",
|
||||
"integrity": "sha1-FIld0w7Sow7nuZx2t2R0j0bBqGI=",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
},
|
||||
"@angular/platform-browser-dynamic": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-5.0.0.tgz",
|
||||
"integrity": "sha1-iH4QbIsQOwQVz2FWpCXabYP0yJ0=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-5.0.1.tgz",
|
||||
"integrity": "sha1-Fttn1S1FMVY6sVQpxr3+GLwb7cg=",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
},
|
||||
"@angular/router": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@angular/router/-/router-5.0.0.tgz",
|
||||
"integrity": "sha1-/ktSGmc4QIvOMPk6U0mRQMk6T3Y=",
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/@angular/router/-/router-5.0.1.tgz",
|
||||
"integrity": "sha1-msCPKTAu9gzf08eBDZbCZd7EY9Y=",
|
||||
"requires": {
|
||||
"tslib": "1.8.0"
|
||||
}
|
||||
@@ -268,9 +268,9 @@
|
||||
"integrity": "sha512-918ksaRl8RvGWGOjpUCywTS1MnLTqHki53XXibyhZkmHGSP5yLkcArBAFhFLvtQTTbuX8KSz2WFKxwaJ3JuJFw=="
|
||||
},
|
||||
"@swimlane/ngx-datatable": {
|
||||
"version": "10.4.0",
|
||||
"resolved": "https://registry.npmjs.org/@swimlane/ngx-datatable/-/ngx-datatable-10.4.0.tgz",
|
||||
"integrity": "sha512-wTV/64vEGPFlcpE+ezTN18baOsNXyfLLvdmhEoaDQt2OJtTKtNxJkze24w71utoJxutQRrfHJUVSkAF4CLNckA=="
|
||||
"version": "11.0.3",
|
||||
"resolved": "https://registry.npmjs.org/@swimlane/ngx-datatable/-/ngx-datatable-11.0.3.tgz",
|
||||
"integrity": "sha512-feJ9Ep0xddgC1IuNEqxWcTnoSPc3drzY+Bn27RFq+ztXYf3mHsLMxerMqFyVaLPnMrZKttZ7MX48gXzOkSVavw=="
|
||||
},
|
||||
"@types/jasmine": {
|
||||
"version": "2.5.54",
|
||||
@@ -6425,9 +6425,9 @@
|
||||
}
|
||||
},
|
||||
"moment": {
|
||||
"version": "2.19.1",
|
||||
"resolved": "https://registry.npmjs.org/moment/-/moment-2.19.1.tgz",
|
||||
"integrity": "sha1-VtoaLRy/AdOLfhr8McELz6GSkWc="
|
||||
"version": "2.19.2",
|
||||
"resolved": "https://registry.npmjs.org/moment/-/moment-2.19.2.tgz",
|
||||
"integrity": "sha512-Rf6jiHPEfxp9+dlzxPTmRHbvoFXsh2L/U8hOupUMpnuecHQmI6cF6lUbJl3QqKPko1u6ujO+FxtcajLVfLpAtA=="
|
||||
},
|
||||
"move-concurrently": {
|
||||
"version": "1.0.1",
|
||||
|
||||
32
package.json
32
package.json
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "fuse2",
|
||||
"version": "1.2.0",
|
||||
"version": "1.2.1",
|
||||
"license": "",
|
||||
"scripts": {
|
||||
"ng": "ng",
|
||||
@@ -16,21 +16,21 @@
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@agm/core": "1.0.0-beta.2",
|
||||
"@angular/animations": "5.0.0",
|
||||
"@angular/cdk": "2.0.0-beta.12",
|
||||
"@angular/common": "5.0.0",
|
||||
"@angular/compiler": "5.0.0",
|
||||
"@angular/core": "5.0.0",
|
||||
"@angular/animations": "5.0.1",
|
||||
"@angular/cdk": "5.0.0-rc0",
|
||||
"@angular/common": "5.0.1",
|
||||
"@angular/compiler": "5.0.1",
|
||||
"@angular/core": "5.0.1",
|
||||
"@angular/flex-layout": "2.0.0-beta.10",
|
||||
"@angular/forms": "5.0.0",
|
||||
"@angular/http": "5.0.0",
|
||||
"@angular/material": "2.0.0-beta.12",
|
||||
"@angular/platform-browser": "5.0.0",
|
||||
"@angular/platform-browser-dynamic": "5.0.0",
|
||||
"@angular/router": "5.0.0",
|
||||
"@angular/forms": "5.0.1",
|
||||
"@angular/http": "5.0.1",
|
||||
"@angular/material": "5.0.0-rc0",
|
||||
"@angular/platform-browser": "5.0.1",
|
||||
"@angular/platform-browser-dynamic": "5.0.1",
|
||||
"@angular/router": "5.0.1",
|
||||
"@ngx-translate/core": "8.0.0",
|
||||
"@swimlane/ngx-charts": "6.1.0",
|
||||
"@swimlane/ngx-datatable": "10.4.0",
|
||||
"@swimlane/ngx-datatable": "11.0.3",
|
||||
"@withinpixels/ngx-dnd": "3.1.0",
|
||||
"angular-calendar": "0.21.3",
|
||||
"angular-in-memory-web-api": "0.5.1",
|
||||
@@ -41,7 +41,7 @@
|
||||
"hammerjs": "2.0.8",
|
||||
"highlight.js": "9.12.0",
|
||||
"intl": "1.2.5",
|
||||
"moment": "2.19.1",
|
||||
"moment": "2.19.2",
|
||||
"ngx-color-picker": "4.4.0",
|
||||
"ngx-cookie-service": "1.0.9",
|
||||
"perfect-scrollbar": "1.0.3",
|
||||
@@ -51,8 +51,8 @@
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular/cli": "1.5.0",
|
||||
"@angular/compiler-cli": "5.0.0",
|
||||
"@angular/language-service": "5.0.0",
|
||||
"@angular/compiler-cli": "5.0.1",
|
||||
"@angular/language-service": "5.0.1",
|
||||
"@angularclass/hmr": "2.1.3",
|
||||
"@types/jasmine": "2.5.54",
|
||||
"@types/jasminewd2": "2.0.3",
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
type="button"
|
||||
class="mat-elevation-z1"
|
||||
[matMenuTriggerFor]="colorMenu"
|
||||
(onMenuOpen)="onMenuOpen()"
|
||||
(menuOpened)="onMenuOpen()"
|
||||
[ngClass]="'mat-'+selectedPalette+'-'+selectedHue+'-bg'">
|
||||
<mat-icon>palette</mat-icon>
|
||||
</button>
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
</div>
|
||||
|
||||
<button mat-icon-button [matMenuTriggerFor]="addMenu" matTooltip="Click to add/remove shortcut"
|
||||
(onMenuOpen)="onMenuOpen()">
|
||||
(menuOpened)="onMenuOpen()">
|
||||
<mat-icon class="amber-600-fg">star</mat-icon>
|
||||
</button>
|
||||
|
||||
|
||||
@@ -149,7 +149,9 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy
|
||||
|
||||
onMenuOpen()
|
||||
{
|
||||
this.searchInputField.nativeElement.focus();
|
||||
setTimeout(() => {
|
||||
this.searchInputField.nativeElement.focus();
|
||||
});
|
||||
}
|
||||
|
||||
showMobileShortcutsPanel()
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import { Directive, Input, OnInit, HostListener, OnDestroy, HostBinding } from '@angular/core';
|
||||
import { MatSidenav } from '@angular/material';
|
||||
import { FuseMatSidenavHelperService } from 'app/core/directives/mat-sidenav-helper/mat-sidenav-helper.service';
|
||||
import { FuseMatchMedia } from '../../services/match-media.service';
|
||||
import { ObservableMedia } from '@angular/flex-layout';
|
||||
import { Subscription } from 'rxjs/Subscription';
|
||||
import { FuseMatchMedia } from '../../services/match-media.service';
|
||||
import { FuseMatSidenavHelperService } from './fuse-mat-sidenav-helper.service';
|
||||
|
||||
@Directive({
|
||||
selector: '[fuseMatSidenavHelper]'
|
||||
@@ -8,13 +8,13 @@ import { ColorPickerModule } from 'ngx-color-picker';
|
||||
import { NgxDnDModule } from '@withinpixels/ngx-dnd';
|
||||
import { NgxDatatableModule } from '@swimlane/ngx-datatable';
|
||||
|
||||
import { FuseMatSidenavHelperDirective, FuseMatSidenavTogglerDirective } from '../directives/mat-sidenav-helper/mat-sidenav-helper.directive';
|
||||
import { FuseMatSidenavHelperDirective, FuseMatSidenavTogglerDirective } from '../directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.directive';
|
||||
import { FuseMatSidenavHelperService } from '../directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.service';
|
||||
import { FusePipesModule } from '../pipes/pipes.module';
|
||||
import { FuseConfirmDialogComponent } from '../components/confirm-dialog/confirm-dialog.component';
|
||||
import { FuseCountdownComponent } from '../components/countdown/countdown.component';
|
||||
import { FuseMatchMedia } from '../services/match-media.service';
|
||||
import { FuseNavbarVerticalService } from '../../main/navbar/vertical/navbar-vertical.service';
|
||||
import { FuseMatSidenavHelperService } from '../directives/mat-sidenav-helper/mat-sidenav-helper.service';
|
||||
import { FuseHljsComponent } from '../components/hljs/hljs.component';
|
||||
import { FusePerfectScrollbarDirective } from '../directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.directive';
|
||||
import { FuseIfOnDomDirective } from '../directives/fuse-if-on-dom/fuse-if-on-dom.directive';
|
||||
|
||||
@@ -59,3 +59,8 @@ mat-sidenav-container {
|
||||
width: 14px;
|
||||
height: 7px;
|
||||
}
|
||||
|
||||
// Fix: "Input underlines has wrong color opacity value"
|
||||
.mat-form-field-underline {
|
||||
background-color: rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
<mat-toolbar>
|
||||
|
||||
<!-- TOOLBAR TOP -->
|
||||
<div fxFlex fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<mat-toolbar-row fxLayout="row" fxLayoutAlign="space-between center">
|
||||
|
||||
<!-- USER AVATAR WRAPPER -->
|
||||
<div class="avatar-wrapper">
|
||||
@@ -16,7 +16,8 @@
|
||||
alt="{{user.name}}"/>
|
||||
<!-- / USER AVATAR -->
|
||||
|
||||
<mat-icon class="s-16 status" [ngClass]="user.status" [matMenuTriggerFor]="userStatusMenu"></mat-icon>
|
||||
<mat-icon class="s-16 status" [ngClass]="user.status"
|
||||
[matMenuTriggerFor]="userStatusMenu"></mat-icon>
|
||||
|
||||
<!-- USER STATUS -->
|
||||
<mat-menu id="user-status-menu" #userStatusMenu="matMenu">
|
||||
@@ -69,7 +70,8 @@
|
||||
</button>
|
||||
</mat-menu>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</mat-toolbar-row>
|
||||
<!-- / TOOLBAR TOP -->
|
||||
|
||||
<!-- TOOLBAR BOTTOM -->
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ChatService } from '../../../chat.service';
|
||||
import { FuseMatSidenavHelperService } from '../../../../../../../core/directives/mat-sidenav-helper/mat-sidenav-helper.service';
|
||||
import { ObservableMedia } from '@angular/flex-layout';
|
||||
import { fuseAnimations } from '../../../../../../../core/animations';
|
||||
import { FuseMatSidenavHelperService } from '../../../../../../../core/directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.service';
|
||||
|
||||
@Component({
|
||||
selector : 'fuse-chat-chats-sidenav',
|
||||
|
||||
@@ -5,20 +5,19 @@
|
||||
<mat-toolbar>
|
||||
|
||||
<!-- TOOLBAR TOP -->
|
||||
<div fxFlex fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<mat-toolbar-row fxLayout="row" fxLayoutAlign="space-between center">
|
||||
|
||||
<button mat-button class="mat-icon-button" (click)="changeLeftSidenavView('chats')" aria-label="back">
|
||||
<mat-icon>arrow_back</mat-icon>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
</mat-toolbar-row>
|
||||
<!-- / TOOLBAR TOP -->
|
||||
|
||||
<!-- TOOLBAR BOTTOM -->
|
||||
<mat-toolbar-row class="toolbar-bottom" fxLayout="column" fxLayoutAlign="center center">
|
||||
|
||||
<img [src]="user.avatar" class="avatar user-avatar huge" alt="{{user.name}}"/>
|
||||
|
||||
<div class="user-name my-8">{{user.name}}</div>
|
||||
|
||||
</mat-toolbar-row>
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
<mat-toolbar>
|
||||
|
||||
<!-- TOOLBAR TOP -->
|
||||
<div fxFlex fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<mat-toolbar-row fxLayout="row" fxLayoutAlign="space-between center">
|
||||
|
||||
<div>Contact Info</div>
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
</mat-toolbar-row>
|
||||
<!-- / TOOLBAR TOP -->
|
||||
|
||||
<!-- TOOLBAR BOTTOM -->
|
||||
@@ -37,9 +37,9 @@
|
||||
<mat-card>
|
||||
|
||||
<mat-form-field fxFlex>
|
||||
<textarea matInput placeholder="Mood" name="mood"
|
||||
[value]="contact.mood" rows="3" disabled>
|
||||
</textarea>
|
||||
<textarea matInput placeholder="Mood" name="mood"
|
||||
[value]="contact.mood" rows="3" disabled>
|
||||
</textarea>
|
||||
</mat-form-field>
|
||||
|
||||
</mat-card>
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
<div class="dialog-content-wrapper">
|
||||
<mat-toolbar matDialogTitle class="mat-accent m-0">
|
||||
<div fxFlex fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<mat-toolbar-row fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<span class="title dialog-title">{{dialogTitle}}</span>
|
||||
<button mat-button class="mat-icon-button"
|
||||
(click)="dialogRef.close()"
|
||||
aria-label="Close dialog">
|
||||
<mat-icon>close</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</mat-toolbar-row>
|
||||
|
||||
<mat-toolbar-row class="toolbar-bottom py-8 py-sm-16" fxLayout="column" fxLayoutAlign="center center">
|
||||
<img [src]="contact.avatar" class=" avatar contact-avatar huge"
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
@import "src/app/core/scss/fuse";
|
||||
|
||||
:host {
|
||||
fuse-contacts-contact-list {
|
||||
flex: 1;
|
||||
|
||||
.mat-table {
|
||||
@@ -9,6 +9,10 @@
|
||||
|
||||
.mat-column-checkbox {
|
||||
flex: 0 1 48px;
|
||||
|
||||
.mat-checkbox-ripple {
|
||||
display: none !important; //fix for broken rendering
|
||||
}
|
||||
}
|
||||
|
||||
.mat-column-avatar {
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Component, OnInit, TemplateRef, ViewChild } from '@angular/core';
|
||||
import { Component, OnDestroy, OnInit, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core';
|
||||
import { ContactsService } from '../contacts.service';
|
||||
import { Observable } from 'rxjs/Observable';
|
||||
import { FuseContactsContactFormDialogComponent } from '../contact-form/contact-form.component';
|
||||
@@ -7,14 +7,16 @@ import { FuseConfirmDialogComponent } from '../../../../../core/components/confi
|
||||
import { FormGroup } from '@angular/forms';
|
||||
import { DataSource } from '@angular/cdk/collections';
|
||||
import { fuseAnimations } from '../../../../../core/animations';
|
||||
import { Subscription } from 'rxjs/Subscription';
|
||||
|
||||
@Component({
|
||||
selector : 'fuse-contacts-contact-list',
|
||||
templateUrl: './contact-list.component.html',
|
||||
styleUrls : ['./contact-list.component.scss'],
|
||||
animations : fuseAnimations
|
||||
selector : 'fuse-contacts-contact-list',
|
||||
templateUrl : './contact-list.component.html',
|
||||
styleUrls : ['./contact-list.component.scss'],
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
animations : fuseAnimations
|
||||
})
|
||||
export class FuseContactsContactListComponent implements OnInit
|
||||
export class FuseContactsContactListComponent implements OnInit, OnDestroy
|
||||
{
|
||||
@ViewChild('dialogContent') dialogContent: TemplateRef<any>;
|
||||
|
||||
@@ -25,6 +27,10 @@ export class FuseContactsContactListComponent implements OnInit
|
||||
selectedContacts: any[];
|
||||
checkboxes: {};
|
||||
|
||||
onContactsChangedSubscription: Subscription;
|
||||
onSelectedContactsChangedSubscription: Subscription;
|
||||
onUserDataChangedSubscription: Subscription;
|
||||
|
||||
dialogRef: any;
|
||||
|
||||
confirmDialogRef: MatDialogRef<FuseConfirmDialogComponent>;
|
||||
@@ -34,27 +40,30 @@ export class FuseContactsContactListComponent implements OnInit
|
||||
public dialog: MatDialog
|
||||
)
|
||||
{
|
||||
this.contactsService.onContactsChanged.subscribe(contacts => {
|
||||
this.onContactsChangedSubscription =
|
||||
this.contactsService.onContactsChanged.subscribe(contacts => {
|
||||
|
||||
this.contacts = contacts;
|
||||
this.contacts = contacts;
|
||||
|
||||
this.checkboxes = {};
|
||||
contacts.map(contact => {
|
||||
this.checkboxes[contact.id] = false;
|
||||
this.checkboxes = {};
|
||||
contacts.map(contact => {
|
||||
this.checkboxes[contact.id] = false;
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
this.contactsService.onSelectedContactsChanged.subscribe(selectedContacts => {
|
||||
for ( const id in this.checkboxes )
|
||||
{
|
||||
this.checkboxes[id] = selectedContacts.includes(id);
|
||||
}
|
||||
this.selectedContacts = selectedContacts;
|
||||
});
|
||||
this.onSelectedContactsChangedSubscription =
|
||||
this.contactsService.onSelectedContactsChanged.subscribe(selectedContacts => {
|
||||
for ( const id in this.checkboxes )
|
||||
{
|
||||
this.checkboxes[id] = selectedContacts.includes(id);
|
||||
}
|
||||
this.selectedContacts = selectedContacts;
|
||||
});
|
||||
|
||||
this.contactsService.onUserDataChanged.subscribe(user => {
|
||||
this.user = user;
|
||||
});
|
||||
this.onUserDataChangedSubscription =
|
||||
this.contactsService.onUserDataChanged.subscribe(user => {
|
||||
this.user = user;
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
@@ -63,6 +72,13 @@ export class FuseContactsContactListComponent implements OnInit
|
||||
this.dataSource = new FilesDataSource(this.contactsService);
|
||||
}
|
||||
|
||||
ngOnDestroy()
|
||||
{
|
||||
this.onContactsChangedSubscription.unsubscribe();
|
||||
this.onSelectedContactsChangedSubscription.unsubscribe();
|
||||
this.onUserDataChangedSubscription.unsubscribe();
|
||||
}
|
||||
|
||||
editContact(contact)
|
||||
{
|
||||
this.dialogRef = this.dialog.open(FuseContactsContactFormDialogComponent, {
|
||||
|
||||
@@ -90,7 +90,7 @@
|
||||
formControlName="categories">
|
||||
|
||||
<mat-chip *ngFor="let category of product.categories"
|
||||
removable="true" (remove)="product.removeCategory(category)">
|
||||
removable="true" (removed)="product.removeCategory(category)">
|
||||
{{category}}
|
||||
<mat-icon matChipRemove>cancel</mat-icon>
|
||||
</mat-chip>
|
||||
@@ -109,7 +109,7 @@
|
||||
formControlName="tags">
|
||||
|
||||
<mat-chip *ngFor="let tag of product.tags"
|
||||
removable="true" (remove)="product.removeTag(tag)">
|
||||
removable="true" (removed)="product.removeTag(tag)">
|
||||
{{tag}}
|
||||
<mat-icon matChipRemove>cancel</mat-icon>
|
||||
</mat-chip>
|
||||
|
||||
@@ -71,7 +71,7 @@
|
||||
<!-- CHECKLIST -->
|
||||
<div class="due-date " fxFlex="0 1 auto">
|
||||
|
||||
<button mat-icon-button class="" [matMenuTriggerFor]="checklistMenu" #checklistMenuTrigger="matMenuTrigger" (onMenuOpen)="onChecklistMenuOpen()">
|
||||
<button mat-icon-button class="" [matMenuTriggerFor]="checklistMenu" #checklistMenuTrigger="matMenuTrigger" (menuOpened)="onChecklistMenuOpen()">
|
||||
<mat-icon>check_box</mat-icon>
|
||||
</button>
|
||||
|
||||
|
||||
@@ -20,6 +20,10 @@
|
||||
.mat-form-field-flex {
|
||||
align-items: center;
|
||||
|
||||
.mat-form-field-infix {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mat-input-element {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
<div [ngSwitch]="labelsMenuView" class="views" (click)="$event.stopPropagation()">
|
||||
|
||||
<div class="view " *ngSwitchCase="'labels'" [@slideInLeft] fxFlex fxLayout="column">
|
||||
<div class="view" *ngSwitchCase="'labels'" fxFlex fxLayout="column">
|
||||
|
||||
<div class="header mb-12 pb-4 px-8" fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<div class="header" fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<div>Labels</div>
|
||||
<button mat-button (click)="labelsMenuView ='add'">
|
||||
<mat-icon class="s-16">add</mat-icon>
|
||||
@@ -12,7 +12,7 @@
|
||||
|
||||
<div fxFlex fxLayout="column" fusePerfectScrollbar>
|
||||
|
||||
<div class="label pl-12 mx-8 mb-8" *ngFor="let label of board.labels" fxFlex="0 0 auto" fxLayout="row" fxFlexAlign="space-between center"
|
||||
<div class="label" *ngFor="let label of board.labels" fxFlex="0 0 auto" fxLayout="row" fxFlexAlign="space-between center"
|
||||
[ngClass]="label.color">
|
||||
|
||||
<mat-checkbox fxFlex fxLayout="row" fxLayoutAlign="start center" [checked]="card.idLabels.indexOf(label.id) > -1"
|
||||
@@ -27,16 +27,16 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="view px-8" *ngSwitchCase="'edit'" [@slideInRight] fxFlex fxLayout="column">
|
||||
<div class="view edit" *ngSwitchCase="'edit'" fxFlex fxLayout="column">
|
||||
|
||||
<div class="header mb-12 pb-4" fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<div>Edit Label</div>
|
||||
<div class="header" fxLayout="row" fxLayoutAlign="start center">
|
||||
<button mat-icon-button (click)="labelsMenuView ='labels'">
|
||||
<mat-icon class="s-16">arrow_back</mat-icon>
|
||||
</button>
|
||||
<div>Edit Label</div>
|
||||
</div>
|
||||
|
||||
<div fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<div class="content" fxLayout="row" fxLayoutAlign="start center">
|
||||
<mat-form-field>
|
||||
<input matInput placeholder="Name" [(ngModel)]="selectedLabel.name" (change)="onLabelChange()">
|
||||
</mat-form-field>
|
||||
@@ -46,26 +46,26 @@
|
||||
|
||||
</div>
|
||||
|
||||
<div class="view px-8" *ngSwitchCase="'add'" [@slideInRight] fxFlex fxLayout="column">
|
||||
<div class="view add" *ngSwitchCase="'add'" fxFlex fxLayout="column">
|
||||
|
||||
<div class="header mb-12 pb-4" fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<div>Add Label</div>
|
||||
<div class="header" fxLayout="row" fxLayoutAlign="start center">
|
||||
<button mat-icon-button (click)="labelsMenuView ='labels'">
|
||||
<mat-icon class="s-16">arrow_back</mat-icon>
|
||||
</button>
|
||||
<div>Add Label</div>
|
||||
</div>
|
||||
|
||||
<form (submit)="addNewLabel()" #newLabelForm="ngForm" fxFlex fxLayout="column" fxLayoutAlign="start end">
|
||||
|
||||
<div class="w-100-p" fxFlex="0 1 auto" fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<div fxFlex="0 1 auto" fxLayout="row" fxLayoutAlign="space-between center">
|
||||
<mat-form-field fxFlex>
|
||||
<input matInput placeholder="Name" [(ngModel)]="newLabel.name" name="labelName" required>
|
||||
</mat-form-field>
|
||||
|
||||
<fuse-material-color-picker [(selectedClass)]="newLabel.color" name="labelColor" class="ml-8"></fuse-material-color-picker>
|
||||
<fuse-material-color-picker class="ml-8" [(selectedClass)]="newLabel.color" name="labelColor"></fuse-material-color-picker>
|
||||
</div>
|
||||
|
||||
<button mat-raised-button class="mat-accent mt-16" [disabled]="!newLabelForm.valid">Add</button>
|
||||
<button mat-raised-button class="mat-accent mt-16" [disabled]="!newLabelForm.valid">ADD NEW LABEL</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -30,6 +30,37 @@
|
||||
|
||||
> .header {
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||
padding: 4px 8px 8px 16px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.label {
|
||||
margin: 0 8px 8px 8px;
|
||||
padding: 4px 4px 4px 16px;
|
||||
}
|
||||
|
||||
&.edit,
|
||||
&.add {
|
||||
|
||||
> .header {
|
||||
padding: 0 8px 8px 0;
|
||||
}
|
||||
|
||||
form {
|
||||
padding: 0 16px 8px 16px;
|
||||
|
||||
.mat-form-field-infix {
|
||||
width: auto !important;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 8px 16px 8px 16px;
|
||||
|
||||
.mat-form-field-infix {
|
||||
width: auto !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -59,9 +59,6 @@
|
||||
name="title"
|
||||
formControlName="title"
|
||||
placeholder="Title"
|
||||
matTextareaAutosize
|
||||
matAutosizeMinRows="1"
|
||||
matAutosizeMaxRows="2"
|
||||
required>
|
||||
</textarea>
|
||||
</mat-form-field>
|
||||
@@ -96,10 +93,7 @@
|
||||
name="notes"
|
||||
formControlName="notes"
|
||||
placeholder="Notes"
|
||||
maxlength="500"
|
||||
matTextareaAutosize
|
||||
matAutosizeMinRows="1"
|
||||
matAutosizeMaxRows="6">
|
||||
maxlength="500">
|
||||
</textarea>
|
||||
<mat-hint align="end">{{notes.value.length}} / 500</mat-hint>
|
||||
</mat-form-field>
|
||||
|
||||
@@ -5,12 +5,11 @@
|
||||
flex: 1 0 auto;
|
||||
flex-direction: column;
|
||||
overflow-y: auto;
|
||||
padding: 24px;
|
||||
|
||||
.todo-header {
|
||||
padding-bottom: 24px;
|
||||
margin-bottom: 8px;
|
||||
padding: 24px;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.12);
|
||||
background: rgba(0, 0, 0, 0.06);
|
||||
|
||||
.actions {
|
||||
min-width: 88px;
|
||||
@@ -19,6 +18,7 @@
|
||||
}
|
||||
|
||||
.todo-content {
|
||||
padding: 24px;
|
||||
|
||||
.title {
|
||||
font-size: 17px;
|
||||
|
||||
@@ -48,12 +48,13 @@ export class FuseTodoDetailsComponent implements OnInit, OnDestroy
|
||||
|
||||
this.todoForm = this.createTodoForm();
|
||||
|
||||
this.onFormChange = this.todoForm.valueChanges
|
||||
.debounceTime(500)
|
||||
.distinctUntilChanged()
|
||||
.subscribe(data => {
|
||||
this.todoService.updateTodo(data);
|
||||
});
|
||||
this.onFormChange =
|
||||
this.todoForm.valueChanges
|
||||
.debounceTime(500)
|
||||
.distinctUntilChanged()
|
||||
.subscribe(data => {
|
||||
this.todoService.updateTodo(data);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
@@ -65,15 +66,16 @@ export class FuseTodoDetailsComponent implements OnInit, OnDestroy
|
||||
});
|
||||
|
||||
// Subscribe to update on tag change
|
||||
this.onNewTodoClicked = this.todoService.onNewTodoClicked
|
||||
.subscribe(() => {
|
||||
this.todo = new Todo({});
|
||||
this.todo.id = FuseUtils.generateGUID();
|
||||
this.formType = 'new';
|
||||
this.todoForm = this.createTodoForm();
|
||||
this.focusTitleField();
|
||||
this.todoService.onCurrentTodoChanged.next([this.todo, 'new']);
|
||||
});
|
||||
this.onNewTodoClicked =
|
||||
this.todoService.onNewTodoClicked
|
||||
.subscribe(() => {
|
||||
this.todo = new Todo({});
|
||||
this.todo.id = FuseUtils.generateGUID();
|
||||
this.formType = 'new';
|
||||
this.todoForm = this.createTodoForm();
|
||||
this.focusTitleField();
|
||||
this.todoService.onCurrentTodoChanged.next([this.todo, 'new']);
|
||||
});
|
||||
}
|
||||
|
||||
focusTitleField()
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
</mat-icon>
|
||||
|
||||
<mat-checkbox [(ngModel)]="selected" (ngModelChange)="onSelectedChange()"
|
||||
class="mr-16" fxFlex="0 1 auto">
|
||||
class="mr-16" fxFlex="0 1 auto" (click)="$event.stopPropagation()">
|
||||
</mat-checkbox>
|
||||
|
||||
<div fxLayout="row" fxLayoutAlign="start center" fxFlex>
|
||||
|
||||
@@ -1,7 +1,9 @@
|
||||
<div class="dialog-content-wrapper">
|
||||
|
||||
<mat-toolbar matDialogTitle class="mat-accent m-0">
|
||||
<span class="title dialog-title">{{data.article.title}}</span>
|
||||
<mat-toolbar-row>
|
||||
<span class="title dialog-title">{{data.article.title}}</span>
|
||||
</mat-toolbar-row>
|
||||
</mat-toolbar>
|
||||
|
||||
<div mat-dialog-content class="p-24 m-0" fusePerfectScrollbar>
|
||||
|
||||
@@ -25,7 +25,7 @@
|
||||
<!-- CONTENT -->
|
||||
<div class="content">
|
||||
|
||||
<mat-tab-group class="color-tabs" dynamicHeight="true" (selectChange)="selectColor($event)">
|
||||
<mat-tab-group class="color-tabs" dynamicHeight="true" (selectedTabChange)="selectColor($event)">
|
||||
|
||||
<mat-tab *ngFor="let color of ['primary', 'accent', 'warn']" label="{{color}}">
|
||||
<ng-template mat-tab-label>
|
||||
|
||||
Reference in New Issue
Block a user