From a9282a38e507e36bfde025a2583aec61c585a8d0 Mon Sep 17 00:00:00 2001
From: mrPadre <51297778+mrPadre@users.noreply.github.com>
Date: Wed, 29 Jul 2020 23:28:29 +0300
Subject: [PATCH] =?UTF-8?q?HM-70=20=D0=9E=D0=B6=D0=B8=D0=B2=D0=B8=D0=BB=20?=
=?UTF-8?q?=D0=BA=D0=BD=D0=BE=D0=BF=D0=BA=D1=83=20=D1=83=D0=B4=D0=B0=D0=BB?=
=?UTF-8?q?=D0=B5=D0=BD=D0=B8=D1=8F=20=D0=B0=D0=BF=D0=B8=20/=20=D0=B8?=
=?UTF-8?q?=D0=B7=D0=BC=D0=B5=D0=BD=D0=B8=D0=BB=20=D1=81=D0=BF=D0=BE=D1=81?=
=?UTF-8?q?=D0=BE=D0=B1=20=D0=BE=D1=82=D0=BA=D1=80=D1=8B=D1=82=D0=B8=D1=8F?=
=?UTF-8?q?=20=D0=B8=D0=BD=D1=84=D0=BE=D1=80=D0=BC=D0=B0=D1=86=D0=B8=D0=B8?=
=?UTF-8?q?=20=D0=BE=D0=B1=20=D0=B0=D0=BF=D0=B8=20=D0=BD=D0=B0=20=D0=B4?=
=?UTF-8?q?=D0=B0=D0=B1=D0=BB=D0=BA=D0=BB=D0=B8=D0=BA=20(#34)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app.css | 6 ++++++
src/app.html | 12 +++++++----
.../api-info-component/ApiInfoComponent.css | 10 ++++++++-
.../api-info-component/ApiInfoComponent.js | 20 +++++++++++++++++-
src/components/api-page/ApiPage.js | 21 +++++++++++++------
.../table-component/TableComponent.js | 10 ++-------
.../table-row-component/TableRowComponent.js | 4 ++--
7 files changed, 61 insertions(+), 22 deletions(-)
diff --git a/src/app.css b/src/app.css
index 022d579..1e8c2a7 100644
--- a/src/app.css
+++ b/src/app.css
@@ -15,3 +15,9 @@ textarea {
width: 0px;
background: transparent;
}
+
+button,
+button:active,
+button:focus {
+ outline: none;
+}
diff --git a/src/app.html b/src/app.html
index 945eca2..0e08db3 100644
--- a/src/app.html
+++ b/src/app.html
@@ -236,20 +236,24 @@
{
+ 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) {
@@ -34,10 +45,17 @@ class ApiInfoComponent extends Component {
} else title = this.object.key;
this.infoTitle.textContent = title;
this.infoServiceName.textContent = this.object.service_name;
- this.infoEditor.innerHTML = JSON.stringify(this.object.value);
+ 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;
diff --git a/src/components/api-page/ApiPage.js b/src/components/api-page/ApiPage.js
index a62492d..c2cae0c 100644
--- a/src/components/api-page/ApiPage.js
+++ b/src/components/api-page/ApiPage.js
@@ -2,21 +2,30 @@ import Component from '../component/index';
import TableComponent from '../table-component';
import storageApi from '../../api/StorageServiceAPI';
import FilterApiComponent from '../search-component/index';
+import ApiInfoComponent from '../api-info-component/index';
class ApiPage extends Component {
constructor (mainNodeSelector, parentNode) {
super(mainNodeSelector, parentNode);
this.filterBox = new FilterApiComponent(this.mainNode);
+ this.storageListTable = new TableComponent(this.mainNode);
+ this.infoBox = new ApiInfoComponent();
+ this.addSubscribe(this.storageListTable, 'showInfo', (obj) => {
+ this.infoBox.render(obj);
+ });
- const initStorageListTable = async () => {
- const list = await storageApi.request();
- const storageListTable = new TableComponent(this.mainNode);
- return storageListTable.render(list);
- };
+ this.initStorageListTable();
- initStorageListTable();
+ this.addSubscribe(this.infoBox, 'deleteApi', () => {
+ this.initStorageListTable();
+ });
}
+
+ initStorageListTable = async () => {
+ const list = await storageApi.request();
+ return this.storageListTable.render(list);
+ };
}
export default ApiPage;
diff --git a/src/components/table-component/TableComponent.js b/src/components/table-component/TableComponent.js
index 953f27a..0f2606e 100644
--- a/src/components/table-component/TableComponent.js
+++ b/src/components/table-component/TableComponent.js
@@ -1,5 +1,4 @@
import Component from '../component/index';
-import ApiInfoComponent from '../api-info-component/index';
import TableColumnComponent from '../table-column-component/index';
import TableRowComponent from '../table-row-component/TableRowComponent';
@@ -10,7 +9,6 @@ class TableComponent extends Component {
this.tableHead = this.mainNode.querySelector('.Table__head');
this.tableBody = this.mainNode.querySelector('.Table__body');
this.tableHeadRow = this.mainNode.querySelector('.Table__head-row');
- this.infoBox = new ApiInfoComponent();
this.columnArr = [];
this.rowArr = [];
}
@@ -34,8 +32,8 @@ class TableComponent extends Component {
this.array.forEach((item, index) => {
const newRow = new TableRowComponent(this.tableBody, item, index);
- newRow.subscribe('click', () => {
- this.showInfo(item, index);
+ newRow.subscribe('dblclick', () => {
+ this.next('showInfo', item);
});
this.rowArr.push(newRow);
});
@@ -45,10 +43,6 @@ class TableComponent extends Component {
this.array.sort((a, b) => a[item] > b[item]);
this.render(array);
}
-
- showInfo = (object, index) => {
- this.infoBox.render(object, index);
- }
}
export default TableComponent;
diff --git a/src/components/table-row-component/TableRowComponent.js b/src/components/table-row-component/TableRowComponent.js
index eaed742..1826578 100644
--- a/src/components/table-row-component/TableRowComponent.js
+++ b/src/components/table-row-component/TableRowComponent.js
@@ -21,8 +21,8 @@ class TableRowComponent extends Component {
this.row.appendChild(contentPlace);
});
- this.addEventListener(this.mainNode, 'click', (evt) => {
- this.next('click', evt);
+ this.addEventListener(this.mainNode, 'dblclick', (evt) => {
+ this.next('dblclick', evt);
});
}