Qb-hud commas in money [QBCore]

A friend asked how to add commas to the cash hud so it’s easier to read how much cash you have. So I wrote some code that does the trick.

In the QB-hud client.lua at the bottom add the following code from https://stackoverflow.com/a/10992898:

function format_int(number)

    local i, j, minus, int, fraction = tostring(number):find('([-]?)(%d+)([.]?%d*)')
  
    -- reverse the int-string and append a comma to all blocks of 3 digits
    int = int:reverse():gsub("(%d%d%d)", "%1,")
  
    -- reverse the int-string back remove an optional comma and put the 
    -- optional minus and fractional part back
    return minus .. int:reverse():gsub("^,", "") .. fraction
end

Now find similar code and replace with:

RegisterNetEvent('hud:client:ShowAccounts', function(type, amount)
    if type == 'cash' then
        SendNUIMessage({
            action = 'show',
            type = 'cash',
            cash = format_int(string.format("%.2f", amount))
        })
    else
        SendNUIMessage({
            action = 'show',
            type = 'bank',
            bank = format_int(string.format("%.2f", amount))
        })
    end
end)
RegisterNetEvent('hud:client:OnMoneyChange', function(type, amount, isMinus)
    cashAmount = format_int(string.format("%.2f",PlayerData.money['cash']))
    bankAmount = format_int(string.format("%.2f",PlayerData.money['bank']))
    SendNUIMessage({
        action = 'updatemoney',
        cash = cashAmount,
        bank = bankAmount,
        amount = format_int(string.format("%.2f", amount)),
        minus = isMinus,
        type = type
    })
end)

I hope this helps someone like it helped out my friend. :v:

2 Likes

If you would rather want to do it on the javascript side:

Replace lines 656 to 707 with :

methods: {
    showConstant(data) {
      this.showCash = true;
      this.showBank = true;
      this.cash = formatMoney(data.cash);
      this.bank = formatMoney(data.bank);
    },
    update(data) {
      this.showUpdate = true;
      this.amount = data.amount;
      this.bank = formatMoney(data.bank);
      this.cash = formatMoney(data.cash);
      this.minus = data.minus;
      this.plus = data.plus;
      if (data.type === "cash") {
        if (data.minus) {
          this.showCash = true;
          this.minus = true;
          setTimeout(() => (this.showUpdate = false), 1000);
          setTimeout(() => (this.showCash = false), 2000);
        } else {
          this.showCash = true;
          this.plus = true;
          setTimeout(() => (this.showUpdate = false), 1000);
          setTimeout(() => (this.showCash = false), 2000);
        }
      }
      if (data.type === "bank") {
        if (data.minus) {
          this.showBank = true;
          this.minus = true;
          setTimeout(() => (this.showUpdate = false), 1000);
          setTimeout(() => (this.showBank = false), 2000);
        } else {
          this.showBank = true;
          this.plus = true;
          setTimeout(() => (this.showUpdate = false), 1000);
          setTimeout(() => (this.showBank = false), 2000);
        }
      }
    },

Now head over to line 624 and paste the following:

// CONFIGURE YOUR CURRENCY HERE
// https://www.w3schools.com/tags/ref_language_codes.asp LANGUAGE CODES
// https://www.w3schools.com/tags/ref_country_codes.asp COUNTRY CODES
function formatMoney(value) {
  const formatter = new Intl.NumberFormat("en-US", {
    minimumFractionDigits: 2,
    maximumFractionDigits: 2,
  })
  return formatter.format(value);
}
1 Like

How do I add it if I want it to display the ID?

1 Like