Add Shortcut, focus keys on POS Awesome App for ERPNext

ERPNext
1

How to achive for posapp page?

  • Search Items
    • Search Item via “Partial Barcode” same like partial Item Name
    • Item Selection via Arrow Key down / Arrow Key Up from Search Item field to Next Filtered Items
      • While Keyword/partial barcode Search, drop down list should be appeared for item selection or
      • Or unable the item selection on Card View / List view via arrow key,
      • When press Enter item must go to cart
    • key for all text selection on Search Item input is required to amend or erase
    • Shortcut key / Focus on Search Items is required [ALT+F]
  • Focus on Customer Key is required [ALT+C]
  • Payment
    • While check out at Payment Section, Auto Focus on First input field is required
    • On POS Profile Setting, Required Control radio button for allow and not allowed “Submit Button”
    • Short Key for Submit and Print Button is required
    • Esc Key is required to Cancel the Payment Screen/Section
    • Focus on SalesPerson field [ALT+S]
  • Item Selection
    • While Edit Quantity, don’t need to expand first item from the top, need to amend the quantity without expand the item
  • Invoice
    • ALT+V will be used to Cancel
    • ALT+H will be used to Hold the invoice
    • ALT+R will be used to Return invoice
    • ALT+E will be used to Retrieve invoice
  • Hold Invoice Popup Section
    • Required Arrow key up/down to select the invoice and after selection and press enter to retrieve the invoice
    • Enhance the invoice selection area, click anywhere on row to select the invoice is required
2

after updating invoice.vue file with


    shortCancelDialog(e) {
      if (e.key === "c" && (e.ctrlKey || e.metaKey)) {
        e.preventDefault();
        this.cancel_dialog = true;
      }
    },

    shortHoldInvoice(e) {
      if (e.key === "b" && (e.ctrlKey || e.metaKey)) {
        e.preventDefault();
        this.new_invoice();
      }
    },

    shortRetriveInvoice(e) {
      if (e.key === "b" && e.altKey) {
        e.preventDefault();
        this.get_draft_invoices ();
      }
    },

    shortReturnInvoice(e) {
      if (e.key === "r" && e.altKey) {
        e.preventDefault();
        this.open_returns ();
      }
    },


  created() {
    document.addEventListener("keydown", this.shortCancelDialog.bind(this));
    document.addEventListener("keydown", this.shortHoldInvoice.bind(this));
    document.addEventListener("keydown", this.shortRetriveInvoice.bind(this));
    document.addEventListener("keydown", this.shortReturnInvoice.bind(this));
  },
  destroyed() {
    document.removeEventListener("keydown", this.shortCancelDialog);
    document.removeEventListener("keydown", this.shortHoldInvoice);
    document.removeEventListener("keydown", this.shortRetriveInvoice);
    document.removeEventListener("keydown", this.shortReturnInvoice);
  },

sucessfully added shortcut keys for Invoice