How can I assign the value of an element to another related element if it is disabled?

[vihilog413]

Environment:

Ionic: 6.20.1

Angular CLI: 10.0.8

I am working on a mobile application to control expenses, implementing a function that calculates how much should be spent in a category of spending (eg how much should be spent on the home).

Problem:

I have a list of checkboxes that the user selects as desired. These correspond to spending categories (eg home ❏, study ❏, entertainment ❏) which are related. For example, the category “Home 15%” is related to the category “Purchases 6%”, this is done so that if a category is deactivated, its percentage goes to the related category (If home is deactivated, purchases would become 21 %) This selection is saved to the database and retrieved to check the status, thereby establishing a recommended spend percentage value.

What I want to do:

As I mentioned, if a category is deactivated, its value passes to the next one. With this, I would like to know how to fulfill the following conditions:

• If a category is disabled (false), its value is passed to its related category.
• If two categories that are related are deactivated, their value would go to a third related category (eg “home 15%” is deactivated, “shopping 6%” is deactivated, its value would go to “food → 49%”).
• If three related categories are disabled, pass part of its value to savings (which is worth 10% of the total) and another part to another category. (eg “household 15%” is off, “shopping 6%” is off, “food 28%” is off, this adds up to 49%, of which 20 would go to savings [saving 30%] and 29% to another category called “others” [with a value of 5% + 29% = 34%])

The solution I have found:

What I have done is to make conditions encompassing all the categories and checking that if one is false, it remains at 0 and its value passes to its related category.

/* In this example, if home is false, its value is passed to its relative without affecting the default value of the other categories that are not being affected */

            if (i.home== false && i.shopping == true && i.food == true && i.others == true &&
                i.pets == true && i.debts == true && i.subscription == true && i.transportation == true &&
                i.education == true && i.entertainment == true) {
                this.sumaCatPurchases = (this.sumaTotalIncomes * 0.21).toFixed(2); // Here I assign the recommended percentage of the total
                this.sumaCatFood = (this.sumaTotalIncomes * 0.28).toFixed(2);
                this.sumaCatOthers = (this.sumaTotalIncomes * 0.05).toFixed(2);
                this.sumaCatPets = (this.sumaTotalIncomes * 0.05).toFixed(2);
                this.sumaCatDebts = (this.sumaTotalIncomes * 0.05).toFixed(2);
                this.sumaCatSubscription = (this.sumaTotalIncomes * 0.04).toFixed(2);
                this.sumaCatTransportation = (this.sumaTotalIncomes * 0.08).toFixed(2);
                this.sumaCatEducation = (this.sumaTotalIncomes * 0.05).toFixed(2);
                this.sumaCatEntertainment = (this.sumaTotalIncomes * 0.05).toFixed(2);
           }

This is how I do it for each situation, only changing the true value to false and leaving the rest of the categories with their normal value so that they are not affected.

The problem with this method is that you have to set all the values ​​of the other categories (which is a lot of code) and if I want to deselect more than one, I have to write all this for each situation, also if I want to cover all the situations ( I have deselected 1, 2, 3 or 4 categories) the scenarios I would have to do would be inhumane (like 2.3041802e+47 according to combinatorial theory) doing one by one. I don’t know how I could cover this.

I’m very sorry for so much text, but it’s a broad topic that I don’t know how to cover. I would really appreciate someone to give me a way or advice on what I could do in this situation. Thanks in advance