Можно сделать так:
1. В начале страницы подключить библиотеки:
spoiler
<script src="../static/js/bootstrap.js"></script>
<script src="../static/js/bootstrap.bundle.js"></script>
<script src="../static/js/bootstrap.bundle.min.js"></script>
<script src="../static/jquery/jquery-3.6.0.js"></script>
2. В основной части страницы вставить прогресс-бар:
spoiler
<div class="progress" style="height: 23px;">
<div id="r3c1" class="progress-bar progress-bar-striped progress-bar-animated bg-info" role="progressbar" style="width: 0%">0</div>
</div>
3. В конце станицы вставить скрипт, который будет каждые 0,5 сек забирать значение для прогресс-бара:
spoiler
<script>
setInterval(
function()
{
$.getJSON('/get_form',{},function(data){
$("#r3c1").text(data.result[2][0]);
$("#r3c1").css({'width':data.result[2][0]+'%'});
});
},
500);
</script>
4. Во Flask добавить декоратор:
spoiler
@app.route('/get_form')
def get_form():
pass
return jsonify(result=data_form)
5. И в некоторой функции пересчитывать значение для прогресс-бара:
spoiler
def my_func(pause):
percent = 100 / pause
while pause != 0:
time.sleep(1)
pause -= 1
data_form[2][0] = int( 100 - (pause * percent))
return
Обратите внимание: прогресс-бар требует два параметра - надпись цифрами на шкале и саму шкалу.
Функция в пункте 5 - бесполезная и указана тупо для примера.
