getBible/app
4
2
Fork 0
mirror of https://github.com/getbible/app.git synced 2024-12-22 15:58:55 +00:00
Code

and interaction with store

Browse Source
This commit is contained in:
Erastus Amunwe 2020-10-26 23:08:45 +02:00
parent b000c34300
commit e8f2ebc2a3
1 changed files with 29 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/components/NavBar.vue
View File

@ -29,15 +29,17 @@
<div> <div>
<ul class="uk-list uk-list-large uk-list-divider"> <ul class="uk-list uk-list-large uk-list-divider">
<li <li
v-for="(tr,i) in Object.keys(savedTranslations)" v-for="(tr,i) in savedTranslations"
:key="i" :key="i"
><div><span>{{savedTranslations[tr]["language"]?`(${savedTranslations[tr]["language"]})`:null}} {{savedTranslations[tr]['translation']}}</span> <a class="uk-position-center-right uk-position-relative"><span uk-icon="icon: minus-circle;"></span></a> ><div><span>{{tr["language"]?`(${tr["language"]})`:null}} {{tr['translation']}}</span>
{{" "}}<a @click="remove(tr.abbreviation)" class="uk-position-center-right uk-position-relative"><span uk-icon="icon: minus-circle;"></span></a>
</div> </li> </div> </li>
<li v-if="!savedTranslations.length">No saved translation</li>
<li> <li>Add
<div uk-form-custom="target: > * > span:first-child"> <div uk-form-custom="target: > * > span:first-child">
<select> <select v-model="translation">
<option value="">Add Translation...</option> <option selected value="Add Translation...">Add Translation...</option>
<option <option
v-for="(tr,i) in Object.keys(translations)" v-for="(tr,i) in Object.keys(translations)"
:key="i" :key="i"
@ -50,7 +52,7 @@
<span uk-icon="icon: chevron-down"></span> <span uk-icon="icon: chevron-down"></span>
</button> </button>
</div> </div>
<a><span uk-icon="icon: plus-circle; ratio:2"></span></a> <a @click="add(translations[translation])" :class="{disabled:!translations[translation]}"><span uk-icon="icon: plus-circle; ratio:2"></span></a>
</li> </li>
</ul> </ul>
@ -71,23 +73,33 @@
export default { export default {
data: () => { data: () => {
return { return {
translation: 'Add Translation...',
translations: {}, translations: {},
} }
}, },
computed: { computed: {
savedTranslations() { savedTranslations() {
let o = {} // let o = {}
let counter = 0 // let counter = 0
for(const tr in this.translations){ // for(const tr in this.translations){
if(counter>2) // if(counter>2)
break; // break;
o = {...o, [tr]:this.translations[tr]} // o = {...o, [tr]:this.translations[tr]}
counter +=1 // counter +=1
// Object.assign({}, o,{[tr]: this.translations[tr]}) // // Object.assign({}, o,{[tr]: this.translations[tr]})
} // }
console.log(o); // console.log(o);
return o return this.$store.state.settings.savedTr;
}
},
methods: {
add(tr){
if(!tr) return;
this.$store.dispatch('add', tr)
},
remove(tr){
this.$store.dispatch('remove', tr)
} }
}, },
async created(){ async created(){