Commit 5e349451 authored by MARCO Jonathan's avatar MARCO Jonathan
Browse files

Can filter to value and to display by

Ref di/vue-formbuilder#66
parent 3e08375e
......@@ -160,8 +160,6 @@ export default Vue.extend({
return undefined;
},
getDateOrTimeFormat(dateOrTime: string): string {
console.log(this.field);
if (!dateOrTime) return dateOrTime;
if (this.field.type === 'time') {
......
......@@ -102,6 +102,7 @@
:headers="optionsTableHeaders"
:items="fieldOptions"
:search="searchOption"
:custom-filter="customFilter"
>
<template v-slot:item.label="{ item }">
<v-edit-dialog :return-value="item.label">
......@@ -189,10 +190,11 @@
import { UsfTabDataInputDisplayedBySelect } from '../UsfTabDataInputDisplayedBySelect';
import { mapActions } from 'vuex';
import Vue from 'vue';
import { Field } from '../../../../../../../types/models/form';
import { Field, Option } from '#form-plugin/models/form';
import UsfTabDataInputSelectImportOptions
from '../UsfTabDataInputSelectImportOptions/UsfTabDataInputSelectImportOptions.vue';
import { Control } from '#form-plugin/models/control';
import { DataTableHeader } from 'vuetify';
export default Vue.extend({
name: 'UsfTabDataInput',
......@@ -275,8 +277,8 @@ export default Vue.extend({
fieldOptions() {
return this.field.options.map(optionId => this.$store.getters['form/getOptionByIdOrValue'](optionId));
},
optionsTableHeaders() {
const optionsTableHeaders = [
optionsTableHeaders(): DataTableHeader[] {
const optionsTableHeaders: DataTableHeader[] = [
{
text: this._uct('builder.tabs.data.dataTable.headers.label'),
value: 'label',
......@@ -308,7 +310,6 @@ export default Vue.extend({
text: this._uct('builder.tabs.data.dataTable.headers.displayBy'),
value: 'displayedBy',
sortable: false,
filterable: false,
});
}
return optionsTableHeaders;
......@@ -330,6 +331,21 @@ export default Vue.extend({
this.newOption = Object.assign({}, this.newOptionDefault);
}, 300);
},
customFilter(itemLabel: string, search: string | null, item: Option): boolean {
if (search === null) return true;
if (item.displayedBy !== undefined && item.displayedBy.length) {
return itemLabel.includes(search) || item.displayedBy.some((optionId) => {
const option: Option | undefined = this.getOption(optionId);
if (option) {
return optionId.includes(search) || option.label.includes(search);
}
return false;
});
}
return itemLabel.includes(search)
},
getOption(id) {
return this.$store.getters['form/getOptionByIdOrValue'](id);
},
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment