뉴스출저필터추가

pages/index.vue

@@ -124,7 +124,7 @@
                 <div class="md-title">
                   <a :href="headline.url" target="_blank">{{ headline.title }}</a>
                 </div>
-                <div>
+                <div @click="loadSource(headline.source.id)">
                   {{ headline.source.name }}
                   <md-icon class="small-icon">
                     book
@@ -202,6 +202,9 @@ export default {
     feed () {
       return this.$store.getters.feed
     },
+    source () {
+      return this.$store.getters.source
+    },
     isAuthenticated () {
       return this.$store.getters.isAuthenticated
     }
@@ -226,6 +229,12 @@ export default {
     logoutUser () {
       this.$store.dispatch('logoutUser')
     },
+    async loadSource (sourceId) {
+      if (sourceId) {
+        this.$store.commit('setSource', sourceId)
+        await this.$store.dispatch('loadHeadLines', `/api/top-headlines?sources=${this.source}`)
+      }
+    },
     async removeHeadlineFromFeed (headline) {
       await this.$store.dispatch('removeHeadlineFromFeed', headline)
     },

store/index.js

@@ -14,7 +14,8 @@ const createStore = () => {
       category: '',
       token: null,
       country: 'us',
-      user: null
+      user: null,
+      source: ''
     },
     mutations: {
       setHeadLines (state, headlines) {
@@ -41,6 +42,9 @@ const createStore = () => {
       setFeed (state, headlines) {
         state.feed = headlines
       },
+      setSource (state, source) {
+        state.source = source
+      },
       clearToken: state => (state.token = null),
       clearUser: state => (state.user = null),
       clearFeed: state => (state.feed = [])
@@ -225,7 +229,8 @@ const createStore = () => {
       category: state => state.category,
       country: state => state.country,
       isAuthenticated: state => !!state.token,
-      user: state => state.user
+      user: state => state.user,
+      source: state => state.source
     }
   })
 }