Moves attachment list to tab on item edition form as well.
This commit is contained in:
Mateus Machado Luna
parent
de9e026135
commit
ecdb3eaa5c
|
|
@ -356,47 +356,7 @@
|
||||||
:message="$i18n.getHelperMessage('items', 'comment_status')"/>
|
:message="$i18n.getHelperMessage('items', 'comment_status')"/>
|
||||||
</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,38 +426,98 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Metadata from Collection-------------------------------- -->
|
<b-tabs v-model="activeTab">
|
||||||
<span class="section-label">
|
|
||||||
<label>{{ $i18n.get('metadata') }}</label>
|
|
||||||
</span>
|
|
||||||
<br>
|
|
||||||
<a
|
|
||||||
class="collapse-all"
|
|
||||||
@click="toggleCollapseAll()">
|
|
||||||
{{ collapseAll ? $i18n.get('label_collapse_all') : $i18n.get('label_expand_all') }}
|
|
||||||
<span class="icon">
|
|
||||||
<i
|
|
||||||
:class="{ 'tainacan-icon-arrowdown' : collapseAll, 'tainacan-icon-arrowright' : !collapseAll }"
|
|
||||||
class="tainacan-icon tainacan-icon-20px"/>
|
|
||||||
</span>
|
|
||||||
</a>
|
|
||||||
<tainacan-form-item
|
|
||||||
v-for="(metadatum, index) of metadatumList"
|
|
||||||
:key="index"
|
|
||||||
:metadatum="metadatum"
|
|
||||||
:is-collapsed="metadataCollapses[index]"
|
|
||||||
@changeCollapse="onChangeCollapse($event, index)"/>
|
|
||||||
|
|
||||||
<!-- Hook for extra Form options -->
|
<!-- Metadata from Collection-------------------------------- -->
|
||||||
<template
|
<b-tab-item>
|
||||||
v-if="formHooks != undefined &&
|
<template slot="header">
|
||||||
formHooks['item'] != undefined &&
|
<span class="icon has-text-gray4">
|
||||||
formHooks['item']['end-right'] != undefined">
|
<i class="tainacan-icon tainacan-icon-18px tainacan-icon-metadata"/>
|
||||||
<form
|
</span>
|
||||||
id="form-item-end-right"
|
<span>{{ $i18n.get('metadata') }}</span>
|
||||||
class="form-hook-region"
|
</template>
|
||||||
v-html="formHooks['item']['end-right'].join('')"/>
|
<span class="section-label">
|
||||||
</template>
|
<label>{{ $i18n.get('metadata') }}</label>
|
||||||
|
</span>
|
||||||
|
<br>
|
||||||
|
<a
|
||||||
|
class="collapse-all"
|
||||||
|
@click="toggleCollapseAll()">
|
||||||
|
{{ collapseAll ? $i18n.get('label_collapse_all') : $i18n.get('label_expand_all') }}
|
||||||
|
<span class="icon">
|
||||||
|
<i
|
||||||
|
:class="{ 'tainacan-icon-arrowdown' : collapseAll, 'tainacan-icon-arrowright' : !collapseAll }"
|
||||||
|
class="tainacan-icon tainacan-icon-20px"/>
|
||||||
|
</span>
|
||||||
|
</a>
|
||||||
|
<tainacan-form-item
|
||||||
|
v-for="(metadatum, index) of metadatumList"
|
||||||
|
:key="index"
|
||||||
|
:metadatum="metadatum"
|
||||||
|
:is-collapsed="metadataCollapses[index]"
|
||||||
|
@changeCollapse="onChangeCollapse($event, index)"/>
|
||||||
|
|
||||||
|
<!-- Hook for extra Form options -->
|
||||||
|
<template
|
||||||
|
v-if="formHooks != undefined &&
|
||||||
|
formHooks['item'] != undefined &&
|
||||||
|
formHooks['item']['end-right'] != undefined">
|
||||||
|
<form
|
||||||
|
id="form-item-end-right"
|
||||||
|
class="form-hook-region"
|
||||||
|
v-html="formHooks['item']['end-right'].join('')"/>
|
||||||
|
</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 }
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -254,22 +254,7 @@
|
||||||
v-html="formHooks['view-item']['end-right'].join('')"/>
|
v-html="formHooks['view-item']['end-right'].join('')"/>
|
||||||
</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>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue