refs #2590 Wizard currencies added default currency

app/View/Components/Layouts/Wizard/Scripts.php

@@ -103,6 +103,7 @@ class Scripts extends Component
                 'name' => trans('general.name'),
                 'code' => trans('currencies.code'),
                 'rate' => trans('currencies.rate'),
+                'default' => trans('currencies.default'),
                 'enabled' => trans('general.enabled'),
                 'actions' =>  trans('general.actions') ,
                 'yes' => trans('general.yes'),
@@ -162,7 +163,15 @@ class Scripts extends Component
 
     protected function getCurrencies()
     {
-        return Currency::all();
+        $currencies = collect();
+
+        Currency::all()->each(function ($currency) use (&$currencies) {
+            $currency->default = setting('default.currency') == $currency->code;
+
+            $currencies->push($currency);
+        });
+
+        return $currencies;
     }
 
     protected function getCurrencyCodes()

public/css/app.css

@@ -48204,6 +48204,10 @@ body{
     grid-column: span 7 / span 7;
   }
 
+  .sm\:col-span-12{
+    grid-column: span 12 / span 12;
+  }
+
   .sm\:row-span-2{
     grid-row: span 2 / span 2;
   }
@@ -48316,6 +48320,10 @@ body{
     grid-template-columns: repeat(8, minmax(0, 1fr));
   }
 
+  .sm\:grid-cols-12{
+    grid-template-columns: repeat(12, minmax(0, 1fr));
+  }
+
   .sm\:flex-row{
     -webkit-box-orient: horizontal;
     -webkit-box-direction: normal;

resources/assets/js/mixins/wizardAction.js

@@ -8,6 +8,7 @@ export default {
                 name: "",
                 rate: "",
                 select: "",
+                default_currency: 0,
                 enabled: 1
             },
             error_field: {},
@@ -15,6 +16,7 @@ export default {
             button_loading: false,
         }
     },
+
     methods: {
         onAddItem() {
             this.new_datas = true;
@@ -25,6 +27,8 @@ export default {
                 this.model.name = '';
                 this.model.rate = '';
                 this.model.select = '';
+                this.model.default = false;
+                this.model.default_currency = false;
             }
         },
 
@@ -36,6 +40,8 @@ export default {
             if (this.model) {
                 this.model.name = item.name ? item.name : '';
                 this.model.rate = item.rate ? item.rate : '';
+                this.model.default = item.default ? item.default : false;
+                this.model.default_currency = item.default ? item.default : false;
                 this.model.select = item.code ? item.code : '';
             }
         },
@@ -50,6 +56,8 @@ export default {
             this.model.name = '';
             this.model.rate = '';
             this.model.select = '';
+            this.model.default = false;
+            this.model.default_currency = false;
             this.model.enabled = 1;
         },
 
@@ -74,8 +82,8 @@ export default {
         },
 
         onDeleteItemMessage(event) {
-            let type = event.success ? 'success' : 'error';
+            let type = event.success ? 'success' : 'danger';
-            let timeout = 1000;
+            let timeout = 5000;
 
             if (event.important) {
                 timeout = 0;
@@ -84,7 +92,7 @@ export default {
             this.$notify({
                 message: event.message,
                 timeout: timeout,
-                icon: "",
+                icon: "error_outline",
                 type,
             });
 
@@ -108,6 +116,10 @@ export default {
                 });
             }
 
+            if (data.default_currency) {
+                data.rate = 1;
+            }
+
             window.axios({
                     method: form_method,
                     url: form_url,
@@ -135,6 +147,7 @@ export default {
                             });
                         }
                     }
+
                     this.onSuccessMessage(response);
                 }, this)
                 .catch(error => {
@@ -146,12 +159,14 @@ export default {
             form_list.forEach(function (item, index) {
                 if (item.id == event_id) {
                     form_list.splice(index, 1);
+
                     return;
                 }
             }, this);
 
             this.component = "";
             document.body.classList.remove("overflow-hidden");
+
             this.onDeleteItemMessage(event);
         },
 
@@ -159,6 +174,7 @@ export default {
             if (this.error_field[field_name]) {
                 return this.error_field[field_name][0];
             }
+
             this.button_loading = false;
         },
 

resources/assets/js/views/wizard/Company.vue

@@ -132,7 +132,9 @@ import WizardSteps from "./Steps.vue";
     export default {
         name: "Company",
 
-    mixins: [WizardAction],
+        mixins: [
+            WizardAction
+        ],
 
         components: {
             [Select.name]: Select,

resources/assets/js/views/wizard/Currencies.vue

@@ -9,7 +9,7 @@
 
             <div class="overflow-x-visible menu-scroll mt-1">
                 <form ref="form" class="py-2 align-middle inline-block min-w-full">
-                    <table id="tbl-currencies" class="min-w-full divide-y divide-gray-200">
+                    <table v-if="currencies.length" id="tbl-currencies" class="min-w-full divide-y divide-gray-200">
                         <thead>
                             <tr class="flex items-center px-1">
                                 <th class="w-4/12 ltr:pr-6 rtl:pl-6 py-3 ltr:text-left rtl:text-right text-sm font-bold text-black tracking-wider">
@@ -30,10 +30,29 @@
                             <tr v-for="(item, index) in currencies" :key="index" data-table-list class="relative flex items-center border-b hover:bg-gray-100 px-1 flex-wrap group">
                                 <td :class="current_tab == index ? 'hidden' : ''" class="w-4/12 ltr:pr-6 rtl:pl-6 py-4 ltr:text-left rtl:text-right whitespace-nowrap text-sm font-medium text-black">
                                     {{ item.name }}
+
+                                    <span v-if="item.default" class="cursor-pointer">
+                                        <span class="relative auto" data-tooltip-target="wizard-currency-default" data-tooltip-placement="right">
+                                            <span class="material-icons-round text-purple text-sm ml-2">lock</span>
+                                        </span>
+
+                                        <div id="wizard-currency-default" role="tooltip"
+                                            class="inline-block absolute z-20 py-1 px-2 text-sm font-medium rounded-lg bg-white text-gray-900 w-auto border border-gray-200 shadow-sm tooltip-content whitespace-normal opacity-0 invisible"
+                                        >
+                                            {{ translations.currencies.default }}
+                                            <div 
+                                                class="absolute w-2 h-2 before:absolute before:w-2 before:h-2 before:bg-white before:border-gray-200 before:transform before:rotate-45 before:border -left-1 before:border-t-0 before:border-r-0 border-gray-200"
+                                                data-popper-arrow
+                                            >
+                                            </div>
+                                        </div>
+                                    </span>
                                 </td>
+
                                 <td :class="current_tab == index ? 'hidden' : ''" class="w-4/12 ltr:pr-6 rtl:pl-6 py-4 text-center whitespace-nowrap text-sm font-medium text-black">
                                     {{ item.code }} 
                                 </td>
+
                                 <td :class="current_tab == index ? 'hidden' : ''" class="w-4/12 relative ltr:pr-6 rtl:pl-6 py-4 ltr:text-right rtl:text-left whitespace-nowrap text-sm font-medium text-black">
                                     {{ item.rate }}
 
@@ -59,14 +78,14 @@
                                 </td>
 
                                 <td class="w-full p-0 current-tab" v-if="current_tab == index">
-                                    <div class="grid sm:grid-cols-6 gap-x-8 gap-y-6 py-3">
+                                    <div class="grid sm:grid-cols-12 gap-x-8 gap-y-6 py-3">
-                                        <base-input name="name" data-name="name"
+                                        <base-input :label="translations.currencies.name" name="name" data-name="name"
-                                            form-classes="sm:col-span-2"
+                                            form-classes="sm:col-span-4"
                                             v-model="model.name"
                                             :error="onFailErrorGet('name')"
                                         />
 
-                                        <base-input class="sm:col-span-2" :error="onFailErrorGet('code')">
+                                        <base-input :label="translations.currencies.code" class="sm:col-span-3" :error="onFailErrorGet('code')">
                                             <el-select name="code" v-model="model.select" @change="onChangeCodeItem(model.select)" filterable>
                                                 <el-option
                                                 v-for="option in currency_codes"
@@ -78,13 +97,30 @@
                                             </el-select>
                                         </base-input>
 
-                                        <base-input name="rate" data-name="rate" :placeholder="translations.currencies.rate"
+                                        <base-input :label="translations.currencies.rate" name="rate" data-name="rate" :placeholder="translations.currencies.rate"
-                                            form-classes="sm:col-span-2"
+                                            form-classes="sm:col-span-3"
                                             v-model="model.rate"
                                             :error="onFailErrorGet('rate')"
+                                            :disabled="model.default_currency == 1"
                                         />
 
-                                        <div class="flex justify-end items-center sm:col-span-6">
+                                        <base-input :label="translations.currencies.default" class="sm:col-span-2" :error="onFailErrorGet('default_currency')">
+                                            <div class="flex items-center mt-1">
+                                                <label class="relative w-10 rounded-tl-lg rounded-bl-lg py-2 px-1 text-sm text-center transition-all cursor-pointer" @click="onChangeDefault(1)" v-bind:class="[model.default_currency == 1 ? ['bg-green-500','text-white'] : 'bg-black-100']">
+                                                    Yes
+                                                    <input type="radio" name="default_currency" id="default-1" class="absolute left-0 opacity-0">
+                                                </label>
+
+                                                <label class="relative w-10 rounded-tr-lg rounded-br-lg py-2 px-1 text-sm text-center transition-all cursor-pointer" @click="onChangeDefault(0)" v-bind:class="[model.default_currency == 0 ? ['bg-red-500','text-white'] : 'bg-black-100']">
+                                                    No
+                                                    <input type="radio" name="default_currency" id="default-0" class="absolute left-0 opacity-0">
+                                                </label>
+                                            </div>
+
+                                            <input type="hidden" name="default_currency" value="0" v-model="model.default_currency" />
+                                        </base-input>
+
+                                        <div class="flex justify-end items-center sm:col-span-12">
                                             <base-button class="flex items-center justify-center px-6 py-1.5 text-base rounded-lg bg-transparent hover:bg-gray-100 ltr:mr-2 rtl:ml-2" @click="onCancelItem()">
                                                 {{ translations.currencies.cancel }}
                                             </base-button>
@@ -106,36 +142,19 @@
                             </tr>
                         </tbody>
                     </table>
+
                     <div class="flex flex-col items-center">
-                        <div v-if="!currencies.length" class="flex flex-col items-center gap-y-2">
+                        <div v-if="new_datas" class="grid sm:grid-cols-12 gap-x-8 gap-y-6 px-1 py-3.5 w-full border-b hover:bg-gray-100">
-                            <span class="text-dark">
+                            <base-input :label="translations.currencies.name" 
-                                {{ translations.currencies.no_currency }}
+                                name="name" 
-                            </span>
+                                data-name="name" 
-
+                                :placeholder="translations.currencies.name"
-                            <span class="text-gray-700">
+                                class="sm:col-span-4"
-                                {{ translations.currencies.create_currency }}
-                            </span>
-                        </div>
-
-                        <div v-if="currencies.length" class="w-full border-b hover:bg-gray-100" style="height:53px;">
-                            <button type="button" class="w-full h-full flex items-center justify-center text-purple font-medium disabled:bg-gray-200" @click="onAddItem()">
-                                <span class="material-icons-outlined text-base font-bold ltr:mr-1 rtl:ml-1">add</span>
-                                <span class="bg-no-repeat bg-0-2 bg-0-full hover:bg-full-2 bg-gradient-to-b from-transparent to-purple transition-backgroundSize">{{ translations.currencies.new_currency }}</span>
-                            </button>
-                        </div>
-
-                        <button v-else type="button" class="relative flex items-center justify-center bg-green hover:bg-green-700 text-white px-6 py-1.5 text-base rounded-lg disabled:bg-green-100 mt-3" @click="onAddItem()">
-                            {{ translations.currencies.new_currency }}
-                        </button>
-
-                        <div v-if="new_datas" class="grid sm:grid-cols-7 gap-x-8 gap-y-6 my-3.5 w-full">
-                            <base-input :label="translations.currencies.name" name="name" data-name="name" :placeholder="translations.currencies.name"
-                            class="sm:col-span-3"
                                 v-model="model.name"
                                 :error="onFailErrorGet('name')"
                             />
 
-                            <base-input :label="translations.currencies.code" class="sm:col-span-2" :error="onFailErrorGet('code')">
+                            <base-input :label="translations.currencies.code" class="sm:col-span-3" :error="onFailErrorGet('code')">
                                 <el-select name="code" v-model="model.select" @change="onChangeCodeItem(model.select)"filterable>
                                     <el-option
                                         v-for="option in currency_codes"
@@ -147,13 +166,33 @@
                                 </el-select>
                             </base-input>
 
-                            <base-input :label="translations.currencies.rate" name="rate" data-name="rate" :placeholder="translations.currencies.rate"
+                            <base-input :label="translations.currencies.rate"
-                            class="sm:col-span-2"
+                                name="rate"
+                                data-name="rate"
+                                :placeholder="translations.currencies.rate"
+                                class="sm:col-span-3"
                                 v-model="model.rate"
+                                :disabled="model.default_currency == 1"
                                 :error="onFailErrorGet('rate')"
                             />
 
-                            <div class="flex items-center justify-end sm:col-span-7">
+                            <base-input :label="translations.currencies.default" class="sm:col-span-2" :error="onFailErrorGet('default_currency')">
+                                <div class="flex items-center mt-1">
+                                    <label class="relative w-10 rounded-tl-lg rounded-bl-lg py-2 px-1 text-sm text-center transition-all cursor-pointer" @click="onChangeDefault(1)" v-bind:class="[model.default_currency == 1 ? ['bg-green-500','text-white'] : 'bg-black-100']">
+                                        Yes
+                                        <input type="radio" name="default_currency" id="default-1" class="absolute left-0 opacity-0">
+                                    </label>
+
+                                    <label class="relative w-10 rounded-tr-lg rounded-br-lg py-2 px-1 text-sm text-center transition-all cursor-pointer" @click="onChangeDefault(0)" v-bind:class="[model.default_currency == 0 ? ['bg-red-500','text-white'] : 'bg-black-100']">
+                                        No
+                                        <input type="radio" name="default_currency" id="default-0" class="absolute left-0 opacity-0">
+                                    </label>
+                                </div>
+
+                                <input type="hidden" name="default_currency" value="0" v-model="model.default_currency" />
+                            </base-input>
+
+                            <div class="flex items-center justify-end sm:col-span-12">
                                 <base-button class=" flex items-center justify-center px-6 py-1.5 text-base rounded-lg bg-transparent hover:bg-gray-100 ltr:mr-2 rtl:ml-2" @click="new_datas = false">
                                     {{ translations.currencies.cancel }}
                                 </base-button>
@@ -166,6 +205,27 @@
                                 </button>
                             </div>
                         </div>
+
+                        <div v-if="! currencies.length && ! new_datas" class="flex flex-col items-center gap-y-2">
+                            <span class="text-dark">
+                                {{ translations.currencies.no_currency }}
+                            </span>
+
+                            <span class="text-gray-700">
+                                {{ translations.currencies.create_currency }}
+                            </span>
+                        </div>
+
+                        <button v-if="! currencies.length && ! new_datas" type="button" class="relative flex items-center justify-center bg-green hover:bg-green-700 text-white px-6 py-1.5 text-base rounded-lg disabled:bg-green-100 mt-3" @click="onAddItem()">
+                            {{ translations.currencies.new_currency }}
+                        </button>
+
+                        <div v-if="currencies.length && ! new_datas" class="w-full border-b hover:bg-gray-100" style="height:53px;">
+                            <button type="button" class="w-full h-full flex items-center justify-center text-purple font-medium disabled:bg-gray-200" @click="onAddItem()">
+                                <span class="material-icons-outlined text-base font-bold ltr:mr-1 rtl:ml-1">add</span>
+                                <span class="bg-no-repeat bg-0-2 bg-0-full hover:bg-full-2 bg-gradient-to-b from-transparent to-purple transition-backgroundSize">{{ translations.currencies.new_currency }}</span>
+                            </button>
+                        </div>
                     </div>
                 </form>
             </div>
@@ -181,11 +241,11 @@
             </div>
         </div>
 
-        <notifications></notifications>
-
         <form id="form-dynamic-component" method="POST" action="#"></form>
 
         <component v-bind:is="component" @deleted="onDeleteCurrency($event)"></component>
+
+        <notifications></notifications>
     </div>
 </template>
 
@@ -200,7 +260,10 @@ import WizardSteps from "./Steps.vue";
     export default {
         name: "Currencies",
 
-    mixins: [MixinsGlobal, WizardAction],
+        mixins: [
+            MixinsGlobal,
+            WizardAction
+        ],
 
         components: {
             [Select.name]: Select,
@@ -230,10 +293,14 @@ export default {
         data() {
             return {
                 active: 1,
-            bulk_action: new BulkAction(url + "/settings/currencies"),
+                empty: false,
             };
         },
 
+        created() {
+            this.empty = ! this.currencies.length;
+        },
+
         methods: {
             onClickDelete(item) {
                 this.confirmDelete(
@@ -253,7 +320,24 @@ export default {
             },
 
             onDeleteCurrency(event) {
+                this.empty = this.currencies.length;
+
+                if (event.success) {
                     this.onEjetItem(event, this.currencies, event.currency_id);
+
+                    this.empty = ! this.currencies.length;
+                } else {
+                    this.component = "";
+                    event.important = true;
+                    document.body.classList.remove("overflow-hidden");
+
+                    this.onDeleteItemMessage(event);
+                }
+            },
+
+            onChangeDefault(value) {
+                this.model.rate = 1;
+                this.model.default_currency = value;
             },
 
             onChangeCodeItem(code) {

resources/views/components/layouts/wizard/scripts.blade.php

@@ -1,6 +1,8 @@
 @stack('scripts_start')
     <!-- Core -->
     <script src="{{ asset('public/vendor/js-cookie/js.cookie.js') }}"></script>
+    <script type="text/javascript" src="{{ asset('public/akaunting-js/generalAction.js') }}"></script>
+    <script type="text/javascript" src="{{ asset('public/akaunting-js/popper.js') }}"></script>
 
     <script type="text/javascript">
         var wizard_translations = {!! json_encode($translations) !!};