From 3e0b0a87e940d13192a870c302e36a1e9672731c Mon Sep 17 00:00:00 2001 From: Mahmoud <“aljouhar@rptu.de”> Date: Wed, 13 Dec 2023 15:03:15 +0100 Subject: [PATCH] Basic Implementation for reordering books --- vue/src/apps/CookbookView/CookbookView.vue | 110 +++++++++++++++++++-- 1 file changed, 102 insertions(+), 8 deletions(-) diff --git a/vue/src/apps/CookbookView/CookbookView.vue b/vue/src/apps/CookbookView/CookbookView.vue index bc922d7e..73730056 100644 --- a/vue/src/apps/CookbookView/CookbookView.vue +++ b/vue/src/apps/CookbookView/CookbookView.vue @@ -11,6 +11,12 @@ + + oldest to newest + newest to oldest + alphabetical order + manually + @@ -19,22 +25,34 @@
-
+
-
- - - +
+ + + -
+ +
{{ book.name }} -
+
{{ book.description }}
+ + + + + + + + swap + + +
@@ -94,6 +112,13 @@ export default { current_book: undefined, loading: false, search: "", + dropdown_text: "Sort by: oldest to newest", + showOtN: false, + showNtO: true, + showAlp: true, + showMan: true, + md: 12, + inputValue: "" } }, computed: { @@ -168,7 +193,76 @@ export default { } }) }, - }, + sortAlphabetical: function(){ + this.dropdown_text = "Sort by: alphabetical order" + this.cookbooks = this.cookbooks.sort((a, b) => a.name.localeCompare(b.name)) + this.showAlp= false + this.showNtO = true + this.showOtN = true + this.showMan = true + this.md = 12 + + }, + sortNewest: function(){ + this.dropdown_text = "Sort by: newest to oldest" + this.cookbooks = this.cookbooks.sort((a, b) => b.id - a.id); + this.showNtO = false + this.showAlp= true + this.showOtN = true + this.showMan = true + this.md = 12 + }, + sortOldest: function(){ + this.dropdown_text = "Sort by: oldest to newest" + this.cookbooks = this.cookbooks.sort((a, b) => a.id - b.id) + this.showOtN= false + this.showAlp= true + this.showNtO = true + this.showMan = true + this.md = 12 + }, + enableSortManually: function(){ + this.showOtN= true + this.showAlp= true + this.showNtO = true + this.showMan = false + this.md = 8 + this.dropdown_text = "Sort by: manually" + + }, + swapUpBooks: function(index){ + const tempArray = this.cookbooks + const temp = tempArray[index - 1] + tempArray[index-1] = tempArray[index] + tempArray[index] = temp + this.cookbooks = [] + this.cookbooks = tempArray + }, + swapDownBooks: function(index){ + const tempArray = this.cookbooks + const temp = tempArray[index + 1] + tempArray[index+1] = tempArray[index] + tempArray[index] = temp + this.cookbooks = [] + this.cookbooks = tempArray + }, + swapWithPos: function(index){ + const position = parseInt(this.inputValue) + this.inputValue = "" + if (!(/^\d+$/.test(position)) || position >= this.cookbooks.length || position < 0){ + console.log("catch") + this.inputValue = "" + } else { + const tempArray = this.cookbooks + const temp = tempArray[position] + tempArray[position] = tempArray[index] + tempArray[index] = temp + this.cookbooks = [] + this.cookbooks = tempArray + } + + } + }, directives: { hover: { inserted: function (el) {