mirror of
https://github.com/Dannecron/ich-lerne-deutsch.git
synced 2025-12-25 12:52:35 +03:00
Migrate data to firebase firestore
This commit is contained in:
@@ -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 } }">
|
||||
Открыть
|
||||
|
||||
@@ -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');
|
||||
|
||||
@@ -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',
|
||||
},
|
||||
{
|
||||
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',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
articles: [],
|
||||
},
|
||||
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: 'Бла',
|
||||
},
|
||||
{
|
||||
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: 'Привет',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
commit('setArticles', articles);
|
||||
})
|
||||
.catch(e => console.error(e));
|
||||
},
|
||||
},
|
||||
getters: {
|
||||
getArticles: state => state.articles,
|
||||
},
|
||||
mutations: {
|
||||
setArticles(state, payload) {
|
||||
state.articles = payload;
|
||||
},
|
||||
},
|
||||
getters: {
|
||||
getArticles: state => state.articles,
|
||||
getParts: state => state.articleParts,
|
||||
},
|
||||
};
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user