How to use a preloader until different functions end with requests to the server, jquery, framework7?

Good day I currently have the following functions running at the same time. The problem I have is that when a function is executed the preloader myApp.showIndicator(); is activated but at the same time when the first activated function that has returned a request from the server is executed myApp.hideIndicator(); therefore the preloader is hidden before time , even if the server has not returned the information in the other functions.

Here is an example of the functions I execute:

    cantidadLlaves(idPedido);
        function cantidadLlaves(idPedido) {
             myApp.showIndicator(); //Con esta funcion se ejecuta el preloader
                return new Promise((res, rej) => {
                    axios({
                        method: 'GET',
                        url: 'https://URL/metodo1?IDPedido=${parseInt(idPedido)}',
                        headers: {
                            Authorization: token_type + " " + access_token
                        }
                    })
                    .then(function (response) {
                        console.log(response);
myApp.hideIndicator(); //Con esta funcion se oculta el preloader
                    }).catch(function (error) {
                        console.log(error)
                    })
                })
        }

    function obtenerOfertasAdicionales(idPedido) {
                myApp.showIndicator(); //Ejecutando el preloader.
                return new Promise((res, rej) => {
                    axios({
                        method: 'GET',
                        url: 'https://URL/metodo2?IDPedido=${parseInt(idPedido)}',
                        headers: {
                            Authorization: token_type + " " + access_token
                        }
                    })
                    .then(function (response) {
                        console.log(response);
                        myApp.hideIndicator();//Ocultando el preoloader

                    }).catch(function (error) {
                        console.log(error)
                    })
                }

    )
                }

        function obtenerMaterialImpreso(idPedido) {
     myApp.showIndicator(); //Ejecutando el preloader.
                    return new Promise((res, rej) => {
                        axios.get('https://URL/metodo3?IDPedido=${idPedido}', {
                            headers: {
                                Authorization: token_type + " " + access_token
                            }
                        }).then(function (response) {
                            console.log(response);
     myApp.hideIndicator(); //Ocultando el preloader.
                        }).catch(function (error) {
                            console.log(error)
                        })
                    })
                }



 if (cod_emp === "5"){
            cantidadCuponesCR(cedula, idPedido);
     myApp.showIndicator(); //Ejecutando el preloader.
            function cantidadCuponesCR(cedula, idPedido) {
                    return new Promise((res, rej) => {
                        axios({
                            method: 'GET',
                            url: 'https://URL/metodo4?Cod_Trib=${cedula}&IDPedido=${parseInt(idPedido)}',
                            headers: {
                                Authorization: token_type + " " + access_token
                            }
                        })
                        .then(function (response) {
                            console.log(response);
                             myApp.hideIndicator(); //ocultando el preloader.                   
                        }).catch(function (error) {
                            console.log(error)
                        })
                    })
            }
        }



     if (tipo_socio === "1"){
                var tipo = 1;//Oricash
                cantidadCuponesOricash(cod_cliente, tipo);
                function cantidadCuponesOricash(cod_cliente, tipo) {
     myApp.showIndicator(); //Ejecutando el preloader.
                        return new Promise((res, rej) => {
                            axios({
                                method: 'GET',
                                url: 'https://metodo5?Cod_Cliente=${cod_cliente}&Tipo=${parseInt(tipo)}',
                                headers: {
                                    Authorization: token_type + " " + access_token
                                }
                            })
                            .then(function (response) {
                                console.log(response);
                                cupones_oricash = response.data;
     myApp.hideIndicator(); //ocultando el preloader.
                            }).catch(function (error) {
                                console.log(error)
                            })
                        })
                }
            }

So how could you do to run myApp.showIndicator(); and until the last function returns your server information hide the preloader with myApp.hideIndicator();

Thank you very much in advance, blessings.