235 lines
9.1 KiB
HTML
235 lines
9.1 KiB
HTML
{% load i18n %}
|
|
<!-- start of import form -->
|
|
<div
|
|
class="oh-modal"
|
|
id="projectImport"
|
|
role="dialog"
|
|
aria-labelledby="projectImport"
|
|
aria-hidden="true"
|
|
>
|
|
<div class="oh-modal__dialog">
|
|
<div class="oh-modal__dialog-header">
|
|
<h2 class="oh-modal__dialog-title" id="projectImportLavel">
|
|
{% trans "Import Project" %}
|
|
</h2>
|
|
<button class="oh-modal__close" aria-label="Close">
|
|
<ion-icon name="close-outline"></ion-icon>
|
|
</button>
|
|
<div class="oh-modal__dialog-body p-0 pt-2" id="projectImportModalBody">
|
|
<form
|
|
|
|
id="projectImportForm"
|
|
enctype="multipart/form-data"
|
|
>
|
|
<div id="loading" style="display: none;">
|
|
<div id="progress">
|
|
<div class="progress-bar" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>
|
|
</div>
|
|
<p id="progress-text">{% trans "Uploading..." %}</p>
|
|
</div>
|
|
|
|
<div id="error-container" style='color:red;'></div>
|
|
|
|
<div class="modal-body">
|
|
|
|
{% csrf_token %}
|
|
{% comment %} {% endcomment %}
|
|
<div class="oh-dropdown__import-form">
|
|
<label class="oh-dropdown__import-label" for="uploadFile">
|
|
<ion-icon name="cloud-upload" class="oh-dropdown__import-form-icon md hydrated" role="img" aria-label="cloud upload"></ion-icon>
|
|
<span class="oh-dropdown__import-form-title">{% trans "Upload a File" %}</span>
|
|
<span class="oh-dropdown__import-form-text">{% trans "Drag and drop files here" %}</span>
|
|
</label>
|
|
<input type="file" name="file" id="projectImportFile" />
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer d-flex flex-row-reverse">
|
|
<input
|
|
type="submit"
|
|
class="oh-btn oh-btn--secondary"
|
|
value='{% trans "Upload" %}'
|
|
/>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- end of import form -->
|
|
|
|
<!-- start of navbar contents -->
|
|
<section class="oh-wrapper oh-main__topbar" x-data="{searchShow: false}">
|
|
<div class="oh-main__titlebar oh-main__titlebar--left">
|
|
<h1 class="oh-main__titlebar-title fw-bold">{% trans "Projects" %}</h1>
|
|
<a
|
|
class="oh-main__titlebar-search-toggle"
|
|
role="button"
|
|
aria-label="Toggle Search"
|
|
@click="searchShow = !searchShow"
|
|
>
|
|
<ion-icon
|
|
name="search-outline"
|
|
class="oh-main__titlebar-serach-icon md hydrated"
|
|
role="img"
|
|
aria-label="search outline"
|
|
></ion-icon>
|
|
</a>
|
|
</div>
|
|
<div class="oh-main__titlebar oh-main__titlebar--right">
|
|
{% if projects %}
|
|
{% comment %} for search{% endcomment %}
|
|
<form
|
|
hx-get='{% url "project-filter" %}?view={{request.GET.view }}'
|
|
hx-target="#view-container"
|
|
hx-swap="innerHTML"
|
|
id="projectFilterForm"
|
|
class="d-flex"
|
|
onsubmit="event.preventDefault()"
|
|
>
|
|
<div
|
|
class="oh-input-group oh-input__search-group"
|
|
:class="searchShow ? 'oh-input__search-group--show' : ''"
|
|
>
|
|
<ion-icon
|
|
name="search-outline"
|
|
class="oh-input-group__icon oh-input-group__icon--left"
|
|
></ion-icon>
|
|
<input
|
|
type="text"
|
|
class="oh-input oh-input__icon"
|
|
aria-label="Search Input"
|
|
id="filter-project"
|
|
name="search"
|
|
placeholder="{% trans 'Search' %}"
|
|
onkeyup="$('.filterButton')[0].click()"
|
|
/>
|
|
</div>
|
|
<div class="oh-dropdown" x-data="{open: false}">
|
|
<ul class="oh-view-types ml-2">
|
|
{% comment %} for list view {% endcomment %}
|
|
<li class="oh-view-type project-view-type" data-view="list">
|
|
<a
|
|
href="{% url 'project-view' %}?view=list"
|
|
{% comment %} hx-target="#view-container" {% endcomment %}
|
|
class="oh-btn oh-btn--view"
|
|
><ion-icon name="list-outline"></ion-icon
|
|
></a>
|
|
</li>
|
|
{% comment %} for card view {% endcomment %}
|
|
<li class="oh-view-type project-view-type" data-view="card">
|
|
<a
|
|
href="{% url 'project-view' %}?view=card"
|
|
{% comment %} hx-target="#view-container" {% endcomment %}
|
|
class="oh-btn oh-btn--view"
|
|
><ion-icon name="grid-outline"></ion-icon
|
|
></a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
{% comment %} for filtering {% endcomment %}
|
|
<div class="oh-dropdown" x-data="{open: false}">
|
|
<button
|
|
class="oh-btn ml-2"
|
|
@click="open = !open"
|
|
onclick="event.preventDefault()"
|
|
>
|
|
<ion-icon name="filter" class="mr-1"></ion-icon>{% trans "Filter" %}
|
|
<div id="filterCount"></div>
|
|
</button>
|
|
<div
|
|
class="oh-dropdown__menu oh-dropdown__menu--right oh-dropdown__filter p-4"
|
|
x-show="open"
|
|
@click.outside="open = false"
|
|
style="display: none;"
|
|
>
|
|
{% include 'project/new/filter_project.html' %}
|
|
</div>
|
|
</div>
|
|
</form>
|
|
{% comment %} for actions {% endcomment %}
|
|
<div class="oh-btn-group ml-2">
|
|
<div class="oh-dropdown" x-data="{open: false}">
|
|
<button
|
|
class="oh-btn oh-btn--dropdown oh-btn oh-btn--shadow"
|
|
@click="open = !open"
|
|
@click.outside="open = false"
|
|
>
|
|
{% trans "Actions" %}
|
|
</button>
|
|
<div class="oh-dropdown__menu oh-dropdown__menu--right" x-show="open" style="display: none;">
|
|
<ul class="oh-dropdown__items">
|
|
{% comment %} {% if perms.delete_employee %} {% endcomment %}
|
|
<li class="oh-dropdown__item">
|
|
<a href="#"
|
|
class="oh-dropdown__link "
|
|
id="importProject"
|
|
data-toggle="oh-modal-toggle"
|
|
data-target="#projectImport"
|
|
>{% trans "Import" %}</a
|
|
>
|
|
</li>
|
|
{% comment %} {% endif %} {% endcomment %}
|
|
{% comment %} {% if perms.delete_employee %} {% endcomment %}
|
|
<li class="oh-dropdown__item">
|
|
<a href="#"
|
|
class="oh-dropdown__link "
|
|
id="exportProject"
|
|
>{% trans "Export" %}</a
|
|
>
|
|
</li>
|
|
{% comment %} {% endif %} {% endcomment %}
|
|
{% comment %} {% if perms.delete_employee %} {% endcomment %}
|
|
<li class="oh-dropdown__item">
|
|
<a href="#" class="oh-dropdown__link " id="duplicateProject"
|
|
>{% trans "Duplicate" %}</a
|
|
>
|
|
</li>
|
|
{% comment %} {% endif %} {% endcomment %}
|
|
{% comment %} {% if perms.delete_employee %} {% endcomment %}
|
|
<li class="oh-dropdown__item">
|
|
<a href="#" class="oh-dropdown__link " id="archiveProject"
|
|
>{% trans "Archive" %}</a
|
|
>
|
|
</li>
|
|
{% comment %} {% endif %} {% endcomment %}
|
|
{% comment %} {% if perms.delete_employee %} {% endcomment %}
|
|
<li class="oh-dropdown__item">
|
|
<a href="#" class="oh-dropdown__link " id="unArchiveProject"
|
|
>{% trans "Un-Archive" %}</a
|
|
>
|
|
</li>
|
|
{% comment %} {% endif %} {% endcomment %}
|
|
{% comment %} {% if perms.delete_employee %} {% endcomment %}
|
|
<li class="oh-dropdown__item">
|
|
<a
|
|
href="#"
|
|
class="oh-dropdown__link oh-dropdown__link--danger"
|
|
id="deleteProject"
|
|
>{% trans "Delete" %}</a
|
|
>
|
|
</li>
|
|
{% comment %} {% endif %} {% endcomment %}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
{% comment %} for create project {% endcomment %}
|
|
<div class="oh-main__titlebar-button-container">
|
|
<div class="oh-btn-group ml-2">
|
|
<div>
|
|
<a
|
|
class="oh-btn oh-btn--secondary oh-btn--shadow"
|
|
data-toggle="oh-modal-toggle"
|
|
data-target="#ProjectModal"
|
|
hx-get="{% url 'create-project' %}"
|
|
hx-target="#ProjectFormTarget"
|
|
>
|
|
<ion-icon class="me-2" name="add-outline"></ion-icon>{% trans "Create" %}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|