Commit 53b1d3f5 authored by Geovanny's avatar Geovanny

Added delete unit and some styling

parent 98732fb4
...@@ -12,6 +12,7 @@ class MyUnitsController{ ...@@ -12,6 +12,7 @@ class MyUnitsController{
this.view.addEventListener("row_click", (event) => this.changeUnitDetail(event.detail)); this.view.addEventListener("row_click", (event) => this.changeUnitDetail(event.detail));
this.view.addEventListener("add_unit", (event) => this.addUnit(event.detail)); this.view.addEventListener("add_unit", (event) => this.addUnit(event.detail));
this.view.addEventListener("modify_unit", (event) => this.modifyUnit(event.detail)); this.view.addEventListener("modify_unit", (event) => this.modifyUnit(event.detail));
this.view.addEventListener("delete_unit", (event) => this.deleteUnit(event.detail));
this.getMyUnits(); this.getMyUnits();
} }
...@@ -23,18 +24,29 @@ class MyUnitsController{ ...@@ -23,18 +24,29 @@ class MyUnitsController{
this.view.unitAdded(); this.view.unitAdded();
}catch(error){ }catch(error){
console.log(error); console.log(error);
alert('Insertion to update') alert('Failed to Insert')
} }
} }
async modifyUnit(data){ async modifyUnit(data){
try{ try{
await this.sync.modifyUnit(data); await this.sync.modifyUnit(data);
alert('Update Successful') alert('Update Successful');
this.view.unitModified(); this.view.unitsModified();
}catch(error){ }catch(error){
console.log(error); console.log(error);
alert('Failed to update') alert('Failed to Update')
}
}
async deleteUnit(id){
try{
await this.sync.deleteUnit(id);
alert('Delete Successful');
this.view.unitsModified();
}catch(error){
console.log(error);
alert('Failed to Delete')
} }
} }
......
...@@ -7,16 +7,25 @@ class UnitDetailView extends EventTarget{ ...@@ -7,16 +7,25 @@ class UnitDetailView extends EventTarget{
this.element = document.querySelector("unit-detail"); this.element = document.querySelector("unit-detail");
this.fields = { this.fields = {
img : this.element.querySelector(".unit-img"), img : this.element.querySelector(".unit_img"),
name : this.element.querySelector(".unit-name"), name : this.element.querySelector(".unit_name"),
level_input : this.element.querySelector("#level-input"), level_input : this.element.querySelector("#level_input"),
elite_input : this.element.querySelector("#elite-ckb"), elite_input : this.element.querySelector("#elite_ckb"),
button : this.element.querySelector(".unit-button") delete_button : this.element.querySelector(".delete_button"),
modify_button : this.element.querySelector(".modify_button"),
add_button : this.element.querySelector(".add_button"),
} }
this.disableInput() this.disableInput()
this.fields.button.addEventListener("click", (event) =>{ this.toggleTabs(true);
this.dispatchEvent(new CustomEvent("submit_detail", {detail: this.unit})) this.fields.delete_button.addEventListener("click", (event) =>{
this.dispatchEvent(new CustomEvent("delete_unit", {detail: this.unit.id}));
});
this.fields.modify_button.addEventListener("click", (event) =>{
this.dispatchEvent(new CustomEvent("modify_unit", {detail: this.unit}));
});
this.fields.add_button.addEventListener("click", (event) =>{
this.dispatchEvent(new CustomEvent("add_unit", {detail: this.unit}));
}); });
this.fields.level_input.addEventListener("input", () =>{ this.fields.level_input.addEventListener("input", () =>{
this.unit.unit_level = this.fields.level_input.value; this.unit.unit_level = this.fields.level_input.value;
...@@ -26,6 +35,19 @@ class UnitDetailView extends EventTarget{ ...@@ -26,6 +35,19 @@ class UnitDetailView extends EventTarget{
}) })
} }
toggleTabs(flg){
if(flg){
this.fields.delete_button.style.display = "";
this.fields.modify_button.style.display = "";
this.fields.add_button.style.display = "none";
}else{
this.fields.delete_button.style.display = "none";
this.fields.modify_button.style.display = "none";
this.fields.add_button.style.display = "";
}
this.clean();
}
changeUnit(unit){ changeUnit(unit){
this.unit = unit; this.unit = unit;
if(!this.unit){ if(!this.unit){
...@@ -50,17 +72,22 @@ class UnitDetailView extends EventTarget{ ...@@ -50,17 +72,22 @@ class UnitDetailView extends EventTarget{
this.fields.name.innerText = "---"; this.fields.name.innerText = "---";
this.fields.level_input.value = 0; this.fields.level_input.value = 0;
this.fields.elite_input.checked = false; this.fields.elite_input.checked = false;
this.unit = {};
} }
enableInput(){ enableInput(){
this.fields.level_input.disabled = false; this.fields.level_input.disabled = false;
this.fields.elite_input.disabled = false; this.fields.elite_input.disabled = false;
this.fields.button.disabled = false; this.fields.delete_button.disabled = false;
this.fields.modify_button.disabled = false;
this.fields.add_button.disabled = false;
} }
disableInput(){ disableInput(){
this.fields.level_input.disabled = true; this.fields.level_input.disabled = true;
this.fields.elite_input.disabled = true; this.fields.elite_input.disabled = true;
this.fields.button.disabled = true; this.fields.delete_button.disabled = true;
this.fields.modify_button.disabled = true;
this.fields.add_button.disabled = true;
} }
} }
......
...@@ -21,21 +21,23 @@ ...@@ -21,21 +21,23 @@
<button id="my_units" class="tablinks active">My Units</button> <button id="my_units" class="tablinks active">My Units</button>
<button id="add_units" class="tablinks">Units to Add</button> <button id="add_units" class="tablinks">Units to Add</button>
</div> </div>
<table id="units-table" class="display" style="max-width: 500px;"></table> <table id="units_table" class="display" style="max-width: 500px;"></table>
</table-wrapper> </table-wrapper>
<unit-detail> <unit-detail>
<image class="unit-img"></image> <image class="unit_img"></image>
<div class="unit-name"> <div class="unit_name">
--- ---
</div> </div>
<div class="unit-level"> <div class="unit_level">
<p>Unit Level:</p> <p>Unit Level:</p>
<input id="level-input" type="number"/> <input id="level_input" type="number"/>
<p>Elite:</p> <p>Elite:</p>
<input id="elite-ckb" type="checkbox"/> <input id="elite_ckb" type="checkbox"/>
</div> </div>
<div class="unit-button"> <div class="unit_button">
<button class="unit-button">Submit</button> <button class="delete_button">Delete</button>
<button class="modify_button">Update</button>
<button class="add_button">Add</button>
</div> </div>
</unit-detail> </unit-detail>
</table-component> </table-component>
......
...@@ -27,7 +27,7 @@ class Sync{ ...@@ -27,7 +27,7 @@ class Sync{
headers: { headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json'
} }
}) });
} }
async modifyUnit(data){ async modifyUnit(data){
...@@ -37,7 +37,13 @@ class Sync{ ...@@ -37,7 +37,13 @@ class Sync{
headers: { headers: {
'Content-Type': 'application/json' 'Content-Type': 'application/json'
} }
}) });
}
async deleteUnit(id){
const response = await fetch(`/api/user/unit/${id}`, {
method: "DELETE",
});
} }
} }
......
...@@ -39,21 +39,23 @@ class MyUnitView extends EventTarget{ ...@@ -39,21 +39,23 @@ class MyUnitView extends EventTarget{
this.my_units_add.addEventListener("click", (event) =>{ this.my_units_add.addEventListener("click", (event) =>{
this.changeTab(event.currentTarget); this.changeTab(event.currentTarget);
this.dispatchEvent(new CustomEvent("unit_tab_change")) this.dispatchEvent(new CustomEvent("unit_tab_change"))
}) });
this.add_units.addEventListener("click", () =>{ this.add_units.addEventListener("click", () =>{
this.changeTab(event.currentTarget); this.changeTab(event.currentTarget);
this.dispatchEvent(new CustomEvent("add_tab_change")) this.dispatchEvent(new CustomEvent("add_tab_change"))
}) });
this.unit_table_view.addEventListener("row_click", (event) =>{ this.unit_table_view.addEventListener("row_click", (event) =>{
this.dispatchEvent(new CustomEvent("row_click", {detail: event.detail})); this.dispatchEvent(new CustomEvent("row_click", {detail: event.detail}));
}) });
this.unit_detail_view.addEventListener("submit_detail", (event) =>{ this.unit_detail_view.addEventListener("delete_unit", (event) =>{
if(this.my_units_tab){ this.dispatchEvent(new CustomEvent("delete_unit", {detail: event.detail}));
this.dispatchEvent(new CustomEvent("modify_unit", {detail: event.detail})); });
}else{ this.unit_detail_view.addEventListener("modify_unit", (event) =>{
this.dispatchEvent(new CustomEvent("add_unit", {detail: event.detail})); this.dispatchEvent(new CustomEvent("modify_unit", {detail: event.detail}));
} });
}) this.unit_detail_view.addEventListener("add_unit", (event) =>{
this.dispatchEvent(new CustomEvent("add_unit", {detail: event.detail}));
});
} }
changeTab(tab){ changeTab(tab){
...@@ -64,6 +66,7 @@ class MyUnitView extends EventTarget{ ...@@ -64,6 +66,7 @@ class MyUnitView extends EventTarget{
tablinks[i].className = tablinks[i].className.replace(" active", ""); tablinks[i].className = tablinks[i].className.replace(" active", "");
} }
this.my_units_tab = !this.my_units_tab; this.my_units_tab = !this.my_units_tab;
this.unit_detail_view.toggleTabs(this.my_units_tab);
tab.className += " active"; tab.className += " active";
} }
...@@ -80,7 +83,7 @@ class MyUnitView extends EventTarget{ ...@@ -80,7 +83,7 @@ class MyUnitView extends EventTarget{
this.dispatchEvent(new CustomEvent("add_tab_change")) this.dispatchEvent(new CustomEvent("add_tab_change"))
} }
unitModified(){ unitsModified(){
this.dispatchEvent(new CustomEvent("unit_tab_change")) this.dispatchEvent(new CustomEvent("unit_tab_change"))
} }
} }
......
#units-table{ #units_table{
color: whitesmoke; color: whitesmoke;
text-align: center; text-align: center;
...@@ -37,7 +37,7 @@ table.dataTable.display tbody tr.even{ ...@@ -37,7 +37,7 @@ table.dataTable.display tbody tr.even{
border: 1px black solid; border: 1px black solid;
} }
table-component{ table_component{
margin-top: 50px; margin-top: 50px;
grid-area: content; grid-area: content;
...@@ -47,7 +47,7 @@ table-component{ ...@@ -47,7 +47,7 @@ table-component{
; ;
} }
table-wrapper{ table_wrapper{
grid-area: table; grid-area: table;
width: 100%; width: 100%;
display: inline-block; display: inline-block;
...@@ -69,17 +69,18 @@ unit-detail{ ...@@ -69,17 +69,18 @@ unit-detail{
padding-top: 20px; padding-top: 20px;
} }
.unit-img{ .unit_img{
width: 300px; width: 300px;
height: 400px; height: 400px;
background-color: white; background-color: rgb(184, 184, 184);
border: 2px solid rgb(83, 83, 83);
} }
.unit-name{ .unit_name{
padding-top: 10px; padding-top: 10px;
font-size: 25px; font-size: 25px;
display: block; display: block;
} }
.unit-level{ .unit_level{
height: 50px; height: 50px;
display: block; display: block;
p{ p{
...@@ -87,13 +88,30 @@ unit-detail{ ...@@ -87,13 +88,30 @@ unit-detail{
display: inline; display: inline;
} }
} }
.unit-elite{ .unit_elite{
display: inline-block; display: inline-block;
} }
.unit-button{ .unit_button{
display: inline; display: inline;
button{ button{
left:50%; left:50%;
height: 30px;
width: 60px;
background-color: grey;
border-radius: 3px;
color: whitesmoke;
text-align: center; text-align: center;
} }
}
.add_button{
background-color: green !important;
border: 2px solid rgb(3, 102, 20);
}
.modify_button{
background-color: rgb(53, 53, 255) !important;
border: 2px solid rgb(4, 4, 124);
}
.delete_button{
background-color: red !important;
border: 2px solid rgb(83, 3, 3);
} }
\ No newline at end of file
...@@ -213,7 +213,7 @@ center-div { ...@@ -213,7 +213,7 @@ center-div {
font-size: 20px; font-size: 20px;
} }
#units-table { #units_table {
color: whitesmoke; color: whitesmoke;
text-align: center; text-align: center;
} }
...@@ -251,13 +251,13 @@ table.dataTable.display tbody tr.even .sorting_1 { ...@@ -251,13 +251,13 @@ table.dataTable.display tbody tr.even .sorting_1 {
border: 1px black solid; border: 1px black solid;
} }
table-component { table_component {
margin-top: 50px; margin-top: 50px;
grid-area: content; grid-area: content;
grid-template: "table details"/1fr 200px; grid-template: "table details"/1fr 200px;
} }
table-wrapper { table_wrapper {
grid-area: table; grid-area: table;
width: 100%; width: 100%;
display: inline-block; display: inline-block;
...@@ -279,39 +279,60 @@ unit-detail { ...@@ -279,39 +279,60 @@ unit-detail {
padding-top: 20px; padding-top: 20px;
} }
.unit-img { .unit_img {
width: 300px; width: 300px;
height: 400px; height: 400px;
background-color: white; background-color: #b8b8b8;
border: 2px solid #535353;
} }
.unit-name { .unit_name {
padding-top: 10px; padding-top: 10px;
font-size: 25px; font-size: 25px;
display: block; display: block;
} }
.unit-level { .unit_level {
height: 50px; height: 50px;
display: block; display: block;
} }
.unit-level p { .unit_level p {
font-size: 15px; font-size: 15px;
display: inline; display: inline;
} }
.unit-elite { .unit_elite {
display: inline-block; display: inline-block;
} }
.unit-button { .unit_button {
display: inline; display: inline;
} }
.unit-button button { .unit_button button {
left: 50%; left: 50%;
height: 30px;
width: 60px;
background-color: grey;
border-radius: 3px;
color: whitesmoke;
text-align: center; text-align: center;
} }
.add_button {
background-color: green !important;
border: 2px solid #036614;
}
.modify_button {
background-color: #3535ff !important;
border: 2px solid #04047c;
}
.delete_button {
background-color: red !important;
border: 2px solid #530303;
}
body { body {
font-family: monospace; font-family: monospace;
background-color: #313131; background-color: #313131;
......
{"version":3,"sourceRoot":"","sources":["../fontawesome/font_awesome.scss","../sass/navbar.scss","../sass/login.scss","../sass/unit.scss","../sass/main.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAmBF;EACI;IAAK;;EACP;IAAO;;;AC1CX;EACI;EACA;EACA;EACA,eACI;EAGJ;EACA;;;AAGJ;EAGI;EACA;EACA;;AACA;EACI;EACA;EAEA;EACA;;;AAIR;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;;AAEJ;EACI;;;AAKJ;EACI;;;AAIR;EACI;EACA;EACA;;AACA;EACI;EACA;;;AAIR;EACI;;;AAKA;EACI;;AAEJ;EACI;;;ACvGR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EAEA;EACA;EACA;;AACA;EACI;EACA;;;AAIN;AACF;EACI;EAEA;EACA;EACA;EACA;EACA;;;AAGF;AACF;EACI;;;AAGF;AACF;EACI;;;AAGF;AACF;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EACI;AAA0B;;;AAG9B;AACA;EACI;IAAM;;EACN;IAAI;;;AAGN;EACE;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;;ACnFJ;EACI;EACA;;;AAGJ;EACI;;;AAEJ;EACI;;AAEA;EACI;;;AAKR;EACI;;AACA;EACI;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;EAEA,eACI;;;AAKR;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;;AACA;EACI;EACA;;;AAGR;EACI;;;AAEJ;EACI;;AACA;EACI;EACA;;;AC3FR;EACI;EACA;EACA;EACA;EACA,eACI;;;AAKR;EACI;EACA;;;AAGJ;EACI;EACA;;AACA;EACI","file":"main.css"} {"version":3,"sourceRoot":"","sources":["../fontawesome/font_awesome.scss","../sass/navbar.scss","../sass/login.scss","../sass/unit.scss","../sass/main.scss"],"names":[],"mappings":"AAAA;EACI;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAmBF;EACI;IAAK;;EACP;IAAO;;;AC1CX;EACI;EACA;EACA;EACA,eACI;EAGJ;EACA;;;AAGJ;EAGI;EACA;EACA;;AACA;EACI;EACA;EAEA;EACA;;;AAIR;EACI;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;EACA;EACA;EACA;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI;EACA;;AAEJ;EACI;;;AAKJ;EACI;;;AAIR;EACI;EACA;EACA;;AACA;EACI;EACA;;;AAIR;EACI;;;AAKA;EACI;;AAEJ;EACI;;;ACvGR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EAEA;EACA;EACA;;AACA;EACI;EACA;;;AAIN;AACF;EACI;EAEA;EACA;EACA;EACA;EACA;;;AAGF;AACF;EACI;;;AAGF;AACF;EACI;;;AAGF;AACF;EACI;EACA;EACA;EACA;EACA;;;AAGJ;EACI;AAA0B;;;AAG9B;AACA;EACI;IAAM;;EACN;IAAI;;;AAGN;EACE;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;;ACnFJ;EACI;EACA;;;AAGJ;EACI;;;AAEJ;EACI;;AAEA;EACI;;;AAKR;EACI;;AACA;EACI;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;EAEA,eACI;;;AAKR;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;;AACA;EACI;EACA;;;AAGR;EACI;;;AAEJ;EACI;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGR;EACI;EACA;;;AAEJ;EACI;EACA;;;AAEJ;EACI;EACA;;;AC9GJ;EACI;EACA;EACA;EACA;EACA,eACI;;;AAKR;EACI;EACA;;;AAGJ;EACI;EACA;;AACA;EACI","file":"main.css"}
\ No newline at end of file \ No newline at end of file
#units-table { #units_table {
color: whitesmoke; color: whitesmoke;
text-align: center; text-align: center;
} }
...@@ -36,13 +36,13 @@ table.dataTable.display tbody tr.even .sorting_1 { ...@@ -36,13 +36,13 @@ table.dataTable.display tbody tr.even .sorting_1 {
border: 1px black solid; border: 1px black solid;
} }
table-component { table_component {
margin-top: 50px; margin-top: 50px;
grid-area: content; grid-area: content;
grid-template: "table details"/1fr 200px; grid-template: "table details"/1fr 200px;
} }
table-wrapper { table_wrapper {
grid-area: table; grid-area: table;
width: 100%; width: 100%;
display: inline-block; display: inline-block;
...@@ -64,37 +64,58 @@ unit-detail { ...@@ -64,37 +64,58 @@ unit-detail {
padding-top: 20px; padding-top: 20px;
} }
.unit-img { .unit_img {
width: 300px; width: 300px;
height: 400px; height: 400px;
background-color: white; background-color: #b8b8b8;
border: 2px solid #535353;
} }
.unit-name { .unit_name {
padding-top: 10px; padding-top: 10px;
font-size: 25px; font-size: 25px;
display: block; display: block;
} }
.unit-level { .unit_level {
height: 50px; height: 50px;
display: block; display: block;
} }
.unit-level p { .unit_level p {
font-size: 15px; font-size: 15px;
display: inline; display: inline;
} }
.unit-elite { .unit_elite {
display: inline-block; display: inline-block;
} }
.unit-button { .unit_button {
display: inline; display: inline;
} }
.unit-button button { .unit_button button {
left: 50%; left: 50%;
height: 30px;
width: 60px;
background-color: grey;
border-radius: 3px;
color: whitesmoke;
text-align: center; text-align: center;
} }
.add_button {
background-color: green !important;
border: 2px solid #036614;
}
.modify_button {
background-color: #3535ff !important;
border: 2px solid #04047c;
}
.delete_button {
background-color: red !important;
border: 2px solid #530303;
}
/*# sourceMappingURL=unit.css.map */ /*# sourceMappingURL=unit.css.map */
{"version":3,"sourceRoot":"","sources":["../sass/unit.scss"],"names":[],"mappings":"AACA;EACI;EACA;;;AAGJ;EACI;;;AAEJ;EACI;;AAEA;EACI;;;AAKR;EACI;;AACA;EACI;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;EAEA,eACI;;;AAKR;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;;AACA;EACI;EACA;;;AAGR;EACI;;;AAEJ;EACI;;AACA;EACI;EACA","file":"unit.css"} {"version":3,"sourceRoot":"","sources":["../sass/unit.scss"],"names":[],"mappings":"AACA;EACI;EACA;;;AAGJ;EACI;;;AAEJ;EACI;;AAEA;EACI;;;AAKR;EACI;;AACA;EACI;;;AAGR;EACI;;;AAGJ;EACI;EACA;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;EAEA,eACI;;;AAKR;EACI;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;;;AAEJ;EACI;EACA;;AACA;EACI;EACA;;;AAGR;EACI;;;AAEJ;EACI;;AACA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGR;EACI;EACA;;;AAEJ;EACI;EACA;;;AAEJ;EACI;EACA","file":"unit.css"}
\ No newline at end of file \ No newline at end of file
...@@ -27,13 +27,13 @@ class UnitTableView extends EventTarget{ ...@@ -27,13 +27,13 @@ class UnitTableView extends EventTarget{
super(); super();
this.columns = columns ? columns : default_columns; this.columns = columns ? columns : default_columns;
this.table = $("#units-table") this.table = $("#units_table")
this.datatable = this.table.DataTable({ this.datatable = this.table.DataTable({
columns: this.columns columns: this.columns
}); });
const datatable = this.datatable; const datatable = this.datatable;
const view = this; const view = this;
$("#units-table tbody").on("click", "tr", function(){ $("#units_table tbody").on("click", "tr", function(){
const index = datatable.row(this).index(); const index = datatable.row(this).index();
view.dispatchEvent(new CustomEvent("row_click", {detail: index})); view.dispatchEvent(new CustomEvent("row_click", {detail: index}));
}) })
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment