I'm not sure what is happening with this project, it works locally but is having problem on server

Question

I'm trying to move a project from local to server, and it's not working like it does in the local and I don't know what is going on. I have products and when I edit them it's not bringing the info from the database like it does locally, it brings 2 very important numbers as 0 when I know the database doesn't have those numbers as 0, without these the price cannot be calculated.

this is the information its bringing for a product

[ { "country": { "id": 1, "name": "COSTA RICA", "currency_symbol": "CRC" }, "country_id": 1, "margin": 0, "fi": 0 }, 
{ "country": { "id": 2, "name": "NICARAGUA", "currency_symbol": "COR" }, "country_id": 2, "margin": 0, "fi": 0 }, 
{ "country": { "id": 3, "name": "HONDURAS", "currency_symbol": "HNL" }, "country_id": 3, "margin": 0, "fi": 0 } ]

for this product in the database it has the margin and fi as

product_id: 1
country_id: 1
margin: 0.65
fi: 0.50

product_id: 1
country_id: 2
margin: 0.65
fi: 0.50

product_id: 1
country_id: 3
margin: 0.65
fi: 0.50

The edit products is a clone of the create model, for some reason it's not bringing the info like it should.

This is the function that opens the create and edit dialogs.

showDialog(model) {
    if (this.processing) {
        return;
    }
    if (model) {
        let cloneModel = {...model};
        this._formatModel(cloneModel);
        this.actionText = 'Actualizar';
        this.form = cloneModel
    } else {
        this.dialogTitle = 'Nuevo';
        this.actionText = 'Agregar';
        this._isNew();
            if (this.form.id) {
                this._resetForm();
                this.$refs.form.resetFields()
            }
    }

    this.dialogTitle = this._getDialogTitle(this.form);
    this.dialogVisible = true
}

_formatModel(model) {
    this.productCategories = [];

    this.loadingResource = true;
    this.$http.post(this.baseUrl + '/show/' + model.id).then(
        (res) => {
            this.model.export_factors = this.countries.map((country) => {
            let result = res.body.export_factors.filter((item) => item.country_id === country.id);
            let margin = 0;
            let fi = 0;

            if (result.length > 0) {
                margin = result[0].margin;
                fi = result[0].fi;
            }
            return {
                country: country,
                country_id: country.id,
                margin: margin,
                fi: fi,
            }
        });
        this.model.prices = this.countries.map((country) => {
            let result = res.body.prices.filter((item) => item.country_id === country.id);
            let resultExport = res.body.export_factors.filter((item) => item.country_id === country.id);
            let price = 0;

            if (result.length > 0) {
                price = (this.form.cif / resultExport[0].margin) / resultExport[0].fi;
            }
            return {
                country: country,
                country_id: country.id,
                price: price.toFixed(2),
            }
        });
        this.productCategories = res.body.categories.map((category) => {
            category.fields = category.fields.map(item => {
                item.allFields = [item.field];
                return item;
            });
            return category;
        });
        this.form.tags = res.body.tags;
        this.form.sizes = res.body.sizes;
        this.loadingResource = false;
    },
    (res) => {
        this.loadingResource = false;
        this.dialogVisible = false;
        this.$message.error(parseError(res)[0])
    }
  )
},

_isNew() {
    this.model.prices = this.countries.map((country) => {
        return {
            country: country,
            country_id: country.id,
            price: 0,
        }
    });

    this.model.export_factors = this.countries.map((country) => {
        return {
            country: country,
            country_id: country.id,
            fi: 0,
            margin: 0
        }
    });
    this.productCategories = [];
}

What could be happening?

Answer 1

There might be some problem with your comparison inside filter function. You can just parse the id into integer while comparing two ids as below. I'm just correcting your _formatModel

_formatModel(model) {
this.productCategories = [];

this.loadingResource = true;
this.$http.post(this.baseUrl + '/show/' + model.id).then(
    (res) => {
        this.model.export_factors = this.countries.map((country) => {
        let result = res.body.export_factors.filter((item) => parseInt(item.country_id) === parseInt(country.id));
        let margin = 0;
        let fi = 0;

        if (result.length > 0) {
            margin = result[0].margin;
            fi = result[0].fi;
        }
        return {
            country: country,
            country_id: country.id,
            margin: margin,
            fi: fi,
        }
    });
    this.model.prices = this.countries.map((country) => {
        let result = res.body.prices.filter((item) => parseInt(item.country_id) === parseInt(country.id));
        let resultExport = res.body.export_factors.filter((item) => parseInt(item.country_id) === parseInt(country.id));
        let price = 0;

        if (result.length > 0) {
            price = (this.form.cif / resultExport[0].margin) / resultExport[0].fi;
        }
        return {
            country: country,
            country_id: country.id,
            price: price.toFixed(2),
        }
    });
    this.productCategories = res.body.categories.map((category) => {
        category.fields = category.fields.map(item => {
            item.allFields = [item.field];
            return item;
        });
        return category;
    });
    this.form.tags = res.body.tags;
    this.form.sizes = res.body.sizes;
    this.loadingResource = false;
},
(res) => {
    this.loadingResource = false;
    this.dialogVisible = false;
    this.$message.error(parseError(res)[0])
}

) },