1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
|
import { Component, ElementRef, ViewChild, Input } from '@angular/core'
import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap'
@Component({
selector: 'my-custom-modal',
templateUrl: './custom-modal.component.html',
styleUrls: [ './custom-modal.component.scss' ]
})
export class CustomModalComponent {
@ViewChild('modal', { static: true }) modal: ElementRef
@Input() title: string
@Input() content: string
@Input() close?: boolean
@Input() cancel?: { value: string, action?: () => void }
@Input() confirm?: { value: string, action?: () => void }
private modalRef: NgbModalRef
constructor (
private modalService: NgbModal
) { }
show (input: {
title: string
content: string
close?: boolean
cancel?: { value: string, action?: () => void }
confirm?: { value: string, action?: () => void }
}) {
if (this.modalRef instanceof NgbModalRef && this.modalService.hasOpenModals()) {
console.error('Cannot open another custom modal, one is already opened.')
return
}
const { title, content, close, cancel, confirm } = input
this.title = title
this.content = content
this.close = close
this.cancel = cancel
this.confirm = confirm
this.modalRef = this.modalService.open(this.modal, {
centered: true,
backdrop: 'static',
keyboard: false,
size: 'lg'
})
}
onCancelClick () {
this.modalRef.close()
if (typeof this.cancel.action === 'function') {
this.cancel.action()
}
this.destroy()
}
onCloseClick () {
this.modalRef.close()
this.destroy()
}
onConfirmClick () {
this.modalRef.close()
if (typeof this.confirm.action === 'function') {
this.confirm.action()
}
this.destroy()
}
hasCancel () {
return typeof this.cancel !== 'undefined'
}
hasConfirm () {
return typeof this.confirm !== 'undefined'
}
private destroy () {
delete this.modalRef
delete this.title
delete this.content
delete this.close
delete this.cancel
delete this.confirm
}
}
|
