Обратный отсчет в клинке с js - PullRequest
0 голосов
/ 29 февраля 2020

У меня эта проблема в laravel лезвии. У меня есть проект, где предоставляется возможность спонсировать квартиры для большей наглядности. В зависимости от выбранного плана, спонсорство длится 24 72 или 144 часа. Теперь я хотел бы сделать обратный отсчет, который показывает, сколько времени осталось до окончания спонсорства. Это мой код в блейде:

@foreach (DB::table("apartment_sponsorship")->where("apartment_id" ,"=" , $apartment->id) -> get() as $end_time_sponsor)
                  <p class="demo"></p>
                    <script>
                    var countDownDate = new Date("{{$end_time_sponsor -> end_time }}").getTime();
                    console.log(countDownDate)

                      // Update the count down every 1 second
                      var x = setInterval(function() {

                        // Get today's date and time
                        var now = new Date().getTime();



                        // Find the distance between now and the count down date
                        var distance = countDownDate - now;

                        // Time calculations for days, hours, minutes and seconds
                        var days = Math.floor(distance / (1000 * 60 * 60 * 24));
                        var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
                        var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
                        var seconds = Math.floor((distance % (1000 * 60)) / 1000);

                        // Output the result in an element with id="demo"
                        $(".demo").text(days + "d " + hours + "h "
                        + minutes + "m " + seconds + "s ");



                      }, 1000);

                  </script> 
                      //test{{date('m-d-Y H:m:s', strtotime($end_time_sponsor -> end_time)) }} //

                  @endforeach

теперь журнал подтверждает, что время окончания фактически состоит из 2 разных дат, однако на странице обратный отсчет одинаков для всех квартир. В чем может быть проблема?

Ответы [ 2 ]

0 голосов
/ 29 февраля 2020

Не могли бы вы попробовать вот так -

@php
    $end_time_sponsors = DB::table("apartment_sponsorship")
                          ->where("apartment_id" ,"=" , $apartment->id)
                          ->get()
@endphp

Затем

@foreach($end_time_sponsors as $end_time_sponsor)
    <p data-countdown="{{ date('Y/m/d', strtotime($end_time_sponsor->end_time)) }}">
        {{ date('Y/m/d', strtotime($end_time_sponsor->end_time)) }}
    </p>
@endforeach

В вашем теге скрипта:

<script src="{{ asset('js/jquery.countdown.min.js') }}"></script>
<script>
    $('[data-countdown]').each(function() {
       var $this = $(this), finalDate = $(this).data('countdown');
       $this.countdown(finalDate, function(event) {
         $this.html(event.strftime('%D days %H:%M:%S'));
       });
    });
</script>

Для загрузки jQueryCountdown

0 голосов
/ 29 февраля 2020

Вам необходимо изменить foreach l oop с

`@foreach (DB::table("apartment_sponsorship")->where("apartment_id" ,"=" ,
 $apartment->id) -> get() as $end_time_sponsor)`

на

$query = DB::table("apartment_sponsorship")->where("apartment_id" ,"=" , $apartment->id)->get()
@foreach ($query as $end_time_sponsor)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...