summaryrefslogtreecommitdiffstats
path: root/usecaseui-portal/src/app/shared
diff options
context:
space:
mode:
Diffstat (limited to 'usecaseui-portal/src/app/shared')
-rw-r--r--usecaseui-portal/src/app/shared/components/details/details.component.ts18
-rw-r--r--usecaseui-portal/src/app/shared/components/performance-details/performance-details.component.ts20
-rw-r--r--usecaseui-portal/src/app/shared/utils/animates.ts57
3 files changed, 76 insertions, 19 deletions
diff --git a/usecaseui-portal/src/app/shared/components/details/details.component.ts b/usecaseui-portal/src/app/shared/components/details/details.component.ts
index dea6caaa..1de80a94 100644
--- a/usecaseui-portal/src/app/shared/components/details/details.component.ts
+++ b/usecaseui-portal/src/app/shared/components/details/details.component.ts
@@ -14,23 +14,23 @@
limitations under the License.
*/
import { Component, OnInit, Input } from '@angular/core';
-import { slideUpDown } from '../../../animates';
+import { slideUpDown } from '../../utils/animates';
import { HomesService } from '../../../core/services/homes.service';
@Component({
selector: 'app-details',
templateUrl: './details.component.html',
styleUrls: ['./details.component.less'],
- animations: [ slideUpDown ]
+ animations: [slideUpDown]
})
export class DetailsComponent implements OnInit {
- constructor(private myhttp:HomesService) { }
+ constructor(private myhttp: HomesService) { }
ngOnInit() {
}
- ngOnChanges(changes){
+ ngOnChanges(changes) {
this.getAlarmDetailData(this.detailId);
}
@@ -38,9 +38,9 @@ export class DetailsComponent implements OnInit {
};
dataillistdata: any = [];
- getAlarmDetailData(id){
- if(id){
- this.myhttp.getAlarmDetailData(id).subscribe((data)=>{
+ getAlarmDetailData(id) {
+ if (id) {
+ this.myhttp.getAlarmDetailData(id).subscribe((data) => {
this.datailheaderdata = data.alarmsHeader;
this.dataillistdata = data.list;
})
@@ -50,9 +50,9 @@ export class DetailsComponent implements OnInit {
// detail Show
moredetailShow = false;
@Input() detailId;
-
+
state = 'up'
- slideUpDown(){
+ slideUpDown() {
this.moredetailShow = !this.moredetailShow;
this.state = this.state === 'up' ? 'down' : 'up';
}
diff --git a/usecaseui-portal/src/app/shared/components/performance-details/performance-details.component.ts b/usecaseui-portal/src/app/shared/components/performance-details/performance-details.component.ts
index 9a601485..2f482e96 100644
--- a/usecaseui-portal/src/app/shared/components/performance-details/performance-details.component.ts
+++ b/usecaseui-portal/src/app/shared/components/performance-details/performance-details.component.ts
@@ -14,33 +14,33 @@
limitations under the License.
*/
import { Component, OnInit, Input } from '@angular/core';
-import { slideUpDown } from '../../../animates';
+import { slideUpDown } from '../../utils/animates';
import { HomesService } from '../../../core/services/homes.service';
@Component({
selector: 'app-performance-details',
templateUrl: './performance-details.component.html',
styleUrls: ['./performance-details.component.less'],
- animations: [ slideUpDown ]
+ animations: [slideUpDown]
})
export class PerformanceDetailsComponent implements OnInit {
-
- constructor(private myhttp:HomesService) { }
+
+ constructor(private myhttp: HomesService) { }
ngOnInit() {
-
+
}
- ngOnChanges(changes){
+ ngOnChanges(changes) {
console.log(this.detailId)
this.getPerformanceHeaderDetail(this.detailId);
}
datailheaderdata: any = {};
dataillistdata: any = [];
- getPerformanceHeaderDetail(id){
- if(id){
- this.myhttp.getPerformanceHeaderDetail(id).subscribe((data)=>{
+ getPerformanceHeaderDetail(id) {
+ if (id) {
+ this.myhttp.getPerformanceHeaderDetail(id).subscribe((data) => {
console.log(data)
this.datailheaderdata = data.performanceHeader;
this.dataillistdata = data.list;
@@ -50,7 +50,7 @@ export class PerformanceDetailsComponent implements OnInit {
moredetailShow = false;
@Input() detailId;
state = 'up'
- slideUpDown(){
+ slideUpDown() {
this.moredetailShow = !this.moredetailShow;
this.state = this.state === 'up' ? 'down' : 'up';
}
diff --git a/usecaseui-portal/src/app/shared/utils/animates.ts b/usecaseui-portal/src/app/shared/utils/animates.ts
new file mode 100644
index 00000000..d5c29b7e
--- /dev/null
+++ b/usecaseui-portal/src/app/shared/utils/animates.ts
@@ -0,0 +1,57 @@
+/*
+ Copyright (C) 2019 CMCC, Inc. and others. All rights reserved.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+import { trigger, state, style, animate, transition } from '@angular/animations';
+
+// Routing animation
+export const slideToRight = trigger('routerAnimate', [
+ // Define void to indicate empty state
+ state('void', style({ position:'fixed', zIndex:'-1' })), //I don't understand why I want to add a positioning animation to take effect.
+ // * Indicates any state
+ state('*', style({ })),
+ // Admission animation
+ transition(':enter', [
+ style({transform: 'translateX(-100%)'}),
+ animate('.5s ease-in-out')
+ ]),
+ // Opening animation
+ transition(':leave', [
+ animate('.5s ease-in-out', style({transform: 'translateX(100%)'}) )
+ ])
+]);
+// Detail page shows hidden animation
+export const showHideAnimate = trigger('showHideAnimate', [
+ state('show', style({
+ transform: 'scale(1)',
+ display:'block',
+ })),
+ state('hide', style({
+ transform: 'scale(0)',
+ display:'none'
+ })),
+ transition('show => hide', animate('300ms ease-in')),
+ transition('hide => show', animate('300ms ease-out'))
+]);
+// Detail page shows hidden animation
+export const slideUpDown = trigger('slideUpDown', [
+ state('down', style({
+ height: "*"
+ })),
+ state('up', style({
+ height: "0"
+ })),
+ transition('down => up', animate('300ms ease-in')),
+ transition('up => down', animate('300ms ease-out'))
+]); \ No newline at end of file