fernando/luos
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

PMCORE-3162:improvement to ellipsis component

Browse Source
This commit is contained in:
fabio
2021-07-13 09:03:40 -04:00
parent d4ad9210ef
commit b75aaaa403
5 changed files with 127 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

100
resources/assets/js/components/utils/ellipsis.vue
View File

@@ -5,48 +5,14 @@
class="v-inline"
v-show="showActions"
>
<div class="buttonGroup" @focus="hidebuttonsAction()">
<div class="buttonGroup">
<b-button
v-if="data.showClaim"
v-for="item in data.buttons"
:key="item.name"
variant="outline-info"
@click="claimCase"
@click="executeFunction(item.fn)"
>
<i class="fas fa-briefcase"></i>
</b-button>
<b-button
v-if="data.showOpen"
variant="outline-info"
@click="openCase"
>
<i class="far fa-edit"></i>
</b-button>
<b-button
v-show="data.showPlay"
variant="outline-info"
@click="unPauseCase"
>
<i class="far fa-play-circle"></i>
</b-button>
<b-button
v-show="data.showPause"
variant="outline-info"
@click="pauseCase"
>
<i class="far fa-pause-circle"></i>
</b-button>
<b-button
v-show="data.showReassign"
variant="outline-info"
@click="reassingCase"
>
<i class="fas fa-redo"></i>
</b-button>
<b-button
v-show="data.showNote"
variant="outline-info"
@click="openCaseNote"
>
<i class="far fa-comments"></i>
<i :class="item.icon"></i>
</b-button>
</div>
</div>
@@ -71,6 +37,14 @@ export default {
}
},
methods: {
/**
* Callback function from parent
*/
executeFunction(fn) {
if (fn) {
fn();
}
},
/**
* Show the action buttons by row
*/
@@ -95,54 +69,6 @@ export default {
this.$parent.$parent.$parent.$children[i].$el.style.opacity = 1
}
},
/**
* Call the event to reassign a case
*/
reassingCase() {
this.hideActionButtons();
console.log("Action Reassing Case");
console.log(this.data);
},
/**
* Call the event to open a case
*/
openCase() {
this.hideActionButtons();
console.log("Action Open Case");
console.log(this.data);
},
/**
* Call the event to unpause a case
*/
unPauseCase() {
this.hideActionButtons();
console.log("Action Unpause Case");
console.log(this.data);
},
/**
* Call the event to pause a case
*/
pauseCase() {
this.hideActionButtons();
console.log("Action Pause Case");
console.log(this.data);
},
/**
* Call the event to open case note
*/
openCaseNote() {
this.hideActionButtons();
console.log("Action Case Note");
console.log(this.data);
},
/**
* Call the event to claim a case
*/
claimCase() {
this.hideActionButtons();
console.log("Action Claim Case");
console.log(this.data);
}
}
}
</script>

51
resources/assets/js/home/Draft.vue
View File

@@ -123,7 +123,10 @@ export default {
"PAUSED": this.$i18n.t("ID_PAUSED"),
"UNASSIGNED": this.$i18n.t("ID_UNASSIGNED")
},
dataEllipsis: null,
dataEllipsis: {
buttons: {}
},
showEllipsis: false
};
},
created() {
@@ -131,7 +134,6 @@ export default {
},
mounted() {
this.openDefaultCase();
this.setDataEllipsis();
},
watch: {},
computed: {
@@ -329,33 +331,28 @@ export default {
this.$refs["vueTable"].getData();
},
/**
* set data by default in the ellipsis component
*/
setDataEllipsis() {
this.dataEllipsis = {
showNote: false,
showReassign: false,
showPause: false,
showPlay: false,
showOpen: false,
showClaim: false
}
},
/**
*
* Show options in the ellipsis
*/
updateDataEllipsis(data) {
this.dataEllipsis = {
APP_UID: data.APP_UID || "",
PRO_UID: data.PRO_UID || "",
showOpen: true,
showNote: true,
showPlay: false,
showReassign: false,
showPause: false,
showClaim: false
};
}
let that = this;
this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) {
this.dataEllipsis = {
buttons: {
open: {
name: "open",
icon: "far fa-edit",
fn: function() {console.log(data.APP_UID);}
},
note: {
name: "case note",
icon: "far fa-comments",
fn: function() {console.log("comments");}
},
}
}
}
},
},
};
</script>

56
resources/assets/js/home/Paused.vue
View File

@@ -142,7 +142,10 @@ export default {
"PAUSED": this.$i18n.t("ID_PAUSED"),
"UNASSIGNED": this.$i18n.t("ID_UNASSIGNED")
},
dataEllipsis: null,
dataEllipsis: {
buttons: {}
},
showEllipsis: false
};
},
created() {
@@ -151,7 +154,6 @@ export default {
mounted() {
// force to open case
this.openDefaultCase();
this.setDataEllipsis();
},
watch: {},
computed: {
@@ -360,33 +362,33 @@ export default {
this.$refs["vueTable"].getData();
},
/**
* set data by default in the ellipsis component
*/
setDataEllipsis() {
this.dataEllipsis = {
showNote: false,
showReassign: false,
showPause: false,
showPlay: false,
showOpen: false,
showClaim: false
}
},
/**
*
* Show options in the ellipsis
*/
updateDataEllipsis(data) {
this.dataEllipsis = {
APP_UID: data.APP_UID || "",
PRO_UID: data.PRO_UID || "",
showOpen: false,
showNote: true,
showPlay: true,
showReassign: true,
showPause: false,
showClaim: false
};
}
let that = this;
this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) {
this.dataEllipsis = {
buttons: {
note: {
name: "case note",
icon: "far fa-comments",
fn: function() {console.log("comments");}
},
play: {
name: "play case",
icon: "far fa-play-circle",
fn: function() {console.log("play case");}
},
reassign: {
name: "reassign case",
icon: "fas fa-redo",
fn: function() {console.log("reassign case");}
}
}
}
}
},
},
};
</script>

56
resources/assets/js/home/Todo.vue
View File

@@ -139,7 +139,10 @@ export default {
"PAUSED": this.$i18n.t("ID_PAUSED"),
"UNASSIGNED": this.$i18n.t("ID_UNASSIGNED")
},
dataEllipsis: null
dataEllipsis: {
buttons: {}
},
showEllipsis: false
};
},
created() {
@@ -148,7 +151,6 @@ export default {
mounted() {
// force to open case
this.openDefaultCase();
this.setDataEllipsis();
},
watch: {},
computed: {
@@ -354,33 +356,33 @@ export default {
this.$refs["vueTable"].getData();
},
/**
* set data by default in the ellipsis component
*/
setDataEllipsis() {
this.dataEllipsis = {
showNote: false,
showReassign: false,
showPause: false,
showPlay: false,
showOpen: false,
showClaim: false
}
},
/**
*
* Show options in the ellipsis
*/
updateDataEllipsis(data) {
this.dataEllipsis = {
APP_UID: data.APP_UID || "",
PRO_UID: data.PRO_UID || "",
showOpen: true,
showNote: true,
showPlay: false,
showReassign: true,
showPause: true,
showClaim: false
};
}
let that = this;
this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) {
this.dataEllipsis = {
buttons: {
open: {
name: "open",
icon: "far fa-edit",
fn: function() {console.log(data.APP_UID);}
},
note: {
name: "case note",
icon: "far fa-comments",
fn: function() {console.log("comments");}
},
pause: {
name: "pause case",
icon: "far fa-pause-circle",
fn: function() {console.log("pause case");}
}
}
}
}
},
},
};
</script>

52
resources/assets/js/home/Unassigned.vue
View File

@@ -140,12 +140,14 @@ export default {
"PAUSED": this.$i18n.t("ID_PAUSED"),
"UNASSIGNED": this.$i18n.t("ID_UNASSIGNED")
},
dataEllipsis: null,
dataEllipsis: {
buttons: {}
},
showEllipsis: false
};
},
mounted() {
this.initFilters();
this.setDataEllipsis();
},
watch: {},
computed: {
@@ -338,29 +340,39 @@ export default {
*/
setDataEllipsis() {
this.dataEllipsis = {
showNote: false,
showReassign: false,
showPause: false,
showPlay: false,
showOpen: false,
showClaim: false
showNote: true,
showPause: true,
showClaim: true
}
},
/**
*
* Show options in the ellipsis
*/
updateDataEllipsis(data) {
this.dataEllipsis = {
APP_UID: data.APP_UID || "",
PRO_UID: data.PRO_UID || "",
showOpen: false,
showNote: true,
showPlay: false,
showReassign: false,
showPause: true,
showClaim: true
};
}
let that = this;
this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) {
this.dataEllipsis = {
buttons: {
note: {
name: "case note",
icon: "far fa-comments",
fn: function() {console.log("comments");}
},
pause: {
name: "pause case",
icon: "far fa-pause-circle",
fn: function() {console.log("pause case");}
},
claim: {
name: "claim case",
icon: "fas fa-briefcase",
fn: function() {console.log("claim case");}
}
}
}
}
},
},
};
</script>