116 lines
3.3 KiB
TypeScript
116 lines
3.3 KiB
TypeScript
|
import { Component, ElementRef, EventEmitter, Output, ViewChild, OnInit } from '@angular/core'
|
||
|
import { Notifier, AuthService } from '@app/core'
|
||
|
import { FormReactive, FormValidatorService, AbuseValidatorsService } from '@app/shared/shared-forms'
|
||
|
import { NgbModal } from '@ng-bootstrap/ng-bootstrap'
|
||
|
import { NgbModalRef } from '@ng-bootstrap/ng-bootstrap/modal/modal-ref'
|
||
|
import { I18n } from '@ngx-translate/i18n-polyfill'
|
||
|
import { AbuseMessage, UserAbuse } from '@shared/models'
|
||
|
import { AbuseService } from './abuse.service'
|
||
|
|
||
|
@Component({
|
||
|
selector: 'my-abuse-message-modal',
|
||
|
templateUrl: './abuse-message-modal.component.html',
|
||
|
styleUrls: [ './abuse-message-modal.component.scss' ]
|
||
|
})
|
||
|
export class AbuseMessageModalComponent extends FormReactive implements OnInit {
|
||
|
@ViewChild('modal', { static: true }) modal: NgbModal
|
||
|
@ViewChild('messagesBlock', { static: false }) messagesBlock: ElementRef
|
||
|
|
||
|
@Output() countMessagesUpdated = new EventEmitter<{ abuseId: number, countMessages: number }>()
|
||
|
|
||
|
abuseMessages: AbuseMessage[] = []
|
||
|
textareaMessage: string
|
||
|
sendingMessage = false
|
||
|
|
||
|
private openedModal: NgbModalRef
|
||
|
private abuse: UserAbuse
|
||
|
|
||
|
constructor (
|
||
|
protected formValidatorService: FormValidatorService,
|
||
|
private abuseValidatorsService: AbuseValidatorsService,
|
||
|
private modalService: NgbModal,
|
||
|
private auth: AuthService,
|
||
|
private notifier: Notifier,
|
||
|
private i18n: I18n,
|
||
|
private abuseService: AbuseService
|
||
|
) {
|
||
|
super()
|
||
|
}
|
||
|
|
||
|
ngOnInit () {
|
||
|
this.buildForm({
|
||
|
message: this.abuseValidatorsService.ABUSE_MESSAGE
|
||
|
})
|
||
|
}
|
||
|
|
||
|
openModal (abuse: UserAbuse) {
|
||
|
this.abuse = abuse
|
||
|
|
||
|
this.openedModal = this.modalService.open(this.modal, { centered: true })
|
||
|
|
||
|
this.loadMessages()
|
||
|
}
|
||
|
|
||
|
hide () {
|
||
|
this.abuseMessages = []
|
||
|
this.openedModal.close()
|
||
|
}
|
||
|
|
||
|
addMessage () {
|
||
|
this.sendingMessage = true
|
||
|
|
||
|
this.abuseService.addAbuseMessage(this.abuse, this.form.value['message'])
|
||
|
.subscribe(
|
||
|
() => {
|
||
|
this.form.reset()
|
||
|
this.sendingMessage = false
|
||
|
this.countMessagesUpdated.emit({ abuseId: this.abuse.id, countMessages: this.abuseMessages.length + 1 })
|
||
|
|
||
|
this.loadMessages()
|
||
|
},
|
||
|
|
||
|
err => {
|
||
|
this.sendingMessage = false
|
||
|
console.error(err)
|
||
|
this.notifier.error('Sorry but you cannot send this message. Please retry later')
|
||
|
}
|
||
|
)
|
||
|
}
|
||
|
|
||
|
deleteMessage (abuseMessage: AbuseMessage) {
|
||
|
this.abuseService.deleteAbuseMessage(this.abuse, abuseMessage)
|
||
|
.subscribe(
|
||
|
() => {
|
||
|
this.countMessagesUpdated.emit({ abuseId: this.abuse.id, countMessages: this.abuseMessages.length - 1 })
|
||
|
|
||
|
this.abuseMessages = this.abuseMessages.filter(m => m.id !== abuseMessage.id)
|
||
|
},
|
||
|
|
||
|
err => this.notifier.error(err.message)
|
||
|
)
|
||
|
}
|
||
|
|
||
|
isMessageByMe (abuseMessage: AbuseMessage) {
|
||
|
return this.auth.getUser().account.id === abuseMessage.account.id
|
||
|
}
|
||
|
|
||
|
private loadMessages () {
|
||
|
this.abuseService.listAbuseMessages(this.abuse)
|
||
|
.subscribe(
|
||
|
res => {
|
||
|
this.abuseMessages = res.data
|
||
|
|
||
|
setTimeout(() => {
|
||
|
if (!this.messagesBlock) return
|
||
|
|
||
|
const element = this.messagesBlock.nativeElement as HTMLElement
|
||
|
element.scrollIntoView({ block: 'end', inline: 'nearest' })
|
||
|
})
|
||
|
},
|
||
|
|
||
|
err => this.notifier.error(err.message)
|
||
|
)
|
||
|
}
|
||
|
|
||
|
}
|