adminforth 2.27.0-next.8 → 2.27.0-test.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/commands/callTsProxy.js +10 -5
- package/commands/proxy.ts +18 -10
- package/dist/commands/proxy.js +14 -10
- package/dist/commands/proxy.js.map +1 -1
- package/dist/dataConnectors/baseConnector.d.ts.map +1 -1
- package/dist/dataConnectors/baseConnector.js +8 -1
- package/dist/dataConnectors/baseConnector.js.map +1 -1
- package/dist/dataConnectors/clickhouse.js +1 -1
- package/dist/dataConnectors/clickhouse.js.map +1 -1
- package/dist/dataConnectors/mysql.js +1 -1
- package/dist/dataConnectors/mysql.js.map +1 -1
- package/dist/dataConnectors/sqlite.d.ts.map +1 -1
- package/dist/dataConnectors/sqlite.js +2 -0
- package/dist/dataConnectors/sqlite.js.map +1 -1
- package/dist/modules/configValidator.d.ts.map +1 -1
- package/dist/modules/configValidator.js +16 -9
- package/dist/modules/configValidator.js.map +1 -1
- package/dist/modules/restApi.d.ts.map +1 -1
- package/dist/modules/restApi.js +77 -4
- package/dist/modules/restApi.js.map +1 -1
- package/dist/modules/styles.js +1 -1
- package/dist/spa/package-lock.json +41 -0
- package/dist/spa/package.json +3 -0
- package/dist/spa/pnpm-lock.yaml +38 -0
- package/dist/spa/src/afcl/Select.vue +5 -1
- package/dist/spa/src/components/CallActionWrapper.vue +1 -1
- package/dist/spa/src/components/ColumnValueInput.vue +16 -3
- package/dist/spa/src/components/ColumnValueInputWrapper.vue +25 -2
- package/dist/spa/src/components/Filters.vue +23 -2
- package/dist/spa/src/components/GroupsTable.vue +9 -6
- package/dist/spa/src/components/ResourceForm.vue +100 -6
- package/dist/spa/src/components/ResourceListTable.vue +15 -2
- package/dist/spa/src/components/ShowTable.vue +1 -1
- package/dist/spa/src/components/ThreeDotsMenu.vue +20 -3
- package/dist/spa/src/types/Back.ts +16 -1
- package/dist/spa/src/types/Common.ts +19 -4
- package/dist/spa/src/utils/createEditUtils.ts +65 -0
- package/dist/spa/src/utils/index.ts +2 -1
- package/dist/spa/src/utils/utils.ts +38 -5
- package/dist/spa/src/utils.ts +2 -1
- package/dist/spa/src/views/CreateView.vue +22 -49
- package/dist/spa/src/views/EditView.vue +20 -38
- package/dist/spa/src/views/ListView.vue +9 -2
- package/dist/spa/src/views/ShowView.vue +62 -12
- package/dist/spa/tsconfig.app.json +1 -0
- package/dist/types/Back.d.ts +16 -1
- package/dist/types/Back.d.ts.map +1 -1
- package/dist/types/Back.js.map +1 -1
- package/dist/types/Common.d.ts +24 -4
- package/dist/types/Common.d.ts.map +1 -1
- package/dist/types/Common.js.map +1 -1
- package/package.json +4 -3
|
@@ -8,7 +8,7 @@ import { Dropdown } from 'flowbite';
|
|
|
8
8
|
import adminforth, { useAdminforth } from '../adminforth';
|
|
9
9
|
import sanitizeHtml from 'sanitize-html'
|
|
10
10
|
import debounce from 'debounce';
|
|
11
|
-
import type { AdminForthResourceColumnInputCommon, Predicate } from '@/types/Common';
|
|
11
|
+
import type { AdminForthActionFront, AdminForthResourceColumnInputCommon, AdminForthResourceCommon, Predicate } from '@/types/Common';
|
|
12
12
|
import { i18nInstance } from '../i18n'
|
|
13
13
|
import { useI18n } from 'vue-i18n';
|
|
14
14
|
import { onBeforeRouteLeave } from 'vue-router';
|
|
@@ -193,7 +193,8 @@ export function applyRegexValidation(value: any, validation: ValidationObject[]
|
|
|
193
193
|
if ( validation?.length ) {
|
|
194
194
|
const validationArray = validation;
|
|
195
195
|
for (let i = 0; i < validationArray.length; i++) {
|
|
196
|
-
|
|
196
|
+
const regExpPattern = validationArray[i].regExp;
|
|
197
|
+
if (regExpPattern) {
|
|
197
198
|
let flags = '';
|
|
198
199
|
if (validationArray[i].caseSensitive) {
|
|
199
200
|
flags += 'i';
|
|
@@ -205,7 +206,7 @@ export function applyRegexValidation(value: any, validation: ValidationObject[]
|
|
|
205
206
|
flags += 'g';
|
|
206
207
|
}
|
|
207
208
|
|
|
208
|
-
const regExp = new RegExp(
|
|
209
|
+
const regExp = new RegExp(regExpPattern, flags);
|
|
209
210
|
if (value === undefined || value === null) {
|
|
210
211
|
value = '';
|
|
211
212
|
}
|
|
@@ -768,6 +769,7 @@ export async function executeCustomBulkAction({
|
|
|
768
769
|
onError,
|
|
769
770
|
setLoadingState,
|
|
770
771
|
confirmMessage,
|
|
772
|
+
resource,
|
|
771
773
|
}: {
|
|
772
774
|
actionId: string | number | undefined,
|
|
773
775
|
resourceId: string,
|
|
@@ -777,6 +779,7 @@ export async function executeCustomBulkAction({
|
|
|
777
779
|
onError?: (error: string) => void,
|
|
778
780
|
setLoadingState?: (loading: boolean) => void,
|
|
779
781
|
confirmMessage?: string,
|
|
782
|
+
resource?: AdminForthResourceCommon,
|
|
780
783
|
}): Promise<any> {
|
|
781
784
|
if (!recordIds || recordIds.length === 0) {
|
|
782
785
|
if (onError) {
|
|
@@ -798,7 +801,38 @@ export async function executeCustomBulkAction({
|
|
|
798
801
|
setLoadingState?.(true);
|
|
799
802
|
|
|
800
803
|
try {
|
|
801
|
-
|
|
804
|
+
const action = resource?.options?.actions?.find((a: any) => a.id === actionId) as AdminForthActionFront | undefined;
|
|
805
|
+
|
|
806
|
+
if (action?.hasBulkHandler && action?.showIn?.bulkButton) {
|
|
807
|
+
const result = await callAdminForthApi({
|
|
808
|
+
path: '/start_custom_bulk_action',
|
|
809
|
+
method: 'POST',
|
|
810
|
+
body: {
|
|
811
|
+
resourceId,
|
|
812
|
+
actionId,
|
|
813
|
+
recordIds,
|
|
814
|
+
extra: extra || {},
|
|
815
|
+
}
|
|
816
|
+
});
|
|
817
|
+
|
|
818
|
+
if (result?.ok) {
|
|
819
|
+
if (onSuccess) {
|
|
820
|
+
await onSuccess([result]);
|
|
821
|
+
}
|
|
822
|
+
return { ok: true, results: [result] };
|
|
823
|
+
}
|
|
824
|
+
|
|
825
|
+
if (result?.error) {
|
|
826
|
+
if (onError) {
|
|
827
|
+
onError(result.error);
|
|
828
|
+
}
|
|
829
|
+
return { error: result.error };
|
|
830
|
+
}
|
|
831
|
+
|
|
832
|
+
return result;
|
|
833
|
+
}
|
|
834
|
+
|
|
835
|
+
// Per-record parallel calls (legacy path)
|
|
802
836
|
const results = await Promise.all(
|
|
803
837
|
recordIds.map(recordId =>
|
|
804
838
|
callAdminForthApi({
|
|
@@ -813,7 +847,6 @@ export async function executeCustomBulkAction({
|
|
|
813
847
|
})
|
|
814
848
|
)
|
|
815
849
|
);
|
|
816
|
-
|
|
817
850
|
const lastResult = results[results.length - 1];
|
|
818
851
|
if (lastResult?.redirectUrl) {
|
|
819
852
|
if (lastResult.redirectUrl.includes('target=_blank')) {
|
package/dist/spa/src/utils.ts
CHANGED
|
@@ -20,11 +20,9 @@
|
|
|
20
20
|
<button
|
|
21
21
|
@click="() => saveRecord()"
|
|
22
22
|
class="af-save-button h-[34px] af-button-shadow flex items-center py-1 px-3 text-sm font-medium rounded-default text-lightCreateViewSaveButtonText focus:outline-none bg-lightCreateViewButtonBackground rounded border border-lightCreateViewButtonBorder hover:bg-lightCreateViewButtonBackgroundHover hover:text-lightCreateViewSaveButtonTextHover focus:z-10 focus:ring-4 focus:ring-lightCreateViewButtonFocusRing dark:focus:ring-darkCreateViewButtonFocusRing dark:bg-darkCreateViewButtonBackground dark:text-darkCreateViewSaveButtonText dark:border-darkCreateViewButtonBorder dark:hover:text-darkCreateViewSaveButtonTextHover dark:hover:bg-darkCreateViewButtonBackgroundHover disabled:opacity-50 gap-1"
|
|
23
|
-
:disabled="saving || (
|
|
23
|
+
:disabled="saving || (validatingMode && !isValid) || resourceFormRef?.isValidating"
|
|
24
24
|
>
|
|
25
|
-
<
|
|
26
|
-
aria-hidden="true" class="w-4 h-4 mr-1 text-gray-200 animate-spin dark:text-gray-600 fill-lightCreateViewSaveButtonText" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="currentColor"/><path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentFill"/></svg>
|
|
27
|
-
|
|
25
|
+
<Spinner v-if="saving || resourceFormRef?.isValidating" class="w-4 h-4" />
|
|
28
26
|
<IconFloppyDiskSolid v-else class="w-4 h-4" />
|
|
29
27
|
{{ $t('Save') }}
|
|
30
28
|
</button>
|
|
@@ -54,7 +52,7 @@
|
|
|
54
52
|
:resource="coreStore.resource!"
|
|
55
53
|
@update:record="onUpdateRecord"
|
|
56
54
|
@update:isValid="isValid = $event"
|
|
57
|
-
:
|
|
55
|
+
:validatingMode="validatingMode"
|
|
58
56
|
:source="'create'"
|
|
59
57
|
:readonlyColumns="readonlyColumns"
|
|
60
58
|
>
|
|
@@ -81,18 +79,18 @@ import SingleSkeletLoader from '@/components/SingleSkeletLoader.vue';
|
|
|
81
79
|
import { useCoreStore } from '@/stores/core';
|
|
82
80
|
import { callAdminForthApi, getCustomComponent,checkAcessByAllowedActions, initThreeDotsDropdown, checkShowIf, compareOldAndNewRecord, onBeforeRouteLeaveCreateEditViewGuard, leaveGuardActiveClass, formatComponent } from '@/utils';
|
|
83
81
|
import { IconFloppyDiskSolid } from '@iconify-prerendered/vue-flowbite';
|
|
84
|
-
import { onMounted, onBeforeMount, onBeforeUnmount, ref
|
|
85
|
-
import { useRoute, useRouter
|
|
86
|
-
import { computed } from 'vue';
|
|
82
|
+
import { onMounted, onBeforeMount, onBeforeUnmount, ref } from 'vue';
|
|
83
|
+
import { useRoute, useRouter } from 'vue-router';
|
|
87
84
|
import { showErrorTost } from '@/composables/useFrontendApi';
|
|
88
85
|
import ThreeDotsMenu from '@/components/ThreeDotsMenu.vue';
|
|
89
86
|
import { useAdminforth } from '@/adminforth';
|
|
90
87
|
import { useI18n } from 'vue-i18n';
|
|
91
88
|
import { type AdminForthComponentDeclaration, type AdminForthComponentDeclarationFull } from '@/types/Common.js';
|
|
92
|
-
import
|
|
89
|
+
import { saveRecordPreparations } from '@/utils';
|
|
90
|
+
import { Spinner } from '@/afcl'
|
|
93
91
|
|
|
94
92
|
const isValid = ref(false);
|
|
95
|
-
const
|
|
93
|
+
const validatingMode = ref(false);
|
|
96
94
|
|
|
97
95
|
const loading = ref(true);
|
|
98
96
|
const saving = ref(false);
|
|
@@ -195,28 +193,22 @@ onMounted(async () => {
|
|
|
195
193
|
});
|
|
196
194
|
|
|
197
195
|
async function saveRecord() {
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
196
|
+
const interceptorsResult = await saveRecordPreparations(
|
|
197
|
+
'create',
|
|
198
|
+
validatingMode,
|
|
199
|
+
resourceFormRef,
|
|
200
|
+
isValid,
|
|
201
|
+
t,
|
|
202
|
+
saving,
|
|
203
|
+
runSaveInterceptors,
|
|
204
|
+
record,
|
|
205
|
+
coreStore,
|
|
206
|
+
route
|
|
207
|
+
);
|
|
208
|
+
|
|
206
209
|
const requiredColumns = coreStore.resource?.columns.filter(c => c.required?.create === true) || [];
|
|
207
210
|
const requiredColumnsToSkip = requiredColumns.filter(c => checkShowIf(c, record.value, coreStore.resource?.columns || []) === false);
|
|
208
|
-
|
|
209
|
-
const interceptorsResult = await runSaveInterceptors({
|
|
210
|
-
action: 'create',
|
|
211
|
-
values: record.value,
|
|
212
|
-
resource: coreStore.resource,
|
|
213
|
-
resourceId: route.params.resourceId as string,
|
|
214
|
-
});
|
|
215
|
-
if (!interceptorsResult.ok) {
|
|
216
|
-
saving.value = false;
|
|
217
|
-
if (interceptorsResult.error) showErrorTost(interceptorsResult.error);
|
|
218
|
-
return;
|
|
219
|
-
}
|
|
211
|
+
|
|
220
212
|
const interceptorConfirmationResult = (interceptorsResult.extra as Record<string, any>)?.confirmationResult;
|
|
221
213
|
const response = await callAdminForthApi({
|
|
222
214
|
method: 'POST',
|
|
@@ -254,23 +246,4 @@ async function saveRecord() {
|
|
|
254
246
|
saving.value = false;
|
|
255
247
|
}
|
|
256
248
|
|
|
257
|
-
function scrollToInvalidField() {
|
|
258
|
-
let columnsWithErrors: {column: AdminForthResourceColumn, error: string}[] = [];
|
|
259
|
-
for (const column of resourceFormRef.value?.editableColumns || []) {
|
|
260
|
-
const error = resourceFormRef.value?.columnError(column);
|
|
261
|
-
if (error) {
|
|
262
|
-
columnsWithErrors.push({column, error});
|
|
263
|
-
}
|
|
264
|
-
}
|
|
265
|
-
const errorMessage = t('Failed to save. Please fix errors for the following fields:') + '<ul class="mt-2 list-disc list-inside">' + columnsWithErrors.map(c => `<li><strong>${c.column.label || c.column.name}</strong>: ${c.error}</li>`).join('') + '</ul>';
|
|
266
|
-
alert({
|
|
267
|
-
messageHtml: errorMessage,
|
|
268
|
-
variant: 'danger'
|
|
269
|
-
});
|
|
270
|
-
const firstInvalidElement = document.querySelector('.af-invalid-field-message');
|
|
271
|
-
if (firstInvalidElement) {
|
|
272
|
-
firstInvalidElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
|
273
|
-
}
|
|
274
|
-
}
|
|
275
|
-
|
|
276
249
|
</script>
|
|
@@ -19,9 +19,10 @@
|
|
|
19
19
|
<button
|
|
20
20
|
@click="() => saveRecord()"
|
|
21
21
|
class="flex items-center h-[34px] af-button-shadow py-1 px-3 text-sm font-medium rounded-default text-lightEditViewSaveButtonText focus:outline-none bg-lightEditViewButtonBackground rounded border border-lightEditViewButtonBorder hover:bg-lightEditViewButtonBackgroundHover hover:text-lightEditViewSaveButtonTextHover focus:z-10 focus:ring-4 focus:ring-lightEditViewButtonFocusRing dark:focus:ring-darkEditViewButtonFocusRing dark:bg-darkEditViewButtonBackground dark:text-darkEditViewSaveButtonText dark:border-darkEditViewButtonBorder dark:hover:text-darkEditViewSaveButtonTextHover dark:hover:bg-darkEditViewButtonBackgroundHover disabled:opacity-50 gap-1"
|
|
22
|
-
:disabled="saving || (
|
|
22
|
+
:disabled="saving || (validatingMode && !isValid) || resourceFormRef?.isValidating"
|
|
23
23
|
>
|
|
24
|
-
<
|
|
24
|
+
<Spinner v-if="saving || resourceFormRef?.isValidating" class="w-4 h-4" />
|
|
25
|
+
<IconFloppyDiskSolid v-else class="w-4 h-4" />
|
|
25
26
|
{{ $t('Save') }}
|
|
26
27
|
</button>
|
|
27
28
|
|
|
@@ -50,7 +51,7 @@
|
|
|
50
51
|
:adminUser="coreStore.adminUser"
|
|
51
52
|
@update:record="onUpdateRecord"
|
|
52
53
|
@update:isValid="isValid = $event"
|
|
53
|
-
:
|
|
54
|
+
:validatingMode="validatingMode"
|
|
54
55
|
:source="'edit'"
|
|
55
56
|
>
|
|
56
57
|
</ResourceForm>
|
|
@@ -85,13 +86,15 @@ import { useI18n } from 'vue-i18n';
|
|
|
85
86
|
import { formatComponent } from '@/utils';
|
|
86
87
|
import { type AdminForthComponentDeclaration, type AdminForthComponentDeclarationFull } from '@/types/Common.js';
|
|
87
88
|
import type { AdminForthResourceColumn } from '@/types/Back';
|
|
89
|
+
import { scrollToInvalidField, saveRecordPreparations } from '@/utils';
|
|
90
|
+
import { Spinner } from '@/afcl'
|
|
88
91
|
|
|
89
92
|
const { t } = useI18n();
|
|
90
93
|
const coreStore = useCoreStore();
|
|
91
94
|
const { clearSaveInterceptors, runSaveInterceptors, alert, confirm } = useAdminforth();
|
|
92
95
|
|
|
93
96
|
const isValid = ref(false);
|
|
94
|
-
const
|
|
97
|
+
const validatingMode = ref(false);
|
|
95
98
|
|
|
96
99
|
const route = useRoute();
|
|
97
100
|
const router = useRouter();
|
|
@@ -180,22 +183,20 @@ onMounted(async () => {
|
|
|
180
183
|
});
|
|
181
184
|
|
|
182
185
|
async function saveRecord() {
|
|
183
|
-
if (!isValid.value) {
|
|
184
|
-
validating.value = true;
|
|
185
|
-
await nextTick();
|
|
186
|
-
scrollToInvalidField();
|
|
187
|
-
return;
|
|
188
|
-
} else {
|
|
189
|
-
validating.value = false;
|
|
190
|
-
}
|
|
191
186
|
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
187
|
+
const interceptorsResult = await saveRecordPreparations(
|
|
188
|
+
'edit',
|
|
189
|
+
validatingMode,
|
|
190
|
+
resourceFormRef,
|
|
191
|
+
isValid,
|
|
192
|
+
t,
|
|
193
|
+
saving,
|
|
194
|
+
runSaveInterceptors,
|
|
195
|
+
record,
|
|
196
|
+
coreStore,
|
|
197
|
+
route
|
|
198
|
+
);
|
|
199
|
+
|
|
199
200
|
if (!interceptorsResult.ok) {
|
|
200
201
|
saving.value = false;
|
|
201
202
|
if (interceptorsResult.error) showErrorTost(interceptorsResult.error);
|
|
@@ -256,23 +257,4 @@ async function saveRecord() {
|
|
|
256
257
|
saving.value = false;
|
|
257
258
|
}
|
|
258
259
|
|
|
259
|
-
function scrollToInvalidField() {
|
|
260
|
-
let columnsWithErrors: {column: AdminForthResourceColumn, error: string}[] = [];
|
|
261
|
-
for (const column of resourceFormRef.value?.editableColumns || []) {
|
|
262
|
-
const error = resourceFormRef.value?.columnError(column);
|
|
263
|
-
if (error) {
|
|
264
|
-
columnsWithErrors.push({column, error});
|
|
265
|
-
}
|
|
266
|
-
}
|
|
267
|
-
const errorMessage = t('Failed to save. Please fix errors for the following fields:') + '<ul class="mt-2 list-disc list-inside">' + columnsWithErrors.map(c => `<li><strong>${c.column.label || c.column.name}</strong>: ${c.error}</li>`).join('') + '</ul>';
|
|
268
|
-
alert({
|
|
269
|
-
messageHtml: errorMessage,
|
|
270
|
-
variant: 'danger'
|
|
271
|
-
});
|
|
272
|
-
const firstInvalidElement = document.querySelector('.af-invalid-field-message');
|
|
273
|
-
if (firstInvalidElement) {
|
|
274
|
-
firstInvalidElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
|
|
275
|
-
}
|
|
276
|
-
}
|
|
277
|
-
|
|
278
260
|
</script>
|
|
@@ -98,7 +98,13 @@
|
|
|
98
98
|
<button
|
|
99
99
|
:key="action.id"
|
|
100
100
|
@click="startCustomBulkActionInner(action.id!)"
|
|
101
|
-
class="flex gap-1 items-center py-1 px-3 text-sm font-medium text-lightListViewButtonText
|
|
101
|
+
class="flex gap-1 items-center py-1 px-3 text-sm font-medium text-lightListViewButtonText
|
|
102
|
+
focus:outline-none bg-lightListViewButtonBackground rounded-default border h-[34px]
|
|
103
|
+
border-lightListViewButtonBorder hover:bg-lightListViewButtonBackgroundHover
|
|
104
|
+
hover:text-lightListViewButtonTextHover focus:z-10 focus:ring-4 af-button-shadow
|
|
105
|
+
focus:ring-lightListViewButtonFocusRing dark:focus:ring-darkListViewButtonFocusRing
|
|
106
|
+
dark:bg-darkListViewButtonBackground dark:text-darkListViewButtonText dark:border-darkListViewButtonBorder
|
|
107
|
+
dark:hover:text-darkListViewButtonTextHover dark:hover:bg-darkListViewButtonBackgroundHover"
|
|
102
108
|
>
|
|
103
109
|
<component
|
|
104
110
|
v-if="action.icon && !customActionLoadingStates[action.id!]"
|
|
@@ -344,6 +350,7 @@ async function startCustomBulkActionInner(actionId: string | number) {
|
|
|
344
350
|
resourceId: route.params.resourceId as string,
|
|
345
351
|
recordIds: checkboxes.value,
|
|
346
352
|
confirmMessage: action?.bulkConfirmationMessage,
|
|
353
|
+
resource: coreStore.resource!,
|
|
347
354
|
setLoadingState: (loading: boolean) => {
|
|
348
355
|
customActionLoadingStates.value[actionId] = loading;
|
|
349
356
|
},
|
|
@@ -354,7 +361,7 @@ async function startCustomBulkActionInner(actionId: string | number) {
|
|
|
354
361
|
const successResults = results.filter(r => r?.successMessage);
|
|
355
362
|
if (successResults.length > 0) {
|
|
356
363
|
alert({
|
|
357
|
-
message: action?.bulkSuccessMessage
|
|
364
|
+
message: action?.bulkSuccessMessage ? action.bulkSuccessMessage : action?.hasBulkHandler ? successResults[0].successMessage : `${successResults.length} out of ${results.length} items processed successfully`,
|
|
358
365
|
variant: 'success'
|
|
359
366
|
});
|
|
360
367
|
}
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
<BreadcrumbsWithButtons>
|
|
13
13
|
<template v-if="coreStore.resource?.options?.actions">
|
|
14
14
|
|
|
15
|
-
<
|
|
15
|
+
<div class="flex gap-1" v-for="action in coreStore.resource.options.actions.filter(a => a.showIn?.showButton)" :key="action.id">
|
|
16
16
|
<component
|
|
17
17
|
:is="action?.customComponent ? getCustomComponent(formatComponent(action.customComponent)) : CallActionWrapper"
|
|
18
18
|
:meta="action.customComponent ? formatComponent(action.customComponent).meta : undefined"
|
|
@@ -45,7 +45,7 @@
|
|
|
45
45
|
{{ action.name }}
|
|
46
46
|
</button>
|
|
47
47
|
</component>
|
|
48
|
-
</
|
|
48
|
+
</div>
|
|
49
49
|
</template>
|
|
50
50
|
<RouterLink v-if="coreStore.resource?.options?.allowedActions?.create"
|
|
51
51
|
:to="{ name: 'resource-create', params: { resourceId: $route.params.resourceId } }"
|
|
@@ -85,14 +85,52 @@
|
|
|
85
85
|
:adminUser="coreStore.adminUser"
|
|
86
86
|
/>
|
|
87
87
|
|
|
88
|
-
<div
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
88
|
+
<div
|
|
89
|
+
v-if="loading"
|
|
90
|
+
role="status"
|
|
91
|
+
class="animate-pulse overflow-x-auto shadow-resourseFormShadow dark:shadow-darkResourseFormShadow"
|
|
92
|
+
>
|
|
93
|
+
<div
|
|
94
|
+
v-if="groups && groups.length > 0"
|
|
95
|
+
class="text-md font-semibold px-6 py-3 flex flex-1 items-center bg-lightShowTableHeadingBackground dark:bg-darkShowTableHeadingBackground dark:text-darkShowTableHeadingText rounded-t-lg border-b border-lightShowTableBodyBorder dark:border-darkShowTableBodyBorder"
|
|
96
|
+
>
|
|
97
|
+
<div class="h-4 bg-gray-300 dark:bg-gray-600 rounded-full w-32"></div>
|
|
98
|
+
</div>
|
|
99
|
+
|
|
100
|
+
<table class="w-full text-sm text-left table-fixed">
|
|
101
|
+
<thead class="bg-lightShowTableUnderHeadingBackground dark:bg-darkShowTableUnderHeadingBackground block md:table-row-group">
|
|
102
|
+
<tr>
|
|
103
|
+
<th scope="col" class="px-6 py-3 text-xs uppercase hidden md:w-52 md:table-cell text-lightShowTableUnderHeadingText dark:text-darkShowTableUnderHeadingText">
|
|
104
|
+
{{ $t('Field') }}
|
|
105
|
+
</th>
|
|
106
|
+
<th scope="col" class="px-6 py-3 text-xs uppercase hidden md:table-cell text-lightShowTableUnderHeadingText dark:text-darkShowTableUnderHeadingText">
|
|
107
|
+
{{ $t('Value') }}
|
|
108
|
+
</th>
|
|
109
|
+
</tr>
|
|
110
|
+
</thead>
|
|
111
|
+
|
|
112
|
+
<tbody>
|
|
113
|
+
<tr
|
|
114
|
+
v-for="i in skeletonRowsCount"
|
|
115
|
+
:key="i"
|
|
116
|
+
class="bg-lightShowTablesBodyBackground border-t border-lightShowTableBodyBorder dark:bg-darkShowTablesBodyBackground dark:border-darkShowTableBodyBorder block md:table-row"
|
|
117
|
+
>
|
|
118
|
+
<td class="px-6 py-[15.5px] relative block md:table-cell pb-0 md:pb-[15.5px]">
|
|
119
|
+
<div class="md:absolute md:inset-0 flex items-center px-6 py-[15.5px]">
|
|
120
|
+
<div class="h-2.5 bg-gray-200 dark:bg-gray-700 rounded-full w-24"></div>
|
|
121
|
+
</div>
|
|
122
|
+
</td>
|
|
123
|
+
|
|
124
|
+
<td class="px-6 py-[15.5px] whitespace-pre-wrap block md:table-cell">
|
|
125
|
+
<div class="flex items-center h-full min-h-[21px]">
|
|
126
|
+
<div class="h-2.5 bg-gray-200 dark:bg-gray-700 rounded-full w-full max-w-[280px]"></div>
|
|
127
|
+
</div>
|
|
128
|
+
</td>
|
|
129
|
+
</tr>
|
|
130
|
+
</tbody>
|
|
131
|
+
</table>
|
|
132
|
+
|
|
133
|
+
<span class="sr-only">{{ $t('Loading...') }}</span>
|
|
96
134
|
</div>
|
|
97
135
|
<div
|
|
98
136
|
v-else-if="coreStore.record"
|
|
@@ -161,7 +199,7 @@ import ShowTable from '@/components/ShowTable.vue';
|
|
|
161
199
|
import { useAdminforth } from '@/adminforth';
|
|
162
200
|
import { useI18n } from 'vue-i18n';
|
|
163
201
|
import { getIcon } from '@/utils';
|
|
164
|
-
import { type AdminForthComponentDeclarationFull, type AdminForthResourceColumnCommon, type FieldGroup
|
|
202
|
+
import { type AdminForthComponentDeclarationFull, type AdminForthResourceColumnCommon, type FieldGroup} from '@/types/Common.js';
|
|
165
203
|
import CallActionWrapper from '@/components/CallActionWrapper.vue'
|
|
166
204
|
|
|
167
205
|
const route = useRoute();
|
|
@@ -177,6 +215,18 @@ const customActions = computed(() => {
|
|
|
177
215
|
return coreStore.resource?.options?.actions?.filter((a: any) => a.showIn?.showThreeDotsMenu) || [];
|
|
178
216
|
});
|
|
179
217
|
|
|
218
|
+
const skeletonRowsCount = computed(() => {
|
|
219
|
+
const allCols = coreStore.resource?.columns || [];
|
|
220
|
+
|
|
221
|
+
const isEnabledInConfig = (col: any) => {
|
|
222
|
+
return col.showIn?.list !== false;
|
|
223
|
+
};
|
|
224
|
+
|
|
225
|
+
const finalCount = allCols.filter(isEnabledInConfig).length;
|
|
226
|
+
|
|
227
|
+
return finalCount > 0 ? finalCount : 10;
|
|
228
|
+
});
|
|
229
|
+
|
|
180
230
|
onMounted(async () => {
|
|
181
231
|
loading.value = true;
|
|
182
232
|
await coreStore.fetchResourceFull({
|
|
@@ -216,7 +266,7 @@ const groups = computed(() => {
|
|
|
216
266
|
});
|
|
217
267
|
|
|
218
268
|
const allColumns = computed(() => {
|
|
219
|
-
return coreStore.resource?.columns
|
|
269
|
+
return coreStore.resource?.columns?.filter(col => col.showIn?.show);
|
|
220
270
|
});
|
|
221
271
|
|
|
222
272
|
const otherColumns = computed(() => {
|
package/dist/types/Back.d.ts
CHANGED
|
@@ -1205,6 +1205,19 @@ export interface AdminForthActionInput {
|
|
|
1205
1205
|
standardAllowedActions: AllowedActions;
|
|
1206
1206
|
}) => boolean;
|
|
1207
1207
|
url?: string;
|
|
1208
|
+
bulkHandler?: (params: {
|
|
1209
|
+
adminforth: IAdminForth;
|
|
1210
|
+
resource: AdminForthResource;
|
|
1211
|
+
recordIds: (string | number)[];
|
|
1212
|
+
adminUser: AdminUser;
|
|
1213
|
+
response: IAdminForthHttpResponse;
|
|
1214
|
+
extra?: HttpExtra;
|
|
1215
|
+
tr: ITranslateFunction;
|
|
1216
|
+
}) => Promise<{
|
|
1217
|
+
ok: boolean;
|
|
1218
|
+
error?: string;
|
|
1219
|
+
successMessage?: string;
|
|
1220
|
+
}>;
|
|
1208
1221
|
action?: (params: {
|
|
1209
1222
|
adminforth: IAdminForth;
|
|
1210
1223
|
resource: AdminForthResource;
|
|
@@ -1212,7 +1225,7 @@ export interface AdminForthActionInput {
|
|
|
1212
1225
|
adminUser: AdminUser;
|
|
1213
1226
|
response: IAdminForthHttpResponse;
|
|
1214
1227
|
extra?: HttpExtra;
|
|
1215
|
-
tr:
|
|
1228
|
+
tr: ITranslateFunction;
|
|
1216
1229
|
}) => Promise<{
|
|
1217
1230
|
ok: boolean;
|
|
1218
1231
|
error?: string;
|
|
@@ -1597,6 +1610,8 @@ export interface ResourceOptionsInput extends Omit<NonNullable<AdminForthResourc
|
|
|
1597
1610
|
/**
|
|
1598
1611
|
* Custom bulk actions list. Bulk actions available in list view when user selects multiple records by
|
|
1599
1612
|
* using checkboxes.
|
|
1613
|
+
* @deprecated Since 2.26.5. Will be removed in 3.0.0. Use `actions` instead.
|
|
1614
|
+
|
|
1600
1615
|
*/
|
|
1601
1616
|
bulkActions?: Array<AdminForthBulkAction>;
|
|
1602
1617
|
/**
|