tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #655 from tainacan/feature/647 

Feature/647
This commit is contained in:
Mateus Machado Luna 2022-01-13 17:47:09 -03:00 committed by GitHub
parent d131e184a3 df1bb8f5c7
commit 6a41fa2179
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 97 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/views/admin/admin.vue
View File

@ -4,6 +4,7 @@
class="has-mounted columns is-fullheight"
:class="{
'tainacan-admin-iframe-mode': isIframeMode,
'tainacan-admin-mobile-mode': isMobileMode,
'tainacan-admin-read-mode': isReadMode
}">
<template v-if="activeRoute == 'HomePage'">
@ -11,7 +12,7 @@
<router-view />
</template>
<template v-else>
<template v-if="!isIframeMode">
<template v-if="!isIframeMode && !isMobileMode">
<primary-menu
:active-route="activeRoute"
:is-menu-compressed="isMenuCompressed"/>
@ -68,11 +69,14 @@
}
},
computed: {
isReadMode () {
isReadMode() {
return this.$route && this.$route.query && this.$route.query.readmode;
},
isIframeMode () {
isIframeMode() {
return this.$route && this.$route.query && this.$route.query.iframemode;
},
isMobileMode() {
return this.$route && this.$route.query && this.$route.query.mobilemode;
}
},
watch: {
@ -128,11 +132,13 @@
height: 100%;
margin-bottom: 0px;
margin-top: 0px;
}
@media screen and (max-width: 769px) {
@media screen and (max-width: 769px) {
.is-fullheight:not(.tainacan-admin-mobile-mode):not(.tainacan-admin-collection-mobile-mode) {
height: auto;
}
}
}
.is-main-content {
padding: 0px !important;

7
src/views/admin/components/edition/item-bulk-edition-form.vue
View File

@ -4,7 +4,9 @@
:is-full-page="false"
:active.sync="isLoading"
:can-cancel="false"/>
<div class="tainacan-page-title">
<div
v-if="!isMobileMode"
class="tainacan-page-title">
<h1>{{ $i18n.get('add_items_bulk') }}</h1>
<a
@click="$router.go(-1)"
@ -207,6 +209,9 @@ export default {
},
collection() {
return this.getCollection()
},
isMobileMode() {
return this.$route && this.$route.query && this.$route.query.mobilemode;
}
},
created() {

31
src/views/admin/components/edition/item-edition-form.vue
View File

@ -5,7 +5,9 @@
:active.sync="isLoading"
:can-cancel="false"/>
<div class="tainacan-page-title">
<div
v-if="!isMobileMode || (isMobileMode && isEditingMetadataIframeMode)"
class="tainacan-page-title">
<h1 v-if="isCreatingNewItem">
<span
v-if="(item != null && item != undefined && item.status != undefined && !isLoading)"
@ -54,7 +56,9 @@
<div class="columns">
<!-- Collection -------------------------------- -->
<div class="column is-narrow">
<div
v-if="!isMobileMode"
class="column is-narrow">
<div class="section-label">
<label>{{ $i18n.get('collection') }}</label>
</div>
@ -1058,6 +1062,9 @@ export default {
},
isEditingMetadataIframeMode() {
return this.$route.query && this.$route.query.editingmetadata;
},
isMobileMode() {
return this.$route.query && this.$route.query.mobilemode;
}
},
watch: {
@ -1879,14 +1886,16 @@ export default {
padding-left: var(--tainacan-one-column);
padding-right: var(--tainacan-one-column);
.sticky-container {
position: relative;
position: sticky;
top: -25px;
margin: 3px 0;
max-height: calc(100vh - 202px);
overflow-y: auto;
overflow-x: hidden;
@media screen and (min-width: 770px) {
.sticky-container {
position: relative;
position: sticky;
top: -25px;
margin: 3px 0;
max-height: calc(100vh - 202px);
overflow-y: auto;
overflow-x: hidden;
}
}
}
.column.is-7 {
@ -1928,7 +1937,7 @@ export default {
widows: 100%;
.field {
padding-left: 16px;
padding-left: 18px;
/deep/ .label {
margin-left: 0;

5
src/views/admin/components/lists/related-items-list.vue
View File

@ -137,7 +137,7 @@
<iframe
width="100%"
style="height: 85vh"
:src="adminFullURL + $routerHelper.getItemEditPath(collectionId, editItemId) + '?iframemode=true&editingmetadata=' + editMetadataId" />
:src="adminFullURL + $routerHelper.getItemEditPath(collectionId, editItemId) + '?iframemode=true&editingmetadata=' + editMetadataId + (isMobileMode ? '&mobilemode=true' : '')" />
</b-modal>
</div>
</div>
@ -170,6 +170,9 @@
},
displayLoading() {
return this.isLoading || this.isUpdatingRelatedItems;
},
isMobileMode() {
return this.$route && this.$route.query && this.$route.query.mobilemode;
}
},
watch: {

7
src/views/admin/components/metadata-types/relationship/Relationship.vue
View File

@ -178,9 +178,9 @@
},
itemModalSrc() {
if (this.editingItemId)
return this.adminFullURL + this.$routerHelper.getItemEditPath(this.collectionId, this.editingItemId) + '?iframemode=true';
return this.adminFullURL + this.$routerHelper.getItemEditPath(this.collectionId, this.editingItemId) + '?iframemode=true' + (this.isMobileMode ? '&mobilemode=true' : '');
else
return this.adminFullURL + this.$routerHelper.getNewItemPath(this.collectionId) + '?iframemode=true&newmetadatumid=' + this.itemMetadatum.metadatum.metadata_type_options.search + '&newitemtitle=' + this.searchQuery;
return this.adminFullURL + this.$routerHelper.getNewItemPath(this.collectionId) + '?iframemode=true&newmetadatumid=' + this.itemMetadatum.metadatum.metadata_type_options.search + '&newitemtitle=' + this.searchQuery + (this.isMobileMode ? '&mobilemode=true' : '');
},
relationshipInputId() {
if (this.itemMetadatum && this.itemMetadatum.metadatum)
@ -195,6 +195,9 @@
this.itemMetadatum.metadatum.metadata_type_options.display_related_item_metadata &&
this.itemMetadatum.metadatum.metadata_type_options.display_related_item_metadata.length &&
this.itemMetadatum.metadatum.metadata_type_options.display_related_item_metadata.length > 1;
},
isMobileMode() {
return this.$route && this.$route.query && this.$route.query.mobilemode;
}
},
watch: {

18
src/views/admin/pages/singles/collection-page.vue
View File

@ -1,7 +1,9 @@
<template>
<div class="columns is-fullheight">
<div
class="columns is-fullheight"
:class="{ 'tainacan-admin-collection-mobile-mode': isMobileMode }">
<section class="column is-secondary-content">
<tainacan-collection-subheader />
<tainacan-collection-subheader v-if="!isIframeMode && !isMobileMode" />
<router-view
id="collection-page-container"
@ -25,6 +27,14 @@ export default {
collectionId: Number
}
},
computed: {
isIframeMode() {
return this.$route && this.$route.query && this.$route.query.iframemode;
},
isMobileMode() {
return this.$route && this.$route.query && this.$route.query.mobilemode;
}
},
watch: {
'$route' (to, from) {
if (!this.isRepositoryLevel && from.path != undefined && to.path != from.path && this.collectionId != this.$route.params.collectionId) {
@ -51,8 +61,4 @@ export default {
}
</script>
<style scoped>
</style>

40
src/views/admin/scss/_iframe_read_mode_overrides.scss → src/views/admin/scss/_iframe_special_modes_overrides.scss
View File

@ -1,5 +1,5 @@
// IFRAME MODE AND READ MODE
// Used on gutenberg blocks, hiding content not relevant to be rendered inside iframe
// IFRAME MODE
// Used on gutenberg block modals, hiding content not relevant to be rendered inside iframe
#tainacan-admin-app.tainacan-admin-iframe-mode {
#primary-menu,
#menu-compress-button,
@ -30,6 +30,9 @@
}
}
}
// READ MODE
// Used on gutenberg block modals, hiding content related to selecting the items
#tainacan-admin-app.tainacan-admin-read-mode {
#items-list-area {
@ -57,4 +60,37 @@
.metadata-title { margin-left: 6px; }
}
}
}
// MOBILE MODE
// Used on the mobile app, to show only necessary elements inside the webview
#tainacan-admin-app.tainacan-admin-mobile-mode {
#primary-menu,
#menu-compress-button,
#tainacan-header,
#tainacan-repository-subheader,
#tainacan-subheader {
display: none;
visibility: hidden;
}
#repository-container .is-secondary-content {
margin-top: 0;
height: 100%;
.page-container-small {
height: 100%;
#item-creation-options-dropdown,
#items-list-results .selection-control .field {
display: none;
visibility: hidden;
}
@media screen and (min-width: 769px) {
#filters-modal {
padding-left: 0em;
}
}
}
}
}

2
src/views/admin/scss/tainacan-admin.scss
View File

@ -29,7 +29,7 @@
@import "../scss/_notices.scss";
@import "../scss/_filters-menu-modal.scss";
@import "../scss/_repository-level-overrides.scss";
@import "../scss/_iframe_read_mode_overrides.scss";
@import "../scss/_iframe_special_modes_overrides.scss";
@import "../scss/_custom_variables.scss";
// Clears wordpress content