go+beego框架中使用无极限原理数据处理实现详情页评论展示功能

Go  /  管理员 发布于 3年前   490

在百度搜了一下好像很少有这类的教程文章，因为有刚好有个项目功能用到无极限查子孙树，所以记录一下

无极限查子孙树 自定义函数之前我有文章写过，有兴趣的点下面链接查阅：

https://www.zongscan.com/demo333/88231.html

我用我的博客详情页评论展示做测试demo (线上可能没那么快更新)

http://go.zongscan.com/

详情页控制器 

\gblog\controllers\art.go

package controllers

import (
	"fmt"
	"gblog/models"
	"strconv"
	"time"

	"github.com/astaxie/beego/orm"
)

type ArtController struct {
	BaseController
}

type comm struct {
	Comment_id  int
	Fcomment_id int
	Art_id      int
	User_id     int
	Username    string
	Face        string
	Comment     string
	Pubtime     string
	Zan         int
	Children    []comm
}

//文章详情页
func (c *ArtController) Detail() {
	idStr := c.Ctx.Input.Param(":id")
	id, _ := strconv.Atoi(idStr)

	o := orm.NewOrm()

	//文章
	art := models.Art{}
	o.Raw("SELECT * FROM art WHERE art_id = ?", id).QueryRow(&art)
	c.Data["art"] = art

	//更新view 自增
	art.Art_id = id
	art.View = art.View + 1
	models.EditArt(&art)

	c.Data["title"] = art.Title + "-侯体宗的博客"
	c.Data["keywords"] = art.Title
	c.Data["description"] = art.Title


	//评论
	var commdates []orm.Params
	commdatessql := `select * from comment where art_id = ?`
	o.Raw(commdatessql, art.Art_id).Values(&commdates)
	c.Data["commdates"] = commdates

	//无极限评论测试数据
	// arrs := []comm{
	// 	{Comment_id: 1, Fcomment_id: 0, Art_id: 11, user_id: 11, Username: "11", face: "11", comment: "11", pubtime: "11"},
	// 	{Comment_id: 2, Fcomment_id: 0, Art_id: 22, user_id: 22, Username: "22", face: "22", comment: "22", pubtime: "22"},
	// 	{Comment_id: 3, Fcomment_id: 2, Art_id: 33, user_id: 33, Username: "我是2的子级", face: "33", comment: "33", pubtime: "33"},
	// }

	//初始化orm数据集 - 统一类型 - 结构体
	s := []comm{}

	for _, v := range commdates {
		comment_id, _ := strconv.Atoi(v["comment_id"].(string))
		fcomment_id, _ := strconv.Atoi(v["fcomment_id"].(string))
		art_id, _ := strconv.Atoi(v["art_id"].(string))
		zan, _ := strconv.Atoi(v["zan"].(string))
		node := comm{
			Comment_id:  comment_id,
			Fcomment_id: fcomment_id,
			Art_id:      art_id,
			Username:    v["username"].(string),
			Comment:     v["comment"].(string),
			Pubtime:     v["pubtime"].(string),
			Zan:         zan,
		}
		s = append(s, node)
	}
	fmt.Println(s)

	//无极限处理评论数据
	list := SonsTree(s, 0)
	fmt.Println(list)
	c.Data["list"] = list

	//c.Data["json"] = list
	//c.ServeJSON()
	//c.StopRun()


	c.TplName = "detail.html"
}

打印一下数据：

详情页视图：

\gblog\views\detail.html

（省略其他代码，只留评论展示代码）

...
<div class="h-clear"></div>
<p class="h-block"><strong>请勿发布不友善或者负能量的内容。与人为善，比聪明更重要！</strong>
	<form class="h-block" method="post" action="comment" role="form">
		<div class="form-group">
			<input type="hidden" name="_token" value="qqWUCyhG5gaS2nyi2JsZ73KeGxUXLtSvJD0zdcH8">
			<input type="hidden" name="art_id" value="{{.art.Art_id}}">
			<textarea name="comment" class="form-control" rows="3" style="overflow: hidden; overflow-wrap: break-word; resize: none;"></textarea>
		</div>
		<button type="submit" class="btn btn-default">评论</button>
	</form>
</p>
<div class="h-clear"></div>
{{range $ind, $elem := .list}}
<div class="media h-block">
	<a href="#" class="pull-left"><img src="{{$elem.Face}}" class="media-object" width="30"/></a>
	<div class="media-body">
		<h4 class="media-heading">{{$elem.Username}} <small>{{FormatDate $elem.Pubtime}} </small></h4><p>{{str2html $elem.Comment}} </p>
		<form method="post" action="comment">
			<input type="hidden" name="fcomment_id" value="{{$elem.Comment_id}}">
			<input type="hidden" name="art_id" value="{{$elem.Art_id}}">
			<input class="h-block repcomment{{$elem.Comment_id}}"  required="" type="text" name="comment" placeholder="请输入..." style="width: 80%">
			<button style="padding: .78571429em 1.5em;border: none;background-color: #00a0e9;color: #fff;" type="submit">评论</button>
		</form>
		{{if $elem.Children}}
		  {{range $k, $v := $elem.Children}}
				<div class="media h-block">
				<a href="#" class="pull-left"><img src="{{$v.Face}}" class="media-object" width="30"/></a>
				<div class="media-body">
					<h4 class="media-heading">{{$v.Username}} <small>{{FormatDate $v.Pubtime}}</small></h4><p>{{str2html $v.Comment}}</p>
					<a href="javascript:;" title="为此评论点赞" style="color:#ada5a5;font-size: 16px;" onclick="dianzan(this,{{$v.Comment_id}},'')"><i class="icon ion-thumbsup"></i> <span class="rezan">{{$v.Zan}}</span></a>
					<a href="javascript:;" title="回复 {{$v.Username}}" style="color:#ada5a5;font-size: 16px;" onclick="$('.repcomment{{$elem.Comment_id}}').val('@'+'{{$v.Username}}# ');$('.repcomment{{$elem.Comment_id}}').focus();"><i class="icon ion-ios-undo"></i></a>
				</div>
			</div>
		  {{end}}
		{{end}}
		<div class="h-clear"></div>
		<a href="javascript:;" title="为此评论点赞" style="color:#ada5a5;font-size: 16px;" onclick="alert('未开发')"><i class="icon ion-thumbsup"></i> <span class="rezan">{{$elem.Zan}}</span></a>
	</div>
</div>
{{end}}

...

来自视图展示效果图：