备忘录增加分类标签

database/db.js

@@ -546,13 +546,13 @@ db.getBookmarksNavigate = function(tags) {
     // var sql = "SELECT t.id as tag_id, t.name as tag_name, b.* FROM `tags` as t LEFT OUTER JOIN tags_bookmarks as tb ON t.id = tb.tag_id LEFT OUTER JOIN bookmarks as b ON tb.bookmark_id = b.id WHERE t.user_id='" + user_id + "' ORDER BY t.id ASC, b.click_count DESC";
     var sql = "";
     tags.forEach((tag, index) => {
-            var t = 't' + tag.id;
+        var t = 't' + tag.id;
-            if (index >= 1) {
+        if (index >= 1) {
-                sql += " UNION "
+            sql += " UNION "
-            }
+        }
-            sql += "(SELECT * FROM ((SELECT t.id AS tag_id, t.`name` as tag_name, t.sort, b.* FROM `tags` as t, `bookmarks`as b, `tags_bookmarks` as tb WHERE t.id = tb.tag_id AND b.id = tb.bookmark_id AND t.id = " + tag.id + " ORDER BY b.click_count DESC LIMIT 0, 16) UNION (SELECT t.id AS tag_id, t.`name` as tag_name, t.sort, b.* FROM `tags` as t, `bookmarks`as b, `tags_bookmarks` as tb WHERE t.id = tb.tag_id AND b.id = tb.bookmark_id AND t.id = " + tag.id + " ORDER BY b.created_at DESC LIMIT 0, 16)) as " + t + " ORDER BY " + t + ".click_count DESC, " + t + ".created_at DESC)";
+        sql += "(SELECT * FROM ((SELECT t.id AS tag_id, t.`name` as tag_name, t.sort, b.* FROM `tags` as t, `bookmarks`as b, `tags_bookmarks` as tb WHERE t.id = tb.tag_id AND b.id = tb.bookmark_id AND t.id = " + tag.id + " ORDER BY b.click_count DESC LIMIT 0, 16) UNION (SELECT t.id AS tag_id, t.`name` as tag_name, t.sort, b.* FROM `tags` as t, `bookmarks`as b, `tags_bookmarks` as tb WHERE t.id = tb.tag_id AND b.id = tb.bookmark_id AND t.id = " + tag.id + " ORDER BY b.created_at DESC LIMIT 0, 16)) as " + t + " ORDER BY " + t + ".click_count DESC, " + t + ".created_at DESC)";
-        })
+    })
-        // console.log('getBookmarksNavigate ', sql);
+    // console.log('getBookmarksNavigate ', sql);
 
     return new Promise(function(resolve, reject) {
         client.query(sql, (err, result) => {
@@ -1030,12 +1030,16 @@ db.addNote = function(note) {
 };
 
 db.getNotes = function(params) {
-    var sql = "SELECT notes.id, notes.content, notes.tag_id, DATE_FORMAT(notes.created_at, '%Y-%m-%d %H:%i:%s') as created_at, tags.name FROM `notes` LEFT JOIN tags ON  tags.id = notes.tag_id  WHERE notes.user_id = '" + params.user_id + "'";
+    var sql = "SELECT notes.id, notes.content, notes.tag_id, DATE_FORMAT(notes.created_at, '%Y-%m-%d %H:%i:%s') as created_at, tags.name as tagName FROM `notes` LEFT JOIN tags ON  tags.id = notes.tag_id  WHERE notes.user_id = '" + params.user_id + "'";
 
     if (params.searchWord) {
         sql += " AND notes.content LIKE '%" + params.searchWord + "%'";
     }
 
+    if (params.tagId) {
+        sql += " AND notes.tag_id  = '" + params.tagId + "'";
+    }
+
     sql += " ORDER BY `created_at` DESC"
     console.log(sql);
     return new Promise(function(resolve, reject) {
@@ -1069,8 +1073,8 @@ db.delNote = function(id) {
     });
 }
 
-db.updateNote = function(id, content) {
+db.updateNote = function(id, content, tag_id) {
-    var sql = "UPDATE `notes` SET `content`=" + client.escape(content) + " WHERE (`id`='" + id + "')";
+    var sql = "UPDATE `notes` SET `content`=" + client.escape(content) + ", `tag_id`='" + tag_id + "' WHERE (`id`='" + id + "')";
     console.log(sql);
     return new Promise(function(resolve, reject) {
         client.query(sql, (err, result) => {

public/scripts/controllers/note-controller.js

@@ -9,7 +9,9 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
     $scope.edit = false;
     $scope.preContent = '';
     $scope.content = '';
+    $scope.currentTagId = null;
     $scope.currentNoteId = null;
+    $scope.tags = []; // 书签数据
     $scope.notes = [];
     $scope.totalPages = 0;
     $scope.currentPage = 1;
@@ -28,6 +30,7 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
                 login: login,
                 index: index
             });
+            getTags();
             getNotes();
         })
         .catch((err) => {
@@ -79,30 +82,42 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
             return;
         }
         $scope.add = close;
+        var tagName = '';
+
+        $scope.tags.forEach((tag) => {
+            if ($scope.currentTagId === tag.id) {
+                tagName = tag.name;
+            }
+            if (!$scope.currentTagId) {
+                if (tag.name == '未分类') {
+                    $scope.currentTagId = tag.id;
+                    tagName = tag.name
+                }
+            }
+        })
+
         var note = {
-            tag_id: -1,
+            tag_id: $scope.currentTagId,
             content: $scope.content,
         }
 
         bookmarkService.addNote(note)
             .then((data) => {
-                console.log(JSON.stringify(data));
+                // 增加成功，重新获取一次备忘录
-                if (data.retCode == 0) {
+                $scope.tags.forEach((tag) => {
-                    note.id = data.insertId;
+                    tag.clicked = false;
-                    note.created_at = $filter('date')(new Date(), "yyyy-MM-dd HH:mm:ss");
+                })
-                    note.name = '';
-                    $scope.notes.unshift(note);
-                    $timeout(function() {
-                        timeagoInstance.cancel();
-                        timeagoInstance.render(document.querySelectorAll('.need_to_be_rendered'), 'zh_CN');
-                    }, 100)
-                }
                 $scope.preContent = $scope.content;
                 $scope.content = '';
                 updateEditPos();
+                $scope.currentTagId = null;
+                $scope.currentPage = 1;
+                $scope.searchWord = '';
+                getNotes();
             })
             .catch((err) => {
-                console.log('addNote err', err)
+                console.log('addNote err', err);
+                $scope.currentTagId = null;
             });
     }
 
@@ -160,17 +175,38 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
         }
     }
 
-    $scope.editNote = function(id, content) {
+    $scope.editNote = function(id, content, tagId) {
         $scope.add = true;
         $scope.edit = true;
         $scope.content = content;
         $scope.currentNoteId = id;
+        $scope.currentTagId = tagId;
+        $scope.tags.forEach((tag) => {
+            tag.clicked = false;
+            if (tag.id == tagId) {
+                tag.clicked = true;
+            }
+        })
     }
 
     $scope.updateNote = function() {
+        var tagName = '';
+        $scope.tags.forEach((tag) => {
+            if ($scope.currentTagId === tag.id) {
+                tagName = tag.name;
+            }
+            if (!$scope.currentTagId) {
+                if (tag.name == '未分类') {
+                    $scope.currentTagId = tag.id;
+                    tagName = tag.name
+                }
+            }
+        })
+
         var params = {
             id: $scope.currentNoteId,
             content: $scope.content,
+            tag_id: $scope.currentTagId,
         }
 
         bookmarkService.updateNote(params)
@@ -180,6 +216,8 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
                     $scope.notes.forEach((note) => {
                         if (note.id == $scope.currentNoteId) {
                             note.content = $scope.content;
+                            note.tagName = tagName;
+                            note.tag_id = $scope.currentTagId;
                         }
                     })
                     $scope.add = false;
@@ -225,7 +263,7 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
             var key = event.key.toUpperCase();
             if ($scope.hoverNote && dataService.keyShortcuts()) {
                 if (key == 'E') {
-                    $scope.editNote($scope.hoverNote.id, $scope.hoverNote.content)
+                    $scope.editNote($scope.hoverNote.id, $scope.hoverNote.content, $scope.hoverNote.tag_id)
                 } else if (key == 'I') {
                     $scope.detailNote($scope.hoverNote.content)
                 } else if (key == 'D') {
@@ -237,13 +275,17 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
         })
     });
 
-    function getNotes() {
+    function getNotes(tagId) {
+        $scope.notes = [];
         $scope.loadBusy = true;
         var params = {
             currentPage: $scope.currentPage,
             perPageItems: perPageItems,
             searchWord: $scope.searchWord,
         };
+        if (tagId) {
+            params.tagId = tagId;
+        }
         bookmarkService.getNotes(params)
             .then((data) => {
                 $scope.notes = data.notes;
@@ -270,6 +312,48 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
             });
     }
 
+    function getTags(params) {
+        $scope.loadBusy = true;
+        bookmarkService.getTags(params)
+            .then((data) => {
+                $scope.tags = []
+                var find = false;
+                data.forEach((tag) => {
+                    $scope.tags.push(tag);
+                    if (tag.id == $scope.currentTagId) {
+                        find = true; // 如果是删了分类返回来，那么要重新默认选中第一个分类
+                    }
+                })
+                if (!find) $scope.currentTagId = null;
+
+                if ($scope.currentTagId) {
+                    getTags($scope.currentTagId);
+                }
+                $scope.loadBusy = false;
+            })
+            .catch((err) => {
+                console.log('getTags err', err);
+                $scope.loadBusy = false;
+            });
+    }
+
+    $scope.clickTag = function(id, clicked) {
+        $scope.currentTagId = id;
+        // 只允许选择一个
+        $scope.tags.forEach((tag) => {
+            tag.clicked = false;
+            if (tag.id == id) {
+                tag.clicked = true;
+            }
+        })
+
+        if ($scope.add || $scope.edit) {
+
+        } else {
+            getNotes($scope.currentTagId);
+        }
+    }
+
     $('.js-note-card').transition('hide');
 
     function transition() {

public/views/note.html

@@ -1,14 +1,5 @@
-<div class="ui hidden info message js-note" ng-if="(!add) && notes.length == 0">
-    <i class="close icon" ng-click="closeNote()"></i>
-    <div class="content">
-        <div class="header">系统检测到您好像还没添加过备忘录哦！
-        </div>
-        <ul class="list">
-            <li>您可以在任意界面按快捷键A(不区分大小写)增加备忘录。双击备忘录可查看详情！</li>
-        </ul>
-    </div>
-</div>
 <div class="ui segment js-note-card">
+    <div class="ui label" style="margin:3px 15px 8px 0px;cursor:default;" ng-class="{green:tag.clicked}" ng-repeat="tag in tags" ng-click="clickTag(tag.id, !tag.clicked)" ng-show="!loadBusy">{{ tag.name }}</div>
     <div class="ui form" ng-show="add">
         <div class="required field">
             <label>内容</label>
@@ -23,7 +14,17 @@
             </div>
         </div>
     </div>
-    <div class="ui divider" ng-show="add"></div>
+    <div class="ui divider" ng-show="notes.length > 0"></div>
+    <div class="ui hidden info message js-note" ng-if="(!add) && notes.length == 0">
+        <i class="close icon" ng-click="closeNote()"></i>
+        <div class="content">
+            <div class="header">系统提示！
+            </div>
+            <ul class="list">
+                <li>您可以在任意界面按快捷键A(不区分大小写)增加备忘录。双击备忘录可查看详情！</li>
+            </ul>
+        </div>
+    </div>
     <div class="ui five stackable cards">
         <div class="card" ng-repeat="note in notes" id="{{note.id}}" ng-mouseover="setHoverNote(note)" ng-mouseleave="setHoverNote(null)">
             <div class="content" style="height:200px;margin-bottom:8px;" ng-dblclick="detailNote(note.content)">
@@ -34,15 +35,15 @@
             <div class="extra content" ng-show="!note.edit" style="height:50px;padding-right:2px;padding-left:8px;">
                 <span class="left floated like" style="margin-top:6px;">
                     <i class="add to calendar icon"></i>
-                    创建于:
                     <span title="{{note.created_at}}" class="need_to_be_rendered" data-timeago="{{ note.created_at }}"></span>
                 </span>
+                <div class="ui label" ng-click="clickTag(tag.id, !tag.clicked)" style="margin:3px 0px 0px 10px;cursor:default;">{{ note.tagName }}</div>
                 <i class="ellipsis horizontal icon right floated" style="margin-top:8px;" ng-mouseover="note.edit=true;"></i>
             </div>
             <div class="extra content" ng-show="note.edit" ng-mouseleave="note.edit=false;" style="height:50px;">
                 <img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/delete.png" ng-click="delNote(note.id, note.content)" title="删除备忘">
                 <label for="noteedit">
-                    <img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/edit-bookmark.png" ng-click="editNote(note.id, note.content)" title="编辑备忘">
+                    <img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/edit-bookmark.png" ng-click="editNote(note.id, note.content, note.tag_Id)" title="编辑备忘">
                 </label>
                 <img class="ui mini spaced image" id="noteid{{note.id}}" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/copy.png" id="url{{bookmark.id}}" ng-click="copy(note.content)" title="复制备忘">
                 <img class="ui mini spaced image" style="width:16px;height:16px;margin:0 8px;margin-top:8px;" ng-src="./images/detail.png" ng-click="detailNote(note.content)" title="备忘详情">
@@ -52,7 +53,8 @@
     <div style="width:22px;height:22px;" class="js-note-add" ng-click="showAddNote()" data-tooltip="添加备忘" ng-show="!add">
         <img class="ui ui middle aligned tiny image" src="./images/add-note.png" ng-show="!loadBusy && false">
     </div>
-    <div class="ui divider"></div>
+    <div class="ui divider" ng-show="notes.length > 0"></div>
+    <div style="height:20px;" ng-show="notes.length === 0"></div>
     <div class="ui grid" ng-show="totalItems>0">
         <div class="eight wide column" style="margin-top:10px;">
             <span ng-show="searchWord">通过搜索关键字"{{searchWord}}"(点击菜单"备忘录"重新查看所有)，</span>共找到备忘一共约{{totalItems}}个

routes/api.js

@@ -757,13 +757,13 @@ api.post('/uploadBookmarkFile', upload.single('bookmark'), function(req, res) {
 
                         var tags = [];
                         item.tags.forEach((tag) => {
-                                allTags.forEach((at) => {
+                            allTags.forEach((at) => {
-                                    if (at.name == tag) {
+                                if (at.name == tag) {
-                                        tags.push(at.id);
+                                    tags.push(at.id);
-                                    }
+                                }
-                                })
                             })
-                            // 插入书签
+                        })
+                        // 插入书签
                         db.getBookmarkbyUrl(userId, bookmark.url)
                             .then((bookmarkId) => {
                                 // 如果这个url的书签存在了，那么直接返回书签，否则返回插入的书签
@@ -1433,7 +1433,7 @@ api.post('/updateNote', function(req, res) {
 
     var note = req.body.params;
     console.log('hello updateNote', JSON.stringify(note));
-    db.updateNote(note.id, note.content)
+    db.updateNote(note.id, note.content, note.tag_id)
         .then((affectedRows) => res.json({
             result: affectedRows
         }))