fix: chart

resources/js/Global/components/Inputs/PersianDate.vue

@@ -30,10 +30,10 @@
     </div>
 </template>
 <script>
-import VuePersianDatetimePicker from 'vue-persian-datetime-picker'
+    import VuePersianDatetimePicker from 'vue-persian-datetime-picker'
-import moment from 'jalali-moment';
+    import {convertToJalali, convertNowToJalali} from '@Global/utils/date/jalali-date'
 
-export default {
+    export default {
         components: {
             datePicker: VuePersianDatetimePicker
         },
@@ -75,15 +75,14 @@ export default {
             dateShow: {
                 get() {
                     if (this.value) {
-                    return moment(new Date(this.value)).format(this.defaultDisplayFormat);
+                        return convertToJalali(this.value, this.defaultDisplayFormat);
                     } else if (!this.disabled) {
                         if (this.defaultDate === 'now') {
-                        this.$emit('input', moment(new Date()).format(this.defaultFormat));
+                            this.$emit('input', convertNowToJalali(null, this.defaultFormat));
-                        return moment(new Date()).format(this.defaultDisplayFormat);
+                            return convertNowToJalali(null, this.defaultDisplayFormat);
                         } else {
                             return '';
                         }
-
                     }
                 },
                 set(value) {
@@ -100,7 +99,8 @@ export default {
                     }
                 }
                 return this.displayFormat
-        },
+            }
+            ,
             defaultInputFormat() {
                 if (!this.inputFormat) {
                     if (this.type === 'datetime') {
@@ -112,7 +112,8 @@ export default {
                     }
                 }
                 return this.inputFormat
-        },
+            }
+            ,
             defaultFormat() {
                 if (!this.format) {
                     if (this.type === 'datetime') {
@@ -124,29 +125,34 @@ export default {
                     }
                 }
                 return this.format
-        },
+            }
+            ,
             minimum() {
                 if (this.min === 'now') {
-                return moment(new Date()).format(this.defaultInputFormat);
+                    return convertNowToJalali(null, this.defaultInputFormat);
                 } else {
                     return this.min;
                 }
-        },
+            }
+            ,
             maximum() {
                 if (this.max === 'now') {
-                return moment(new Date()).format(this.defaultInputFormat);
+                    return convertNowToJalali(null, this.defaultInputFormat);
                 } else {
                     return this.max;
                 }
-        },
+            }
-    },
+            ,
+        }
+        ,
         methods: {
             changeDatePicker(event) {
                 if (!this.disabled) {
-                this.$emit('input', event.format(this.defaultFormat))
+                    this.$emit('input', event.format(this.defaultFormat));
                 }
             }
-    },
+        }
+        ,
         watch: {
             disabled(value) {
                 if (value) {
@@ -154,5 +160,5 @@ export default {
                 }
             }
         }
-}
+    }
 </script>

resources/js/Global/plugins/chart/apexhart/type/bar.js

@@ -1,11 +1,11 @@
 import chart from "../chart";
-
+import {seperator, price} from '@Global/utils/common/format'
 export default class extends chart {
 
     constructor(options) {
         super(options);
         this.type = options.type ? options.type : 'daily';
-
+        this.formatCount = 'number';
         this.options = {
             fill: {
                 colors: ["#e6e6e6"]
@@ -15,16 +15,35 @@ export default class extends chart {
                     fontFamily: '"iranyekan-regular-en-num", "Montserrat-Regular"'
             },
             xaxis: {
-                categories: []
+                categories: [],
+            },
+            yaxis: {
+                labels: {
+                    formatter: (val) => {
+                        if (this.formatCount === 'number') {
+                            return seperator(val)
+                        } else if(this.formatCount === 'price') {
+                            return price(val)
+                        }
+                    }
+                },
             },
             dataLabels: {
                 style: {
                     colors: ["#000", "#000", "#000"]
+                },
+                enabled: true,
+                formatter: (val, opt) => {
+                    if (this.formatCount === 'number') {
+                        return seperator(val)
+                    } else if(this.formatCount === 'price') {
+                        return price(val)
                     }
                 },
+            },
             series: [
                 {
-                    name: "bar chart",
+                    name: this.formatCount === 'number' ? "تعداد" : "قیمت",
                     data: []
                 }
             ]
@@ -41,13 +60,22 @@ export default class extends chart {
     setOptions() {
         switch (this.type) {
             case 'weekly':
+                this.formatCount = 'number';
+                return this.setWeekly();
             case 'cost-weekly':
+                this.formatCount = 'price';
                 return this.setWeekly();
             case 'monthly':
+                this.formatCount = 'number';
+                return this.setMonthly();
             case 'cost-monthly':
+                this.formatCount = 'price';
                 return this.setMonthly();
             case 'daily':
+                this.formatCount = 'number';
+                return this.setDaily();
             case 'cost-daily':
+                this.formatCount = 'price';
                 return this.setDaily();
         }
     }

resources/js/Global/plugins/chart/apexhart/type/pie.js

@@ -41,7 +41,7 @@ export default class extends chart {
         this.options.fill.label = this.responseChart.map(x => x.category.name);
         this.options['colors'] =  this.responseChart.map( x =>{
             let colorText = x.category.color ?  x.category.color : color[parseInt((Math.random() * 100) % 14)].color;
-            return color.find(x => x.color == colorText).hex;
+            return color.find(x => x.color === colorText).hex;
         } );
     }
 }

resources/js/Global/utils/common/Object.js

@@ -40,3 +40,4 @@ Array.prototype.matchItems = function (array) {
 }
 // Hide method from for-in loops
 Object.defineProperty(Array.prototype, "matchItems", {enumerable: false});
+

resources/js/Global/utils/common/format.js

@@ -0,0 +1,6 @@
+export const price = (number, currency = 'تومان')  => {
+    return  Intl.NumberFormat().format(number) + ' ' + currency;
+}
+export const seperator = (number)  => {
+    return  new Intl.NumberFormat().format(number);
+}