entrouvert
/
combo
16
1
Fork 0
Code Issues Pull Requests 11 Releases Wiki Activity

wcs: split content and display_mode in card custom schema form (#58800)

This commit is contained in:
Lauréline Guérin 2022-01-06 14:58:48 +01:00
parent 223a9390cb
commit 3af712446a
No known key found for this signature in database
GPG Key ID: 1FAB9B9B4F93D473
2 changed files with 105 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
combo/apps/wcs/templates/combo/wcs/manager/card-infos-cell-form.html
View File

@ -40,25 +40,50 @@
<form>
<p>
<label>
{% trans "Field" %}
<select name="card_field_varname">
{% trans "Content type" %}
<select name="entry_type" data-dynamic-display-parent="true">
<option value="@field@">{% trans "Card field" %}</option>
<option value="@custom@">{% trans "Custom" %}</option>
</select>
</label>
</p>
<p>
<label>
{% trans "Value template" %}
<textarea name="card_field_template" style="resize: vertical;"></textarea>
{% trans "Card Fields" %}
<select name="field_varname" data-dynamic-display-child-of="entry_type" data-dynamic-display-value="@field@"></select>
</label>
</p>
<p>
<label>
{% trans "Display" %}
<select name="display_mode">
{% trans "Field content" %}
<select name="field_content" data-dynamic-display-child-of="entry_type" data-dynamic-display-value="@field@">
<option value="label-and-value">{% trans "Label & Value" %}</option>
<option value="label">{% trans "Label only" %}</option>
<option value="value">{% trans "Value only" %}</option>
</select>
</label>
</p>
<p>
<label>
{% trans "Display mode" %}
<select name="field_display_mode" data-dynamic-display-child-of="entry_type" data-dynamic-display-value="@field@">
<option value="text">{% trans "Text" %}</option>
<option value="title">{% trans "Title" %}</option>
</select>
</label>
</p>
<p>
<label>
{% trans "Value template" %}
<textarea name="custom_template" data-dynamic-display-child-of="entry_type" data-dynamic-display-value="@custom@" style="resize: vertical;"></textarea>
</label>
</p>
<p>
<label>
{% trans "Display mode" %}
<select name="custom_display_mode" data-dynamic-display-child-of="entry_type" data-dynamic-display-value="@custom@">
<option value="label">{% trans "Label" %}</option>
<option value="text">{% trans "Text" %}</option>
<option value="title">{% trans "Title" %}</option>
</select>
</label>

97
combo/manager/static/js/combo.manager.js
View File

@ -397,6 +397,23 @@ $(function() {
window.location = $(this).parent('div').find('option:selected').data('add-url');
return false;
});
function prepare_dynamic_fields() {
$('[data-dynamic-display-parent]').off('change input').on('change input', function() {
var sel1 = '[data-dynamic-display-child-of="' + $(this).attr('name') + '"]';
var sel2 = '[data-dynamic-display-value="' + $(this).val() + '"]';
var sel3 = '[data-dynamic-display-value-in*="' + $(this).val() + '"]';
$(sel1).addClass('field-hidden').parent().parent().hide();
$(sel1 + sel2).removeClass('field-hidden').parent().parent().show();
$(sel1 + sel3).removeClass('field-hidden').parent().parent().show();
$(sel1).trigger('change');
});
$('[data-dynamic-display-child-of]').addClass('field-hidden').parent().parent().hide();
$('select[data-dynamic-display-parent]').trigger('change');
$('[data-dynamic-display-parent]:checked').trigger('change');
}
prepare_dynamic_fields();
$(document).on('combo:dialog-loaded', prepare_dynamic_fields);
});
@ -472,29 +489,29 @@ Card_cell_custom.prototype = {
// Grid cell methods
grid_cell__init_form: function() {
const _self = this;
this.grid_cell_form.varname = this.grid_cell_form[0];
this.grid_cell_form.template = this.grid_cell_form[1];
this.grid_cell_form.display_mode = this.grid_cell_form[2];
this.grid_cell_form.size = this.grid_cell_form[3];
const varname_select = this.grid_cell_form.varname;
this.cardSchema.fields.reverse().forEach(function(el, id) {
this.grid_cell_form.entry_type = this.grid_cell_form[0];
this.grid_cell_form.field_varname= this.grid_cell_form[1];
this.grid_cell_form.field_content = this.grid_cell_form[2];
this.grid_cell_form.field_display_mode = this.grid_cell_form[3];
this.grid_cell_form.custom_template = this.grid_cell_form[4];
this.grid_cell_form.custom_display_mode = this.grid_cell_form[5];
this.grid_cell_form.size = this.grid_cell_form[6];
const varname_select = this.grid_cell_form.field_varname;
this.cardSchema.fields.forEach(function(el, id) {
if (el.varname) {
$('<option />')
.attr('value', el.varname)
.text(el.label)
.prependTo(varname_select);
.appendTo(varname_select);
}
})
// hide or show template, change mode options, depending on selected field
const _label_and_value_option = this.grid_cell_form.display_mode[0];
$(varname_select).on('change', function() {
if ($(this).val() == '@custom@') {
$(_self.grid_cell_form.template).parent().show();
$(_label_and_value_option).remove();
const field_content_select = this.grid_cell_form.field_content;
$(field_content_select).on('change', function() {
if ($(this).hasClass('field-hidden') || $(this).val() == 'label-and-value') {
$(_self.grid_cell_form.field_display_mode).removeClass('field-hidden').parent().parent().hide();
} else {
$(_self.grid_cell_form.template).parent().hide();
$(_label_and_value_option).prependTo($(_self.grid_cell_form.display_mode));
$(_self.grid_cell_form.field_display_mode).addClass('field-hidden').parent().parent().show();
}
});
},
@ -504,7 +521,8 @@ Card_cell_custom.prototype = {
modal: true,
width: 'auto',
open: function( event, ui ) {
$(_self.grid_cell_form.varname).change();
$(document).trigger('combo:dialog-loaded');
$(_self.grid_cell_form.field_content).change();
},
buttons: [
{
@ -553,7 +571,16 @@ Card_cell_custom.prototype = {
const cell_content = schema_cell.varname == '@custom@' ? (schema_cell.template || '') + ' (' + gettext('Custom') + ')' : schema_field.label;
cell_text += $('<span/>').addClass(schema_cell.display_mode).text(cell_content).html();
cell_text += '<span class="cell-meta">';
let cell_display_mode_label = $(this.grid_cell_form).find('select[name="display_mode"] option[value="' + schema_cell.display_mode + '"]').text();
let cell_display_mode_label = '';
if (schema_cell.varname == '@custom@') {
cell_display_mode_label = $(this.grid_cell_form).find('select[name="custom_display_mode"] option[value="' + schema_cell.display_mode + '"]').text();
} else {
cell_display_mode_label = $(this.grid_cell_form).find('select[name="field_content"] option[value="' + schema_cell.field_content + '"]').text();
if (schema_cell.field_content != 'label-and-value') {
cell_display_mode_label += ' - ';
cell_display_mode_label += $(this.grid_cell_form).find('select[name="field_display_mode"] option[value="' + schema_cell.display_mode + '"]').text();
}
}
cell_text += '<span class="cell-display-mode-label">' + cell_display_mode_label + '</span>';
let cell_size_label = $(this.grid_cell_form).find('select[name="cell_size"] option[value="' + schema_cell.cell_size + '"]').text();
cell_text += '<span class="cell-size-label">' + gettext('Size:') + ' ' + cell_size_label + '</span>';
@ -581,10 +608,26 @@ Card_cell_custom.prototype = {
},
grid_cell__edit: function(grid_cell) {
const _self = this;
this.grid_cell_form.varname.value = grid_cell.dataset.varname;
this.grid_cell_form.template.value = grid_cell.dataset.template || '';
if (grid_cell.dataset.varname == '@custom@') {
this.grid_cell_form.entry_type.value = '@custom@';
this.grid_cell_form.field_varname.value = '';
this.grid_cell_form.field_content.value = '';
this.grid_cell_form.field_display_mode.value = '';
this.grid_cell_form.custom_template.value = grid_cell.dataset.template || '';
this.grid_cell_form.custom_display_mode.value = grid_cell.dataset.display_mode;
} else {
this.grid_cell_form.entry_type.value = '@field@';
this.grid_cell_form.field_varname.value = grid_cell.dataset.varname;
this.grid_cell_form.field_content.value = grid_cell.dataset.field_content;
if (grid_cell.dataset.field_content == 'label-and-value') {
this.grid_cell_form.field_display_mode.value = 'text';
} else {
this.grid_cell_form.field_display_mode.value = grid_cell.dataset.display_mode;
}
this.grid_cell_form.custom_template.value = '';
this.grid_cell_form.custom_display_mode.value = '';
}
this.grid_cell_form.size.value = grid_cell.dataset.cell_size;
this.grid_cell_form.display_mode.value = grid_cell.dataset.display_mode;
const cell_id = $(grid_cell).index();
const grid_cell_schema = this.gridSchema.cells[cell_id];
this.grid_cell__form_dialog(gettext('Edit'), function(form_datas){
@ -594,10 +637,18 @@ Card_cell_custom.prototype = {
});
},
grid_cell__set_schema: function(form_datas, schema_cell) {
schema_cell.varname = form_datas.card_field_varname;
schema_cell.template = form_datas.card_field_template;
if (form_datas.entry_type == '@custom@') {
schema_cell.varname = '@custom@';
delete schema_cell.field_content;
schema_cell.display_mode = form_datas.custom_display_mode;
schema_cell.template = form_datas.custom_template;
} else {
schema_cell.varname = form_datas.field_varname;
schema_cell.field_content = form_datas.field_content;
schema_cell.display_mode = form_datas.field_display_mode;
delete schema_cell.template;
}
schema_cell.cell_size = form_datas.cell_size;
schema_cell.display_mode = form_datas.display_mode;
return schema_cell
},
grid_cell__add_schema: function(form_datas) {