refactor(frontend): comprehensive split of large view files into modular components
- Split UsersView.vue into UserCreateModal, UserEditModal, UserApiKeysModal, etc.
- Split UsageView.vue into UsageStatsCards, UsageFilters, UsageTable, etc.
- Split DashboardView.vue into UserDashboardStats, UserDashboardCharts, etc.
- Split AccountsView.vue into AccountTableActions, AccountTableFilters, etc.
- Standardized TypeScript types across new components to resolve implicit 'any' and 'never[]' errors.
- Improved overall frontend maintainability and code clarity.
2026-01-04 22:17:27 +08:00
|
|
|
<template>
|
2026-04-27 18:12:24 +08:00
|
|
|
<div class="mb-4 flex items-center justify-between rounded-lg bg-primary-50 p-3 dark:bg-primary-900/20">
|
2026-01-09 18:58:06 +08:00
|
|
|
<div class="flex flex-wrap items-center gap-2">
|
2026-04-27 18:12:24 +08:00
|
|
|
<span v-if="selectedIds.length > 0" class="text-sm font-medium text-primary-900 dark:text-primary-100">
|
2026-01-09 18:58:06 +08:00
|
|
|
{{ t('admin.accounts.bulkActions.selected', { count: selectedIds.length }) }}
|
|
|
|
|
</span>
|
2026-04-27 18:12:24 +08:00
|
|
|
<span v-else class="text-sm font-medium text-primary-900 dark:text-primary-100">
|
|
|
|
|
{{ t('admin.accounts.bulkEdit.title') }}
|
|
|
|
|
</span>
|
|
|
|
|
<template v-if="selectedIds.length > 0">
|
2026-01-09 18:58:06 +08:00
|
|
|
<button
|
|
|
|
|
@click="$emit('select-page')"
|
|
|
|
|
class="text-xs font-medium text-primary-700 hover:text-primary-800 dark:text-primary-300 dark:hover:text-primary-200"
|
|
|
|
|
>
|
|
|
|
|
{{ t('admin.accounts.bulkActions.selectCurrentPage') }}
|
|
|
|
|
</button>
|
|
|
|
|
<span class="text-gray-300 dark:text-primary-800">•</span>
|
|
|
|
|
<button
|
|
|
|
|
@click="$emit('clear')"
|
|
|
|
|
class="text-xs font-medium text-primary-700 hover:text-primary-800 dark:text-primary-300 dark:hover:text-primary-200"
|
|
|
|
|
>
|
|
|
|
|
{{ t('admin.accounts.bulkActions.clear') }}
|
|
|
|
|
</button>
|
2026-04-27 18:12:24 +08:00
|
|
|
</template>
|
2026-01-09 18:58:06 +08:00
|
|
|
</div>
|
refactor(frontend): comprehensive split of large view files into modular components
- Split UsersView.vue into UserCreateModal, UserEditModal, UserApiKeysModal, etc.
- Split UsageView.vue into UsageStatsCards, UsageFilters, UsageTable, etc.
- Split DashboardView.vue into UserDashboardStats, UserDashboardCharts, etc.
- Split AccountsView.vue into AccountTableActions, AccountTableFilters, etc.
- Standardized TypeScript types across new components to resolve implicit 'any' and 'never[]' errors.
- Improved overall frontend maintainability and code clarity.
2026-01-04 22:17:27 +08:00
|
|
|
<div class="flex gap-2">
|
2026-04-27 18:12:24 +08:00
|
|
|
<template v-if="selectedIds.length > 0">
|
|
|
|
|
<button @click="$emit('delete')" class="btn btn-danger btn-sm">{{ t('admin.accounts.bulkActions.delete') }}</button>
|
|
|
|
|
<button @click="$emit('reset-status')" class="btn btn-secondary btn-sm">{{ t('admin.accounts.bulkActions.resetStatus') }}</button>
|
|
|
|
|
<button @click="$emit('refresh-token')" class="btn btn-secondary btn-sm">{{ t('admin.accounts.bulkActions.refreshToken') }}</button>
|
|
|
|
|
<button @click="$emit('toggle-schedulable', true)" class="btn btn-success btn-sm">{{ t('admin.accounts.bulkActions.enableScheduling') }}</button>
|
|
|
|
|
<button @click="$emit('toggle-schedulable', false)" class="btn btn-warning btn-sm">{{ t('admin.accounts.bulkActions.disableScheduling') }}</button>
|
|
|
|
|
<button @click="$emit('edit-selected')" class="btn btn-primary btn-sm">{{ t('admin.accounts.bulkActions.edit') }}</button>
|
|
|
|
|
</template>
|
|
|
|
|
<button @click="$emit('edit-filtered')" class="btn btn-primary btn-sm">
|
|
|
|
|
{{ t('admin.accounts.bulkEdit.submit') }}
|
|
|
|
|
</button>
|
refactor(frontend): comprehensive split of large view files into modular components
- Split UsersView.vue into UserCreateModal, UserEditModal, UserApiKeysModal, etc.
- Split UsageView.vue into UsageStatsCards, UsageFilters, UsageTable, etc.
- Split DashboardView.vue into UserDashboardStats, UserDashboardCharts, etc.
- Split AccountsView.vue into AccountTableActions, AccountTableFilters, etc.
- Standardized TypeScript types across new components to resolve implicit 'any' and 'never[]' errors.
- Improved overall frontend maintainability and code clarity.
2026-01-04 22:17:27 +08:00
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
|
|
import { useI18n } from 'vue-i18n'
|
2026-04-27 18:12:24 +08:00
|
|
|
defineProps(['selectedIds']); defineEmits(['delete', 'edit-selected', 'edit-filtered', 'clear', 'select-page', 'toggle-schedulable', 'reset-status', 'refresh-token']); const { t } = useI18n()
|
2026-03-09 17:47:30 +08:00
|
|
|
</script>
|