能够搜索标题跟url

database/db.js

@@ -38,8 +38,8 @@ db.addBookmark = function(user_id, bookmark) {
     });
 };
 
-db.delBookmark = function(id){
+db.delBookmark = function(id) {
-    var sql = "DELETE FROM `bookmarks` WHERE (`id`='"+ id +"')";
+    var sql = "DELETE FROM `bookmarks` WHERE (`id`='" + id + "')";
     return new Promise(function(resolve, reject) {
         client.query(sql, (err, result) => {
             if (err) {
@@ -51,8 +51,8 @@ db.delBookmark = function(id){
     });
 }
 
-db.updateBookmark = function(bookmark){
+db.updateBookmark = function(bookmark) {
-    var sql = "UPDATE `bookmarks` SET `title`='"+ bookmark.title +"', `description`='"+ bookmark.description+"', `url`='"+ bookmark.url +"', `public`='"+ bookmark.public +"' WHERE (`id`='"+ bookmark.id +"')";
+    var sql = "UPDATE `bookmarks` SET `title`='" + bookmark.title + "', `description`='" + bookmark.description + "', `url`='" + bookmark.url + "', `public`='" + bookmark.public + "' WHERE (`id`='" + bookmark.id + "')";
     return new Promise(function(resolve, reject) {
         client.query(sql, (err, result) => {
             if (err) {
@@ -64,8 +64,8 @@ db.updateBookmark = function(bookmark){
     });
 }
 
-db.getBookmark = function(id){
+db.getBookmark = function(id) {
-    var sql ="SELECT * FROM `bookmarks` WHERE `id` = '"+ id +"'";
+    var sql = "SELECT * FROM `bookmarks` WHERE `id` = '" + id + "'";
     return new Promise(function(resolve, reject) {
         client.query(sql, (err, result) => {
             if (err) {
@@ -77,8 +77,8 @@ db.getBookmark = function(id){
     });
 }
 
-db.getBookmarkTags = function(bookmard_id){
+db.getBookmarkTags = function(bookmard_id) {
-    var sql ="SELECT tag_id FROM `tags_bookmarks` WHERE `bookmark_id` = '"+ bookmard_id +"'";
+    var sql = "SELECT tag_id FROM `tags_bookmarks` WHERE `bookmark_id` = '" + bookmard_id + "'";
     return new Promise(function(resolve, reject) {
         client.query(sql, (err, result) => {
             if (err) {
@@ -92,7 +92,7 @@ db.getBookmarkTags = function(bookmard_id){
 }
 
 db.delBookmarkTags = function(bookmard_id) {
-    var sql = "DELETE FROM `tags_bookmarks` WHERE (`bookmark_id`='"+ bookmard_id +"')";
+    var sql = "DELETE FROM `tags_bookmarks` WHERE (`bookmark_id`='" + bookmard_id + "')";
     return new Promise(function(resolve, reject) {
         client.query(sql, (err, result) => {
             if (err) {
@@ -250,7 +250,22 @@ db.getBookmarksTable = function(user_id) {
             }
         });
     });
+}
 
+db.getBookmarksSearch = function(params) {
+    var search_word = params.searchWord;
+    var user_id = '1';
+    var sql = "SELECT id, user_id, title, description, url, public, click_count, DATE_FORMAT(created_at, '%Y-%m-%d') as created_at,  DATE_FORMAT(last_click, '%Y-%m-%d') as last_click FROM `bookmarks` WHERE user_id='" + user_id + "' AND (`title` LIKE '%"+ search_word +"%' OR `url` LIKE '%"+ search_word +"%') ORDER BY click_count DESC, created_at DESC LIMIT 0, 50";
+    console.log(sql);
+    return new Promise(function(resolve, reject) {
+        client.query(sql, (err, result) => {
+            if (err) {
+                reject(err);
+            } else {
+                resolve(result);
+            }
+        });
+    });
 }
 
 db.getBookmarksCard = function(user_id) {

public/scripts/controllers/edit-controller.js

@@ -148,6 +148,7 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', 'bookmarkService', 'p
         bookmarkService.getTags(params)
             .then((data) => {
                 $scope.tags = data;
+                $('.ui.modal.js-add-bookmark .ui.dropdown').removeClass('loading');
             })
             .catch((err) => console.log('getTags err', err));
     }

public/scripts/controllers/menus-controller.js

@@ -40,7 +40,11 @@ app.controller('menuCtr', ['$scope', '$stateParams', '$state', 'pubSubService',
      * @func
      * @desc 点击搜索按钮搜索书签
      */
-    $scope.searchBookmarks = function() {
+    $scope.searchBookmarks = function(searchWord) {
+        console.log(searchWord);
+        $state.go('search', {
+            searchWord: searchWord,
+        })
         updateMenuActive($scope.selectLoginIndex = 0);
     }
 

public/scripts/controllers/search-controller.js

@@ -1,15 +1,19 @@
 app.controller('searchCtr', ['$scope', '$state', '$stateParams', '$filter', '$window', '$timeout', 'bookmarkService', 'pubSubService', function($scope, $state, $stateParams, $filter, $window, $timeout, bookmarkService, pubSubService) {
     console.log("Hello searchCtr...", $stateParams);
     $scope.bookmarks = []; // 书签数据
-    $scope.showSearch = true; // 搜索对话框
+    $scope.showSearch = false; // 搜索对话框
     $scope.searchWord = ($stateParams && $stateParams.searchWord) || ''
     $scope.dateBegin = '';
     $scope.dateEnd = '';
     $scope.clickCount = '';
     $scope.username = '';
     $scope.userRange = '';
+    $scope.bookmarkCount = 0
+    var searchParams = {
+        searchWord: $scope.searchWord,
+    }
 
-    searchBookmarks($stateParams);
+    searchBookmarks(searchParams);
 
     $scope.delBookmark = function(bookmarkId) {
         var params = {
@@ -32,6 +36,10 @@ app.controller('searchCtr', ['$scope', '$state', '$stateParams', '$filter', '$wi
     }
 
     $scope.search = function() {
+        var params = {
+            searchWord: $scope.searchWord,
+        }
+        searchBookmarks(params)
         console.log('search..', $scope.searchWord, $scope.dateBegin, $scope.clickCount, $scope.username, $scope.userRange)
     }
 
@@ -39,6 +47,7 @@ app.controller('searchCtr', ['$scope', '$state', '$stateParams', '$filter', '$wi
         bookmarkService.searchBookmarks(params)
             .then((data) => {
                 $scope.bookmarks = data;
+                $scope.bookmarkCount = data.length;
                 pubSubService.publish('Common.menuActive', {
                     login: true,
                     index: 0

public/scripts/directives/js-init-directive.js

@@ -1,8 +1,8 @@
-app.directive('jsDataBeginInit', function($compile) {
+app.directive('jsDataCreateBeginInit', function($compile) {
     return {
         restrict: 'A',
         link: function($scope, $element, $attrs) {
-            $('.ui.calendar.js-date-begin').calendar({
+            $('.ui.calendar.js-date-create-begin').calendar({
                 type: 'date',
                 formatter: {
                     date: function(date, settings) {
@@ -13,18 +13,18 @@ app.directive('jsDataBeginInit', function($compile) {
                         return year + '/' + month + '/' + day;
                     }
                 },
-                endCalendar: $('.ui.calendar.js-date-end')
+                endCalendar: $('.ui.calendar.js-date-create-end')
             });
         },
     };
 });
 
 
-app.directive('jsDataEndInit', function($compile) {
+app.directive('jsDataCreateEndInit', function($compile) {
     return {
         restrict: 'A',
         link: function($scope, $element, $attrs) {
-            $('.ui.calendar.js-date-end').calendar({
+            $('.ui.calendar.js-date-create-end').calendar({
                 type: 'date',
                 formatter: {
                     date: function(date, settings) {
@@ -35,7 +35,50 @@ app.directive('jsDataEndInit', function($compile) {
                         return year + '/' + month + '/' + day;
                     }
                 },
-                startCalendar: $('.ui.calendar.js-date-begin')
+                startCalendar: $('.ui.calendar.js-date-create-begin')
+            });
+        },
+    };
+});
+
+app.directive('jsDataClickBeginInit', function($compile) {
+    return {
+        restrict: 'A',
+        link: function($scope, $element, $attrs) {
+            $('.ui.calendar.js-date-click-begin').calendar({
+                type: 'date',
+                formatter: {
+                    date: function(date, settings) {
+                        if (!date) return '';
+                        var day = date.getDate();
+                        var month = date.getMonth() + 1;
+                        var year = date.getFullYear();
+                        return year + '/' + month + '/' + day;
+                    }
+                },
+                endCalendar: $('.ui.calendar.js-date-click-end')
+            });
+        },
+    };
+});
+
+
+app.directive('jsDataClickEndInit', function($compile) {
+    return {
+        restrict: 'A',
+        link: function($scope, $element, $attrs) {
+            $('.ui.calendar.js-date-click-end').calendar({
+                type: 'date',
+                formatter: {
+                    date: function(date, settings) {
+                        if (!date) return '';
+                        var day = date.getDate();
+                        var month = date.getMonth() + 1;
+                        var year = date.getFullYear();
+                        return year + '/' + month + '/' + day;
+                    }
+                },
+                startCalendar: $('.ui.calendar.js-date-click-begin')
             });
         },
     };

public/scripts/services/bookmark-service.js

@@ -200,10 +200,10 @@ app.factory('httpInterceptor', ['$q', '$injector', function($q, $injector) {
         },
         responseError: function(err) {
             if (401 === err.status) {
-                toastr["error"]("警告", "您需要先登录才能使用该功能");
+                toastr.warning("您需要先登录才能使用该功能", "警告");
                 $injector.get('$state').go('login', {})
             } else {
-                toastr["error"]("警告", JSON.stringify(err));
+                toastr.error(JSON.stringify(err), "错误");
             }
             return $q.reject(err);
         }

public/views/menus.html

@@ -1,5 +1,5 @@
 <div class="js-menu" ng-controller="menuCtr">
-    <div class="ui large menu js-login-in" ng-if="login">
+    <div class="ui huge menu js-login-in" ng-if="login">
         <a class="item" ng-class="{selected:$index===selectLoginIndex}" ui-sref="{{ menu.uiSref }}" ui-sref-opts="{reload: true}" ng-repeat="menu in loginMenus">
             <div>{{ menu.title }}</div>
             <div class="ui floating simple dropdown icon js-bookmark-dropdown" ng-if="$index==0" ng-click="$event.stopPropagation();">
@@ -29,22 +29,22 @@
             </div>
         </a>
         <div class="right menu">
-            <div class="ui category right search item">
+            <div class="item">
                 <div class="ui transparent icon input">
-                    <input class="prompt" type="text" ng-model="searchWord" placeholder="标题，链接，分类...">
+                    <input class="prompt" type="text" ng-model="searchWord" placeholder="标题，链接..." ng-keypress="($event.which === 13)?searchBookmarks(searchWord):0">
                     <i class="search link icon" ng-click="searchBookmarks()" ui-sref="search({searchWord:searchWord})" ui-sref-opts="{reload: true}"></i>
                 </div>
                 <div class="results"></div>
             </div>
-            <div class="item">
+            <div class="item" title="添加书签" ng-click="showAddBookmarkMoadl()" ui-sref="bookmarks">
-                <i class="add square icon" title="添加书签" ng-click="showAddBookmarkMoadl()" ui-sref="bookmarks"></i>
+                <i class="add square icon"></i>
             </div>
             <div class="item">
                 <i class="sign out icon" title="退出登陆" ng-click="logout()"></i>
             </div>
         </div>
     </div>
-    <div class="ui large menu js-not-login-in" ng-if="!login">
+    <div class="ui huge menu js-not-login-in" ng-if="!login">
         <a class="item" ng-class="{selected:$index==selectNotLoginIndex}" ui-sref="{{ menu.uiSref}}" ui-sref-opts="{reload: true}" ng-click="selectMenu($index, login)" ng-repeat="menu in notLoginMenus">{{ menu.title}}</a>
     </div>
 </div>

public/views/search.html

@@ -1,5 +1,12 @@
-<div class="ui grid">
+<div class="ui grid" style="height:45px">
-    <div class="two wide column">
+    <div class="fourteen wide column" ng-show="!showSearch">
+        共为您找到相关书签约{{bookmarkCount}}个
+    </div>
+    <div class="left floated right aligned two wide column" ng-show="!showSearch">
+        <img class="ui ui middle aligned tiny image" ng-src="./images/cocktail.png" style="width:16px;height:16px"  ng-click="showSearch = !showSearch">
+        <span ng-click="showSearch = !showSearch">搜索工具</span>
+    </div>
+    <div class="two wide column" ng-show="showSearch">
         <div class="ui dropdown" js-dropdown-init>
             <div class="text">自己书签</div>
             <i class="dropdown icon"></i>
@@ -9,121 +16,94 @@
             </div>
         </div>
     </div>
-    <div class="two wide column">
+
+    <div class="two wide column" ng-show="showSearch">
         <div class="ui dropdown item" js-dropdown-init>
             <div class="text">创建时间不限</div>
             <i class="dropdown icon"></i>
             <div class="menu">
+                <div class="header">创建时间设定</div>
                 <div class="item">时间不限</div>
-                <div class="item">一天内</div>
                 <div class="item">一周内</div>
                 <div class="item">一月内</div>
                 <div class="item">一年内</div>
                 <div class="divider"></div>
                 <div class="header">自定义</div>
-                <div class="ui calendar js-date-begin" js-data-begin-init>
+                <div class="ui transparent input">
+                    <div class="ui calendar js-date-create-begin" js-data-create-begin-init>
                         <div class="ui transparent input left icon">
                             <i class="calendar icon"></i>
-                        <input type="text" placeholder="开始日期" ng-model="dateBegin">
+                            <input type="text" placeholder="开始日期" ng-model="dateCreateBegin">
                         </div>
                     </div>
-                <div class="ui calendar js-date-end" js-data-end-init>
+                </div>
+                <div class="ui transparent input">
+                    <div class="ui calendar js-date-create-end" js-data-create-end-init>
                         <div class="ui transparent input left icon">
                             <i class="calendar icon"></i>
-                        <input type="text" placeholder="结束日期" ng-model="dateEnd">
+                            <input type="text" placeholder="结束日期" ng-model="dateCreateEnd">
+                        </div>
+                    </div>
+                </div>
+                <div class="ui transparent input">
+                    <div class="ui basic button">确定</div>
                 </div>
             </div>
         </div>
     </div>
-    </div>
+    <div class="three wide column" ng-show="showSearch">
-    <div class="two wide column">
-        <div class="ui dropdown item" js-dropdown-init>
-            <div class="text">点击次数不限</div>
-            <i class="dropdown icon"></i>
-            <div class="menu">
-                <div class="item">自己书签</div>
-                <div class="item">全站书签</div>
-            </div>
-        </div>
-    </div>
-    <div class="three wide column">
         <div class="ui dropdown item" js-dropdown-init>
             <div class="text">点击时间不限</div>
             <i class="dropdown icon"></i>
             <div class="menu">
-                <div class="item">自己书签</div>
+                <div class="header">点击时间设定</div>
-                <div class="item">全站书签</div>
+                <div class="item">时间不限</div>
+                <div class="item">一周内</div>
+                <div class="item">一月内</div>
+                <div class="item">一年内</div>
+                <div class="divider"></div>
+                <div class="header">自定义</div>
+                <div class="ui transparent input">
+                    <div class="ui calendar js-date-click-begin" js-data-click-begin-init>
+                        <div class="ui transparent input left icon">
+                            <i class="calendar icon"></i>
+                            <input type="text" placeholder="开始日期" ng-model="dateClickBegin">
                         </div>
                     </div>
                 </div>
-    <div class="three wide column">
+                <div class="ui transparent input">
+                    <div class="ui calendar js-date-click-end" js-data-click-end-init>
+                        <div class="ui transparent input left icon">
+                            <i class="calendar icon"></i>
+                            <input type="text" placeholder="结束日期" ng-model="dateClickEnd">
+                        </div>
+                    </div>
+                </div>
+                <div class="ui transparent input">
+                    <div class="ui basic button">确定</div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="two wide column" ng-show="showSearch">
         <div class="ui transparent icon input">
             <input class="prompt" type="text" placeholder="用户账号" ng-model="username">
         </div>
     </div>
-    <div class="two wide column">
+    <div class="four wide column" ng-show="showSearch">
         <div class="ui transparent input">
-            <input type="text" placeholder="标题，链接，分类" ng-model="searchWord">
+            <input type="text" placeholder="标题，链接..." ng-model="searchWord">
         </div>
     </div>
-    <div class="one wide column">
+    <div class="left floated right aligned one wide column" ng-show="showSearch">
         <i class="search icon" title="搜索" ng-click="search()"></i>
     </div>
-    <div class="one wide column">
+    <div class="left floated right aligned two wide column" ng-show="showSearch">
-        <i class="space shuttle icon" title="隐藏搜索工具"></i>
+        <img class="ui ui middle aligned tiny image" ng-src="./images/hide.png" style="width:16px;height:16px"  ng-click="showSearch = !showSearch" >
-    </div>
+        <span ng-click="showSearch = !showSearch" >收起</span>
-</div>
-<div class="ui small menu js-search-detail" ng-show="false">
-    <div class="ui dropdown item" js-dropdown-init>
-        <div class="text">搜索范围</div>
-        <i class="dropdown icon"></i>
-        <div class="menu">
-            <div class="item">自己书签</div>
-            <div class="item">全站书签</div>
-        </div>
-    </div>
-    <div class="item" style="width:136px;">
-        <div class="ui calendar js-date-begin" js-data-begin-init>
-            <div class="ui transparent input left icon">
-                <i class="calendar icon"></i>
-                <input type="text" placeholder="开始日期" ng-model="dateBegin">
-            </div>
-        </div>
-    </div>
-    <div class="item" style="width:136px;">
-        <div class="ui calendar js-date-end" js-data-end-init>
-            <div class="ui transparent input left icon">
-                <i class="calendar icon"></i>
-                <input type="text" placeholder="结束日期" ng-model="dateEnd">
-            </div>
-        </div>
-    </div>
-    <div class="ui dropdown item" js-dropdown-init>
-        <div class="text">点击次数</div>
-        <i class="dropdown icon"></i>
-        <div class="menu">
-            <div class="item">大于</div>
-            <div class="item">小于</div>
-        </div>
-    </div>
-    <div class="ui item transparent icon input" style="width:120px;">
-        <input class="prompt" type="text" placeholder="点击次数" ng-model="clickCount">
-    </div>
-    <div class="ui item transparent icon input" style="width:120px;">
-        <input class="prompt" type="text" placeholder="用户账号" ng-model="username">
-    </div>
-    <div class="ui item transparent icon input" style="width:160px;">
-        <input type="text" placeholder="标题，链接，分类" ng-model="searchWord">
-    </div>
-    <div class="right menu">
-        <div class="item">
-            <i class="search icon" title="搜索" ng-click="search()"></i>
-        </div>
-        <div class="item" ng-click="showSearch = !showSearch">
-            <i class="space shuttle icon" title="隐藏搜索工具"></i>
-        </div>
     </div>
 </div>
+
 <table class="ui celled table">
     <thead>
         <tr>
@@ -181,4 +161,3 @@
         </tr>
     </tfoot>
 </table>
-<p>这是搜索页面</p>

routes/api.js

@@ -215,10 +215,11 @@ api.get('/searchBookmarks', function(req, res) {
         res.send(401);
         return;
     }
+    var params = req.query;
     var bookmarks = [];
     var tagsBookmarks = [];
     var userId = '1';
-    db.getBookmarksTable(userId)
+    db.getBookmarksSearch(params)
         .then((bms) => {
             bookmarks = bms;
             var bookmarkIds = bookmarks.map((bookmark) => bookmark.id);