0

tengo que hacer una especia de hoja de formalizacion deonde en el handleChange capturo y añado todos lo valores a formData, y en Recalcular valores me tiene que hacer los calculos pertinentes para calcular comisiones dependiendo del porcentaje que tengan.

añado codigo

const [formData, setFormData] = useState({
        propiedades: [],
        aaff: [],
        colaboradores: [],
    });

const handleChange = (e, propiedad) => {
        const { name, value } = e.target;
        let tipoCom = formData?.tipoCom /*parseFloat(formData.tipoCom) / 100 ||  0*/;
        let porLae = parseFloat(formData.porLae) / 100 || 0;
        let porAaff = Array.isArray(formData.aaff) ? formData.aaff[0]?.porAaff || 0 : formData?.aaff?.porAaff || 0;
        let porCola = Array.isArray(formData.colaboradores) ? formData.colaboradores[0]?.porCola || 0 : formData?.colaboradores?.porCola || 0;
        let porCap = parseFloat(formData.porCaptador) / 100 || 0;
        let porVend = parseFloat(formData.porVendedor) / 100 || 0;
        let porCoor = parseFloat(formData.porCoor) / 100 || 0;
        let porRespo = parseFloat(formData.porRespo) / 100 || 0;
        

        setFormData(prevState => ({
            ...prevState,
            ["total"]: importe,
            ["fechaOperacion"]: fechaOperacion
        }));

        if (name === 'accion') {
            setFormData(prevState => ({ ...prevState, [name]: value }));
        };
        if (name === 'haya') {
            setHaya(!haya);
            setFormData(prevState => ({ ...prevState, [name]: e.target?.checked }));
        };
        if (name === 'opCompartida') {
            const isCompartida = e.target?.checked;
            setIsCompartida(isCompartida);
            setFormData(prevState => ({
                ...prevState,
                [name]: isCompartida,
                porLae: !isCompartida ? 0 : prevState.porLae
            }));
            let updatedPorLae = 0;
            if (isCompartida === true) {
                updatedPorLae = formData.porLae / 100;
            }
            recalcularValores(isCompartida, tipoCom, updatedPorLae, porAaff, porCola, porCap, porVend, porCoor, porRespo);

        };
        if(name === 'comision'){
            const parsedValue = parseFloat(value);
            if (!importe || importe === 0 || isNaN(parsedValue)) {
                setComision(0);
                return;
            }
            setComision(parsedValue);
            let el_porcentaje = (parsedValue / importe) * 100;
            el_porcentaje = parseFloat(el_porcentaje.toFixed(2)); 
            
            setFormData(prevState => ({
                ...prevState,
                tipoCom: el_porcentaje,
                totalComisionNeta: parsedValue,  
            }));
            setTotalComision(parsedValue);
            recalcularValores(isCompartida, el_porcentaje, porLae, porCoor, porRespo, porAaff, porCap, porVend, porCola);
        }
        if (['direccion_propiedad', 'ciudad_propiedad', 'cp_propiedad', 'importe_propiedad', 'promocion'].includes(name)) {
            setPropedades(prevState =>
                prevState.map(prop =>
                    prop.id === propiedad.id ? { ...prop, [name.split('_')[0]]: value } : prop
                )
            );
            setFormData(prevState => ({
                ...prevState,
                propiedades: Array.isArray(prevState.propiedades) ?
                    prevState.propiedades.map(prop =>
                        prop.id === propiedad.id ? { ...prop, [name.split('_')[0]]: value } : prop
                    ) : []
            }));
        };
        if (['tipoCom', 'porLae','porCoor', 'porRespo', 'porAaff', 'porCola', 'porCaptador', 'porVendedor'].includes(name)) {
            const parsedValue = parseFloat(value) / 100;
          
            if (name === 'porCoor') {
                porCoor = parsedValue; 
            }
            if (name === 'porRespo') {
                porRespo = parsedValue;
            }
            if (name === 'porCaptador') {
                porCap = parsedValue;
            }
            if (name === 'porAaff') {
                setFormData(prevState => {
                    const newFormData = { ...prevState };
                    if (name === 'porAaff') {
                        if (!Array.isArray(newFormData.aaff)) {
                            newFormData.aaff = []; 
                        }
                        if (newFormData.aaff.length === 0) {
                            newFormData.aaff.push({ porAaff: value }); 
                        } else {
                            newFormData.aaff[0].porAaff = value; 
                        }
                    } else {
                        newFormData[name] = value;
                    }
                    return newFormData; 
                });
                porAaff = value;
                recalcularValores(isCompartida, tipoCom, porLae, porCoor, porRespo, porAaff, porCap, porVend, porCola);
            } 
            if (name === 'porCola') {
                setFormData(prevState => {
                    const newFormData = { ...prevState };
                    if (Array.isArray(newFormData.colaboradores)) {
                        if (newFormData.colaboradores.length > 0) {
                            newFormData.colaboradores[0].porCola = value;
                        } else {
                            newFormData.colaboradores.push({ porCola: value });
                        }
                    } else if (typeof newFormData.colaboradores === 'object' && newFormData.colaboradores !== null) {
                        newFormData.colaboradores.porCola = value;
                    } else {
                        newFormData.colaboradores = { porCola: value };
                    }

                    return newFormData;
                });
                porCola = value;
                recalcularValores(isCompartida, tipoCom, porLae, porCoor, porRespo, porAaff, porCaptador, porVend, porCola);
            }
            if (name === 'porVendedor') {
                porVend = parsedValue;
            }
            if (name === 'tipoCom') {
                tipoCom = value; 
                const nuevaComision = importe * (tipoCom / 100); 
                setComision(parseInt(nuevaComision));
                setTotalComision(parsedValue);

            }
            if (name === 'porLae') {
                porLae = parsedValue;
            }
            setFormData(prevState => ({ ...prevState, [name]: value }));
            recalcularValores(isCompartida, tipoCom, porLae, porCoor, porRespo, porAaff, porCap, porVend, porCola);
        }
        
        const UpdateedProps = propiedades?.map(prop => {
            return {
                id_prop: prop?.id,
                cp: prop?.cp,
                direccion: prop?.direccion,
                promocion: prop?.promocion,
                municipio: prop?.ciudad,
                importe: prop?.precioinmo || prop?.importe,
            }
        });
        setFormData(prevState => ({
            ...prevState,
            ["id_captador"]: formData.captador?.id,
            ["id_comprador"]: formData.comprador?.id,
            ["id_agVendedor"]: formData?.agenteVendedor?.id,
            ["id_vendedor"]: formData.vendedor?.id,
            ["propiedades"]: UpdateedProps

        }));
    };
    const recalcularValores = (
        isCompartida = false,
        tipoCom = 0,
        porLae = 0,
        porCoor = 0,
        porRespo = 0,
        porAaff = 0,
        porCap = 0,
        porVend = 0,
        porCola = 0,
    ) => {

        const importeNeto = comision * (1 - porLae);
        const totalComision = comision;
        const totalComisonNeta = isCompartida && porLae > 0 ? comision - importeNeto : comision;
        const importeCoordinador = parseFloat((totalComisonNeta * porCoor).toFixed(2));
        const importeResponsable = parseFloat((totalComisonNeta * porRespo).toFixed(2));
        const importeCaptador = parseFloat((totalComisonNeta * porCap).toFixed(2));
        const importeVendedor = parseFloat((totalComisonNeta * porVend).toFixed(2));
        const importeAaff = parseFloat((totalComisonNeta * porAaff).toFixed(2)) / 100 ;
        let sumRestos = 0;
        
        const importeColaborador = parseFloat((
            vinculo === 'AAFF' ? importeAaff
            :
                vinculo === 'VENDEDOR' ? importeVendedor
                :
                    vinculo === 'CAPTADOR' ? importeCaptador
                    :
                        totalComisonNeta) * parseFloat(porCola) / 100).toFixed(2);
        
        sumRestos = importeAaff + importeCaptador + importeVendedor;
        console.log(formData?.aaff);
        console.log(formData)
        // const miCol = colaborador?.map(col => ({
        //     id_col: col?.id,
        //     porCola: porCola,
        //     totalColaborador: vinculo === 'COLABORADOR' ? importeColaborador - importePrescriptor : importeColaborador,
        //     nombre: col?.nombre,
        //     apellidos: col?.apellidos
        // }));

        setFormData(prevState => ({
            ...prevState,
            // ["aaff"]: miAaff,
            // ["colaboradores"]: miCol,
            ["total"]: importe,
            ["totalCoor"]: importeCoordinador,
            ["totalRespo"]: importeResponsable,
            // //     ["totalCol"]: vinculo === 'COLABORADOR' ? importeColaborador - importePrescriptor : importeColaborador,
            ["totalCaptador"]: vinculo === 'CAPTADOR' ? importeCaptador - importeColaborador : importeCaptador,
            ["totalVendedor"]: vinculo === 'VENDEDOR' ? importeVendedor - importeColaborador : importeVendedor,
            // ["comisionTotal"]: totalComision,
            // ["comisionLae"]: totalComisonNeta,
            ["totalComisionNeta"]: isCompartida ? totalComisonNeta - sumRestos : totalComision - sumRestos,
        }));

        // setComision(comision);
        // setTotalComision(!isCompartida    ? totalComision - sumRestos : totalComisonNeta - sumRestos);
    };

la cosa es que cuando añado el porcentaje de un aaff hasta que no se vuelva a ejecutar handleChange no me aparecerá console.log(formData?.aaff); pero cuando hago console.log(formData); si aparece

alguna idea sobre que está pasando, necesaramiamente es una array así que no puedo usar objetos.

1
  • 1
    Puedes agregar más código para poder reproducir el problema? Los snippets de código de este sitio admiten jQuery, React y otras librerías. Así podríamos darle a ejecutar y ver el problema
    – Mateo
    Commented el 15 oct. a las 13:27

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

Examina otras preguntas con la etiqueta o formula tu propia pregunta.