TheCloneArmy/crater
1
0
Fork 1
mirror of https://github.com/crater-invoice/crater.git synced 2025-10-28 20:21:10 -04:00
Code Issues Packages Projects Releases Wiki Activity

add dark mode in basedropdown

Browse Source
This commit is contained in:
yashkanakiya
2023-03-22 16:16:42 +05:30
parent 15f3f566e3
commit 1f5bb49333
18 changed files with 116 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
resources/scripts/admin/components/dropdowns/CustomFieldIndexDropdown.vue
View File

@ -7,11 +7,12 @@
<!-- edit customField --> <!-- edit customField -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.EDIT_CUSTOM_FIELDS)" v-if="userStore.hasAbilities(abilities.EDIT_CUSTOM_FIELDS)"
v-slot="slotProps"
@click="editCustomField(row.id)" @click="editCustomField(row.id)"
> >
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -19,11 +20,12 @@
<!-- delete customField --> <!-- delete customField -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_CUSTOM_FIELDS)" v-if="userStore.hasAbilities(abilities.DELETE_CUSTOM_FIELDS)"
v-slot="slotProps"
@click="removeCustomField(row.id)" @click="removeCustomField(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

11
resources/scripts/admin/components/dropdowns/CustomerIndexDropdown.vue
View File

@ -12,10 +12,10 @@
v-if="userStore.hasAbilities(abilities.EDIT_CUSTOMER)" v-if="userStore.hasAbilities(abilities.EDIT_CUSTOMER)"
:to="`/admin/customers/${row.id}/edit`" :to="`/admin/customers/${row.id}/edit`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -29,10 +29,10 @@
" "
:to="`customers/${row.id}/view`" :to="`customers/${row.id}/view`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="EyeIcon" name="EyeIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.view') }} {{ $t('general.view') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -41,11 +41,12 @@
<!-- Delete Customer --> <!-- Delete Customer -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_CUSTOMER)" v-if="userStore.hasAbilities(abilities.DELETE_CUSTOMER)"
v-slot="slotProps"
@click="removeCustomer(row.id)" @click="removeCustomer(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

33
resources/scripts/admin/components/dropdowns/EstimateIndexDropdown.vue
View File

@ -10,11 +10,12 @@
<!-- Copy PDF url --> <!-- Copy PDF url -->
<BaseDropdownItem <BaseDropdownItem
v-if="route.name === 'estimates.view'" v-if="route.name === 'estimates.view'"
v-slot="slotProps"
@click="copyPdfUrl" @click="copyPdfUrl"
> >
<BaseIcon <BaseIcon
name="LinkIcon" name="LinkIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.copy_pdf_url') }} {{ $t('general.copy_pdf_url') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -24,10 +25,10 @@
v-if="userStore.hasAbilities(abilities.EDIT_ESTIMATE)" v-if="userStore.hasAbilities(abilities.EDIT_ESTIMATE)"
:to="`/admin/estimates/${row.id}/edit`" :to="`/admin/estimates/${row.id}/edit`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -36,11 +37,12 @@
<!-- Delete Estimate --> <!-- Delete Estimate -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_ESTIMATE)" v-if="userStore.hasAbilities(abilities.DELETE_ESTIMATE)"
v-slot="slotProps"
@click="removeEstimate(row.id)" @click="removeEstimate(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -53,10 +55,10 @@
" "
:to="`estimates/${row.id}/view`" :to="`estimates/${row.id}/view`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="EyeIcon" name="EyeIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.view') }} {{ $t('general.view') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -65,11 +67,12 @@
<!-- Convert into Invoice --> <!-- Convert into Invoice -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.CREATE_INVOICE)" v-if="userStore.hasAbilities(abilities.CREATE_INVOICE)"
v-slot="slotProps"
@click="convertInToinvoice(row.id)" @click="convertInToinvoice(row.id)"
> >
<BaseIcon <BaseIcon
name="DocumentTextIcon" name="DocumentTextIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('estimates.convert_to_invoice') }} {{ $t('estimates.convert_to_invoice') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -81,11 +84,12 @@
route.name !== 'estimates.view' && route.name !== 'estimates.view' &&
userStore.hasAbilities(abilities.SEND_ESTIMATE) userStore.hasAbilities(abilities.SEND_ESTIMATE)
" "
v-slot="slotProps"
@click="onMarkAsSent(row.id)" @click="onMarkAsSent(row.id)"
> >
<BaseIcon <BaseIcon
name="CheckCircleIcon" name="CheckCircleIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('estimates.mark_as_sent') }} {{ $t('estimates.mark_as_sent') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -97,20 +101,21 @@
route.name !== 'estimates.view' && route.name !== 'estimates.view' &&
userStore.hasAbilities(abilities.SEND_ESTIMATE) userStore.hasAbilities(abilities.SEND_ESTIMATE)
" "
v-slot="slotProps"
@click="sendEstimate(row)" @click="sendEstimate(row)"
> >
<BaseIcon <BaseIcon
name="PaperAirplaneIcon" name="PaperAirplaneIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('estimates.send_estimate') }} {{ $t('estimates.send_estimate') }}
</BaseDropdownItem> </BaseDropdownItem>
<!-- Resend Estimate --> <!-- Resend Estimate -->
<BaseDropdownItem v-if="canResendEstimate(row)" @click="sendEstimate(row)"> <BaseDropdownItem v-if="canResendEstimate(row)" v-slot="slotProps" @click="sendEstimate(row)">
<BaseIcon <BaseIcon
name="PaperAirplaneIcon" name="PaperAirplaneIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('estimates.resend_estimate') }} {{ $t('estimates.resend_estimate') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -121,11 +126,12 @@
row.status !== 'ACCEPTED' && row.status !== 'ACCEPTED' &&
userStore.hasAbilities(abilities.EDIT_ESTIMATE) userStore.hasAbilities(abilities.EDIT_ESTIMATE)
" "
v-slot="slotProps"
@click="onMarkAsAccepted(row.id)" @click="onMarkAsAccepted(row.id)"
> >
<BaseIcon <BaseIcon
name="CheckCircleIcon" name="CheckCircleIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('estimates.mark_as_accepted') }} {{ $t('estimates.mark_as_accepted') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -136,11 +142,12 @@
row.status !== 'REJECTED' && row.status !== 'REJECTED' &&
userStore.hasAbilities(abilities.EDIT_ESTIMATE) userStore.hasAbilities(abilities.EDIT_ESTIMATE)
" "
v-slot="slotProps"
@click="onMarkAsRejected(row.id)" @click="onMarkAsRejected(row.id)"
> >
<BaseIcon <BaseIcon
name="XCircleIcon" name="XCircleIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('estimates.mark_as_rejected') }} {{ $t('estimates.mark_as_rejected') }}
</BaseDropdownItem> </BaseDropdownItem>

6
resources/scripts/admin/components/dropdowns/ExpenseCategoryIndexDropdown.vue
View File

@ -13,11 +13,12 @@
<!-- edit expenseCategory --> <!-- edit expenseCategory -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.EDIT_EXPENSE)" v-if="userStore.hasAbilities(abilities.EDIT_EXPENSE)"
v-slot="slotProps"
@click="editExpenseCategory(row.id)" @click="editExpenseCategory(row.id)"
> >
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -25,11 +26,12 @@
<!-- delete expenseCategory --> <!-- delete expenseCategory -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_EXPENSE)" v-if="userStore.hasAbilities(abilities.DELETE_EXPENSE)"
v-slot="slotProps"
@click="removeExpenseCategory(row.id)" @click="removeExpenseCategory(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

7
resources/scripts/admin/components/dropdowns/ExpenseIndexDropdown.vue
View File

@ -12,10 +12,10 @@
v-if="userStore.hasAbilities(abilities.EDIT_EXPENSE)" v-if="userStore.hasAbilities(abilities.EDIT_EXPENSE)"
:to="`/admin/expenses/${row.id}/edit`" :to="`/admin/expenses/${row.id}/edit`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -24,11 +24,12 @@
<!-- delete expense --> <!-- delete expense -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_EXPENSE)" v-if="userStore.hasAbilities(abilities.DELETE_EXPENSE)"
v-slot="slotProps"
@click="removeExpense(row.id)" @click="removeExpense(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

32
resources/scripts/admin/components/dropdowns/InvoiceIndexDropdown.vue
View File

@ -12,20 +12,20 @@
v-if="userStore.hasAbilities(abilities.EDIT_INVOICE)" v-if="userStore.hasAbilities(abilities.EDIT_INVOICE)"
:to="`/admin/invoices/${row.id}/edit`" :to="`/admin/invoices/${row.id}/edit`"
> >
<BaseDropdownItem v-show="row.allow_edit"> <BaseDropdownItem v-show="row.allow_edit" v-slot="slotProps">
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
</router-link> </router-link>
<!-- Copy PDF url --> <!-- Copy PDF url -->
<BaseDropdownItem v-if="route.name === 'invoices.view'" @click="copyPdfUrl"> <BaseDropdownItem v-if="route.name === 'invoices.view'" v-slot="slotProps" @click="copyPdfUrl">
<BaseIcon <BaseIcon
name="LinkIcon" name="LinkIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.copy_pdf_url') }} {{ $t('general.copy_pdf_url') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -38,29 +38,29 @@
" "
:to="`/admin/invoices/${row.id}/view`" :to="`/admin/invoices/${row.id}/view`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="EyeIcon" name="EyeIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.view') }} {{ $t('general.view') }}
</BaseDropdownItem> </BaseDropdownItem>
</router-link> </router-link>
<!-- Send Invoice Mail --> <!-- Send Invoice Mail -->
<BaseDropdownItem v-if="canSendInvoice(row)" @click="sendInvoice(row)"> <BaseDropdownItem v-if="canSendInvoice(row)" v-slot="slotProps" @click="sendInvoice(row)">
<BaseIcon <BaseIcon
name="PaperAirplaneIcon" name="PaperAirplaneIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('invoices.send_invoice') }} {{ $t('invoices.send_invoice') }}
</BaseDropdownItem> </BaseDropdownItem>
<!-- Resend Invoice --> <!-- Resend Invoice -->
<BaseDropdownItem v-if="canReSendInvoice(row)" @click="sendInvoice(row)"> <BaseDropdownItem v-if="canReSendInvoice(row)" v-slot="slotProps" @click="sendInvoice(row)">
<BaseIcon <BaseIcon
name="PaperAirplaneIcon" name="PaperAirplaneIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('invoices.resend_invoice') }} {{ $t('invoices.resend_invoice') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -72,17 +72,17 @@
> >
<BaseIcon <BaseIcon
name="CreditCardIcon" name="CreditCardIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('invoices.record_payment') }} {{ $t('invoices.record_payment') }}
</BaseDropdownItem> </BaseDropdownItem>
</router-link> </router-link>
<!-- Mark as sent Invoice --> <!-- Mark as sent Invoice -->
<BaseDropdownItem v-if="canSendInvoice(row)" @click="onMarkAsSent(row.id)"> <BaseDropdownItem v-if="canSendInvoice(row)" v-slot="slotProps" @click="onMarkAsSent(row.id)">
<BaseIcon <BaseIcon
name="CheckCircleIcon" name="CheckCircleIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('invoices.mark_as_sent') }} {{ $t('invoices.mark_as_sent') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -90,11 +90,12 @@
<!-- Clone Invoice into new invoice --> <!-- Clone Invoice into new invoice -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.CREATE_INVOICE)" v-if="userStore.hasAbilities(abilities.CREATE_INVOICE)"
v-slot="slotProps"
@click="cloneInvoiceData(row)" @click="cloneInvoiceData(row)"
> >
<BaseIcon <BaseIcon
name="DocumentTextIcon" name="DocumentTextIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('invoices.clone_invoice') }} {{ $t('invoices.clone_invoice') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -102,11 +103,12 @@
<!-- Delete Invoice --> <!-- Delete Invoice -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_INVOICE)" v-if="userStore.hasAbilities(abilities.DELETE_INVOICE)"
v-slot="slotProps"
@click="removeInvoice(row.id)" @click="removeInvoice(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

13
resources/scripts/admin/components/dropdowns/ItemIndexDropdown.vue
View File

@ -12,11 +12,8 @@
v-if="userStore.hasAbilities(abilities.EDIT_ITEM)" v-if="userStore.hasAbilities(abilities.EDIT_ITEM)"
:to="`/admin/items/${row.id}/edit`" :to="`/admin/items/${row.id}/edit`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon name="PencilIcon" :class="slotProps.class" />
name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500"
/>
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
</router-link> </router-link>
@ -24,12 +21,10 @@
<!-- delete item --> <!-- delete item -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_ITEM)" v-if="userStore.hasAbilities(abilities.DELETE_ITEM)"
v-slot="slotProps"
@click="removeItem(row.id)" @click="removeItem(row.id)"
> >
<BaseIcon <BaseIcon name="TrashIcon" :class="slotProps.class" />
name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500"
/>
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>
</BaseDropdown> </BaseDropdown>

6
resources/scripts/admin/components/dropdowns/NoteIndexDropdown.vue
View File

@ -10,11 +10,12 @@
<!-- edit note --> <!-- edit note -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.MANAGE_NOTE)" v-if="userStore.hasAbilities(abilities.MANAGE_NOTE)"
v-slot="slotProps"
@click="editNote(row.id)" @click="editNote(row.id)"
> >
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -22,11 +23,12 @@
<!-- delete note --> <!-- delete note -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.MANAGE_NOTE)" v-if="userStore.hasAbilities(abilities.MANAGE_NOTE)"
v-slot="slotProps"
@click="removeNote(row.id)" @click="removeNote(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

21
resources/scripts/admin/components/dropdowns/PaymentIndexDropdown.vue
View File

@ -8,30 +8,31 @@
</template> </template>
<!-- Copy pdf url --> <!-- Copy pdf url -->
<BaseDropdown-item <BaseDropdownItem
v-if=" v-if="
route.name === 'payments.view' && route.name === 'payments.view' &&
userStore.hasAbilities(abilities.VIEW_PAYMENT) userStore.hasAbilities(abilities.VIEW_PAYMENT)
" "
v-slot="slotProps"
class="rounded-md" class="rounded-md"
@click="copyPdfUrl" @click="copyPdfUrl"
> >
<BaseIcon <BaseIcon
name="LinkIcon" name="LinkIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.copy_pdf_url') }} {{ $t('general.copy_pdf_url') }}
</BaseDropdown-item> </BaseDropdownItem>
<!-- edit payment --> <!-- edit payment -->
<router-link <router-link
v-if="userStore.hasAbilities(abilities.EDIT_PAYMENT)" v-if="userStore.hasAbilities(abilities.EDIT_PAYMENT)"
:to="`/admin/payments/${row.id}/edit`" :to="`/admin/payments/${row.id}/edit`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -45,10 +46,10 @@
" "
:to="`/admin/payments/${row.id}/view`" :to="`/admin/payments/${row.id}/view`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="EyeIcon" name="EyeIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.view') }} {{ $t('general.view') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -61,11 +62,12 @@
route.name !== 'payments.view' && route.name !== 'payments.view' &&
userStore.hasAbilities(abilities.SEND_PAYMENT) userStore.hasAbilities(abilities.SEND_PAYMENT)
" "
v-slot="slotProps"
@click="sendPayment(row)" @click="sendPayment(row)"
> >
<BaseIcon <BaseIcon
name="PaperAirplaneIcon" name="PaperAirplaneIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('payments.send_payment') }} {{ $t('payments.send_payment') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -73,11 +75,12 @@
<!-- delete payment --> <!-- delete payment -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_PAYMENT)" v-if="userStore.hasAbilities(abilities.DELETE_PAYMENT)"
v-slot="slotProps"
@click="removePayment(row.id)" @click="removePayment(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

8
resources/scripts/admin/components/dropdowns/PaymentModeIndexDropdown.vue
View File

@ -8,19 +8,19 @@
</template> </template>
<!-- edit paymentMode --> <!-- edit paymentMode -->
<BaseDropdownItem @click="editPaymentMode(row.id)"> <BaseDropdownItem v-slot="slotProps" @click="editPaymentMode(row.id)">
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
<!-- delete paymentMode --> <!-- delete paymentMode -->
<BaseDropdownItem @click="removePaymentMode(row.id)"> <BaseDropdownItem v-slot="slotProps" @click="removePaymentMode(row.id)">
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

11
resources/scripts/admin/components/dropdowns/RecurringInvoiceIndexDropdown.vue
View File

@ -15,10 +15,10 @@
v-if="userStore.hasAbilities(abilities.EDIT_RECURRING_INVOICE)" v-if="userStore.hasAbilities(abilities.EDIT_RECURRING_INVOICE)"
:to="`/admin/recurring-invoices/${row.id}/edit`" :to="`/admin/recurring-invoices/${row.id}/edit`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -32,10 +32,10 @@
" "
:to="`recurring-invoices/${row.id}/view`" :to="`recurring-invoices/${row.id}/view`"
> >
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="EyeIcon" name="EyeIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.view') }} {{ $t('general.view') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -44,11 +44,12 @@
<!-- Delete Recurring Invoice --> <!-- Delete Recurring Invoice -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_RECURRING_INVOICE)" v-if="userStore.hasAbilities(abilities.DELETE_RECURRING_INVOICE)"
v-slot="slotProps"
@click="removeMultipleRecurringInvoices(row.id)" @click="removeMultipleRecurringInvoices(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

6
resources/scripts/admin/components/dropdowns/RoleIndexDropdown.vue
View File

@ -10,11 +10,12 @@
<!-- edit role --> <!-- edit role -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.currentUser.is_owner" v-if="userStore.currentUser.is_owner"
v-slot="slotProps"
@click="editRole(row.id)" @click="editRole(row.id)"
> >
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -22,11 +23,12 @@
<!-- delete role --> <!-- delete role -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.currentUser.is_owner" v-if="userStore.currentUser.is_owner"
v-slot="slotProps"
@click="removeRole(row.id)" @click="removeRole(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

6
resources/scripts/admin/components/dropdowns/TaxTypeIndexDropdown.vue
View File

@ -10,11 +10,12 @@
<!-- edit tax-type --> <!-- edit tax-type -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.EDIT_TAX_TYPE)" v-if="userStore.hasAbilities(abilities.EDIT_TAX_TYPE)"
v-slot="slotProps"
@click="editTaxType(row.id)" @click="editTaxType(row.id)"
> >
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
@ -22,11 +23,12 @@
<!-- delete tax-type --> <!-- delete tax-type -->
<BaseDropdownItem <BaseDropdownItem
v-if="userStore.hasAbilities(abilities.DELETE_TAX_TYPE)" v-if="userStore.hasAbilities(abilities.DELETE_TAX_TYPE)"
v-slot="slotProps"
@click="removeTaxType(row.id)" @click="removeTaxType(row.id)"
> >
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

8
resources/scripts/admin/components/dropdowns/UserIndexDropdown.vue
View File

@ -9,20 +9,20 @@
<!-- edit user --> <!-- edit user -->
<router-link :to="`/admin/users/${row.id}/edit`"> <router-link :to="`/admin/users/${row.id}/edit`">
<BaseDropdownItem> <BaseDropdownItem v-slot="slotProps">
<BaseIcon <BaseIcon
name="PencilIcon" name="PencilIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
</router-link> </router-link>
<!-- delete user --> <!-- delete user -->
<BaseDropdownItem @click="removeUser(row.id)"> <BaseDropdownItem v-slot="slotProps" @click="removeUser(row.id)">
<BaseIcon <BaseIcon
name="TrashIcon" name="TrashIcon"
class="w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500" :class="slotProps.class"
/> />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>

8
resources/scripts/admin/views/settings/BackupSetting.vue
View File

@ -51,14 +51,14 @@
</div> </div>
</template> </template>
<BaseDropdownItem @click="onDownloadBckup(row.data)"> <BaseDropdownItem v-slot="slotProps" @click="onDownloadBckup(row.data)">
<BaseIcon name="CloudDownloadIcon" class="mr-3 text-gray-600" /> <BaseIcon name="CloudDownloadIcon" :class="slotProps.class" />
{{ $t('general.download') }} {{ $t('general.download') }}
</BaseDropdownItem> </BaseDropdownItem>
<BaseDropdownItem @click="onRemoveBackup(row.data)"> <BaseDropdownItem v-slot="slotProps" @click="onRemoveBackup(row.data)">
<BaseIcon name="TrashIcon" class="mr-3 text-gray-600" /> <BaseIcon name="TrashIcon" :class="slotProps.class" />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>
</BaseDropdown> </BaseDropdown>

9
resources/scripts/admin/views/settings/FileDiskSetting.vue
View File

@ -45,27 +45,30 @@
<BaseDropdownItem <BaseDropdownItem
v-if="!row.data.set_as_default" v-if="!row.data.set_as_default"
v-slot="slotProps"
@click="setDefaultDiskData(row.data.id)" @click="setDefaultDiskData(row.data.id)"
> >
<BaseIcon class="mr-3 tetx-gray-600" name="CheckCircleIcon" /> <BaseIcon :class="slotProps.class" name="CheckCircleIcon" />
{{ $t('settings.disk.set_default_disk') }} {{ $t('settings.disk.set_default_disk') }}
</BaseDropdownItem> </BaseDropdownItem>
<BaseDropdownItem <BaseDropdownItem
v-if="row.data.type !== 'SYSTEM'" v-if="row.data.type !== 'SYSTEM'"
v-slot="slotProps"
@click="openEditDiskModal(row.data)" @click="openEditDiskModal(row.data)"
> >
<BaseIcon name="PencilIcon" class="mr-3 text-gray-600" /> <BaseIcon name="PencilIcon" :class="slotProps.class" />
{{ $t('general.edit') }} {{ $t('general.edit') }}
</BaseDropdownItem> </BaseDropdownItem>
<BaseDropdownItem <BaseDropdownItem
v-if="row.data.type !== 'SYSTEM' && !row.data.set_as_default" v-if="row.data.type !== 'SYSTEM' && !row.data.set_as_default"
v-slot="slotProps"
@click="removeDisk(row.data.id)" @click="removeDisk(row.data.id)"
> >
<BaseIcon name="TrashIcon" class="mr-3 text-gray-600" /> <BaseIcon name="TrashIcon" :class="slotProps.class" />
{{ $t('general.delete') }} {{ $t('general.delete') }}
</BaseDropdownItem> </BaseDropdownItem>
</BaseDropdown> </BaseDropdown>

3
resources/scripts/components/base/BaseDropdown.vue
View File

@ -69,7 +69,8 @@ const props = defineProps({
}) })
const containerClasses = computed(() => { const containerClasses = computed(() => {
const baseClass = `origin-top-right rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 divide-y divide-gray-100 focus:outline-none` const baseClass = `dark:border dark:border-white/10 dark:text-white dark:bg-gray-800 dark:shadow-glass
origin-top-right rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 divide-y divide-gray-100 focus:outline-none`
return `${baseClass} ${props.containerClass}` return `${baseClass} ${props.containerClass}`
}) })

11
resources/scripts/components/base/BaseDropdownItem.vue
View File

@ -2,16 +2,19 @@
<MenuItem v-slot="{ active }" v-bind="$attrs"> <MenuItem v-slot="{ active }" v-bind="$attrs">
<a <a
href="#" href="#"
:class="[ class="group flex items-center px-4 py-2 text-sm font-normal" :class="[
active ? 'bg-gray-100 text-gray-900' : 'text-gray-700', active
'group flex items-center px-4 py-2 text-sm font-normal', ? 'bg-gray-100 text-gray-900 dark:text-white dark:bg-gray-700'
: 'text-gray-700 dark:text-gray-200',
]" ]"
> >
<slot :active="active" /> <slot :active="active" :class="defaultIconClass" />
</a> </a>
</MenuItem> </MenuItem>
</template> </template>
<script setup> <script setup>
import { MenuItem } from '@headlessui/vue' import { MenuItem } from '@headlessui/vue'
const defaultIconClass
= 'w-5 h-5 mr-3 text-gray-400 group-hover:text-gray-500 dark:text-gray-400 dark:group-hover:text-white'
</script> </script>