Question

当我知道开放和关闭时间时，我想以自定义格式显示开放和关闭时间如果我的day_id 3的结果是星期二，所以开放时间是08:00，关闭时间是22:00，那么如何显示时间范围呢？

我希望用户选择以下时间范围：

08:15

08:30

08:45

。。

21:45

在刀片视图中：

                                 <ul>
                                        <li>
                                            <label class="time-picker-toggle-wrapper">
                                                <input type="radio" value="15:15" name="time-picker" />
                                                <span class="time-name">3:15 PM</span>
                                            </label>
                                        </li>

                                        <li>
                                            <label class="time-picker-toggle-wrapper">
                                                <input type="radio" value="15:30" name="time-picker" />
                                                <span class="time-name">3:30 PM</span>
                                            </label>
                                        </li>

                                        <li>
                                            <label class="time-picker-toggle-wrapper">
                                                <input type="radio" value="15:45" name="time-picker" />
                                                <span class="time-name">3:45 PM</span>
                                            </label>
                                        </li>

                                        <li>
                                            <label class="time-picker-toggle-wrapper">
                                                <input type="radio" value="16:00" name="time-picker" />
                                                <span class="time-name">4:00 PM</span>
                                            </label>
                                        </li>

                </ul>

控制器：

  $OpenHours=Storeday::where('storeinfo_id', $request->store_id)
  ->Where('day_id',$request->day_id)
  ->get();

结果：

   "day_id" => 2
    "open_time" => "08:00"
    "close_time" => "22:00"
    "storeinfo_id" => 695
    "available" => 1
    "created_at" => "2020-06-02 00:41:41"
    "updated_at" => "2020-07-01 09:52:49"

Answer 1

使用dateRange从您的open_time到close_time，步长为15分钟。因为同时使用24h和12h，所以会得到2种格式。构造所有$slots，传递到视图并遍历以创建所有单选按钮。

<?php

$result = [
  "open_time" => "08:00",
  "close_time" => "22:00",
];

$period = new DatePeriod(
  new DateTimeImmutable($result['open_time']),
  new DateInterval('PT15M'),
  new DateTimeImmutable($result['close_time']),
  DatePeriod::EXCLUDE_START_DATE
);

$slots = [];
foreach ($period as $date) {
  $slots[] = ['24format' => $date->format('H:i'), '12format' => $date->format('h:i A')];
}

var_dump($slots);

插槽：

array(55) {
  [0]=>
  array(2) {
    ["24format"]=>
    string(5) "08:15"
    ["12format"]=>
    string(8) "08:15 AM"
  }
  [1]=>
  array(2) {
    ["24format"]=>
    string(5) "08:30"
    ["12format"]=>
    string(8) "08:30 AM"
  }
  [2]=>
  array(2) {
    ["24format"]=>
    string(5) "08:45"
    ["12format"]=>
    string(8) "08:45 AM"
  }
  [3]=>
  array(2) {
    ["24format"]=>
    string(5) "09:00"
    ["12format"]=>
    string(8) "09:00 AM"
  }
  [4]=>
  array(2) {
    ["24format"]=>
    string(5) "09:15"
    ["12format"]=>
    string(8) "09:15 AM"
  }
  [5]=>
  array(2) {
    ["24format"]=>
    string(5) "09:30"
    ["12format"]=>
    string(8) "09:30 AM"
  }
  [6]=>
  array(2) {
    ["24format"]=>
    string(5) "09:45"
    ["12format"]=>
    string(8) "09:45 AM"
  }
  [7]=>
  array(2) {
    ["24format"]=>
    string(5) "10:00"
    ["12format"]=>
    string(8) "10:00 AM"
  }
  [8]=>
  array(2) {
    ["24format"]=>
    string(5) "10:15"
    ["12format"]=>
    string(8) "10:15 AM"
  }
  [9]=>
  array(2) {
    ["24format"]=>
    string(5) "10:30"
    ["12format"]=>
    string(8) "10:30 AM"
  }
  [10]=>
  array(2) {
    ["24format"]=>
    string(5) "10:45"
    ["12format"]=>
    string(8) "10:45 AM"
  }
  [11]=>
  array(2) {
    ["24format"]=>
    string(5) "11:00"
    ["12format"]=>
    string(8) "11:00 AM"
  }
  [12]=>
  array(2) {
    ["24format"]=>
    string(5) "11:15"
    ["12format"]=>
    string(8) "11:15 AM"
  }
  [13]=>
  array(2) {
    ["24format"]=>
    string(5) "11:30"
    ["12format"]=>
    string(8) "11:30 AM"
  }
  [14]=>
  array(2) {
    ["24format"]=>
    string(5) "11:45"
    ["12format"]=>
    string(8) "11:45 AM"
  }
  [15]=>
  array(2) {
    ["24format"]=>
    string(5) "12:00"
    ["12format"]=>
    string(8) "12:00 PM"
  }
  [16]=>
  array(2) {
    ["24format"]=>
    string(5) "12:15"
    ["12format"]=>
    string(8) "12:15 PM"
  }
  [17]=>
  array(2) {
    ["24format"]=>
    string(5) "12:30"
    ["12format"]=>
    string(8) "12:30 PM"
  }
  [18]=>
  array(2) {
    ["24format"]=>
    string(5) "12:45"
    ["12format"]=>
    string(8) "12:45 PM"
  }
  [19]=>
  array(2) {
    ["24format"]=>
    string(5) "13:00"
    ["12format"]=>
    string(8) "01:00 PM"
  }
  [20]=>
  array(2) {
    ["24format"]=>
    string(5) "13:15"
    ["12format"]=>
    string(8) "01:15 PM"
  }
  [21]=>
  array(2) {
    ["24format"]=>
    string(5) "13:30"
    ["12format"]=>
    string(8) "01:30 PM"
  }
  [22]=>
  array(2) {
    ["24format"]=>
    string(5) "13:45"
    ["12format"]=>
    string(8) "01:45 PM"
  }
  [23]=>
  array(2) {
    ["24format"]=>
    string(5) "14:00"
    ["12format"]=>
    string(8) "02:00 PM"
  }
  [24]=>
  array(2) {
    ["24format"]=>
    string(5) "14:15"
    ["12format"]=>
    string(8) "02:15 PM"
  }
  [25]=>
  array(2) {
    ["24format"]=>
    string(5) "14:30"
    ["12format"]=>
    string(8) "02:30 PM"
  }
  [26]=>
  array(2) {
    ["24format"]=>
    string(5) "14:45"
    ["12format"]=>
    string(8) "02:45 PM"
  }
  [27]=>
  array(2) {
    ["24format"]=>
    string(5) "15:00"
    ["12format"]=>
    string(8) "03:00 PM"
  }
  [28]=>
  array(2) {
    ["24format"]=>
    string(5) "15:15"
    ["12format"]=>
    string(8) "03:15 PM"
  }
  [29]=>
  array(2) {
    ["24format"]=>
    string(5) "15:30"
    ["12format"]=>
    string(8) "03:30 PM"
  }
  [30]=>
  array(2) {
    ["24format"]=>
    string(5) "15:45"
    ["12format"]=>
    string(8) "03:45 PM"
  }
  [31]=>
  array(2) {
    ["24format"]=>
    string(5) "16:00"
    ["12format"]=>
    string(8) "04:00 PM"
  }
  [32]=>
  array(2) {
    ["24format"]=>
    string(5) "16:15"
    ["12format"]=>
    string(8) "04:15 PM"
  }
  [33]=>
  array(2) {
    ["24format"]=>
    string(5) "16:30"
    ["12format"]=>
    string(8) "04:30 PM"
  }
  [34]=>
  array(2) {
    ["24format"]=>
    string(5) "16:45"
    ["12format"]=>
    string(8) "04:45 PM"
  }
  [35]=>
  array(2) {
    ["24format"]=>
    string(5) "17:00"
    ["12format"]=>
    string(8) "05:00 PM"
  }
  [36]=>
  array(2) {
    ["24format"]=>
    string(5) "17:15"
    ["12format"]=>
    string(8) "05:15 PM"
  }
  [37]=>
  array(2) {
    ["24format"]=>
    string(5) "17:30"
    ["12format"]=>
    string(8) "05:30 PM"
  }
  [38]=>
  array(2) {
    ["24format"]=>
    string(5) "17:45"
    ["12format"]=>
    string(8) "05:45 PM"
  }
  [39]=>
  array(2) {
    ["24format"]=>
    string(5) "18:00"
    ["12format"]=>
    string(8) "06:00 PM"
  }
  [40]=>
  array(2) {
    ["24format"]=>
    string(5) "18:15"
    ["12format"]=>
    string(8) "06:15 PM"
  }
  [41]=>
  array(2) {
    ["24format"]=>
    string(5) "18:30"
    ["12format"]=>
    string(8) "06:30 PM"
  }
  [42]=>
  array(2) {
    ["24format"]=>
    string(5) "18:45"
    ["12format"]=>
    string(8) "06:45 PM"
  }
  [43]=>
  array(2) {
    ["24format"]=>
    string(5) "19:00"
    ["12format"]=>
    string(8) "07:00 PM"
  }
  [44]=>
  array(2) {
    ["24format"]=>
    string(5) "19:15"
    ["12format"]=>
    string(8) "07:15 PM"
  }
  [45]=>
  array(2) {
    ["24format"]=>
    string(5) "19:30"
    ["12format"]=>
    string(8) "07:30 PM"
  }
  [46]=>
  array(2) {
    ["24format"]=>
    string(5) "19:45"
    ["12format"]=>
    string(8) "07:45 PM"
  }
  [47]=>
  array(2) {
    ["24format"]=>
    string(5) "20:00"
    ["12format"]=>
    string(8) "08:00 PM"
  }
  [48]=>
  array(2) {
    ["24format"]=>
    string(5) "20:15"
    ["12format"]=>
    string(8) "08:15 PM"
  }
  [49]=>
  array(2) {
    ["24format"]=>
    string(5) "20:30"
    ["12format"]=>
    string(8) "08:30 PM"
  }
  [50]=>
  array(2) {
    ["24format"]=>
    string(5) "20:45"
    ["12format"]=>
    string(8) "08:45 PM"
  }
  [51]=>
  array(2) {
    ["24format"]=>
    string(5) "21:00"
    ["12format"]=>
    string(8) "09:00 PM"
  }
  [52]=>
  array(2) {
    ["24format"]=>
    string(5) "21:15"
    ["12format"]=>
    string(8) "09:15 PM"
  }
  [53]=>
  array(2) {
    ["24format"]=>
    string(5) "21:30"
    ["12format"]=>
    string(8) "09:30 PM"
  }
  [54]=>
  array(2) {
    ["24format"]=>
    string(5) "21:45"
    ["12format"]=>
    string(8) "09:45 PM"
  }
}

PHP，Jquery如何显示开放时间和关闭时间

1 个答案: