更新

src/store/index.js

@@ -20,6 +20,7 @@ import newmarketproduct from '@common/store/market/newmarketproduct';
 import place from '@common/store/place/place';
 import password from '@common/store/market/password';
 import maarkettype from '@common/store/market/markettype';
+import comment from '@common/store/live/comment';
 
 Vue.use(Vuex);
 
@@ -46,5 +47,6 @@ export default new Vuex.Store({
     place,
     password,
     maarkettype,
+    comment,
   },
 });

src/views/detail/semDetail.vue

@@ -14,7 +14,7 @@
               <el-col :span="21" class="right"> [专题] {{ detail.title }} </el-col>
             </el-col>
             <el-col :span="24" class="twoInfo">
-              <el-col class="list">
+              <el-col :span="24" class="list">
                 <el-col :span="3" class="left">
                   <el-col :span="24" class="leftTop">
                     会员名称
@@ -22,7 +22,7 @@
                   <el-col :span="24" class="leftDown">
                     <el-image :src="squareImage"></el-image>
                     <el-col :span="24" class="jobname">
-                      {{ detail.name }}
+                      {{ detail.uname }}
                     </el-col>
                   </el-col>
                 </el-col>
@@ -40,8 +40,7 @@
                   </el-col>
                 </el-col>
               </el-col>
-
-              <el-col class="list" v-for="(item, index) in list" :key="index">
+              <el-col :span="24" class="list" v-for="(item, index) in list" :key="index">
                 <el-col :span="3" class="left">
                   <el-col :span="24" class="leftTop">
                     会员名称
@@ -56,29 +55,32 @@
                 <el-col :span="21" class="right">
                   <el-col :span="24" class="date">
                     <i class="el-icon-user icon"></i>
-                    <span>评论发布于{{ item.date }}</span>
-                    <span>{{ index + 2 }}楼</span>
+                    <span>评论发布于{{ item.meta }}</span>
+                    <!-- <span>{{ index }}楼</span> -->
                   </el-col>
                   <el-col :span="24" class="info">
-                    <p>{{ item.content }}</p>
+                    <p v-html="item.content"></p>
                   </el-col>
                   <el-col :span="24" class="jubao">
                     <span>举报</span>
                   </el-col>
                 </el-col>
+                <!-- <el-col :span="24">
+                  {{ item.name }}
+                </el-col> -->
               </el-col>
             </el-col>
             <el-col :span="24" class="twoPage">
-              <page :total="total" position="right"></page>
+              <page :total="total" position="right" @query="searchinfo"></page>
             </el-col>
             <el-col :span="24" class="twoInput">
               <el-col :span="3" class="left"> </el-col>
               <el-col :span="21" class="right">
                 <el-col :span="24" class="waneditor">
-                  <wang-editor v-model="inputInfo" ref="editor"></wang-editor>
+                  <wang-editor v-model="form.content" ref="editor"></wang-editor>
                 </el-col>
                 <el-col :span="24" class="btn">
-                  <el-button type="primary">发表评论</el-button>
+                  <el-button type="primary" @click="submit">发表评论</el-button>
                 </el-col>
               </el-col>
             </el-col>
@@ -93,6 +95,7 @@
 import wangEditor from '@/components/wang-editor.vue';
 import page from '@/components/pagination.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: comment } = createNamespacedHelpers('comment');
 const { mapActions: news } = createNamespacedHelpers('news');
 export default {
   name: 'semDetail',
@@ -102,29 +105,14 @@ export default {
     gongqiuImage: require('@/assets/live/111.png'),
     squareImage: require('@/assets/live/222.png'),
     detail: {},
-    list: [
-      {
-        name: '测试人员',
-        date: '2020-02-02',
-        content: '测试内容',
-      },
-      {
-        name: '测试人员',
-        date: '2020-02-02',
-        content: '测试内容',
-      },
-      {
-        name: '测试人员',
-        date: '2020-02-02',
-        content: '测试内容',
-      },
-    ],
-    print: { name: '管理员', date: '2020-05-02', content: '测试内容' },
+    list: [],
     total: 0,
+    form: {},
     inputInfo: '',
   }),
   created() {
     this.search();
+    this.searchinfo();
   },
   computed: {
     id() {
@@ -137,10 +125,24 @@ export default {
   },
   methods: {
     ...news(['fetch']),
+    ...comment({ commentquery: 'query', commentCreate: 'create', commentUpdate: 'update' }),
     async search() {
       const res = await this.fetch(this.id);
       this.$set(this, `detail`, res.data);
     },
+    async searchinfo({ skip = 0, limit = 3, newsid = this.id, ...info } = {}) {
+      const res = await this.commentquery({ skip, limit, newsid, ...info });
+      this.$set(this, `list`, res.data);
+      this.$set(this, `total`, res.total);
+    },
+    async submit() {
+      this.form.newsid = this.id;
+      this.form.uid = this.user.uid;
+      this.form.name = this.user.name;
+      let data = this.form;
+      let res = await this.commentCreate(data);
+      this.$checkRes(res, '发布成功', '请输入内容');
+    },
   },
   filters: {
     getDate(meta) {