Security at Client Side (Browser) to protect from all kinds of Fraud

Some of the fraud transaction are noticed in my application. Below are key pattern noticed

1) Real user starts transactions at his machine. He completes his transaction for lower amount like $50 and he is not able to notice any fraud until he prints receipt which shows large amounts like $1000.
2) Screen shows $50 in all the screens but all the request going to server are of modified large amount.
3) ISP of all the request for such transactions are changed, that is they are not from the real user's ISP.

Key security configuration on my application

1. Javascript on the front end
   
2. Server side, rest endpoints exposed.
   
3. Single token to Authorize the requests.
   
4. X-XSS-Protection: 1; mode=block
   
5. X-Content-Type-Options:"nosniff"
   
6. Content-Type: text/html; charset=UTF-8
   
7. HTTPS
   

Two questions:
1) Need to understand how exactly this fraud is possible. With the given pattern, any clue how hacker is able to do these fraud transactions?
2) I am planning to add following security features

• Data encryption on the client-side
  
• CSP
  
• Block Developer Tools
  
• OAuth 2.0
  

What else I can do to secure my application?