114 lines
3.4 KiB
Svelte
114 lines
3.4 KiB
Svelte
<script>
|
|
import {Meteor} from "meteor/meteor";
|
|
import {onMount} from "svelte";
|
|
import {Sites} from "../../api/sites";
|
|
import GridTable from "./../GridTable.svelte";
|
|
import {writable} from "svelte/store";
|
|
import TextField from '@smui/textfield';
|
|
import HelperText from '@smui/textfield/helper-text';
|
|
import {Students} from "../../api/students";
|
|
import Select, { Option } from '@smui/select';
|
|
import Dialog, { Title, Content, Actions } from '@smui/dialog';
|
|
import Button, { Label } from '@smui/button';
|
|
import {Staff} from "/imports/api/staff";
|
|
import List, {Item, Graphic, Meta, Text, PrimaryText, SecondaryText} from '@smui/list';
|
|
import Paper from '@smui/paper';
|
|
import LayoutGrid, {Cell} from '@smui/layout-grid';
|
|
|
|
let grades = ['All'];
|
|
onMount(async () => {
|
|
Meteor.subscribe('sites');
|
|
Meteor.call('students.getPossibleGrades', (err, result) => {
|
|
if(err) console.log(err);
|
|
else {
|
|
grades = ['All', ...result];
|
|
}
|
|
});
|
|
});
|
|
// Load the sites (reactive).
|
|
let sites = Sites.find({});
|
|
let selectedSiteId;
|
|
let assignees;
|
|
let siteSelectComponent;
|
|
let categories = ['Student', 'Staff'];
|
|
let selectedCategory = 'Student';
|
|
let sorts = [{column: 'firstName', name: 'First Name'}, {column: 'lastName', name: 'Last Name'}, {column: 'email', name: 'Email'}];
|
|
let selectedSort = 'firstName'
|
|
let selectedGrade = 'All';
|
|
let selectedAssignee;
|
|
let assetId = "";
|
|
$: {
|
|
if(selectedSiteId) {
|
|
if(selectedCategory === 'Student') {
|
|
Meteor.subscribe('students', selectedSiteId);
|
|
let filter = {siteId: selectedSiteId};
|
|
|
|
if(selectedGrade && selectedGrade !== 'All') filter.grade = selectedGrade;
|
|
assignees = Students.find(filter, {sort: [selectedSort]});
|
|
}
|
|
else if(selectedCategory === 'Staff') {
|
|
Meteor.subscribe('staff', selectedSiteId);
|
|
assignees = Staff.find({siteId: selectedSiteId}, {sort: [selectedSort]});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<div class="container">
|
|
<h1 style="display: block">Assign Assets</h1>
|
|
|
|
<Paper>
|
|
<LayoutGrid>
|
|
<Cell span="{6}">
|
|
<Select bind:value={selectedSiteId} label="Site" bind:this={siteSelectComponent}>
|
|
{#each $sites as site}
|
|
<Option value={site._id}>{site.name}</Option>
|
|
{/each}
|
|
</Select>
|
|
</Cell>
|
|
<Cell span="{6}">
|
|
<Select bind:value={selectedCategory} label="Category">
|
|
{#each categories as category}
|
|
<Option value={category}>{category}</Option>
|
|
{/each}
|
|
</Select>
|
|
</Cell>
|
|
<Cell span="{6}">
|
|
{#if (selectedCategory === 'Student')}
|
|
<Select bind:value={selectedGrade} label="Grade">
|
|
{#each grades as grade}
|
|
<Option value={grade}>{grade}</Option>
|
|
{/each}
|
|
</Select>
|
|
{/if}
|
|
</Cell>
|
|
<Cell span="{6}">
|
|
<Select bind:value={selectedSort} label="Sort">
|
|
{#each sorts as sort}
|
|
<Option value={sort.column}>{sort.name}</Option>
|
|
{/each}
|
|
</Select>
|
|
</Cell>
|
|
</LayoutGrid>
|
|
</Paper>
|
|
|
|
<TextField type="text" style="width: 100%" bind:value={assetId} label="Asset ID">
|
|
|
|
</TextField>
|
|
<List twoLine singleSelection style="max-height: 60%">
|
|
{#if $assignees}
|
|
{#each $assignees as assignee}
|
|
<Item on:SMUI:action={() => (selectedAssignee = assignee)} selected={selectedAssignee === assignee}>
|
|
<Text>
|
|
<PrimaryText>{assignee.firstName} {assignee.lastName}</PrimaryText>
|
|
<SecondaryText>{assignee.email} {assignee.grade ? '(' + assignee.grade + ')' : ""}</SecondaryText>
|
|
</Text>
|
|
</Item>
|
|
{/each}
|
|
{/if}
|
|
</List>
|
|
</div>
|
|
|
|
<style>
|
|
|
|
</style> |