finishing up lists

pull/339/head
Youssef ABIDI 2017-08-22 23:00:52 +01:00
parent 9ee65a7f02
commit 0e7c94792a
4 changed files with 135 additions and 60 deletions

View File

@ -9,22 +9,33 @@
.controller('ListsTabCtrl', ListsTabCtrl); .controller('ListsTabCtrl', ListsTabCtrl);
/** @ngInject */ /** @ngInject */
function ListsTabCtrl($scope, baConfig, membersList, ListService, $log) { function ListsTabCtrl($scope, baConfig, membersList, ListService,MemberService, $log) {
var vm = this;
vm.searchResult = [];
function loadLists() { function loadLists() {
ListService ListService
.list() .list()
.then(function (data){ .then(function (data){
$scope.Lists = data; vm.Lists = data;
$log.info("Got the survey data",data); $log.info("Got the list data",data);
//getting all members
MemberService
.list()
.then(function (data){
vm.searchResult = data;
$log.info("Got the members data",data);
}, function (error){
$log.error(error);
});
}, function (error){ }, function (error){
$log.error(error); $log.error(error);
}); });
} }
function activate(){ function activate(){
$scope.Lists = []; vm.Lists = [];
loadLists(); loadLists();
} }
@ -34,7 +45,7 @@
$scope.transparent = baConfig.theme.blur; vm.transparent = baConfig.theme.blur;
var dashboardColors = baConfig.colors.dashboard; var dashboardColors = baConfig.colors.dashboard;
var colors = []; var colors = [];
for (var key in dashboardColors) { for (var key in dashboardColors) {
@ -48,68 +59,120 @@
return colors[i]; return colors[i];
} }
$scope.tabs = membersList.getTabs(); vm.tabs = membersList.getTabs();
$scope.searchResult = membersList.getAllMessages();
$scope.Lists.forEach(function(item) { vm.Lists.forEach(function(item) {
item.color = getRandomColor(); item.color = getRandomColor();
}); });
$scope.newTodoText = 'tech'; vm.newList = {};
$scope.listMembers = []; vm.activeList = {};
$scope.selectedLabel = "listing"; vm.listMembers = [];
vm.selectedLabel = "listing";
$scope.addNewList = function (event, clickPlus) { vm.addNewList = function (event, clickPlus) {
if (clickPlus || event.which === 13) { if (clickPlus || event.which === 13) {
/*$scope.Lists.unshift({
name: $scope.newTodoText, vm.Lists.unshift({name : vm.newList.name});
color: getRandomColor(), //vm.Lists.push(vm.newList);
});*/ var list = {name : vm.newList.name};
var list = {"name" : $scope.newTodoText}; ListService
ListService.create(list); .create(list)
loadLists(); .then(
$scope.newTodoText = ''; function (data){
loadLists();
vm.newList.name = '';
},
function (error){
console.log("Error creating the LIST");
}
);
} }
}; };
$scope.updateMembers = function (index) { vm.updateListMembers = function (item) {
//uncheck others lists //uncheck others lists
for(var i = 0; i<$scope.Lists.length; i++) if (item.isChecked) {
{ vm.activeList = item;
if(i != index) angular.forEach(vm.Lists, function(list){
$scope.Lists[i].isChecked = false; if(item.id != list.id)
} list.isChecked = false;
});
//getting members info //getting members info
$scope.listMembers = []; vm.listMembers = [];
var membersIds = $scope.Lists[index].members; var membersIds = item.members;
angular.forEach(membersIds, function(id){ angular.forEach(membersIds, function(id){
var member = membersList.getMemberById(id); MemberService
$scope.listMembers.push( member ); .get(id)
}); .then(
console.log($scope.listMembers); function (data){
vm.listMembers.push( data.data );
console.log("updateListMembers",vm.activeList, vm.listMembers);
},
function (error){
console.log("Error getting the member");
}
);
});
} else
vm.listMembers = [];
}; };
$scope.getMemberByLabel = function (label) { vm.getMemberByLabel = function (label) {
console.log(label); console.log(label);
$scope.searchResult = membersList.getMembersByLabel(label); vm.searchResult = membersList.getMembersByLabel(label);
}; };
$scope.removeMember = function (index) { vm.updateMembers = function (member, action) {
if (confirm("Are you sure?")) if (confirm("Are you sure?"))
{ {
//$scope.Lists[index].deleted = true; var list = vm.activeList;
var index = list.members.indexOf(member.id);
if (action == "add") {
if (index == -1)
list.members.push(member.id);
} else {
if (index != -1)
list.members.splice(index, 1);
}
ListService
.edit(list)
.then(
function (data){
loadLists();
vm.newList.name = '';
},
function (error){
console.log("Error updating the LIST");
}
);
} }
}; };
$scope.removeList = function (index) { vm.removeList = function (index) {
if (confirm("Are you sure?")) if (confirm("Are you sure?"))
{ {
$scope.Lists[index].deleted = true;
var list = vm.Lists[index];
ListService
.remove(list)
.then(
function (data){
vm.Lists[index].deleted = true;
},
function (error){
console.log("Error removing the LIST");
}
);
} }
}; };
} }

View File

@ -34,11 +34,11 @@
} }
function edit(list) { function edit(list) {
console.log("edit Member Object", list); return $http.put(endpoint+"/"+list.id, list);
} }
function remove(list) { function remove(list) {
console.log("remove Member", list); return $http.delete(endpoint+"/"+list.id);
} }
return { return {

View File

@ -5,20 +5,20 @@
ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel"> ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel">
<div class="task-todo-container" ng-class="{'transparent': transparent}"> <div class="task-todo-container" ng-class="{'transparent': transparent}">
<input type="text" value="" class="form-control task-todo" placeholder="Add a new list.." ng-keyup="addNewList($event)" ng-model="newTodoText"/> <input type="text" value="" class="form-control task-todo" placeholder="Add a new list.." ng-keyup="vm.addNewList($event)" ng-model="vm.newList.name"/>
<i ng-click="addNewList('',true)" class="add-item-icon ion-plus-round"></i> <i ng-click="vm.addNewList('',true)" class="add-item-icon ion-plus-round"></i>
<div class="box-shadow-border"></div> <div class="box-shadow-border"></div>
<ul class="todo-list" ui-sortable ng-model="Lists"> <ul class="todo-list" ui-sortable ng-model="vm.Lists">
<li ng-repeat="item in Lists" ng-if="!item.deleted" ng-init="activeItem=false" <li ng-repeat="item in vm.Lists" ng-if="!item.deleted" ng-init="vm.activeItem=false"
ng-class="{checked: item.isChecked, active: activeItem}" ng-class="{checked: item.isChecked, active: vm.activeItem}"
ng-mouseenter="activeItem=true" ng-mouseleave="activeItem=false"> ng-mouseenter="vm.activeItem=true" ng-mouseleave="vm.activeItem=false">
<div class="blur-container"><div class="blur-box"></div></div> <div class="blur-container"><div class="blur-box"></div></div>
<i class="mark" style="background-color: {{::item.color}}"></i> <i class="mark" style="background-color: {{::item.color}}"></i>
<label class="todo-checkbox custom-checkbox custom-input-success"> <label class="todo-checkbox custom-checkbox custom-input-success">
<input type="checkbox" ng-model="item.isChecked" ng-change="updateMembers($index)"> <input type="checkbox" ng-model="item.isChecked" ng-change="vm.updateListMembers(item)">
<span class="cut-with-dots">{{ item.name }}</span> <span class="cut-with-dots">{{ item.name }}</span>
</label> </label>
<i class="remove-todo ion-ios-close-empty" ng-click="removeList($index)"></i> <i class="remove-todo ion-ios-close-empty" ng-click="vm.removeList($index)"></i>
</li> </li>
</ul> </ul>
</div> </div>
@ -32,18 +32,19 @@
ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel"> ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel">
<div class="feed-messages-container" track-width="smallContainerWidth" min-width="360"> <div class="feed-messages-container" track-width="smallContainerWidth" min-width="360">
<div class="feed-message" ng-repeat="m in listMembers"> <div class="feed-message" ng-repeat="m in vm.listMembers">
<div class="message-icon"> <div class="message-icon">
<img class="photo-icon" ng-src="{{m.name.split(' ')[0] | profilePicture}}"> <img class="photo-icon" ng-src="{{m.name.split(' ')[0] | profilePicture}}">
</div> </div>
<div class="text-block text-message"> <div class="text-block text-message">
<div class="message-header"> <div class="message-header">
<span class="author">{{m.name}}</span> <span class="author">{{m.name}}</span>
<span class="email">{{m.email}}</span>
</div> </div>
<div class="message-content line-clamp"> <div class="message-content line-clamp">
<span>{{m.position}} </span> <span>{{m.position}} </span>
</div> </div>
<button class="btn btn-danger editable-table-button btn-xs pull-right" ng-click="removeMember(m.id)">Remove</button> <button class="btn btn-danger editable-table-button btn-xs pull-right" ng-click="vm.updateMembers(m, 'remove')">Remove</button>
</div> </div>
</div> </div>
@ -54,25 +55,26 @@
ba-panel ba-panel
ba-panel-title="Add new members" ba-panel-title="Add new members"
ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel"> ba-panel-class="xmedium-panel feed-comply-panel with-scroll todo-panel">
<input type="text" value="" class="form-control task-todo" placeholder="Search" ng-keyup="addNewList($event)"/> <input type="text" value="" class="form-control task-todo" placeholder="Search" ng-keyup="vm.addNewList($event)"/>
<select class="form-control" selectpicker ng-model="selectedLabel" ng-change="getMemberByLabel(selectedLabel)"> <select class="form-control" selectpicker ng-model="vm.selectedLabel" ng-change="vm.getMemberByLabel(selectedLabel)">
<option selected="true" value="listing">Search by tag ...</option> <option selected="true" value="listing">Search by tag ...</option>
<option ng-repeat="t in tabs" value="{{t.label}}">{{t.name}}</option> <option ng-repeat="t in vm.tabs" value="{{t.label}}">{{t.name}}</option>
</select> </select>
<div class="feed-messages-container" track-width="smallContainerWidth" min-width="360"> <div class="feed-messages-container" track-width="smallContainerWidth" min-width="360">
<div class="feed-message" ng-repeat="m in searchResult"> <div class="feed-message" ng-repeat="m in vm.searchResult">
<div class="message-icon"> <div class="message-icon">
<img class="photo-icon" ng-src="{{m.name.split(' ')[0] | profilePicture}}"> <img class="photo-icon" ng-src="{{m.name.split(' ')[0] | profilePicture}}">
</div> </div>
<div class="text-block text-message"> <div class="text-block text-message">
<div class="message-header"> <div class="message-header">
<span class="author">{{m.name}}</span> <span class="author">{{m.name}}</span>
<span class="email">{{m.email}}</span>
</div> </div>
<div class="message-content line-clamp"> <div class="message-content line-clamp">
<span>{{m.position}} </span> <span>{{m.position}} </span>
</div> </div>
<button class="btn btn-success editable-table-button btn-xs pull-right" ng-click="removeMember(m.id)">Add</button> <button class="btn btn-success editable-table-button btn-xs pull-right" ng-click="vm.updateMembers(m, 'add')">Add</button>
</div> </div>
</div> </div>

View File

@ -33,18 +33,28 @@
return $http.post(endpoint, member); return $http.post(endpoint, member);
} }
function put(member) {
return $http.put(endpoint + "/" + member.id, member);
}
function get(id) {
return $http.get(endpoint + "/" + id);
}
function edit(member) { function edit(member) {
console.log("edit Member Object", member); console.log("edit Member Object", member);
} }
function remove(member) { function remove(id) {
console.log("remove Member", member); return $http.delete(endpoint + "/" + id);
} }
return { return {
list:list, list:list,
create:create, create:create,
edit:edit, edit:edit,
get:get,
put:put,
remove:remove remove:remove
} }
} }