在评价的时候,其他顾客也可以进行提问或者发表其他意见。

在 views。py中:

# 回复入库
class Hui(APIView):
  def post(self,request):
    id = request.POST.get('id','为获取到id')
    username = request.POST.get('username','未接到参数')

    content = request.POST.get('contents','为获取到content')
    # print('这里时回复:{content}')
    # 入库,我在测试的时候把用户名写死了,方便查看
    res = HunFu(from_uid=int(id),content=content,username='huifu123')
    res.save()
    data = {'name':'添加成功'}
    return Response(data)


# 回复渲染
class Hui_xuan(APIView):
def post(self,request):
id = request.POST.get('id','为获取到')
username = request.POST.get('username','未接到参数')
res = HunFu.objects.filter(from_uid=int(id))
b = serialize('json',res,ensure_ascii=False)
return Response(b)


# 评论页面
class Ping(APIView):
  def post(self,request):
    id = request.POST.get('id','未获取到id')
    username = request.POST.get('username','未接到参数')
    print(id)
    res = PingLun.objects.filter(to_uid=int(id))
    print(f'评论阿森纳漫长:{res}')
    以json的格式返回
    b = serialize('json',res,ensure_ascii=False)
    return Response(b)



# 评论入库
class Ping_Ru(APIView):
  def post(self,request):
    id = request.POST.get('id','为获取到id')
    username = request.POST.get('username','未接到参数')
    content = request.POST.get('contents','为获取到content')
      # 入库
    res = PingLun(to_uid=int(id),content=content,username='pingluen123')
    res.save()
    data = {'name':'添加成功'}
    return Response(data)


在前端模板使用富文本,让客户有更好的体验
评价入库前端
<textarea id='content'>富文本</textarea>
<button onclick="checkit()">提交</button>
 
 
<script>
function getUrlParam(id) {
                        var reg = new RegExp("(^|&)" + id + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
                        var r = window.location.search.substr(1).match(reg); //匹配目标参数
                        if (r != null) return unescape(r[2]); return null; //返回参数值
                    }
             var id = getUrlParam('id');
 
initKindEditor();
 
function initKindEditor() {
  var kind = KindEditor.create('#content', {
  width: '100%', // 文本框宽度(可以百分比或像素)
  height: '300px', // 文本框高度(只能像素)
  minWidth: 200, // 最小宽度(数字)
  minHeight: 400, // 最小高度(数字)
   uploadJson:'/md_admin_user/imageupload',
  //定制富文本,只能写文字,图片以及表情包
        items:['emoticons','image'],
});
}
 
function checkit(){
    var username = $.cookie('username')
              alert(username);
    //获取富文本里面的内容
    var contents = $(document.getElementsByTagName("iframe")[0].contentWindow.document.body).html()
    let parama = new URLSearchParams();
    parama.append('contents',contents);
    parama.append('id',id);
    parama.append('username',username);
    axios({
      url:'http://localhost:8000/md_admin_user/ping_ru',
      data:parama,
      method:'post',
      responseType:'json',
 
    })
    .then(function(obj){
      console.log(obj);
      let datalist = obj.data;
 
      for(let i=0;i<datalist.length;i++){
        content=datalist[i]['fields']['content'];
      }
      $("#content").html(content);            
      });
 
      }
</script>




            function getUrlParam(id) {
                        var reg = new RegExp("(^|&)" + id + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
                        var r = window.location.search.substr(1).match(reg); //匹配目标参数
                        if (r != null) return unescape(r[2]); return null; //返回参数值
                    }
            var id = getUrlParam('id');

            //渲染评论
            var username = $.cookie('username')
            alert(username);
            let parama = new URLSearchParams();
            parama.append('username',username);
            parama.append('id',id);

            axios({
                url:'http://localhost:8000/md_admin_user/ping',
                data:parama,
                method:'post',
                responseType:'json',
                    
            })
            .then(function(obj){
                 console.log(obj);
                 let datalist = obj.data;
                 let ul = '';
                 for(let i=0;i<datalist.length;i++){
                    // alert(datalist[i]['fields']['content'])
                    ul += '<ul class="judge_list_con"><li class="judge_list fl"><div class="user_info fl"><img src="images/cat.jpg"><b>'+datalist[i]['fields']['username']+'</b></div><div class="judge_info fl"><div class="stars_five"></div><div class="judge_detail">'+datalist[i]['fields']['content']+'</div><span id="contents"><a onclick="contentss()">回复</a></span><div class="showcomment" hidden><textarea class="contents"></textarea><button onclick="checkit()">提交评论</button></div></div></li></ul>'
                 }
                 $("#content").html(ul);  
                              //富文本
                initKindEditor();   
                function initKindEditor() {
                    var kind = KindEditor.create('.contents', {
                        width: '700px', // 文本框宽度(可以百分比或像素)
                        height: '100', // 文本框高度(只能像素)
                        minWidth: 100, // 最小宽度(数字)
                        minHeight: 100, // 最小高度(数字)
                        // uploadJson:'/md_admin/imageupload',
                        items:['emoticons'],
                    });
                }               
            });
                
            
            function contentss(){
                $(".showcomment").show()
            }





    //渲染回复
    var username = $.cookie('username')
    alert(username);

            let paramb = new URLSearchParams();
            paramb.append('username',username);
            paramb.append('id',id);

            axios({
                url:'http://localhost:8000/md_admin_user/huifu',
                data:paramb,
                method:'post',
                responseType:'json',
                    
            })
            .then(function(obj){
                 console.log(obj);
                 let datalist = obj.data;
                 let ul = '';
                 for(let i=0;i<datalist.length;i++){
                    ul += '<ul class="judge_list_con"><li class="judge_list fl"><div class="user_info fl"><img src="images/cat.jpg"><b>'+datalist[i]['fields']['username']+'</b></div><div class="judge_info fl"><div class="stars_five"></div><div class="judge_detail">'+datalist[i]['fields']['content']+'</div><span id="contents"><a onclick="contentss()">回复</a></span><div class="showcomment" hidden><textarea class="contents"></textarea><button onclick="checkit()">提交评论</button></div></div></li></ul>'
                 }
                 $("#huifu").html(ul);    
                //富文本
                initKindEditor();   
                function initKindEditor() {
                    var kind = KindEditor.create('.contents', {
                        width: '700px', // 文本框宽度(可以百分比或像素)
                        height: '100', // 文本框高度(只能像素)
                        minWidth: 100, // 最小宽度(数字)
                        minHeight: 100, // 最小高度(数字)
                        // uploadJson:'/md_admin/imageupload',
                        items:['emoticons'],
                    });
                }               
            });
                
            
            function contentss(){
                $(".showcomment").show()
            }
    
            
        //将回复加入存库
        function checkit(){
            //获取url中的参数
            function getUrlParam(id) {
                    var reg = new RegExp("(^|&)" + id + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
                    var r = window.location.search.substr(1).match(reg); //匹配目标参数
                    if (r != null) return unescape(r[2]); return null; //返回参数值
            }
            var username = $.cookie('username');
            var id = getUrlParam('id');
            var contents = $(document.getElementsByTagName("iframe")[0].contentWindow.document.body).html();
            alert(contents);
            let parama = new URLSearchParams();
    parama.append('contents',contents);
                    alert(contents)
    parama.append('id',id);
    axios({
      url:'http://localhost:8000/md_admin_user/hui_ru',
      data:parama,
      method:'post',
      responseType:'json',
 
    })
    .then(function(obj){
      console.log(obj);
                    if(obj.data.name =='添加成功'){
        //自动刷新
                        // window.location.href = '';
                    }
 
});
 
}