Skip to content

Commit 141ecdb

Browse files
committed
Update inbox rule filter selector
1 parent 0b0f2eb commit 141ecdb

8 files changed

Lines changed: 134 additions & 34 deletions

File tree

‎ProcessMaker/Http/Controllers/InboxRulesController.php‎

Lines changed: 25 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,10 +2,32 @@
22

33
namespace ProcessMaker\Http\Controllers;
44

5+
use Illuminate\Support\Facades\Auth;
6+
use ProcessMaker\Package\SavedSearch\Http\Controllers\SavedSearchController;
7+
use ProcessMaker\Package\SavedSearch\Models\SavedSearch;
8+
59
class InboxRulesController extends Controller
610
{
7-
public function index()
11+
public function index($request)
812
{
9-
return view('inbox-rules.index');
13+
// Get default Saved search config
14+
if (class_exists(SavedSearch::class)) {
15+
$defaultSavedSearch = SavedSearch::firstSystemSearchFor(
16+
Auth::user(),
17+
SavedSearch::KEY_TASKS,
18+
);
19+
if ($defaultSavedSearch) {
20+
$defaultColumns = SavedSearchController::adjustColumnsOf(
21+
$defaultSavedSearch->columns,
22+
SavedSearch::TYPE_TASK
23+
);
24+
} else {
25+
$defaultColumns = null;
26+
}
27+
} else {
28+
$defaultColumns = null;
29+
}
30+
31+
return view('inbox-rules.index', compact('defaultColumns'));
1032
}
11-
}
33+
}

‎resources/js/common/PMColumnFilterPopoverCommonMixin.js‎

Lines changed: 21 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { get, cloneDeep } from "lodash";
33
const PMColumnFilterCommonMixin = {
44
props: {
55
advancedFilterProp: {
6-
type: Array,
6+
type: Object,
77
default: null
88
}
99
},
@@ -16,16 +16,29 @@ const PMColumnFilterCommonMixin = {
1616
viewProcesses: []
1717
};
1818
},
19+
watch: {
20+
advancedFilterProp: {
21+
deep: true,
22+
handler() {
23+
this.getFilterConfiguration();
24+
this.fetch();
25+
}
26+
}
27+
},
1928
methods: {
2029
storeFilterConfiguration() {
30+
const { order, type } = this.filterConfiguration();
31+
2132
// If advanced filter was provided as a prop, do not save the filter
2233
// or overwrite the global advanced_filter, instead emit the filter.
2334
if (this.advancedFilterProp !== null) {
24-
this.$emit("advanced-filter", this.formattedFilter());
35+
this.$emit("advanced-filter-updated", {
36+
filters: this.formattedFilter(),
37+
order
38+
});
2539
return;
2640
}
2741

28-
const { order, type } = this.filterConfiguration();
2942
let url = "users/store_filter_configuration/";
3043
if (this.$props.columns && this.savedSearch) {
3144
url += "savedSearch|" + this.savedSearch;
@@ -273,7 +286,8 @@ const PMColumnFilterCommonMixin = {
273286
let order = null;
274287

275288
if (this.advancedFilterProp !== null) {
276-
inputAdvancedFilter = this.advancedFilterProp;
289+
inputAdvancedFilter = this.advancedFilterProp.filters;
290+
order = this.advancedFilterProp.order;
277291
} else {
278292
inputAdvancedFilter = get(window, 'ProcessMaker.advanced_filter.filters', []);
279293
order = get(window, 'ProcessMaker.advanced_filter.order');
@@ -292,7 +306,9 @@ const PMColumnFilterCommonMixin = {
292306
this.setOrderByProps(order.by, order.direction);
293307
}
294308

295-
this.markStyleWhenColumnSetAFilter();
309+
this.$nextTick(() => {
310+
this.markStyleWhenColumnSetAFilter();
311+
});
296312

297313
if (this.advancedFilterProp === null) {
298314
window.ProcessMaker.EventBus.$emit("advanced-filter-updated");

‎resources/js/common/advancedFilterStatusMixin.js‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import { get } from "lodash";
22

33
export default {
44
props: {
5-
inputAdvancedFilter: {
6-
type: Array,
5+
advancedFilterProp: {
6+
type: Object,
77
default: null
88
}
99
},
@@ -17,13 +17,16 @@ export default {
1717
window.ProcessMaker.EventBus.$on('advanced-filter-updated', this.setAdvancedFilter);
1818
},
1919
watch: {
20-
inputAdvancedFilter() {
21-
this.setAdvancedFilter();
20+
advancedFilterProp: {
21+
deep: true,
22+
handler() {
23+
this.setAdvancedFilter();
24+
}
2225
}
2326
},
2427
methods: {
2528
setAdvancedFilter() {
26-
this.advancedFilter = this.inputAdvancedFilter || get(window, 'ProcessMaker.advanced_filter.filters', []);
29+
this.advancedFilter = get(this.advancedFilterProp, 'filters') || get(window, 'ProcessMaker.advanced_filter.filters', []);
2730
},
2831
formatForBadge(filters, result) {
2932
for(const filter of filters) {

‎resources/js/components/shared/PmqlInput.vue‎

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@
3535
</div>
3636

3737
<div
38+
v-if="showSearchBar !== false"
3839
class="search-bar flex-grow w-100"
3940
:class="{ 'is-invalid': validations }"
4041
:style="styles?.container"
@@ -144,6 +145,7 @@
144145
</div>
145146
</div>
146147

148+
<div style="display: flex;">
147149
<div
148150
v-if="filterBadges.length > 0"
149151
class="selected-filters-bar d-flex pt-2"
@@ -175,6 +177,10 @@
175177
/>
176178
</span>
177179
</div>
180+
<div style="margin-left: auto">
181+
<slot name="right-of-badges" />
182+
</div>
183+
</div>
178184
</div>
179185
</div>
180186
</template>
@@ -215,6 +221,8 @@ export default {
215221
"paramName",
216222
"permission",
217223
"updateQuery",
224+
"showSearchBar",
225+
"showPmqlBadge",
218226
],
219227
data() {
220228
return {
@@ -243,8 +251,20 @@ export default {
243251
if (!this.showFilters) {
244252
return [];
245253
}
246-
return [...this.selectedFilters, ...this.formatAdvancedFilterForBadges];
254+
return [...this.pmqlBadge, ...this.selectedFilters, ...this.formatAdvancedFilterForBadges];
255+
},
256+
257+
pmqlBadge() {
258+
const result = [];
259+
if (this.value && this.showPmqlBadge === true) {
260+
result.push([
261+
'pmql',
262+
[{name: this.value, operator: '', advanced_filter: true}]
263+
]);
264+
}
265+
return result;
247266
},
267+
248268
showPmqlSection() {
249269
return (
250270
!this.hidePmqlSection

resources/js/inbox-rules/components/InboxRuleSavedSearch.vue renamed to resources/js/inbox-rules/components/InboxRuleFilters.vue

Lines changed: 46 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,18 @@
11
<template>
22
<div class="d-flex justify-content-center">
33
<b-card class="w-75">
4-
54
<div class="mb-3">
65
<pmql-input ref="pmql_input"
6+
:value="pmql"
77
search-type="tasks"
8-
:value="'foo'"
9-
v-model="pmql"
10-
:filters-value="'foo'"
118
:ai-enabled="false"
129
:show-filters="true"
1310
:aria-label="$t('Advanced Search (PMQL)')"
14-
:input-advanced-filter="savedSearchAdvancedFilter"
11+
:advanced-filter-prop="savedSearchAdvancedFilter"
12+
:show-search-bar="false"
13+
:show-pmql-badge="!!savedSearchId"
1514
>
16-
<template v-slot:right-buttons>
15+
<template v-slot:right-of-badges>
1716
<b-button class="ml-md-2" v-b-modal.columns>
1817
<i class="fas fw fa-cog"></i>
1918
</b-button>
@@ -22,11 +21,12 @@
2221
</div>
2322

2423
<tasks-list
25-
v-if="savedSearch"
24+
v-if="ready"
2625
ref="taskList"
2726
:pmql="pmql"
2827
:advanced-filter-prop="savedSearchAdvancedFilter"
29-
:saved-search="savedSearch.id"
28+
@advanced-filter-updated="savedSearchAdvancedFilter = $event"
29+
:saved-search="savedSearch?.id"
3030
:columns="columns"
3131
@submit=""
3232
>
@@ -54,6 +54,11 @@
5454
<script>
5555
import TasksList from "../../tasks/components/TasksList.vue";
5656
import ColumnChooserAdapter from "./ColumnChooserAdapter.vue";
57+
58+
const defaultFilter = {
59+
filters: [],
60+
order: { by: 'id', dir: 'desc' },
61+
};
5762
export default {
5863
props: {
5964
savedSearchId: {
@@ -74,25 +79,43 @@ export default {
7479
savedSearch: null,
7580
columns: [],
7681
defaultColumns: [],
82+
savedSearchAdvancedFilter: defaultFilter,
83+
ready: false,
7784
}
7885
},
7986
components: {
8087
TasksList,
8188
ColumnChooserAdapter,
8289
},
8390
methods: {
91+
emitSavedSearchData() {
92+
this.$emit('saved-search-data', {
93+
pmql: this.pmql,
94+
advanced_filter: this.savedSearchAdvancedFilter,
95+
});
96+
},
8497
applyColumns() {
8598
this.columns = this.$refs.columnChooserAdapter.currentColumns;
99+
this.savedSearchAdvancedFilter = _.cloneDeep(defaultFilter);
86100
},
87101
loadSavedSearch() {
88-
window.ProcessMaker.apiClient
102+
return window.ProcessMaker.apiClient
89103
.get("saved-searches/" + this.savedSearchId)
90104
.then(response => {
91105
this.savedSearch = response.data;
92106
this.columns = this.defaultColumns = response.data._adjusted_columns.filter(c => c.field !== 'is_priority');
107+
this.savedSearchAdvancedFilter = response.data.advanced_filter
93108
});
94109
}
95110
},
111+
watch: {
112+
savedSearchAdvancedFilter: {
113+
deep: true,
114+
handler() {
115+
this.emitSavedSearchData();
116+
}
117+
}
118+
},
96119
computed: {
97120
pmql() {
98121
@@ -113,12 +136,22 @@ export default {
113136
114137
return pmqls.join(' AND ');
115138
},
116-
savedSearchAdvancedFilter() {
117-
return this.savedSearch?.advanced_filter?.filters;
118-
}
119139
},
120140
mounted() {
121-
this.loadSavedSearch();
141+
if (this.savedSearchId) {
142+
143+
this.loadSavedSearch().then(() => {
144+
this.ready = true
145+
});
146+
147+
} else if (this.processId && this.elementId) {
148+
149+
this.columns = this.defaultColumns =
150+
_.get(window, 'Processmaker.defaultColumns', [])
151+
.filter(c => c.field !== 'is_priority');
152+
153+
this.ready = true;
154+
}
122155
}
123156
}
124157
</script>

‎resources/js/inbox-rules/index.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import Index from './components/Index.vue';
22
import Edit from './components/Edit.vue';
3-
import InboxRuleSavedSearch from './components/InboxRuleSavedSearch.vue';
3+
import InboxRuleFilters from './components/InboxRuleFilters.vue';
44

55
Vue.use(VueRouter);
66
const router = new VueRouter({
@@ -17,7 +17,7 @@ const router = new VueRouter({
1717
{
1818
name: "saved-search",
1919
path: "/saved-search",
20-
component: InboxRuleSavedSearch,
20+
component: InboxRuleFilters,
2121
props(route) {
2222
return {
2323
savedSearchId: parseInt(route.query.saved_search_id),

‎resources/js/tasks/components/TasksList.vue‎

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -235,7 +235,7 @@ export default {
235235
FilterTableBodyMixin],
236236
props: {
237237
filter: {},
238-
columns: {},
238+
columns: [],
239239
pmql: {},
240240
disableTooltip: {
241241
default: false
@@ -310,8 +310,11 @@ export default {
310310
},
311311
},
312312
watch: {
313-
columns() {
314-
this.setupColumns();
313+
columns: {
314+
deep: true,
315+
handler() {
316+
this.setupColumns();
317+
}
315318
},
316319
data(newData) {
317320
if (Array.isArray(newData.data) && newData.data.length > 0) {
@@ -377,8 +380,8 @@ export default {
377380
this.tableHeaders = this.getColumns();
378381
},
379382
getColumns() {
380-
if (this.$props.columns) {
381-
return this.$props.columns;
383+
if (this.columns && this.columns.length > 0) {
384+
return this.columns;
382385
}
383386
// from query string status=CLOSED
384387
const isStatusCompletedList = window.location.search.includes("status=CLOSED");

‎resources/views/inbox-rules/index.blade.php‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,9 @@
2020
@endsection
2121

2222
@section('js')
23+
<script>
24+
window.Processmaker.defaultColumns = @json($defaultColumns);
25+
</script>
2326
<script src="{{mix('js/inbox-rules/index.js')}}"></script>
2427
@endsection
2528

0 commit comments

Comments
 (0)