ticket-table

// src/components/apps/cloud/ticket-overview/app-ticket-overview/ticket-table/schema.yaml

$schema: http://json-schema.org/draft-07/schema
type: object
required:
  - tickets
additionalProperties: false
properties:
  tickets:
    $ref: https://finstral.com/apps/cloud/ticket-overview#TicketSchema
$id: '13'

// src/components/apps/cloud/ticket-overview/app-ticket-overview/ticket-table/mocks.yaml

tickets:
  - subject: Test von Factorial
    id: CompINC-142231
    name: Tiziana Sicurcasa
    service: Contacts
    status_tags:
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Neutral
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Success
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Critical
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Activity
    date: 26.03.2024
    url: /
  - subject: Richiesta disattivazione
    id: CompINC-142232
    name: Tiziana Sicurcasa
    service: Webmonitor
    status_tags:
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Neutral
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Success
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Activity
    date: 26.03.2024
    url: /
  - subject: Anfrage Deaktivierung
    id: CompINC-142233
    name: Tiziana Sicurcasa
    service: Cloud
    status_tags:
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Neutral
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Success
        status: In Auto Abschluss
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Critical
        status: Abgelehnt
    date: 26.03.2024
    url: /
  - subject: Anfrage Änderung Cloud
    id: CompINC-142234
    name: Tiziana Sicurcasa
    service: Composer
    status_tags:
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Activity
        status: Wiedereröffnet
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Neutral
        status: 2nd Level
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Warning
      - $ref: /apps/cloud/ticket-overview/app-ticket-overview/status-tag#Critical
    date: 26.03.2024
    url: /

// src/components/apps/cloud/ticket-overview/app-ticket-overview/ticket-table/ticket-table.twig

{% set head = [
	{label: "ticket_table.label_subject"|tc},
	{label: "ticket_table.label_id"|tc},
	{label: "ticket_table.label_name"|tc},
	{label: "ticket_table.label_service"|tc},
	{label: "ticket_table.label_tags"|tc},
	{label: "ticket_table.label_date"|tc},
] %}

{% set body = [] %}

{% for ticket in tickets %}
	{% set subject %}
	<div class="TicketTable-subject">
		{% include "@elements/link/link.twig" with {
			label: ticket.subject,
			url: ticket.url,
			variant: "neutral",
			classes: ["TicketTable-subjectLink", "u-typo-TextS"]
		} only %}
	</div>
	{% endset %}

	{% set id %}
		{% include "@elements/link/link.twig" with {
			label: ticket.id,
			url: ticket.url,
			variant: "neutral",
			classes: ["TicketTable-id", "u-typo-TextS"]
		} only %}
	{% endset %}

	{% set name %}
		<div class="TicketTable-name u-typo-TextS">
			{{ ticket.name }}
		</div>
	{% endset %}

	{% set service %}
		<div class="TicketTable-service u-typo-TextS">
			{{ ticket.service }}
		</div>
	{% endset %}

	{% set status_tags %}
		<ul class="TicketTable-tags u-typo-TextS">
			{% for tag in ticket.status_tags|slice(0, 3) %}
				<li>
					{% include "@apps/cloud/ticket-overview/app-ticket-overview/status-tag/status-tag.twig" with tag only %}
				</li>
			{% endfor %}
		</ul>
	{% endset %}

	{% set date %}
		<div class="TicketTable-date u-typo-TextS">
			{{ ticket.date }}
		</div>
	{% endset %}

	{% set row = [
		{content: subject},
		{content: id},
		{content: name},
		{content: service},
		{content: status_tags},
		{content: date},
	] %}

	{% set body = body|merge([row]) %}
{% endfor %}


<div class="TicketTable">
	{% include "@elements/table/table.twig" with {
		head: head,
		body: body,
	} only %}
</div>