From 38d80e3a385b986f0df9c6898a571e30a9e86732 Mon Sep 17 00:00:00 2001 From: luchenqun Date: Thu, 27 Oct 2016 17:53:13 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A4=A7=E6=A6=82=E5=AE=8C=E6=88=90=E4=BA=86?= =?UTF-8?q?=E6=A0=87=E7=AD=BE=E5=AF=BC=E8=88=AA=E7=9A=84=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/css/style.css | 25 ++- .../controllers/bookmarks-controller.js | 116 ++++++-------- public/views/bookmarks.html | 50 +++--- routes/api.js | 149 +++++++++++------- 4 files changed, 185 insertions(+), 155 deletions(-) diff --git a/public/css/style.css b/public/css/style.css index 9453385..ff1317a 100644 --- a/public/css/style.css +++ b/public/css/style.css @@ -1,8 +1,25 @@ body { - padding: 50px; - font: 14px "Lucida Grande", Helvetica, Arial, sans-serif; + padding: 50px; + font: 14px "Lucida Grande", Helvetica, Arial, sans-serif; } -a { - color: #00B7FF; +.div-hover { + background:#F5F5F5; + cursor:pointer; +} + +.img-fixed-size{ + width:16px; + height:16px; +} + +.js-navigate-bookmark{ + white-space:nowrap; + text-overflow:ellipsis; + -o-text-overflow:ellipsis; + overflow: hidden; + color:#212121; +} +.js-navigate-bookmark a{ + color:#212121; } diff --git a/public/scripts/controllers/bookmarks-controller.js b/public/scripts/controllers/bookmarks-controller.js index 5531c97..3f2cf11 100644 --- a/public/scripts/controllers/bookmarks-controller.js +++ b/public/scripts/controllers/bookmarks-controller.js @@ -1,54 +1,27 @@ -app.controller('bookmarksCtr', ['$scope', '$stateParams', '$filter', 'bookmarkService', 'pubSubService', function($scope, $stateParams, $filter, bookmarkService, pubSubService) { +app.controller('bookmarksCtr', ['$scope', '$stateParams', '$filter', '$window', 'bookmarkService', 'pubSubService', function($scope, $stateParams, $filter, $window, bookmarkService, pubSubService) { console.log("Hello bookmarksCtr...", $stateParams); $scope.bookmarks = []; // 书签数据 $scope.showSearch = false; // 书签数据 - $scope.showStyle = 'table'; // 显示风格'navigate', 'card', 'table' - $scope.test = [{ - a: 1 - }, { - a: 1 - }, { - a: 1 - }, { - a: 1 - }, { - a: 1 - }, { - a: 1 - }, { - a: 1 - }, { - a: 1 - }, { - a: 1 - }, { - a: 1 - }]; - + $scope.showStyle = 'navigate'; // 显示风格'navigate', 'card', 'table' semanticInit(); var params = { - s: 111, - b: 222, - i: 'lcq' + show: $scope.showStyle, } getBookmarks(params); + $scope.jumpToUrl = function(url) { + console.log(url); + $window.open(url, '_blank'); + } - pubSubService.subscribe('MenuCtr.bookmarks', $scope, function(event, data) { - console.log('subscribe MenuCtr.bookmarks', data); - // $scope.showSearch = (Math.random() >= 0.5); - // if ($scope.showSearch) { - // setTimeout(() => { - // semanticInit(); - // }, 100); - // - // } - getBookmarks(data); + pubSubService.subscribe('MenuCtr.bookmarks', $scope, function(event, params) { + console.log('subscribe MenuCtr.bookmarks', params); + getBookmarks(params); }); - pubSubService.subscribe('MenuCtr.searchBookmarks', $scope, function(event, data) { - console.log('subscribe MenuCtr.searchBookmarks', data); - getBookmarks(data); + pubSubService.subscribe('MenuCtr.searchBookmarks', $scope, function(event, params) { + console.log('subscribe MenuCtr.searchBookmarks', params); + getBookmarks(params); }); function getBookmarks(params) { @@ -64,32 +37,41 @@ app.controller('bookmarksCtr', ['$scope', '$stateParams', '$filter', 'bookmarkSe } function semanticInit() { - $('.ui.dropdown').dropdown(); - $('.ui.calendar.js-date-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-end') - }); - $('.ui.calendar.js-date-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-begin') - }); + setTimeout(() => { + $('.ui.dropdown').dropdown(); + $('.ui.calendar.js-date-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-end') + }); + $('.ui.calendar.js-date-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-begin') + }); + + $('.js-navigate-bookmark').hover(function() { + $(this).addClass('div-hover'); + }, function() { + //鼠标离开时移除divOver样式 + $(this).removeClass('div-hover'); + }); + }, 100); } }]); diff --git a/public/views/bookmarks.html b/public/views/bookmarks.html index df5cf58..35e9ea6 100644 --- a/public/views/bookmarks.html +++ b/public/views/bookmarks.html @@ -1,22 +1,37 @@ -
-
-
+
+
+
- ssssss + {{ tag.name }}
-
-
-
-
-
Elliot Fu
-
Friend
-
+
+
+
+ + {{ bookmark.title}}
+
+
+ +
+
+ {{ tag.name }} +
+ +
+ + {{ bookmark.title}} +
+
+
+
+
+
搜索范围
@@ -113,16 +128,3 @@ -ght chevron icon"> - -
- - - - -/a> -
- - - - diff --git a/routes/api.js b/routes/api.js index 43b8cc2..69ad487 100644 --- a/routes/api.js +++ b/routes/api.js @@ -1,77 +1,106 @@ var api = require('express').Router(); var mysql = require('mysql'); -// var client = mysql.createConnection({ -// host: '172.24.13.5', -// user: 'root', -// password: 'root123', -// database: 'mybookmarks', -// multipleStatements: true, -// port: 3306 -// }); var client = mysql.createConnection({ - host: '127.0.0.1', - user: 'lcq', - password: '123456', + host: '172.24.13.5', + user: 'root', + password: 'root123', database: 'mybookmarks', multipleStatements: true, port: 3306 }); +// var client = mysql.createConnection({ +// host: '127.0.0.1', +// user: 'lcq', +// password: '123456', +// database: 'mybookmarks', +// multipleStatements: true, +// port: 3306 +// }); client.connect(); api.get('/bookmarks', function(req, res) { console.log('hello bookmarks', JSON.stringify(req.query)); - var sqlBookmarks = "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='1' ORDER BY click_count DESC, created_at DESC LIMIT 0, 50"; - var sqlTags = "SELECT id, name FROM `tags` WHERE user_id='1'"; - - client.query(sqlBookmarks, function(error, data1, fields) { - if (error) { - res.json({ - error: "数据查询出错" - }); - } else { - var bookmark_ids = '' - data1.forEach(function(bookmark) { - bookmark_ids += "'" + bookmark.id + "',"; - }) - bookmark_ids = bookmark_ids.slice(0, bookmark_ids.length - 1); - - var sqlTagIdBookmarkId = "SELECT * FROM `tags_bookmarks` WHERE bookmark_id in(" + bookmark_ids + ")"; - client.query(sqlTagIdBookmarkId, function(error, data2, fields) { - // console.log(data2); - if (error) { - res.json({ - error: "数据查询出错" - }); - } else { - client.query(sqlTags, function(error, data3, fields) { - // console.log(data3); - if (error) { - res.json({ - error: "数据查询出错" - }); - } else { - var data = []; - data1.forEach(function(bookmark) { - var tags = []; - data2.forEach(function(bookmark_tag) { - if (bookmark_tag.bookmark_id == bookmark.id) { - data3.forEach(function(tag) { - if (bookmark_tag.tag_id == tag.id) { - tags.push(tag) - } - }) - } - }); - bookmark.tags = tags; - data.push(bookmark); - }) - res.json(data); - } + if (req.query.show === 'navigate') { + 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 ORDER BY t.id ASC, b.click_count DESC"; + client.query(sql, function(error, result, fields) { + var data = []; + var tag = { + id: result && result[0] && result[0].tag_id, + name: result && result[0] && result[0].tag_name, + bookmarks: [] + }; + result.forEach(function(bookmark) { + if (tag.id !== bookmark.tag_id) { + data.push({ + id: tag.id, + name: tag.name, + bookmarks: tag.bookmarks }); + tag.id = bookmark.tag_id; + tag.name = bookmark.tag_name; + tag.bookmarks = []; } + tag.bookmarks.push(bookmark); }); - } - }); + if (result && result.length > 0) { + data.push(tag); + } + res.json(data); + }) + } else { + var sqlBookmarks = "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='1' ORDER BY click_count DESC, created_at DESC LIMIT 0, 50"; + var sqlTags = "SELECT id, name FROM `tags` WHERE user_id='1'"; + + client.query(sqlBookmarks, function(error, result1, fields) { + if (error) { + res.json({ + error: "数据查询出错" + }); + } else { + var bookmark_ids = '' + result1.forEach(function(bookmark) { + bookmark_ids += "'" + bookmark.id + "',"; + }) + bookmark_ids = bookmark_ids.slice(0, bookmark_ids.length - 1); + + var sqlTagIdBookmarkId = "SELECT * FROM `tags_bookmarks` WHERE bookmark_id in(" + bookmark_ids + ")"; + client.query(sqlTagIdBookmarkId, function(error, result2, fields) { + // console.log(result2); + if (error) { + res.json({ + error: "数据查询出错" + }); + } else { + client.query(sqlTags, function(error, result3, fields) { + // console.log(result3); + if (error) { + res.json({ + error: "数据查询出错" + }); + } else { + var data = []; + result1.forEach(function(bookmark) { + var tags = []; + result2.forEach(function(bookmark_tag) { + if (bookmark_tag.bookmark_id == bookmark.id) { + result3.forEach(function(tag) { + if (bookmark_tag.tag_id == tag.id) { + tags.push(tag) + } + }) + } + }); + bookmark.tags = tags; + data.push(bookmark); + }) + res.json(data); + } + }); + } + }); + } + }); + } }); api.get('/tags', function(req, res) {