在 table 中列出一周中每一天的活动

Listing events in table for each day of the week

虽然有问题的代码是PHP,但我需要再看一遍,通用算法、伪代码或类似的东西作为解决方案。

我有一组对象 ($events),其属性为:

我有一个 table 工作日:

         Mon   Tue   Wed   Thu   Fri   Sat   Sun  
Starts    *     *     *     *     *     *     *
Ends      *     *     *     *     *     *     *

HTML 中的相同 table:

<table>
      <thead>
        <tr>
          <th></th>
          <th>Mon</th>
          <th>Tue</th>
          <th>Wed</th>
          <th>Thu</th>
          <th>Fri</th>
          <th>Sat</th>
          <th>Sun</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><strong>Starts</strong></td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
        </tr>
        <tr>
          <td><strong>Ends</strong></td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
          <td>*</td>
        </tr>
      </tbody>
    </table>

星号只是一个占位符,与此无关。

我想在下面显示 event_name如果活动在周三开始或结束,则为周三。当然,如果周三开始(date_from是周三),我希望在Wed下的Starts行,如果周三结束(date_to是周三) ,我想在 Wed.

下的 Ends 行中

我有一个可行的解决方案,但它太糟糕了,我什至重新考虑在这里写它:)

解决方案是采用 HTML 并在每个 <td>*</td> 中加入星号而不是 PHP 的这些行(星期一的 <td> 的示例):

<td>
  foreach($events as $event) {
    if($event->date_to == $week_start) { //Monday is start of the week
      echo $event->name;
    }
  }
</td>

对于星期二的 <td>,它将类似于:

<td>
  foreach($events as $event) {
    if($event->date_to == $week_start + 1) {  //Tuesday is start of the week + 1 day
      echo $event->name;
    }
  }
</td>

...等等,但是其中 14 个 foreachif 每天两行可能是愚蠢的 :)。当然,对于 Ends 行,我将 date_to 属性 与相关日期进行比较。

有人有概念性的答案吗?如何更好地解决这个问题?

P.S。我在 Laravel、PHP MVC 框架中工作,所以我在控制器中构建一个集合并将其传递给视图。日期是 Carbon 个实例,它是 DateTime 的 PHP API 扩展,因此可以使用各种方便的方法来确定日期(addDay()startOfWeek() 等) .如有必要,可以更改所讨论的 HTML 以及 $events 集合的结构。

提前感谢您的想法。

编辑:在 table 单元格 (<td>).

中,除了最后一个 event_name 之外,在每个 event_name 之后放置逗号的奖励积分

1) php 模板语言唯一解决方案

树枝:

{% set days = ["monday", "tuesday", "wednesday", "thursday", "friday", "saturday", "sunday"] %}

{% set event_1 = {"name":"event_1","date_from" : "monday", "date_to" : "monday"} %}
{% set event_2 = {"name":"event_2","date_from" : "friday", "date_to" : "thursday"} %}
{% set event_3 = {"name":"event_3","date_from" : "wednesday", "date_to" : "tuesday"} %}
{% set event_4 = {"name":"event_4","date_from" : "saturday", "date_to" : "monday"} %}
{% set event_5 = {"name":"event_5","date_from" : "sunday", "date_to" : "thursday"} %}

{% set event_list = [event_1, event_2, event_3, event_4, event_5] %}


<div class="container">
    <table class="table table-striped">
        <thead>
        <tr>
            {% for day in days %}
                <th>{{ day }}</th>
            {% endfor %}
        </tr>
        </thead>
        <tbody>
            <tr>
                {% for day in days %}
                    <td>
                        {% for ev in event_list %}
                            {% if ev.date_from == day %}
                                {{ ev.name }}
                            {% endif %}
                        {% endfor %}
                    </td>
                {% endfor %}
            </tr>
            <tr>
                {% for day in days %}
                    <td>
                        {% for ev in event_list %}
                            {% if ev.date_to == day %}
                                {{ ev.name }}
                            {% endif %}
                        {% endfor %}
                    </td>
                {% endfor %}
            </tr>
        </tbody>
    </table>
</div>

2)php模板语言+jQuery解决方案

树枝

{% set days = ["monday", "tuesday", "wednesday", "thursday", "friday", "saturday", "sunday"] %}


<div class="container">
    <table class="table table-striped">
        <thead>
        <tr>
            {% for day in days %}
                <th>{{ day }}</th>
            {% endfor %}
        </tr>
        </thead>
        <tbody>
            <tr id="event_start">
                {% for day in days %}
                    <td name="{{ day }}">
                    </td>
                {% endfor %}
            </tr>
            <tr id="event_end">
                {% for day in days %}
                    <td name="{{ day }}">
                    </td>
                {% endfor %}
            </tr>
        </tbody>
    </table>
</div>

jquery:

<script>
    $(document).ready(function(){

        var event_list = {
            event_1 : {event_name : "event_1", date_from : "monday", date_end : "sunday"},
            event_2 : {event_name : "event_2", date_from : "wednesday", date_end : "tuesday"},
            event_3 : {event_name : "event_3", date_from : "thursday", date_end : "friday"},
            event_4 : {event_name : "event_4", date_from : "saturday", date_end : "saturday"},
            event_5 : {event_name : "event_5", date_from : "friday", date_end : "tuesday"},
            event_6 : {event_name : "event_6", date_from : "monday", date_end : "thursday"}
        };

        var first_row = $("#event_start");
        var second_row = $("#event_end");

        function loop (row, date) {
            row.find("td").each(function(){
                var t = $(this);
                var name = $(this).attr("name");
                $.each( event_list, function( key, value ) {
                    if (value[date] == name) {
                        t.text(value.event_name);
                    }
                });
            });
        }

        loop(first_row, "date_from");
        loop(second_row, "date_end");

    });
</script>