diff --git a/bundles/org.openhab.ui/web/src/pages/page/page-view.vue b/bundles/org.openhab.ui/web/src/pages/page/page-view.vue index d728e2acf7..c9673f9ac5 100644 --- a/bundles/org.openhab.ui/web/src/pages/page/page-view.vue +++ b/bundles/org.openhab.ui/web/src/pages/page/page-view.vue @@ -6,7 +6,7 @@ {{ (page) ? page.config.label : '' }} - + {{ $theme.md ? '' : $t('page.navbar.edit') }} @@ -95,22 +95,7 @@ export default { return this.$store.getters.page(this.uid) }, pageType () { - if (!this.page) return null - switch (this.page.component) { - case 'oh-layout-page': - return 'layout' - case 'oh-map-page': - return 'map' - case 'oh-tabs-page': - return 'tabs' - case 'oh-plan-page': - return 'plan' - case 'oh-chart-page': - return 'chart' - default: - console.warn('Unknown page type!') - return 'unknown' - } + return this.getPageType(this.page) }, isAdmin () { return this.page && this.$store.getters.isAdmin @@ -149,6 +134,24 @@ export default { onCommand (itemName, command) { this.$store.dispatch('sendCommand', { itemName, command }) }, + getPageType (page) { + if (!page) return null + switch (page.component) { + case 'oh-layout-page': + return 'layout' + case 'oh-map-page': + return 'map' + case 'oh-tabs-page': + return 'tabs' + case 'oh-plan-page': + return 'plan' + case 'oh-chart-page': + return 'chart' + default: + console.warn('Unknown page type!') + return 'unknown' + } + }, tabContext (tab) { const page = tab.config.page ? this.$store.getters.page(tab.config.page.replace('page:', '')) : tab.component const context = { @@ -180,6 +183,33 @@ export default { const ctx = this.tabContext(tab) return this.evaluateExpression('tab-' + idx + '-' + key, tab.config[key], ctx, ctx.props) }, + editPage () { + if (this.pageType === 'tabs') { + const action = this.$f7.actions.create({ + buttons: [ + { + text: 'Edit Tabbed Page', + onClick: () => { + this.$f7router.navigate('/settings/pages/' + this.pageType + '/' + this.uid) + } + }, + { + text: 'Edit Current Tab', + onClick: () => { + const tabPageUid = this.page.slots.default[this.currentTab].config.page.replace('page:', '') + const tabPage = this.$store.getters.page(tabPageUid) + const tabPageType = this.getPageType(tabPage) + this.$f7router.navigate('/settings/pages/' + tabPageType + '/' + tabPageUid) + } + } + ], + targetEl: this.$el.querySelector('.edit-page-button') + }) + action.open() + } else { + this.$f7router.navigate('/settings/pages/' + this.pageType + '/' + this.uid) + } + }, toggleFullscreen () { this.$fullscreen.toggle(document.body, { wrap: false,