From 143196613a290f29962e724da2550c4daca89c21 Mon Sep 17 00:00:00 2001 From: Luiz Costa Date: Fri, 7 Jun 2024 15:56:50 +0100 Subject: [PATCH 1/5] try setting size modal --- fleet_management/fleet_management/doctype/trip/trip_list.js | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/fleet_management/fleet_management/doctype/trip/trip_list.js b/fleet_management/fleet_management/doctype/trip/trip_list.js index dfb37a5..28b50a9 100644 --- a/fleet_management/fleet_management/doctype/trip/trip_list.js +++ b/fleet_management/fleet_management/doctype/trip/trip_list.js @@ -8,7 +8,7 @@ function loadLeafletAndInitMap(frm, callback) { function create_dialog_and_init_map(frm) { const dialog = new frappe.ui.Dialog({ title: 'Show Route', - fields: [{ fieldtype: 'HTML', fieldname: 'map_html', label: 'Map', options: '
' }], + fields: [{ fieldtype: 'HTML', fieldname: 'map_html', label: 'Map', options: '
' }], primary_action_label: 'Close', primary_action() { if (currentMap) { @@ -20,7 +20,8 @@ function create_dialog_and_init_map(frm) { }); // Adjust the size of the dialog - dialog.$wrapper.find('.modal-content').css("width", "850px"); + dialog.$wrapper.find('.modal-content').css("width", "80%"); + dialog.$wrapper.find('.modal-content').css("margin-left", '-80%'); //dialog.$wrapper.find('.modal-content').css("height", "600px"); // Add hide event to reload the page when the dialog is closed From f918013d14dbb2e82499059d0219b8cac3bc901d Mon Sep 17 00:00:00 2001 From: Luiz Costa Date: Fri, 7 Jun 2024 16:00:14 +0100 Subject: [PATCH 2/5] set map size --- fleet_management/fleet_management/doctype/trip/trip_list.js | 1 + 1 file changed, 1 insertion(+) diff --git a/fleet_management/fleet_management/doctype/trip/trip_list.js b/fleet_management/fleet_management/doctype/trip/trip_list.js index 28b50a9..014670e 100644 --- a/fleet_management/fleet_management/doctype/trip/trip_list.js +++ b/fleet_management/fleet_management/doctype/trip/trip_list.js @@ -22,6 +22,7 @@ function create_dialog_and_init_map(frm) { // Adjust the size of the dialog dialog.$wrapper.find('.modal-content').css("width", "80%"); dialog.$wrapper.find('.modal-content').css("margin-left", '-80%'); + dialog.$wrapper.find('#map').css("width", '100%'); //dialog.$wrapper.find('.modal-content').css("height", "600px"); // Add hide event to reload the page when the dialog is closed From 7c31300b02a0233749cf65c35dbec0acf6daa36e Mon Sep 17 00:00:00 2001 From: Luiz Costa Date: Fri, 7 Jun 2024 16:01:37 +0100 Subject: [PATCH 3/5] try use native options --- .../fleet_management/doctype/trip/trip_list.js | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/fleet_management/fleet_management/doctype/trip/trip_list.js b/fleet_management/fleet_management/doctype/trip/trip_list.js index 014670e..853b3d8 100644 --- a/fleet_management/fleet_management/doctype/trip/trip_list.js +++ b/fleet_management/fleet_management/doctype/trip/trip_list.js @@ -16,13 +16,14 @@ function create_dialog_and_init_map(frm) { currentMap = null; // unset the reference } dialog.hide(); - } + }, + size: 'extra-large' }); // Adjust the size of the dialog - dialog.$wrapper.find('.modal-content').css("width", "80%"); - dialog.$wrapper.find('.modal-content').css("margin-left", '-80%'); - dialog.$wrapper.find('#map').css("width", '100%'); + //dialog.$wrapper.find('.modal-content').css("width", "80%"); + //dialog.$wrapper.find('.modal-content').css("margin-left", '-80%'); + //dialog.$wrapper.find('#map').css("width", '100%'); //dialog.$wrapper.find('.modal-content').css("height", "600px"); // Add hide event to reload the page when the dialog is closed From 7545c0e25df41dc1090d7d1363f75f139d5bd69e Mon Sep 17 00:00:00 2001 From: Luiz Costa Date: Fri, 7 Jun 2024 16:07:15 +0100 Subject: [PATCH 4/5] redo config --- .../fleet_management/doctype/trip/trip_list.js | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) diff --git a/fleet_management/fleet_management/doctype/trip/trip_list.js b/fleet_management/fleet_management/doctype/trip/trip_list.js index 853b3d8..c594262 100644 --- a/fleet_management/fleet_management/doctype/trip/trip_list.js +++ b/fleet_management/fleet_management/doctype/trip/trip_list.js @@ -8,7 +8,7 @@ function loadLeafletAndInitMap(frm, callback) { function create_dialog_and_init_map(frm) { const dialog = new frappe.ui.Dialog({ title: 'Show Route', - fields: [{ fieldtype: 'HTML', fieldname: 'map_html', label: 'Map', options: '
' }], + fields: [{ fieldtype: 'HTML', fieldname: 'map_html', label: 'Map', options: '
' }], primary_action_label: 'Close', primary_action() { if (currentMap) { @@ -20,12 +20,6 @@ function create_dialog_and_init_map(frm) { size: 'extra-large' }); - // Adjust the size of the dialog - //dialog.$wrapper.find('.modal-content').css("width", "80%"); - //dialog.$wrapper.find('.modal-content').css("margin-left", '-80%'); - //dialog.$wrapper.find('#map').css("width", '100%'); - //dialog.$wrapper.find('.modal-content').css("height", "600px"); - // Add hide event to reload the page when the dialog is closed dialog.onhide = function () { window.location.reload(); From ac6b9038e91fa8f65191ed54211fb2990cb2fab1 Mon Sep 17 00:00:00 2001 From: David Malinowski Date: Fri, 7 Jun 2024 17:29:17 +0200 Subject: [PATCH 5/5] set modal and maps right --- .../fleet_management/doctype/trip/trip_list.js | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/fleet_management/fleet_management/doctype/trip/trip_list.js b/fleet_management/fleet_management/doctype/trip/trip_list.js index c594262..05f0343 100644 --- a/fleet_management/fleet_management/doctype/trip/trip_list.js +++ b/fleet_management/fleet_management/doctype/trip/trip_list.js @@ -8,7 +8,7 @@ function loadLeafletAndInitMap(frm, callback) { function create_dialog_and_init_map(frm) { const dialog = new frappe.ui.Dialog({ title: 'Show Route', - fields: [{ fieldtype: 'HTML', fieldname: 'map_html', label: 'Map', options: '
' }], + fields: [{ fieldtype: 'HTML', fieldname: 'map_html', label: 'Map', options: '
' }], primary_action_label: 'Close', primary_action() { if (currentMap) { @@ -20,6 +20,14 @@ function create_dialog_and_init_map(frm) { size: 'extra-large' }); + // Adjust the size of the dialog dynamically to 80% of the browser window + const modalDialog = dialog.$wrapper.find('.modal-content'); + modalDialog.css({ + "width": "85vw", + "max-width": "85vw", + "margin-left": "-25vh" + }); + // Add hide event to reload the page when the dialog is closed dialog.onhide = function () { window.location.reload();