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

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

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

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

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

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

@ -137,7 +137,7 @@
<iframe <iframe
width="100%" width="100%"
style="height: 85vh" 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> </b-modal>
</div> </div>
</div> </div>
@ -170,6 +170,9 @@
}, },
displayLoading() { displayLoading() {
return this.isLoading || this.isUpdatingRelatedItems; return this.isLoading || this.isUpdatingRelatedItems;
},
isMobileMode() {
return this.$route && this.$route.query && this.$route.query.mobilemode;
} }
}, },
watch: { watch: {

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

@ -178,9 +178,9 @@
}, },
itemModalSrc() { itemModalSrc() {
if (this.editingItemId) 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 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() { relationshipInputId() {
if (this.itemMetadatum && this.itemMetadatum.metadatum) 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 &&
this.itemMetadatum.metadatum.metadata_type_options.display_related_item_metadata.length && this.itemMetadatum.metadatum.metadata_type_options.display_related_item_metadata.length &&
this.itemMetadatum.metadatum.metadata_type_options.display_related_item_metadata.length > 1; this.itemMetadatum.metadatum.metadata_type_options.display_related_item_metadata.length > 1;
},
isMobileMode() {
return this.$route && this.$route.query && this.$route.query.mobilemode;
} }
}, },
watch: { watch: {

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

@ -1,7 +1,9 @@
<template> <template>
<div class="columns is-fullheight"> <div
class="columns is-fullheight"
:class="{ 'tainacan-admin-collection-mobile-mode': isMobileMode }">
<section class="column is-secondary-content"> <section class="column is-secondary-content">
<tainacan-collection-subheader /> <tainacan-collection-subheader v-if="!isIframeMode && !isMobileMode" />
<router-view <router-view
id="collection-page-container" id="collection-page-container"
@ -25,6 +27,14 @@ export default {
collectionId: Number 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: { watch: {
'$route' (to, from) { '$route' (to, from) {
if (!this.isRepositoryLevel && from.path != undefined && to.path != from.path && this.collectionId != this.$route.params.collectionId) { if (!this.isRepositoryLevel && from.path != undefined && to.path != from.path && this.collectionId != this.$route.params.collectionId) {
@ -51,8 +61,4 @@ export default {
} }
</script> </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 // IFRAME MODE
// Used on gutenberg blocks, hiding content not relevant to be rendered inside iframe // Used on gutenberg block modals, hiding content not relevant to be rendered inside iframe
#tainacan-admin-app.tainacan-admin-iframe-mode { #tainacan-admin-app.tainacan-admin-iframe-mode {
#primary-menu, #primary-menu,
#menu-compress-button, #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 { #tainacan-admin-app.tainacan-admin-read-mode {
#items-list-area { #items-list-area {
@ -57,4 +60,37 @@
.metadata-title { margin-left: 6px; } .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/_notices.scss";
@import "../scss/_filters-menu-modal.scss"; @import "../scss/_filters-menu-modal.scss";
@import "../scss/_repository-level-overrides.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"; @import "../scss/_custom_variables.scss";
// Clears wordpress content // Clears wordpress content