apply this code to both the child doc and the parent

frappe.ui.form.on('Child doctype', {
amount: function(frm, dt, dn){
calculate_total_amount(frm, dt, dn)
},
});
frappe.ui.form.on('Parent Doctype', {
onload_post_render: function(frm, dt, dn){
if(frm.doc.docstatus==0 || frm.doc.docstatus==2)
{
calculate_total_amount(frm, dt, dn)
}
},
});
let calculate_total_amount = function (frm, dt, dn){
let total_amount = 0.0;
var tbl = cur_frm.doc.items || [];
for(var i = 0; i < tbl.length; i++) {
total_amount+=flt(tbl[i].amount)
}
frm.set_value("total",total_amount);
refresh_field("total")
}

this will ensure that every time you enter the doctype it will calculate the amount and set total
and when you change the amount in child doc also will calculate it again according to current number

So it didn’t allow me to use a function before defining it so I had to put the top two pieces of code at the bottom, but it doesn’t seem to have worked.

let calculate_total_amount = function (frm, dt, dn){
let total_amount = 0.0;
var tbl = cur_frm.doc.items || [];
for(var i = 0; i < tbl.length; i++) {
total_amount+=flt(tbl[i].amount);
}
frm.set_value("Total",total_amount);
refresh_field("Total");

let calculate_total_amount = function (frm, dt, dn){
let total_amount = 0.0;
var tbl = cur_frm.doc.items || [];
for(var i = 0; i < tbl.length; i++) {
total_amount+=flt(tbl[i].amount);
}
frm.set_value("Total",total_amount);
refresh_field("Total");

OK, So what happen when you enter the doctype or change amount
you can see what happen in console (by right click , inspect)
please share what happen in console

So here is the error that appeared multiple times in the console:

Uncaught (in promise) TypeError: Cannot read property ‘doc’ of undefined
at field.df.onchange (grid_row.js:399)
at o.field.df.onchange (grid_row.js:398)
at base_control.js:158