diff --git a/resources/assets/js/pages/settings/admin-marking-setting.vue b/resources/assets/js/pages/settings/admin-marking-setting.vue index f763fa6a..07bccc2d 100644 --- a/resources/assets/js/pages/settings/admin-marking-setting.vue +++ b/resources/assets/js/pages/settings/admin-marking-setting.vue @@ -1,20 +1,75 @@ @@ -40,11 +95,21 @@ trigger: 'change' }] }, + tableData: [], + EditDatadialogVisible: false, + DeleteAdddialogVisible: false, + AddDatadialogVisible: false, + DoneAddDatadialogVisible: false, + DoneUpdateDatadialogVisible: false, + currentEdit : -1, } }, + mounted(){ + this.UpdateTableData(); + }, methods: { - CreateMarking : function(formName){ - + CreateMarking : function(formName){ + this.AddDatadialogVisible = false; this.$refs[formName].validate((valid) => { if (valid) { axios.post('/api/setting-marking', this.markingForm) @@ -57,6 +122,7 @@ duration: 5000 }); this.ClearMarkingForm(); + this.UpdateTableData(); }) .catch((error) => { this.loading_btn = false @@ -68,6 +134,7 @@ duration: 10000 }); this.ClearMarkingForm(); + this.UpdateTableData(); }); } else{ @@ -78,16 +145,76 @@ duration: 10000 }); } - }); - - + }); }, ClearMarkingForm : function(){ this.markingForm.marking = ''; this.markingForm.email = ''; }, - }, - + UpdateTableData : function(){ + axios.get('/api/setting-marking', this.markingForm) + .then((response) => { + this.tableData = response.data; + }) + .catch((error) => { + console.log(error); + this.$message({ + showClose: true, + message: 'Fetch data fail', + type: 'error', + duration: 10000 + }); + }) + }, + DeleteMarking : function(marking_id){ + this.DeleteAdddialogVisible = true; + console.log(marking_id); + axios.delete('/api/setting-marking/' + marking_id) + .then((response) => { + console.log('123fuck'); + this.UpdateTableData(); + }) + .catch((error) => { + console.log(error); + this.$message({ + showClose: true, + message: 'Delete data fail', + type: 'error', + duration: 10000 + }); + }); + }, + EditMarking : function(){ + this.EditDatadialogVisible = false; + this.DoneUpdateDatadialogVisible = true; + axios.put('/api/setting-marking/' + this.currentEdit, this.markingForm) + .then((response) => { + this.UpdateTableData(); + }) + .catch((error) => { + console.log(error); + this.$message({ + showClose: true, + message: 'Update Fail', + type: 'error', + duration: 10000 + }); + }); + }, + PopOutAddMarking : function(){ + this.AddDatadialogVisible = true; + this.ClearMarkingForm(); + }, + PopOutEditMarking : function(tableDataRow){ + this.EditDatadialogVisible = true; + this.FillupMarkingForm(tableDataRow); + this.currentEdit = this.tableData[tableDataRow].id; + }, + FillupMarkingForm : function(tableDataRow){ + this.markingForm.marking = this.tableData[tableDataRow].marking; + this.markingForm.email = this.tableData[tableDataRow].email; + } + }, }