fix: column formatting in Bank Reconciliation Tool (#35540)

* fix(Bank Reconciliation): format Date column

* fix(Bank Reconciliation): format Party column

* fix(Bank Reconciliation): actions button

- wrong closing tag
- explicitly quote data-name

* fix(Bank Reco): format date and link in dialog

erpnext/public/js/bank_reconciliation_tool/data_table_manager.js

@@ -40,8 +40,8 @@ erpnext.accounts.bank_reconciliation.DataTableManager = class DataTableManager {
 				name: __("Date"),
 				editable: false,
 				width: 100,
+				format: frappe.form.formatters.Date,
 			},
-
 			{
 				name: __("Party Type"),
 				editable: false,
@@ -117,17 +117,13 @@ erpnext.accounts.bank_reconciliation.DataTableManager = class DataTableManager {
 		return [
 			row["date"],
 			row["party_type"],
-			row["party"],
+			frappe.form.formatters.Link(row["party"], {options: row["party_type"]}),
 			row["description"],
 			row["deposit"],
 			row["withdrawal"],
 			row["unallocated_amount"],
 			row["reference_number"],
-			`
+			`<button class="btn btn-primary btn-xs center" data-name="${row["name"]}">${__("Actions")}</button>`
-			<Button class="btn btn-primary btn-xs center"  data-name = ${row["name"]} >
-				${__("Actions")}
-			</a>
-			`,
 		];
 	}
 

erpnext/public/js/bank_reconciliation_tool/dialog_manager.js

@@ -76,30 +76,17 @@ erpnext.accounts.bank_reconciliation.DialogManager = class DialogManager {
 			callback: (result) => {
 				const data = result.message;
 
-
 				if (data && data.length > 0) {
 					const proposals_wrapper = this.dialog.fields_dict.payment_proposals.$wrapper;
 					proposals_wrapper.show();
 					this.dialog.fields_dict.no_matching_vouchers.$wrapper.hide();
-					this.data = [];
+					this.data = data.map((row) => this.format_row(row));
-					data.forEach((row) => {
-						const reference_date = row[5] ? row[5] : row[8];
-						this.data.push([
-							row[1],
-							row[2],
-							reference_date,
-							format_currency(row[3], row[9]),
-							row[4],
-							row[6],
-						]);
-					});
 					this.get_dt_columns();
 					this.get_datatable(proposals_wrapper);
 				} else {
 					const proposals_wrapper = this.dialog.fields_dict.payment_proposals.$wrapper;
 					proposals_wrapper.hide();
 					this.dialog.fields_dict.no_matching_vouchers.$wrapper.show();
-
 				}
 				this.dialog.show();
 			},
@@ -122,6 +109,7 @@ erpnext.accounts.bank_reconciliation.DialogManager = class DialogManager {
 				name: __("Reference Date"),
 				editable: false,
 				width: 120,
+				format: frappe.form.formatters.Date,
 			},
 			{
 				name: __("Remaining"),
@@ -141,6 +129,17 @@ erpnext.accounts.bank_reconciliation.DialogManager = class DialogManager {
 		];
 	}
 
+	format_row(row) {
+		return [
+			row[1], // Document Type
+			frappe.form.formatters.Link(row[2], {options: row[1]}), // Document Name
+			row[5] || row[8], // Reference Date
+			format_currency(row[3], row[9]), // Remaining
+			row[4], // Reference Number
+			row[6], // Party
+		];
+	}
+
 	get_datatable(proposals_wrapper) {
 		if (!this.datatable) {
 			const datatable_options = {