Merge pull request #13760 from netchampfaris/fetch-from-ux

feat: UX for Fetch From
This commit is contained in:
mergify[bot] 2021-08-04 08:24:41 +00:00 committed by GitHub
commit d6bbdf0ea5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 91 additions and 1 deletions

View file

@ -66,4 +66,92 @@ frappe.ui.form.on('DocType', {
autoname: function(frm) {
frm.set_df_property('fields', 'reqd', frm.doc.autoname !== 'Prompt');
}
})
});
frappe.ui.form.on("DocField", {
form_render(frm, doctype, docname) {
// Render two select fields for Fetch From instead of Small Text for better UX
let field = frm.cur_grid.grid_form.fields_dict.fetch_from;
$(field.input_area).hide();
let $doctype_select = $(`<select class="form-control">`);
let $field_select = $(`<select class="form-control">`);
let $wrapper = $('<div class="fetch-from-select row"><div>');
$wrapper.append($doctype_select, $field_select);
field.$input_wrapper.append($wrapper);
$doctype_select.wrap('<div class="col"></div>');
$field_select.wrap('<div class="col"></div>');
let row = frappe.get_doc(doctype, docname);
let curr_value = { doctype: null, fieldname: null };
if (row.fetch_from) {
let [doctype, fieldname] = row.fetch_from.split(".");
curr_value.doctype = doctype;
curr_value.fieldname = fieldname;
}
let curr_df_link_doctype = row.fieldtype == "Link" ? row.options : null;
let doctypes = frm.doc.fields
.filter(df => df.fieldtype == "Link")
.filter(df => df.options && df.options != curr_df_link_doctype)
.map(df => ({
label: `${df.options} (${df.fieldname})`,
value: df.fieldname
}));
$doctype_select.add_options([
{ label: __("Select DocType"), value: "", selected: true },
...doctypes
]);
$doctype_select.on("change", () => {
row.fetch_from = "";
frm.dirty();
update_fieldname_options();
});
function update_fieldname_options() {
$field_select.find("option").remove();
let link_fieldname = $doctype_select.val();
if (!link_fieldname) return;
let link_field = frm.doc.fields.find(
df => df.fieldname === link_fieldname
);
let link_doctype = link_field.options;
frappe.model.with_doctype(link_doctype, () => {
let fields = frappe.meta
.get_docfields(link_doctype, null, {
fieldtype: ["not in", frappe.model.no_value_type]
})
.map(df => ({
label: `${df.label} (${df.fieldtype})`,
value: df.fieldname
}));
$field_select.add_options([
{
label: __("Select Field"),
value: "",
selected: true,
disabled: true
},
...fields
]);
if (curr_value.fieldname) {
$field_select.val(curr_value.fieldname);
}
});
}
$field_select.on("change", () => {
let fetch_from = `${$doctype_select.val()}.${$field_select.val()}`;
row.fetch_from = fetch_from;
frm.dirty();
});
if (curr_value.doctype) {
$doctype_select.val(curr_value.doctype);
update_fieldname_options();
}
}
});

View file

@ -113,6 +113,7 @@ frappe.ui.form.ControlSelect = class ControlSelect extends frappe.ui.form.Contro
var is_value_null = is_null(v.value);
var is_label_null = is_null(v.label);
var is_disabled = Boolean(v.disabled);
var is_selected = Boolean(v.selected);
if (is_value_null && is_label_null) {
value = v;
@ -126,6 +127,7 @@ frappe.ui.form.ControlSelect = class ControlSelect extends frappe.ui.form.Contro
$('<option>').html(cstr(label))
.attr('value', value)
.prop('disabled', is_disabled)
.prop('selected', is_selected)
.appendTo(this);
}
// select the first option