last changes
This commit is contained in:
parent
3e0b0a87e9
commit
e423fc1df4
@ -18,6 +18,9 @@
|
||||
<b-dropdown-item @click = " enableSortManually" v-show="showMan">manually</b-dropdown-item>
|
||||
</b-dropdown>
|
||||
</b-input-group-append>
|
||||
<b-button class= "ml-2" variant="primary" v-show="!showMan" @click="submitManualChanging">
|
||||
{{submitText}}
|
||||
</b-button>
|
||||
</b-input-group>
|
||||
</div>
|
||||
</div>
|
||||
@ -33,10 +36,10 @@
|
||||
<b-col no-gutters :md="md" style="height: inherit">
|
||||
<b-card-body class="m-0 py-0" style="height: inherit">
|
||||
<b-card-text class="h-100 my-0 d-flex flex-column" style="text-overflow: ellipsis">
|
||||
<b-button variant="primary" v-on:click="openBook(book.id)">
|
||||
<b-button v-on:click="openBook(book.id)" style="color: #000; background-color: white" variant="primary">
|
||||
<h5 class="m-0 mt-1 text-truncate" >
|
||||
{{ book.name }} <span class="float-right"><i class="fa fa-book"></i></span>
|
||||
</h5></b-button>
|
||||
</h5></b-button>
|
||||
<div class="m-0 text-truncate">{{ book.description }}</div>
|
||||
<div class="mt-auto mb-1 d-flex flex-row justify-content-end"></div>
|
||||
</b-card-text>
|
||||
@ -44,14 +47,13 @@
|
||||
</b-col>
|
||||
<b-col>
|
||||
<b-button-group vertical md = "1" >
|
||||
<b-button v-if="!showMan && index != 0" variant="primary" style="border-radius:28px!important;" @click= "swapUpBooks(index)">↑</b-button>
|
||||
<b-button v-if="!showMan && index != cookbooks.length-1" variant="primary" style="border-radius:28px!important;" @click= "swapDownBooks(index)">↓</b-button>
|
||||
<b-button v-if="!showMan && index != 0 && submitManual " variant="primary" style="border-radius:28px!important;" @click= "swapUpBooks(index)">↑</b-button>
|
||||
<b-button v-if="!showMan && index != cookbooks.length-1 && submitManual" variant="primary" style="border-radius:28px!important;" @click= "swapDownBooks(index)">↓</b-button>
|
||||
</b-button-group>
|
||||
<b-button-group vertical md = "1" class="ml-2">
|
||||
<input v-model.lazy="inputValue" v-if="!showMan" placeholder="enter swap position">
|
||||
<b-button v-if="!showMan" variant="primary" style="border-radius:28px!important;" @click= "swapWithPos(index)">swap</b-button>
|
||||
<input v-model.lazy="inputValue" v-if="!showMan && submitManual" placeholder="enter swap position">
|
||||
<b-button v-if="!showMan && submitManual" variant="primary" style="border-radius:28px!important;" @click= "swapWithPos(index)">swap</b-button>
|
||||
</b-button-group>
|
||||
|
||||
</b-col>
|
||||
</b-row>
|
||||
</b-card>
|
||||
@ -118,7 +120,9 @@ export default {
|
||||
showAlp: true,
|
||||
showMan: true,
|
||||
md: 12,
|
||||
inputValue: ""
|
||||
inputValue: "",
|
||||
submitManual: false,
|
||||
submitText: "Edit"
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@ -200,6 +204,7 @@ export default {
|
||||
this.showNtO = true
|
||||
this.showOtN = true
|
||||
this.showMan = true
|
||||
this.submitManual = false
|
||||
this.md = 12
|
||||
|
||||
},
|
||||
@ -210,6 +215,7 @@ export default {
|
||||
this.showAlp= true
|
||||
this.showOtN = true
|
||||
this.showMan = true
|
||||
this.submitManual = false
|
||||
this.md = 12
|
||||
},
|
||||
sortOldest: function(){
|
||||
@ -219,16 +225,22 @@ export default {
|
||||
this.showAlp= true
|
||||
this.showNtO = true
|
||||
this.showMan = true
|
||||
this.submitManual = false
|
||||
this.md = 12
|
||||
},
|
||||
enableSortManually: function(){
|
||||
console.log(1)
|
||||
this.synchroniseLocalToDatabase();
|
||||
console.log(2)
|
||||
if (localStorage.getItem('cookbooks') ){
|
||||
this.cookbooks = JSON.parse(localStorage.getItem('cookbooks'))
|
||||
}
|
||||
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
|
||||
@ -250,7 +262,6 @@ export default {
|
||||
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
|
||||
@ -261,6 +272,32 @@ export default {
|
||||
this.cookbooks = tempArray
|
||||
}
|
||||
|
||||
}, submitManualChanging: function(){
|
||||
if (!this.submitManual){
|
||||
this.submitText = "Submit"
|
||||
this.submitManual = true
|
||||
this.md = 8
|
||||
} else {
|
||||
localStorage.setItem('cookbooks',JSON.stringify(this.cookbooks))
|
||||
this.submitText = "Edit"
|
||||
this.submitManual = false
|
||||
this.md = 12
|
||||
}
|
||||
}, synchroniseLocalToDatabase: function(){
|
||||
const localStorageData = localStorage.getItem('cookbooks');
|
||||
const localStorageArray = JSON.parse(localStorageData) || [];
|
||||
const updatedLocalStorageArray = localStorageArray.filter(localStorageElement => {
|
||||
// Assuming there's a unique identifier in your objects, replace 'id' with the actual property
|
||||
const isElementInTargetArray = this.cookbooks.some(targetElement => targetElement.id === localStorageElement.id);
|
||||
return isElementInTargetArray;
|
||||
});
|
||||
this.cookbooks.forEach(targetElement => {
|
||||
const isNewElement = !updatedLocalStorageArray.some(localStorageElement => localStorageElement.id === targetElement.id);
|
||||
if (isNewElement) {
|
||||
updatedLocalStorageArray.push(targetElement);
|
||||
}
|
||||
});
|
||||
localStorage.setItem('cookbooks', JSON.stringify(updatedLocalStorageArray));
|
||||
}
|
||||
},
|
||||
directives: {
|
||||
|
Loading…
Reference in New Issue
Block a user