scinote-web/app/javascript/packs/vue/navigation/navigator.js

60 lines
1.9 KiB
JavaScript
Raw Normal View History

import Vue from 'vue/dist/vue.esm';
import NavigatorContainer from '../../../vue/navigation/navigator.vue';
import PerfectScrollbar from 'vue2-perfect-scrollbar';
import 'vue2-perfect-scrollbar/dist/vue2-perfect-scrollbar.css';
Vue.use(PerfectScrollbar);
Vue.prototype.i18n = window.I18n;
window.addEventListener('DOMContentLoaded', () => {
let navigator = new Vue({
el: '#sciNavigationNavigatorContainer',
components: {
'navigator-container': NavigatorContainer
},
data() {
return {
navigatorCollapsed: false,
2023-04-26 16:24:50 +08:00
reloadCurrentLevel: false,
reloadChildrenLevel: false
}
},
created() {
this.navigatorCollapsed = $('.sci--layout').attr('data-navigator-collapsed');
2023-04-26 16:24:50 +08:00
$(document).on('inlineEditing:fieldUpdated', '.title-row .inline-editing-container', () => {
this.reloadCurrentLevel = true;
})
},
watch: {
2023-04-26 16:24:50 +08:00
reloadCurrentLevel: function () {
if (this.reloadCurrentLevel) {
this.$nextTick(() => {
this.reloadCurrentLevel = false;
});
}
},
reloadChildrenLevel: function () {
if (this.reloadChildrenLevel) {
this.$nextTick(() => {
this.reloadChildrenLevel = false;
});
}
},
navigatorCollapsed: function () {
let stateUrl = $('#sciNavigationNavigatorContainer').attr('data-navigator-state-url');
$('.sci--layout').attr('data-navigator-collapsed', this.navigatorCollapsed);
$('body').toggleClass('navigator-collapsed', this.navigatorCollapsed);
$.post(stateUrl, {state: this.navigatorCollapsed ? 'collapsed' : 'open'});
// refresh action toolbar width on navigator toggle, take into account transition time of .4s
if (window.actionToolbarComponent) setTimeout(window.actionToolbarComponent.setWidth, 401);
}
}
});
window.navigatorContainer = navigator
});