Migrate data to firebase firestore

This commit is contained in:
2019-03-03 12:18:49 +07:00
parent 9ec5708464
commit 22ae5f09d2
4 changed files with 57 additions and 168 deletions

View File

@@ -4,7 +4,7 @@
<v-layout row>
<v-flex xs4 md3>
<v-img
src="https://images-na.ssl-images-amazon.com/images/I/51U6bQbA8oL._SY346_.jpg"
:src="article.imageUrl"
v-bind:height="expandDetails ? '150px' : '100px'"
>
</v-img>
@@ -36,11 +36,11 @@
<v-layout row>
<v-flex xs12>
<v-card-actions>
<v-rating v-model="article.rating" color="yellow" readonly dense half-increments></v-rating>
<!-- <v-rating v-model="article.rating" color="yellow" readonly dense half-increments></v-rating>
<div class="ml-1">
<span>{{ article.rating }}</span>
<span>({{ article.ratingsCount }})</span>
</div>
</div> -->
<v-spacer></v-spacer>
<v-btn v-if="!expandDetails" class="primary" flat :to="{ name: 'article', params: { articleId: article.id } }">
Открыть

View File

@@ -4,6 +4,7 @@ import firebase from 'firebase/app';
import VuetifyConfirm from 'vuetify-confirm';
import VueYouTubeEmbed from 'vue-youtube-embed';
import 'firebase/auth';
import 'firebase/firestore';
import 'vuetify/dist/vuetify.min.css';
import 'material-design-icons-iconfont/dist/material-design-icons.css';
@@ -13,9 +14,12 @@ import router from '@/router';
import store from '@/store';
import firebaseConfig from '@/config/firebase';
firebase.initializeApp(firebaseConfig);
const firebaseApp = firebase.initializeApp(firebaseConfig);
const db = firebaseApp.firestore();
Vue.config.productionTip = false;
Vue.$db = db;
Vue.use(Vuetify);
Vue.use(VuetifyConfirm, {
buttonTrueText: 'Да',
@@ -32,5 +36,7 @@ new Vue({
firebase.auth().onAuthStateChanged((user) => {
this.$store.dispatch('stateChanged', user);
});
this.$store.dispatch('loadArticles');
}
}).$mount('#app');

View File

@@ -1,167 +1,39 @@
import Vue from 'vue';
export default {
state: {
articles: [
{
id: 'sgjngsnaada312',
title: 'Harry Potter und Stein der Weisen - 1',
description: 'Первая глава первой книги о Гарри Поттере',
imageId: 'asfgdfhmfgn131',
level: ['B2', 'C1'],
rating: 4,
ratingsCount: 164,
youtubePlaylistId: 'asdadsadad',
parts: [
{
id: 'asdasdad123',
title: 'kapitel 1',
youtubeId: 'asdasdad1',
articles: [],
},
{
id: 'asdasdad124',
title: 'kapitel 2',
youtubeId: 'asdasdad2',
},
{
id: 'asdasdad125',
title: 'kapitel 3',
youtubeId: 'asdasdad3',
},
{
id: 'asdasdad126',
title: 'kapitel 4',
youtubeId: 'asdasdad4',
},
],
},
{
id: 'sgjngsnaadasd2',
title: 'Harry Potter und Stein der Weisen - 2',
description: 'Вторая глава первой книги о Гарри Поттере',
imageId: 'asfgdf111hmfgn131',
level: ['B1', 'B2'],
rating: 3.5,
ratingsCount: 55,
youtubePlaylistId: 'asdadsadad234234',
parts: [
{
id: 'bsdasdad123',
title: 'kapitel 1',
youtubeId: 'bsdasdad1',
},
{
id: 'bsdasdad124',
title: 'kapitel 2',
youtubeId: 'bsdasdad2',
},
{
id: 'bsdasdad125',
title: 'kapitel 3',
youtubeId: 'bsdasdad3',
},
],
},
{
id: 'sgjngsdbfd12as',
title: 'Harry Potter und Stein der Weisen - 3',
description: 'Третья глава первой книги о Гарри Поттере',
imageId: 'asfgdfhmfgn13111',
level: ['A2'],
rating: 2,
ratingsCount: 80,
youtubePlaylistId: 'asdadsada435346',
parts: [
{
id: 'bsdasdad123',
title: 'kapitel 1',
youtubeId: 'bsdasdad1',
},
{
id: 'bsdasdad124',
title: 'kapitel 2',
youtubeId: 'bsdasdad2',
},
{
id: 'bsdasdad125',
title: 'kapitel 3',
youtubeId: 'bsdasdad3',
},
],
},
],
actions: {
loadArticles({ commit }) {
Vue.$db.collection('articles')
.get()
.then((querySnapshot) => {
const articles = querySnapshot.docs.map((articleSnap) => {
const data = articleSnap.data();
const { parts } = data;
return {
id: articleSnap.id,
title: data.title,
description: data.description,
imageUrl: data.imageUrl,
level: data.level.slice(),
youtubePlaylistId: data.youtubePlaylistId,
parts: parts ? parts.map(part => Object.assign({}, part)) : [],
};
});
articleParts: [
{
articleId: 'sgjngsnaada312',
articlePartId: 'asdasdad123',
articleTitle: 'Harry Potter und Stein der Weisen - 1',
partTitle: 'kapitel 1',
youtubeId: 'hHW1oY26kxQ',
content: [
{
sentences: [
{
origText: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit.',
transText: 'Бла',
commit('setArticles', articles);
})
.catch(e => console.error(e));
},
{
origText: 'Praesent ligula odio, interdum pretium ligula eu, vehicula consequat nulla. Etiam a massa iaculis, aliquet metus sit amet, varius odio',
transText: 'Бла2',
},
{
origText: 'Suspendisse quis mi eget nisl accumsan molestie in vel lorem. Duis ipsum massa, pharetra nec arcu sed, mattis ultricies neque.',
transText: 'Бла3',
},
{
origText: 'Sed lacinia sed justo sit amet porttitor. Etiam nec nisi nibh. Donec dolor lacus, volutpat in pellentesque vel, accumsan ac nisi.',
transText: 'Бла4',
},
],
},
{
sentences: [
{
origText: 'Etiam magna dui, pulvinar quis finibus malesuada, vulputate non sem. In hendrerit dui sem, a cursus ipsum interdum non.',
transText: у1',
},
{
origText: 'Curabitur porta sagittis lacus.',
transText: у2',
},
],
}
],
words: [
{
origWord: 'Hallo',
transWord: 'Привет',
},
{
origWord: 'Hallo',
transWord: 'Привет',
},
{
origWord: 'Hallo',
transWord: 'Привет',
},
{
origWord: 'Hallo',
transWord: 'Привет',
},
{
origWord: 'Hallo',
transWord: 'Привет',
},
],
},
],
getters: {
getArticles: state => state.articles,
},
mutations: {
setArticles(state, payload) {
state.articles = payload;
},
},
getters: {
getArticles: state => state.articles,
getParts: state => state.articleParts,
},
};

View File

@@ -12,6 +12,7 @@
</template>
<script>
import Vue from 'vue';
import BookPartContent from '@/components/Article/Part/Content';
import BookPartWords from '@/components/Article/Words';
@@ -26,15 +27,25 @@
required: true,
},
},
computed: {
part() {
return this.$store.getters.getParts.find(part => part.articleId === this.articleId
&& part.articlePartId === this.partId);
}
},
components: {
BookPartContent,
BookPartWords,
},
data: () => ({
part: null,
}),
created() {
Vue.$db.collection('articleParts')
.where('articleId', '==', this.articleId)
.where('articlePartId', '==', this.partId)
.get()
.then((querySnapshot) => {
const snapDocs = querySnapshot.docs;
if (snapDocs.length > 0) {
this.part = Object.assign({}, snapDocs[0].data());
}
})
.catch(e => console.error(e));
}
};
</script>