ソースを参照

评论模块bug修改

xiaoming_global 5 年 前
コミット
148ad45e5f

+ 66 - 0
src/api/act/submitinfo.js ファイルの表示

@@ -61,6 +61,7 @@ export function EditArticleCategory(id,data){
61 61
 }
62 62
 
63 63
 export function DeleteCategorys(data){
64
+    console.log("data失身",data)
64 65
      return request({
65 66
          url:'/api/acticle/delete',
66 67
          method:'delete',
@@ -214,3 +215,68 @@ export function getReplyAllComents(params){
214 215
        params:params,
215 216
     })
216 217
 }
218
+
219
+export function sendInformation(artilcid,parentid,content){
220
+    const params = {
221
+         artilcid:artilcid,
222
+         parentid:parentid,
223
+         content:content,
224
+     }
225
+     return request({
226
+         url:"/api/article/sendInformation",
227
+         method:'Get',
228
+         params:params,
229
+     })
230
+}
231
+
232
+export function spreadReplay(artilcid,parentid){
233
+  const params = {
234
+      artilcid:artilcid,
235
+      parentid:parentid,
236
+  }
237
+  return request({
238
+      url:"/api/article/spreadReplay",
239
+      method:'Get',
240
+      params:params,
241
+  })
242
+}
243
+
244
+export function clearRelyInfo(id,data){
245
+    console.log("id为:",id)
246
+    return request({
247
+      url:"/api/article/clearRelyInfo?id="+id,
248
+      method:'delete',
249
+      data:data, 
250
+    })  
251
+}
252
+
253
+export function deleteReply(id,data){
254
+   console.log("id为:",id)
255
+   return request({
256
+       url:"/api/article/deleteReply?id="+id,
257
+       method:'delete',
258
+       data:data,
259
+   })
260
+}
261
+
262
+export function openDeleteReply(data){
263
+    console.log("data是",data)
264
+   return request({
265
+       url:"/api/article/openDeleteReply",
266
+       method:"delete",
267
+       data:data,
268
+   })
269
+}
270
+
271
+export function spread(parentid,acticlid){
272
+   const params = {
273
+       parentid:parentid,
274
+       acticlid:acticlid,
275
+   }
276
+
277
+   return request({
278
+       url:"/api/article/spread",
279
+       method:"Get",
280
+       params:params,
281
+   })
282
+}

+ 2 - 1
src/scrm_pages/article/acticleCategory.vue ファイルの表示

@@ -61,7 +61,6 @@
61 61
                     @click="openDelete(scope.row,scope.$index)">
62 62
                   </el-button>
63 63
                 </el-tooltip>
64
-
65 64
               </template>
66 65
             </el-table-column>
67 66
 
@@ -190,6 +189,8 @@
190 189
         },
191 190
           handleSelectionChange(val){
192 191
           this.selectedMembers = val;
192
+          console.log("val是什么",val)
193
+          console.log("val是什么",this.selectedMembers.length)
193 194
         },
194 195
         openDeleteCategorys(){
195 196
             if (this.selectedMembers.length==0) {

+ 59 - 34
src/scrm_pages/article/articleCommentDetail.vue ファイルの表示

@@ -8,7 +8,7 @@
8 8
              <div class="title">{{listQuerty.title}}</div>
9 9
              <div>{{listQuerty.publicTime}}</div>
10 10
              <div class="sort">已按最新热度排序</div>
11
-            <div class="border"></div>            
11
+            <div class="border2"></div>            
12 12
             <div v-for="item in comments" :key="item.id">
13 13
                 <div class="img">
14 14
                     <img :src="item.comment_user_avater" style="width:50px;height:50px">
@@ -19,7 +19,7 @@
19 19
                 </div>
20 20
                 <div class="reply">
21 21
                     |&nbsp;&nbsp;<span  @click="replyComments(item.id)">回复</span>&nbsp;&nbsp;
22
-                    |&nbsp;&nbsp;<span @click="spread()" id="copy" v-show="show">{{word}}</span>&nbsp;&nbsp;|
22
+                    |&nbsp;&nbsp;<span @click="spread(item.id)" id="copy">展开</span>&nbsp;&nbsp;|
23 23
                     &nbsp;&nbsp;删除&nbsp;&nbsp;
24 24
                 </div>
25 25
                 <div class="content">
@@ -33,10 +33,16 @@
33 33
                             <el-button type="primary" @click="send(item)">发送</el-button>
34 34
                        </div>
35 35
                 </div>
36
-                 <div class="reviewed" v-show="shows">
36
+                 <div class="reviewed" v-show="showReply==item.id">
37 37
                      <div v-for="(child) in item.childs" :key="child.id">
38 38
                      你&nbsp;回复了&nbsp;{{item.comment_user_name}}:{{child.content}}
39
-                     <div  id="tub" class="el-icon-error" @click="clear()"></div>
39
+                     <div  id="tub" class="el-icon-error" @click="clear(item.id,index)"></div>
40
+                     </div>
41
+                </div>
42
+                 <div class="reviewed2" v-show="shows==item.id">
43
+                     <div v-for="(items,index) in commentsReplyInfo" :key="items.id">
44
+                     你&nbsp;回复了&nbsp;{{items.comment_user_name}}:{{items.content}}
45
+                     <div  id="tub" class="el-icon-error" @click="clear(items.id,index)"></div>
40 46
                      </div>
41 47
                 </div>           
42 48
             <div class="border"></div>  
@@ -57,10 +63,10 @@
57 63
 
58 64
 <script>
59 65
    import BreadCrumb from '../components/bread-crumb'
60
-   import { getArticleCommentDetail,send } from '@/api/act/submitinfo'
66
+   import { getArticleCommentDetail,send,spread} from '@/api/act/submitinfo'
61 67
    import {getFileExtension,uParseTime} from '@/utils/tools'
62
-import { constants } from 'crypto';
63
-import { truncateSync } from 'fs';
68
+   import { constants } from 'crypto';
69
+   import { truncateSync } from 'fs';
64 70
     export default {
65 71
         name: "articleCommentDetail",
66 72
         components:{
@@ -87,6 +93,9 @@ import { truncateSync } from 'fs';
87 93
                 form:{
88 94
                   replycontent:'',  
89 95
                 },
96
+                showReply:-1,
97
+                shows:-1,
98
+                commentsReplyInfo:[],
90 99
              }
91 100
          },
92 101
          methods:{
@@ -133,8 +142,26 @@ import { truncateSync } from 'fs';
133 142
           cancel(){
134 143
               this.showindex = -1;
135 144
           },
136
-          spread(){
137
-             
145
+          spread(parentid){
146
+               var spancontent = document.getElementById("copy").innerHTML;
147
+            if(spancontent == "展开"){
148
+               document.getElementById("copy").innerHTML="收起";
149
+               this.shows = parentid;
150
+          } 
151
+            if(spancontent == "收起"){
152
+              document.getElementById("copy").innerHTML = "展开";
153
+              this.shows = 0;              
154
+          } 
155
+           const articid = this.$route.params && this.$route.params.id;
156
+          console.log("文章id",articid);   
157
+            spread(parentid,articid).then(response=>{
158
+                if(response.data.state == 1){
159
+                  var comments = response.data.data.comments;
160
+                  this.commentsReplyInfo = response.data.data.comments;
161
+                  this.shows = parentid;
162
+                  console.log("获取的内容:",comments)
163
+                }
164
+            }) 
138 165
           },
139 166
           send(parent){
140 167
               const articid = this.$route.params && this.$route.params.id;
@@ -143,36 +170,25 @@ import { truncateSync } from 'fs';
143 170
                var replycontent =  this.form.replycontent;
144 171
                if(replycontent == ""){
145 172
                   this.$message.error("回复内容不能为空");
146
-                  this.shows = false;
147 173
                }else{
148
-                   this.shows = true;
149 174
                    send(replycontent,articid,parent.id).then(response=>{
150 175
                    if(response.data.state ==1){
151 176
                       var comment = response.data.data.comment;
152
-                      parent.childs.push(comment)
177
+                      parent.childs.push(comment);
178
+                      this.showReply = parent.id;
153 179
                       console.log("内容",comment)
154 180
                       console.log(parent.childs)
155 181
                   }
156 182
                 })
157 183
                }
158 184
           },
159
-          clear(){
160
-             this.shows = false;
185
+          clear(id){
186
+             console.log("id是什么?",id);
161 187
           }
162 188
          },
163 189
           created(){
164 190
             this.getArticleCommentDetail(); 
165 191
          },
166
-         computed:{
167
-             word:function(){
168
-                if(this.show == true){
169
-                   return "展开";   
170
-                }
171
-                if(this.show == false){
172
-                    return "收起";
173
-                }
174
-             }
175
-         }
176 192
     }
177 193
 
178 194
 </script>
@@ -180,7 +196,11 @@ import { truncateSync } from 'fs';
180 196
 <style scoped>
181 197
    .border{
182 198
        border: 1px #dcdfe6 solid;
183
-       margin-top: 150px;
199
+       margin-top: 50px;
200
+   }
201
+   .border2{
202
+      border: 1px #dcdfe6 solid;
203
+      margin-top: 20px;
184 204
    }
185 205
    .title{
186 206
        font-size: 25px;
@@ -223,17 +243,22 @@ import { truncateSync } from 'fs';
223 243
        margin-top: 5px;
224 244
             
225 245
    }
226
-   .reviewed{
227
-       float: right;
228
-       margin-top: 30px;
229
-       margin-left: 100px;
230
-       padding-top: 16px;
231
-       width: 1580px;
246
+
247
+     .reviewed{
248
+      margin-top: 50px;
249
+       width: 1585px;
232 250
        height:50px;
233
-       font-size: 15px;
234
-       border:1px solid #f4f7fa;
251
+       margin-left: 92px;
235 252
        background-color: #f4f7fa;
236
-   }
253
+       padding-top: 15px;
254
+    }
255
+     .reviewed2{
256
+         margin-top: 50px;
257
+         background-color: #f4f7fa;
258
+         width: 1585px;
259
+         height:50px;
260
+         margin-left: 92px;
261
+     }
237 262
     #tub{
238 263
       float: right;
239 264
    }

+ 173 - 35
src/scrm_pages/article/commentList.vue ファイルの表示

@@ -5,35 +5,44 @@
5 5
         </div>
6 6
         <div class="app-container">
7 7
             <div class="pl">
8
-              <el-checkbox><span class="comment">全部评论</span></el-checkbox>      
8
+               <el-checkbox  @change="selectAllFunc" v-model="selectAll"><span class="comment" >全部评论</span></el-checkbox>  
9
+              <el-button size="small" icon="el-icon-delete" @click="openDeleteReply">批量删除</el-button>     
9 10
             </div> 
10 11
             <div class="border2"></div>
11
-            <div v-for="item in comments" :key="item.id">
12
-            <div class="check"><el-checkbox></el-checkbox></div>
13
-            <div class="img">
12
+
13
+            <div v-for="(item,index) in comments" :key="item.id">
14
+              <div class="check"><el-checkbox v-model='item.checked' @change="selectProduct"></el-checkbox></div>
15
+              <div class="img">
14 16
                  <img :src="item.comment_user_avater" style="width:50px;height:50px">
15
-            </div>
16
-             <div>
17
-                <div class="commentname">{{item.comment_user_name}}<span class="time">{{item.ctime}}</span></div>
17
+              </div>
18
+              <div>
19
+                <div class="commentname">{{item.comment_user_name}}
20
+                  <span class="time">{{format(item.ctime)}}</span>
21
+                </div>
18 22
                 <div class="reply">
19
-                  |&nbsp;&nbsp;<span @click="replay()">回复</span>&nbsp;&nbsp;
20
-                  |&nbsp;&nbsp;展开&nbsp;&nbsp;
21
-                  |&nbsp;&nbsp;删除&nbsp;&nbsp;
23
+                  |&nbsp;&nbsp;<span @click="replay(item.id)">回复</span>&nbsp;&nbsp;
24
+                  |&nbsp;&nbsp;<span @click="spreadReplay(item.article_id,item.id)" id="span">展开</span>&nbsp;&nbsp;
25
+                  |&nbsp;&nbsp;<span @click="deleteReply(item.id,index)">删除</span>&nbsp;&nbsp;
22 26
                   </div>
23 27
                 <div class="content">
24 28
                   {{item.content}}
25 29
                  </div> 
26
-                  <div class="reply_box" v-if="show">
27
-                        <textarea name="" id="" cols="163" rows="5" class="reply " placeholder="回复:"></textarea>
30
+
31
+                  <div class="reply_box"  v-show="showindex===item.id">
32
+                        <textarea name="" id="" cols="162" rows="5" class="reply " placeholder="回复:" v-model="form.content"></textarea>
28 33
                         <div class="clearfix"></div>
29 34
                         <div class="button" style="display: block;" myAttr="123">
30 35
                             <el-button @click="cancel()">取消</el-button>
31
-                            <el-button type="primary" @click="send()">发送</el-button>
32
-                       </div>
36
+                            <el-button type="primary" @click="sendInformation(item.article_id,item.id)">发送</el-button>
37
+                       </div>                      
33 38
                  </div>
34
-                  <div class="reviewed" v-if="shows">
35
-                     你&nbsp;回复了&nbsp;:
36
-                  </div>   
39
+                 
40
+                 <div>
41
+                 <div class="reviewed" v-for="(items,index) in Replycomments" :key="items.id" v-show="showReply==item.id">
42
+                    <div> 你&nbsp;回复了{{items.comment_user_name}}:{{items.content}} </div>
43
+                    <div  id="tub" class="el-icon-error" @click="clearRelyInfo(items.id,index)"></div>
44
+                 </div>  
45
+                 </div> 
37 46
                 <div class="border"></div>  
38 47
              </div>  
39 48
             </div>
@@ -53,8 +62,10 @@
53 62
 
54 63
 <script>
55 64
    import BreadCrumb from '../components/bread-crumb'
56
-   import {getReplyAllComents} from '@/api/act/submitinfo'
65
+   import {getReplyAllComents,sendInformation,spreadReplay,clearRelyInfo,deleteReply,openDeleteReply} from '@/api/act/submitinfo'
66
+   import {getFileExtension,uParseTime} from '@/utils/tools'
57 67
 import { constants } from 'crypto';
68
+import { copyFile } from 'fs';
58 69
   export default {
59 70
     name: 'commentList',
60 71
     components:{
@@ -76,18 +87,21 @@ import { constants } from 'crypto';
76 87
           comment_user_avater:'',
77 88
         },
78 89
         comments:[],
90
+        Replycomments:[],
79 91
         total:0,
92
+        showindex:-1,
93
+        showReply:-1,
94
+        checked: false,
95
+        selectAll:false,
96
+        selectReply:[],
80 97
       }
81 98
     },
82 99
     methods:{
83
-      replay(){
84
-        this.show = true;
100
+      replay(id){
101
+       this.showindex = id;
85 102
       },
86 103
       cancel(){
87
-        this.show = false;
88
-      },
89
-      send(){
90
-        this.shows = true;
104
+       this.showindex = 0;
91 105
       },
92 106
       handleSizeChange(limit){
93 107
          this.form.limit = limit;
@@ -108,6 +122,123 @@ import { constants } from 'crypto';
108 122
                  console.log("总条数",total)
109 123
                }
110 124
           });
125
+        },
126
+        format(time){
127
+              return uParseTime(time, "{y}-{m}-{d} {h}:{i}:{s}"); 
128
+        },
129
+        sendInformation(artilcid,parentid){
130
+             console.log("文章id",artilcid,parentid);
131
+             sendInformation(artilcid,parentid,this.form.content).then(response=>{
132
+                 if(response.data.state ==1){
133
+                    var comment =  response.data.data.comment;
134
+                    this.$message.success("发送成功");
135
+                    console.log("comment",comment)
136
+                 }
137
+             })
138
+        }, 
139
+        spreadReplay(artilcid,parentid){
140
+          // document.getElementById("span").innerHTML="收起";
141
+          var spancontent = document.getElementById("span").innerHTML;
142
+          if(spancontent == "展开"){
143
+               document.getElementById("span").innerHTML="收起";
144
+                this.showReply = parentid;
145
+          } 
146
+          if(spancontent == "收起"){
147
+             document.getElementById("span").innerHTML = "展开";
148
+             this.showReply = 0;
149
+          }              
150
+          console.log("文章id",artilcid,parentid);
151
+          spreadReplay(artilcid,parentid).then(response=>{
152
+               if(response.data.state == 1){
153
+                  var Replycomments  = response.data.data.comments;
154
+                  this.Replycomments  = response.data.data.comments;
155
+                  console.log("回复列表",Replycomments);
156
+               }  
157
+          })
158
+        },
159
+        clearRelyInfo(id,index){
160
+           console.log("id为",id);
161
+            this.$confirm("确定删除此评论?",'删除提示',{
162
+             dangerouslyUseHTMLString:true,
163
+             confirmButtonText: '确定',
164
+             cancelButtonText: '取消',
165
+             type: 'warning'
166
+           }).then(()=>{
167
+               clearRelyInfo(id).then(response=>{
168
+                  if(response.data.state ==1){
169
+                     this.Replycomments.splice(index,1)
170
+                     this.$message.success("删除成功");
171
+                  }else{
172
+                    this.$message.error("删除失败");                   
173
+                  }
174
+             }).catch(e=>{});
175
+           }).catch(() => {
176
+               return false
177
+            });            
178
+        },
179
+        selectProduct(val){
180
+            for(let i=0,len=this.comments.length;i<len;i++){
181
+                if(!this.comments[i].checked){
182
+                   this.selectAll = false;
183
+                }else{
184
+                  this.selectAll = true;
185
+                }
186
+            } 
187
+            this.selectReply = val; 
188
+        },
189
+        selectAllFunc(val){
190
+           this.comments.map((item,i)=>{
191
+             item.checked = val;
192
+           }) 
193
+        },
194
+        deleteReply(id,index){
195
+          this.$confirm("确定删除此评论?",'删除提示',{
196
+            dangerouslyUseHTMLString:true,
197
+             confirmButtonText: '确定',
198
+             cancelButtonText: '取消',
199
+             type: 'warning'
200
+          }).then(()=>{
201
+             deleteReply(id).then(response=>{
202
+                 if(response.data.state ==1 ){
203
+                    this.comments.splice(index,1)
204
+                    this.$message.success("删除成功");   
205
+                 }else{
206
+                   this.$message.error("删除失败");
207
+                 }
208
+             }).catch(e=>{}); 
209
+          }).catch(() => {
210
+               return false
211
+            }); 
212
+        },
213
+        openDeleteReply(){
214
+          if(this.selectReply.length == 0){
215
+             this.$message.error("请选择你要删除的信息");
216
+             return false;
217
+          }
218
+          this.$confirm("确定删除此评论?",'删除提示',{
219
+             dangerouslyUseHTMLString:true,
220
+             confirmButtonText: '确定',
221
+             cancelButtonText: '取消',
222
+             type: 'warning'
223
+          }).then(()=>{
224
+              var ids = [];
225
+              var idMap = {};
226
+              for (const index in this.selectReply) {
227
+                ids.push(this.selectReply[index].id);
228
+                idMap[this.selectReply[index].id] = this.selectReply[index].id;
229
+              }
230
+              openDeleteReply({ids:ids}).then(response=>{
231
+                  if(response.data.state==1){
232
+                    // var commentslength = this.comments.length;
233
+                    // for (let index = commentslength-1; index>=0; index--) {
234
+                    //    if(this.comments[index].id in idMap){
235
+                    //       this.comments.splice(index,1);
236
+                    //    }
237
+                    // }
238
+                    // this.$message.success("删除会员成功");
239
+                  }
240
+              })
241
+          })
111 242
         }
112 243
     },
113 244
     created(){
@@ -120,15 +251,17 @@ import { constants } from 'crypto';
120 251
 
121 252
       .border{
122 253
        border: 1px #dcdfe6 solid;
123
-       margin-top: 140px;
254
+       margin-top: 50px;
124 255
      }
125 256
      .border2{
126 257
        border: 1px #dcdfe6 solid;
258
+       margin-top: 20px;
127 259
      }
128 260
      .comment{
129 261
        font-size: 20px;
130 262
        color: black;
131 263
        font-weight: 700;
264
+      
132 265
      }
133 266
 
134 267
      .commentname{
@@ -136,17 +269,20 @@ import { constants } from 'crypto';
136 269
        font-size: 20px;
137 270
        color: blue;
138 271
        margin-left: 100px;
272
+      
139 273
    }
140 274
    .reply{
141 275
        float: right;
142 276
        margin-top: -20px;
143 277
        font-size: 20px;
144 278
        color: #495060;
279
+      
145 280
    }
146 281
    .content{
147 282
        font-size: 20px;
148 283
        margin-top: 15px;
149 284
        margin-left: 100px;
285
+      
150 286
    }
151 287
    .check{
152 288
       margin-top: 20px;
@@ -154,27 +290,25 @@ import { constants } from 'crypto';
154 290
    }
155 291
    .time{
156 292
      color: #495060;
293
+     font-size: 15px;
157 294
    }
158 295
     .reply_box{
159
-       margin-top: 30px;
296
+       margin-top: 40px;
160 297
    }
161 298
    .button{
162 299
        float: right;
163 300
        margin-top: 5px;
164 301
             
165 302
    }
166
-     .reviewed{
167
-       float: right;
168
-       margin-top: 30px;
169
-       margin-left: 100px;
170
-       padding-top: 16px;
303
+    .reviewed{
304
+       margin-top: 50px;
171 305
        width: 1650px;
172 306
        height:50px;
173
-       font-size: 15px;
174
-       border:1px solid #f4f7fa;
307
+       margin-left: 35px;
175 308
        background-color: #f4f7fa;
176
-   }
177
-
309
+       padding-top: 15px;
310
+    }
311
+    
178 312
    .pl{
179 313
      margin-bottom: 50px;
180 314
    }
@@ -183,4 +317,8 @@ import { constants } from 'crypto';
183 317
      margin-left: 20px;
184 318
      margin-top: 20px;
185 319
    }
320
+   #tub{
321
+     float: right;
322
+     margin-top: -15px;
323
+   }
186 324
 </style>

+ 17 - 3
src/scrm_pages/article/createArticle.vue ファイルの表示

@@ -17,7 +17,7 @@
17 17
                 <keep-alive>
18 18
                   <neditor ref="neditor"
19 19
                            id="editor"
20
-                           v-bind:r_content="form.act_content">
20
+                           v-bind:r_content="form.act_content" @content_changed="paragraphContentChanged">
21 21
                   </neditor>
22 22
                 </keep-alive>
23 23
               </el-form-item>
@@ -55,7 +55,7 @@
55 55
                       :on-error="handleAvatartwoError"
56 56
                       :on-success="handleAvatartwoSuccess"
57 57
                       :before-upload="beforeAvatartwoUpload">
58
-                      <img v-if="imageUrlSecond" :src="imageUrlSecond" class="avatar">
58
+                      <img v-if="imageUrl" :src="imageUrl" class="avatar">
59 59
                       <i v-else class="el-icon-plus avatar-uploader-icon"></i>
60 60
                     </el-upload>
61 61
                   </div>
@@ -256,7 +256,6 @@
256 256
         },
257 257
          acttypes:[],
258 258
          imageUrl:'',
259
-         imageUrlSecond:'',
260 259
          imageUrlLast:'',
261 260
          formloading:false,
262 261
          formsubmit:false,
@@ -332,6 +331,21 @@
332 331
                 })
333 332
             })
334 333
       },
334
+      //监听图片获取前三张
335
+       paragraphContentChanged: function(content) {
336
+            var images = [],temp;
337
+            console.log("监听获取的文章内容是什么?",content)
338
+            var patt = /<img[^>]+src=['"]([^'"]+)['"]+/g;
339
+            while ((temp = patt.exec(content)) != null) {
340
+            images.push(temp[1]);
341
+            }                 
342
+             console.log("图片数组",images);
343
+             this.form.org_logo = images[0];
344
+             this.imageUrl = images[1];
345
+             this.imageUrlLast = images [2];           
346
+        },
347
+
348
+
335 349
       //第二个图片
336 350
       handleAvatartwoSuccess(res, file) {
337 351
         this.imageUrlSecond = URL.createObjectURL(file.raw);