62 lines
2.3 KiB
JavaScript
62 lines
2.3 KiB
JavaScript
import Component from '../component/index';
|
|
import './ApiInfoComponent.css';
|
|
import Modal from '../modal/Modal';
|
|
import storageApi from '../../api/StorageServiceAPI';
|
|
|
|
class ApiInfoComponent extends Component {
|
|
constructor (container) {
|
|
super('#api-info', container);
|
|
|
|
this.infoTitle = this.mainNode.querySelector('.Info__title');
|
|
this.infoHeader = this.mainNode.querySelector('.Info__header');
|
|
this.infoDescription = this.mainNode.querySelector('.Info__description');
|
|
this.infoServiceName = this.mainNode.querySelector('.Info__service_name');
|
|
this.infoEditor = this.mainNode.querySelector('.Info__editor');
|
|
this.infoFooter = this.mainNode.querySelector('.Info__footer');
|
|
this.infoBody = this.mainNode.querySelector('.Info__body');
|
|
this.infoControls = this.mainNode.querySelector('.Info__controls');
|
|
this.btnDelete = this.mainNode.querySelector('.Button__delete');
|
|
this.btnEdit = this.mainNode.querySelector('.Button__edit');
|
|
this.info = {
|
|
headerNode: this.infoHeader,
|
|
contentNode: this.infoBody,
|
|
footerNode: this.infoFooter
|
|
};
|
|
this.key = null;
|
|
this.modal = new Modal(document.body, this.info);
|
|
|
|
this.addEventListener(this.btnDelete, 'click', () => {
|
|
if (this.key !== null) {
|
|
this.deleteApi(this.key);
|
|
}
|
|
});
|
|
}
|
|
|
|
render = (object, index) => {
|
|
this.object = object;
|
|
this.index = index;
|
|
this.key = object.key;
|
|
this.modal.show();
|
|
|
|
if (this.object) {
|
|
let title = '';
|
|
if (this.object.key.length > 20) {
|
|
title = `${this.object.key.substr(0, 20)} ...`;
|
|
} else title = this.object.key;
|
|
this.infoTitle.textContent = title;
|
|
this.infoServiceName.textContent = this.object.service_name;
|
|
this.infoEditor.innerHTML = JSON.stringify(this.object.value, false, 4);
|
|
this.infoFooter.textContent = this.object.author;
|
|
this.infoDescription.textContent = this.object.description;
|
|
}
|
|
}
|
|
|
|
deleteApi = async (key) => {
|
|
await storageApi.remove(key);
|
|
this.key = null;
|
|
this.modal.hide();
|
|
this.next('deleteApi');
|
|
}
|
|
}
|
|
export default ApiInfoComponent;
|