fix: add currency component to show translated currency symbol (#417)

src/admin/components/Currency.vue

@@ -0,0 +1,15 @@
+<template>
+    <div v-html="formattedPrice( amount )"></div>
+</template>
+
+<script>
+export default {
+    props : ['amount'],
+
+    methods: {
+        formattedPrice(value) {
+            return accounting.formatMoney( value, dokan.currency );
+        }
+    }
+};
+</script>

src/admin/pages/Dashboard.vue

@@ -10,7 +10,9 @@
                             <li class="sale">
                                 <div class="dashicons dashicons-chart-bar"></div>
                                 <a href="#">
-                                    <strong>{{ overview.orders.this_month | currency }}</strong>
+                                    <strong>
+                                        <currency :amount="overview.orders.this_month"></currency>
+                                    </strong>
                                     <div class="details">
                                         {{ __( 'net sales this month', 'dokan-lite' ) }} <span :class="overview.orders.class">{{ overview.orders.parcent }}</span>
                                     </div>
@@ -19,7 +21,9 @@
                             <li class="commission">
                                 <div class="dashicons dashicons-chart-pie"></div>
                                 <a href="#">
-                                    <strong>{{ overview.earning.this_month | currency }}</strong>
+                                    <strong>
+                                        <currency :amount="overview.earning.this_month"></currency>
+                                    </strong>
                                     <div class="details">
                                         {{ __( 'commission earned', 'dokan-lite' ) }} <span :class="overview.earning.class">{{ overview.earning.parcent }}</span>
                                     </div>
@@ -109,8 +113,9 @@
 </template>
 
 <script>
-let Postbox = dokan_get_lib('Postbox');
-let Loading = dokan_get_lib('Loading');
+let Postbox  = dokan_get_lib('Postbox');
+let Loading  = dokan_get_lib('Loading');
+let Currency = dokan_get_lib('Currency');
 
 import Chart from "admin/components/Chart.vue"
 
@@ -121,7 +126,8 @@ export default {
     components: {
         Postbox,
         Loading,
-        Chart
+        Chart,
+        Currency
     },
 
     data () {

src/admin/pages/Withdraw.vue

@@ -45,7 +45,7 @@
             </template>
 
             <template slot="amount" slot-scope="data">
-                {{ data.row.amount | currency }}
+                <currency :amount="data.row.amount"></currency>
             </template>
 
             <template slot="status" slot-scope="data">
@@ -85,7 +85,8 @@
 
 <script>
 let ListTable = dokan_get_lib('ListTable');
-let Modal = dokan_get_lib('Modal');
+let Modal     = dokan_get_lib('Modal');
+let Currency  = dokan_get_lib('Currency');
 
 export default {
 
@@ -94,6 +95,7 @@ export default {
     components: {
         ListTable,
         Modal,
+        Currency
     },
 
     data () {

src/utils/Bootstrap.js

@@ -29,6 +29,7 @@ import Chart from "admin/components/Chart.vue"
 import Modal from "admin/components/Modal.vue"
 import Switches from "admin/components/Switches.vue"
 import TextEditor from "admin/components/TextEditor.vue"
+import Currency from "admin/components/Currency.vue"
 
 import "vue-multiselect/dist/vue-multiselect.min.css"
 
@@ -37,10 +38,6 @@ Vue.component('multiselect', Multiselect)
 
 Vue.mixin( Mixin );
 
-Vue.filter('currency', function (value) {
-    return accounting.formatMoney(value, dokan.currency);
-})
-
 Vue.filter('capitalize', function (value) {
     if (!value) return ''
     value = value.toString()
@@ -72,6 +69,7 @@ window.dokan.libs['Router']    = Router;
 window.dokan.libs['moment']    = Moment;
 
 window.dokan.libs['ListTable']  = ListTable;
+window.dokan.libs['Currency']   = Currency;
 window.dokan.libs['Postbox']    = Postbox;
 window.dokan.libs['Loading']    = Loading;
 window.dokan.libs['ChartJS']    = ChartJS;