1

src/store/index.js

@@ -1,8 +1,9 @@
 import Vue from 'vue';
 import Vuex from 'vuex';
-import refute from './refute';
 import login from './login';
 import upload from './upload';
+import refute from './refute';
+import topic from './topic';
 
 Vue.use(Vuex);
 
@@ -21,8 +22,9 @@ export default new Vuex.Store({
   },
   actions: {},
   modules: {
-    refute,
     login,
     upload,
+    refute,
+    topic,
   },
 });

src/store/topic.js

@@ -0,0 +1,40 @@
+import Vue from 'vue';
+import Vuex from 'vuex';
+import _ from 'lodash';
+Vue.use(Vuex);
+const api = {
+  topic: `/api/article/topic`,
+};
+const state = () => ({});
+const mutations = {};
+
+const actions = {
+  async query({ commit }, { skip = 0, limit, ...info } = {}) {
+    const res = await this.$axios.$get(api.topic, { skip, limit, ...info });
+    return res;
+  },
+  async create({ commit }, payload) {
+    const res = await this.$axios.$post(`${api.topic}`, payload);
+    return res;
+  },
+  async fetch({ commit }, payload) {
+    const res = await this.$axios.$get(`${api.topic}/${payload}`);
+    return res;
+  },
+  async update({ commit }, { id, ...info } = {}) {
+    const res = await this.$axios.$post(`${api.topic}/update/${id}`, {
+      ...info,
+    });
+    return res;
+  },
+  async delete({ commit }, payload) {
+    const res = await this.$axios.$delete(`${api.topic}/${payload}`);
+    return res;
+  },
+};
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions,
+};

src/views/community/detail.vue

@@ -32,6 +32,7 @@ import info from './parts/info.vue';
 import comment from './parts/comment.vue';
 import top from '@/layout/common/top.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: mapTopic } = createNamespacedHelpers('topic');
 export default {
   name: 'detail',
   props: {},
@@ -44,19 +45,7 @@ export default {
     return {
       clientHeight: '',
       // 话题正文
-      detailInfo: {
-        content:
-          '文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容',
-        origin: '文章来源',
-        renew_time: '2021-02-01 10:00:00',
-        type: '0',
-        imgUrl: [
-          { name: '图片名称', url: require('@a/news1.jpg') },
-          { name: '图片名称1', url: require('@a/news1.jpg') },
-          { name: '图片名称2', url: require('@a/news1.jpg') },
-        ],
-        fileUrl: require('@a/video1.mp4'),
-      },
+      detailInfo: {},
       // 评论
       active: 'first',
       // 用户评论列表
@@ -90,8 +79,14 @@ export default {
     this.$set(this, `clientHeight`, clientHeight);
   },
   methods: {
-    search({ skip = 0, limit = 10, ...info } = {}) {
-      console.log('');
+    ...mapTopic(['fetch']),
+    async search() {
+      if (this.id) {
+        let res = await this.fetch(this.id);
+        if (this.$checkRes(res)) {
+          this.$set(this, `detailInfo`, res.data);
+        }
+      }
     },
     // 返回上一页
     upBack() {
@@ -100,6 +95,9 @@ export default {
   },
   computed: {
     ...mapState(['user']),
+    id() {
+      return this.$route.query.id;
+    },
   },
   metaInfo() {
     return { title: this.$route.meta.title };

src/views/community/index.vue

@@ -21,6 +21,7 @@ import list from './parts/list.vue';
 import top from '@/layout/common/top.vue';
 import page from '@/layout/common/page.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: mapTopic } = createNamespacedHelpers('topic');
 export default {
   name: 'index',
   props: {},
@@ -33,36 +34,6 @@ export default {
     return {
       clientHeight: '',
       communityList: [
-        {
-          content:
-            '文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容',
-          origin: '文章来源',
-          renew_time: '2021-02-01 10:00:00',
-          type: '0',
-          imgUrl: [
-            { name: '图片名称', url: require('@a/news1.jpg') },
-            // { name: '图片名称1', url: require('@a/news1.jpg') },
-            // { name: '图片名称2', url: require('@a/news1.jpg') },
-          ],
-          fileUrl: require('@a/video1.mp4'),
-          website: 'http://broadcast.waityou24.cn/platlive/home.html',
-          read: 10,
-        },
-        {
-          content:
-            '文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容',
-          origin: '文章来源',
-          renew_time: '2021-02-01 10:00:00',
-          type: '0',
-          imgUrl: [
-            { name: '图片名称', url: require('@a/news1.jpg') },
-            { name: '图片名称1', url: require('@a/news1.jpg') },
-            { name: '图片名称2', url: require('@a/news1.jpg') },
-          ],
-          fileUrl: require('@a/video1.mp4'),
-          website: 'http://broadcast.waityou24.cn/platlive/home.html',
-          read: 10,
-        },
         {
           content:
             '文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容文章内容',
@@ -72,7 +43,6 @@ export default {
           imgUrl: [
             { name: '图片名称', url: require('@a/news1.jpg') },
             { name: '图片名称1', url: require('@a/news1.jpg') },
-            { name: '图片名称2', url: require('@a/news1.jpg') },
           ],
           fileUrl: require('@a/video1.mp4'),
           website: 'http://broadcast.waityou24.cn/platlive/home.html',
@@ -90,8 +60,14 @@ export default {
     this.$set(this, `clientHeight`, clientHeight);
   },
   methods: {
-    search({ skip = 0, limit = 10, searchName, ...info } = {}) {
-      console.log(searchName);
+    ...mapTopic(['query']),
+    async search({ skip = 0, limit = 5, searchName, ...info } = {}) {
+      if (searchName) info.content = searchName;
+      let res = await this.query({ skip, limit, ...info });
+      if (this.$checkRes(res)) {
+        this.$set(this, `communityList`, res.data);
+        this.$set(this, `total`, res.total);
+      }
     },
     // 话题正文
     detailBtn(data) {

src/views/refute/index.vue

@@ -22,7 +22,6 @@ import top from '@/layout/common/top.vue';
 import page from '@/layout/common/page.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
 const { mapActions: mapRefute } = createNamespacedHelpers('refute');
-
 export default {
   name: 'index',
   props: {},
@@ -34,62 +33,7 @@ export default {
   data: function() {
     return {
       clientHeight: '',
-      refuteList: [
-        {
-          imgUrl: require('@a/news1.jpg'),
-          title: '全球粮价波动将影响国内？商务部食用农产品间隔难以大幅度',
-          renew_time: '2021-03-25 21:12:44',
-          num: 10000,
-        },
-        {
-          imgUrl: require('@a/news1.jpg'),
-          title: '全球粮价波动将影响国内？商务部食用农产品间隔难以大幅度',
-          renew_time: '2021-03-25 21:12:44',
-          num: 10,
-        },
-        {
-          imgUrl: require('@a/news1.jpg'),
-          title: '全球粮价波动将影响国内？商务部食用农产品间隔难以大幅度',
-          renew_time: '2021-03-25 21:12:44',
-          num: 100,
-        },
-        {
-          imgUrl: require('@a/news1.jpg'),
-          title: '全球粮价波动将影响国内？商务部食用农产品间隔难以大幅度',
-          renew_time: '2021-03-25 21:12:44',
-          num: 1000,
-        },
-        {
-          imgUrl: require('@a/news1.jpg'),
-          title: '全球粮价波动将影响国内？商务部食用农产品间隔难以大幅度',
-          renew_time: '2021-03-25 21:12:44',
-          num: 10,
-        },
-        {
-          imgUrl: require('@a/news1.jpg'),
-          title: '全球粮价波动将影响国内？商务部食用农产品间隔难以大幅度',
-          renew_time: '2021-03-25 21:12:44',
-          num: 10,
-        },
-        {
-          imgUrl: require('@a/news1.jpg'),
-          title: '全球粮价波动将影响国内？商务部食用农产品间隔难以大幅度',
-          renew_time: '2021-03-25 21:12:44',
-          num: 10,
-        },
-        {
-          imgUrl: require('@a/news1.jpg'),
-          title: '全球粮价波动将影响国内？商务部食用农产品间隔难以大幅度',
-          renew_time: '2021-03-25 21:12:44',
-          num: 10,
-        },
-        {
-          imgUrl: require('@a/news1.jpg'),
-          title: '全球粮价波动将影响国内？商务部食用农产品间隔难以大幅度',
-          renew_time: '2021-03-25 21:12:44',
-          num: 10,
-        },
-      ],
+      refuteList: [],
       total: 0,
     };
   },