Pop up Showing the list of items in Purchase Order

ERPNext Customize ERPNext
,
11

Hi @Abai,

You can easily manage it, so please check it.

image
image1920×924 63.4 KB

ListView Client Script:

if (!frappe.listview_settings['Purchase Order']) {
    frappe.listview_settings['Purchase Order'] = {};
}

Object.assign(frappe.listview_settings['Purchase Order'], {
	hide_name_column: true,

	button: {
		show: function (doc) {
			return __("View Items");
		},
		get_label: function () {
			return __("View Items", null, "Access");
		},
		get_description: function (doc) {
			return;
		},
		action: function (doc) {
			frappe.call({
				method: "frappe.client.get",
				args: {
					doctype: "Purchase Order",
					name: doc.name
				},
				callback: function (response) {
					if (response.message) {
						var items = response.message.items;
						var item_table = "<table class='table table-bordered table-condensed' border='1' style='width: 100%;'><tr> \
						<th style='width: 20%;'>Item Code</th> \
						<th style='width: 30%;'>Item Name</th> \
						<th style='width: 15%; text-align: right;'>Qty</th> \
						<th style='width: 15%; text-align: right;'>Rate</th> \
						<th style='width: 20%; text-align: right;'>Amount</th></tr>";
				
						items.forEach(function (item) {
							item_table += "<tr> \
							<td style='width: 20%;'>" + item.item_code + "</td> \
							<td style='width: 30%;'>" + item.item_name + "</td> \
							<td style='width: 15%; text-align: right;'>" + item.qty + "&emsp;" + item.uom + "</td> \
							<td style='width: 15%; text-align: right;'>" + item.rate + "</td> \
							<td style='width: 20%; text-align: right;'>" + item.amount + "</td></tr>";
						});
				
						item_table += "</table>";

						let dialog = new frappe.ui.Dialog({
							title: "Purchase Order Items: " + doc.name,
							size: 'large',
						});

						dialog.$body.html(item_table);
						dialog.show();
					}
				}
			});
		},
	}
});
3 Likes