Merged in bugfix/PMCORE-3956 (pull request #8549)

PMCORE-3956

Approved-by: Rodrigo Quelca
This commit is contained in:
Fabio Guachalla
2022-09-01 15:24:25 +00:00
committed by Julio Cesar Laura Avendaño
9 changed files with 225 additions and 155 deletions

View File

@@ -12,9 +12,9 @@
ref="table" ref="table"
> >
<div slot="actions" slot-scope="props"> <div slot="actions" slot-scope="props">
<div @mouseover="updateDataEllipsis(props.row)"> <div @mouseenter="updateDataEllipsis(props.row)" @mouseleave="showEllipsis = false">
<ellipsis v-if="dataEllipsis" :data="dataEllipsis"> </ellipsis> <ellipsis v-if="dataEllipsis" :data="dataEllipsis" :ref="'ellipsis' + props.row.APP_UID"> </ellipsis>
</div> </div>
</div> </div>
<div slot="owner" slot-scope="props"> <div slot="owner" slot-scope="props">
<OwnerCell :data="props.row.owner" /> <OwnerCell :data="props.row.owner" />
@@ -279,42 +279,51 @@ export default {
updateDataEllipsis(data) { updateDataEllipsis(data) {
let that = this; let that = this;
this.showEllipsis = !this.showEllipsis; this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) { this.dataEllipsis = {
this.dataEllipsis = { buttons: {
buttons: { note: {
note: { name: "edit",
name: "edit", icon: "far fa-edit",
icon: "far fa-edit", fn: function() {
fn: function() { that.editCustomCaseList(data);
that.editCustomCaseList(data); }
} },
}, open: {
open: { name: "delete",
name: "delete", icon: "far fa-trash-alt",
icon: "far fa-trash-alt", color: "red",
color: "red", fn: function() {
fn: function() { that.showModalDelete(data);
that.showModalDelete(data); }
} },
}, reassign: {
reassign: { name: "download",
name: "download", icon: "fas fa-arrow-circle-down",
icon: "fas fa-arrow-circle-down", fn: function() {
fn: function() { that.downloadCaseList(data);
that.downloadCaseList(data); }
} },
}, preview: {
preview: { name: "preview",
name: "preview", icon: "fas fa-tv",
icon: "fas fa-tv", color: "green",
color: "green", fn: function() {
fn: function() { that.showPreview(data);
that.showPreview(data);
}
} }
} }
} }
} }
if (this.showEllipsis) {
for (let ellipsis in this.$refs) {
if (!ellipsis.indexOf('ellipsis')) {
if (ellipsis !== 'ellipsis' + data.APP_UID) {
this.$refs[ellipsis].hideActionButtons();
}
}
}
this.showEllipsis = false;
}
}, },
importCustomCaseList() { importCustomCaseList() {
this.$refs["modal-import"].show(); this.$refs["modal-import"].show();
@@ -323,6 +332,9 @@ export default {
}; };
</script> </script>
<style> <style>
.VueTables__row {
height: 75px;
}
.float-right { .float-right {
padding-left: 1.5%; padding-left: 1.5%;
} }

View File

@@ -1,5 +1,14 @@
<template> <template>
<div> <div>
<div
class="ellipsis-button align-middle"
v-show="!showActions"
@mouseover="showActionButtons"
>
<span>
<i class="fas fa-ellipsis-v"></i>
</span>
</div>
<div class="float-right" v-show="showActions"> <div class="float-right" v-show="showActions">
<transition name="fade"> <transition name="fade">
<div <div
@@ -21,15 +30,6 @@
</div> </div>
</transition> </transition>
</div> </div>
<div
class="ellipsis-button align-middle"
v-show="!showActions"
@mouseover="showActionButtons"
>
<span>
<i class="fas fa-ellipsis-v"></i>
</span>
</div>
</div> </div>
</template> </template>
@@ -124,6 +124,7 @@ export default {
z-index: 999; z-index: 999;
display: inline-flex !important; display: inline-flex !important;
opacity: 1 !important; opacity: 1 !important;
height: 50px !important;
} }
.btn-outline-info { .btn-outline-info {
border: none; border: none;

View File

@@ -662,6 +662,9 @@ export default {
}; };
</script> </script>
<style> <style>
.VueTables__row {
height: 75px;
}
.VuePagination__count { .VuePagination__count {
display: none; display: none;
} }

View File

@@ -128,10 +128,11 @@
slot="actions" slot="actions"
slot-scope="props" slot-scope="props"
> >
<div @mouseover="updateDataEllipsis(props.row)"> <div @mouseenter="updateDataEllipsis(props.row, view = true)" @mouseleave="showEllipsis = false">
<ellipsis <ellipsis
v-if="dataEllipsis" v-if="dataEllipsis"
:data="dataEllipsis" :data="dataEllipsis"
:ref="'ellipsis' + props.row.APP_UID"
> >
</ellipsis> </ellipsis>
</div> </div>
@@ -1151,10 +1152,18 @@ export default {
* Show options in the ellipsis * Show options in the ellipsis
* @param {objec} data * @param {objec} data
*/ */
updateDataEllipsis(data) { updateDataEllipsis(data, view = false) {
this.showEllipsis = !this.showEllipsis; this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) { this.dataEllipsis = this.ellipsisItemFactory(data, this.data.pageParent);
this.dataEllipsis = this.ellipsisItemFactory(data, this.data.pageParent); if (this.showEllipsis && view) {
for (let ellipsis in this.$refs) {
if (!ellipsis.indexOf('ellipsis')) {
if (ellipsis !== 'ellipsis' + data.APP_UID) {
this.$refs[ellipsis].hideActionButtons();
}
}
}
this.showEllipsis = false;
} }
}, },
/** /**
@@ -1334,6 +1343,9 @@ export default {
}; };
</script> </script>
<style> <style>
.VueTables__row {
height: 75px;
}
.v-container-todo { .v-container-todo {
padding-top: 20px; padding-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;

View File

@@ -96,8 +96,8 @@
slot="actions" slot="actions"
slot-scope="props" slot-scope="props"
> >
<div @mouseover="updateDataEllipsis(props.row)"> <div @mouseenter="updateDataEllipsis(props.row, view = true)" @mouseleave="showEllipsis = false">
<ellipsis v-if="dataEllipsis" :data="dataEllipsis"> </ellipsis> <ellipsis v-if="dataEllipsis" :data="dataEllipsis" :ref="'ellipsis' + props.row.APP_UID"> </ellipsis>
</div> </div>
</div> </div>
</v-server-table> </v-server-table>
@@ -806,28 +806,36 @@ export default {
* Show options in the ellipsis * Show options in the ellipsis
* @param {object} data * @param {object} data
*/ */
updateDataEllipsis(data) { updateDataEllipsis(data, view = false) {
let that = this; let that = this;
this.showEllipsis = !this.showEllipsis; this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) { this.dataEllipsis = {
this.dataEllipsis = { buttons: {
buttons: { open: {
open: { name: "open",
name: "open", icon: "far fa-edit",
icon: "far fa-edit", fn: function() {
fn: function() { that.openCase(data);
that.openCase(data); }
} },
}, note: {
note: { name: "case note",
name: "case note", icon: "far fa-comments",
icon: "far fa-comments", fn: function() {
fn: function() { that.openComments(data);
that.openComments(data); }
} },
}, }
}
if (this.showEllipsis && view) {
for (let ellipsis in this.$refs) {
if (!ellipsis.indexOf('ellipsis')) {
if (ellipsis !== 'ellipsis' + data.APP_UID) {
this.$refs[ellipsis].hideActionButtons();
}
} }
} }
this.showEllipsis = false;
} }
}, },
/** /**
@@ -884,6 +892,9 @@ export default {
}; };
</script> </script>
<style> <style>
.VueTables__row {
height: 75px;
}
.v-container-draft { .v-container-draft {
padding-top: 20px; padding-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;

View File

@@ -119,8 +119,8 @@
slot="actions" slot="actions"
slot-scope="props" slot-scope="props"
> >
<div @mouseover="updateDataEllipsis(props.row)"> <div @mouseenter="updateDataEllipsis(props.row, view = true)" @mouseleave="showEllipsis = false">
<ellipsis v-if="dataEllipsis" :data="dataEllipsis"> </ellipsis> <ellipsis v-if="dataEllipsis" :data="dataEllipsis" :ref="'ellipsis' + props.row.APP_UID"> </ellipsis>
</div> </div>
</div> </div>
</v-server-table> </v-server-table>
@@ -932,44 +932,52 @@ export default {
* Show options in the ellipsis * Show options in the ellipsis
* @param {objec} data * @param {objec} data
*/ */
updateDataEllipsis(data) { updateDataEllipsis(data, view = false) {
let that = this; let that = this;
this.showEllipsis = !this.showEllipsis; this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) { this.dataEllipsis = {
this.dataEllipsis = { buttons: {
buttons: { open: {
open: { name: "open",
name: "open", icon: "far fa-edit",
icon: "far fa-edit", fn: function() {
fn: function() { that.openCase(data)
that.openCase(data) }
} },
}, note: {
note: { name: "case note",
name: "case note", icon: "far fa-comments",
icon: "far fa-comments", fn: function() {
fn: function() { that.openComments(data);
that.openComments(data); }
} },
}, reassign: {
reassign: { name: "reassign case",
name: "reassign case", icon: "fas fa-undo",
icon: "fas fa-undo", fn: function() {
fn: function() { that.showModalReassign(data);
that.showModalReassign(data); }
} },
}, pause: {
pause: { name: "pause case",
name: "pause case", icon: "far fa-pause-circle",
icon: "far fa-pause-circle", fn: function() {
fn: function() { that.showModalPause(data);
that.showModalPause(data);
}
}
} }
} }
} }
}, }
if (this.showEllipsis && view) {
for (let ellipsis in this.$refs) {
if (!ellipsis.indexOf('ellipsis')) {
if (ellipsis !== 'ellipsis' + data.APP_UID) {
this.$refs[ellipsis].hideActionButtons();
}
}
}
this.showEllipsis = false;
}
},
/** /**
* Show the alert message * Show the alert message
* @param {string} message - message to be displayen in the body * @param {string} message - message to be displayen in the body
@@ -1024,6 +1032,9 @@ export default {
}; };
</script> </script>
<style> <style>
.VueTables__row {
height: 75px;
}
.v-container-todo { .v-container-todo {
padding-top: 20px; padding-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;

View File

@@ -796,15 +796,13 @@ export default {
}; };
</script> </script>
<style> <style>
.VueTables__row {
height: 75px;
}
.v-container-mycases { .v-container-mycases {
padding-top: 20px; padding-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;
padding-left: 50px; padding-left: 50px;
padding-right: 50px; padding-right: 50px;
} }
/*.btn-clear-sort {
position: fixed;
margin-top: 16px;
margin-left: -11px;
}*/
</style> </style>

View File

@@ -118,8 +118,8 @@
slot="actions" slot="actions"
slot-scope="props" slot-scope="props"
> >
<div @mouseover="updateDataEllipsis(props.row)"> <div @mouseenter="updateDataEllipsis(props.row, view = true)" @mouseleave="showEllipsis = false">
<ellipsis v-if="dataEllipsis" :data="dataEllipsis"> </ellipsis> <ellipsis v-if="dataEllipsis" :data="dataEllipsis" :ref="'ellipsis' + props.row.APP_UID"> </ellipsis>
</div> </div>
</div> </div>
</v-server-table> </v-server-table>
@@ -888,36 +888,44 @@ export default {
* Show options in the ellipsis * Show options in the ellipsis
* @param {object} data * @param {object} data
*/ */
updateDataEllipsis(data) { updateDataEllipsis(data, view = false) {
let that = this; let that = this;
this.showEllipsis = !this.showEllipsis; this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) { this.dataEllipsis = {
this.dataEllipsis = { buttons: {
buttons: { note: {
note: { name: "case note",
name: "case note", icon: "far fa-comments",
icon: "far fa-comments", fn: function() {
fn: function() { that.openComments(data);
that.openComments(data); }
} },
}, play: {
play: { name: "play case",
name: "play case", icon: "far fa-play-circle",
icon: "far fa-play-circle", fn: function() {
fn: function() { that.showModalUnpauseCase(data);
that.showModalUnpauseCase(data); }
} },
}, reassign: {
reassign: { name: "reassign case",
name: "reassign case", icon: "fas fa-undo",
icon: "fas fa-undo", fn: function() {
fn: function() { that.showModalReassign(data);
that.showModalReassign(data);
}
} }
} }
} }
} }
if (this.showEllipsis && view) {
for (let ellipsis in this.$refs) {
if (!ellipsis.indexOf('ellipsis')) {
if (ellipsis !== 'ellipsis' + data.APP_UID) {
this.$refs[ellipsis].hideActionButtons();
}
}
}
this.showEllipsis = false;
}
}, },
/** /**
* Show the alert message * Show the alert message
@@ -973,6 +981,9 @@ export default {
}; };
</script> </script>
<style> <style>
.VueTables__row {
height: 75px;
}
.v-container-paused { .v-container-paused {
padding-top: 20px; padding-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;

View File

@@ -107,8 +107,8 @@
slot="actions" slot="actions"
slot-scope="props" slot-scope="props"
> >
<div @mouseover="updateDataEllipsis(props.row)"> <div @mouseenter="updateDataEllipsis(props.row, view = true)" @mouseleave="showEllipsis = false">
<ellipsis v-if="dataEllipsis" :data="dataEllipsis"> </ellipsis> <ellipsis v-if="dataEllipsis" :data="dataEllipsis" :ref="'ellipsis' + props.row.APP_UID"> </ellipsis>
</div> </div>
</div> </div>
</v-server-table> </v-server-table>
@@ -879,29 +879,37 @@ export default {
* Show options in the ellipsis * Show options in the ellipsis
* @param {object} data * @param {object} data
*/ */
updateDataEllipsis(data) { updateDataEllipsis(data, view = false) {
let that = this; let that = this;
this.showEllipsis = !this.showEllipsis; this.showEllipsis = !this.showEllipsis;
if (this.showEllipsis) { this.dataEllipsis = {
this.dataEllipsis = { buttons: {
buttons: { note: {
note: { name: "case note",
name: "case note", icon: "far fa-comments",
icon: "far fa-comments", fn: function() {
fn: function() { that.openComments(data);
that.openComments(data); }
} },
}, claim: {
claim: { name: "claim case",
name: "claim case", icon: "fas fa-briefcase",
icon: "fas fa-briefcase", fn: function() {
fn: function() { that.claimCase(data);
that.claimCase(data);
}
} }
} }
} }
} }
if (this.showEllipsis && view) {
for (let ellipsis in this.$refs) {
if (!ellipsis.indexOf('ellipsis')) {
if (ellipsis !== 'ellipsis' + data.APP_UID) {
this.$refs[ellipsis].hideActionButtons();
}
}
}
this.showEllipsis = false;
}
}, },
/** /**
* Show the alert message * Show the alert message
@@ -957,6 +965,9 @@ export default {
}; };
</script> </script>
<style> <style>
.VueTables__row {
height: 75px;
}
.v-container-unassigned { .v-container-unassigned {
padding-top: 20px; padding-top: 20px;
padding-bottom: 20px; padding-bottom: 20px;