Vuejs Framework v1.0.

A. CRUD Components
a) Read - get the id of the data and fetch all its details via ajax request. Usage of a modal is a
must.
b) Create - Create a vue template for forms to be used in creating a data. Usage of a modal is
a must.
c) Update - Update button must be in the Read modal. Clicking the update button will change
the following read view to a form with input fields and default values.
d) Delete - Must be in the Read modal. Clicking it will delete the current data.
Note: Update and Delete functions can only be available if the transaction is in the created approval status.

B. Event Triggering
a) Onclick = v-on:click or @click
b) Onchange = v-on:change or @change
c) Onkeyup = v-on:keyup or @keyup
d) Onsubmit = v-on:submit or @submit
e) Onscroll = v-on:scroll or @scroll

C. AJAX Requests
a) GET
i.
axios.get("/read")
.then((response) => {
this.loading = false;
this.items = response.data;
}, (error) => {
this.loading = false;
})
.catch(error => {
if (error.response.status === 422) {
this.errors = error.response.data.errors || {};
}
});
b) POST
i.
var formData = $(‘form’).serialize();
axios.post("/create", formData)
.then((response) => {
this.loading = false;
this.items = response.data;
}, (error) => {
this.loading = false;
})
.catch(error => {
if (error.response.status === 422) {
this.errors = error.response.data.errors || {};
}
});