Moves attachment list to tab on item edition form as well.

This commit is contained in:
Mateus Machado Luna 2019-08-01 18:07:32 -03:00
parent de9e026135
commit ecdb3eaa5c
2 changed files with 113 additions and 97 deletions

View File

@ -357,46 +357,6 @@
</b-field> </b-field>
<br> <br>
<!-- Attachments ------------------------------------------ -->
<div class="section-label">
<label>{{ $i18n.get('label_attachments') }}</label>
</div>
<div class="section-box section-attachments">
<button
type="button"
class="button is-secondary"
@click.prevent="attachmentMediaFrame.openFrame($event)">
{{ $i18n.get("label_edit_attachments") }}
</button>
<div class="uploaded-files">
<div
class="file-item-container"
v-for="(attachment, index) in attachmentsList"
:key="index">
<file-item
:style="{ margin: 15 + 'px'}"
v-if="attachmentsList.length > 0"
:modal-on-click="true"
:show-name="true"
:file="attachment"/>
<span class="file-item-control">
<a
@click="deleteAttachment(attachment)"
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
placement: 'bottom'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-20px tainacan-icon-delete"/>
</a>
</span>
</div>
<p v-if="attachmentsList.length <= 0"><br>{{ $i18n.get('info_no_attachments_on_item_yet') }}</p>
</div>
</div>
<!-- Hook for extra Form options --> <!-- Hook for extra Form options -->
<template <template
v-if="formHooks != undefined && v-if="formHooks != undefined &&
@ -466,7 +426,16 @@
</div> </div>
</div> </div>
<b-tabs v-model="activeTab">
<!-- Metadata from Collection-------------------------------- --> <!-- Metadata from Collection-------------------------------- -->
<b-tab-item>
<template slot="header">
<span class="icon has-text-gray4">
<i class="tainacan-icon tainacan-icon-18px tainacan-icon-metadata"/>
</span>
<span>{{ $i18n.get('metadata') }}</span>
</template>
<span class="section-label"> <span class="section-label">
<label>{{ $i18n.get('metadata') }}</label> <label>{{ $i18n.get('metadata') }}</label>
</span> </span>
@ -498,6 +467,57 @@
class="form-hook-region" class="form-hook-region"
v-html="formHooks['item']['end-right'].join('')"/> v-html="formHooks['item']['end-right'].join('')"/>
</template> </template>
</b-tab-item>
<!-- Attachments ------------------------------------------ -->
<b-tab-item>
<template slot="header">
<span class="icon has-text-gray4">
<i class="tainacan-icon tainacan-icon-18px tainacan-icon-attachments"/>
</span>
<span>{{ $i18n.get('label_attachments') }}</span>
</template>
<div class="section-label">
<label>{{ $i18n.get('label_attachments') }}</label>
</div>
<div class="section-box section-attachments">
<button
type="button"
class="button is-secondary"
@click.prevent="attachmentMediaFrame.openFrame($event)">
{{ $i18n.get("label_edit_attachments") }}
</button>
<div class="uploaded-files">
<div
class="file-item-container"
v-for="(attachment, index) in attachmentsList"
:key="index">
<file-item
:style="{ margin: 15 + 'px'}"
v-if="attachmentsList.length > 0"
:modal-on-click="true"
:show-name="true"
:file="attachment"/>
<span class="file-item-control">
<a
@click="deleteAttachment(attachment)"
v-tooltip="{
content: $i18n.get('delete'),
autoHide: true,
placement: 'bottom'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-20px tainacan-icon-delete"/>
</a>
</span>
</div>
<p v-if="attachmentsList.length <= 0"><br>{{ $i18n.get('info_no_attachments_on_item_yet') }}</p>
</div>
</div>
</b-tab-item>
</b-tabs>
</div> </div>
</div> </div>
@ -730,7 +750,8 @@ export default {
isUpdatingValues: false, isUpdatingValues: false,
collectionName: '', collectionName: '',
collectionAllowComments: '', collectionAllowComments: '',
entityName: 'item' entityName: 'item',
activeTab: 0,
} }
}, },
computed: { computed: {
@ -1380,9 +1401,10 @@ export default {
padding-left: $page-side-padding; padding-left: $page-side-padding;
max-width: 100%; max-width: 100%;
} }
} }
.b-tabs {
overflow: hidden !important;
}
} }
.section-label { .section-label {
@ -1442,12 +1464,7 @@ export default {
} }
} }
.section-attachments { .section-attachments {
border: 1px solid $gray2; margin-top: 0px;
height: 250px;
max-width: 100%;
resize: vertical;
overflow: auto;
p { margin: 4px 15px } p { margin: 4px 15px }
} }

View File

@ -255,21 +255,6 @@
</template> </template>
</b-tab-item> </b-tab-item>
<b-tab-item>
<template slot="header">
<span class="icon has-text-gray4">
<i class="tainacan-icon tainacan-icon-18px tainacan-icon-activities"/>
</span>
<span>{{ $i18n.get('activities') }}</span>
</template>
<div class="section-label">
<label>{{ $i18n.get('activities') }}</label>
</div>
<br>
<activities-page />
</b-tab-item>
<b-tab-item> <b-tab-item>
<template slot="header"> <template slot="header">
<span class="icon has-text-gray4"> <span class="icon has-text-gray4">
@ -298,6 +283,20 @@
</div> </div>
</b-tab-item> </b-tab-item>
<b-tab-item>
<template slot="header">
<span class="icon has-text-gray4">
<i class="tainacan-icon tainacan-icon-18px tainacan-icon-activities"/>
</span>
<span>{{ $i18n.get('activities') }}</span>
</template>
<div class="section-label">
<label>{{ $i18n.get('activities') }}</label>
</div>
<br>
<activities-page />
</b-tab-item>
</b-tabs> </b-tabs>
</div> </div>
</div> </div>