feat: simple csv import tool (listview)

Author: ascorbic-acid

README.md

@@ -19,9 +19,13 @@ A simple Browser Extension that help you work & develop in Frappe/ERPNext Framew
 - Copy/Insert any child table all/specific rows from/to any ERPNext site
 - Copy/Insert any Customize Form custom fields from/to any ERPNext site
 - Copy/Insert Doctypes data between ERPNext Sites
+- Simple CSV Files bulk import (usefull also for triggering python db apis, webhooks, server scripts etc) 
 
 
-#### Feel free to contribute in any way to improve the extension if you like it
+#### Credits
+- [Frappe Framework](https://frappeframework.com/)
+- [PapaParse](https://www.papaparse.com/)
+
 
 ## License
 

content.js

@@ -1,3 +1,38 @@
+function get_fieldname(label, docfields) {
+    const field = docfields.find((df) => {
+        if (df.label && df.label === label) {
+            return df
+        }
+    })
+    return field["fieldname"]
+}
+
+async function csvToolReadFile(doctype, docfields, file) {
+    Papa.parse(file, {
+        header: true,
+        transformHeader: function (header, idx) {
+            if (header === "ID") {
+                return "docname"
+            }
+            return get_fieldname(header, docfields)
+        },
+        complete: function (results) {
+            console.log(results);
+            let docs = []
+
+            for (let i = 0; i < results.data.length; i++) {
+                let doc = results.data[i]
+                if (!doc.docname) continue
+                doc["doctype"] = doctype
+
+                docs.push(doc)
+            }
+            backgroundMessage('idf_bg_request__csv-tool-bulk_update', docs);
+        }
+    });
+}
+
+
 // Listen for page scripts
 window.addEventListener("message", async (event) => {
     if (event.origin === window.origin) {
@@ -18,6 +53,12 @@ window.addEventListener("message", async (event) => {
             case "idf_cs_request__listview_show-insert-doc-data-dialog":
                 backgroundMessage('idf_bg_request__listview_show-insert-doc-data-dialog', event.data.payload);
                 break;
+            case "idf_cs_request__listview_show-csv-tool-dialog":
+                backgroundMessage('idf_bg_request__listview_show-csv-tool-dialog', event.data.payload);
+                break;
+            case "idf_cs_request__csv-tool-read_file":
+                csvToolReadFile(event.data.payload.doctype, event.data.payload.docfields, event.data.payload.file)
+                break;
             case "idf_cs_request__childtable_save":
                 backgroundMessage('idf_bg_request__childtable_save', event.data.payload);
                 break;

examples/bulk-update-speed.webm

@@ -104,6 +104,16 @@ function ListviewSetup(tabId) {
                     }
                 });
             });
+
+            // insert docs
+            cur_list.page.add_custom_menu_item(idfGroup, "CSV Tool", () => {
+                postMessage({
+                    eventName: "idf_cs_request__listview_show-csv-tool-dialog",
+                    payload: {
+                        doctype: cur_list.doctype
+                    }
+                });
+            });
         }
     }
         , {}, tabId);

frappe/listview.js

@@ -2,7 +2,7 @@
     "manifest_version": 3,
     "name": "Frappe/ERPNext Tools",
     "description": "Simple Extension that help you work & develop with Frappe/ERPNext Framework",
-    "version": "1.1.5",
+    "version": "1.1.6",
     "icons": {
         "16": "logo/logo.png",
         "48": "logo/logo.png",
@@ -11,7 +11,7 @@
     "permissions": [ "scripting", "storage" ],
     "host_permissions": [ "http://*/app/*", "https://*/app/*" ],
     "content_scripts": [{
-        "js": [ "content.js" ],
+        "js": [ "content.js", "frappe/papaparse.min.js" ],
         "matches": [ "http://*/app/*", "https://*/app/*" ],
         "run_at": "document_end"
     }],

frappe/papaparse.min.js

@@ -439,6 +439,85 @@ async function showInsertDocDataDialog(doctype, bucket = "Current Doc", tabId) {
         , args, tabId);
 }
 
+async function showCSVToolDialog(payload, tabId) {
+    let args = {}
+    idfExec((args) => {
+        let csv_tool_dialog = new frappe.ui.Dialog({
+            title: `${window.idfState.idfLogoUrl1} CSV Tool`,
+            fields: [
+                { label: __("Doctype"), fieldtype: "Data", fieldname: "current_doctype", read_only: 1, default: cur_list.doctype },
+                { fieldtype: "Column Break" },
+                {
+                    label: __("Get Import Template"),
+                    fieldtype: "Button",
+                    description: __("Note: Child Table Fields not supported when importing with this tool"),
+                    click: () => {
+                        frappe.new_doc("Data Import", {
+                            reference_doctype: csv_tool_dialog.get_field("current_doctype").value,
+                            import_type: __("Update Existing Records")
+                        }, () => {
+                            setTimeout(() => {
+                                cur_frm.script_manager.trigger("download_template")
+                            }, 2000)
+                        })
+
+
+                    }
+                },
+                { label: __("Data Import"), fieldtype: "Section Break" },
+                { label: __("Import Type"), fieldtype: "Select", options: ["Create Records", "Update Records"], default: "Update Records", read_only: 1 },
+                {
+                    fieldtype: "HTML",
+                    fieldname: "file_type",
+                    options: `
+                        <div>
+                            <label for="formFileLg" class="form-label">CSV File</label>
+                            <input class="form-control form-control-lg" id="formFileLg" type="file" accept=".csv">
+                        </div>
+                    `
+                },
+            ],
+            primary_action_label: `${window.idfState.idfLogoUrl1} Apply`,
+            primary_action: async function (values) {
+                csv_tool_dialog.hide();
+                let csvFile = document.querySelector("#formFileLg").files[0];
+                postMessage({
+                    eventName: "idf_cs_request__csv-tool-read_file",
+                    payload: {
+                        doctype: cur_list.doctype,
+                        docfields: frappe.meta.get_docfields(cur_list.doctype).map(df => {
+                            return { label: df.label, fieldname: df.fieldname }
+                        }),
+                        file: csvFile
+                    }
+                });
+                frappe.show_alert(`${window.idfState.idfLogoUrl1} in progress, pelase wait...`);
+            }
+        })
+        csv_tool_dialog.show();
+    }
+        , args, tabId);
+}
+
+async function handleCSVToolBulkUpdate(docs, tabId) {
+    const args = { docs: docs }
+
+    idfExec((args) => {
+        frappe.call({
+            method: "frappe.client.bulk_update",
+            args: {
+                docs: args.docs
+            },
+            callback: function (r) {
+                console.log(r.message);
+                frappe.show_alert(`${window.idfState.idfLogoUrl1} Imports (${args.docs.length}), Fails(${r.message.failed_docs.length})`);
+            }
+        })
+    }
+        , args, tabId);
+
+}
+
 async function saveChildTableData(payload) {
     await chrome.storage.local.set({
         "storage__childtable_data": payload
@@ -539,7 +618,7 @@ chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
             if (!window.idfState.pageInit) {
                 window.idfState.pageInit = true;
 
-                // paching frappe script manager to add forms scripting features
+                // hooking frappe script manager to add forms scripting features
                 let oriTrigger = frappe.ui.form.ScriptManager.prototype.trigger;
                 frappe.ui.form.ScriptManager.prototype.trigger = function (...args) {
                     setTimeout(() => {
@@ -551,7 +630,7 @@ chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {
                         , 100);
                     return oriTrigger.call(this, ...args);
                 }
-                // paching frappe setup_view to add listview scripting features
+                // hooking frappe setup_view to add listview scripting features
                 let oriViewSetup = frappe.views.ListView.prototype.setup_view;
                 frappe.views.ListView.prototype.setup_view = function (...args) {
                     setTimeout(() => {
@@ -595,6 +674,11 @@ chrome.runtime.onMessage.addListener(async (event, sender, sendResponse) => {
         case "idf_bg_request__listview_show-insert-doc-data-dialog":
             showInsertDocDataDialog(event.payload.doctype, event.payload.bucket, tabId);
             break;
+        case "idf_bg_request__listview_show-csv-tool-dialog":
+            showCSVToolDialog(event.payload, tabId);
+            break;
+        case "idf_bg_request__csv-tool-bulk_update":
+            handleCSVToolBulkUpdate(event.payload, tabId);
         case "idf_bg_request__childtable_save":
             saveChildTableData(event.payload);
             break;