lkt-item-crud 2.0.2 → 2.0.4
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/dist/build.d.ts +6 -6
- package/dist/build.js +256 -227
- package/dist/components/ButtonNav.vue.d.ts +1638 -0
- package/dist/lib-components/LktItemCrud.vue.d.ts +161 -0
- package/package.json +11 -8
- package/src/lib-components/LktItemCrud.vue +46 -7
|
@@ -0,0 +1,161 @@
|
|
|
1
|
+
import { SetupContext } from 'vue';
|
|
2
|
+
import { HTTPResponse } from 'lkt-http-client';
|
|
3
|
+
import { ItemCrudButtonNavPosition, ItemCrudConfig, ItemCrudMode, ItemCrudView, LktObject, NotificationType } from 'lkt-vue-kernel';
|
|
4
|
+
import ButtonNav from '../components/ButtonNav.vue';
|
|
5
|
+
declare const slots: SetupContext['slots'];
|
|
6
|
+
declare const isLoading: import("vue").Ref<boolean, boolean>, item: import("vue").Ref<LktObject, LktObject>, editMode: import("vue").Ref<boolean, boolean>, httpSuccessRead: import("vue").Ref<boolean, boolean>, showStoreMessage: import("vue").Ref<boolean, boolean>, httpStatus: import("vue").Ref<number, number>, dataChanged: import("vue").Ref<boolean, boolean>, createMode: import("vue").Ref<boolean, boolean>, itemBeingEdited: import("vue").Ref<boolean, boolean>, buttonNav: import("vue").Ref<null, null>, canUpdate: import("vue").ComputedRef<boolean>, canDrop: import("vue").ComputedRef<boolean>, canSwitchEditMode: import("vue").ComputedRef<boolean>;
|
|
7
|
+
declare const onCreate: ($event: PointerEvent, r: HTTPResponse) => void, onUpdate: ($event: PointerEvent, r: HTTPResponse) => void, onDrop: ($event: PointerEvent, r: HTTPResponse) => void;
|
|
8
|
+
declare const computedTitle: import("vue").ComputedRef<string>, displayHeader: import("vue").ComputedRef<boolean>, computedInsideModal: import("vue").ComputedRef<boolean>, computedContainerTag: import("vue").ComputedRef<"lkt-modal" | "section">, computedContainerAttrs: import("vue").ComputedRef<{}>;
|
|
9
|
+
declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
|
|
10
|
+
declare var __VLS_6: {
|
|
11
|
+
item: LktObject;
|
|
12
|
+
loading: boolean;
|
|
13
|
+
}, __VLS_8: {
|
|
14
|
+
item: LktObject;
|
|
15
|
+
loading: boolean;
|
|
16
|
+
}, __VLS_21: {}, __VLS_23: {}, __VLS_33: {
|
|
17
|
+
item: LktObject;
|
|
18
|
+
loading: false;
|
|
19
|
+
editMode: boolean;
|
|
20
|
+
isCreate: boolean;
|
|
21
|
+
canUpdate: boolean;
|
|
22
|
+
canDrop: boolean;
|
|
23
|
+
itemBeingEdited: boolean;
|
|
24
|
+
}, __VLS_54: {}, __VLS_56: {};
|
|
25
|
+
type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
|
|
26
|
+
'pre-title'?: (props: typeof __VLS_6) => any;
|
|
27
|
+
} & {
|
|
28
|
+
'post-title'?: (props: typeof __VLS_8) => any;
|
|
29
|
+
} & {
|
|
30
|
+
'prev-buttons-ever'?: (props: typeof __VLS_21) => any;
|
|
31
|
+
} & {
|
|
32
|
+
'prev-buttons'?: (props: typeof __VLS_23) => any;
|
|
33
|
+
} & {
|
|
34
|
+
item?: (props: typeof __VLS_33) => any;
|
|
35
|
+
} & {
|
|
36
|
+
'prev-buttons-ever'?: (props: typeof __VLS_54) => any;
|
|
37
|
+
} & {
|
|
38
|
+
'prev-buttons'?: (props: typeof __VLS_56) => any;
|
|
39
|
+
}>;
|
|
40
|
+
declare const __VLS_self: import("vue").DefineComponent<ItemCrudConfig, {
|
|
41
|
+
ItemCrudButtonNavPosition: typeof ItemCrudButtonNavPosition;
|
|
42
|
+
NotificationType: typeof NotificationType;
|
|
43
|
+
ButtonNav: typeof ButtonNav;
|
|
44
|
+
slots: typeof slots;
|
|
45
|
+
isLoading: typeof isLoading;
|
|
46
|
+
item: typeof item;
|
|
47
|
+
editMode: typeof editMode;
|
|
48
|
+
httpSuccessRead: typeof httpSuccessRead;
|
|
49
|
+
showStoreMessage: typeof showStoreMessage;
|
|
50
|
+
httpStatus: typeof httpStatus;
|
|
51
|
+
dataChanged: typeof dataChanged;
|
|
52
|
+
createMode: typeof createMode;
|
|
53
|
+
itemBeingEdited: typeof itemBeingEdited;
|
|
54
|
+
buttonNav: typeof buttonNav;
|
|
55
|
+
canUpdate: typeof canUpdate;
|
|
56
|
+
canDrop: typeof canDrop;
|
|
57
|
+
canSwitchEditMode: typeof canSwitchEditMode;
|
|
58
|
+
onCreate: typeof onCreate;
|
|
59
|
+
onUpdate: typeof onUpdate;
|
|
60
|
+
onDrop: typeof onDrop;
|
|
61
|
+
computedTitle: typeof computedTitle;
|
|
62
|
+
displayHeader: typeof displayHeader;
|
|
63
|
+
computedInsideModal: typeof computedInsideModal;
|
|
64
|
+
computedContainerTag: typeof computedContainerTag;
|
|
65
|
+
computedContainerAttrs: typeof computedContainerAttrs;
|
|
66
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
67
|
+
error: (...args: any[]) => void;
|
|
68
|
+
drop: (...args: any[]) => void;
|
|
69
|
+
update: (...args: any[]) => void;
|
|
70
|
+
create: (...args: any[]) => void;
|
|
71
|
+
read: (...args: any[]) => void;
|
|
72
|
+
perms: (...args: any[]) => void;
|
|
73
|
+
"update:editing": (...args: any[]) => void;
|
|
74
|
+
"update:modelValue": (...args: any[]) => void;
|
|
75
|
+
"before-save": (...args: any[]) => void;
|
|
76
|
+
"modified-data": (...args: any[]) => void;
|
|
77
|
+
}, string, import("vue").PublicProps, Readonly<ItemCrudConfig> & Readonly<{
|
|
78
|
+
onError?: ((...args: any[]) => any) | undefined;
|
|
79
|
+
onDrop?: ((...args: any[]) => any) | undefined;
|
|
80
|
+
onUpdate?: ((...args: any[]) => any) | undefined;
|
|
81
|
+
onCreate?: ((...args: any[]) => any) | undefined;
|
|
82
|
+
onRead?: ((...args: any[]) => any) | undefined;
|
|
83
|
+
onPerms?: ((...args: any[]) => any) | undefined;
|
|
84
|
+
"onUpdate:editing"?: ((...args: any[]) => any) | undefined;
|
|
85
|
+
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
86
|
+
"onBefore-save"?: ((...args: any[]) => any) | undefined;
|
|
87
|
+
"onModified-data"?: ((...args: any[]) => any) | undefined;
|
|
88
|
+
}>, {
|
|
89
|
+
view: ItemCrudView;
|
|
90
|
+
title: string;
|
|
91
|
+
mode: ItemCrudMode;
|
|
92
|
+
modelValue: LktObject;
|
|
93
|
+
editing: boolean;
|
|
94
|
+
editModeButton: import("lkt-vue-kernel").ButtonConfig;
|
|
95
|
+
dropButton: import("lkt-vue-kernel").ButtonConfig;
|
|
96
|
+
createButton: import("lkt-vue-kernel").ButtonConfig;
|
|
97
|
+
updateButton: import("lkt-vue-kernel").ButtonConfig;
|
|
98
|
+
buttonNavPosition: ItemCrudButtonNavPosition;
|
|
99
|
+
buttonNavVisibility: import("lkt-vue-kernel").ItemCrudButtonNavVisibility;
|
|
100
|
+
modalConfig: import("lkt-vue-kernel").ModalConfig;
|
|
101
|
+
saveConfig: import("lkt-vue-kernel").SaveConfig;
|
|
102
|
+
dataStateConfig: import("lkt-data-state").DataStateConfig;
|
|
103
|
+
readResource: string;
|
|
104
|
+
readData: LktObject;
|
|
105
|
+
beforeEmitUpdate: Function;
|
|
106
|
+
notificationType: NotificationType;
|
|
107
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
108
|
+
declare const __VLS_component: import("vue").DefineComponent<ItemCrudConfig, {
|
|
109
|
+
doDrop: () => void;
|
|
110
|
+
doRefresh: () => Promise<void>;
|
|
111
|
+
doSave: () => void;
|
|
112
|
+
hasModifiedData: () => boolean;
|
|
113
|
+
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
114
|
+
error: (...args: any[]) => void;
|
|
115
|
+
drop: (...args: any[]) => void;
|
|
116
|
+
update: (...args: any[]) => void;
|
|
117
|
+
create: (...args: any[]) => void;
|
|
118
|
+
read: (...args: any[]) => void;
|
|
119
|
+
perms: (...args: any[]) => void;
|
|
120
|
+
"update:editing": (...args: any[]) => void;
|
|
121
|
+
"update:modelValue": (...args: any[]) => void;
|
|
122
|
+
"before-save": (...args: any[]) => void;
|
|
123
|
+
"modified-data": (...args: any[]) => void;
|
|
124
|
+
}, string, import("vue").PublicProps, Readonly<ItemCrudConfig> & Readonly<{
|
|
125
|
+
onError?: ((...args: any[]) => any) | undefined;
|
|
126
|
+
onDrop?: ((...args: any[]) => any) | undefined;
|
|
127
|
+
onUpdate?: ((...args: any[]) => any) | undefined;
|
|
128
|
+
onCreate?: ((...args: any[]) => any) | undefined;
|
|
129
|
+
onRead?: ((...args: any[]) => any) | undefined;
|
|
130
|
+
onPerms?: ((...args: any[]) => any) | undefined;
|
|
131
|
+
"onUpdate:editing"?: ((...args: any[]) => any) | undefined;
|
|
132
|
+
"onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
|
|
133
|
+
"onBefore-save"?: ((...args: any[]) => any) | undefined;
|
|
134
|
+
"onModified-data"?: ((...args: any[]) => any) | undefined;
|
|
135
|
+
}>, {
|
|
136
|
+
view: ItemCrudView;
|
|
137
|
+
title: string;
|
|
138
|
+
mode: ItemCrudMode;
|
|
139
|
+
modelValue: LktObject;
|
|
140
|
+
editing: boolean;
|
|
141
|
+
editModeButton: import("lkt-vue-kernel").ButtonConfig;
|
|
142
|
+
dropButton: import("lkt-vue-kernel").ButtonConfig;
|
|
143
|
+
createButton: import("lkt-vue-kernel").ButtonConfig;
|
|
144
|
+
updateButton: import("lkt-vue-kernel").ButtonConfig;
|
|
145
|
+
buttonNavPosition: ItemCrudButtonNavPosition;
|
|
146
|
+
buttonNavVisibility: import("lkt-vue-kernel").ItemCrudButtonNavVisibility;
|
|
147
|
+
modalConfig: import("lkt-vue-kernel").ModalConfig;
|
|
148
|
+
saveConfig: import("lkt-vue-kernel").SaveConfig;
|
|
149
|
+
dataStateConfig: import("lkt-data-state").DataStateConfig;
|
|
150
|
+
readResource: string;
|
|
151
|
+
readData: LktObject;
|
|
152
|
+
beforeEmitUpdate: Function;
|
|
153
|
+
notificationType: NotificationType;
|
|
154
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
155
|
+
declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
|
|
156
|
+
export default _default;
|
|
157
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
158
|
+
new (): {
|
|
159
|
+
$slots: S;
|
|
160
|
+
};
|
|
161
|
+
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "lkt-item-crud",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.4",
|
|
4
4
|
"description": "",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"module": "./dist/build.js",
|
|
@@ -22,6 +22,9 @@
|
|
|
22
22
|
"rebuild": "rm -rf dist/*; vue-tsc --declaration --emitDeclarationOnly; vite build; tsc --project tsconfig.build.json; cp build/* dist/"
|
|
23
23
|
},
|
|
24
24
|
"author": "Antonio Ibáñez",
|
|
25
|
+
"engines": {
|
|
26
|
+
"node": ">=18"
|
|
27
|
+
},
|
|
25
28
|
"devDependencies": {
|
|
26
29
|
"@babel/types": "^7.23.6",
|
|
27
30
|
"@types/node": "^20.11.19",
|
|
@@ -33,19 +36,19 @@
|
|
|
33
36
|
"vue": "^3.3.0",
|
|
34
37
|
"vue-tsc": "^2.2.0"
|
|
35
38
|
},
|
|
36
|
-
"engines": {
|
|
37
|
-
"node": ">=18"
|
|
38
|
-
},
|
|
39
39
|
"dependencies": {
|
|
40
|
-
"lkt-button": "^2.0.
|
|
40
|
+
"lkt-button": "^2.0.4",
|
|
41
41
|
"lkt-data-state": "^1.0.9",
|
|
42
42
|
"lkt-http-client": "^1.0.12",
|
|
43
43
|
"lkt-http-info": "^1.0.2",
|
|
44
44
|
"lkt-i18n": "^1.0.4",
|
|
45
45
|
"lkt-loader": "^1.0.2",
|
|
46
|
-
"lkt-modal": "^2.0.
|
|
46
|
+
"lkt-modal": "^2.0.2",
|
|
47
47
|
"lkt-string-tools": "^1.0.2",
|
|
48
|
-
"lkt-
|
|
49
|
-
"
|
|
48
|
+
"lkt-toast": "^1.0.1",
|
|
49
|
+
"lkt-vue-kernel": "^1.0.27"
|
|
50
|
+
},
|
|
51
|
+
"peerDependencies": {
|
|
52
|
+
"vue": "^3.3.0"
|
|
50
53
|
}
|
|
51
54
|
}
|
|
@@ -11,11 +11,16 @@
|
|
|
11
11
|
ItemCrudMode,
|
|
12
12
|
ItemCrudView,
|
|
13
13
|
LktObject,
|
|
14
|
+
LktSettings,
|
|
15
|
+
NotificationType,
|
|
14
16
|
TablePermission,
|
|
17
|
+
ToastConfig,
|
|
18
|
+
ToastPositionX,
|
|
15
19
|
} from 'lkt-vue-kernel';
|
|
16
20
|
import { closeModal } from 'lkt-modal';
|
|
17
21
|
import { __ } from 'lkt-i18n';
|
|
18
22
|
import ButtonNav from '../components/ButtonNav.vue';
|
|
23
|
+
import { openToast } from 'lkt-toast';
|
|
19
24
|
|
|
20
25
|
|
|
21
26
|
const props = withDefaults(defineProps<ItemCrudConfig>(), getDefaultValues(ItemCrud));
|
|
@@ -168,7 +173,17 @@
|
|
|
168
173
|
},
|
|
169
174
|
onCreate = ($event: PointerEvent, r: HTTPResponse) => {
|
|
170
175
|
debug('onCreate');
|
|
171
|
-
if (!ensureValidResourceSave(r, props.createButton.resource))
|
|
176
|
+
if (!ensureValidResourceSave(r, props.createButton.resource)) {
|
|
177
|
+
if (props.notificationType === NotificationType.Toast) {
|
|
178
|
+
openToast(<ToastConfig>{
|
|
179
|
+
text: LktSettings.defaultCreateErrorText,
|
|
180
|
+
details: LktSettings.defaultCreateErrorDetails,
|
|
181
|
+
icon: LktSettings.defaultCreateErrorIcon,
|
|
182
|
+
positionX: ToastPositionX.Right,
|
|
183
|
+
});
|
|
184
|
+
}
|
|
185
|
+
return;
|
|
186
|
+
}
|
|
172
187
|
itemCreated.value = true;
|
|
173
188
|
debug('onCreate -> turn stored data into original');
|
|
174
189
|
dataState.value.increment(item.value).turnStoredIntoOriginal();
|
|
@@ -177,7 +192,17 @@
|
|
|
177
192
|
},
|
|
178
193
|
onUpdate = ($event: PointerEvent, r: HTTPResponse) => {
|
|
179
194
|
debug('onUpdate');
|
|
180
|
-
if (!ensureValidResourceSave(r, props.updateButton.resource))
|
|
195
|
+
if (!ensureValidResourceSave(r, props.updateButton.resource)) {
|
|
196
|
+
if (props.notificationType === NotificationType.Toast) {
|
|
197
|
+
openToast(<ToastConfig>{
|
|
198
|
+
text: LktSettings.defaultUpdateErrorText,
|
|
199
|
+
details: LktSettings.defaultUpdateErrorDetails,
|
|
200
|
+
icon: LktSettings.defaultUpdateErrorIcon,
|
|
201
|
+
positionX: ToastPositionX.Right,
|
|
202
|
+
});
|
|
203
|
+
}
|
|
204
|
+
return;
|
|
205
|
+
}
|
|
181
206
|
debug('onUpdate -> turn stored data into original');
|
|
182
207
|
dataState.value.turnStoredIntoOriginal();
|
|
183
208
|
doAutoReloadId(r);
|
|
@@ -185,7 +210,17 @@
|
|
|
185
210
|
},
|
|
186
211
|
onDrop = ($event: PointerEvent, r: HTTPResponse) => {
|
|
187
212
|
debug('onDrop');
|
|
188
|
-
if (!ensureValidResourceSave(r, props.dropButton.resource))
|
|
213
|
+
if (!ensureValidResourceSave(r, props.dropButton.resource)) {
|
|
214
|
+
if (props.notificationType === NotificationType.Toast) {
|
|
215
|
+
openToast(<ToastConfig>{
|
|
216
|
+
text: LktSettings.defaultDropErrorText,
|
|
217
|
+
details: LktSettings.defaultDropErrorDetails,
|
|
218
|
+
icon: LktSettings.defaultDropErrorIcon,
|
|
219
|
+
positionX: ToastPositionX.Right,
|
|
220
|
+
});
|
|
221
|
+
}
|
|
222
|
+
return;
|
|
223
|
+
}
|
|
189
224
|
emit('drop', r);
|
|
190
225
|
if (props.view === ItemCrudView.Modal) {
|
|
191
226
|
debug('onDrop -> close modal');
|
|
@@ -308,16 +343,20 @@
|
|
|
308
343
|
|
|
309
344
|
<div class="lkt-item-crud_content" v-if="!isLoading">
|
|
310
345
|
<div v-if="httpSuccessRead" class="lkt-grid-1">
|
|
311
|
-
<lkt-http-info
|
|
312
|
-
|
|
313
|
-
|
|
346
|
+
<lkt-http-info
|
|
347
|
+
v-if="showStoreMessage && notificationType === NotificationType.Inline"
|
|
348
|
+
:code="httpStatus"
|
|
349
|
+
:palette="httpStatus === 200 ? 'success' : 'danger'"
|
|
350
|
+
quick
|
|
351
|
+
can-close
|
|
352
|
+
v-on:close="showStoreMessage = false" />
|
|
314
353
|
<slot name="item" :item="item" :loading="isLoading" :edit-mode="editMode"
|
|
315
354
|
:is-create="createMode"
|
|
316
355
|
:can-update="canUpdate"
|
|
317
356
|
:can-drop="canDrop"
|
|
318
357
|
:item-being-edited="itemBeingEdited"></slot>
|
|
319
358
|
</div>
|
|
320
|
-
<lkt-http-info :code="httpStatus" v-else />
|
|
359
|
+
<lkt-http-info :code="httpStatus" v-else-if="notificationType === NotificationType.Inline" />
|
|
321
360
|
</div>
|
|
322
361
|
<lkt-loader v-if="isLoading" />
|
|
323
362
|
|