1. 完善评论功能

loveseejoy · Jul 29, 2017 · 5aa3b74 · 5aa3b74
1 parent 6d79b22
commit 5aa3b74
Show file tree

Hide file tree

Showing 11 changed files with 146 additions and 88 deletions.
diff --git a/TonyBlogs.IRepository/IBlogArticleRepository.cs b/TonyBlogs.IRepository/IBlogArticleRepository.cs
@@ -12,7 +12,7 @@ public interface IBlogArticleRepository : IBaseRepository<BlogArticleEntity>
     {
         List<BlogArticleEntity> GetList(BlogArticleSearchDTO searchDTO, out long totalCount);
 
-        List<BlogArticleViewRankItemPageDTO> GetViewRankList();
+        List<BlogArticleViewRankItemPageDTO> GetViewRankList(long userID);
 
         ExecuteResult AddBlogTraffic(long blogID, string ip);
 

diff --git a/TonyBlogs.IService/IBlogArticleService.cs b/TonyBlogs.IService/IBlogArticleService.cs
@@ -21,7 +21,7 @@ public interface IBlogArticleService : IBaseServices<BlogArticleEntity>
 
         BlogArticleDetailPageDTO GetBlogArticleDetail(long blogID);
 
-        List<BlogArticleViewRankItemPageDTO> GetViewRankList();
+        List<BlogArticleViewRankItemPageDTO> GetViewRankList(long userID);
 
         ExecuteResult Delete(long blogID);
 

diff --git a/TonyBlogs.Repository/BlogArticleRepository.cs b/TonyBlogs.Repository/BlogArticleRepository.cs
@@ -64,9 +64,14 @@ public List<BlogArticleEntity> GetList(BlogArticleSearchDTO searchDTO, out long
             return list;
         }
 
-        public List<BlogArticleViewRankItemPageDTO> GetViewRankList()
+        public List<BlogArticleViewRankItemPageDTO> GetViewRankList(long userID)
         {
             var sqlExp = GetSqlExp();
+            if (userID > 0)
+            {
+                sqlExp.Where(m=>m.UserID == userID);
+            }
+
             sqlExp.Select(m => new
             {
                 m.ID,

diff --git a/TonyBlogs.Service/BlogArticleService.cs b/TonyBlogs.Service/BlogArticleService.cs
@@ -127,9 +127,9 @@ public BlogArticleListPageDTO GetListPage(BlogArticleSearchDTO searchDTO)
             return result;
         }
 
-        public List<BlogArticleViewRankItemPageDTO> GetViewRankList()
+        public List<BlogArticleViewRankItemPageDTO> GetViewRankList(long userID)
         {
-            return dal.GetViewRankList();
+            return dal.GetViewRankList(userID);
         }
 
         public BlogArticleDetailPageDTO GetBlogArticleDetail(long blogID)

diff --git a/TonyBlogs.WebApp/Content/assets/frontend/layout/css/style.css b/TonyBlogs.WebApp/Content/assets/frontend/layout/css/style.css
@@ -2705,13 +2705,20 @@ Demo Utils
 .blog-item div.media-heading span a {
     color: #E84D1C;
 }
-
-.blog-item div.media-heading a.author {
-    font-size:14px;
+.blog-item div.media-heading .name {
+    font-size: 15px;
+    color: #333;
+    text-decoration:none;
+}
+.blog-item .comment .sub-comment a.author {
     font-weight:bold;
     color: #3194d0;
 }
 
+.blog-item .comment p {
+    font-size: 16px;
+}
+
 .blog-item .media .sub-comment-list {
     margin-top: 20px;
     padding: 5px 0 5px 20px;
@@ -2720,7 +2727,7 @@ Demo Utils
 .blog-item .media .sub-comment-list p {
     margin-bottom: -1px;
     margin: 0 0 5px;
-    font-size: 13px;
+    font-size: 14px;
     line-height: 1.5;
 }
 
@@ -2730,6 +2737,21 @@ Demo Utils
     border: none;
 }
 
+.blog-item .media .sub-comment-list .sub-tool-group {
+    font-size: 12px;
+    color: #969696;
+}
+
+.blog-item .media .sub-comment-list .sub-tool-group a {
+    margin-left: 10px;
+    color: #969696;
+}
+
+.blog-item .media .sub-comment-list .sub-tool-group a i {
+    margin-right: 5px;
+    font-size: 14px;
+}
+
 .blog-item .media .sub-comment-list .more-comment {
     font-size: 14px;
     color: #969696;

diff --git a/TonyBlogs.WebApp/Content/assets/global/scripts/metronic.js b/TonyBlogs.WebApp/Content/assets/global/scripts/metronic.js
@@ -877,6 +877,33 @@ var Metronic = function () {
             $dialog.modal('show');
         },
 
+        remind:function(content, isSuccess) {
+            var dialogId = "Simple_Modal_Remind";
+            if ($("#" + dialogId, "body").is('div')) {
+                $("#" + dialogId).remove();
+            }
+            var $dialog = $(document.createElement("div"));
+            $dialog.attr("id", dialogId);
+
+            var $dialogHtmlContent = isSuccess ? '<ul id="noty_topCenter_layout_container" class="i-am-new" style="top: 20%; left: 40%; position: fixed; width: 310px; height: auto; margin: 0px; padding: 0px; list-style-type: none; z-index: 10000000;"><li style="top: 50px; overflow: hidden; margin: 4px 0px; border-radius: 4px !important; border: 1px solid rgb(73, 190, 56); box-shadow: rgba(0, 0, 0, 0.0980392) 0px 2px 4px; background-color: rgb(255, 255, 255); color: rgb(73, 190, 56); width: 310px; cursor: pointer;"><div class="noty_bar noty_type_success" id="noty_767452046665604900"><div class="noty_message" style="font-size: 13px; line-height: 16px; text-align: center; padding: 10px; width: auto; position: relative;"><span class="noty_text">{0}</span></div></div></li></ul>'
+                : '<ul id="noty_topCenter_layout_container" class="i-am-new" style="top: 20%; left: 40%; position: fixed; width: 310px; height: auto; margin: 0px; padding: 0px; list-style-type: none; z-index: 10000000;"><li style="top: 50px; overflow: hidden; margin: 4px 0px; border-radius: 4px !important; border: 1px solid rgb(222, 83, 58); box-shadow: rgba(0, 0, 0, 0.0980392) 0px 2px 4px; background-color: rgb(255, 255, 255); color: rgb(222, 83, 58); width: 310px; cursor: pointer;"><div class="noty_bar noty_type_error" id="noty_312195705739244800"><div class="noty_message" style="font-size: 13px; line-height: 16px; text-align: center; padding: 10px; width: auto; position: relative; font-weight: bold;"><span class="noty_text">{0}</span></div></div></li></ul>';
+            var $dialogHtml = this.formatString($dialogHtmlContent,content);
+            $dialog.html($dialogHtml);
+            $("body").append($dialog);
+            $dialog.show();
+
+            setTimeout(function () {
+                $dialog.hide();
+            }, 1000);
+        },
+
+        remindSuccess: function (content) {
+            this.remind(content, true);
+        },
+        remindError: function (content) {
+            this.remind(content, false);
+        },
+
         // initializes uniform elements
         initUniform: function (els) {
             if (els) {

diff --git a/TonyBlogs.WebApp/Content/js/blog.view.rank.js b/TonyBlogs.WebApp/Content/js/blog.view.rank.js
@@ -0,0 +1,46 @@
+Vue.component('blogview', {
+    props: ['userid'],
+    template: '\
+        <div>\
+            <h3 style="margin-bottom: 20px;">最近阅读排行</h3>\
+            <div class="recent-news margin-bottom-10">\
+                <div v-for="viewblog in ViewRankList" class="row margin-bottom-10">\
+                    <div class="col-md-12">\
+                        <a v-bind:href="DetailUrl(viewblog.ID)" style="color: #E84D1C" target="_blank">{{viewblog.Title}}</a>\
+                    </div>\
+                </div>\
+            </div>\
+        </div>\
+     ',
+    data: function () {
+        return {
+            ViewRankList: [],
+            list_url: '/Home/AjaxGetViewRankList',
+            detail_url: '/b/',
+        };
+    },
+    methods: {
+        GetViewRankList: function () {
+            var that = this;
+
+            $.ajax({
+                url: that.list_url,
+                data: { userid: that.userid },
+                type: "GET",
+                dataType: "json",
+                success: function (retData) {
+                    that.ViewRankList = retData;
+                },
+                error: function (retData) {
+                    Metronic.simpleAlert("发生错误，请重试！");
+                }
+            })
+        },
+        DetailUrl: function (blogId) {
+            return this.detail_url + blogId;
+        },
+    },
+    mounted: function () {
+        this.GetViewRankList();
+    },
+})
diff --git a/TonyBlogs.WebApp/Controllers/HomeController.cs b/TonyBlogs.WebApp/Controllers/HomeController.cs
@@ -41,9 +41,9 @@ public ActionResult AjaxGetPageList(BlogArticleSearchDTO searchDTO)
             return Json(result, JsonRequestBehavior.AllowGet);
         }
 
-        public ActionResult AjaxGetViewRankList()
+        public ActionResult AjaxGetViewRankList(long userID)
         {
-            var result = _blogArticleService.GetViewRankList();
+            var result = _blogArticleService.GetViewRankList(userID);
 
             return Json(result, JsonRequestBehavior.AllowGet);
         }

diff --git a/TonyBlogs.WebApp/TonyBlogs.WebApp.csproj b/TonyBlogs.WebApp/TonyBlogs.WebApp.csproj
@@ -1280,6 +1280,7 @@
     <Content Include="Content\assets\global\plugins\wang-editor\static\highlightjs\highlight.pack.js" />
     <Content Include="Content\assets\global\scripts\datatable.js" />
     <Content Include="Content\assets\global\scripts\metronic.js" />
+    <Content Include="Content\js\blog.view.rank.js" />
     <Content Include="Content\js\jquery-1.10.1.min.js" />
     <Content Include="Content\js\jquery.blockui.min.js" />
     <Content Include="Content\js\public.js" />

diff --git a/TonyBlogs.WebApp/Views/BlogDetail/Index.cshtml b/TonyBlogs.WebApp/Views/BlogDetail/Index.cshtml
@@ -35,7 +35,7 @@
                         <div class="media comment" v-for="(comment, index) in comments_list">
                             <div class="media-body">
                                 <div class="media-heading">
-                                <a class="author">{{comment.RealName}}</a> 
+                                <a class="name">{{comment.RealName}}</a> 
                                 <span>
                                     {{comment.InsertTime}} / 
                                     <a v-on:click="GoToRelyComment(comment, comment.ID)" href="javascript:;">回复</a>
@@ -86,68 +86,15 @@
                 <!-- END LEFT SIDEBAR -->
                 <!-- BEGIN RIGHT SIDEBAR -->
                 <div class="col-md-3 col-sm-3 blog-sidebar">
-                    <!-- CATEGORIES START -->
-                    <h2 class="no-top-space">Categories</h2>
                     <ul class="nav sidebar-categories margin-bottom-40">
-                        <li><a href="javascript:;">London (18)</a></li>
-                        <li><a href="javascript:;">Moscow (5)</a></li>
-                        <li class="active"><a href="javascript:;">Paris (12)</a></li>
-                        <li><a href="javascript:;">Berlin (7)</a></li>
-                        <li><a href="javascript:;">Istanbul (3)</a></li>
+                        <li><a href="/blog">博客</a></li>
+                        <li><a href="/essay">随笔</a></li>
                     </ul>
                     <!-- CATEGORIES END -->
-                    <!-- BEGIN RECENT NEWS -->
-                    <h2>Recent News</h2>
-                    <div class="recent-news margin-bottom-10">
-                        <div class="row margin-bottom-10">
-                            <div class="col-md-3">
-                                <img class="img-responsive" alt="" src="/content/assets/frontend/pages/img/people/img2-large.jpg">
-                            </div>
-                            <div class="col-md-9 recent-news-inner">
-                                <h3><a href="javascript:;">Letiusto gnissimos</a></h3>
-                                <p>Decusamus tiusto odiodig nis simos ducimus qui sint</p>
-                            </div>
-                        </div>
-                        <div class="row margin-bottom-10">
-                            <div class="col-md-3">
-                                <img class="img-responsive" alt="" src="/content/assets/frontend/pages/img/people/img1-large.jpg">
-                            </div>
-                            <div class="col-md-9 recent-news-inner">
-                                <h3><a href="javascript:;">Deiusto anissimos</a></h3>
-                                <p>Decusamus tiusto odiodig nis simos ducimus qui sint</p>
-                            </div>
-                        </div>
-                        <div class="row margin-bottom-10">
-                            <div class="col-md-3">
-                                <img class="img-responsive" alt="" src="/content/assets/frontend/pages/img/people/img3-large.jpg">
-                            </div>
-                            <div class="col-md-9 recent-news-inner">
-                                <h3><a href="javascript:;">Tesiusto baissimos</a></h3>
-                                <p>Decusamus tiusto odiodig nis simos ducimus qui sint</p>
-                            </div>
-                        </div>
-                    </div>
-                    <!-- END RECENT NEWS -->
-                    <!-- BEGIN BLOG TALKS -->
-                    <div class="blog-talks margin-bottom-30">
-                        <h2>Popular Talks</h2>
-                        <div class="tab-style-1">
-                            <ul class="nav nav-tabs">
-                                <li class="active"><a data-toggle="tab" href="#tab-1">Multipurpose</a></li>
-                                <li><a data-toggle="tab" href="#tab-2">Documented</a></li>
-                            </ul>
-                            <div class="tab-content">
-                                <div id="tab-1" class="tab-pane row-fluid fade in active">
-                                    <p class="margin-bottom-10">Raw denim you probably haven't heard of them jean shorts Austin. eu banh mi, qui irure terry richardson ex squid Aliquip placeat salvia cillum iphone.</p>
-                                    <p><a class="more" href="javascript:;">Read more</a></p>
-                                </div>
-                                <div id="tab-2" class="tab-pane fade">
-                                    <p>Food truck fixie locavore, accusamus mcsweeney's marfa nulla single-origin coffee squid. aliquip jean shorts ullamco ad vinyl aesthetic magna delectus mollit. Keytar helvetica VHS salvia..</p>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <!-- END BLOG TALKS -->
+                    <!-- BEGIN BLOGVIEW -->
+                    <blogview v-bind:userid="@Model.UserID"></blogview>
+                    <!-- END BLOGVIEW -->
+
                 </div>
                 <!-- END RIGHT SIDEBAR -->
             </div>
@@ -158,6 +105,8 @@
 <!-- END SIDEBAR & CONTENT -->
 @section scripts{
     <script src="~/Content/assets/global/plugins/vue-2.1.7.min.js"></script>
+    <script src="~/Content/js/blog.view.rank.js"></script>
+
     <script type="text/javascript">
         var data = {
             CommentAddDTO: {
@@ -233,7 +182,9 @@
                 data.is_reply = true;
                 data.CommentAddDTO.Content = "@@" + pComment.RealName + " ";
                 this.ToggleCommentSendBtn();
-                window.location.hash = '#post-comment';
+                $("#post-comment textarea").focus();
+                Metronic.scrollTo($("#post-comment"));
+
             },
             
             ReplyComment: function () {
@@ -250,17 +201,28 @@
 
             AjaxAddComment: function (actionData) {
 
+                if (actionData.Content.length <= 0 ) {
+                    Metronic.remindError("回复内容不能为空！");
+                    return;
+                }
+
                 $.ajax({
                     url: actions.comments_add,
                     data: actionData,
                     type: "POST",
                     dataType: "json",
                     success: function (retData) {
-                        paramMethods.GetCommnetList();
-                        paramMethods.ClearComment();
+                        if (retData.IsSuccess) {
+                            Metronic.remindSuccess("回复成功")
+                            paramMethods.GetCommnetList();
+                            paramMethods.ClearComment();
+                        }
+                        else {
+                            Metronic.remindError(retData.Message);
+                        }
                     },
                     error: function (retData) {
-                        Metronic.simpleAlert("发生错误，请重试！");
+                        Metronic.remindError("发生错误，请重试！");
                     }
                 })
             },