+
`);
+
+ this.$dashboard_wrapper = this.$page.find('.dashboard-view');
+ this.$chart_header = this.$page.find('.dashboard-header');
+
+ frappe.utils.bind_actions_with_object(this.$dashboard_page, this);
+ }
+
+ make_dashboard() {
+ if (this.dashboard_settings) {
+ this.charts = this.dashboard_settings.charts;
+ this.number_cards = this.dashboard_settings.number_cards;
+ this.render_dashboard();
+ } else {
+ frappe.run_serially([
+ () => this.fetch_dashboard_items(
+ 'Dashboard Chart',
+ {
+ chart_type: ['in', ['Count', 'Sum', 'Group By']],
+ document_type: this.doctype,
+ },
+ 'charts'
+ ),
+ () => this.fetch_dashboard_items('Number Card',
+ {
+ document_type: this.doctype,
+ },
+ 'number_cards'
+ ),
+ () => this.render_dashboard()
+ ]);
+ }
+ }
+
+ render_dashboard() {
+ this.$dashboard_wrapper.empty();
+
+ frappe.dashboard_utils.get_dashboard_settings().then(settings => {
+ this.dashboard_chart_settings = settings.chart_config ? JSON.parse(settings.chart_config) : {};
+ this.charts.map(chart => {
+ chart.label = chart.chart_name;
+ chart.chart_settings = this.dashboard_chart_settings[chart.chart_name] || {};
+ });
+ this.render_dashboard_charts();
+ });
+ this.render_number_cards();
+
+ if (!this.charts.length && !this.number_cards.length) {
+ this.render_empty_state();
+ }
+ }
+
+ fetch_dashboard_items(doctype, filters, obj_name) {
+ return frappe.db.get_list(doctype, {
+ filters: filters,
+ fields: ['*']
+ }).then(items => {
+ this[obj_name] = items;
+ });
+ }
+
+ render_number_cards() {
+ this.number_card_group = new frappe.widget.WidgetGroup({
+ container: this.$dashboard_wrapper,
+ type: "number_card",
+ columns: 3,
+ options: {
+ allow_sorting: true,
+ allow_create: true,
+ allow_delete: true,
+ allow_hiding: true,
+ },
+ default_values: {doctype: this.doctype},
+ widgets: this.number_cards || [],
+ in_customize_mode: this.in_customize_mode || false,
+ });
+
+ this.in_customize_mode && this.number_card_group.customize();
+ }
+
+ render_dashboard_charts() {
+ this.chart_group = new frappe.widget.WidgetGroup({
+ container: this.$dashboard_wrapper,
+ type: "chart",
+ columns: 2,
+ options: {
+ allow_sorting: true,
+ allow_create: true,
+ allow_delete: true,
+ allow_hiding: true,
+ allow_resize: true,
+ },
+ custom_dialog: () => this.show_add_chart_dialog(),
+ widgets: this.charts,
+ in_customize_mode: this.in_customize_mode || false,
+ });
+
+ this.in_customize_mode && this.chart_group.customize();
+ this.chart_group.container.find('.widget-group-head').hide();
+ }
+
+ render_empty_state() {
+ const no_result_message_html =
+ `${dashboard_name}
+ ${__('Customize')}
+
+ ${__("You haven't added any Dashboard Charts or Number Cards yet.")}
+
${__("Click On Customize to add your first widget")}
+
`;
+
+ this.$dashboard_wrapper.append(empty_state_html);
+ this.$empty_state = this.$dashboard_wrapper.find('.empty-dashboard');
+ }
+
+ customize() {
+ if (this.in_customize_mode) {
+ return;
+ }
+
+ if (this.$empty_state) {
+ this.$empty_state.remove();
+ }
+
+ this.toggle_customize(true);
+ this.chart_group.in_customize_mode = true;
+ this.chart_group.customize();
+ this.number_cards.in_customize_mode = true;
+ this.number_card_group.customize();
+ }
+
+ get_widgets_to_save(widget_group) {
+ const config = widget_group.get_widget_config();
+ let widgets = [];
+ config.order.map(widget_name => {
+ widgets.push(config.widgets[widget_name]);
+ });
+ return this.remove_duplicates(widgets);
+ }
+
+ save_dashboard_customization() {
+ this.toggle_customize(false);
+
+ const charts = this.get_widgets_to_save(this.chart_group);
+ const number_cards = this.get_widgets_to_save(this.number_card_group);
+
+ this.dashboard_settings = {
+ charts: charts,
+ number_cards: number_cards,
+ };
+
+ frappe.model.user_settings.save(this.doctype, 'dashboard_settings', this.dashboard_settings);
+ this.make_dashboard();
+ }
+
+ discard_dashboard_customization() {
+ this.dashboard_settings = frappe.get_user_settings(this.doctype)['dashboard_settings'] || null;
+ this.toggle_customize(false);
+ this.render_dashboard();
+ }
+
+ reset_dashboard_customization() {
+ this.dashboard_settings = null;
+ frappe.model.user_settings.save(
+ this.doctype, 'dashboard_settings', this.dashboard_settings
+ ).then(() => this.make_dashboard());
+
+ this.toggle_customize(false);
+ }
+
+ toggle_customize(show) {
+ this.$customize.toggle(!show);
+ this.$save_or_discard.toggle(show);
+ this.in_customize_mode = show;
+ }
+
+ show_add_chart_dialog() {
+ let fields = this.get_field_options();
+ const dialog = new frappe.ui.Dialog({
+ title: __(`Add a ${this.doctype} Chart`),
+ fields: [
+ {
+ fieldname: 'new_or_existing',
+ fieldtype: 'Select',
+ label: 'Choose an existing chart or create a new chart',
+ options: ['New Chart', 'Existing Chart'],
+ reqd: 1,
+ },
+ {
+ label: 'Chart',
+ fieldname: 'chart',
+ fieldtype: 'Link',
+ get_query: () => {
+ return {
+ 'query': 'frappe.desk.doctype.dashboard_chart.dashboard_chart.get_charts_for_user',
+ filters: {
+ document_type: this.doctype,
+ }
+ };
+ },
+ options: 'Dashboard Chart',
+ depends_on: 'eval: doc.new_or_existing == "Existing Chart"'
+ },
+ {
+ fieldname: 'sb_2',
+ fieldtype: 'Section Break',
+ depends_on: 'eval: doc.new_or_existing == "New Chart"'
+ },
+ {
+ label: 'Chart Label',
+ fieldname: 'label',
+ fieldtype: 'Data',
+ mandatory_depends_on: 'eval: doc.new_or_existing == "New Chart"'
+ },
+ {
+ fieldname: 'cb_1',
+ fieldtype: 'Column Break'
+ },
+ {
+ label: 'Chart Type',
+ fieldname: 'chart_type',
+ fieldtype: 'Select',
+ options: ['Time Series', 'Group By'],
+ mandatory_depends_on: 'eval: doc.new_or_existing == "New Chart"',
+ },
+ {
+ fieldname: 'sb_2',
+ fieldtype: 'Section Break',
+ label: 'Chart Config',
+ depends_on: 'eval: doc.chart_type == "Time Series" && doc.new_or_existing == "New Chart"',
+ },
+ {
+ label: 'Function',
+ fieldname: 'chart_function',
+ fieldtype: 'Select',
+ options: ['Count', 'Sum', 'Average'],
+ default: 'Count',
+ },
+ {
+ label: 'Timespan',
+ fieldtype: 'Select',
+ fieldname: 'timespan',
+ depends_on: 'eval: doc.chart_type == "Time Series"',
+ options: ['Last Year', 'Last Quarter', 'Last Month', 'Last Week'],
+ default: 'Last Year',
+ },
+ {
+ fieldname: 'cb_2',
+ fieldtype: 'Column Break'
+ },
+ {
+ label: 'Value Based On',
+ fieldtype: 'Select',
+ fieldname: 'based_on',
+ options: fields.value_fields,
+ depends_on: 'eval: doc.chart_function=="Sum"'
+ },
+ {
+ label: 'Time Series Based On',
+ fieldtype: 'Select',
+ fieldname: 'based_on',
+ options: fields.date_fields,
+ mandatory_depends_on: 'eval: doc.chart_type == "Time Series"'
+ },
+ {
+ label: 'Time Interval',
+ fieldname: 'time_interval',
+ fieldtype: 'Select',
+ depends_on: 'eval: doc.chart_type == "Time Series"',
+ options: ['Yearly', 'Quarterly', 'Monthly', 'Weekly', 'Daily'],
+ default: 'Monthly'
+ },
+ {
+ fieldname: 'sb_2',
+ fieldtype: 'Section Break',
+ label: 'Chart Config',
+ depends_on: 'eval: doc.chart_type == "Group By" && doc.new_or_existing == "New Chart"',
+ },
+ {
+ label: 'Group By Type',
+ fieldname: 'group_by_type',
+ fieldtype: 'Select',
+ options: ['Count', 'Sum', 'Average'],
+ default: 'Count',
+ },
+ {
+ label: 'Aggregate Function Based On',
+ fieldtype: 'Select',
+ fieldname: 'aggregate_function_based_on',
+ options: fields.aggregate_function_fields,
+ depends_on: 'eval: ["Sum", "Avergage"].includes(doc.group_by_type)',
+ },
+ {
+ fieldname: 'cb_2',
+ fieldtype: 'Column Break'
+ },
+ {
+ label: 'Group By Based On',
+ fieldtype: 'Select',
+ fieldname: 'group_by_based_on',
+ options: fields.group_by_fields,
+ default: 'Last Year',
+ },
+ {
+ label: 'Number of Groups',
+ fieldtype: 'Int',
+ fieldname: 'number_of_groups',
+ default: 0,
+ },
+ {
+ fieldname: 'sb_3',
+ fieldtype: 'Section Break',
+ depends_on: 'eval: doc.new_or_existing == "New Chart"'
+ },
+ {
+ label: 'Chart Type',
+ fieldname: 'type',
+ fieldtype: 'Select',
+ options: ['Line', 'Bar', 'Percentage', 'Pie'],
+ depends_on: 'eval: doc.new_or_existing == "New Chart"'
+ },
+ {
+ fieldname: 'cb_1',
+ fieldtype: 'Column Break'
+ },
+ {
+ label: 'Chart Color',
+ fieldname: 'color',
+ fieldtype: 'Color',
+ depends_on: 'eval: doc.new_or_existing == "New Chart"',
+ },
+ ],
+ primary_action_label: __('Add'),
+ primary_action: (values) => {
+ let chart = values;
+ if (chart.new_or_existing == 'New Chart') {
+ chart.chart_name = chart.label;
+ chart.chart_type = chart.chart_type == 'Time Series' ? chart.chart_function : chart.chart_type;
+ chart.document_type = this.doctype;
+ chart.filters_json = '[]';
+ frappe.xcall('frappe.desk.doctype.dashboard_chart.dashboard_chart.create_dashboard_chart', {'args': chart}).then((doc)=> {
+ this.chart_group.new_widget.on_create({'chart_name': doc.chart_name, 'name': doc.chart_name, 'label': chart.label});
+ });
+ } else {
+ this.chart_group.new_widget.on_create({'chart_name': chart.chart, 'label': chart.chart, 'name': chart.chart});
+ }
+ dialog.hide();
+ }
+ });
+ dialog.show();
+ }
+
+ get_field_options() {
+ let date_fields = [
+ {label: __('Created On'), value: 'creation'},
+ {label: __('Last Modified On'), value: 'modified'}
+ ];
+ let value_fields = [];
+ let group_by_fields = [];
+ let aggregate_function_fields = [];
+
+ frappe.get_meta(this.doctype).fields.map(df => {
+ if (['Date', 'Datetime'].includes(df.fieldtype)) {
+ date_fields.push({label: df.label, value: df.fieldname});
+ }
+ if (frappe.model.numeric_fieldtypes.includes(df.fieldtype)) {
+ value_fields.push({label: df.label, value: df.fieldname});
+ aggregate_function_fields.push({label: df.label, value: df.fieldname});
+ }
+ if (['Link', 'Select'].includes(df.fieldtype)) {
+ group_by_fields.push({label: df.label, value: df.fieldname});
+ }
+ });
+
+ return {
+ date_fields: date_fields,
+ value_fields: value_fields,
+ group_by_fields: group_by_fields,
+ aggregate_function_fields: aggregate_function_fields
+ };
+ }
+
+ remove_duplicates(items) {
+ return items.filter((item, index) => items.indexOf(item) === index);
+ }
+
+};
diff --git a/frappe/public/js/frappe/web_form/web_form.js b/frappe/public/js/frappe/web_form/web_form.js
index 62a339f650..81b219aece 100644
--- a/frappe/public/js/frappe/web_form/web_form.js
+++ b/frappe/public/js/frappe/web_form/web_form.js
@@ -29,7 +29,7 @@ export default class WebForm extends frappe.ui.FieldGroup {
// webform client script
frappe.init_client_script && frappe.init_client_script();
- frappe.web_form.events.trigger('after_load');
+ this.after_load && this.after_load();
}
on(fieldname, handler) {
@@ -102,7 +102,9 @@ export default class WebForm extends frappe.ui.FieldGroup {
}
save() {
- this.validate && this.validate();
+ if (this.validate && !this.validate()) {
+ frappe.throw(__("Couldn't save, please check the data you have entered"), __("Validation Error"));
+ }
// validation hack: get_values will check for missing data
let doc_values = super.get_values(this.allow_incomplete);
@@ -134,7 +136,7 @@ export default class WebForm extends frappe.ui.FieldGroup {
if (!response.exc) {
// Success
this.handle_success(response.message);
- frappe.web_form.events.trigger('after_save');
+ this.after_save && this.after_save();
}
},
always: function() {
diff --git a/frappe/public/js/frappe/widgets/base_widget.js b/frappe/public/js/frappe/widgets/base_widget.js
index 730157ed4c..aea26d762d 100644
--- a/frappe/public/js/frappe/widgets/base_widget.js
+++ b/frappe/public/js/frappe/widgets/base_widget.js
@@ -27,14 +27,16 @@ export default class Widget {
options.allow_delete &&
this.add_custom_button(
'',
- () => this.delete()
+ () => this.delete(),
+ "",
+ `${__('Delete')}`
);
options.allow_sorting &&
this.add_custom_button(
'',
null,
- "drag-handle"
+ "drag-handle",
);
if (options.allow_hiding) {
@@ -45,10 +47,12 @@ export default class Widget {
this.footer.css("opacity", 0.5);
}
const classname = this.hidden ? 'fa fa-eye' : 'fa fa-eye-slash';
+ const title = this.hidden ? `${__('Show')}` : `${__('Hide')}`;
this.add_custom_button(
``,
() => this.hide_or_show(),
- "show-or-hide-button"
+ "show-or-hide-button",
+ title
);
this.show_or_hide_button = this.action_area.find(
@@ -62,6 +66,19 @@ export default class Widget {
() => this.edit()
);
+ if (options.allow_resize) {
+ const title = this.width == 'Full'? `${__('Collapse')}` : `${__('Expand')}`;
+ this.add_custom_button(
+ '',
+ () => this.toggle_width(),
+ "resize-button",
+ title
+ );
+
+ this.resize_button = this.action_area.find(
+ ".resize-button"
+ );
+ }
}
make() {
@@ -72,12 +89,12 @@ export default class Widget {
make_widget() {
this.widget = $(`
+ 
+
+ ${no_result_message_html}
+ ${customize_button}
+
+ }" data-widget-name="${this.name ? this.name : ''}">
- `
);
- this.loading.hide().appendTo(this.body);
+ this.loading.appendTo(this.body);
this.empty = $(
`
${__(
@@ -51,6 +56,8 @@ export default class ChartWidget extends Widget {
this.chart_wrapper = $(``);
this.chart_wrapper.appendTo(this.body);
+
+ this.set_chart_title();
}
set_summary() {
@@ -69,6 +76,12 @@ export default class ChartWidget extends Widget {
make_chart() {
this.get_settings().then(() => {
+ if (!this.settings) {
+ this.deleted = true;
+ this.widget.remove();
+ return;
+ }
+
if (!this.chart_settings) {
this.chart_settings = {};
}
@@ -442,11 +455,10 @@ export default class ChartWidget extends Widget {
chart_name: this.chart_doc.name,
filters: filters,
refresh: refresh ? 1 : 0,
- time_interval:
- args && args.time_interval? args.time_interval: null,
- timespan: args && args.timespan? args.timespan: null,
- from_date: args && args.from_date? args.from_date: null,
- to_date: args && args.to_date? args.to_date: null
+ time_interval: args && args.time_interval ? args.time_interval : null,
+ timespan: args && args.timespan ? args.timespan : null,
+ from_date: args && args.from_date ? args.from_date : null,
+ to_date: args && args.to_date ? args.to_date : null
};
}
return frappe.xcall(method, args);
@@ -536,40 +548,42 @@ export default class ChartWidget extends Widget {
return frappe.model
.with_doc("Dashboard Chart", this.chart_name)
.then(chart_doc => {
- this.chart_doc = chart_doc;
- if (this.chart_doc.chart_type == "Custom") {
- // custom source
- if (
- frappe.dashboards.chart_sources[this.chart_doc.source]
- ) {
- this.settings =
- frappe.dashboards.chart_sources[
- this.chart_doc.source
- ];
+ if (chart_doc) {
+ this.chart_doc = chart_doc;
+ if (this.chart_doc.chart_type == "Custom") {
+ // custom source
+ if (
+ frappe.dashboards.chart_sources[this.chart_doc.source]
+ ) {
+ this.settings =
+ frappe.dashboards.chart_sources[
+ this.chart_doc.source
+ ];
+ return Promise.resolve();
+ } else {
+ const method =
+ "frappe.desk.doctype.dashboard_chart_source.dashboard_chart_source.get_config";
+ return frappe
+ .xcall(method, { name: this.chart_doc.source })
+ .then(config => {
+ frappe.dom.eval(config);
+ this.settings =
+ frappe.dashboards.chart_sources[
+ this.chart_doc.source
+ ];
+ });
+ }
+ } else if (this.chart_doc.chart_type == "Report") {
+ this.settings = {
+ method: "frappe.desk.query_report.run"
+ };
return Promise.resolve();
} else {
- const method =
- "frappe.desk.doctype.dashboard_chart_source.dashboard_chart_source.get_config";
- return frappe
- .xcall(method, { name: this.chart_doc.source })
- .then(config => {
- frappe.dom.eval(config);
- this.settings =
- frappe.dashboards.chart_sources[
- this.chart_doc.source
- ];
- });
+ this.settings = {
+ method: "frappe.desk.doctype.dashboard_chart.dashboard_chart.get"
+ };
+ return Promise.resolve();
}
- } else if (this.chart_doc.chart_type == "Report") {
- this.settings = {
- method: "frappe.desk.query_report.run"
- };
- return Promise.resolve();
- } else {
- this.settings = {
- method: "frappe.desk.doctype.dashboard_chart.dashboard_chart.get"
- };
- return Promise.resolve();
}
});
}
diff --git a/frappe/public/js/frappe/widgets/new_widget.js b/frappe/public/js/frappe/widgets/new_widget.js
index 787cb3a79c..e0cfd51ab4 100644
--- a/frappe/public/js/frappe/widgets/new_widget.js
+++ b/frappe/public/js/frappe/widgets/new_widget.js
@@ -18,19 +18,26 @@ export default class NewWidget {
get_title() {
// DO NOT REMOVE: Comment to load translation
- // __("New Chart") __("New Shortcut")
- return __(`New ${frappe.utils.to_title_case(this.type)}`);
+ // __("New Chart") __("New Shortcut") __("New Number Card")
+ return __(`New ${frappe.model.unscrub(this.type)}`);
}
make_widget() {
- this.widget = $(``);
};
-export { generate_route, generate_grid, build_summary_item };
\ No newline at end of file
+function go_to_list_with_filters(doctype, filters) {
+ const route = `List/${doctype}/List`;
+ frappe.set_route(route).then(()=> {
+ let list_view = frappe.views.list_view[route];
+ let filter_area = list_view.filter_area;
+ filter_area.clear();
+ filter_area.filter_list.add_filters_to_filter_group(filters);
+ });
+}
+
+function shorten_number(number) {
+ let x = Math.abs(Math.round(number));
+
+ switch (true) {
+ case x >= 1.0e+12:
+ return Math.round(number/1.0e+12) + " T";
+ case x >= 1.0e+9:
+ return Math.round(number/1.0e+9) + " B";
+ case x >= 1.0e+6:
+ return Math.round(number/1.0e+6) + " M";
+ default:
+ return number.toFixed();
+ }
+}
+
+export { generate_route, generate_grid, build_summary_item, go_to_list_with_filters, shorten_number };
\ No newline at end of file
diff --git a/frappe/public/js/frappe/widgets/widget_dialog.js b/frappe/public/js/frappe/widgets/widget_dialog.js
index 77e2d65ea3..a9ea8637cf 100644
--- a/frappe/public/js/frappe/widgets/widget_dialog.js
+++ b/frappe/public/js/frappe/widgets/widget_dialog.js
@@ -19,7 +19,7 @@ class WidgetDialog {
primary_action: (data) => {
data = this.process_data(data);
- if (!this.editing) {
+ if (!this.editing && !data.name) {
data.name = `${this.type}-${this.label}-${frappe.utils.get_random(20)}`;
}
@@ -35,7 +35,7 @@ class WidgetDialog {
// __("New Chart") __("New Shortcut") __("Edit Chart") __("Edit Shortcut")
let action = this.editing ? "Edit" : "Add";
- return __(`${action} ${frappe.utils.to_title_case(this.type)}`);
+ return __(`${action} ${frappe.model.unscrub(this.type)}`);
}
get_fields() {
@@ -61,6 +61,38 @@ class WidgetDialog {
show_field(fieldname) {
this.dialog.set_df_property(fieldname, "hidden", false);
}
+
+ setup_filter(doctype) {
+ if (this.filter_group) {
+ this.filter_group.wrapper.empty();
+ delete this.filter_group;
+ }
+
+ let $loading = this.dialog.get_field("filter_area_loading").$wrapper;
+ $(`Loading Filters...`).appendTo($loading);
+
+ this.filters = [];
+
+ if (this.values && this.values.stats_filter) {
+ const filters_json = JSON.parse(this.values.stats_filter);
+ this.filters = Object.keys(filters_json).map((filter) => {
+ let val = filters_json[filter];
+ return [this.values.link_to, filter, val[0], val[1], false];
+ });
+ }
+
+ this.filter_group = new frappe.ui.FilterGroup({
+ parent: this.dialog.get_field("filter_area").$wrapper,
+ doctype: doctype,
+ on_change: () => {},
+ });
+
+ frappe.model.with_doctype(doctype, () => {
+ this.filter_group.add_filters_to_filter_group(this.filters);
+ this.hide_field("filter_area_loading");
+ this.show_field("filter_area");
+ });
+ }
}
class ChartDialog extends WidgetDialog {
@@ -222,37 +254,139 @@ class ShortcutDialog extends WidgetDialog {
return data;
}
+}
- setup_filter(doctype) {
- if (this.filter_group) {
- this.filter_group.wrapper.empty();
- delete this.filter_group;
+class NumberCardDialog extends WidgetDialog {
+ constructor(opts) {
+ super(opts);
+ }
+
+ get_fields() {
+ let fields;
+ fields = [
+ {
+ fieldtype: 'Select',
+ label: 'Choose Existing Card or create New Card',
+ fieldname: 'new_or_existing',
+ options: ['New Card', 'Existing Card']
+ },
+ {
+ fieldtype: 'Link',
+ fieldname: 'card',
+ label: 'Number Cards',
+ options: 'Number Card',
+ get_query: () => {
+ return {
+ 'query': 'frappe.desk.doctype.number_card.number_card.get_cards_for_user',
+ filters: {
+ document_type: this.document_type,
+ }
+ };
+ },
+ depends_on: 'eval: doc.new_or_existing == "Existing Card"'
+ },
+ {
+ fieldtype: 'Section Break',
+ fieldname: 'sb_1',
+ depends_on: 'eval: doc.new_or_existing == "New Card"'
+ },
+ {
+ label: 'Label',
+ fieldname: 'label',
+ fieldtype: 'Data',
+ mandatory_depends_on: 'eval: doc.new_or_existing == "New Card"'
+ },
+ {
+ label: 'Doctype',
+ fieldname: 'document_type',
+ fieldtype: 'Link',
+ options: 'DocType',
+ onchange: () => {
+ this.document_type = this.dialog.get_value("document_type");
+ this.set_aggregate_function_fields(this.dialog.get_values());
+ this.setup_filter(this.document_type);
+ },
+ hidden: 1
+ },
+ {
+ label: 'Color',
+ fieldname: 'color',
+ fieldtype: 'Color'
+ },
+ {
+ fieldtype: "Column Break",
+ fieldname: "cb_1",
+ },
+ {
+ label: 'Function',
+ fieldname: 'function',
+ fieldtype: 'Select',
+ options: ['Count', 'Sum', 'Average', 'Minimum', 'Maximum'],
+ mandatory_depends_on: 'eval: doc.new_or_existing == "New Card"'
+ },
+ {
+ label: 'Function Based On',
+ fieldname: 'aggregate_function_based_on',
+ fieldtype: 'Select',
+ depends_on: "eval: doc.function !== 'Count'",
+ mandatory_depends_on: 'eval: doc.function !== "Count" && doc.new_or_existing == "New Card"'
+ },
+ {
+ fieldtype: "Section Break",
+ fieldname: "sb_1",
+ label: 'Add Filters',
+ depends_on: 'eval: doc.new_or_existing == "New Card"'
+ },
+ {
+ fieldtype: "HTML",
+ fieldname: "filter_area_loading",
+ },
+ {
+ fieldtype: "HTML",
+ fieldname: "filter_area",
+ hidden: 1,
+ },
+ {
+ fieldtype: "Section Break",
+ fieldname: "sb_1",
+ },
+ ];
+
+ return fields;
+ }
+
+ setup_dialog_events() {
+ if (!this.document_type) {
+ if (this.default_values['doctype']) {
+ this.document_type = this.default_values['doctype'];
+ this.setup_filter(this.default_values['doctype']);
+ this.set_aggregate_function_fields();
+ } else {
+ this.show_field('document_type');
+ }
}
+ }
- let $loading = this.dialog.get_field("filter_area_loading").$wrapper;
- $(`Loading Filters...`).appendTo($loading);
-
- this.filters = [];
-
- if (this.values && this.values.stats_filter) {
- const filters_json = JSON.parse(this.values.stats_filter);
- this.filters = Object.keys(filters_json).map((filter) => {
- let val = filters_json[filter];
- return [this.values.link_to, filter, val[0], val[1], false];
+ set_aggregate_function_fields() {
+ let aggregate_function_fields = [];
+ if (this.document_type) {
+ frappe.get_meta(this.document_type).fields.map(df => {
+ if (frappe.model.numeric_fieldtypes.includes(df.fieldtype)) {
+ aggregate_function_fields.push({label: df.label, value: df.fieldname});
+ }
});
}
+ this.dialog.set_df_property('aggregate_function_based_on', 'options', aggregate_function_fields);
+ }
- this.filter_group = new frappe.ui.FilterGroup({
- parent: this.dialog.get_field("filter_area").$wrapper,
- doctype: doctype,
- on_change: () => {},
- });
+ process_data(data) {
+ if (data.new_or_existing == 'Existing Card') {
+ data.name = data.card;
+ }
+ data.stats_filter = JSON.stringify(this.filter_group.get_filters());
+ data.document_type = this.document_type;
- frappe.model.with_doctype(doctype, () => {
- this.filter_group.add_filters_to_filter_group(this.filters);
- this.hide_field("filter_area_loading");
- this.show_field("filter_area");
- });
+ return data;
}
}
@@ -260,6 +394,7 @@ export default function get_dialog_constructor(type) {
const widget_map = {
chart: ChartDialog,
shortcut: ShortcutDialog,
+ number_card: NumberCardDialog,
};
return widget_map[type] || WidgetDialog;
diff --git a/frappe/public/js/frappe/widgets/widget_group.js b/frappe/public/js/frappe/widgets/widget_group.js
index 4124e4b76e..7e685201f5 100644
--- a/frappe/public/js/frappe/widgets/widget_group.js
+++ b/frappe/public/js/frappe/widgets/widget_group.js
@@ -4,6 +4,7 @@ import ShortcutWidget from "../widgets/shortcut_widget";
import LinksWidget from "../widgets/links_widget";
import OnboardingWidget from "../widgets/onboarding_widget";
import NewWidget from "../widgets/new_widget";
+import NumberCardWidget from "../widgets/number_card_widget";
frappe.provide("frappe.widget");
@@ -13,6 +14,7 @@ const widget_factory = {
shortcut: ShortcutWidget,
links: LinksWidget,
onboarding: OnboardingWidget,
+ number_card: NumberCardWidget,
};
export default class WidgetGroup {
@@ -77,6 +79,14 @@ export default class WidgetGroup {
return widget_object;
}
+ remove_widget(widget_obj) {
+ widget_obj.widget.remove();
+ this.widgets_list.filter((widget) => {
+ if (widget.name == widget_obj.name) return false;
+ });
+ delete this.widgets_dict[widget_obj.name];
+ }
+
customize() {
this.widget_area.show();
this.widgets_list.forEach((wid) => {
@@ -96,6 +106,8 @@ export default class WidgetGroup {
this.new_widget = new NewWidget({
container: this.body,
type: this.type,
+ custom_dialog: this.custom_dialog,
+ default_values: this.default_values,
on_create: (config) => {
// Remove new widget
this.new_widget.delete();
diff --git a/frappe/public/less/controls.less b/frappe/public/less/controls.less
index d88e6adaec..564c77c07f 100644
--- a/frappe/public/less/controls.less
+++ b/frappe/public/less/controls.less
@@ -162,6 +162,6 @@
top: 8px;
height: 15px;
right: 12px;
- top: 8px;
+ pointer-events: none;
}
}
diff --git a/frappe/public/less/dashboard_view.less b/frappe/public/less/dashboard_view.less
new file mode 100644
index 0000000000..2b3d642cfb
--- /dev/null
+++ b/frappe/public/less/dashboard_view.less
@@ -0,0 +1,44 @@
+.dashboard-page {
+ .dashboard-view {
+ min-height: calc(100vh - 284px);
+ padding: 20px 20px 0 20px;
+
+ .new-widget {
+ text-align: center;
+ }
+
+ .new-chart-widget {
+ min-height: 200px;
+ }
+
+ .new-number-card-widget {
+ min-height: 100px;
+ }
+ }
+
+ .empty-dashboard {
+ margin-top: 45px;
+ }
+
+ .page-form {
+ height: 50px;
+
+ .dashboard-header {
+ padding: 10px;
+ display: flex;
+ justify-content: space-between;
+ width: 100%;
+ }
+
+ .customize-dashboard {
+ font-size: 13px;
+ cursor: pointer;
+ }
+
+ .customize-options {
+ display: none;
+ cursor: pointer;
+ }
+ }
+}
+
diff --git a/frappe/public/less/desktop.less b/frappe/public/less/desktop.less
index 2230c59ac9..fd24ec02bb 100644
--- a/frappe/public/less/desktop.less
+++ b/frappe/public/less/desktop.less
@@ -392,6 +392,76 @@
}
}
}
+
+ &.number-widget-box {
+ cursor: pointer;
+ height: 100px;
+ padding: 10px;
+
+ &:hover {
+ border-color: @text-muted;
+ }
+
+ .widget-head {
+
+ .widget-title {
+ font-weight: normal;
+ color: @text-muted;
+ font-size: 14px;
+ margin-top: -5px;
+ }
+
+ .widget-control {
+ right: -10px;
+ top: -10px;
+ }
+ }
+
+ .widget-body {
+ text-align: left;
+
+ .number-card-loading {
+ display: flex;
+ height: 50px;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .widget-content {
+ padding-top: 20px;
+ display: flex;
+ justify-content: space-between;
+
+ .number {
+ font-size: 26px;
+ font-weight: bold;
+ }
+
+ .number-text {
+ color: @text-muted;
+ padding: 5px;
+ font-size: 14px;
+ }
+
+ .card-stats {
+ padding-top: 15px;
+ }
+
+ .green-stat {
+ color: green;
+ }
+
+ .red-stat {
+ color: @red;
+ }
+
+ .grey-stat {
+ color: @text-muted;
+ }
+ }
+ }
+ }
+
}
.pill {
diff --git a/frappe/public/less/form_grid.less b/frappe/public/less/form_grid.less
index 88c5cf7bbc..86482686d1 100644
--- a/frappe/public/less/form_grid.less
+++ b/frappe/public/less/form_grid.less
@@ -80,6 +80,10 @@
background-color: @extra-light-yellow;
}
+.editable-form .grid-static-col.invalid {
+ background-color: @label-danger-bg;
+}
+
.validated-form .grid-static-col.error {
background-color: @label-danger-bg;
}
@@ -150,6 +154,10 @@
}
}
+ input.form-control.invalid {
+ background-color: @label-danger-bg;
+ }
+
input[data-fieldtype="Int"], input[data-fieldtype="Float"], input[data-fieldtype="Currency"] {
text-align: right;
}
diff --git a/frappe/public/tailwind.css b/frappe/public/tailwind.css
index 270b70a2fc..89595f95ba 100644
--- a/frappe/public/tailwind.css
+++ b/frappe/public/tailwind.css
@@ -13,11 +13,10 @@ details.hide-summary-arrow summary::-webkit-details-marker {
}
.from-markdown {
- @apply text-gray-900;
@apply leading-relaxed;
> * + * {
- @apply mt-6;
+ @apply mt-4;
}
> :first-child {
@@ -50,28 +49,45 @@ details.hide-summary-arrow summary::-webkit-details-marker {
@apply px-4 py-3 text-sm font-medium text-gray-900 border border-gray-400 rounded-md bg-gray-50;
}
- > h1 {
- @apply text-4xl;
- @apply mt-16;
- @apply mb-4;
- @apply leading-none;
- @apply font-bold;
+ h1 {
+ @apply mt-16 mb-4 text-3xl font-extrabold leading-tight tracking-tight;
+ @screen sm {
+ @apply text-4xl leading-10;
+ }
+ @screen xl {
+ @apply text-5xl leading-none;
+ }
}
- > h2 {
- @apply mt-16;
- @apply mb-4;
- @apply leading-none;
- @apply font-bold;
- @apply text-3xl;
+ h1 + p {
+ @apply max-w-2xl mt-3 text-base text-gray-900;
+
+ @screen sm {
+ @apply mt-5 text-lg;
+ }
+ @screen md {
+ @apply mt-5 text-xl;
+ }
}
- > h3 {
- @apply mt-16;
- @apply mb-4;
- @apply leading-none;
- @apply font-bold;
- @apply text-2xl;
+ h2 {
+ @apply mb-4 text-2xl font-bold leading-tight mt-14;
+ }
+
+ h3 {
+ @apply mt-12 mb-4 text-xl font-semibold leading-tight;
+ }
+
+ h4 {
+ @apply mt-10 mb-4 text-lg font-semibold leading-tight;
+ }
+
+ h5 {
+ @apply mt-8 mb-4 text-base font-semibold leading-tight;
+ }
+
+ h6 {
+ @apply mt-6 mb-4 text-sm font-semibold leading-tight;
}
> a,
@@ -84,9 +100,17 @@ details.hide-summary-arrow summary::-webkit-details-marker {
}
}
+ table {
+ @apply w-full my-8 border-t;
+ }
+
+ tbody {
+ @apply border-t;
+ }
+
tr > td,
tr > th {
- @apply px-4 py-2 border border-gray-400;
+ @apply py-4 pr-6 text-sm leading-6 text-left border-b;
}
th:empty {
diff --git a/frappe/templates/components/web_block.html b/frappe/templates/components/web_block.html
index d898417970..f0ed8f2df4 100644
--- a/frappe/templates/components/web_block.html
+++ b/frappe/templates/components/web_block.html
@@ -7,6 +7,7 @@
web_block.css_class
]) -%}
+{%- if not web_block.hide_block -%}
<{{htmltag}} class="{{ classes }}" data-section-idx="{{ web_block.idx | e }}"
data-section-template="{{ web_block.web_template | e }}">
{%- if web_block.add_container -%}
@@ -17,3 +18,4 @@
{%- endif -%}
+{%- endif -%}
diff --git a/frappe/twofactor.py b/frappe/twofactor.py
index b44092d6a1..253636764f 100644
--- a/frappe/twofactor.py
+++ b/frappe/twofactor.py
@@ -30,7 +30,7 @@ def two_factor_is_enabled(user=None):
if bypass_two_factor_auth and user:
user_doc = frappe.get_doc("User", user)
restrict_ip_list = user_doc.get_restricted_ip_list() #can be None or one or more than one ip address
- if restrict_ip_list:
+ if restrict_ip_list and frappe.local.request_ip:
for ip in restrict_ip_list:
if frappe.local.request_ip.startswith(ip):
enabled = False
diff --git a/frappe/website/doctype/web_page_block/web_page_block.json b/frappe/website/doctype/web_page_block/web_page_block.json
index b415567bd0..77f2e25469 100644
--- a/frappe/website/doctype/web_page_block/web_page_block.json
+++ b/frappe/website/doctype/web_page_block/web_page_block.json
@@ -12,7 +12,8 @@
"column_break_5",
"add_container",
"add_padding",
- "add_shade"
+ "add_shade",
+ "hide_block"
],
"fields": [
{
@@ -54,18 +55,24 @@
"default": "0",
"fieldname": "add_shade",
"fieldtype": "Check",
- "label": "Shaded Section"
+ "label": "Add Gray Background"
},
{
"default": "1",
"fieldname": "add_container",
"fieldtype": "Check",
"label": "Add Container"
+ },
+ {
+ "default": "0",
+ "fieldname": "hide_block",
+ "fieldtype": "Check",
+ "label": "Hide Block"
}
],
"istable": 1,
"links": [],
- "modified": "2020-04-19 16:16:44.524042",
+ "modified": "2020-04-29 15:08:25.976179",
"modified_by": "Administrator",
"module": "Website",
"name": "Web Page Block",
diff --git a/frappe/website/doctype/web_template_field/web_template_field.json b/frappe/website/doctype/web_template_field/web_template_field.json
index 09335adf3a..900655e207 100644
--- a/frappe/website/doctype/web_template_field/web_template_field.json
+++ b/frappe/website/doctype/web_template_field/web_template_field.json
@@ -31,7 +31,7 @@
"fieldtype": "Select",
"in_list_view": 1,
"label": "Fieldtype",
- "options": "Attach Image\nCheck\nData\nInt\nSelect\nSmall Text\nText\nMarkdown Editor",
+ "options": "Attach Image\nCheck\nData\nInt\nSelect\nSmall Text\nText\nMarkdown Editor\nSection Break\nColumn Break",
"reqd": 1
},
{
@@ -48,7 +48,7 @@
],
"istable": 1,
"links": [],
- "modified": "2020-04-24 17:05:25.322767",
+ "modified": "2020-04-29 14:53:23.192395",
"modified_by": "Administrator",
"module": "Website",
"name": "Web Template Field",
diff --git a/frappe/website/web_template/hero/hero.html b/frappe/website/web_template/hero/hero.html
index a3fb4aa466..e7b69ab782 100644
--- a/frappe/website/web_template/hero/hero.html
+++ b/frappe/website/web_template/hero/hero.html
@@ -9,22 +9,12 @@
{%- endif -%}
{%- if primary_action or secondary_action -%}
-
+
{%- if primary_action -%}
-
+ {{ c('button', label=primary_action_label, url=primary_action, variant="primary", size="large") }}
{%- endif -%}
{%- if secondary_action -%}
-
+ {{ c('button', label=secondary_action_label, url=secondary_action, variant="secondary", size="large", class="ml-4") }}
{%- endif -%}
{%- endif -%}
diff --git a/frappe/website/web_template/hero_with_right_image/hero_with_right_image.html b/frappe/website/web_template/hero_with_right_image/hero_with_right_image.html
index 57a1a02af7..8efc46a1b7 100644
--- a/frappe/website/web_template/hero_with_right_image/hero_with_right_image.html
+++ b/frappe/website/web_template/hero_with_right_image/hero_with_right_image.html
@@ -1,5 +1,5 @@
-
+
{%- if image -%}
-
+
+{%- if not contain_image -%}
+
+{%- endif -%}
diff --git a/frappe/website/web_template/hero_with_right_image/hero_with_right_image.json b/frappe/website/web_template/hero_with_right_image/hero_with_right_image.json
index bb841a3156..3cb4701e7c 100644
--- a/frappe/website/web_template/hero_with_right_image/hero_with_right_image.json
+++ b/frappe/website/web_template/hero_with_right_image/hero_with_right_image.json
@@ -21,6 +21,12 @@
"label": "Image",
"reqd": 0
},
+ {
+ "fieldname": "contain_image",
+ "fieldtype": "Check",
+ "label": "Restrict Image inside Container",
+ "reqd": 0
+ },
{
"fieldname": "primary_action_label",
"fieldtype": "Data",
@@ -47,7 +53,7 @@
}
],
"idx": 0,
- "modified": "2020-04-26 15:08:26.937576",
+ "modified": "2020-04-29 14:12:31.613545",
"modified_by": "Administrator",
"name": "Hero with Right Image",
"owner": "Administrator",
diff --git a/frappe/website/web_template/navbar_with_links_on_right/navbar_with_links_on_right.html b/frappe/website/web_template/navbar_with_links_on_right/navbar_with_links_on_right.html
index ffa8be24da..01652f8c80 100644
--- a/frappe/website/web_template/navbar_with_links_on_right/navbar_with_links_on_right.html
+++ b/frappe/website/web_template/navbar_with_links_on_right/navbar_with_links_on_right.html
@@ -6,8 +6,8 @@
@@ -22,8 +22,16 @@
- 
-
+ {{ c('image_with_blur',
+ class=["hidden md:block max-h-144", "w-full md:w-6/12" if contain_image else "md:max-w-md lg:max-w-lg xl:max-w-xl xxl:max-w-2xl"],
+ src=image,
+ alt="")
+ }}
{%- endif -%}