diff --git a/resources/js/components/dialogs/SMDialogMedia.vue b/resources/js/components/dialogs/SMDialogMedia.vue
index 4037606..0f3145f 100644
--- a/resources/js/components/dialogs/SMDialogMedia.vue
+++ b/resources/js/components/dialogs/SMDialogMedia.vue
@@ -120,10 +120,10 @@
'flex-items-center',
'flex-col',
selected != null &&
- selected.filter(
+ selected.findIndex(
(selectedItem) =>
- selectedItem.id == item.id,
- ).length > 0
+ selectedItem.id === item.id,
+ ) > -1
? 'selected-checked'
: 'border-white',
]"
@@ -321,7 +321,7 @@
'flex-items-center',
'flex-col',
]"
- @click="handleClickItem(item.id)">
+ @click="handleShowFileItem(item.id)">
+
@@ -517,13 +533,7 @@ const mediaItems: Ref = ref([]);
* Selected media item id.
*/
const selected: Ref = ref([]);
-const lastSelected = computed(() => {
- if (selected.value.length > 0) {
- return selected.value[selected.value.length - 1];
- }
-
- return null;
-});
+let lastSelected: Ref = ref(null);
/**
* How many media items are we showing per page.
@@ -655,18 +665,28 @@ const handleClickSelect = async () => {
*/
const handleClickItem = (item_id: string): void => {
if (isUUID(item_id)) {
+ const mediaItem = getMediaItem(item_id);
+
if (props.multiple) {
- if (
- selected.value.filter((item) => item.id == item_id).length > 0
- ) {
+ if (selected.value.findIndex((item) => item.id === item_id) > -1) {
selected.value = selected.value.filter(
(item) => item.id != item_id,
);
+
+ if (lastSelected.value.id === item_id) {
+ if (selected.value.length > 0) {
+ lastSelected.value = selected.value[0];
+ } else {
+ lastSelected.value = null;
+ }
+ }
} else {
- selected.value.push(getMediaItem(item_id));
+ selected.value.push(mediaItem);
+ lastSelected.value = mediaItem;
}
} else {
selected.value[0] = getMediaItem(item_id);
+ lastSelected.value = mediaItem;
}
} else {
// selected.value = null;
@@ -691,6 +711,24 @@ const handleDblClickItem = (item_id: string): void => {
}
};
+const handleShowFileItem = (item_id: string): void => {
+ const index = selected.value.findIndex((item) => item.id === item_id);
+ if (index > -1) {
+ lastSelected.value = selected.value[index];
+ }
+};
+
+const handleRemoveItem = (item_id: string): void => {
+ selected.value = selected.value.filter((item) => item.id != item_id);
+ if (lastSelected.value.id === item_id) {
+ if (selected.value.length > 0) {
+ lastSelected.value = selected.value[0];
+ } else {
+ lastSelected.value = null;
+ }
+ }
+};
+
/**
* When the user clicks the upload button
*/
@@ -941,7 +979,7 @@ const computedSelectDisabled = computed(() => {
if (selectedTab.value == "tab-browser") {
return (
selected.value.length == 0 ||
- selected.value.filter((item) => item.status !== "OK").length != 0
+ selected.value.findIndex((item) => item.status !== "OK") > -1
);
} else if (selectedTab.value == "tab-url") {
return (
@@ -1116,3 +1154,9 @@ api.get({
handleLoad();
+
+