lib.itmens/journal/templates/list_item_base.html

{# parameters: item, collection_edit, hide_category #}
{% load thumb %}
{% load highlight %}
{% load i18n %}
{% load l10n %}
{% load user_actions %}
{% wish_item_action item as action %}
<li class="entity-list__entity">
  <div class="entity-list__entity-img-wrapper">
    <a href="{{ item.url }}">
      <img src="{{ item.cover|thumb:'normal' }}" alt="" class="entity-list__entity-img">
    </a>
    {% if not action.taken %}
    <a class="entity-list__entity-action-icon" hx-post="{{ action.url }}" title="加入想读">➕</a>
    {% endif %}
  </div>

  <div class="entity-list__entity-text">
    {% if collection_edit %}
    <div class="collection-item-position-edit">
      {% if not forloop.first %}
      <a hx-target=".entity-list" hx-post="{% url 'journal:collection_move_item' form.instance.uuid 'up' item.uuid %}">▲</a>
      {% endif %}
      {% if not forloop.last %}
      <a hx-target=".entity-list" hx-post="{% url 'journal:collection_move_item' form.instance.uuid 'down' item.uuid %}">▼</a>
      {% endif %}
      <a hx-target=".entity-list" hx-post="{% url 'journal:collection_remove_item' form.instance.uuid item.uuid %}">✖</a>
    </div>
    {% endif %}

    <div class="entity-list__entity-title">

      <a href="{{ item.url }}" class="entity-list__entity-link">
        {% if request.GET.q %}
        {{ item.title | highlight:request.GET.q }}
        {% else %}
        {{ item.title }}
        {% endif %}
        {% if item.year %}<small style="font-weight: lighter">({{ item.year }})</small>{% endif %}
      </a>
      {% for res in item.external_resources.all %}
      <a href="{{ res.url }}">
        <span class="source-label source-label__{{ res.site_name }}">{{ res.site_name.label }}</span>
      </a>
      {% endfor %}
      {% if not hide_category %}
      <span class="entity-list__entity-category">[{{item.category.label}}]</span>
      {% endif %}
    </div>

    {% if item.rating %}
    <div class="rating-star entity-list__rating-star" data-rating-score="{{ item.rating | floatformat:0 }}"></div>
    <span class="entity-list__rating-score rating-score">{{ item.rating | floatformat:1 }}</span>
    {% else %}
    <div class="entity-list__rating entity-list__rating--empty"> {% trans '暂无评分' %}</div>
    {% endif %}

    <span class="entity-list__entity-info">
    {% block info %}
    {% endblock %}
    </span>
    <span class="entity-list__entity-info entity-list__entity-info--full-length">
      {% block info_full %}
      {% endblock %}
    </span>
    <p class="entity-list__entity-brief">
      {{ item.brief }}
    </p>

    <div class="tag-collection">
      {% for tag_dict in item.tags %}
      <span class="tag-collection__tag">
        <a href="{% url 'catalog:search' %}?tag={{ tag_dict }}">{{ tag_dict }}</a>
      </span>
      {% endfor %}
    </div>

    {% if mark %}
    <div class="clearfix"></div>
    <div class="dividing-line dividing-line--dashed"></div>
    <div class="entity-marks" style="margin-bottom: 0;">
      <ul class="entity-marks__mark-list">
        <li class="entity-marks__mark">
          {% if mark.rating %}
          <span class="entity-marks__rating-star rating-star"
          data-rating-score="{{ mark.rating | floatformat:0 }}" style="left: -4px;"></span>
          {% endif %}
          {% if mark.visibility > 0 %}
          <span class="icon-lock"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
            <path
            d="M17,8.48h-.73V6.27a6.27,6.27,0,1,0-12.53,0V8.48H3a.67.67,0,0,0-.67.67V19.33A.67.67,0,0,0,3,20H17a.67.67,0,0,0,.67-.67V9.15A.67.67,0,0,0,17,8.48ZM6.42,6.27h0a3.57,3.57,0,0,1,7.14,0h0V8.48H6.42Z" />
          </svg></span>
          {% endif %}
          <span class="entity-marks__mark-time" style="float:right;">
            {% trans '标记于' %} {{ member.created_time }}
          </span>
          <p class="entity-marks__mark-content">&nbsp;
          {% if mark.text %}
          {{ mark.text }}
          {% endif %}
          </p>
        </li>
        {% if mark.review %}
        <li class="entity-marks__mark">
          <span class="entity-marks__mark-time" style="float:right;">
            {% trans '评论于' %} {{ mark.review.created_time }}
          </span>
          <p class="entity-marks__mark-content">
            <a href="{{ mark.review.url }}">{{ mark.review.title }}</a>
            {% if mark.review.visibility > 0 %}
            <span class="icon-lock"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20">
              <path
              d="M17,8.48h-.73V6.27a6.27,6.27,0,1,0-12.53,0V8.48H3a.67.67,0,0,0-.67.67V19.33A.67.67,0,0,0,3,20H17a.67.67,0,0,0,.67-.67V9.15A.67.67,0,0,0,17,8.48ZM6.42,6.27h0a3.57,3.57,0,0,1,7.14,0h0V8.48H6.42Z" />
            </svg></span>
            {% endif %}
          </p>
        </li>
        {% endif %}
      </ul>
    </div>
    {% endif %}

    {% if collection_member %}
    <div class="clearfix"></div>
    <div class="dividing-line dividing-line--dashed"></div>
    <div class="entity-marks" style="margin-bottom: 0;">
      <ul class="entity-marks__mark-list">
        <li class="entity-marks__mark">
          <p class="entity-marks__mark-content" hx-target="this" hx-swap="innerHTML">
            
            {% if collection_member.note %} {{ collection_member.note }} {% endif %}
            {% if collection_edit %}
            <a class="action-icon" hx-get="{% url 'journal:collection_update_item_note' collection.uuid item.uuid %}"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g><path d="M19,20H5a1,1,0,0,0,0,2H19a1,1,0,0,0,0-2Z"/><path d="M5,18h.09l4.17-.38a2,2,0,0,0,1.21-.57l9-9a1.92,1.92,0,0,0-.07-2.71h0L16.66,2.6A2,2,0,0,0,14,2.53l-9,9a2,2,0,0,0-.57,1.21L4,16.91a1,1,0,0,0,.29.8A1,1,0,0,0,5,18ZM15.27,4,18,6.73,16,8.68,13.32,6Zm-8.9,8.91L12,7.32l2.7,2.7-5.6,5.6-3,.28Z"/></g></svg></a>
            {% endif %}

          </p>
        </li>
      </ul>
    </div>
    {% endif %}
  </div>
</li>