Reorganized assignment UI. Added searching by person.

imports/ui/Assignments.svelte

@@ -0,0 +1,51 @@
+<script>
+	import Tab, { Label } from '@smui/tab';
+	import TabBar from '@smui/tab-bar';
+	import {Meteor} from "meteor/meteor";
+	import {useTracker} from "meteor/rdb:svelte-meteor-data";
+	import AssignAssets from "/imports/ui/Assignments/AssignAssets.svelte";
+	import AssignmentByAssignee from "/imports/ui/Assignments/AssignmentByAssignee.svelte";
+	import AssignmentByAsset from "/imports/ui/Assignments/AssignmentByAsset.svelte";
+	import AssignmentByPerson from "/imports/ui/Assignments/AssignmentByPerson.svelte";
+
+	let canManageLaptops = false;
+	let isAdmin = false;
+	$: currentUser = useTracker(() => Meteor.user());
+
+	Tracker.autorun(() => {
+		// For some reason currentUser is always null here, and is not reactive (user changes and this does not get re-called).
+		let user = Meteor.user();
+		canManageLaptops = user && Roles.userIsInRole(user._id, 'laptop-management', 'global');
+		isAdmin = user && Roles.userIsInRole(user._id, 'admin', 'global');
+	});
+
+	let tabs = [];
+
+	if(canManageLaptops) {
+		// tabs.push({id: 'listAssignmentsByAssignee', label: 'Assignments By Assignee'});
+		tabs.push({id: 'listAssignmentsByPerson', label: 'By Person'});
+		tabs.push({id: 'listAssignmentsByAsset', label: 'By Asset'});
+		tabs.push({id: 'assignAssets', label: 'Assign Assets'});
+	}
+	let activeTab = tabs[0];
+</script>
+
+<div class="container">
+	<TabBar tabs={tabs} minWidth let:tab bind:active={activeTab}>
+		<Tab {tab}>
+			<Label>{tab.label}</Label>
+		</Tab>
+	</TabBar>
+	{#if activeTab && activeTab.id === 'assignAssets'}
+		<AssignAssets></AssignAssets>
+	{:else if activeTab && activeTab.id === 'listAssignmentsByAssignee'}
+		<AssignmentByAssignee></AssignmentByAssignee>
+	{:else if activeTab && activeTab.id === 'listAssignmentsByPerson'}
+		<AssignmentByPerson></AssignmentByPerson>
+	{:else if activeTab && activeTab.id === 'listAssignmentsByAsset'}
+		<AssignmentByAsset></AssignmentByAsset>
+	{/if}
+</div>
+
+<style>
+</style>