From a4f7ad06b1598252cec23059c67d3843fd7b8aac Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20G=C3=B6bel?= <dgoebel@techfak.uni-bielefeld.de>
Date: Thu, 18 Jan 2024 14:56:31 +0100
Subject: [PATCH] Add actions to the resource admin view
#88
---
.../form-mode/ParameterGroupForm.vue | 1 -
.../resources/modals/CreateResourceModal.vue | 1 -
src/stores/resources.ts | 56 ++++++--
src/views/admin/AdminResourcesView.vue | 124 ++++++++++++++++--
src/views/resources/ReviewResourceView.vue | 4 +-
5 files changed, 161 insertions(+), 25 deletions(-)
diff --git a/src/components/parameter-schema/form-mode/ParameterGroupForm.vue b/src/components/parameter-schema/form-mode/ParameterGroupForm.vue
index e66ef66..2f45dc9 100644
--- a/src/components/parameter-schema/form-mode/ParameterGroupForm.vue
+++ b/src/components/parameter-schema/form-mode/ParameterGroupForm.vue
@@ -65,7 +65,6 @@ function parameterRequired(
watch(
formInput,
(newVal) => {
- //console.log("Group", props.parameterGroupName, newVal);
emit("update:modelValue", newVal);
},
{
diff --git a/src/components/resources/modals/CreateResourceModal.vue b/src/components/resources/modals/CreateResourceModal.vue
index 93f6cab..8bf7a01 100644
--- a/src/components/resources/modals/CreateResourceModal.vue
+++ b/src/components/resources/modals/CreateResourceModal.vue
@@ -60,7 +60,6 @@ function createResource() {
error.body["detail"] ===
`Resource with name '${resource.name}' already exists`
) {
- console.log(`Resource with name ${resource.name} already exists`);
formState.resourceNameTaken = true;
resourceNameElement.value?.setCustomValidity(
"Resource name is already taken",
diff --git a/src/stores/resources.ts b/src/stores/resources.ts
index 662c513..03f153a 100644
--- a/src/stores/resources.ts
+++ b/src/stores/resources.ts
@@ -37,6 +37,25 @@ export const useResourceStore = defineStore({
},
},
actions: {
+ fetchResource(
+ resource_id: string,
+ versionStatus?: Status[],
+ ): Promise<ResourceOut> {
+ return ResourceService.resourceGetResource(
+ resource_id,
+ versionStatus,
+ ).then((resource) => {
+ const nameStore = useNameStore();
+ nameStore.addNameToMapping(resource.resource_id, resource.name);
+ for (const version of resource.versions) {
+ nameStore.addNameToMapping(
+ version.resource_version_id,
+ version.release,
+ );
+ }
+ return resource;
+ });
+ },
fetchResources(
maintainerId?: string,
versionStatus?: Status[],
@@ -100,20 +119,9 @@ export const useResourceStore = defineStore({
if (this.ownResourceMapping[resource_id]) {
onFinally?.();
}
- return ResourceService.resourceGetResource(
- resource_id,
- Object.values(Status),
- )
+ return this.fetchResource(resource_id, Object.values(Status))
.then((resource) => {
this.ownResourceMapping[resource.resource_id] = resource;
- const nameStore = useNameStore();
- nameStore.addNameToMapping(resource.resource_id, resource.name);
- for (const version of resource.versions) {
- nameStore.addNameToMapping(
- version.resource_version_id,
- version.release,
- );
- }
return resource;
})
.finally(onFinally);
@@ -236,5 +244,29 @@ export const useResourceStore = defineStore({
return changedVersion;
});
},
+ setLatestResource(
+ resourceVersion: ResourceVersionOut,
+ ): Promise<ResourceVersionOut> {
+ return ResourceVersionService.resourceVersionResourceVersionLatest(
+ resourceVersion.resource_id,
+ resourceVersion.resource_version_id,
+ );
+ },
+ deleteOnCluster(
+ resourceVersion: ResourceVersionOut,
+ ): Promise<ResourceVersionOut> {
+ return ResourceVersionService.resourceVersionDeleteResourceVersionCluster(
+ resourceVersion.resource_id,
+ resourceVersion.resource_version_id,
+ );
+ },
+ deleteInS3(
+ resourceVersion: ResourceVersionOut,
+ ): Promise<ResourceVersionOut> {
+ return ResourceVersionService.resourceVersionDeleteResourceVersionS3(
+ resourceVersion.resource_id,
+ resourceVersion.resource_version_id,
+ );
+ },
},
});
diff --git a/src/views/admin/AdminResourcesView.vue b/src/views/admin/AdminResourcesView.vue
index 380187c..d75b3f5 100644
--- a/src/views/admin/AdminResourcesView.vue
+++ b/src/views/admin/AdminResourcesView.vue
@@ -3,6 +3,7 @@ import { useResourceStore } from "@/stores/resources";
import { reactive } from "vue";
import {
type ResourceOut,
+ type ResourceVersionOut,
Status,
} from "@/client/resource";
import SearchUserModal from "@/components/modals/SearchUserModal.vue";
@@ -53,6 +54,66 @@ function searchResources() {
});
}
+function replaceResourceVersion(
+ resourceVersion: ResourceVersionOut,
+): ResourceVersionOut {
+ const resourceIndex = resourceState.resources.findIndex(
+ (r) => r.resource_id == resourceVersion.resource_id,
+ );
+ if (resourceIndex > -1) {
+ const versionIndex = resourceState.resources[
+ resourceIndex
+ ].versions.findIndex(
+ (r) => r.resource_version_id == resourceVersion.resource_version_id,
+ );
+ if (versionIndex > -1) {
+ resourceState.resources[resourceIndex].versions[versionIndex] =
+ resourceVersion;
+ }
+ }
+ return resourceVersion;
+}
+
+function setLatest(resourceVersion: ResourceVersionOut) {
+ resourceState.loading = true;
+ resourceRepository
+ .setLatestResource(resourceVersion)
+ .then(replaceResourceVersion)
+ .finally(() => {
+ resourceState.loading = false;
+ });
+}
+
+function deleteOnCluster(resourceVersion: ResourceVersionOut) {
+ resourceState.loading = true;
+ resourceRepository
+ .deleteOnCluster(resourceVersion)
+ .then(replaceResourceVersion)
+ .finally(() => {
+ resourceState.loading = false;
+ });
+}
+
+function deleteInS3(resourceVersion: ResourceVersionOut) {
+ resourceState.loading = true;
+ resourceRepository
+ .deleteInS3(resourceVersion)
+ .then(replaceResourceVersion)
+ .finally(() => {
+ resourceState.loading = false;
+ });
+}
+
+function syncToCluster(resourceVersion: ResourceVersionOut) {
+ resourceState.loading = true;
+ resourceRepository
+ .syncResource(resourceVersion)
+ .then(replaceResourceVersion)
+ .finally(() => {
+ resourceState.loading = false;
+ });
+}
+
function resetForm() {
resourceState.maintainerId = "";
resourceState.searchString = "";
@@ -136,7 +197,12 @@ function resetForm() {
>
Search
</button>
- <button type="button" class="btn-primary btn w-fit ms-4" @click="resetForm">
+ <button
+ type="button"
+ class="btn-primary btn w-fit ms-4"
+ :disabled="resourceState.loading"
+ @click="resetForm"
+ >
Reset
</button>
</form>
@@ -213,21 +279,61 @@ function resetForm() {
class="btn btn-secondary dropdown-toggle dropdown-toggle-split"
data-bs-toggle="dropdown"
aria-expanded="false"
+ :disabled="resourceState.loading"
>
<span class="visually-hidden">Toggle Dropdown</span>
</button>
<ul class="dropdown-menu">
- <li><a class="dropdown-item" href="#">Action</a></li>
- <li>
- <a class="dropdown-item" href="#">Another action</a>
+ <li v-if="version.status === Status.SYNCHRONIZED">
+ <button
+ class="dropdown-item"
+ type="button"
+ @click="setLatest(version)"
+ >
+ Set to Latest
+ </button>
+ </li>
+ <li
+ v-if="
+ version.status === Status.CLUSTER_DELETED ||
+ version.status === Status.SYNC_REQUESTED
+ "
+ >
+ <button
+ class="dropdown-item"
+ type="button"
+ @click="syncToCluster(version)"
+ >
+ <font-awesome-icon
+ icon="fa-solid fa-cloud-arrow-down"
+ />
+ <span class="ms-1">Sync to Cluster</span>
+ </button>
</li>
- <li>
- <a class="dropdown-item" href="#"
- >Something else here</a
+ <li
+ v-if="
+ version.status === Status.SYNCHRONIZED ||
+ version.status === Status.LATEST
+ "
+ >
+ <button
+ class="dropdown-item text-danger align-middle"
+ type="button"
+ @click="deleteOnCluster(version)"
>
+ <font-awesome-icon icon="fa-solid fa-trash" />
+ <span class="ms-1">Delete on Cluster</span>
+ </button>
</li>
- <li>
- <a class="dropdown-item" href="#">Separated link</a>
+ <li v-if="version.status === Status.CLUSTER_DELETED">
+ <button
+ class="dropdown-item text-danger align-middle"
+ type="button"
+ @click="deleteInS3(version)"
+ >
+ <font-awesome-icon icon="fa-solid fa-trash" />
+ <span class="ms-1">Delete in S3</span>
+ </button>
</li>
</ul>
</div>
diff --git a/src/views/resources/ReviewResourceView.vue b/src/views/resources/ReviewResourceView.vue
index b1477b5..f9dc9ea 100644
--- a/src/views/resources/ReviewResourceView.vue
+++ b/src/views/resources/ReviewResourceView.vue
@@ -161,8 +161,8 @@ onMounted(() => {
</template>
</tbody>
</table>
- <div v-else>
- <p>Hello</p>
+ <div v-else class="text-center mt-5 fs-4">
+ There are currently no Resources to review
</div>
</template>
--
GitLab