fix for dropdown menu

.eslintrc

@@ -28,6 +28,6 @@
         ],
         "object-shorthand": "warn",
         "vue/html-self-closing": "warn",
-        "no-console": "warn"
+        "no-debugger": "error"
     }
 }

src/App.vue

@@ -48,10 +48,9 @@ export default {
     },
     methods: {
         changeHeaderHandler(e) {
-            Object.assign(this.options, e.detail);
+            this.options = e.detail;
         },
         changeDateHandler(e) {
-            console.log('change-date', e);
             this.date = e.detail.date;
         },
         syncDateHandler() {

src/components/BaseLayout.vue

@@ -13,16 +13,21 @@
         <DesktopMenu class="only-desktop" />
         <div class="actions">
             <slot name="actions" />
+            <DropdownMenu
+                v-if="menu.length > 0"
+                :menu="menu"
+            />
         </div>
     </div>
 </template>
 
 <script>
 import ButtonIcon from './ButtonIcon.vue';
 import DesktopMenu from './DesktopMenu.vue';
+import DropdownMenu from './DropdownMenu.vue';
 
 export default {
-    components: { ButtonIcon, DesktopMenu },
+    components: { ButtonIcon, DesktopMenu, DropdownMenu },
     props: {
         title: {
             type: String,
@@ -32,6 +37,10 @@ export default {
             type: Boolean,
             default: false,
         },
+        menu: {
+            type: Array,
+            default: () => [],
+        },
     },
     methods: {
         back() {

src/components/ToolbarBack.vue

@@ -2,39 +2,17 @@
     <BaseLayout
         :title="options.text"
         :backable="true"
-    >
-        <template #actions>
-            <DropdownMenu
-                v-if="options.menu && options.menu.length > 0"
-                :menu="options.menu"
-            />
-        </template>
-    </BaseLayout>
+        :menu="options.menu"
+    />
 </template>
 
 <script>
-import DropdownMenu from './DropdownMenu';
-import { windowWidthMixin } from '../mixins';
 import BaseLayout from './BaseLayout.vue';
 
 export default {
-    components: { DropdownMenu, BaseLayout },
-    mixins: [windowWidthMixin],
+    components: { BaseLayout },
     props: {
-        options: { type: Object, default: () => ({ text: 'Твой физфак!' }) },
-    },
-    methods: {
-        getButtons() {
-            return JSON.parse(localStorage.getItem('navbar-buttons'));
-        },
+        options: { type: Object, required: true },
     },
 };
 </script>
-
-<style scoped>
-span,
-div {
-    color: #ffffff;
-    margin-right: 16px;
-}
-</style>

src/components/ToolbarCalendar.vue

@@ -11,7 +11,7 @@
                 is-required
             />
         </div>
-        <BaseLayout>
+        <BaseLayout :menu="options.menu">
             <template #meta>
                 <button
                     class="toggle-button"
@@ -39,10 +39,6 @@
                     :disabled="options.disabled"
                     @click="updateDate(new Date())"
                 />
-                <DropdownMenu
-                    :menu="options.menu"
-                    :disabled="options.disabled"
-                />
             </template>
         </BaseLayout>
     </div>
@@ -52,7 +48,6 @@
 import 'v-calendar/dist/style.css';
 import vClickOutside from 'click-outside-vue3';
 import { DatePicker } from 'v-calendar';
-import DropdownMenu from './DropdownMenu';
 import ButtonIcon from './ButtonIcon';
 import { windowWidthMixin } from '../mixins';
 import BaseLayout from './BaseLayout.vue';
@@ -61,7 +56,6 @@ export default {
     name: 'NavbarTop',
     components: {
         DatePicker,
-        DropdownMenu,
         ButtonIcon,
         BaseLayout,
     },
@@ -72,11 +66,7 @@ export default {
     props: {
         options: {
             type: Object,
-            default: () => ({
-                text: 'Твой физфак!',
-                menu: [],
-                disabled: true,
-            }),
+            required: true,
         },
         date: {
             type: Date,

src/components/ToolbarPlain.vue

@@ -1,30 +1,17 @@
 <template>
-    <BaseLayout :title="options.text">
-        <template #actions>
-            <DropdownMenu
-                v-if="options.menu && options.menu.length > 0"
-                :menu="options.menu"
-            />
-        </template>
-    </BaseLayout>
+    <BaseLayout
+        :title="options.text"
+        :menu="options.menu"
+    />
 </template>
 
 <script>
-import DropdownMenu from './DropdownMenu';
-import { windowWidthMixin } from '../mixins';
 import BaseLayout from './BaseLayout.vue';
 
 export default {
-    components: { DropdownMenu, BaseLayout },
-    mixins: [windowWidthMixin],
+    components: { BaseLayout },
     props: {
-        options: { type: Object, default: () => ({ text: 'Твой физфак!' }) },
+        options: { type: Object, required: true },
     },
 };
 </script>
-
-<style scoped>
-div {
-    color: #ffffff;
-}
-</style>