Is there any possibilitty to customize POS using an App

I want to customize the POS using an App. Is there any possibility to do this.?

Hi @nishith,

I am trying to achieve the same, did you resolve this?

In a custom app, I have added in hooks.py

page_js = { "pos": "public/js/pos_extension.js",
    "point-of-sale": "public/js/pos_extension.js" }

Added a custom script in public/js with a corresponding build.json

{
    "js/pos_Extension.js": {
        "public/js/pos_extension.js"
    ]
}

And in public/js/pos_extension.js

console.log("Loading POS extensions...");

frappe.pages['pos'].refresh = function (wrapper) {
    var action_bar = document.getElementsByClassName('page-actions');
    var newButton = document.createElement("div");
    if (action_bar.length > 0) {
        // action_bar[0].addChild(newButton); // throws an error
        action_bar[0].innerHTML += "<button class=\"btn btn-primary\"><span class=\"hidden-xs\">More</span></button>"; // this will override all buttons
        console.log("button added");
    }
}

This will add a “more” button and would allow to add in functions. My only issue is that this will kick out the normal buttons… (altough they are still in the html, they are not shown)

Does anyone have an idea how to not kick out the other buttons?

If you are looking to add a primary action this would work in your script.

cur_page.page.page.set_primary_action("Custom Action",()=>{})

Other options depending on what you would like to display…

cur_page.page.page.add_action_icon(...)
cur_page.page.page.add_action_item(...)

Thanks @vijaywm, his worked:

frappe.pages['pos'].refresh = function (wrapper) {
    // add entries to action menu
    cur_page.page.page.add_action_item("Closer register", function() {
        frappe.msgprint("Closing register for today!");
    });    
} 

The primary_action gets overwritten by the standard, and the icon is not visible.

1 Like

Hello @lasalesi,
Does this work in the Client script?