Merged in advanced-search (pull request #7585)

advanced search was added

Approved-by: Henry Jonathan Quispe Quispe
This commit is contained in:
Rodrigo Quelca
2020-12-07 12:36:04 +00:00
18 changed files with 1557 additions and 2 deletions

View File

@@ -1,5 +1,6 @@
import axios from "axios";
import headerData from "./../mocks/casesHeader.json";
import startedCasesFaker from "./../mocks/startedCasesFaker.js";
import Api from "./Api.js";
export let cases = {
@@ -32,6 +33,14 @@ export let cases = {
return axios.post(window.config.SYS_SERVER +
window.config.SYS_URI +
`cases/casesStartPage_Ajax.php`, params);
},
//remove this section
search(data) {
return new Promise((resolutionFunc, rejectionFunc) => {
resolutionFunc(startedCasesFaker);
});
}
};

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,83 @@
<template>
<div :class="`VueTables VueTables--${props.source}`" slot-scope="props">
<div :class="props.theme.row">
<div :class="props.theme.column">
<div v-if="!props.opts.filterByColumn && props.opts.filterable"
:class="`${props.theme.field} ${props.theme.inline} ${props.theme.left} VueTables__search`">
<vnodes :vnodes="props.slots.beforeFilter"/>
<vt-generic-filter ref="genericFilter"/>
<vnodes :vnodes="props.slots.afterFilter"/>
</div>
<vnodes :vnodes="props.slots.afterFilterWrapper"/>
<div v-if="props.perPageValues.length > 1 || props.opts.alwaysShowPerPageSelect"
:class="`${props.theme.field} ${props.theme.inline} ${props.theme.right} VueTables__limit`">
<vnodes :vnodes="props.slots.beforeLimit"/>
<vt-per-page-selector/>
<vnodes :vnodes="props.slots.afterLimit"/>
</div>
{{ props.generic}}
<GenericFilter @onSearch="onSearch" @onJumpCase="onJumpCase"/>
<div class="VueTables__pagination-wrapper" v-if="props.opts.pagination.dropdown && props.totalPages > 1">
<div :class="`${props.theme.field} ${props.theme.inline} ${props.theme.right} VueTables__dropdown-pagination`">
<vt-dropdown-pagination/>
</div>
</div>
<div v-if="props.opts.columnsDropdown"
:class="`VueTables__columns-dropdown-wrapper ${props.theme.right} ${props.theme.dropdown.container}`">
<vt-columns-dropdown/>
</div>
</div>
</div>
<vnodes :vnodes="props.slots.beforeTable"/>
<div class="table-responsive">
<vt-table ref="vt_table"/>
</div>
<vnodes :vnodes="props.slots.afterTable"/>
<vt-pagination/>
</div>
</template>
<script>
import VtColumnsDropdown from 'vue-tables-2/compiled/components/VtColumnsDropdown'
import VtDropdownPagination from 'vue-tables-2/compiled/components/VtDropdownPagination'
import VtGenericFilter from 'vue-tables-2/compiled/components/VtGenericFilter'
import VtPerPageSelector from 'vue-tables-2/compiled/components/VtPerPageSelector';
import VtPagination from 'vue-tables-2/compiled/components/VtPagination'
import VtTable from 'vue-tables-2/compiled/components/VtTable';
import GenericFilter from './GenericFilter'
export default {
name: "SearchDataTable",
props: ['props'],
components: {
VtGenericFilter,
VtPerPageSelector,
VtColumnsDropdown,
VtDropdownPagination,
VtTable,
VtPagination,
GenericFilter,
vnodes: {
functional: true,
render: (h, ctx) => ctx.props.vnodes
}
},
methods: {
onSearch(jsonFilter) {
this.$parent.$parent.$emit("onsearch", jsonFilter);
},
onJumpCase(params) {
this.$parent.$parent.$emit("onjumpcase", params);
}
}
}
</script>

View File

@@ -0,0 +1,77 @@
<template>
<div>
<SearchPopover
:target="tag"
@closePopover="onClose"
@savePopover="onOk"
>
<template v-slot:target-item>
<div @click="onClickTag(tag)" :id="tag">
<i class="fas fa-tags"></i>
{{ tagText }}
</div>
</template>
<template v-slot:body>
<div class="row">
<div class="col">
<input
v-model="from"
type="text"
size="210"
class="form-control"
placeholder="From Case number #"
/>
</div>
<div class="col">
<input
v-model="to"
type="text"
size="210"
class="form-control"
placeholder="To Case number # (Optional)"
/>
</div>
</div>
</template>
</SearchPopover>
</div>
</template>
<script>
import SearchPopover from "./SearchPopover.vue";
export default {
components: {
SearchPopover,
},
props: ["tag", "info"],
data() {
return {
from: "",
to: "",
};
},
computed: {
tagText: function() {
return `From: ${this.from} To: ${this.to}`;
},
},
methods: {
onClose() {},
onOk() {
this.$emit("updateSearchTag", { from: this.from, to: this.to });
},
onRemoveTag() {},
onClickTag(tag) {
this.$root.$emit("bv::hide::popover");
},
handler() {
},
},
};
</script>
<style scoped>
.popovercustom {
max-width: 650px !important;
}
</style>

View File

@@ -0,0 +1,64 @@
<template>
<div id="">
<SearchPopover
:target="tag"
@closePopover="onClose"
@savePopover="onOk"
>
<template v-slot:target-item>
<div @click="onClickTag(tag)" :id="tag">
<b-icon icon="tags-fill" font-scale="1"></b-icon>
{{ tagText }}
</div>
</template>
<template v-slot:body>
<h6>{{ info.title }}</h6>
<b-form-group :label="info.label">
<b-form-checkbox
v-for="option in info.options"
v-model="selected"
:key="option.value"
:value="option.value"
name="flavour-2a"
stacked
>
{{ option.text }}
</b-form-checkbox>
</b-form-group>
</template>
</SearchPopover>
</div>
</template>
|
<script>
import SearchPopover from "./SearchPopover.vue";
export default {
components: {
SearchPopover,
},
props: ["tag", "info"],
data() {
return {
selected: [], // Must be an array reference!
};
},
computed: {
tagText: function() {
return `Priority: `;
},
},
methods: {
onClose() {
},
onOk() {
},
onRemoveTag() {},
onClickTag(tag) {
this.$root.$emit("bv::hide::popover");
},
},
};
</script>
<style scoped></style>

View File

@@ -0,0 +1,64 @@
<template>
<div id="">
<SearchPopover
:target="tag"
@closePopover="onClose"
@savePopover="onOk"
>
<template v-slot:target-item>
<div @click="onClickTag(tag)" :id="tag">
<b-icon icon="tags-fill" font-scale="1"></b-icon>
{{ tagText }}
</div>
</template>
<template v-slot:body>
<h6>{{ info.title }}</h6>
<b-form-group :label="info.label">
<b-form-checkbox
v-for="option in info.options"
v-model="selected"
:key="option.value"
:value="option.value"
name="flavour-2a"
stacked
>
{{ option.text }}
</b-form-checkbox>
</b-form-group>
</template>
</SearchPopover>
</div>
</template>
|
<script>
import SearchPopover from "./SearchPopover.vue";
export default {
components: {
SearchPopover,
},
props: ["tag", "info"],
data() {
return {
selected: [], // Must be an array reference!
};
},
computed: {
tagText: function() {
return `Case Status: `;
},
},
methods: {
onClose() {
},
onOk() {
},
onRemoveTag() {},
onClickTag(tag) {
this.$root.$emit("bv::hide::popover");
},
},
};
</script>
<style scoped></style>

View File

@@ -0,0 +1,62 @@
<template>
<div id="">
<SearchPopover
:target="tag"
@closePopover="onClose"
@savePopover="onOk"
>
<template v-slot:target-item>
<div @click="onClickTag(tag)" :id="tag">
<b-icon icon="tags-fill" font-scale="1"></b-icon>
{{ tagText }}
</div>
</template>
<template v-slot:body>
<h6>Filter: Case Title</h6>
<input
v-model="title"
type="text"
size="150"
class="form-control"
placeholder="Case Title Name"
/>
</template>
</SearchPopover>
</div>
</template>
|
<script>
import SearchPopover from "./SearchPopover.vue";
export default {
components: {
SearchPopover,
},
props: ["tag", "info"],
data() {
return {
title: "",
};
},
computed: {
tagText: function() {
return `Case: ${this.title}`;
},
},
methods: {
onClose() {
},
onOk() {
this.$emit("updateSearchTag", {
columnSearch: "APP_TITLE",
search: this.title,
});
},
onRemoveTag() {},
onClickTag(tag) {
this.$root.$emit("bv::hide::popover");
},
},
};
</script>
<style scoped></style>

View File

@@ -0,0 +1,51 @@
<template>
<div id="">
<SearchPopover
:target="tag"
@closePopover="onClose"
@savePopover="onOk"
>
<template v-slot:target-item>
<div @click="onClickTag(tag)" :id="tag">
<b-icon icon="tags-fill" font-scale="1"></b-icon>
{{ info.tagText }}
</div>
</template>
<template v-slot:body>
<h6>Filter: Case Title</h6>
<input
type="text"
size="150"
class="form-control"
placeholder="Case Title Name"
/>
</template>
</SearchPopover>
</div>
</template>
<script>
import SearchPopover from "./SearchPopover.vue";
export default {
components: {
SearchPopover,
},
props: ["tag", "info"],
data() {
return {};
},
computed: {},
methods: {
onClose() {
},
onOk() {
},
onClickTag(tag) {
this.$root.$emit("bv::hide::popover");
},
},
};
</script>
<style scoped></style>

View File

@@ -0,0 +1,78 @@
<template>
<div id="">
<SearchPopover
:target="tag"
@closePopover="onClose"
@savePopover="onOk"
>
<template v-slot:target-item>
<div
@click="onClickTag(tag)"
:id="tag"
>
<b-icon
icon="tags-fill"
font-scale="1"
></b-icon>
{{
tagText
}}
</div>
</template>
<template v-slot:body>
<div class="row">
<div class="col">
<b-form-datepicker id="from" v-model="from" placeholder="From Due Date"></b-form-datepicker>
</div>
<div class="col">
<b-form-datepicker id="to" v-model="to" placeholder="To Due Date"></b-form-datepicker>
</div>
</div>
</template>
</SearchPopover>
</div>
</template>
<script>
import SearchPopover from "./SearchPopover.vue";
export default {
components: {
SearchPopover,
},
props: ['tag','info'],
data() {
return {
from: "",
to: ""
};
},
computed: {
tagText: function() {
return `From: ${this.from} To: ${this.to}`;
},
},
methods: {
onClose() {
// this.popoverShow = false;
// this.$emit("closePopover");
},
onOk() {
this.$emit("updateSearchTag", {
columnSearch: "APP_TITLE",
search: null,
dateFrom: this.from,
dateTo: this.to
});
},
onClickTag(tag) {
this.$root.$emit("bv::hide::popover");
}
},
};
</script>
<style scoped>
</style>

View File

@@ -0,0 +1,73 @@
<template>
<div id="">
<SearchPopover
:target="tag"
@closePopover="onClose"
@savePopover="onOk"
>
<template v-slot:target-item>
<div @click="onClickTag(tag)" :id="tag">
<b-icon icon="tags-fill" font-scale="1"></b-icon>
{{ tagText }}
</div>
</template>
<template v-slot:body>
<h6>Filter: Participated</h6>
<b-form-group
label="Please select the participation for the search"
>
<b-form-checkbox
v-for="option in options"
v-model="selected"
:key="option.value"
:value="option.value"
name="flavour-2a"
stacked
>
{{ option.text }}
</b-form-checkbox>
</b-form-group>
</template>
</SearchPopover>
</div>
</template>
|
<script>
import SearchPopover from "./SearchPopover.vue";
export default {
components: {
SearchPopover,
},
props: ["tag", "info"],
data() {
return {
selected: [], // Must be an array reference!
options: [
{ text: "Started By Me", value: "Started By Me" },
{ text: "Participated", value: "Participated" },
{ text: "Completed By Me", value: "Completed By Me" },
],
};
},
computed: {
tagText: function() {
return `Participated Level`;
},
},
methods: {
onClose() {},
onOk() {
this.$emit("updateSearchTag", {
columnSearch: "APP_TITLE",
search: this.title,
});
},
onRemoveTag() {},
onClickTag(tag) {
this.$root.$emit("bv::hide::popover");
},
},
};
</script>
<style scoped></style>

View File

@@ -0,0 +1,86 @@
<template>
<div id="">
<SearchPopover
:target="tag"
@closePopover="onClose"
@savePopover="onOk"
>
<template v-slot:target-item>
<div @click="onClickTag(tag)" :id="tag">
<b-icon icon="tags-fill" font-scale="1"></b-icon>
{{ tagText }}
</div>
</template>
<template v-slot:body>
<h6>Filter: Process</h6>
<vue-bootstrap-typeahead
class="mb-4"
v-model="query"
:data="process"
:serializer="(item) => item.PRO_TITLE"
@hit="selectedUser = $event"
placeholder="Search GitHub Users"
/>
</template>
</SearchPopover>
</div>
</template>
<script>
import SearchPopover from "./SearchPopover.vue";
import VueBootstrapTypeahead from "vue-bootstrap-typeahead";
// OR
export default {
components: {
SearchPopover,
VueBootstrapTypeahead,
},
props: ["tag", "info"],
data() {
return {
query: "",
process: [],
};
},
computed: {
ProcessMaker() {
return window.ProcessMaker;
},
tagText: function() {
return `Process: ${this.query}`;
},
},
watch: {
query(newQuery) {
ProcessMaker.apiClient
.post(
`http://localhost:350/sysworkflow/en/neoclassic/cases/casesList_Ajax?actionAjax=processListExtJs&action=search`,
{
query: this.query,
}
)
.then((response) => {
this.process = response.data;
})
.catch((err) => {
console.error(err);
});
},
},
methods: {
onClose() {},
onOk() {
this.$emit("updateSearchTag", {
columnSearch: "APP_TITLE",
process_label: this.query,
process: _.find(this.process, { PRO_TITLE: this.query }).PRO_ID,
});
},
onClickTag(tag) {
this.$root.$emit("bv::hide::popover");
},
},
};
</script>
<style scoped></style>

View File

@@ -0,0 +1,59 @@
<template>
<div>
<slot name="target-item">here component</slot>
<b-popover
:show.sync="popoverShow"
:target="target"
triggers="click"
placement="bottom"
class="popovercustom"
>
<template #title>
<b-button @click="onClose" class="close" aria-label="Close">
<span class="d-inline-block" aria-hidden="true"
>&times;</span
>
</b-button>
&nbsp;
</template>
<div>
<slot name="body">
popover body
</slot>
<div class="float-right">
<b-button @click="onClose" size="sm" variant="danger">Cancel</b-button>
<b-button @click="onSave" size="sm" variant="primary">Save</b-button>
</div>
</div>
</b-popover>
</div>
</template>
<script>
export default {
props: ['target'],
data() {
return {
popoverShow: false
};
},
methods: {
onClose() {
this.popoverShow = false;
this.$emit('closePopover');
},
onSave() {
this.$emit('savePopover');
this.onClose();
},
},
};
</script>
</script>
<style scoped>
.popover {
max-width: 650px !important;
min-width: 400px !important;
}
</style>

View File

@@ -0,0 +1,70 @@
<template>
<div id="">
<SearchPopover
:target="tag"
@closePopover="onClose"
@savePopover="onOk"
>
<template v-slot:target-item>
<div
@click="onClickTag(tag)"
:id="tag"
>
<b-icon
icon="tags-fill"
font-scale="1"
></b-icon>
{{
tagText
}}
</div>
</template>
<template v-slot:body>
<h6>{{ info.title }}</h6>
<input v-model="title" type="text" size="150" class="form-control" :placeholder="info.placeHolder">
</template>
</SearchPopover>
</div>
</template>
|
<script>
import SearchPopover from "./SearchPopover.vue";
export default {
components: {
SearchPopover,
},
props: ['tag','info'],
data() {
return {
title: ''
};
},
computed: {
tagText: function () {
return `Set By: `;
}
},
methods: {
onClose() {
},
onOk() {
this.$emit("updateSearchTag", {
columnSearch: "APP_TITLE",
search: this.title,
});
},
onRemoveTag() {
},
onClickTag(tag) {
this.$root.$emit("bv::hide::popover");
}
},
};
</script>
<style scoped>
</style>

View File

@@ -0,0 +1,3 @@
<template>
<div>Error</div>
</template>

View File

@@ -0,0 +1,22 @@
<template>
<div id='loading'></div>
</template>
<script>
export default {
name: "Loading"
};
</script>
<style lang="scss">
#loading {
position: fixed;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
z-index: 9999;
background: url(/images/gears.gif) 50% 50% no-repeat rgba(255, 255, 255, 1);
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -26,12 +26,14 @@ import MyDocuments from "./MyDocuments";
import BatchRouting from "./BatchRouting";
import XCase from "./XCase";
import TaskReassignments from "./TaskReassignments";
import AdvancedSearch from "./AdvancedSearch"
export default {
name: "Home",
components: {
CustomSidebar,
MyCases,
AdvancedSearch,
MyDocuments,
BatchRouting,
TaskReassignments,
@@ -78,10 +80,10 @@ export default {
/**
* Toggle sidebar handler
* @param {Boolean} collapsed - if sidebar is collapsed true|false
*
*
*/
onToggleCollapse(collapsed) {
this.collapsed = collapsed;
this.collapsed = collapsed;
},
},
};

View File

@@ -11,6 +11,7 @@
},
{
"href": "/advanced-search",
"id": "advanced-search",
"title": "Advanced Search",
"icon": "fas fa-search"
},