|
|
@ -6,7 +6,7 @@ |
|
|
|
<section class="hero project-image"> |
|
|
|
<div class="container"> |
|
|
|
<div class="columns"> |
|
|
|
<div class="column is-12"> |
|
|
|
<div class="column is-10 is-offset-1"> |
|
|
|
<h1 class="title is-1 has-text-white"> |
|
|
|
Hello, {{ user.get_username | title }}. |
|
|
|
</h1> |
|
|
@ -25,105 +25,118 @@ |
|
|
|
</div> |
|
|
|
</section> |
|
|
|
|
|
|
|
<div class="container"> |
|
|
|
<div class="columns mt0"> |
|
|
|
<div class="column is-3"> |
|
|
|
<aside class="menu"> |
|
|
|
<p class="menu-label"> |
|
|
|
Categories |
|
|
|
</p> |
|
|
|
<ul class="menu-list"> |
|
|
|
<li> |
|
|
|
<a v-bind:class="{active: selectedType == 'All' }" v-on:click="updateSelectedType('All')">All</a> |
|
|
|
</li> |
|
|
|
<li v-for="t in uniqueProjectTypes"> |
|
|
|
<a v-bind:class="{active: t == selectedType }" v-on:click="updateSelectedType(t)">[[ t ]]</a> |
|
|
|
</li> |
|
|
|
</ul> |
|
|
|
</aside> |
|
|
|
</div> |
|
|
|
<div class="column is-9"> |
|
|
|
<!-- Modal card for creating project. --> |
|
|
|
<div class="modal" :class="{ 'is-active': isActive }"> |
|
|
|
<div class="modal-background"></div> |
|
|
|
<div class="modal-card"> |
|
|
|
<header class="modal-card-head"> |
|
|
|
<p class="modal-card-title">Create Project</p> |
|
|
|
<button class="delete" aria-label="close" @click="isActive=!isActive"></button> |
|
|
|
</header> |
|
|
|
<form method="post"> |
|
|
|
{% csrf_token %} |
|
|
|
<section class="modal-card-body"> |
|
|
|
{% for hidden_field in form.hidden_fields %} {{ hidden_field }} {% endfor %} {% for field in form.visible_fields %} |
|
|
|
<div class="field"> |
|
|
|
{{ field.label_tag }} |
|
|
|
<div class="control"> |
|
|
|
{% render_field field class="input select-height" %} |
|
|
|
</div> |
|
|
|
{% if field.help_text %} |
|
|
|
<small class="form-text text-muted">{{ field.help_text }}</small> |
|
|
|
{% endif %} |
|
|
|
</div> |
|
|
|
{% endfor %} |
|
|
|
</section> |
|
|
|
<footer class="modal-card-foot pt20 pb20 pr20 pl20 has-background-white-ter"> |
|
|
|
<button class="button is-primary">Create</button> |
|
|
|
<button class="button" @click="isActive=!isActive">Cancel</button> |
|
|
|
</footer> |
|
|
|
</form> |
|
|
|
<!-- Modal card for creating project. --> |
|
|
|
<div class="modal" :class="{ 'is-active': isActive }"> |
|
|
|
<div class="modal-background"></div> |
|
|
|
<div class="modal-card"> |
|
|
|
<header class="modal-card-head"> |
|
|
|
<p class="modal-card-title">Create Project</p> |
|
|
|
<button class="delete" aria-label="close" @click="isActive=!isActive"></button> |
|
|
|
</header> |
|
|
|
<form method="post"> |
|
|
|
{% csrf_token %} |
|
|
|
<section class="modal-card-body"> |
|
|
|
{% for hidden_field in form.hidden_fields %} |
|
|
|
{{ hidden_field }} |
|
|
|
{% endfor %} |
|
|
|
{% for field in form.visible_fields %} |
|
|
|
<div class="field"> |
|
|
|
{{ field.label_tag }} |
|
|
|
<div class="control"> |
|
|
|
{% render_field field class="input select-height" %} |
|
|
|
</div> |
|
|
|
{% if field.help_text %} |
|
|
|
<small class="form-text text-muted">{{ field.help_text }}</small> |
|
|
|
{% endif %} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
{% endfor %} |
|
|
|
</section> |
|
|
|
<footer class="modal-card-foot pt20 pb20 pr20 pl20 has-background-white-ter"> |
|
|
|
<button class="button is-primary">Create</button> |
|
|
|
<button class="button" @click="isActive=!isActive">Cancel</button> |
|
|
|
</footer> |
|
|
|
</form> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="columns features" v-for="projects in filteredProjects"> |
|
|
|
<div class="column is-4" v-for="project in projects"> |
|
|
|
<div class="modal" :class="{ 'is-active': isDelete }"> |
|
|
|
<div class="modal-background"></div> |
|
|
|
<div class="modal-card"> |
|
|
|
<header class="modal-card-head"> |
|
|
|
<p class="modal-card-title">Delete Project</p> |
|
|
|
<button class="delete" aria-label="close" @click="isDelete=!isDelete"></button> |
|
|
|
</header> |
|
|
|
<section class="modal-card-body"> |
|
|
|
Are you sure you want to delete project? |
|
|
|
</section> |
|
|
|
<footer class="modal-card-foot pt20 pb20 pr20 pl20 has-background-white-ter"> |
|
|
|
<button class="button is-danger" @click="deleteProject()">Delete</button> |
|
|
|
<button class="button" @click="isDelete=!isDelete">Cancel</button> |
|
|
|
</footer> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="card is-shady"> |
|
|
|
<div class="card-image"> |
|
|
|
<figure class="image is-4by3"> |
|
|
|
<img v-bind:src="project.image" alt="Placeholder image"> |
|
|
|
</figure> |
|
|
|
</div> |
|
|
|
<div class="card-content"> |
|
|
|
<div class="content"> |
|
|
|
<h4> |
|
|
|
<a v-bind:href="'/projects/' + project.id">[[ project.name ]]</a> |
|
|
|
</h4> |
|
|
|
<p> |
|
|
|
[[ project.description.slice(0, 50) ]] |
|
|
|
</p> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
{% if user.is_superuser %} |
|
|
|
<!-- Modal card for creating project. --> |
|
|
|
<div class="modal" :class="{ 'is-active': isDelete }"> |
|
|
|
<div class="modal-background"></div> |
|
|
|
<div class="modal-card"> |
|
|
|
<header class="modal-card-head"> |
|
|
|
<p class="modal-card-title">Delete Project</p> |
|
|
|
<button class="delete" aria-label="close" @click="isDelete=!isDelete"></button> |
|
|
|
</header> |
|
|
|
<section class="modal-card-body"> |
|
|
|
Are you sure you want to delete project? |
|
|
|
</section> |
|
|
|
<footer class="modal-card-foot pt20 pb20 pr20 pl20 has-background-white-ter"> |
|
|
|
<button class="button is-danger" @click="deleteProject()">Delete</button> |
|
|
|
<button class="button" @click="isDelete=!isDelete">Cancel</button> |
|
|
|
</footer> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="card-footer"> |
|
|
|
<a v-bind:href="'/projects/' + project.id + '/docs'" class="card-footer-item">Edit</a> |
|
|
|
<a href="#1" class="card-footer-item has-text-danger has-text-weight-bold" @click="setProject(project)">Delete</a> |
|
|
|
<section class="hero"> |
|
|
|
<div class="container"> |
|
|
|
<div class="columns"> |
|
|
|
<div class="column is-10 is-offset-1"> |
|
|
|
<div class="card events-card"> |
|
|
|
<header class="card-header"> |
|
|
|
<p class="card-header-title"> |
|
|
|
[[ items.length ]] Projects |
|
|
|
</p> |
|
|
|
<div class="field card-header-icon"> |
|
|
|
<div class="control"> |
|
|
|
<div class="select"> |
|
|
|
<select v-model="selected"> |
|
|
|
<option selected>All Project</option> |
|
|
|
<option>Text Classification</option> |
|
|
|
<option>Sequence Labeling</option> |
|
|
|
<option>Seq2seq</option> |
|
|
|
</select> |
|
|
|
</div> |
|
|
|
{% endif %} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</header> |
|
|
|
<div class="card-table"> |
|
|
|
<div class="content"> |
|
|
|
<table class="table is-fullwidth"> |
|
|
|
<tbody> |
|
|
|
<tr v-for="project in selectedProjects"> |
|
|
|
<td class="pl15r"> |
|
|
|
<div class="thumbnail-wrapper is-vertical"> |
|
|
|
<img class="project-thumbnail" v-bind:src="project.image"> |
|
|
|
</div> |
|
|
|
<div class="dataset-item__main is-vertical"> |
|
|
|
<div class="dataset-item__main-title"> |
|
|
|
<div class="dataset-item__main-title-link dataset-item__link"> |
|
|
|
<a v-bind:href="'/projects/' + project.id" class="has-text-black">[[ project.name ]]</a> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="dataset-item__main-subtitle"> |
|
|
|
[[ project.description ]] |
|
|
|
</div> |
|
|
|
<div class="dataset-item__main-info"> |
|
|
|
<span class="dataset-item__main-update">updated <span title="Sun Nov 04 2018 07:35:07 GMT+0900 (日本標準時)">11 |
|
|
|
days ago</span></span></div> |
|
|
|
</div> |
|
|
|
</td> |
|
|
|
<td class="is-vertical"><span class="tag is-normal">[[ project.project_type ]]</span></td> |
|
|
|
{% if user.is_superuser %} |
|
|
|
<td class="is-vertical"><a v-bind:href="'/projects/' + project.id + '/docs'">Edit</a></td> |
|
|
|
<td class="is-vertical"><a class="has-text-danger" @click="setProject(project)">Delete</a></td> |
|
|
|
{% endif %} |
|
|
|
</tr> |
|
|
|
</tbody> |
|
|
|
</table> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</section> |
|
|
|
|
|
|
|
</div> |
|
|
|
{% endblock %} |
|
|
|
{% block footer %} |
|
|
|