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

PMCORE-2600

Browse Source
This commit is contained in:
Henry Jordan
2020-12-18 19:26:38 +00:00
parent 3711a438e1
commit 4cd3cc6dc5
7 changed files with 460 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
resources/assets/js/api/Cases.js
View File

@@ -12,36 +12,28 @@ export let cases = {
todo(data) {
return Api.get({
service: "TODO_LIST",
params: {
paged: data.paged
},
params: data,
keys: {}
});
},
draft(data) {
return Api.get({
service: "DRAFT_LIST",
params: {
paged: data.paged
},
params: data,
keys: {}
});
},
paused(data) {
return Api.get({
service: "PAUSED_LIST",
params: {
paged: data.paged
},
params: data,
keys: {}
});
},
unassigned(data) {
return Api.get({
service: "UNASSIGNED_LIST",
params: {
paged: data.paged
},
params: data,
keys: {}
});
},

314
resources/assets/js/components/search/CasesFilter.vue Normal file
View File

@@ -0,0 +1,314 @@
<template>
<div>
<SearchPopover
target="popover-target-1"
@savePopover="onOk"
:title="addSearchTitle"
>
<template v-slot:body>
<b-form-group>
<b-form-radio-group
v-model="selected"
:options="filterItems"
value-field="id"
text-field="optionLabel"
name="flavour-2a"
stacked
></b-form-radio-group>
</b-form-group>
</template>
</SearchPopover>
<div class="w-75 p-1">
<b-input-group class="w-100 p-1">
<div class="input-group mb-3">
<div class="input-group-prepend">
<span
class="input-group-text bg-primary-pm text-white"
id="popover-target-1"
@click="searchClickHandler"
>
<b-icon icon="search"></b-icon
></span>
</div>
<b-form-tags input-id="tags-pills" v-model="searchTags">
<template v-slot="{ tags, tagVariant, removeTag }">
<div class="d-inline-block" style="font-size: 1rem">
<b-form-tag
v-for="tag in tags"
@remove="customRemove(removeTag, tag)"
:key="tag"
:title="tag"
:variant="tagVariant"
class="mr-1 badge badge-light"
>
<div :id="tag">
<i class="fas fa-tags"></i>
{{ tagContent(tag) }}
</div>
<component
v-bind:is="tagComponent(tag)"
v-bind:info="tagInfo(tag)"
v-bind:tag="tag"
v-bind:filter="dataToFilter(tag)"
@updateSearchTag="updateSearchTag"
/>
</b-form-tag>
</div>
</template>
</b-form-tags>
</div>
</b-input-group>
</div>
</div>
</template>
<script>
import SearchPopover from "./popovers/SearchPopover.vue";
import CaseIntegerNumber from "./popovers/CaseIntegerNumber.vue";
import CaseTitle from "./popovers/CaseTitle.vue";
import ProcessName from "./popovers/ProcessName.vue";
import DateFilter from "./popovers/DateFilter.vue";
import TaskTitle from "./popovers/TaskTitle.vue";
import api from "./../../api/index";
export default {
name: "Cases",
props: ["filters"],
components: {
SearchPopover,
CaseIntegerNumber,
CaseTitle,
ProcessName,
DateFilter,
TaskTitle,
},
data() {
return {
searchLabel: this.$i18n.t("ID_SEARCH"),
addSearchTitle: this.$i18n.t("ID_ADD_SEARCH_FILTER_CRITERIA"),
searchTags: [],
filterItems: [
{
type: "CaseIntegerNumber",
id: "caseNumber",
title: `${this.$i18n.t("ID_FILTER")}: ${this.$i18n.t(
"ID_BY_CASE_NUMBER"
)}`,
optionLabel: this.$i18n.t("ID_BY_CASE_NUMBER"),
detail: this.$i18n.t("ID_PLEASE_SET_THE_CASE_NUMBER_TO_BE_SEARCHED"),
tagText: "",
tagPrefix: this.$i18n.t("ID_SEARCH_BY_CASE_NUMBER"),
items: [
{
id: "caseNumber",
value: "",
},
],
autoShow: true,
makeTagText: function (params, data) {
return `${params.tagPrefix}: ${data[0].value}`;
},
},
{
type: "CaseTitle",
id: "caseTitle",
title: `${this.$i18n.t("ID_FILTER")}: ${this.$i18n.t(
"ID_BY_CASE_TITLE"
)}`,
optionLabel: this.$i18n.t("ID_BY_CASE_TITLE"),
tagPrefix: this.$i18n.t("ID_SEARCH_BY_CASE_TITLE"),
detail: "",
tagText: "",
items: [
{
id: "caseTitle",
value: "",
},
],
autoShow: true,
makeTagText: function (params, data) {
return `${this.tagPrefix} ${data[0].value}`;
},
},
{
type: "ProcessName",
id: "processName",
title: `${this.$i18n.t("ID_FILTER")}: ${this.$i18n.t(
"ID_BY_PROCESS_NAME"
)}`,
optionLabel: this.$i18n.t("ID_BY_PROCESS_NAME"),
detail: "",
tagText: "",
tagPrefix: this.$i18n.t("ID_SEARCH_BY_PROCESS_NAME"),
autoShow: true,
items: [
{
id: "process",
value: "",
options: [],
placeholder: this.$i18n.t("ID_PROCESS_NAME"),
},
],
makeTagText: function (params, data) {
return `${this.tagPrefix} ${
(data[0].options && data[0].options.label) || ""
}`;
},
},
{
type: "TaskTitle",
id: "taskTitle",
title: `${this.$i18n.t("ID_FILTER")}: ${this.$i18n.t(
"ID_TASK_NAME"
)}`,
optionLabel: this.$i18n.t("ID_TASK"),
detail: "",
tagText: "",
tagPrefix: this.$i18n.t("ID_SEARCH_BY_TASK_NAME"),
autoShow: true,
items: [
{
id: "task",
value: "",
options: [],
placeholder: this.$i18n.t("ID_TASK_NAME"),
},
],
makeTagText: function (params, data) {
return `${this.tagPrefix}: ${data[0].label || ""}`;
},
},
],
selected: "",
itemModel: {},
};
},
watch: {
filters: function (filters) {
this.searchTags = [];
this.selected = "";
this.setFilters(filters);
},
},
methods: {
/**
* Add filter criteria save button handler
*/
onOk() {
let self = this,
element,
initialFilters = [],
item;
this.$root.$emit("bv::hide::popover");
element = _.find(this.filterItems, function (o) {
return o.id === self.selected;
});
if (element) {
_.forEach(element.items, function (value, key) {
item = {
filterVar: value.id,
fieldId: self.selected,
value: "",
label: "",
options: [],
};
initialFilters.push(item);
});
}
this.$emit("onUpdateFilters", { params: initialFilters, refresh: false });
},
/**
* Set Filters and make the tag labels
* @param {object} filters json to manage the query
*/
setFilters(filters) {
let self = this;
_.forEach(filters, function (item, key) {
let component = _.find(self.filterItems, function (o) {
return o.id === item.fieldId;
});
if (component) {
self.searchTags.push(component.id);
self.selected = component.id;
self.itemModel[component.id] = component;
}
});
},
dataToFilter(id) {
let data = [];
_.forEach(this.filters, function (item) {
if (item.fieldId === id) {
data.push(item);
}
});
return data;
},
/**
*
*/
tagContent(id) {
if (
this.itemModel[id] &&
typeof this.itemModel[id].makeTagText === "function"
) {
return this.itemModel[id].makeTagText(
this.itemModel[id],
this.dataToFilter(id)
);
}
return "";
},
tagComponent(id) {
if (this.itemModel[id]) {
return this.itemModel[id].type;
}
return null;
},
tagInfo(id) {
if (this.itemModel[id]) {
return this.itemModel[id];
}
return null;
},
/**
* Remove from tag button
* @param {function} removeTag - default callback
* @param {string} tag filter identifier
*/
customRemove(removeTag, tag) {
this.selected = "";
this.$emit("onUpdateFilters", { params: [], refresh: true });
},
/**
* Update the filter model this is fired from filter popaver save action
* @param {object} params - arrives the settings
* @param {string} tag filter identifier
*/
updateSearchTag(params) {
let temp = this.filters.concat(params);
temp = [...new Set([...this.filters, ...params])];
this.$emit("onUpdateFilters", { params: temp, refresh: true });
},
searchClickHandler() {
this.$root.$emit("bv::hide::popover");
},
},
};
</script>
<style scoped>
.bv-example-row .row + .row {
margin-top: 1rem;
}
.bv-example-row-flex-cols .row {
min-height: 10rem;
}
.bg-primary-pm {
background-color: #0099dd;
}
</style>

8
resources/assets/js/components/search/popovers/SearchPopover.vue
View File

@@ -20,9 +20,11 @@
</template>
<div>
<slot name="body"></slot>
<div class="v-popover-footer">
<div class="float-right">
<b-button @click="onClose" size="sm" variant="danger"> {{$t('ID_CANCEL')}}</b-button>
<b-button @click="onSave" size="sm" variant="primary">{{$t('ID_SAVE')}}</b-button>
<b-button @click="onSave" size="sm" variant="success">{{$t('ID_SAVE')}}</b-button>
</div>
</div>
</div>
</b-popover>
@@ -56,4 +58,8 @@ export default {
max-width: 650px !important;
min-width: 400px !important;
}
.v-popover-footer{
display: flow-root;
}
</style>

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

@@ -2,7 +2,11 @@
<div id="v-draft" ref="v-draft" class="v-container-draft">
<button-fleft :data="newCase"></button-fleft>
<modal-new-request ref="newRequest"></modal-new-request>
<CasesFilter
:filters="filters"
@onRemoveFilter="onRemoveFilter"
@onUpdateFilters="onUpdateFilters"
/>
<v-server-table
:data="tableData"
:columns="columns"
@@ -40,6 +44,7 @@
import HeaderCounter from "../components/home/HeaderCounter.vue";
import ButtonFleft from "../components/home/ButtonFleft.vue";
import ModalNewRequest from "./ModalNewRequest.vue";
import CasesFilter from "../components/search/CasesFilter";
import TaskCell from "../components/vuetable/TaskCell.vue";
import api from "./../api/index";
@@ -50,6 +55,7 @@ export default {
ButtonFleft,
ModalNewRequest,
TaskCell,
CasesFilter,
},
props: {},
data() {
@@ -71,7 +77,9 @@ export default {
"actions",
],
tableData: [],
filters: {},
options: {
filterable: false,
headings: {
case_number: this.$i18n.t("ID_MYCASE_NUMBER"),
case_title: this.$i18n.t("ID_CASE_TITLE"),
@@ -117,13 +125,20 @@ export default {
dt,
paged,
limit = data.limit,
start = data.page === 1 ? 0 : limit * (data.page - 1);
paged = start + ',' + limit;
start = data.page === 1 ? 0 : limit * (data.page - 1),
filters = {};
paged = start + "," + limit;
filters = {
paged: paged,
};
_.forIn(this.filters, function (item, key) {
filters[item.filterVar] = item.value;
});
return new Promise((resolutionFunc, rejectionFunc) => {
api.cases
.draft({
paged: paged
})
.draft(filters)
.then((response) => {
dt = that.formatDataResponse(response.data.data);
resolutionFunc({
@@ -225,11 +240,20 @@ export default {
DEL_INDEX: item.DEL_INDEX,
PRO_UID: item.PRO_UID,
TAS_UID: item.TAS_UID,
APP_NUMBER: item.CASE_NUMBER
APP_NUMBER: item.CASE_NUMBER,
});
that.$emit("onUpdatePage", "case-detail");
});
},
onRemoveFilter(data) {},
onUpdateFilters(data) {
this.filters = data.params;
if (data.refresh) {
this.$nextTick(() => {
this.$refs["vueTable"].getData();
});
}
},
},
};
</script>

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

@@ -2,7 +2,11 @@
<div id="v-paused" ref="v-paused" class="v-container-paused">
<button-fleft :data="newCase"></button-fleft>
<modal-new-request ref="newRequest"></modal-new-request>
<CasesFilter
:filters="filters"
@onRemoveFilter="onRemoveFilter"
@onUpdateFilters="onUpdateFilters"
/>
<v-server-table
:data="tableData"
:columns="columns"
@@ -61,6 +65,7 @@
import HeaderCounter from "../components/home/HeaderCounter.vue";
import ButtonFleft from "../components/home/ButtonFleft.vue";
import ModalNewRequest from "./ModalNewRequest.vue";
import CasesFilter from "../components/search/CasesFilter";
import TaskCell from "../components/vuetable/TaskCell.vue";
import ModalUnpauseCase from "./modal/ModalUnpauseCase.vue";
import api from "./../api/index";
@@ -73,6 +78,7 @@ export default {
ModalNewRequest,
TaskCell,
ModalUnpauseCase,
CasesFilter,
},
props: {},
data() {
@@ -97,7 +103,9 @@ export default {
"actions",
],
tableData: [],
filters: {},
options: {
filterable: false,
headings: {
case_number: this.$i18n.t("ID_MYCASE_NUMBER"),
case_title: this.$i18n.t("ID_CASE_TITLE"),
@@ -146,13 +154,20 @@ export default {
dt,
paged,
limit = data.limit,
start = data.page === 1 ? 0 : limit * (data.page - 1);
paged = start + ',' + limit;
start = data.page === 1 ? 0 : limit * (data.page - 1),
filters = {};
paged = start + "," + limit;
filters = {
paged: paged,
};
_.forIn(this.filters, function (item, key) {
filters[item.filterVar] = item.value;
});
return new Promise((resolutionFunc, rejectionFunc) => {
api.cases
.paused({
paged: paged
})
.paused(filters)
.then((response) => {
dt = that.formatDataResponse(response.data.data);
resolutionFunc({
@@ -239,7 +254,7 @@ export default {
DEL_INDEX: item.DEL_INDEX,
PRO_UID: item.PRO_UID,
TAS_UID: item.TAS_UID,
APP_NUMBER: item.CASE_NUMBER
APP_NUMBER: item.CASE_NUMBER,
});
that.$emit("onUpdatePage", "case-detail");
});
@@ -248,6 +263,15 @@ export default {
this.$refs["modal-unpause-case"].data = item;
this.$refs["modal-unpause-case"].show();
},
onRemoveFilter(data) {},
onUpdateFilters(data) {
this.filters = data.params;
if (data.refresh) {
this.$nextTick(() => {
this.$refs["vueTable"].getData();
});
}
},
},
};
</script>

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

@@ -2,7 +2,11 @@
<div id="v-todo" ref="v-todo" class="v-container-todo">
<button-fleft :data="newCase"></button-fleft>
<modal-new-request ref="newRequest"></modal-new-request>
<CasesFilter
:filters="filters"
@onRemoveFilter="onRemoveFilter"
@onUpdateFilters="onUpdateFilters"
/>
<v-server-table
:data="tableData"
:columns="columns"
@@ -58,6 +62,7 @@ import HeaderCounter from "../components/home/HeaderCounter.vue";
import ButtonFleft from "../components/home/ButtonFleft.vue";
import ModalNewRequest from "./ModalNewRequest.vue";
import TaskCell from "../components/vuetable/TaskCell.vue";
import CasesFilter from "../components/search/CasesFilter";
import api from "./../api/index";
export default {
@@ -67,8 +72,8 @@ export default {
ButtonFleft,
ModalNewRequest,
TaskCell,
CasesFilter,
},
props: {},
data() {
return {
newCase: {
@@ -91,7 +96,9 @@ export default {
"actions",
],
tableData: [],
filters: {},
options: {
filterable: false,
headings: {
case_number: this.$i18n.t("ID_MYCASE_NUMBER"),
case_title: this.$i18n.t("ID_CASE_TITLE"),
@@ -139,13 +146,20 @@ export default {
dt,
paged,
limit = data.limit,
start = data.page === 1 ? 0 : limit * (data.page - 1);
paged = start + ',' + limit;
start = data.page === 1 ? 0 : limit * (data.page - 1),
filters = {};
paged = start + "," + limit;
filters = {
paged: paged,
};
_.forIn(this.filters, function (item, key) {
filters[item.filterVar] = item.value;
});
return new Promise((resolutionFunc, rejectionFunc) => {
api.cases
.todo({
paged: paged
})
.todo(filters)
.then((response) => {
dt = that.formatDataResponse(response.data.data);
resolutionFunc({
@@ -247,11 +261,20 @@ export default {
DEL_INDEX: item.DEL_INDEX,
PRO_UID: item.PRO_UID,
TAS_UID: item.TAS_UID,
APP_NUMBER: item.CASE_NUMBER
APP_NUMBER: item.CASE_NUMBER,
});
that.$emit("onUpdatePage", "case-detail");
});
},
onRemoveFilter(data) {},
onUpdateFilters(data) {
this.filters = data.params;
if (data.refresh) {
this.$nextTick(() => {
this.$refs["vueTable"].getData();
});
}
},
},
};
</script>
@@ -262,4 +285,7 @@ export default {
padding-left: 50px;
padding-right: 50px;
}
.VueTables__limit {
display: none;
}
</style>

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

@@ -2,7 +2,11 @@
<div id="v-unassigned" ref="v-unassigned" class="v-container-unassigned">
<button-fleft :data="newCase"></button-fleft>
<modal-new-request ref="newRequest"></modal-new-request>
<CasesFilter
:filters="filters"
@onRemoveFilter="onRemoveFilter"
@onUpdateFilters="onUpdateFilters"
/>
<v-server-table
:data="tableData"
:columns="columns"
@@ -59,6 +63,7 @@ import HeaderCounter from "../components/home/HeaderCounter.vue";
import ButtonFleft from "../components/home/ButtonFleft.vue";
import ModalNewRequest from "./ModalNewRequest.vue";
import TaskCell from "../components/vuetable/TaskCell.vue";
import CasesFilter from "../components/search/CasesFilter";
import ModalClaimCase from "./modal/ModalClaimCase.vue";
import api from "./../api/index";
@@ -70,6 +75,7 @@ export default {
ModalNewRequest,
TaskCell,
ModalClaimCase,
CasesFilter,
},
props: {},
data() {
@@ -94,7 +100,9 @@ export default {
"actions",
],
tableData: [],
filters: {},
options: {
filterable: false,
headings: {
case_number: this.$i18n.t("ID_MYCASE_NUMBER"),
case_title: this.$i18n.t("ID_CASE_TITLE"),
@@ -143,13 +151,20 @@ export default {
dt,
paged,
limit = data.limit,
start = data.page === 1 ? 0 : limit * (data.page - 1);
paged = start + ',' + limit;
start = data.page === 1 ? 0 : limit * (data.page - 1),
filters = {};
paged = start + "," + limit;
filters = {
paged: paged,
};
_.forIn(this.filters, function (item, key) {
filters[item.filterVar] = item.value;
});
return new Promise((resolutionFunc, rejectionFunc) => {
api.cases
.unassigned({
paged: paged
})
.unassigned(filters)
.then((response) => {
dt = that.formatDataResponse(response.data.data);
resolutionFunc({
@@ -252,11 +267,20 @@ export default {
DEL_INDEX: item.DEL_INDEX,
PRO_UID: item.PRO_UID,
TAS_UID: item.TAS_UID,
APP_NUMBER: item.CASE_NUMBER
APP_NUMBER: item.CASE_NUMBER,
});
that.$emit("onUpdatePage", "case-detail");
});
},
onRemoveFilter(data) {},
onUpdateFilters(data) {
this.filters = data.params;
if (data.refresh) {
this.$nextTick(() => {
this.$refs["vueTable"].getData();
});
}
},
},
};
</script>