shows a menu when right clicking a profil update request in the hr view

This commit is contained in:
SimonGschnell
2024-02-05 15:33:51 +01:00
parent ff88581ecd
commit f47650f5e9
2 changed files with 77 additions and 25 deletions
+67 -14
View File
@@ -11,6 +11,59 @@ const app = Vue.createApp({
return {
showAll: false,
profil_updates_table_options: {
rowContextMenu: (e, component)=>{
let menu =[];
if(component.getData().status === "pending"){
menu.push(
{
label:"<i class='fa fa-check'></i> Accept Request",
action:(e, column)=>{
Vue.$fhcapi.ProfilUpdate.acceptProfilRequest(column.getData()).then((res) => {
this.$refs.UpdatesTable.tabulator.setData();
});
}
},
{
separator:true,
},
{
label:" <i style='width:16px' class='text-center fa fa-xmark'></i> Deny Request",
action:(e, column)=>{
Vue.$fhcapi.ProfilUpdate.denyProfilRequest(column.getData()).then((res) => {
this.$refs.UpdatesTable.tabulator.setData();
});
}
},
{
separator:true,
},
{
label:"<i class='fa fa-eye'></i> Show Request",
action:(e, column)=>{
this.showModal(column.getData());
}
}
);
}else{
menu.push(
{
label:"<i class='fa fa-eye'></i> Show Request",
action:(e, column)=>{
this.showModal(column.getData());
}
}
)
}
return menu;
} ,
ajaxURL:FHC_JS_DATA_STORAGE_OBJECT.app_root +
FHC_JS_DATA_STORAGE_OBJECT.ci_router +
`/Cis/ProfilUpdate/`,
@@ -66,8 +119,6 @@ const app = Vue.createApp({
hozAlign: "center",
headerFilter: true,
formatter: function (cell, para) {
let res = Object.getPrototypeOf(cell);
//console.log(res);
switch (cell.getValue()) {
case "pending":
@@ -95,20 +146,9 @@ const app = Vue.createApp({
hozAlign: "center",
cellClick: (e, cell) => {
//! function that is called when clicking on a row in the table
let cellData = cell.getRow().getData();
this.showModal(cellData);
AcceptDenyUpdate.popup({ value: cellData })
.then((res) => {
console.log("res of the modal: ", res);
//? refetches the data, if any request was denied or accepted
//* setData will call the ajaxURL again to refresh the data
this.$refs.UpdatesTable.tabulator.setData();
})
.catch((e) => {
//? catches the rejected Promise if the result of the modal was falsy
console.log("catch of the modal: ", e);
});
},
//responsive:0,
},
@@ -130,6 +170,19 @@ const app = Vue.createApp({
}
},
methods: {
showModal: function(value){
AcceptDenyUpdate.popup({ value: value })
.then((res) => {
console.log("res of the modal: ", res);
//? refetches the data, if any request was denied or accepted
//* setData will call the ajaxURL again to refresh the data
this.$refs.UpdatesTable.tabulator.setData();
})
.catch((e) => {
//? catches the rejected Promise if the result of the modal was falsy
console.log("catch of the modal: ", e);
});
},
updateData: function(event){
this.$refs.UpdatesTable.tabulator.setData();
@@ -49,18 +49,14 @@ export default {
},
acceptRequest: function () {
Vue.$fhcapi.ProfilUpdate.acceptProfilRequest(this.data).then((res) => {
console.log("res", res);
console.log("res.data", res.data);
this.result = true;
});
this.hide();
},
denyRequest: function () {
console.log(this.data.profil_update_id);
Vue.$fhcapi.ProfilUpdate.denyProfilRequest(this.data).then((res) => {
console.log("res", res);
console.log("res.data", res.data);
this.result = true;
});
this.hide();
@@ -129,14 +125,14 @@ export default {
-->
<div class="row">
<div class="form-underline mb-2 col">
<div class="form-underline mb-2 col-12 col-sm-6">
<div class="form-underline-titel">Status: </div>
<span class="form-underline-content" >{{data.status}}</span>
</div>
<div class="form-underline mb-2 col">
<div v-if="data.status!=='pending'" class="form-underline mb-2 col-12 col-sm-6">
<div class="form-underline-titel">Date of Status: </div>
<!-- only status timestamp and status message can be null in the database -->
<span class="form-underline-content" >{{data.status_timestamp?data.status_timestamp:'-'}}</span>
@@ -144,16 +140,19 @@ export default {
<div class="form-underline mb-2 col">
<div class="form-underline mb-2 col-12 col-sm-6">
<div class="form-underline-titel">UserID: </div>
<span class="form-underline-content" >{{data.uid}}</span>
</div>
<div class="form-underline mb-2 col-12 col-sm-6">
<div class="form-underline-titel">Name: </div>
<span class="form-underline-content" >{{data.name}}</span>
</div>
<div class="form-underline mb-2 col">
<div class="form-underline mb-2 col-12 col-sm-6">
<div class="form-underline-titel">Topic of Request: </div>
<span class="form-underline-content" >{{data.topic}}</span>
@@ -162,7 +161,7 @@ export default {
<div class="form-underline mb-2 col">
<div class="form-underline mb-2 col-12 col-sm-6">
<div class="form-underline-titel">Date of Request:</div>
<span class="form-underline-content" >{{data.insertamum}}</span>