free-fe-core-modules 0.0.4 → 0.0.6

package/view/menu/index.vue

@@ -56,7 +56,7 @@
             :key="fIndex"
             :values="editingMenu"
             :Field="field"
-            :ref="`input_field_validator_${field.Name || field.Label}`"
+            ref="refsToValid"
           ></free-field>
 
           <div class="action-btns full-width row justify-center q-gutter-md">
@@ -86,12 +86,12 @@
 </template>
 
 <script>
-import { defineComponent } from 'vue';
+import { defineComponent, ref } from 'vue';
 import { useObjectData, objectDataProps } from '../../composible/useObjectData';
+import { useFormValidator } from '../../composible/useFormValidator';
 
 export default defineComponent({
   name: 'MenuPage',
-  // mixins: [mixins.InputFieldValidator],
   props: {
     ...objectDataProps,
     addMenu: { type: Function, default: () => { } },
@@ -99,24 +99,28 @@ export default defineComponent({
     deleteMenu: { type: Function, default: () => { } },
   },
   setup(props, ctx) {
+    const selectedMenuNode = ref({});
+    const editingMenu = ref({});
+    const menuFields = ref([]);
+
     const {
       data,
       refreshData,
     } = useObjectData(props, ctx);
 
+    const {
+      validate,
+    } = useFormValidator('refsToValid');
+
     return {
+      selectedMenuNode,
+      editingMenu,
+      menuFields,
       data, 
       refreshData,
+      validate,
     };
   },
-  data() {
-    return {
-      selectedMenuNode: {},
-      editingMenu: {},
-      menuFields: [],
-    };
-  },
-  watch: {},
   created() {
     this.menuFields = this.getModule('core-modules').config.menuFields;
 

package/view/mourning/mourning.vue

@@ -8,6 +8,9 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
   name: 'mourningNode',
+  setup() {
+    return {};
+  },
   mounted() {
     const mourningStore = useMourningStore();
 
@@ -18,8 +21,9 @@ export default defineComponent({
       }
       mourningStore.mourning = inMourning;
 
-      let classes = this.$root.$el.className.split(' ').filter((c) => !!c);
-
+      let bodyElem = document.getElementsByTagName('html')[0];
+      let classes = bodyElem.className.split(' ').filter((c) => !!c);
+    
       if (inMourning) {
         classes.push('mourning-site');
       } else {
@@ -27,19 +31,20 @@ export default defineComponent({
         classes = classes.filter((c) => c.trim() !== 'mourning-site');
       }
 
-      this.$root.$el.className = classes.join(' ');
+      bodyElem.className = classes.join(' ');
     });
   },
 });
 </script>
 
-<style lang="sass">
-.mourning-site
-  -webkit-filter: grayscale(100%)
-  -moz-filter: grayscale(100%)
-  -ms-filter: grayscale(100%)
-  -o-filter: grayscale(100%)
-  filter: grayscale(100%)
-  filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)
-  filter: gray
+<style lang="scss">
+.mourning-site {
+  -webkit-filter: grayscale(100%);
+  -moz-filter: grayscale(100%);
+  -ms-filter: grayscale(100%);
+  -o-filter: grayscale(100%);
+  filter: grayscale(100%);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
+  filter: gray;
+}
 </style>