备忘录使用列表显示

This commit is contained in:
luchenqun 2018-04-15 21:59:09 +08:00
parent 5d90a022b2
commit 0d5cc8ffc1
2 changed files with 89 additions and 61 deletions

View File

@ -130,8 +130,9 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
});
}
$scope.copy = function(content) {
$scope.copy = function (content, $event) {
dataService.clipboard(content);
$event && $event.stopPropagation();
}
$scope.delNote = function (id, content) {
@ -264,6 +265,21 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
}
}
$scope.noteClick = function (note, flag, $event) {
if (!note.detail || flag) {
var detail = note.detail;
$scope.notes.forEach((note) => {
note.detail = false;
$("#" + note.id).css("background", "none");
})
note.detail = !detail;
$("#" + note.id).css("background", note.detail ? "#f8f8f8" : "none");
}
if (flag) {
$event && $event.stopPropagation();
}
}
function updateSelectTag(tagId) {
$scope.tags.forEach((tag) => {
tag.clicked = false;
@ -306,6 +322,13 @@ app.controller('noteCtr', ['$scope', '$state', '$stateParams', '$filter', '$wind
bookmarkService.getNotes(params)
.then((data) => {
$scope.notes = data.notes;
$scope.notes.forEach((note) => {
note.brief = note.content;
while (note.brief.indexOf("\n") > 0) {
note.brief = note.brief.replace(/\n/g, "");
}
note.brief = " " + note.brief.substring(0, 200) + (note.content.length > 200 ? " ......" : "");
})
$scope.totalPages = Math.ceil(data.totalItems / perPageItems);
$scope.totalItems = data.totalItems;
$timeout(function () {

View File

@ -1,6 +1,12 @@
<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.name }} ({{ tag.ncnt || 0 }})</div>
<div class="ui label" style="margin:3px 15px 8px 0px;cursor:default;" ng-click="showAddNote()" data-tooltip="点击添加备忘。你也可以在任意界面按快捷键A(不区分大小写)增加备忘录。"><i class="plus icon" style="margin-right:0px;"></i></div>
<div class="ui segment js-note-card" style="padding:14px 0px 0px 0px;">
<div class="ui container" style="padding-left:14px">
<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.name }} ({{ tag.ncnt || 0 }})</div>
<div class="ui label" style="margin:3px 15px 8px 0px;cursor:default;" ng-click="showAddNote()" data-tooltip="点击添加备忘。你也可以在任意界面按快捷键A(不区分大小写)增加备忘录。">
<i class="plus icon" style="margin-right:0px;"></i>
</div>
</div>
<div class="ui container" style="padding-left:14px;padding-bottom:14px">
<div class="ui form" ng-show="add">
<div class="required field">
<label>内容</label>
@ -15,8 +21,9 @@
</div>
</div>
</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">
</div>
<div class="ui divider" ng-show="notes.length > 0" style="margin:0px;"></div>
<div class="ui hidden info message js-note" ng-if="(!add) && notes.length == 0" style="margin-left:14px;margin-right:14px">
<i class="close icon" ng-click="closeNote()"></i>
<div class="content">
<div class="header">系统提示!
@ -26,35 +33,33 @@
</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)">
<div class="description" style="word-break:break-all;max-width:175px;height:184px;line-height:21px; word-wrap:break-word;text-overflow:ellipsis;overflow:hidden;">
<pre class="note-content" style="margin-top:0px;">{{ note.content }}</pre>
</div>
</div>
<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>
<div class="ui vertical segment" ng-repeat="note in notes" ng-click="noteClick(note)" ng-mouseover="setHoverNote(note)" ng-mouseleave="setHoverNote(null)" id="{{note.id}}" style="margin:0px;padding-top:10px;padding-bottom: 10px;">
<pre class="note-content" title="单击查看详情C复制D删除E编辑" style="margin:0px;padding-left:14px;padding-right:14px" ng-if="!note.detail">{{ note.brief }}</pre>
<pre class="note-content" title="双击复制" ng-dblclick="copy(note.content)" style="margin:0px; font-size:16px;padding-left:14px;padding-right:14px" ng-if="note.detail">{{ note.content }}</pre>
<div class="ui right aligned grid" ng-show="note.detail">
<div class="sixteen wide column" style="margin:0px 20px 0px 0px;padding:20px 0px 0px 0px;">
<div class="extra content" ng-show="true" ng-mouseleave="note.edit=false;" style="height:50px;">
<div class="ui mini label" ng-click="clickTag(note.tag_id)" style="margin:3px 0px 0px 10px;cursor:default;">{{ note.tagName || "未分类" }}</div>
<span style="margin:0 8px;">
<span title="添加于{{note.created_at}}" class="need_to_be_rendered" data-timeago="{{ note.created_at }}"></span>
<span style="margin-left:-3px;">添加</span>
</span>
<div class="ui label" ng-click="clickTag(note.tag_id)" 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="删除备忘">
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 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, note.tag_id)" title="编辑备忘">
<img class="ui mini spaced image" style="width:16px;height:16px;margin:0 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="备忘详情">
<img class="ui mini spaced image" id="noteid{{note.id}}" style="width:16px;height:16px;margin:0 8px;" ng-src="./images/copy.png"
id="url{{bookmark.id}}" ng-click="copy(note.content)" title="复制备忘">
<i class="chevron up icon" title="收起详情" ng-click="noteClick(note, true, $event)"></i>
</div>
</div>
</div>
</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;">
<div class="ui grid" ng-show="totalItems>0" style="margin:0px;padding:0px 14px">
<div class="eight wide column" style="padding-top:26px;">
<span ng-show="searchWord">通过搜索关键字"{{searchWord}}"(点击菜单"备忘录"重新查看所有)</span>共找到备忘一共约{{totalItems}}个
</div>
<div class="eight wide column">