studio/flamenco
studio/flamenco
12
30
Fork 38
Code Issues 63 Pull Requests 5 Releases Wiki Activity

Web Interface for Tags #104244

Merged
Sybren A. Stüvel merged 30 commits from Evelinealy/flamenco:tag-interface into main 2023-09-04 13:06:10 +02:00
Conversation 6 Commits 30 Files Changed 3 +25 -8
1 changed files with 25 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 7461c7d44f - Show all commits

33
web/app/src/views/TagsView.vue
View File

@ -11,7 +11,12 @@
<div class="action-buttons"> <div class="action-buttons">
<form @submit="createTag"> <form @submit="createTag">
<input type="text" name="newtagname" v-model="newTagName" placeholder="New Tag Name"> <input
type="text"
name="newtagname"
v-model="newTagName"
placeholder="New Tag Name"
/>
<button type="submit">Create Tag</button> <button type="submit">Create Tag</button>
</form> </form>
</div> </div>
@ -105,8 +110,8 @@
<script> <script>
import { useWorkers } from "@/stores/workers"; import { useWorkers } from "@/stores/workers";
import { useNotifs } from "@/stores/notifications"; import { useNotifs } from "@/stores/notifications";
import { WorkerMgtApi } from '@/manager-api'; import { WorkerMgtApi } from "@/manager-api";
import { WorkerTag } from '@/manager-api'; import { WorkerTag } from "@/manager-api";
import { getAPIClient } from "@/api-client"; import { getAPIClient } from "@/api-client";
import TabItem from "@/components/TabItem.vue"; import TabItem from "@/components/TabItem.vue";
import TabsWrapper from "@/components/TabsWrapper.vue"; import TabsWrapper from "@/components/TabsWrapper.vue";
@ -134,7 +139,8 @@ export default {
methods: { methods: {
fetchTags() { fetchTags() {
this.workers.refreshTags() this.workers
.refreshTags()
.then(() => { .then(() => {
this.tags = this.workers.tags; this.tags = this.workers.tags;
}) })
@ -150,7 +156,8 @@ export default {
const api = new WorkerMgtApi(getAPIClient()); const api = new WorkerMgtApi(getAPIClient());
const newTag = new WorkerTag(this.newTagName); const newTag = new WorkerTag(this.newTagName);
Sybren A. Stüvel commented 2023-08-21 09:29:32 +02:00
Outdated
Review
Copy Link

Not sure why this is implemented in a separate function, it could just all be part of the onRowClick event handler.

Not sure why this is implemented in a separate function, it could just all be part of the `onRowClick` event handler.
api.createWorkerTag(newTag) api
.createWorkerTag(newTag)
.then(this.fetchTags) .then(this.fetchTags)
Sybren A. Stüvel commented 2023-08-21 09:31:39 +02:00
Outdated
Review
Copy Link

This alone is not enough to update all the rows in the table. When I click one tag, and then another, both appear as if they're selected. You probably need to force a redraw of the table somehow (there's a Tabulator API call for this).

This alone is not enough to update all the rows in the table. When I click one tag, and then another, both appear as if they're selected. You probably need to force a redraw of the table somehow (there's a Tabulator API call for this).
.catch((error) => { .catch((error) => {
const errorMsg = JSON.stringify(error); const errorMsg = JSON.stringify(error);
@ -166,10 +173,20 @@ export default {
return; return;
} }
// Find the index of the selected tag in the tags array // Find the index of the selected tag in the tags array
const index = this.tags.findIndex((tag) => tag === this.selectedTag); const index = this.tags.findIndex((tag) => tag.id === this.selectedTag.id);
if (index !== -1) { if (index !== -1) {
this.tags.splice(index, 1); const api = new WorkerMgtApi(getAPIClient());
this.selectedTag = null;
api
.deleteWorkerTag(this.selectedTag.id)
.then(() => {
this.tags.splice(index, 1);
this.selectedTag = null;
})
.catch((error) => {
const errorMsg = JSON.stringify(error);
useNotifs().add(`Error: ${errorMsg}`);
});
} }
}, },