Merge pull request #414 from nextcloud/vue-components0.3.1

Vue components 0.4.2
nextcloud · Nov 10, 2018 · 1620ee8 · 1620ee8
2 parents 3c3cf9b + 58e77a9
commit 1620ee8
Show file tree

Hide file tree

Showing 6 changed files with 32 additions and 75 deletions.
diff --git a/js/create-poll.js b/js/create-poll.js
diff --git a/lib/Controller/ApiController.php b/lib/Controller/ApiController.php
@@ -101,7 +101,9 @@ public function getSiteUsersAndGroups($query = '', $getGroups = true, $getUsers
 				if (!in_array($group->getGID(), $skipGroups)) {
 					$list[] = [
 						'id' => $group->getGID(),
+						'user' => $group->getGID(),
 						'type' => 'group',
+						'icon' => 'icon-group',
 						'displayName' => $group->getGID(),
 						'avatarURL' => ''
 					];
@@ -114,7 +116,9 @@ public function getSiteUsersAndGroups($query = '', $getGroups = true, $getUsers
 				if (!in_array($user->getUID(), $skipUsers)) {
 					$list[] = [
 						'id' => $user->getUID(),
+						'user' => $user->getUID(),
 						'type' => 'user',
+						'icon' => 'icon-user',
 						'displayName' => $user->getDisplayName(),
 						'avatarURL' => '',
 						'lastLogin' => $user->getLastLogin(),
@@ -138,16 +142,22 @@ function convertAccessList($item) {
 			$user = $this->userManager->get(substr($item, 5));
 			$split = [
 				'id' => $user->getUID(),
+				'user' => $user->getUID(),
 				'type' => 'user',
+				'icon' => 'icon-user',
 				'displayName' => $user->getDisplayName(),
-				'avatarURL' => ''
+				'avatarURL' => '',
+				'lastLogin' => $user->getLastLogin(),
+				'cloudId' => $user->getCloudId()
 			];
 		} elseif (strpos($item, 'group_') === 0) {
 			$group = substr($item, 6);
 			$group = $this->groupManager->get($group);
 			$split = [
 				'id' => $group->getGID(),
+				'user' => $group->getGID(),
 				'type' => 'group',
+				'icon' => 'icon-group',
 				'displayName' => $group->getDisplayName(),
 				'avatarURL' => '',
 			];

diff --git a/package.json b/package.json
@@ -25,7 +25,7 @@
     "md5": "^2.2.1",
     "moment": "^2.22.1",
     "nextcloud-axios": "^0.1.2",
-    "nextcloud-vue": "^0.3.1",
+    "nextcloud-vue": "^0.4.2",
     "v-tooltip": "^2.0.0-rc.33",
     "velocity-animate": "^1.5.1",
     "vue": "^2.5.16",

diff --git a/src/js/components/shareDiv.vue b/src/js/components/shareDiv.vue
@@ -23,43 +23,38 @@
 <template>
 	<div>
 		<h2> {{ t('polls', 'Share with') }}</h2>
+
 		<multiselect
 			v-model="shares"
 			:options="users"
-			:option-height=32
+			label="displayName"
+			track-by="user"
 			:multiple="true"
-			:close-on-select="false"
+			:user-select="true"
+			:tag-width="80"
 			:clear-on-select="false"
 			:preserve-search="true"
-			label="displayName"
-			track-by="id"
 			:options-limit="20"
 			id="ajax"
 			@search-change="loadUsersAsync"
 			@close="updateShares"
 			:loading="isLoading"
 			:internal-search="false"
-			:hide-selected="true"
 			:searchable="true"
 			:preselect-first="true"
 			:placeholder="placeholder">
 			<template slot="selection" slot-scope="{ values, search, isOpen }">
-				<span class="multiselect__single" v-if="values.length &amp;&amp; !isOpen">
-					{{ values.length }} users selected
-				</span>
-			</template>
-			<template slot="option" slot-scope="props">
-				<div class="option__desc">
-					<user-div :user-id="props.option.id" :display-name="props.option.displayName" :type="props.option.type"></user-div>
-				</div>
+							<span class="multiselect__single" v-if="values.length &amp;&amp; !isOpen">
+								{{ values.length }} users selected
+							</span>
 			</template>
 		</multiselect>
 
 		<transition-group tag="ul" v-bind:css="false" class="shared-list">
 			<li v-for="(item, index) in sortedShares"
 				v-bind:key="item.displayName"
 				v-bind:data-index="index">
-				<user-div :user-id="item.id" :display-name="item.displayName" :type="item.type" :hide-names="hideNames"></user-div>
+				<user-div :user-id="item.user" :display-name="item.displayName" :type="item.type" :hide-names="hideNames"></user-div>
 				<div class="options">
 					<a @click="removeShare(index, item)" class="icon icon-delete svg delete-poll"></a>
 				</div>
@@ -154,53 +149,7 @@
 		left: -13px;
 	}
 
-	div, select {
-		&.multiselect:not(.multiselect-vue), &.multiselect:not(.multiselect-vue) {
-			max-width: unset;
-		}
-	}
-
-	.multiselect {
+	.multiselect.multiselect-vue {
 		width: 100%;
-		.multiselect__content-wrapper li > span {
-			height: unset;
-		}
-		.option__desc {
-			flex-grow: 1;
-		}
-
-
-		.multiselect__option--highlight {
-			background: #41b883;
-			outline: none;
-			color: #fff;
-			&::after {
-				content: attr(data-select);
-				background: #41b883;
-				color: #fff;
-				border-radius: 4px;
-				padding: 2px;
-			}
-		}
-
-
-		.multiselect__option--selected {
-			&::after {
-				content: attr(data-selected);
-				color: silver;
-			}
-			&.multiselect__option--highlight {
-				background: #ff6a6a;
-				color: #fff;
-				&::after {
-					background: #ff6a6a;
-					content: attr(data-deselect);
-					color: #fff;
-					border-radius: 4px;
-					padding: 2px;
-				}
-			}
-		}
 	}
-
 </style>
diff --git a/templates/goto.tmpl.php b/templates/goto.tmpl.php
@@ -208,7 +208,7 @@
 								!$isAnonymous &&
 								!$hideNames
 							) {
-								$displayName = $usr;
+								$displayName = \OC_User::getDisplayName($usr);
 								$avatarName = $usr;
 							} else {
 								if ($isAnonymous || $hideNames) {
@@ -257,7 +257,7 @@
 						if (User::isLoggedIn()) {
 							print_unescaped('		<div class="avatar has-tooltip" title="' . ($userId) . '"></div>');
 							print_unescaped('		<div class="name">');
-							p($userId);
+							p(\OC_User::getDisplayName($userId));
 						} else {
 							print_unescaped('		<div class="avatar has-tooltip" title="?"></div>');
 							print_unescaped('		<div id="id_ac_detected" class="name external current-user"><input type="text" name="user_name" id="user_name" placeholder="' . $l->t('Your name here') . '" />');
@@ -347,7 +347,7 @@
 				<div class="authorRow user-cell flex-row">
 					<div class="description leftLabel"><?php p($l->t('Owner')); ?></div>
 					<div class="avatar has-tooltip-bottom" title="<?php p($poll->getOwner())?>"></div>
-					<div class="author"><?php p($poll->getOwner()); ?></div>
+					<div class="author"><?php p(\OC_User::getDisplayName($poll->getOwner())); ?></div>
 				</div>
 
 				<div class="cloud">
@@ -425,7 +425,7 @@
 	<?php if (User::isLoggedIn()) : ?>
 					<div class="authorRow user-cell flex-row">
 						<div class="avatar has-tooltip" title="<?php p($userId)?>"></div>
-						<div class="author"><?php p($userId) ?></div>
+						<div class="author"><?php p(\OC_User::getDisplayName($userId)) ?></div>
 					</div>
 	<?php else: ?>
 					<a href="<?php p($urlGenerator->linkToRouteAbsolute('core.login.showLoginForm')); ?>"><?php p($l->t('Login or ...')); ?></a>
@@ -465,15 +465,15 @@
 							// Comment is from current user
 							// -> display user
 							$avatarName = $userId;
-							$displayName = $userId;
+							$displayName = \OC_User::getDisplayName($userId);
 
 						} else if (!$isAnonymous && !$hideNames) {
 							// comment is from another user,
 							// poll is not anoymous (for current user)
 							// users are not hidden
 							// -> display user
 							$avatarName = $comment->getUserId();
-							$displayName = $avatarName;
+							$displayName = \OC_User::getDisplayName($comment->getUserId());
 						} else {
 							// in all other cases
 							// -> make user anonymous

diff --git a/templates/main.tmpl.php b/templates/main.tmpl.php
@@ -114,9 +114,7 @@
 		$commented_title = 'You did not comment';
 		$commented_count = count($comments);
 
-		if ($owner === $userId) {
-			$owner = $l->t('Yourself');
-		}
+		$owner = \OC_User::getDisplayName($owner);
 
 
 		$timestamp_style = '';
@@ -205,7 +203,7 @@
 					<div class="wrapper group-2">
 						<div class="flex-column owner">
 							<div class="avatardiv" title="<?php p($poll->getOwner()); ?>" style="height: 32px; width: 32px;"></div>
-							<div class="name-cell"><?php p($owner); ?></div>
+							<div class="name-cell"><?php p(\OC_User::getDisplayName($owner)); ?></div>
 						</div>
 						<div class="wrapper group-2-1">
 							<div class="flex-column access"><?php p($l->t($poll->getAccess())); ?></div>
@@ -257,14 +255,13 @@ function userHasAccess(OCA\Polls\Db\Event $poll, $userId) {
 		return false;
 	}
 	$access = $poll->getAccess();
-	$owner = $poll->getOwner();
 	if (!User::isLoggedIn()) {
 		return false;
 	}
 	if ($access === 'public' || $access === 'hidden' || $access === 'registered') {
 		return true;
 	}
-	if ($owner === $userId) {
+	if ($poll->getOwner() === $userId) {
 		return true;
 	}