Nova 3.10.0 support

saintsystems · Sep 28, 2020 · 5d8a765 · 5d8a765
1 parent 7402184
commit 5d8a765
Show file tree

Hide file tree

Showing 7 changed files with 87,240 additions and 1,151 deletions.
diff --git a/composer.json b/composer.json
@@ -1,5 +1,6 @@
 {
     "name": "saintsystems/nova-linkable-metrics",
+    "version":"0.1.0",
     "description": "Linkable metrics for Laravel Nova.",
     "keywords": [
         "laravel",
@@ -14,7 +15,7 @@
     "license": "MIT",
     "require": {
         "php": ">=7.1.0",
-        "laravel/nova": "^2.1.0"
+        "laravel/nova": "^3.10.0"
     },
     "repositories": [
         {

diff --git a/dist/js/card.js b/dist/js/card.js
diff --git a/package.json b/package.json
@@ -14,9 +14,8 @@
         "chartist-plugin-tooltips": "^0.0.17",
         "cross-env": "^5.0.0",
         "laravel-mix": "^1.0",
-        "laravel-nova": "^1.0.2",
-        "lodash": "^4.17.11",
-        "numbro": "^2.1.2"
+        "laravel-nova": "^1.4.1",
+        "lodash": "^4.17.0"
     },
     "dependencies": {
         "vue": "^2.5.0"

diff --git a/resources/js/components/Base/PartitionMetric.vue b/resources/js/components/Base/PartitionMetric.vue
@@ -16,6 +16,25 @@
                 >
             </template>
         </h3>
+
+        <div v-if="helpText" class="absolute pin-r pin-b p-2">
+            <tooltip trigger="hover">
+                <icon
+                type="help"
+                viewBox="0 0 17 17"
+                height="16"
+                width="16"
+                class="cursor-pointer text-60 -mb-1"
+                />
+
+                <tooltip-content
+                slot="content"
+                v-html="helpText"
+                :max-width="helpWidth"
+                />
+            </tooltip>
+        </div>
+
         <div class="overflow-hidden overflow-y-auto max-h-90px">
             <ul class="list-reset">
                 <li v-for="item in formattedItems" class="text-xs text-80 leading-normal">
@@ -61,6 +80,8 @@ export default {
     props: {
         loading: Boolean,
         title: String,
+        helpText: {},
+        helpWidth: {},
         chartData: Array,
         url: '',
     },

diff --git a/resources/js/components/Base/TrendMetric.vue b/resources/js/components/Base/TrendMetric.vue
@@ -3,6 +3,24 @@
         <div class="flex mb-4">
             <h3 class="mr-3 text-base text-80 font-bold">{{ title }}</h3>
 
+            <div v-if="helpText" class="absolute pin-r pin-b p-2 z-25">
+                <tooltip trigger="click">
+                <icon
+                    type="help"
+                    viewBox="0 0 17 17"
+                    height="16"
+                    width="16"
+                    class="cursor-pointer text-60 -mb-1"
+                />
+
+                <tooltip-content
+                    slot="content"
+                    v-html="helpText"
+                    :max-width="helpWidth"
+                />
+                </tooltip>
+            </div>
+
             <select
                 v-if="ranges.length > 0"
                 @change="handleChange"
@@ -37,33 +55,25 @@
 </template>
 
 <script>
-import numbro from 'numbro'
-import numbroLanguages from 'numbro/dist/languages.min'
-Object.values(numbroLanguages).forEach(l => numbro.registerLanguage(l))
 import _ from 'lodash'
 import Chartist from 'chartist'
 import 'chartist-plugin-tooltips'
 import 'chartist/dist/chartist.min.css'
 import { SingularOrPlural } from 'laravel-nova'
 import 'chartist-plugin-tooltips/dist/chartist-plugin-tooltip.css'
 
-// const getLabelForValue = (value, vm) => {
-//     const { labels, series } = vm.chartData
-
-//     return labels[_.findIndex(series[0], (item) => {
-//         return item.value == value;
-//     })]
-// }
-
 export default {
     name: 'BaseTrendMetric',
 
     props: {
         loading: Boolean,
         title: {},
+        helpText: {},
+        helpWidth: {},
         value: {},
         url: '',
         chartData: {},
+        maxWidth: {},
         prefix: '',
         suffix: '',
         suffixInflection: true,
@@ -88,10 +98,6 @@ export default {
     },
 
     mounted() {
-        if (Nova.config.locale) {
-            numbro.setLanguage(Nova.config.locale.replace('_', '-'))
-        }
-
         const low = Math.min(...this.chartData)
         const high = Math.max(...this.chartData)
 
@@ -126,23 +132,28 @@ export default {
             },
             plugins: [
                 Chartist.plugins.tooltip({
-                    anchorToPoint: true,
-                    transformTooltipTextFnc: value => {
-                        if (this.prefix) {
-                            return `${this.prefix}${value}`
-                        }
-
-                        if (this.suffix) {
-                            const suffix = SingularOrPlural(value, this.suffix)
-
-                            return `${value} ${suffix}`
-                        }
-
-                        return `${value}`
-                    },
-                }),
-            ],
-        })
+                anchorToPoint: true,
+                transformTooltipTextFnc: value => {
+                let formattedValue = Nova.formatNumber(
+                    new String(value),
+                    this.format
+                )
+
+                if (this.prefix) {
+                    return `${this.prefix}${formattedValue}`
+                }
+
+                if (this.suffix) {
+                    const suffix = SingularOrPlural(value, this.suffix)
+
+                    return `${formattedValue} ${suffix}`
+                }
+
+                return `${formattedValue}`
+            },
+        }),
+      ],
+    })
     },
 
     methods: {
@@ -167,7 +178,7 @@ export default {
 
         formattedValue() {
             if (!this.isNullValue) {
-                const value = numbro(new String(this.value)).format(this.format)
+                const value = Nova.formatNumber(new String(this.value), this.format)
 
                 return `${this.prefix}${value}`
             }

diff --git a/resources/js/components/Base/ValueMetric.vue b/resources/js/components/Base/ValueMetric.vue
@@ -1,8 +1,26 @@
 <template>
-    <loading-card :loading="loading" class="metric px-6 py-4 relative">
+    <loading-card :loading="loading" class="px-6 py-4">
         <div class="flex mb-4">
             <h3 class="mr-3 text-base text-80 font-bold">{{ title }}</h3>
 
+            <div v-if="helpText" class="absolute pin-r pin-b p-2 z-25">
+                <tooltip trigger="click">
+                <icon
+                    type="help"
+                    viewBox="0 0 17 17"
+                    height="16"
+                    width="16"
+                    class="cursor-pointer text-60 -mb-1"
+                />
+
+                <tooltip-content
+                    slot="content"
+                    v-html="helpText"
+                    :max-width="helpWidth"
+                />
+                </tooltip>
+            </div>
+
             <select
                 v-if="ranges.length > 0"
                 @change="handleChange"
@@ -64,30 +82,34 @@
                 </span>
 
                 <span v-else>
-                    <span v-if="previous == '0' && value != '0'"> {{ __('No Prior Data') }} </span>
+                    <span v-if="previous == '0' && value != '0'">
+                        {{ __('No Prior Data') }}
+                    </span>
 
                     <span v-if="value == '0' && previous != '0'">
                         {{ __('No Current Data') }}
                     </span>
 
-                    <span v-if="value == '0' && previous == '0'"> {{ __('No Data') }} </span>
+                    <span v-if="value == '0' && previous == '0'">
+                        {{ __('No Data') }}
+                    </span>
                 </span>
             </p>
         </div>
     </loading-card>
 </template>
 
 <script>
-import numbro from 'numbro'
-import numbroLanguages from 'numbro/dist/languages.min'
-Object.values(numbroLanguages).forEach(l => numbro.registerLanguage(l))
 import { SingularOrPlural } from 'laravel-nova'
 
 export default {
     name: 'BaseValueMetric',
     props: {
         loading: { default: true },
         title: {},
+        helpText: {},
+        helpWidth: {},
+        maxWidth: {},
         previous: {},
         value: {},
         url: '',
@@ -102,12 +124,9 @@ export default {
             type: String,
             default: '(0[.]00a)',
         },
-    },
-
-    mounted() {
-        if (Nova.config.locale) {
-            numbro.setLanguage(Nova.config.locale.replace('_', '-'))
-        }
+        zeroResult: {
+            default: false,
+        },
     },
 
     methods: {
@@ -160,7 +179,9 @@ export default {
 
         formattedValue() {
             if (!this.isNullValue) {
-                return this.prefix + numbro(new String(this.value)).format(this.format)
+                return (
+                this.prefix + Nova.formatNumber(new String(this.value), this.format)
+                )
             }
 
             return ''