Beta of segments

UI is not React-based
Segments functionality extended to allow hierarchical rules, negation and more comparisons (regexp).
Added enumerations (see #217)
This commit is contained in:
Tomas Bures 2017-08-19 15:58:23 +02:00
parent f3ff89c536
commit 42338b0afa
3 changed files with 29 additions and 27 deletions

View file

@ -951,6 +951,8 @@ function withForm(target) {
const formState = previousState.formState.withMutations(mutState => { const formState = previousState.formState.withMutations(mutState => {
mutState.update('data', stateData => stateData.withMutations(mutStateData => { mutState.update('data', stateData => stateData.withMutations(mutStateData => {
mutStateData.setIn([key, 'value'], value);
if (typeof onChangeBeforeValidationCallback === 'object') { if (typeof onChangeBeforeValidationCallback === 'object') {
if (onChangeBeforeValidationCallback[key]) { if (onChangeBeforeValidationCallback[key]) {
onChangeBeforeValidationCallback[key](mutStateData, key, oldValue, value); onChangeBeforeValidationCallback[key](mutStateData, key, oldValue, value);
@ -958,8 +960,6 @@ function withForm(target) {
} else { } else {
onChangeBeforeValidationCallback(mutStateData, key, oldValue, value); onChangeBeforeValidationCallback(mutStateData, key, oldValue, value);
} }
mutStateData.setIn([key, 'value'], value);
})); }));
validateFormState(this, mutState); validateFormState(this, mutState);

View file

@ -109,10 +109,10 @@ export default class CUD extends Component {
populateRuleDefaults(mutState) { populateRuleDefaults(mutState) {
const ruleHelpers = this.ruleHelpers; const ruleHelpers = this.ruleHelpers;
const type = mutState.getIn(['data','type','value']); const type = mutState.getIn(['type','value']);
if (!ruleHelpers.isCompositeRuleType(type)) { if (!ruleHelpers.isCompositeRuleType(type)) {
const column = mutState.getIn(['data', 'column', 'value']); const column = mutState.getIn(['column', 'value']);
if (column) { if (column) {
const colType = ruleHelpers.getColumnType(column); const colType = ruleHelpers.getColumnType(column);
@ -121,7 +121,7 @@ export default class CUD extends Component {
const settings = ruleHelpers.primitiveRuleTypes[colType][type]; const settings = ruleHelpers.primitiveRuleTypes[colType][type];
if (!settings) { if (!settings) {
// The existing rule type does not fit the newly changed column. This resets the rule type chooser to "-- Select ---" // The existing rule type does not fit the newly changed column. This resets the rule type chooser to "-- Select ---"
mutState.setIn(['data', 'type', 'value'], ''); mutState.setIn(['type', 'value'], '');
} }
} }
} }

View file

@ -253,43 +253,43 @@ export function getRuleHelpers(t, fields) {
}; };
const birthdayValueSettings = { const birthdayValueSettings = {
form: <DatePicker id="value" label={t('Date')} birthday />, form: <DatePicker id="birthday" label={t('Date')} birthday />,
getFormData: rule => ({ getFormData: rule => ({
value: formatBirthday(DateFormat.INTL, rule.value) birthday: formatBirthday(DateFormat.INTL, rule.value)
}), }),
assignRuleSettings: (rule, getter) => { assignRuleSettings: (rule, getter) => {
rule.value = parseBirthday(DateFormat.INTL, getter('value')).toISOString(); rule.value = parseBirthday(DateFormat.INTL, getter('birthday')).toISOString();
}, },
validate: state => { validate: state => {
const value = state.getIn(['value', 'value']); const value = state.getIn(['birthday', 'value']);
const date = parseBirthday(DateFormat.INTL, value); const date = parseBirthday(DateFormat.INTL, value);
if (!value) { if (!value) {
state.setIn(['value', 'error'], t('Date must not be empty')); state.setIn(['birthday', 'error'], t('Date must not be empty'));
} else if (!date) { } else if (!date) {
state.setIn(['value', 'error'], t('Date is invalid')); state.setIn(['birthday', 'error'], t('Date is invalid'));
} else { } else {
state.setIn(['value', 'error'], null); state.setIn(['birthday', 'error'], null);
} }
} }
}; };
const dateValueSettings = { const dateValueSettings = {
form: <DatePicker id="value" label={t('Date')} />, form: <DatePicker id="date" label={t('Date')} />,
getFormData: rule => ({ getFormData: rule => ({
value: formatDate(DateFormat.INTL, rule.value) date: formatDate(DateFormat.INTL, rule.value)
}), }),
assignRuleSettings: (rule, getter) => { assignRuleSettings: (rule, getter) => {
rule.value = parseDate(DateFormat.INTL, getter('value')).toISOString(); rule.value = parseDate(DateFormat.INTL, getter('date')).toISOString();
}, },
validate: state => { validate: state => {
const value = state.getIn(['value', 'value']); const value = state.getIn(['date', 'value']);
const date = parseDate(DateFormat.INTL, value); const date = parseDate(DateFormat.INTL, value);
if (!value) { if (!value) {
state.setIn(['value', 'error'], t('Date must not be empty')); state.setIn(['date', 'error'], t('Date must not be empty'));
} else if (!date) { } else if (!date) {
state.setIn(['value', 'error'], t('Date is invalid')); state.setIn(['date', 'error'], t('Date is invalid'));
} else { } else {
state.setIn(['value', 'error'], null); state.setIn(['date', 'error'], null);
} }
} }
}; };
@ -297,35 +297,34 @@ export function getRuleHelpers(t, fields) {
const dateRelativeValueSettings = { const dateRelativeValueSettings = {
form: form:
<div> <div>
<InputField id="value" label={t('Number of days')}/> <InputField id="daysValue" label={t('Number of days')}/>
<Dropdown id="direction" label={t('Before/After')} options={[ <Dropdown id="direction" label={t('Before/After')} options={[
{ key: 'before', label: t('Before current date') }, { key: 'before', label: t('Before current date') },
{ key: 'after', label: t('After current date') } { key: 'after', label: t('After current date') }
]}/> ]}/>
</div>, </div>,
getFormData: rule => ({ getFormData: rule => ({
value: Math.abs(rule.value).toString(), daysValue: Math.abs(rule.value).toString(),
direction: rule.value >= 0 ? 'after' : 'before' direction: rule.value >= 0 ? 'after' : 'before'
}), }),
assignRuleSettings: (rule, getter) => { assignRuleSettings: (rule, getter) => {
const direction = getter('direction'); const direction = getter('direction');
rule.value = parseInt(getter('value')) * (direction === 'before' ? -1 : 1); rule.value = parseInt(getter('daysValue')) * (direction === 'before' ? -1 : 1);
}, },
validate: state => { validate: state => {
const value = state.getIn(['value', 'value']); const value = state.getIn(['daysValue', 'value']);
if (!value) { if (!value) {
state.setIn(['value', 'error'], t('Value must not be empty')); state.setIn(['daysValue', 'error'], t('Number of days must not be empty'));
} else if (isNaN(value)) { } else if (isNaN(value)) {
state.setIn(['value', 'error'], t('Value must be a number')); state.setIn(['daysValue', 'error'], t('Number of days must be a number'));
} else { } else {
state.setIn(['value', 'error'], null); state.setIn(['daysValue', 'error'], null);
} }
} }
}; };
const optionValueSettings = { const optionValueSettings = {
form: null, form: null,
formDataDefaults: {},
getFormData: rule => ({}), getFormData: rule => ({}),
assignRuleSettings: (rule, getter) => {}, assignRuleSettings: (rule, getter) => {},
validate: state => {} validate: state => {}
@ -353,6 +352,9 @@ export function getRuleHelpers(t, fields) {
ruleHelpers.primitiveRuleTypesFormDataDefaults = { ruleHelpers.primitiveRuleTypesFormDataDefaults = {
value: '', value: '',
date: '',
daysValue: '',
birthday: '',
direction: 'before' direction: 'before'
}; };