Button loading re-factoring..
This commit is contained in:
@@ -264,8 +264,9 @@
|
||||
class="flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
|
||||
override="class"
|
||||
>
|
||||
<span>{{ trans('reconciliations.save_draft') }}</span>
|
||||
<x-button.loading v-if="form.loading" text="{{ trans('reconciliations.save_draft') }}" text-hide="[{'opacity-0': form.loading}]" />
|
||||
<x-button.loading>
|
||||
{{ trans('reconciliations.save_draft') }}
|
||||
</x-button.loading>
|
||||
</x-button>
|
||||
|
||||
<div v-if="reconcile">
|
||||
@@ -278,8 +279,9 @@
|
||||
@click="onReconcileSubmit"
|
||||
data-loading-text="{{ trans('general.loading') }}"
|
||||
>
|
||||
<span>{{ trans('reconciliations.reconcile') }}</span>
|
||||
<x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
|
||||
<x-button.loading action="! reconcile">
|
||||
{{ trans('reconciliations.reconcile') }}
|
||||
</x-button.loading>
|
||||
</x-button>
|
||||
</x-tooltip>
|
||||
</div>
|
||||
@@ -292,8 +294,9 @@
|
||||
@click="onReconcileSubmit"
|
||||
data-loading-text="{{ trans('general.loading') }}"
|
||||
>
|
||||
<span>{{ trans('reconciliations.reconcile') }}</span>
|
||||
<x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
|
||||
<x-button.loading action="! reconcile">
|
||||
{{ trans('reconciliations.reconcile') }}
|
||||
</x-button.loading>
|
||||
</x-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -203,9 +203,11 @@
|
||||
class="relative flex items-center justify-center bg-transparent hover:bg-gray-200 px-3 py-1.5 text-base rounded-lg disabled:opacity-50"
|
||||
override="class"
|
||||
>
|
||||
<span>{{ trans('general.save') }}</span>
|
||||
<x-button.loading v-if="form.loading" text="{{ trans('general.save') }}" text-hide="[{'opacity-1': reconcile}]" />
|
||||
<x-button.loading>
|
||||
{{ trans('general.save') }}
|
||||
</x-button.loading>
|
||||
</x-button>
|
||||
|
||||
<div v-if="reconcile">
|
||||
<x-tooltip id="tooltip-reconcile" placement="top" message="{{ trans('reconciliations.irreconcilable') }}">
|
||||
<x-button
|
||||
@@ -216,11 +218,13 @@
|
||||
@click="onReconcileSubmit"
|
||||
data-loading-text="{{ trans('general.loading') }}"
|
||||
>
|
||||
<span>{{ trans('reconciliations.reconcile') }}</span>
|
||||
<x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
|
||||
<x-button.loading action="! reconcile">
|
||||
{{ trans('reconciliations.reconcile') }}
|
||||
</x-button.loading>
|
||||
</x-button>
|
||||
</x-tooltip>
|
||||
</div>
|
||||
|
||||
<div v-else>
|
||||
<x-button
|
||||
type="button"
|
||||
@@ -230,8 +234,9 @@
|
||||
@click="onReconcileSubmit"
|
||||
data-loading-text="{{ trans('general.loading') }}"
|
||||
>
|
||||
<span>{{ trans('reconciliations.reconcile') }}"</span>
|
||||
<x-button.loading v-if="form.loading" text="{{ trans('reconciliations.reconcile') }}" text-hide="[{'opacity-1': reconcile}]" />
|
||||
<x-button.loading action="! reconcile">
|
||||
{{ trans('reconciliations.reconcile') }}
|
||||
</x-button.loading>
|
||||
</x-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -40,9 +40,10 @@
|
||||
{{ trans('general.cancel') }}
|
||||
</button>
|
||||
|
||||
<button :disabled="form.loading" 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" @click="addTemplate">
|
||||
<span>{{ trans('general.confirm') }}</span>
|
||||
<x-button.loading v-if="form.loading" text="{{ trans('general.confirm') }}" text-hide="[{'opacity-0': form.loading}]" />
|
||||
<button :disabled="form.loading" 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" @click="addTemplate">
|
||||
<x-button.loading>
|
||||
{{ trans('general.confirm') }}
|
||||
</x-button.loading>
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user