在书签菜单里面加了展示方式选项

public/scripts/controllers/bookmarks-controller.js

@@ -13,10 +13,13 @@ app.controller('bookmarksCtr', ['$scope', '$stateParams', '$filter', 'bookmarkSe
 
     pubSubService.subscribe('MenuCtr.bookmarks', $scope, function(event, data) {
         console.log('subscribe MenuCtr.bookmarks', data);
-        $scope.showSearch = (Math.random() >= 0.5);
+        // $scope.showSearch = (Math.random() >= 0.5);
-        if ($scope.showSearch) {
+        // if ($scope.showSearch) {
-            semanticInit();
+        //     setTimeout(() => {
-        }
+        //         semanticInit();
+        //     }, 100);
+        //
+        // }
         getBookmarks(data);
     });
 

public/scripts/controllers/menus-controller.js

@@ -8,11 +8,14 @@ app.controller('menuCtr', ['$scope', '$state', 'pubSubService', function($scope,
     /**
      * @todo http://stackoverflow.com/questions/31449948/ui-router-state-go-not-working
      */
-     if ($scope.login) {
+    if ($scope.login) {
-         setTimeout(() => {
+        setTimeout(() => {
-             $state.go('bookmarks', {foo: 'i love you', bar: 'hello world'})
+            $state.go('bookmarks', {
-         }, 0);
+                foo: 'i love you',
-     }
+                bar: 'hello world'
+            })
+        }, 0);
+    }
 
     // 登陆之后显示的菜单数据。uiSerf：内部跳转链接。
     $scope.loginMenus = [{
@@ -86,6 +89,9 @@ app.controller('menuCtr', ['$scope', '$state', 'pubSubService', function($scope,
     }
 
     function semanticInit() {
-        $('.ui.dropdown').dropdown();
+        // $('.ui.dropdown').dropdown();
+        $('.ui.dropdown.js-bookmark-dropdown').dropdown({
+            maxSelections: 2,
+        });
     }
 }]);

public/views/bookmarks.html

@@ -7,7 +7,6 @@
             <div class="item">全站书签</div>
         </div>
     </div>
-
     <div class="item" style="width:136px;">
         <div class="ui calendar js-date-begin">
             <div class="ui transparent input left icon">
@@ -24,7 +23,6 @@
             </div>
         </div>
     </div>
-
     <div class="ui dropdown item">
         <div class="text">点击次数</div>
         <i class="dropdown icon"></i>
@@ -33,30 +31,26 @@
             <div class="item">小于</div>
         </div>
     </div>
-
     <div class="ui item transparent icon input" style="width:120px;">
         <input class="prompt" type="text" ng-model="keyword" placeholder="点击次数">
     </div>
-
     <div class="ui item transparent icon input" style="width:120px;">
         <input class="prompt" type="text" ng-model="keyword" placeholder="用户账号">
     </div>
-
     <div class="ui item transparent icon input" style="width:160px;">
         <input type="text" placeholder="标题，链接，分类">
     </div>
-
     <div class="right item">
         <div class="ui button">搜索</div>
     </div>
-
 </div>
-
 <table class="ui celled table" ng-show="bookmarks.length > 0">
     <thead>
         <tr>
             <th>标题</th>
-            <th>描述</th>
+            <th>创建日期</th>
+            <th>最后点击日期</th>
+            <th>点击次数</th>
             <th>链接</th>
             <th>标签</th>
         </tr>
@@ -64,14 +58,16 @@
     <tbody>
         <tr ng-repeat="bookmark in bookmarks">
             <td>{{ bookmark.title }}</td>
-            <td>{{ bookmark.description }}</td>
+            <td>{{ bookmark.create_date }}</td>
+            <td>{{ bookmark.click_latest_date }}</td>
+            <td>{{ bookmark.click_count }}</td>
             <td>{{ bookmark.url }}</td>
             <td>{{ bookmark.tags }}</td>
         </tr>
     </tbody>
     <tfoot>
         <tr>
-            <th colspan="4">
+            <th colspan="6">
                 <div class="ui right floated pagination menu">
                     <a class="icon item">
                         <i class="left chevron icon"></i>

public/views/edit.html

@@ -37,6 +37,10 @@
                     </div>
                 </div>
             </div>
+            <div class="field">
+                <label>备忘</label>
+                <textarea rows="2" placeholder="可以是网站的说明，也可以备忘一下账号密码什么的，就算公开你的链接，这个也只有自己能在详情里面看到"></textarea>
+            </div>
             <div class="ui segment">
                 <div class="field">
                     <div class="ui toggle checkbox checked">

public/views/menus.html

@@ -1,6 +1,33 @@
 <div class="js-menu" ng-controller="menuCtr">
     <div class="ui small menu js-login-in" ng-show="login">
-        <a class="item" ng-class="{active:$index==selectLoginIndex}" ui-sref="{{ menu.uiSref }}" ng-click="selectMenu($index, login)" ng-repeat="menu in loginMenus">{{ menu.title}}</a>
+        <a class="item" ng-class="{active:$index==selectLoginIndex}" ui-sref="{{ menu.uiSref }}" ng-click="selectMenu($index, login)" ng-repeat="menu in loginMenus">{{ menu.title }}
+            <div class="ui inline labeled dropdown js-bookmark-dropdown" ng-if="$index==0">&nbsp;
+                <i class="dropdown icon"></i>
+                <div class="menu">
+                    <div class="header">显示方式</div>
+                    <div class="divider"></div>
+                    <div class="item">导航</div>
+                    <div class="item">表格</div>
+                    <div class="item">卡片</div>
+                    <div class="divider"></div>
+                    <div class="header">搜索方式</div>
+                    <div class="item">状态</div>
+                    <div class="item">取消</div>
+                </div>
+            </div>
+        </a>
+        <div class="ui buttons menu">
+            <div class="ui button">切换</div>
+            <div class="ui floating dropdown icon button">
+                <i class="dropdown icon"></i>
+                <div class="menu">
+                    <div class="item" data-value="drop">下拉</div>
+                    <div class="item" data-value="horizontal flip">水平翻转</div>
+                    <div class="item" data-value="fade up">渐隐</div>
+                    <div class="item" data-value="scale">规模</div>
+                </div>
+            </div>
+        </div>
         <div class="right menu">
             <div class="ui category right search item">
                 <div class="ui transparent icon input">

routes/api.js

@@ -1,23 +1,60 @@
-
 var api = require('express').Router();
 
-api.get('/bookmarks', function (req, res) {
+api.get('/bookmarks', function(req, res) {
-	console.log('hello bookmarks', JSON.stringify(req.query));
+    console.log('hello bookmarks', JSON.stringify(req.query));
 
-	var data = [
+    var data = [{
-		{title:'谷歌', description:'一个网站', url:'https://www.google.com.hk/', tags:['搜索','常用']},
+        title: '谷歌',
-		{title:'百度', description:'二个网站', url:'https://www.baidu.com/', tags:['搜索','常用']},
+        description: '一个网站',
-		{title:'博客', description:'三个网站', url:'http://luchenqun.com/', tags:['博文','常用']},
+        create_date: '20161025',
-		{title:'腾讯', description:'四个网站', url:'http://www.qq.com/', tags:['新闻','常用']},
+        click_count: parseInt(Math.random() * 100),
-		{title:'知乎', description:'五个网站', url:'http://www.zhihu.com/', tags:['问题','常用']}
+        click_latest_date: '20161025',
-	]
+        url: 'https://www.google.com.hk/',
-	res.json(data);
+        tags: ['搜索', '常用']
+    }, {
+        title: '百度',
+        description: '二个网站',
+        create_date: '20161025',
+        click_count: parseInt(Math.random() * 100),
+        click_latest_date: '20161025',
+        click_count: parseInt(Math.random() * 100),
+        url: 'https://www.baidu.com/',
+        tags: ['搜索', '常用']
+    }, {
+        title: '博客',
+        description: '三个网站',
+        create_date: '20161025',
+        click_count: parseInt(Math.random() * 100),
+        click_latest_date: '20161025',
+        click_count: parseInt(Math.random() * 100),
+        url: 'http://luchenqun.com/',
+        tags: ['博文', '常用']
+    }, {
+        title: '腾讯',
+        description: '四个网站',
+        create_date: '20161025',
+        click_count: parseInt(Math.random() * 100),
+        click_latest_date: '20161025',
+        click_count: parseInt(Math.random() * 100),
+        url: 'http://www.qq.com/',
+        tags: ['新闻', '常用']
+    }, {
+        title: '知乎',
+        description: '五个网站',
+        create_date: '20161025',
+        click_count: parseInt(Math.random() * 100),
+        click_latest_date: '20161025',
+        click_count: parseInt(Math.random() * 100),
+        url: 'http://www.zhihu.com/',
+        tags: ['问题', '常用']
+    }]
+    res.json(data);
 });
 
-api.get('/tags', function (req, res) {
+api.get('/tags', function(req, res) {
-	console.log('hello tags', JSON.stringify(req.query));
+    console.log('hello tags', JSON.stringify(req.query));
-	var data = ['搜索', '常用', '新闻', '博文', 'JavaScript']
+    var data = ['搜索', '常用', '新闻', '博文', 'JavaScript']
-	res.json(data);
+    res.json(data);
 });
 
 module.exports = api;