[PYTHON] Ich möchte in der Django-Verschiebungstabelle scrollen, aber ...
So sieht die aktuelle monatliche Schichttabelle aus.
Wenn ich runter gehe, weiß ich nicht, welcher Tag was ist. Ich habe HTML und CSS nicht so oft studiert, also schaue ich nach und bearbeite die modische Tabelle HTML, aber es funktioniert einfach nicht ...
Möglicherweise können Sie keine nützliche Web-App erstellen, ohne sich an die Regeln von Django, Python, HTML, CSS und Javascript zu erinnern.
Die Hürden für Web-Apps sind viel höher als für VBA, aber da 0⇒1 die schwierigste Zeit ist, werde ich mein Bestes geben, um zu denken, dass es die schwierigste Situation ist, HTML und CSS zu lernen (⌒∇⌒).
Ich versuche, HTML zu reparieren, aber wenn es nicht funktioniert, kann ich von der Sicherung zurückkehren ...
schedule/month.html
{% extends 'schedule/base.html' %}
{% load static %}
{% block customcss %}
<link rel="stylesheet" type="text/scc" href ="{% static 'schedule/month.css' %}">
{% endblock customcss %}
{% block header %}
<ul class="page">
{% ifnotequal month 1 %}
<a href="{% url 'schedule:monthschedule' year month|add:'-1' %}" class="btn-info btn active">Im vergangenen Monat</a>
{% else %}
<a href="{% url 'schedule:monthschedule' year|add:'-1' 12 %}" class="btn-info btn active">Im vergangenen Monat</a>
{% endifnotequal %}
{% ifnotequal month 12 %}
<a href="{% url 'schedule:monthschedule' year month|add:'1' %}" class="btn-info btn active">Nächsten Monat</a>
{% else %}
<a href="{% url 'schedule:monthschedule' year|add:'1' 1 %}" class="btn-info btn active">Nächsten Monat</a>
{% endifnotequal %}
<a href="{% url 'schedule:schedulecreate' year month %}" class="btn-info btn active">Schicht erstellen</a>
</ul>
<p>
{% for shisetsu in shisetsu_object %}
<span style="background-color:{{ shisetsu.color }}">{{ shisetsu.name }}</span>
{% endfor %}
</p>
{{ kikan }}
{% for shift in shift_object %}
{% if shift.name != "Geschlossen" and shift.name != "Ja" %}
{{ shift.name }} : {{ shift.start_time | date:"G"}}～{{ shift.end_time | date:"G"}}
{% endif %}
{% endfor %}
{% endblock header %}
{% block content %}
<div class='text-nowrap table-responsive'>
<table class='table table-striped table-hover table-fixed'>
<thead>
<tr align="center" class="info"> <!--Datum-->
<th rowspan="2"></th>
{% for item in calender_object %}
<th class="day_{{ item.date }}">{{ item.date | date:"d" }}</th>
{% endfor %}
<tr align="center" class="info"> <!--Tag-->
{% for item in youbi_object %}
<th class="day_{{ item.date }}">{{ item }}</th>
{% endfor %}
</tr>
</thead>
<tbody>
{% for profile in profile_list %}
{% for staff in user_list %}
{% if profile.user_id == staff.id %}
<tr align="center">
<th rowspan="1" class="staff_name" staff_id="{{ staff.staff_id }}" width="200" >{{ staff.last_name }}{{ staff.first_name }}</th> <!--staff_ID-Element, das in js verwendet wird-->
{% for item in object_list %}
{% if item.user|stringformat:"s" == staff.username|stringformat:"s" %}<!--Wenn der Benutzername der gleiche ist-->
<td class="day" id="s{{ staff.id }}d{{ item.date }}">
{% if item.shift_name_1 != None %}
{% if item.shift_name_1|stringformat:"s" == "Ja" or item.shift_name_1|stringformat:"s" == "Geschlossen" %}
{{ item.shift_name_1 }}
{% else %}
{% for shisetsu in shisetsu_object %}
{% if item.shisetsu_name_1|stringformat:"s" == shisetsu.name|stringformat:"s" %}
<span style="background-color:{{ shisetsu.color }}">{{ item.shift_name_1 }}</span>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% if item.shift_name_2 != None %}
{% if item.shift_name_2|stringformat:"s" == "Ja" or item.shift_name_2|stringformat:"s" == "Geschlossen" %}
{{ item.shift_name_2 }}
{% else %}
{% for shisetsu in shisetsu_object %}
{% if item.shisetsu_name_2|stringformat:"s" == shisetsu.name|stringformat:"s" %}
<span style="background-color:{{ shisetsu.color }}">{{ item.shift_name_2 }}</span>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% if item.shift_name_3 != None %}
{% if item.shift_name_3|stringformat:"s" == "Ja" or item.shift_name_3|stringformat:"s" == "Geschlossen" %}
{{ item.shift_name_3 }}
{% else %}
{% for shisetsu in shisetsu_object %}
{% if item.shisetsu_name_3|stringformat:"s" == shisetsu.name|stringformat:"s" %}
<span style="background-color:{{ shisetsu.color }}">{{ item.shift_name_3 }}</span>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% if item.shift_name_4 != None %}
{% if item.shift_name_4|stringformat:"s" == "Ja" or item.shift_name_4|stringformat:"s" == "Geschlossen" %}
{{ item.shift_name_4 }}
{% else %}
{% for shisetsu in shisetsu_object %}
{% if item.shisetsu_name_4|stringformat:"s" == shisetsu.name|stringformat:"s" %}
<span style="background-color:{{ shisetsu.color }}">{{ item.shift_name_4 }}</span>
{% endif %}
{% endfor %}
{% endif %}
{% endif %}
{% endif %}
{% endfor %}
</td>
<tr align="center">
{% for month in month_total %}
{% if month.user == staff.id %}<!--Wenn der Benutzername der gleiche ist-->
<td><b>{{ month.month_total_worktime }}</b></td>
{% endif %}
{% endfor %}
{% for item in object_list %}
{% if item.user|stringformat:"s" == staff.username|stringformat:"s" %}<!--Wenn der Benutzername der gleiche ist-->
<td class="day" id="s{{ staff.id }}d{{ item.date }}">
<a href="{% url 'schedule:update' item.pk %}">{{ item.day_total_worktime }} </a>
</td>
{% endif %}
{% endfor %}
</tr>
{% endif %}
{% endfor %}
{% endfor %}
</tbody>
</table>
</div>
{% endblock content %}
CSS ist
schedule/month.css
table{
border-collapse:separate;
border-spacing: 0;
}
table thead:first-child{
border-radius: 5px 0 0 0;
}
table thead:last-child{
border-radius: 0 5px 0 0;
border-right: 1px solid #3c6690;
}
table thead{
text-align: center;
color:white;
background: linear-gradient(#829ebc,#225588);
border-left: 1px solid #3c6690;
border-top: 1px solid #3c6690;
border-bottom: 1px solid #3c6690;
box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;
padding: 10px 0;
}
Selbst wenn Sie dies tun, wird Css nicht angewendet. In der Tabelle, die in HTML beschrieben ist