glib-web 3.4.6 → 3.4.8

package/components/_badge.vue

@@ -1,5 +1,5 @@
 <template>
-  <v-badge :color="badge.backgroundColor || 'red'" overlap :model-value="badgeExists()" :style="styles()">
+  <v-badge :color="badge.backgroundColor || 'red'" :offset-x="badge.offsetX" :offset-y="badge.offsetY" :model-value="badgeExists()" :style="styles()">
     <template v-slot:badge>{{ badge.text }}</template>
     <slot />
   </v-badge>
@@ -12,7 +12,7 @@ export default {
   },
   data() {
     return {
-      badge: {}
+      badge: {},
     };
   },
   methods: {

package/components/_dropdownMenu.vue

@@ -34,7 +34,7 @@ export default {
       return determineSize(this.spec.styleClasses)
     },
     variant() {
-      return determineVariant(this.spec.styleClasses, 'elevated')
+      return determineVariant(this.spec.styleClasses, 'text')
     }
   },
   methods: {

package/components/charts/area.vue

@@ -5,10 +5,11 @@
 </template>
 
 <script setup>
+import 'chartkick/chart.js';
 import { computed } from 'vue';
 import { singleDataSeries } from './series';
 
-const { spec } = defineProps({ spec: Object })
-const color = spec.colors == null ? '' : [spec.colors]
-const series = computed(() => singleDataSeries(spec.dataSeries))
+const { spec } = defineProps({ spec: Object });
+const color = spec.colors == null ? '' : [spec.colors];
+const series = computed(() => singleDataSeries(spec.dataSeries));
 </script>

package/components/charts/column.vue

@@ -3,12 +3,12 @@
 </template>
 
 <script setup>
-
+import 'chartkick/chart.js';
 import { computed } from 'vue';
 import { multipleDataSeries } from './series';
 
-const { spec } = defineProps({ spec: Object })
-const color = spec.colors == null ? '' : spec.colors
+const { spec } = defineProps({ spec: Object });
+const color = spec.colors == null ? '' : spec.colors;
 const series = computed(() => multipleDataSeries(spec.dataGroups))
 
 </script>

package/components/charts/line.vue

@@ -3,11 +3,12 @@
 </template>
 
 <script setup>
+import 'chartkick/chart.js';
 import { computed } from 'vue';
 import { multipleDataSeries } from './series';
 
-const { spec } = defineProps({ spec: Object })
-const color = spec.colors == null ? '' : spec.colors
+const { spec } = defineProps({ spec: Object });
+const color = spec.colors == null ? '' : spec.colors;
 
-const series = computed(() => multipleDataSeries(spec.dataSeries))
+const series = computed(() => multipleDataSeries(spec.dataSeries));
 </script>

package/components/charts/pie.vue

@@ -3,11 +3,12 @@
 </template>
 
 <script setup>
+import 'chartkick/chart.js';
 import { computed } from 'vue';
 import { singleDataSeries } from './series';
 
-const { spec } = defineProps({ spec: Object })
-const color = spec.colors == null ? '' : spec.colors
+const { spec } = defineProps({ spec: Object });
+const color = spec.colors == null ? '' : spec.colors;
 const series = computed(() => singleDataSeries(spec.dataSeries))
 
 </script>

package/components/component.vue

@@ -63,7 +63,7 @@ import HiddenField from "./fields/hidden.vue";
 import TextField from "./fields/text.vue";
 import SubmitField from "./fields/submit.vue";
 import TextAreaField from "./fields/textarea.vue";
-import RichTextField from "./fields/richText.vue";
+const RichTextField = defineAsyncComponent(() => import("./fields/richText.vue"));
 // import NewRichTextField from "./fields/newRichText.vue";
 import FileField from "./fields/file.vue";
 import AutocompleteField from "./fields/autocomplete.vue";
@@ -110,15 +110,16 @@ import MultimediaVideo from "./multimedia/video.vue";
 import AlertBanner from "./banners/alert.vue";
 import SelectBanner from "./banners/select.vue";
 
-import LineChart from "./charts/line.vue";
-import ColumnChart from "./charts/column.vue";
-import PieChart from "./charts/pie.vue";
-import AreaChart from "./charts/area.vue";
+const LineChart = defineAsyncComponent(() => import("./charts/line.vue"));
+const ColumnChart = defineAsyncComponent(() => import("./charts/column.vue"));
+const PieChart = defineAsyncComponent(() => import("./charts/pie.vue"));
+const AreaChart = defineAsyncComponent(() => import("./charts/area.vue"));
 
 import ShareButton from "./shareButton.vue";
 import Action from "../action";
 
 import { getCurrentInstance } from 'vue';
+import { defineAsyncComponent } from "vue";
 
 export default {
   components: {

package/components/fields/richText.vue

@@ -26,8 +26,10 @@
 </template>
 
 <script>
+import '@vueup/vue-quill/dist/vue-quill.snow.css';
+
 import Uploader from "../../utils/uploader";
-import { QuillEditor, Quill } from '@vueup/vue-quill'
+import { QuillEditor, Quill } from '@vueup/vue-quill';
 
 import TurndownService from "turndown";
 import { gfm } from "turndown-plugin-gfm";
@@ -264,7 +266,7 @@ export default {
       );
     },
     onRichTextEditorChanged: eventFiltering.debounce(function () {
-      this.richEditorValue = this.$refs.quilEditor.getHTML()
+      this.richEditorValue = this.$refs.quilEditor.getHTML();
       this.producedValue = this.textEditor.producedValue(
         this.richEditorValue,
         "html",

package/index.js

@@ -4,8 +4,6 @@ import App from "./app.vue";
 import { settings } from "./utils/settings";
 import { useTheme } from "vuetify";
 
-import '@vueup/vue-quill/dist/vue-quill.snow.css';
-
 // lib for deep merge
 import merge from 'lodash.merge';
 
@@ -41,14 +39,7 @@ Vue.component('gmap-marker', Marker);
 Vue.component('gmap-autocomplete', Autocomplete);
 
 
-
-import "./styles/test.scss";
-import "./styles/test.sass";
-
-
 import VueChartkick from 'vue-chartkick';
-import 'chartkick/chart.js';
-
 Vue.use(VueChartkick);
 
 // import VueAnalytics from 'vue-analytics'

package/nav/appbar.vue

@@ -77,7 +77,7 @@ export default {
     },
     mobileMenu() {
       return {
-        icon: { material: { name: "mdi-dots-vertical" } },
+        icon: { material: { name: "more_vert" } },
         childButtons: this.rightButtons
       };
     }

package/nav/drawerButton.vue

@@ -1,7 +1,7 @@
 <template>
   <!-- <v-list-item class="popover-menu-item"> -->
 
-  <v-list-item class="drawer-button">
+  <!-- <v-list-item class="drawer-button"> -->
 
   <!-- <v-list-item :href="$href(spec)" @click="performAction($event)" class="popover-menu-item"> -->
   <!-- <v-list-item :href="$href(spec)" @click="performAction($event)"> -->
@@ -14,8 +14,13 @@
         {{ spec.text }}
       </common-badge>
     </v-list-item-title> -->
-    <common-button :spec="buttonSpec(spec)" />
-  </v-list-item>
+    <!-- <common-button :spec="buttonSpec(spec)" />
+  </v-list-item> -->
+
+  <div ref="buttonContainer" class="drawer-button">
+    <common-button :spec="buttonSpec" v-if="buttonSpec" />
+  </div>
+
 </template>
 
 <script>
@@ -23,27 +28,64 @@ export default {
   props: {
     spec: { type: Object, required: true }
   },
+  data: function () {
+    return {
+      buttonSpec: null,
+    };
+  },
   methods: {
+    $ready() {
+      this.buttonSpec = Object.assign({}, this.spec, {
+        view: "button-v1",
+        width: "matchParent",
+        styleClasses: ["text"]
+      });
+
+      // Delay so we get the correct width and height.
+      this.$nextTick(() => {
+        this.$type.ifObject(this.buttonSpec.badge, badge => {
+          const container = this.$refs.buttonContainer
+          badge.offsetX = 18
+          badge.offsetY = (container.offsetHeight / 2) - 3
+        })
+      })
+    },
     performAction(event) {
       // this.$el.dispatchEvent(new Event("drawers/clickButton", { bubbles: true }))
       this.$dispatchEvent("drawers/clickButton", {});
       this.$onClick(event);
     },
-    buttonSpec(item) {
-      return Object.assign({}, item, {
-        view: "button-v1",
-        // width: "matchParent",
-        styleClasses: ["text"]
-      });
-    }
+    // buttonSpec() {
+    //   return Object.assign({}, this.spec, {
+    //     view: "button-v1",
+    //     width: "matchParent",
+    //     styleClasses: ["text"]
+    //     // styleClasses: ["text", "drawer-button"]
+    //   });
+    // }
   }
 };
 </script>
 
 <style lang="scss" scoped>
+// .drawer-button {
+//   justify-content: flex-start;
+// }
 </style>
 
 <style lang="scss">
+.drawer-button {
+  .v-badge {
+    .v-badge__wrapper {
+      width: 100%;
+    }
+  }
+
+  .v-btn {
+    justify-content: flex-start;
+  }
+}
+
 // .drawer-button {
 //   .v-list-item__content {
 //     text-align: left;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "glib-web",
-  "version": "3.4.6",
+  "version": "3.4.8",
   "description": "",
   "main": "index.js",
   "scripts": {

package/utils/mime_type.js

@@ -12,7 +12,7 @@ export default {
   css: "text/css",
   csv: "text/csv",
   doc: "application/msword",
-  docx: "application/msword",
+  docx: "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
   dll: "application/octet-stream",
   eot: "application/vnd.ms-fontobject",
   epub: "application/epub+zip",
@@ -44,7 +44,7 @@ export default {
   otf: "font/otf",
   png: "image/png",
   ppt: "application/vnd.ms-powerpoint",
-  pptx: "application/vnd.ms-powerpoint",
+  pptx: "application/vnd.openxmlformats-officedocument.presentationml.presentation",
   rar: "application/x-rar-compressed",
   rtf: "application/rtf",
   sh: "application/x-sh",
@@ -65,7 +65,7 @@ export default {
   woff2: "font/woff2",
   xhtml: "application/xhtml+xml",
   xls: "application/vnd.ms-excel",
-  xlsx: "application/vnd.ms-excel",
+  xlsx: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
   xlsx_OLD: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
   xml: "application/xml",
   xul: "application/vnd.mozilla.xul+xml",