Move base-select into base

resources/scripts/App.vue

@@ -3,3 +3,6 @@
 
   <BaseDialog />
 </template>
+<script setup lang="ts">
+import BaseDialog from '@/scripts/components/base/BaseDialog.vue'
+</script>

resources/scripts/InvoiceShelf.js

@@ -3,7 +3,6 @@ import App from '@/scripts/App.vue'
 import { createI18n } from 'vue-i18n'
 import messages from '/lang/locales'
 import router from '@/scripts/router/index'
-import { defineGlobalComponents } from './global-components'
 import utils from '@/scripts/helpers/utilities.js'
 import _ from 'lodash'
 import { VTooltip } from 'v-tooltip'
@@ -33,8 +32,6 @@ export default class InvoiceShelf {
   start() {
     this.executeCallbacks()
 
-    defineGlobalComponents(app)
-
     app.provide('$utils', utils)
 
     const i18n = createI18n({

resources/scripts/admin/components/SelectNotePopup.vue

@@ -152,6 +152,8 @@ import { useModalStore } from '@/scripts/stores/modal'
 import NoteModal from '@/scripts/admin/components/modal-components/NoteModal.vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
 
 const props = defineProps({
   type: {

resources/scripts/admin/components/currency-exchange-rate/ExchangeRateBulkUpdate.vue

@@ -79,6 +79,10 @@ import { useI18n } from 'vue-i18n'
 import useVuelidate from '@vuelidate/core'
 import { required, helpers, numeric, decimal } from '@vuelidate/validators'
 import { ValidateEach } from '@vuelidate/components'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseCard from '@/scripts/components/base/BaseCard.vue'
 
 const exchangeRateStore = useExchangeRateStore()
 const notificationStore = useNotificationStore()

resources/scripts/admin/components/custom-fields/CreateCustomFields.vue

@@ -24,6 +24,7 @@ import lodash from 'lodash'
 import { useCustomFieldStore } from '@/scripts/admin/stores/custom-field'
 import { watch } from 'vue'
 import SingleField from './CreateCustomFieldsSingle.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
 
 const customFieldStore = useCustomFieldStore()
 

resources/scripts/admin/components/custom-fields/CreateCustomFieldsSingle.vue

@@ -19,6 +19,7 @@ import { defineAsyncComponent, computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { helpers, requiredIf } from '@vuelidate/validators'
 import useVuelidate from '@vuelidate/core'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
 
 const props = defineProps({
   field: {

resources/scripts/admin/components/custom-fields/types/DateTimeType.vue

@@ -5,6 +5,7 @@
 <script setup>
 import moment from 'moment'
 import { computed } from 'vue'
+import BaseDatePicker from '@/scripts/components/base/BaseDatePicker.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/custom-fields/types/DateType.vue

@@ -5,6 +5,7 @@
 <script setup>
 import { computed } from 'vue'
 import moment from 'moment'
+import BaseDatePicker from '@/scripts/components/base/BaseDatePicker.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/custom-fields/types/DropdownType.vue

@@ -10,6 +10,7 @@
 
 <script setup>
 import { computed } from 'vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/custom-fields/types/InputType.vue

@@ -4,6 +4,7 @@
 
 <script setup>
 import { computed } from 'vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/custom-fields/types/NumberType.vue

@@ -4,6 +4,7 @@
 
 <script setup>
 import { computed } from 'vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/custom-fields/types/PhoneType.vue

@@ -4,6 +4,7 @@
 
 <script setup>
 import { computed } from 'vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/custom-fields/types/SwitchType.vue

@@ -4,6 +4,7 @@
 
 <script setup>
 import { computed } from 'vue'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/custom-fields/types/TextAreaType.vue

@@ -4,6 +4,7 @@
 
 <script setup>
 import { computed } from 'vue'
+import BaseTextarea from '@/scripts/components/base/BaseTextarea.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/custom-fields/types/TimeType.vue

@@ -5,6 +5,7 @@
 <script setup>
 import { computed } from 'vue'
 import moment from 'moment'
+import BaseTimePicker from '@/scripts/components/base/BaseTimePicker.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/custom-fields/types/UrlType.vue

@@ -4,6 +4,7 @@
 
 <script setup>
 import { computed } from 'vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
 
 const props = defineProps({
   modelValue: {

resources/scripts/admin/components/dropdowns/CustomFieldIndexDropdown.vue

@@ -40,6 +40,9 @@ import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { useModalStore } from '@/scripts/stores/modal'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/CustomerIndexDropdown.vue

@@ -62,6 +62,10 @@ import { useRoute, useRouter } from 'vue-router'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { inject } from 'vue'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/EstimateIndexDropdown.vue

@@ -169,6 +169,10 @@ import { useDialogStore } from '@/scripts/stores/dialog'
 import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/ExpenseCategoryIndexDropdown.vue

@@ -46,6 +46,10 @@ import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { useModalStore } from '@/scripts/stores/modal'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/ExpenseIndexDropdown.vue

@@ -44,6 +44,10 @@ import { useRoute, useRouter } from 'vue-router'
 import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/InvoiceIndexDropdown.vue

@@ -123,6 +123,10 @@ import { useRoute, useRouter } from 'vue-router'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { inject } from 'vue'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/ItemIndexDropdown.vue

@@ -44,6 +44,10 @@ import { useRoute, useRouter } from 'vue-router'
 import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/NoteIndexDropdown.vue

@@ -43,6 +43,10 @@ import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { useModalStore } from '@/scripts/stores/modal'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/PaymentIndexDropdown.vue

@@ -94,6 +94,10 @@ import { useRoute, useRouter } from 'vue-router'
 import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/PaymentModeIndexDropdown.vue

@@ -36,6 +36,10 @@ import { useRoute, useRouter } from 'vue-router'
 import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { useModalStore } from '@/scripts/stores/modal'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/RecurringInvoiceIndexDropdown.vue

@@ -66,6 +66,10 @@ import { useUserStore } from '@/scripts/admin/stores/user'
 import { inject } from 'vue'
 import { useRecurringInvoiceStore } from '@/scripts/admin/stores/recurring-invoice'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/RoleIndexDropdown.vue

@@ -42,6 +42,10 @@ import { useRoute, useRouter } from 'vue-router'
 import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { useModalStore } from '@/scripts/stores/modal'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/TaxTypeIndexDropdown.vue

@@ -43,6 +43,10 @@ import { inject } from 'vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { useModalStore } from '@/scripts/stores/modal'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/dropdowns/UserIndexDropdown.vue

@@ -37,6 +37,10 @@ import { useUserStore } from '@/scripts/admin/stores/user'
 import { useRoute, useRouter } from 'vue-router'
 import { inject } from 'vue'
 import { useUsersStore } from '@/scripts/admin/stores/users'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const props = defineProps({
   row: {

resources/scripts/admin/components/estimate-invoice-common/CreateItemRow.vue

@@ -194,6 +194,16 @@ import useVuelidate from '@vuelidate/core'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import { useItemStore } from '@/scripts/admin/stores/item'
 import DragIcon from '@/scripts/components/icons/DragIcon.vue'
+import BaseContentPlaceholdersText from '@/scripts/components/base/BaseContentPlaceholdersText.vue'
+import BaseContentPlaceholders from '@/scripts/components/base/BaseContentPlaceholders.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseMoney from '@/scripts/components/base/BaseMoney.vue'
+import BaseItemSelect from '@/scripts/components/base/BaseItemSelect.vue'
 
 const props = defineProps({
   store: {

resources/scripts/admin/components/estimate-invoice-common/CreateItemRowTax.vue

@@ -19,7 +19,7 @@
       >
         <template #singlelabel="{ value }">
           <div class="absolute left-3.5">
-            {{ value.name }} - 
+            {{ value.name }} -
             <template v-if="value.calculation_type === 'fixed'">
               <BaseFormatMoney :amount="value.fixed_amount" :currency="currency" />
             </template>
@@ -30,7 +30,7 @@
         </template>
 
         <template #option="{ option }">
-          {{ option.name }} - 
+          {{ option.name }} -
           <template v-if="option.calculation_type === 'fixed'">
             <BaseFormatMoney :amount="option.fixed_amount" :currency="currency" />
           </template>
@@ -78,6 +78,9 @@ import { useTaxTypeStore } from '@/scripts/admin/stores/tax-type'
 import { useModalStore } from '@/scripts/stores/modal'
 import { useI18n } from 'vue-i18n'
 import { useUserStore } from '@/scripts/admin/stores/user'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
 
 const props = defineProps({
   ability: {
@@ -162,7 +165,7 @@ const taxAmount = computed(() => {
   if(localTax.calculation_type === 'fixed') {
     return localTax.fixed_amount
   }
-  
+
   if (props.discountedTotal) {
     const taxPerItemEnabled = props.store[props.storeProp].tax_per_item === 'YES'
     const discountPerItemEnabled = props.store[props.storeProp].discount_per_item === 'YES'

resources/scripts/admin/components/estimate-invoice-common/CreateItems.vue

@@ -181,6 +181,9 @@ import { useCompanyStore } from '@/scripts/admin/stores/company'
 import { computed } from 'vue'
 import draggable from 'vuedraggable'
 import Item from './CreateItemRow.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseContentPlaceholdersText from '@/scripts/components/base/BaseContentPlaceholdersText.vue'
+import BaseContentPlaceholders from '@/scripts/components/base/BaseContentPlaceholders.vue'
 
 const props = defineProps({
   store: {

resources/scripts/admin/components/estimate-invoice-common/CreateNotesField.vue

@@ -20,6 +20,7 @@
 <script setup>
 import { ref } from 'vue'
 import SelectNotePopup from '../SelectNotePopup.vue'
+import BaseCustomInput from '@/scripts/components/base/BaseCustomInput.vue'
 
 const props = defineProps({
   store: {

resources/scripts/admin/components/estimate-invoice-common/CreateTotal.vue

@@ -230,6 +230,14 @@ import Tax from './CreateTotalTaxes.vue'
 import TaxStub from '@/scripts/admin/stub/abilities'
 import SelectTaxPopup from './SelectTaxPopup.vue'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseContentPlaceholdersText from '@/scripts/components/base/BaseContentPlaceholdersText.vue'
+import BaseContentPlaceholders from '@/scripts/components/base/BaseContentPlaceholders.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
 
 const taxModal = ref(null)
 

resources/scripts/admin/components/estimate-invoice-common/CreateTotalTaxes.vue

@@ -20,6 +20,8 @@
 
 <script setup>
 import { computed, watch, inject, watchEffect } from 'vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
 
 const props = defineProps({
   index: {

resources/scripts/admin/components/estimate-invoice-common/ExchangeRateConverter.vue

@@ -49,6 +49,9 @@ import { watch, computed, ref, onBeforeUnmount } from 'vue'
 import { useGlobalStore } from '@/scripts/admin/stores/global'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import { useExchangeRateStore } from '@/scripts/admin/stores/exchange-rate'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
 
 const props = defineProps({
   v: {

resources/scripts/admin/components/estimate-invoice-common/SelectTaxPopup.vue

@@ -180,6 +180,8 @@ import { useTaxTypeStore } from '@/scripts/admin/stores/tax-type'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
 import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
 
 const props = defineProps({

resources/scripts/admin/components/estimate-invoice-common/SelectTemplateButton.vue

@@ -21,6 +21,8 @@
 <script setup>
 import { useModalStore } from '@/scripts/stores/modal'
 import { useI18n } from 'vue-i18n'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
 
 const props = defineProps({
   store: {

resources/scripts/admin/components/modal-components/BackupModal.vue

@@ -97,6 +97,12 @@ import { useModalStore } from '@/scripts/stores/modal'
 import { useDiskStore } from '@/scripts/admin/stores/disk'
 import { required, helpers } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 let table = ref(null)
 let isSaving = ref(false)

resources/scripts/admin/components/modal-components/CategoryModal.vue

@@ -92,6 +92,13 @@ import { computed, ref } from 'vue'
 import { required, minLength, maxLength, helpers } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
 import { useI18n } from 'vue-i18n'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseTextarea from '@/scripts/components/base/BaseTextarea.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const categoryStore = useCategoryStore()
 const modalStore = useModalStore()

resources/scripts/admin/components/modal-components/CompanyModal.vue

@@ -137,6 +137,16 @@ import { useVuelidate } from '@vuelidate/core'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import { useGlobalStore } from '@/scripts/admin/stores/global'
 import { useRouter } from 'vue-router'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseFileUploader from '@/scripts/components/base/BaseFileUploader.vue'
+import BaseContentPlaceholdersBox from '@/scripts/components/base/BaseContentPlaceholdersBox.vue'
+import BaseContentPlaceholders from '@/scripts/components/base/BaseContentPlaceholders.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const router = useRouter()
 const companyStore = useCompanyStore()

resources/scripts/admin/components/modal-components/CustomerModal.vue

@@ -476,6 +476,17 @@ import { useInvoiceStore } from '@/scripts/admin/stores/invoice'
 import CopyInputField from '@/scripts/admin/components/CopyInputField.vue'
 import { useNotificationStore } from '@/scripts/stores/notification'
 import { useRecurringInvoiceStore } from '@/scripts/admin/stores/recurring-invoice'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseTextarea from '@/scripts/components/base/BaseTextarea.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseTab from '@/scripts/components/base/BaseTab.vue'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
+import BaseTabGroup from '@/scripts/components/base/BaseTabGroup.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const recurringInvoiceStore = useRecurringInvoiceStore()
 const modalStore = useModalStore()

resources/scripts/admin/components/modal-components/DeleteCompanyModal.vue

@@ -77,6 +77,11 @@ import { required, minLength, helpers, sameAs } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import { useGlobalStore } from '@/scripts/admin/stores/global'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const companyStore = useCompanyStore()
 const modalStore = useModalStore()

resources/scripts/admin/components/modal-components/ExchangeRateBulkUpdateModal.vue

@@ -8,6 +8,7 @@
 import { computed, ref, watch } from 'vue'
 import ExchangeRateBulkUpdate from '@/scripts/admin/components/currency-exchange-rate/ExchangeRateBulkUpdate.vue'
 import { useModalStore } from '@/scripts/stores/modal'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const modalStore = useModalStore()
 

resources/scripts/admin/components/modal-components/ExchangeRateProviderModal.vue

@@ -199,6 +199,15 @@ import {
   requiredIf,
   url,
 } from '@vuelidate/validators'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInfoAlert from '@/scripts/components/base/BaseInfoAlert.vue'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const { t } = useI18n()
 

resources/scripts/admin/components/modal-components/FileDiskModal.vue

@@ -62,8 +62,14 @@ import Local from '@/scripts/admin/components/modal-components/disks/LocalDisk.v
 import S3 from '@/scripts/admin/components/modal-components/disks/S3Disk.vue'
 import S3compat from '@/scripts/admin/components/modal-components/disks/S3CompatDisk.vue'
 import DoSpaces from '@/scripts/admin/components/modal-components/disks/DoSpacesDisk.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 export default {
   components: {
+    BaseModal,
+    BaseButton,
+    BaseIcon,
     Dropbox,
     Local,
     S3,

resources/scripts/admin/components/modal-components/ItemModal.vue

@@ -137,6 +137,15 @@ import { useTaxTypeStore } from '@/scripts/admin/stores/tax-type'
 import { useNotificationStore } from '@/scripts/stores/notification'
 import { useEstimateStore } from '@/scripts/admin/stores/estimate'
 import { useInvoiceStore } from '@/scripts/admin/stores/invoice'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseTextarea from '@/scripts/components/base/BaseTextarea.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseMoney from '@/scripts/components/base/BaseMoney.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const emit = defineEmits(['newItem'])
 
@@ -208,15 +217,15 @@ const v$ = useVuelidate(
 
 const getTaxTypes = computed(() => {
   return taxTypeStore.taxTypes.map((tax) => {
-    const amount = tax.calculation_type === 'fixed' 
+    const amount = tax.calculation_type === 'fixed'
       ? new Intl.NumberFormat(undefined, {
           style: 'currency',
           currency: companyStore.selectedCompanyCurrency.code
         }).format(tax.fixed_amount / 100)
       : `${tax.percent}%`
-    
-    return { 
-      ...tax, 
+
+    return {
+      ...tax,
       tax_name: `${tax.name} (${amount})`
     }
   })

resources/scripts/admin/components/modal-components/ItemUnitModal.vue

@@ -78,6 +78,11 @@ import { computed, ref, watch } from 'vue'
 import { required, minLength, maxLength, helpers } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
 import { useI18n } from 'vue-i18n'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const itemStore = useItemStore()
 const modalStore = useModalStore()

resources/scripts/admin/components/modal-components/MailTestModal.vue

@@ -96,6 +96,13 @@ import { required, email, maxLength, helpers } from '@vuelidate/validators'
 import useVuelidate from '@vuelidate/core'
 import { useModalStore } from '@/scripts/stores/modal'
 import { useMailDriverStore } from '@/scripts/admin/stores/mail-driver'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseTextarea from '@/scripts/components/base/BaseTextarea.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 let isSaving = ref(false)
 let formData = reactive({

resources/scripts/admin/components/modal-components/NoteModal.vue

@@ -115,6 +115,14 @@ import { useNotesStore } from '@/scripts/admin/stores/note'
 import { useInvoiceStore } from '@/scripts/admin/stores/invoice'
 import { usePaymentStore } from '@/scripts/admin/stores/payment'
 import { useEstimateStore } from '@/scripts/admin/stores/estimate'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseCustomInput from '@/scripts/components/base/BaseCustomInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const modalStore = useModalStore()
 const notificationStore = useNotificationStore()

resources/scripts/admin/components/modal-components/PaymentModeModal.vue

@@ -68,6 +68,11 @@ import { useI18n } from 'vue-i18n'
 import { required, minLength, helpers } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
 import { useModalStore } from '@/scripts/stores/modal'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const modalStore = useModalStore()
 const paymentStore = usePaymentStore()

resources/scripts/admin/components/modal-components/RolesModal.vue

@@ -156,6 +156,12 @@ import { required, minLength, helpers } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
 import { useRoleStore } from '@/scripts/admin/stores/role'
 import { useModalStore } from '@/scripts/stores/modal'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseCheckbox from '@/scripts/components/base/BaseCheckbox.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const modalStore = useModalStore()
 const roleStore = useRoleStore()

resources/scripts/admin/components/modal-components/SelectTemplateModal.vue

@@ -88,6 +88,10 @@
 import { ref, computed } from 'vue'
 import { useModalStore } from '@/scripts/stores/modal'
 import { useUserStore } from '@/scripts/admin/stores/user'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseCheckbox from '@/scripts/components/base/BaseCheckbox.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const modalStore = useModalStore()
 const userStore = useUserStore()

resources/scripts/admin/components/modal-components/SendEstimateModal.vue

@@ -142,6 +142,13 @@ import { useEstimateStore } from '@/scripts/admin/stores/estimate'
 import { useNotificationStore } from '@/scripts/stores/notification'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import { useMailDriverStore } from '@/scripts/admin/stores/mail-driver'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseCustomInput from '@/scripts/components/base/BaseCustomInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const modalStore = useModalStore()
 const estimateStore = useEstimateStore()

resources/scripts/admin/components/modal-components/SendInvoiceModal.vue

@@ -155,6 +155,13 @@ import { useInvoiceStore } from '@/scripts/admin/stores/invoice'
 import { useVuelidate } from '@vuelidate/core'
 import { required, email, helpers } from '@vuelidate/validators'
 import { useMailDriverStore } from '@/scripts/admin/stores/mail-driver'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseCustomInput from '@/scripts/components/base/BaseCustomInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const modalStore = useModalStore()
 const companyStore = useCompanyStore()

resources/scripts/admin/components/modal-components/SendPaymentModal.vue

@@ -156,6 +156,13 @@ import { useNotificationStore } from '@/scripts/stores/notification'
 import { useModalStore } from '@/scripts/stores/modal'
 import { useMailDriverStore } from '@/scripts/admin/stores/mail-driver'
 import { useDialogStore } from '@/scripts/stores/dialog'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseCustomInput from '@/scripts/components/base/BaseCustomInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const paymentStore = usePaymentStore()
 const companyStore = useCompanyStore()

resources/scripts/admin/components/modal-components/TaxTypeModal.vue

@@ -158,6 +158,14 @@ import {
   helpers,
 } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseTextarea from '@/scripts/components/base/BaseTextarea.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMoney from '@/scripts/components/base/BaseMoney.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const taxTypeStore = useTaxTypeStore()
 const modalStore = useModalStore()

resources/scripts/admin/components/modal-components/TaxationAddressModal.vue

@@ -123,6 +123,13 @@ import { useGlobalStore } from '@/scripts/admin/stores/global'
 import { useI18n } from 'vue-i18n'
 import { helpers, required } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseTextarea from '@/scripts/components/base/BaseTextarea.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const modalStore = useModalStore()
 const globalStore = useGlobalStore()

resources/scripts/admin/components/modal-components/custom-fields/CustomFieldModal.vue

@@ -222,6 +222,14 @@ import { required, numeric, helpers } from '@vuelidate/validators'
 import { useModalStore } from '@/scripts/stores/modal'
 import { useCustomFieldStore } from '@/scripts/admin/stores/custom-field'
 import { useI18n } from 'vue-i18n'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseModal from '@/scripts/components/base/BaseModal.vue'
 
 const modalStore = useModalStore()
 const customFieldStore = useCustomFieldStore()

resources/scripts/admin/components/modal-components/custom-fields/OptionsCreate.vue

@@ -19,6 +19,8 @@
 
 <script setup>
 import { ref } from 'vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
 
 const emit = defineEmits(['onAdd'])
 

resources/scripts/admin/components/modal-components/disks/DoSpacesDisk.vue

@@ -170,7 +170,13 @@ import { computed, onBeforeUnmount, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import useVuelidate from '@vuelidate/core'
 import { required, url, helpers } from '@vuelidate/validators'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
 export default {
+  components: { BaseInputGrid, BaseMultiselect, BaseInputGroup, BaseInput, BaseSwitch },
   props: {
     isEdit: {
       type: Boolean,

resources/scripts/admin/components/modal-components/disks/DropboxDisk.vue

@@ -149,7 +149,13 @@ import { reactive, ref, computed, onBeforeUnmount } from 'vue'
 import { useI18n } from 'vue-i18n'
 import useVuelidate from '@vuelidate/core'
 import { required, helpers } from '@vuelidate/validators'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
 export default {
+  components: { BaseInputGrid, BaseMultiselect, BaseInputGroup, BaseInput, BaseSwitch },
   props: {
     isEdit: {
       type: Boolean,

resources/scripts/admin/components/modal-components/disks/LocalDisk.vue

@@ -80,8 +80,14 @@ import { computed, onBeforeUnmount, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import useVuelidate from '@vuelidate/core'
 import { required, helpers } from '@vuelidate/validators'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
 
 export default {
+  components: { BaseInputGrid, BaseMultiselect, BaseInputGroup, BaseInput, BaseSwitch },
   props: {
     isEdit: {
       type: Boolean,

resources/scripts/admin/components/modal-components/disks/S3CompatDisk.vue

@@ -169,7 +169,13 @@ import { computed, onBeforeUnmount, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import useVuelidate from '@vuelidate/core'
 import { required, helpers } from '@vuelidate/validators'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
 export default {
+  components: { BaseInputGrid, BaseMultiselect, BaseInputGroup, BaseInput, BaseSwitch },
   props: {
     isEdit: {
       type: Boolean,

resources/scripts/admin/components/modal-components/disks/S3Disk.vue

@@ -151,7 +151,13 @@ import { computed, onBeforeUnmount, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import useVuelidate from '@vuelidate/core'
 import { required, helpers } from '@vuelidate/validators'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
 export default {
+  components: { BaseInputGrid, BaseMultiselect, BaseInputGroup, BaseInput, BaseSwitch },
   props: {
     isEdit: {
       type: Boolean,

resources/scripts/admin/layouts/LayoutBasic.vue

@@ -34,6 +34,7 @@ import SiteHeader from '@/scripts/admin/layouts/partials/TheSiteHeader.vue'
 import SiteSidebar from '@/scripts/admin/layouts/partials/TheSiteSidebar.vue'
 import NotificationRoot from '@/scripts/components/notifications/NotificationRoot.vue'
 import ExchangeRateBulkUpdateModal from '@/scripts/admin/components/modal-components/ExchangeRateBulkUpdateModal.vue'
+import BaseGlobalLoader from '@/scripts/components/base/BaseGlobalLoader.vue'
 
 const globalStore = useGlobalStore()
 const route = useRoute()

resources/scripts/admin/layouts/partials/TheSiteHeader.vue

@@ -184,6 +184,9 @@ import GlobalSearchBar from '@/scripts/components/GlobalSearchBar.vue'
 import MainLogo from '@/scripts/components/icons/MainLogo.vue'
 
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
 
 const authStore = useAuthStore()
 const userStore = useUserStore()

resources/scripts/admin/layouts/partials/TheSiteSidebar.vue

@@ -169,6 +169,7 @@ import {
 
 import { useRoute } from 'vue-router'
 import { useGlobalStore } from '@/scripts/admin/stores/global'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
 
 const route = useRoute()
 const globalStore = useGlobalStore()

resources/scripts/admin/views/SampleTable.vue

@@ -79,6 +79,10 @@
 </template>
 
 <script>
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
+
 import { computed, reactive } from 'vue'
 import { useItemStore } from '@/scripts/admin/stores/item'
 import {
@@ -90,6 +94,9 @@ import {
 
 export default {
   components: {
+    BasePage,
+    BaseDropdown,
+    BaseDropdownItem,
     BaseTable,
     EllipsisHorizontalIcon,
     UserIcon,

resources/scripts/admin/views/auth/ForgotPassword.vue

@@ -42,12 +42,15 @@
 
 <script type="text/babel" setup>
 import axios from 'axios'
-import { reactive, ref, computed } from 'vue'
-import { required, email, helpers } from '@vuelidate/validators'
+import { reactive, ref } from 'vue'
+import { email, helpers, required } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
 import { useNotificationStore } from '@/scripts/stores/notification'
 import { useI18n } from 'vue-i18n'
 import { handleError } from '@/scripts/helpers/error-handling'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
 
 const notificationStore = useNotificationStore()
 const { t } = useI18n()

resources/scripts/admin/views/auth/Login.vue

@@ -57,14 +57,17 @@
 
 <script setup>
 import axios from 'axios'
-import { ref, computed, onMounted } from 'vue'
+import { computed, onMounted, ref } from 'vue'
 import { useNotificationStore } from '@/scripts/stores/notification'
 import { useRouter } from 'vue-router'
-import { required, email, helpers } from '@vuelidate/validators'
+import { email, helpers, required } from '@vuelidate/validators'
 import { useVuelidate } from '@vuelidate/core'
 import { useI18n } from 'vue-i18n'
 import { useAuthStore } from '@/scripts/admin/stores/auth'
-import { handleError } from '@/scripts/helpers/error-handling'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
 
 const notificationStore = useNotificationStore()
 const authStore = useAuthStore()

resources/scripts/admin/views/auth/ResetPassword.vue

@@ -53,14 +53,17 @@
 </template>
 
 <script type="text/babel" setup>
-import { ref, computed, reactive } from 'vue'
+import { computed, reactive, ref } from 'vue'
 import useVuelidate from '@vuelidate/core'
-import { required, email, minLength, sameAs } from '@vuelidate/validators'
+import { email, minLength, required, sameAs } from '@vuelidate/validators'
 import { useNotificationStore } from '@/scripts/stores/notification'
 import { useRoute, useRouter } from 'vue-router'
 import axios from 'axios'
 import { useI18n } from 'vue-i18n'
 import { handleError } from '@/scripts/helpers/error-handling'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
 
 const notificationStore = useNotificationStore()
 const { t } = useI18n()

resources/scripts/admin/views/customers/Create.vue

@@ -582,19 +582,10 @@
 </template>
 
 <script setup>
-import { computed, onMounted, ref } from 'vue'
+import { computed, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
-import {
-  required,
-  minLength,
-  url,
-  maxLength,
-  helpers,
-  email,
-  sameAs,
-  requiredIf,
-} from '@vuelidate/validators'
+import { email, helpers, maxLength, minLength, required, requiredIf, sameAs, url } from '@vuelidate/validators'
 import useVuelidate from '@vuelidate/core'
 import { useCustomerStore } from '@/scripts/admin/stores/customer'
 import { useCustomFieldStore } from '@/scripts/admin/stores/custom-field'
@@ -602,6 +593,20 @@ import CustomerCustomFields from '@/scripts/admin/components/custom-fields/Creat
 import { useGlobalStore } from '@/scripts/admin/stores/global'
 import CopyInputField from '@/scripts/admin/components/CopyInputField.vue'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
+import BaseDivider from '@/scripts/components/base/BaseDivider.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseTextarea from '@/scripts/components/base/BaseTextarea.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseSwitch from '@/scripts/components/base/BaseSwitch.vue'
+import BaseCard from '@/scripts/components/base/BaseCard.vue'
+import BaseBreadcrumbItem from '@/scripts/components/base/BaseBreadcrumbItem.vue'
+import BaseBreadcrumb from '@/scripts/components/base/BaseBreadcrumb.vue'
+import BasePageHeader from '@/scripts/components/base/BasePageHeader.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
 
 const customerStore = useCustomerStore()
 const customFieldStore = useCustomFieldStore()

resources/scripts/admin/views/customers/Index.vue

@@ -195,7 +195,7 @@
 <script setup>
 import { debouncedWatch } from '@vueuse/core'
 import moment from 'moment'
-import { reactive, ref, inject, computed, onUnmounted } from 'vue'
+import { computed, onUnmounted, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useCustomerStore } from '@/scripts/admin/stores/customer'
 import { useDialogStore } from '@/scripts/stores/dialog'
@@ -206,6 +206,22 @@ import abilities from '@/scripts/admin/stub/abilities'
 
 import CustomerDropdown from '@/scripts/admin/components/dropdowns/CustomerIndexDropdown.vue'
 import AstronautIcon from '@/scripts/components/icons/empty/AstronautIcon.vue'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseText from '@/scripts/components/base/BaseText.vue'
+import BaseCheckbox from '@/scripts/components/base/BaseCheckbox.vue'
+import BaseTable from '@/scripts/components/base/base-table/BaseTable.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseEmptyPlaceholder from '@/scripts/components/base/BaseEmptyPlaceholder.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseFilterWrapper from '@/scripts/components/base/BaseFilterWrapper.vue'
+import BaseBreadcrumbItem from '@/scripts/components/base/BaseBreadcrumbItem.vue'
+import BaseBreadcrumb from '@/scripts/components/base/BaseBreadcrumb.vue'
+import BasePageHeader from '@/scripts/components/base/BasePageHeader.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
 
 const companyStore = useCompanyStore()
 const dialogStore = useDialogStore()

resources/scripts/admin/views/customers/View.vue

@@ -93,14 +93,20 @@
 <script setup>
 import CustomerViewSidebar from './partials/CustomerViewSidebar.vue'
 import CustomerChart from './partials/CustomerChart.vue'
-import { ref, computed, inject } from 'vue'
-import { useRouter, useRoute } from 'vue-router'
+import { computed, inject, ref } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 import { useCustomerStore } from '@/scripts/admin/stores/customer'
 import { useDialogStore } from '@/scripts/stores/dialog'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import CustomerDropdown from '@/scripts/admin/components/dropdowns/CustomerIndexDropdown.vue'
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BasePageHeader from '@/scripts/components/base/BasePageHeader.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
 
 const utils = inject('utils')
 const dialogStore = useDialogStore()

resources/scripts/admin/views/customers/partials/CustomerChart.vue

@@ -123,12 +123,16 @@
 <script setup>
 import CustomerInfo from './CustomerInfo.vue'
 import LineChart from '@/scripts/admin/components/charts/LineChart.vue'
-import { ref, computed, watch, reactive, inject } from 'vue'
+import { computed, inject, reactive, ref, watch } from 'vue'
 import { useCustomerStore } from '@/scripts/admin/stores/customer'
 import { useRoute } from 'vue-router'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import ChartPlaceholder from './CustomerChartPlaceholder.vue'
 import { useI18n } from 'vue-i18n'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseCard from '@/scripts/components/base/BaseCard.vue'
 
 const companyStore = useCompanyStore()
 const customerStore = useCustomerStore()

resources/scripts/admin/views/customers/partials/CustomerChartPlaceholder.vue

@@ -77,3 +77,8 @@
     </div>
   </BaseContentPlaceholders>
 </template>
+<script setup lang="ts">
+import BaseContentPlaceholdersText from '@/scripts/components/base/BaseContentPlaceholdersText.vue'
+import BaseContentPlaceholdersBox from '@/scripts/components/base/BaseContentPlaceholdersBox.vue'
+import BaseContentPlaceholders from '@/scripts/components/base/BaseContentPlaceholders.vue'
+</script>

resources/scripts/admin/views/customers/partials/CustomerInfo.vue

@@ -108,6 +108,10 @@
 <script setup>
 import { computed } from 'vue'
 import { useCustomerStore } from '@/scripts/admin/stores/customer'
+import BaseDescriptionListItem from '@/scripts/components/base/BaseDescriptionListItem.vue'
+import BaseDescriptionList from '@/scripts/components/base/BaseDescriptionList.vue'
+import BaseHeading from '@/scripts/components/base/BaseHeading.vue'
+import BaseCustomerAddressDisplay from '@/scripts/components/base/BaseCustomerAddressDisplay.vue'
 
 const customerStore = useCustomerStore()
 

resources/scripts/admin/views/customers/partials/CustomerViewSidebar.vue

@@ -182,12 +182,21 @@
 </template>
 
 <script setup>
-import { computed, ref, reactive } from 'vue'
+import { computed, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useRoute } from 'vue-router'
 import { useCustomerStore } from '@/scripts/admin/stores/customer'
 import LoadingIcon from '@/scripts/components/icons/LoadingIcon.vue'
 import { debounce } from 'lodash'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseText from '@/scripts/components/base/BaseText.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseRadio from '@/scripts/components/base/BaseRadio.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
 
 const customerStore = useCustomerStore()
 const route = useRoute()

resources/scripts/admin/views/dashboard/Dashboard.vue

@@ -5,6 +5,7 @@ import DashboardTable from '../dashboard/DashboardTable.vue'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { onMounted } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
+import BasePage from '@/scripts/components/base/BasePage.vue'
 
 const route = useRoute()
 const userStore = useUserStore()

resources/scripts/admin/views/dashboard/DashboardChart.vue

@@ -149,7 +149,7 @@
 </template>
 
 <script setup>
-import { ref, watch, inject } from 'vue'
+import { inject, ref, watch } from 'vue'
 import { useDashboardStore } from '@/scripts/admin/stores/dashboard'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import LineChart from '@/scripts/admin/components/charts/LineChart.vue'
@@ -157,6 +157,9 @@ import ChartPlaceholder from './DashboardChartPlaceholder.vue'
 import abilities from '@/scripts/admin/stub/abilities'
 import { useUserStore } from '@/scripts/admin/stores/user'
 import { useI18n } from 'vue-i18n'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
 
 const dashboardStore = useDashboardStore()
 const companyStore = useCompanyStore()

resources/scripts/admin/views/dashboard/DashboardChartPlaceholder.vue

@@ -86,3 +86,8 @@
     </div>
   </BaseContentPlaceholders>
 </template>
+<script setup lang="ts">
+import BaseContentPlaceholdersText from '@/scripts/components/base/BaseContentPlaceholdersText.vue'
+import BaseContentPlaceholdersBox from '@/scripts/components/base/BaseContentPlaceholdersBox.vue'
+import BaseContentPlaceholders from '@/scripts/components/base/BaseContentPlaceholders.vue'
+</script>

resources/scripts/admin/views/dashboard/DashboardStats.vue

@@ -62,6 +62,7 @@ import { inject } from 'vue'
 import { useDashboardStore } from '@/scripts/admin/stores/dashboard'
 import { useCompanyStore } from '@/scripts/admin/stores/company'
 import { useUserStore } from '@/scripts/admin/stores/user'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
 
 const utils = inject('utils')
 

resources/scripts/admin/views/dashboard/DashboardStatsPlaceholder.vue

@@ -18,3 +18,8 @@
     </div>
   </BaseContentPlaceholders>
 </template>
+<script setup lang="ts">
+import BaseContentPlaceholdersBox from '@/scripts/components/base/BaseContentPlaceholdersBox.vue'
+import BaseContentPlaceholdersText from '@/scripts/components/base/BaseContentPlaceholdersText.vue'
+import BaseContentPlaceholders from '@/scripts/components/base/BaseContentPlaceholders.vue'
+</script>

resources/scripts/admin/views/dashboard/DashboardStatsSmPlaceholder.vue

@@ -29,3 +29,8 @@
     </div>
   </BaseContentPlaceholders>
 </template>
+<script setup lang="ts">
+import BaseContentPlaceholdersBox from '@/scripts/components/base/BaseContentPlaceholdersBox.vue'
+import BaseContentPlaceholdersText from '@/scripts/components/base/BaseContentPlaceholdersText.vue'
+import BaseContentPlaceholders from '@/scripts/components/base/BaseContentPlaceholders.vue'
+</script>

resources/scripts/admin/views/dashboard/DashboardTable.vue

@@ -111,6 +111,9 @@ import { useUserStore } from '@/scripts/admin/stores/user'
 import abilities from '@/scripts/admin/stub/abilities'
 import InvoiceDropdown from '@/scripts/admin/components/dropdowns/InvoiceIndexDropdown.vue'
 import EstimateDropdown from '@/scripts/admin/components/dropdowns/EstimateIndexDropdown.vue'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseTable from '@/scripts/components/base/base-table/BaseTable.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
 
 const dashboardStore = useDashboardStore()
 

resources/scripts/admin/views/errors/404.vue

@@ -40,6 +40,7 @@
 <script setup>
 import { computed } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
 
 const route = useRoute()
 const router = useRouter()

resources/scripts/admin/views/estimates/Index.vue

@@ -238,7 +238,7 @@
 </template>
 
 <script setup>
-import { computed, onUnmounted, reactive, ref, watch, inject } from 'vue'
+import { computed, onUnmounted, reactive, ref } from 'vue'
 import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 import { useEstimateStore } from '@/scripts/admin/stores/estimate'
@@ -250,7 +250,29 @@ import abilities from '@/scripts/admin/stub/abilities'
 import ObservatoryIcon from '@/scripts/components/icons/empty/ObservatoryIcon.vue'
 import EstimateDropDown from '@/scripts/admin/components/dropdowns/EstimateIndexDropdown.vue'
 import SendEstimateModal from '@/scripts/admin/components/modal-components/SendEstimateModal.vue'
-import BaseEstimateStatusLabel from "@/scripts/components/base/BaseEstimateStatusLabel.vue";
+import BaseEstimateStatusLabel from '@/scripts/components/base/BaseEstimateStatusLabel.vue'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseEstimateStatusBadge from '@/scripts/components/base/BaseEstimateStatusBadge.vue'
+import BaseText from '@/scripts/components/base/BaseText.vue'
+import BaseCheckbox from '@/scripts/components/base/BaseCheckbox.vue'
+import BaseTable from '@/scripts/components/base/base-table/BaseTable.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BaseTab from '@/scripts/components/base/BaseTab.vue'
+import BaseTabGroup from '@/scripts/components/base/BaseTabGroup.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseEmptyPlaceholder from '@/scripts/components/base/BaseEmptyPlaceholder.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseDatePicker from '@/scripts/components/base/BaseDatePicker.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseCustomerSelectInput from '@/scripts/components/base/BaseCustomerSelectInput.vue'
+import BaseFilterWrapper from '@/scripts/components/base/BaseFilterWrapper.vue'
+import BaseBreadcrumbItem from '@/scripts/components/base/BaseBreadcrumbItem.vue'
+import BaseBreadcrumb from '@/scripts/components/base/BaseBreadcrumb.vue'
+import BasePageHeader from '@/scripts/components/base/BasePageHeader.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
 
 const estimateStore = useEstimateStore()
 const dialogStore = useDialogStore()

resources/scripts/admin/views/estimates/View.vue

@@ -291,6 +291,19 @@ import SendEstimateModal from '@/scripts/admin/components/modal-components/SendE
 import LoadingIcon from '@/scripts/components/icons/LoadingIcon.vue'
 
 import abilities from '@/scripts/admin/stub/abilities'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseEstimateStatusLabel from '@/scripts/components/base/BaseEstimateStatusLabel.vue'
+import BaseEstimateStatusBadge from '@/scripts/components/base/BaseEstimateStatusBadge.vue'
+import BaseText from '@/scripts/components/base/BaseText.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseRadio from '@/scripts/components/base/BaseRadio.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BasePageHeader from '@/scripts/components/base/BasePageHeader.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
 
 const modalStore = useModalStore()
 const estimateStore = useEstimateStore()

resources/scripts/admin/views/estimates/create/EstimateCreate.vue

@@ -137,17 +137,11 @@
 </template>
 
 <script setup>
-import { computed, ref, watch, onMounted } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { cloneDeep } from 'lodash'
 import { useRoute, useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
-import {
-  required,
-  maxLength,
-  helpers,
-  requiredIf,
-  decimal,
-} from '@vuelidate/validators'
+import { decimal, helpers, maxLength, required, requiredIf } from '@vuelidate/validators'
 import useVuelidate from '@vuelidate/core'
 import { useModuleStore } from '@/scripts/admin/stores/module'
 import { useEstimateStore } from '@/scripts/admin/stores/estimate'
@@ -164,6 +158,13 @@ import SelectTemplateModal from '@/scripts/admin/components/modal-components/Sel
 import TaxTypeModal from '@/scripts/admin/components/modal-components/TaxTypeModal.vue'
 import ItemModal from '@/scripts/admin/components/modal-components/ItemModal.vue'
 import SalesTax from '@/scripts/admin/components/estimate-invoice-common/SalesTax.vue'
+import BaseScrollPane from '@/scripts/components/base/BaseScrollPane.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseBreadcrumbItem from '@/scripts/components/base/BaseBreadcrumbItem.vue'
+import BaseBreadcrumb from '@/scripts/components/base/BaseBreadcrumb.vue'
+import BasePageHeader from '@/scripts/components/base/BasePageHeader.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
 
 const estimateStore = useEstimateStore()
 const moduleStore = useModuleStore()

resources/scripts/admin/views/estimates/create/EstimateCreateBasicFields.vue

@@ -82,6 +82,11 @@
 <script setup>
 import { useEstimateStore } from '@/scripts/admin/stores/estimate'
 import ExchangeRateConverter from '@/scripts/admin/components/estimate-invoice-common/ExchangeRateConverter.vue'
+import BaseInput from '@/scripts/components/base/BaseInput.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseDatePicker from '@/scripts/components/base/BaseDatePicker.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseCustomerSelectPopup from '@/scripts/components/base/BaseCustomerSelectPopup.vue'
 
 const props = defineProps({
   v: {

resources/scripts/admin/views/expenses/Create.vue

@@ -282,17 +282,10 @@
 </template>
 
 <script setup>
-import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
+import { computed, onBeforeUnmount, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
-import {
-  required,
-  minValue,
-  maxLength,
-  helpers,
-  requiredIf,
-  decimal,
-} from '@vuelidate/validators'
+import { decimal, helpers, maxLength, minValue, required, requiredIf } from '@vuelidate/validators'
 import useVuelidate from '@vuelidate/core'
 import { useExpenseStore } from '@/scripts/admin/stores/expense'
 import { useCategoryStore } from '@/scripts/admin/stores/category'
@@ -304,6 +297,21 @@ import ExpenseCustomFields from '@/scripts/admin/components/custom-fields/Create
 import CategoryModal from '@/scripts/admin/components/modal-components/CategoryModal.vue'
 import ExchangeRateConverter from '@/scripts/admin/components/estimate-invoice-common/ExchangeRateConverter.vue'
 import { useGlobalStore } from '@/scripts/admin/stores/global'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseFileUploader from '@/scripts/components/base/BaseFileUploader.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseTextarea from '@/scripts/components/base/BaseTextarea.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseMoney from '@/scripts/components/base/BaseMoney.vue'
+import BaseDatePicker from '@/scripts/components/base/BaseDatePicker.vue'
+import BaseSelectAction from '@/scripts/components/base/BaseSelectAction.vue'
+import BaseInputGrid from '@/scripts/components/base/BaseInputGrid.vue'
+import BaseCard from '@/scripts/components/base/BaseCard.vue'
+import BaseBreadcrumbItem from '@/scripts/components/base/BaseBreadcrumbItem.vue'
+import BaseBreadcrumb from '@/scripts/components/base/BaseBreadcrumb.vue'
+import BasePageHeader from '@/scripts/components/base/BasePageHeader.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
 
 const customerStore = useCustomerStore()
 const companyStore = useCompanyStore()

resources/scripts/admin/views/expenses/Index.vue

@@ -215,7 +215,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, computed, reactive, onUnmounted } from 'vue'
+import { computed, onMounted, onUnmounted, reactive, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useExpenseStore } from '@/scripts/admin/stores/expense'
 import { useCategoryStore } from '@/scripts/admin/stores/category'
@@ -228,6 +228,24 @@ import abilities from '@/scripts/admin/stub/abilities'
 
 import UFOIcon from '@/scripts/components/icons/empty/UFOIcon.vue'
 import ExpenseDropdown from '@/scripts/admin/components/dropdowns/ExpenseIndexDropdown.vue'
+import BaseText from '@/scripts/components/base/BaseText.vue'
+import BaseFormatMoney from '@/scripts/components/base/BaseFormatMoney.vue'
+import BaseCheckbox from '@/scripts/components/base/BaseCheckbox.vue'
+import BaseTable from '@/scripts/components/base/base-table/BaseTable.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseDropdownItem from '@/scripts/components/base/BaseDropdownItem.vue'
+import BaseDropdown from '@/scripts/components/base/BaseDropdown.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseEmptyPlaceholder from '@/scripts/components/base/BaseEmptyPlaceholder.vue'
+import BaseDatePicker from '@/scripts/components/base/BaseDatePicker.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseCustomerSelectInput from '@/scripts/components/base/BaseCustomerSelectInput.vue'
+import BaseFilterWrapper from '@/scripts/components/base/BaseFilterWrapper.vue'
+import BaseBreadcrumbItem from '@/scripts/components/base/BaseBreadcrumbItem.vue'
+import BaseBreadcrumb from '@/scripts/components/base/BaseBreadcrumb.vue'
+import BasePageHeader from '@/scripts/components/base/BasePageHeader.vue'
+import BasePage from '@/scripts/components/base/BasePage.vue'
 
 const companyStore = useCompanyStore()
 const expenseStore = useExpenseStore()

resources/scripts/admin/views/installation/Installation.vue

@@ -31,10 +31,12 @@ import Step7CompanyInfo from './Step7CompanyInfo.vue'
 import Step8CompanyPreferences from './Step8CompanyPreferences.vue'
 import { useInstallationStore } from '@/scripts/admin/stores/installation'
 import { useRouter } from 'vue-router'
+import BaseWizard from '@/scripts/components/base/BaseWizard.vue'
 
 
 export default {
   components: {
+    BaseWizard,
     step_0: Step0SetLanguage,
     step_1: Step1RequirementsCheck,
     step_2: Step2PermissionCheck,

resources/scripts/admin/views/installation/Step0SetLanguage.vue

@@ -40,8 +40,13 @@
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
+import { onMounted, ref } from 'vue'
 import { useInstallationStore } from '@/scripts/admin/stores/installation.js'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseMultiselect from '@/scripts/components/base/base-select/BaseMultiselect.vue'
+import BaseInputGroup from '@/scripts/components/base/BaseInputGroup.vue'
+import BaseWizardStep from '@/scripts/components/base/BaseWizardStep.vue'
 
 const { global } = window.i18n
 

resources/scripts/admin/views/installation/Step1RequirementsCheck.vue

@@ -71,8 +71,11 @@
 </template>
 
 <script setup>
-import { ref, computed, onMounted } from 'vue'
+import { computed, onMounted, ref } from 'vue'
 import { useInstallationStore } from '@/scripts/admin/stores/installation.js'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseWizardStep from '@/scripts/components/base/BaseWizardStep.vue'
 
 const emit = defineEmits(['next'])
 

resources/scripts/admin/views/installation/Step2PermissionCheck.vue

@@ -66,10 +66,16 @@
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
+import { onMounted, ref } from 'vue'
 import { useInstallationStore } from '@/scripts/admin/stores/installation'
 import { useDialogStore } from '@/scripts/stores/dialog'
 import { useI18n } from 'vue-i18n'
+import BaseIcon from '@/scripts/components/base/BaseIcon.vue'
+import BaseButton from '@/scripts/components/base/BaseButton.vue'
+import BaseContentPlaceholdersBox from '@/scripts/components/base/BaseContentPlaceholdersBox.vue'
+import BaseContentPlaceholdersText from '@/scripts/components/base/BaseContentPlaceholdersText.vue'
+import BaseContentPlaceholders from '@/scripts/components/base/BaseContentPlaceholders.vue'
+import BaseWizardStep from '@/scripts/components/base/BaseWizardStep.vue'
 
 const emit = defineEmits(['next'])
 

resources/scripts/admin/views/installation/Step3DatabaseConfig.vue

@@ -15,16 +15,18 @@
 </template>
 
 <script>
-import { ref, computed } from 'vue'
+import { computed, ref } from 'vue'
 import Mysql from './database/MysqlDatabase.vue'
 import Pgsql from './database/PgsqlDatabase.vue'
 import Sqlite from './database/SqliteDatabase.vue'
 import { useNotificationStore } from '@/scripts/stores/notification'
 import { useInstallationStore } from '@/scripts/admin/stores/installation'
 import { useI18n } from 'vue-i18n'
+import BaseWizardStep from '@/scripts/components/base/BaseWizardStep.vue'
 
 export default {
   components: {
+    BaseWizardStep,
     Mysql,
     Pgsql,
     Sqlite,