修改书签操作页面选择分类的逻辑。由以前在下拉列表选分类，改为更直观地选标签
This commit is contained in:
luchenqun
parent
8dc3e53dfd
commit
d8900152bd
|
|
@ -35,52 +35,8 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
});
|
||||
});
|
||||
|
||||
$scope.addTags = function() {
|
||||
console.log('Hello , you have click add tag btn......');
|
||||
|
||||
// 先将中文逗号替换成英文逗号，然后将多个英文逗号换成一个英文逗号
|
||||
$scope.newTags = $scope.newTags.replace(/，/g, ",").replace(/,+/g, ",");
|
||||
var tags = $scope.newTags.split(",");
|
||||
var params = [];
|
||||
tags.forEach(function(tag) {
|
||||
tag = tag.replace(/(^\s*)|(\s*$)/g, '').replace(/\s+/g, ' '); // 去除前后空格，多个空格转为一个空格;
|
||||
// 过滤是""的情况
|
||||
if (tag) {
|
||||
params.push(tag);
|
||||
}
|
||||
});
|
||||
|
||||
if (tags.length + $scope.tags.length >= 30) {
|
||||
toastr.error('标签个数总数不能超过30个！不允许再添加新分类，如有需求，请联系管理员。', "提示");
|
||||
return;
|
||||
}
|
||||
|
||||
bookmarkService.addTags(params)
|
||||
.then((data) => {
|
||||
$scope.tags = data;
|
||||
pubSubService.publish('EditCtr.addTagsSuccess', data);
|
||||
$scope.newTags = '';
|
||||
toastr.success('[ ' + params.toString() + ' ]分类添加成功！', "提示");
|
||||
$timeout(() => {
|
||||
// 将新增加的分类自动添加到下啦列表中
|
||||
var count = 0;
|
||||
params.forEach((tagName) => {
|
||||
data.forEach((tag) => {
|
||||
if (tagName == tag.name) {
|
||||
if (count < maxSelections) {
|
||||
$('.ui.fluid.search.dropdown').dropdown('set selected', tag.id);
|
||||
}
|
||||
count++;
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
})
|
||||
.catch((err) => console.log('addTags err', err));
|
||||
}
|
||||
$scope.cancel = function() {
|
||||
$('.ui.modal.js-add-bookmark').modal('hide');
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').dropdown('clear');
|
||||
|
||||
init();
|
||||
}
|
||||
|
|
@ -121,7 +77,6 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
.then((data) => {
|
||||
$('.ui.modal.js-add-bookmark').modal('hide');
|
||||
pubSubService.publish('EditCtr.inserBookmarsSuccess', data);
|
||||
console.log(JSON.stringify(data));
|
||||
if (data.title) {
|
||||
toastr.success('[ ' + data.title + ' ] 添加成功，将自动重新更新书签！</br>' + (data.update ? '系统检测到该书签之前添加过，只更新链接，描述，标题，分类。创建日期与最后点击日期不更新！' : ''), "提示");
|
||||
} else {
|
||||
|
|
@ -166,7 +121,17 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
toastr.error('标签个数总数不能超过30个！不允许再添加新分类，如有需求，请联系管理员。', "提示");
|
||||
return;
|
||||
}
|
||||
|
||||
tag = tag.replace(/(^\s*)|(\s*$)/g, '').replace(/\s+/g, ' '); // 去除前后空格，多个空格转为一个空格;
|
||||
|
||||
var exist = $scope.tags.some((item) => {
|
||||
return item.name == tag;
|
||||
})
|
||||
if (exist) {
|
||||
toastr.error('该分类【' + tag + '】已存在！', "提示");
|
||||
return;
|
||||
}
|
||||
|
||||
if (tag) {
|
||||
ngDialog.close(dialog);
|
||||
|
||||
|
|
@ -174,9 +139,23 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
tags.push(tag);
|
||||
bookmarkService.addTags(tags)
|
||||
.then((data) => {
|
||||
console.log(JSON.stringify(data));
|
||||
toastr.success('[ ' + tag + ' ]插入分类成功！将自动更新分类信息', "提示");
|
||||
// getTags({});
|
||||
|
||||
// 获取已经选择的个数
|
||||
var clickedCount = $scope.tags.filter((item) => {
|
||||
return item.clicked;
|
||||
}).length
|
||||
|
||||
// 获取新增的tag(由于这里只增加一个，所以弹出数组最后一个即可)
|
||||
var newTag = data.filter((item) => {
|
||||
return item.name == tag;
|
||||
}).pop();
|
||||
|
||||
if (newTag) {
|
||||
newTag.clicked = clickedCount <= 2;
|
||||
$scope.tags.push(newTag);
|
||||
}
|
||||
|
||||
toastr.success('[ ' + tag + ' ]插入分类成功！', "提示");
|
||||
})
|
||||
.catch((err) => {
|
||||
toastr.warning('[ ' + tag + ' ]插入分类失败：' + JSON.stringify(err), "提示");
|
||||
|
|
@ -203,7 +182,7 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
}
|
||||
|
||||
currCntTag += Number(clicked);
|
||||
if (currCntTag <= 3) {
|
||||
if (currCntTag <= 3 && currCntTag >= 1) {
|
||||
if (clickTag) {
|
||||
clickTag.clicked = clicked;
|
||||
}
|
||||
|
|
@ -218,8 +197,6 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
$('.ui.modal.js-add-bookmark').modal({
|
||||
closable: false,
|
||||
}).modal('setting', 'transition', dataService.animation()).modal('show');
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').dropdown('clear');
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').addClass('loading');
|
||||
$('.ui.checkbox.js-public').checkbox('set checked');
|
||||
cancelDefault = true;
|
||||
init();
|
||||
|
|
@ -234,9 +211,9 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
setTimeout(function() {
|
||||
$('.ui.modal.js-add-bookmark').modal("refresh");
|
||||
}, 500);
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').dropdown('clear');
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').addClass('loading');
|
||||
$scope.add = false;
|
||||
$scope.loadTags = true;
|
||||
cancelDefault = false;
|
||||
bookmarkService.getBookmark(params)
|
||||
.then((data) => {
|
||||
console.log('getBookmark ', data);
|
||||
|
|
@ -263,8 +240,7 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
})
|
||||
});
|
||||
});
|
||||
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').removeClass('loading');
|
||||
$scope.loadTags = false;
|
||||
})
|
||||
.catch((err) => console.log('updateBookmark err', err));
|
||||
});
|
||||
|
|
@ -274,17 +250,13 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
$('.ui.modal.js-add-bookmark').modal({
|
||||
closable: false,
|
||||
}).modal('setting', 'transition', dataService.animation()).modal('show');
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').dropdown('clear');
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').addClass('loading');
|
||||
$('.ui.checkbox.js-public').checkbox('set checked');
|
||||
cancelDefault = false;
|
||||
init();
|
||||
getTags({});
|
||||
$scope.autoGettitle = false;
|
||||
$scope.url = bookmark.url;
|
||||
$scope.title = bookmark.title;
|
||||
if (bookmark.tags && bookmark.tags.length >= 1) {
|
||||
$scope.newTags = bookmark.tags.map((item) => item.name).toString();
|
||||
}
|
||||
});
|
||||
|
||||
// 在输入文字的时候也会触发，所以不要用Ctrl,Shift之类的按键
|
||||
|
|
@ -300,8 +272,6 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
$('.ui.modal.js-add-bookmark').modal({
|
||||
closable: false,
|
||||
}).modal('setting', 'transition', dataService.animation()).modal('show');
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').dropdown('clear');
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').addClass('loading');
|
||||
$('.ui.checkbox.js-public').checkbox('set checked');
|
||||
cancelDefault = true;
|
||||
init();
|
||||
|
|
@ -326,41 +296,24 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', '$document', 'ngDialo
|
|||
data.forEach((tag) => {
|
||||
tag.clicked = false;
|
||||
})
|
||||
|
||||
if ($scope.add && data.length >= 1) {
|
||||
data[0].clicked = true;
|
||||
}
|
||||
$scope.tags = data;
|
||||
initJsTags();
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').removeClass('loading');
|
||||
$scope.loadTags = false;
|
||||
})
|
||||
.catch((err) => console.log('getTags err', err));
|
||||
}
|
||||
|
||||
function initJsTags() {
|
||||
setTimeout(function() {
|
||||
$('.ui.modal.js-add-bookmark .ui.dropdown').removeClass('loading');
|
||||
$('.ui.dropdown.js-tags').dropdown({
|
||||
forceSelection: false,
|
||||
maxSelections: maxSelections,
|
||||
action: 'combo',
|
||||
onChange: function(value, text, $choice) {
|
||||
var selectedTags = $('.ui.modal.js-add-bookmark .ui.dropdown').dropdown('get value');
|
||||
$timeout(function() {
|
||||
$scope.tagsError = (selectedTags.length == 0 || selectedTags.length > maxSelections) && ($('.ui.modal.js-add-bookmark').modal('is active'));
|
||||
});
|
||||
}
|
||||
});
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
function init() {
|
||||
$scope.add = true;
|
||||
$scope.loadTags = true;
|
||||
$scope.autoGettitle = true;
|
||||
$scope.id = '';
|
||||
$scope.url = '';
|
||||
$scope.title = '';
|
||||
$scope.description = '';
|
||||
$scope.newTags = '';
|
||||
$scope.tags = []; // tag = {id:xxx, name:'yyy'}
|
||||
|
||||
$scope.urlError = false;
|
||||
|
|
|
|||
|
|
@ -140,6 +140,16 @@ app.controller('menuCtr', ['$scope', '$stateParams', '$state', '$window', '$time
|
|||
.catch((err) => console.log('logout err', err));
|
||||
}
|
||||
|
||||
$scope.showUpdate = function () {
|
||||
$state.go('settings', {
|
||||
formIndex: 5,
|
||||
});
|
||||
pubSubService.publish('Common.menuActive', {
|
||||
login: true,
|
||||
index: dataService.LoginIndexSettings
|
||||
});
|
||||
}
|
||||
|
||||
function updateMenuActive(index) {
|
||||
$('.ui.menu a.item').removeClass('selected');
|
||||
$('.ui.menu a.item:eq(' + index + ')').addClass('selected');
|
||||
|
|
@ -197,7 +207,7 @@ app.controller('menuCtr', ['$scope', '$stateParams', '$state', '$window', '$time
|
|||
title: '操作提示',
|
||||
position: 'bottom center',
|
||||
variation: "very wide",
|
||||
html: '<span>特别提示：如果功能不正常，请先尝试清除浏览器缓存！<br/>1、在任意页面，按A键添加备忘录。<br/>2、在热门收藏页面，按R键随机查看热门收藏。<br/>3、在任意页面，按数字键切换菜单栏。<br/>4、在书签页面鼠标放在书签上，按C复制书签链接<br/>5、在书签页面鼠标放在书签上，按E编辑书签<br/>6、在书签页面鼠标放在书签上，按D删除书签<br/>7、在书签页面鼠标放在书签上，按I查看书签详情<br/>8、在任意页面，按INSERT做添加书签<br/>9、在任意页面，按ESC退出弹窗<br/></span>'
|
||||
html: '<span>特别提示：如果功能不正常，请先尝试清除浏览器缓存！点击查看更新日志！<br/>1、在任意页面，按A键添加备忘录。<br/>2、在热门收藏页面，按R键随机查看热门收藏。<br/>3、在任意页面，按数字键切换菜单栏。<br/>4、在书签页面鼠标放在书签上，按C复制书签链接<br/>5、在书签页面鼠标放在书签上，按E编辑书签<br/>6、在书签页面鼠标放在书签上，按D删除书签<br/>7、在书签页面鼠标放在书签上，按I查看书签详情<br/>8、在任意页面，按INSERT做添加书签<br/>9、在任意页面，按ESC退出弹窗<br/></span>'
|
||||
});
|
||||
}, 1000)
|
||||
|
||||
|
|
|
|||
|
|
@ -346,6 +346,15 @@ app.controller('tagsCtr', ['$scope', '$filter', '$window', '$stateParams', '$tim
|
|||
return;
|
||||
}
|
||||
tag = tag.replace(/(^\s*)|(\s*$)/g, '').replace(/\s+/g, ' '); // 去除前后空格，多个空格转为一个空格;
|
||||
|
||||
var exist = $scope.tags.some((item) => {
|
||||
return item.name == tag;
|
||||
})
|
||||
if (exist) {
|
||||
toastr.error('该分类【' + tag + '】已存在！', "提示");
|
||||
return;
|
||||
}
|
||||
|
||||
if (tag) {
|
||||
ngDialog.close(dialog);
|
||||
|
||||
|
|
|
|||
|
|
@ -17,43 +17,23 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="required field">
|
||||
<label>已有书签分类</label>
|
||||
<div class="fields">
|
||||
<div class="eight wide field" ng-class="{error:tagsError }">
|
||||
<select class="ui fluid search dropdown js-tags" multiple="">
|
||||
<option value="">选择分类，输入可以搜索，最多选择三个，建议选一个</option>
|
||||
<option value="{{ tag.id }}" ng-repeat="tag in tags">{{ tag.name }}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="eight wide field">
|
||||
<div class="ui action input">
|
||||
<input type="text" placeholder="多个分类请用中文或英文逗号 , 隔开" ng-model="newTags" ng-keypress="($event.which === 13)?addTags():0">
|
||||
<button class="ui button" ng-click="addTags()">添加新分类</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="required field">
|
||||
<label>已有书签分类选择
|
||||
<span title=" 友情提示： 1、添加新书签，根据使用经验，默认会选择最后一次使用分类。 2、如果不是的，直接去选择其他的就好，系统会自动取消。 3、如果你想同时选默认与其他的分类，你选了其他分类之后，再来选中取消的默认分类即可。">
|
||||
<span title=" 友情提示： 1、添加新书签，根据使用经验，默认会选择最后一次使用分类。 2、如果不是的，直接去选择其他的就好，系统会自动取消。 3、如果你想同时选默认与其他的分类，你选了其他分类之后，再来选中取消的默认分类即可。 4、若想对当前分类进行编辑，请前往分类页面！">
|
||||
<i class="info circle icon"></i>
|
||||
</span>
|
||||
</label>
|
||||
<div class="ui label" style="margin:3px 10px 8px 0px;cursor:default;" ng-class="{green:tag.clicked}" ng-repeat="tag in tags" ng-click="clickTag(tag.id, !tag.clicked)">{{ tag.name }}</div>
|
||||
<div class="ui label" style="margin:3px 10px 8px 0px;cursor:default;" title="添加新分类" ng-click="showAddTag()">
|
||||
<div class="ui active inverted dimmer" ng-class="{active:loadTags, disabled: !loadTags}">
|
||||
<div class="ui text loader">正在获取分类...</div>
|
||||
</div>
|
||||
<div class="ui label" style="margin:3px 10px 8px 0px;cursor:default;" ng-class="{green:tag.clicked}" ng-repeat="tag in tags" ng-click="clickTag(tag.id, !tag.clicked)" ng-show="!loadTags">{{ tag.name }}</div>
|
||||
<div class="ui label" style="margin:3px 10px 8px 0px;cursor:default;" title="添加新分类" ng-click="showAddTag()" ng-show="!loadTags">
|
||||
<i style="margin-left:10px;" class="plus icon"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>描述</label>
|
||||
<div
|
||||
style="border-radius:4px;border:1px solid #DEDEDE;min-height:88px;"
|
||||
name="text"
|
||||
ng-model="description"
|
||||
required
|
||||
medium-editor
|
||||
bind-options="{'placeholder': {text: '可以是网站的说明，也可以备忘一下账号或者摘抄内容，就算公开你的链接，这个也只有自己能在详情里面看到'},
|
||||
<div style="border-radius:4px;border:1px solid #DEDEDE;min-height:88px;" name="text" ng-model="description" required medium-editor bind-options="{'placeholder': {text: '可以是网站的说明，也可以备忘一下账号或者摘抄内容，就算公开你的链接，这个也只有自己能在详情里面看到'},
|
||||
'buttons': ['bold', 'italic', 'underline', 'header1', 'header2', 'quote', 'orderedlist', 'unorderedlist']}"></div>
|
||||
</div>
|
||||
<div class="field">
|
||||
|
|
|
|||
|
|
@ -72,7 +72,7 @@
|
|||
<i class="sign out icon" title="退出登陆" ng-click="logout()"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div class="item" style="padding:0 8px 0 13px;">
|
||||
<div class="item" style="padding:0 8px 0 13px;" ng-click="showUpdate()">
|
||||
<span class="suggest">
|
||||
<i class="info circle icon"></i>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -202,6 +202,12 @@
|
|||
</div>
|
||||
<div class="ui container js-p-info" ng-show="form[5]">
|
||||
<h3 class="ui dividing header">更新日志</h3>
|
||||
<div class="ui message">
|
||||
<div class="header">2017-06-16</div>
|
||||
<ul class="list">
|
||||
<li>修改书签操作页面选择分类的逻辑。由以前在下拉列表选分类，改为更直观地选标签。</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="ui message">
|
||||
<div class="header">2017-06-14</div>
|
||||
<ul class="list">
|
||||
|
|
|
|||
Loading…
Reference in New Issue