STEMMechanics/Website
1
0
Fork 0
Code Issues 4 Pull Requests 3 Actions Packages Projects Releases 3 Wiki Activity

updated to media management

Browse Source
This commit is contained in:
James Collins
2023-08-24 22:14:43 +10:00
parent 60a15c2227
commit d7529cef80
9 changed files with 718 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
resources/js/components/dialogs/SMDialogMedia.vue
View File

@@ -234,7 +234,7 @@
<img
:src="mediaGetThumbnail(lastSelected)"
class="max-h-20 max-w-20 mr-2" />
<div class="flex flex-col">
<div class="flex flex-col w-100">
<p class="m-0 text-bold">
{{ lastSelected.title }}
</p>
@@ -260,13 +260,49 @@
</p>
<p
v-if="allowEditSelected"
class="m-0 italic text-red-6 small cursor-pointer hover:underline">
<span
class="flex gap-1">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5 cursor-pointer text-gray-6 hover:text-gray-4"
viewBox="0 0 24 24"
@click="
handleRotateLeft(
lastSelected,
)
">
<title>Rotate Left</title>
<path
d="M4 11C4 6.58 7.58 3 12 3L13 3.06V5.08L12 5C8.69 5 6 7.69 6 11H9L5 15L1 11H4M17 7H13C11.9 7 11 7.9 11 9V18C11 19.11 11.9 20 13 20H19C20.11 20 21 19.11 21 18V11L17 7M19 18H13V9H16V12H19V18Z"
fill="currentColor" />
</svg>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5 cursor-pointer text-gray-6 hover:text-gray-4"
viewBox="0 0 24 24"
@click="
handleRotateRight(
lastSelected,
)
">
<title>Rotate Right</title>
<path
d="M20 11H23L19 15L15 11H18C18 7.69 15.31 5 12 5L11 5.08V3.06L12 3C16.42 3 20 6.58 20 11M9 7H5C3.9 7 3 7.9 3 9V18C3 19.11 3.9 20 5 20H11C12.11 20 13 19.11 13 18V11L9 7M11 18H5V9H8V12H11V18Z"
fill="currentColor" />
</svg>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-5 w-5 cursor-pointer text-red-6 hover:text-red-4 ml-auto"
viewBox="0 0 24 24"
@click="
handleDelete(lastSelected)
"
>Delete Permanently</span
>
">
<title>
Delete Permanently
</title>
<path
d="M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19M8,9H16V19H8V9M15.5,4L14.5,3H9.5L8.5,4H5V6H19V4H15.5Z"
fill="currentColor" />
</svg>
</p>
</div>
</div>
@@ -1133,6 +1169,60 @@ const handleUpdate = () => {
}
};
const handleRotateLeft = async (item: Media) => {
api.put({
url: "/media/{id}",
params: {
id: item.id,
},
body: {
transform: "rotate-270",
},
})
.then((result) => {
if (result.data) {
const data = result.data as MediaResponse;
const index = mediaItems.value.findIndex(
(mediaItem) => mediaItem.id === item.id,
);
if (index !== -1) {
mediaItems.value[index] = data.medium;
}
}
})
.catch(() => {
/* empty */
});
};
const handleRotateRight = async (item: Media) => {
api.put({
url: "/media/{id}",
params: {
id: item.id,
},
body: {
transform: "rotate-90",
},
})
.then((result) => {
if (result.data) {
const data = result.data as MediaResponse;
const index = mediaItems.value.findIndex(
(mediaItem) => mediaItem.id === item.id,
);
if (index !== -1) {
mediaItems.value[index] = data.medium;
}
}
})
.catch(() => {
/* empty */
});
};
const handleDelete = async (item: Media) => {
let result = await openDialog(SMDialogConfirm, {
title: "Delete File?",