banana/definma-ui
2
Fork 0
Code Releases Activity

added templates component

Browse Source
This commit is contained in:
VLE2FE
2020-07-27 17:52:03 +02:00
parent 15aeeb27ee
commit 55248e25ef
42 changed files with 862 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/app/samples/samples.component.html
View File

@ -1,3 +1,4 @@
<script src="samples.component.ts"></script>
<div class="header-addnew">
<h2>Samples</h2>
<a routerLink="/samples/new">
@ -87,8 +88,10 @@
<th *ngFor="let key of activeKeys">
<div class="sort-header">
<span>{{key.label}}</span>
<span class="rb-ic rb-ic-up sort-arr-up" (click)="setSort(key.id + '-' + 'desc')"><span *ngIf="filters.sort === key.id + '-' + 'desc'"></span></span>
<span class="rb-ic rb-ic-down sort-arr-down" (click)="setSort(key.id + '-' + 'asc')"><span *ngIf="filters.sort === key.id + '-' + 'asc'"></span></span>
<ng-container *ngIf="key.sortable">
<span class="rb-ic rb-ic-up sort-arr-up" (click)="setSort(key.id + '-' + 'desc')"><span *ngIf="filters.sort === key.id + '-' + 'desc'"></span></span>
<span class="rb-ic rb-ic-down sort-arr-down" (click)="setSort(key.id + '-' + 'asc')"><span *ngIf="filters.sort === key.id + '-' + 'asc'"></span></span>
</ng-container>
</div>
</th>
<th></th>
@ -104,7 +107,7 @@
<td *ngIf="isActiveKey['type']">{{sample.type}}</td>
<td *ngIf="isActiveKey['color']">{{sample.color}}</td>
<td *ngIf="isActiveKey['batch']">{{sample.batch}}</td>
<td *ngIf="isActiveKey['notes']">{{sample.notes | object}}</td>
<td *ngIf="isActiveKey['notes']">{{sample.notes | object: ['_id', 'sample_references']}}</td>
<td *ngFor="let key of activeTemplateKeys.measurements">{{sample[key[1]] | exists: key[2]}}</td>
<td *ngIf="isActiveKey['added']">{{sample.added | date:'dd/MM/yy'}}</td>
<td><a [routerLink]="'/samples/edit/' + sample._id"><span class="rb-ic rb-ic-edit"></span></a></td>

2
src/app/samples/samples.component.scss
View File

@ -178,5 +178,5 @@ textarea.linkmodal {
.filter-inputs > * {
display: inline-block;
max-width: 250px;
width: 220px;
}

37
src/app/samples/samples.component.ts
View File

@ -2,6 +2,7 @@ import {Component, ElementRef, isDevMode, OnInit, ViewChild} from '@angular/core
import {ApiService} from '../services/api.service';
import {AutocompleteService} from '../services/autocomplete.service';
import _ from 'lodash';
import {SampleModel} from '../models/sample.model';
interface LoadSamplesOptions {
@ -13,6 +14,7 @@ interface KeyInterface {
id: string;
label: string;
active: boolean;
sortable: boolean;
}
@Component({
@ -21,9 +23,8 @@ interface KeyInterface {
styleUrls: ['./samples.component.scss']
})
// TODO: manage branches, introduce versioning, only upload ui from master
// TODO: check if custom-header.conf works, add headers from helmet https://docs.cloudfoundry.org/buildpacks/staticfile/index.html
// TODO: check if custom-header.conf works, add headers from helmet https://docs.cloudfoundry.org/buildpacks/staticfile/index.html
export class SamplesComponent implements OnInit {
@ -32,7 +33,7 @@ export class SamplesComponent implements OnInit {
downloadCsv = false;
materials = {};
samples = [];
samples: SampleModel[] = [];
totalSamples = 0; // total number of samples
csvUrl = ''; // store url separate so it only has to be generated when clicking the download button
filters = {
@ -61,16 +62,16 @@ export class SamplesComponent implements OnInit {
loadSamplesQueue = []; // arguments of queued up loadSamples() calls
apiKey = '';
keys: KeyInterface[] = [
{id: 'number', label: 'Number', active: true},
{id: 'material.numbers', label: 'Material numbers', active: true},
{id: 'material.name', label: 'Material name', active: true},
{id: 'material.supplier', label: 'Supplier', active: true},
{id: 'material.group', label: 'Material', active: false},
{id: 'type', label: 'Type', active: true},
{id: 'color', label: 'Color', active: true},
{id: 'batch', label: 'Batch', active: true},
{id: 'notes', label: 'Notes', active: false},
{id: 'added', label: 'Added', active: true}
{id: 'number', label: 'Number', active: true, sortable: true},
{id: 'material.numbers', label: 'Material numbers', active: true, sortable: false},
{id: 'material.name', label: 'Material name', active: true, sortable: true},
{id: 'material.supplier', label: 'Supplier', active: true, sortable: true},
{id: 'material.group', label: 'Material', active: false, sortable: true},
{id: 'type', label: 'Type', active: true, sortable: true},
{id: 'color', label: 'Color', active: true, sortable: true},
{id: 'batch', label: 'Batch', active: true, sortable: true},
{id: 'notes', label: 'Notes', active: false, sortable: false},
{id: 'added', label: 'Added', active: true, sortable: true},
];
isActiveKey: {[key: string]: boolean} = {};
activeKeys: KeyInterface[] = [];
@ -112,8 +113,11 @@ export class SamplesComponent implements OnInit {
const templateKeys = [];
data.forEach(item => {
item.parameters.forEach(parameter => {
templateKeys.push({id: `${collection === 'materials' ? 'material' : collection}.${collection === 'materials' ? 'properties' : item.name}.${encodeURIComponent(parameter.name)}`, label: `${this.ucFirst(item.name)} ${this.ucFirst(parameter.name)}`, active: false});
this.filters.filters.push({field: `${collection === 'materials' ? 'material' : collection}.${collection === 'materials' ? 'properties' : item.name}.${parameter.name}`, label: `${this.ucFirst(item.name)} ${this.ucFirst(parameter.name)}`, active: false, autocomplete: [], mode: 'eq', values: ['']});
const parameterName = encodeURIComponent(parameter.name);
if (parameter.name !== 'dpt' && !templateKeys.find(e => new RegExp('.' + parameterName + '$').test(e.id))) { // exclude spectrum
templateKeys.push({id: `${collection === 'materials' ? 'material.properties' : collection + '.' + item.name}.${parameterName}`, label: `${this.ucFirst(item.name)} ${this.ucFirst(parameter.name)}`, active: false, sortable: true});
this.filters.filters.push({field: `${collection === 'materials' ? 'material.properties' : collection + '.' + item.name}.${parameterName}`, label: `${this.ucFirst(item.name)} ${this.ucFirst(parameter.name)}`, active: false, autocomplete: [], mode: 'eq', values: ['']});
}
});
});
this.keys.splice(this.keys.findIndex(e => e.id === insertBefore), 0, ...templateKeys);
@ -220,6 +224,7 @@ export class SamplesComponent implements OnInit {
updateFilterFields(field) {
const filter = this.filters.filters.find(e => e.field === field);
filter.active = true;
if (filter.mode === 'in' || filter.mode === 'nin') {
if (filter.values[filter.values.length - 1] === '' && filter.values[filter.values.length - 2] === '') {
filter.values.pop();
@ -250,6 +255,8 @@ export class SamplesComponent implements OnInit {
}
calcFieldSelectKeys() {
console.log('CALC');
console.log(this.keys);
this.keys.forEach(key => {
this.isActiveKey[key.id] = key.active;
});