Stedos/nise
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Operators refactor (added boolean), handling errors in frontend, improved export/import settings

Browse Source
This commit is contained in:
nise.moe 2024-02-24 17:58:10 +01:00
parent 7014dfdfb5
commit da299c0535
8 changed files with 118 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
nise-backend/src/main/kotlin/com/nisemoe/nise/controller/SearchController.kt
View File

@ -129,10 +129,15 @@ class SearchController(
data class SearchPredicate(
val field: SearchField,
val operator: String,
val operator: SearchPredicateOperator,
val value: String
)
data class SearchPredicateOperator(
val operatorType: String,
val acceptsValues: String
)
data class SearchField(
val name: String,
val type: String
@ -352,8 +357,9 @@ class SearchController(
private fun buildPredicateCondition(predicate: SearchPredicate): Condition {
val field = mapPredicateFieldToDatabaseField(predicate.field.name)
return when (predicate.field.type.lowercase()) {
"number" -> buildNumberCondition(field as Field<Double>, predicate.operator, predicate.value.toDouble())
"string" -> buildStringCondition(field as Field<String>, predicate.operator, predicate.value)
"number" -> buildNumberCondition(field as Field<Double>, predicate.operator.operatorType, predicate.value.toDouble())
"string" -> buildStringCondition(field as Field<String>, predicate.operator.operatorType, predicate.value)
"boolean" -> buildBooleanCondition(field as Field<Boolean>, predicate.operator.operatorType, predicate.value.toBoolean())
else -> throw IllegalArgumentException("Invalid field type")
}
}
@ -423,6 +429,14 @@ class SearchController(
}
}
private fun buildBooleanCondition(field: Field<Boolean>, operator: String, value: Boolean): Condition {
return when (operator) {
"=" -> field.eq(value)
"!=" -> field.ne(value)
else -> throw IllegalArgumentException("Invalid operator")
}
}
private fun buildNumberCondition(field: Field<Double>, operator: String, value: Double): Condition {
return when (operator) {
"=" -> field.eq(value)

2
nise-frontend/src/app/app.component.html
View File

@ -26,5 +26,5 @@
</div>
<router-outlet></router-outlet>
<div class="text-center version">
v20240222
v20240224
</div>

21
nise-frontend/src/app/search/search.component.html
View File

@ -4,8 +4,8 @@
<fieldset>
<legend>Table columns</legend>
<ng-container *ngFor="let category of ['user', 'beatmap', 'score']">
<fieldset>
<legend>{{ category }}</legend>
<fieldset class="mb-2">
<legend>{{ category }} <button (click)="this.selectEntireFieldCategory(category)">Select all</button> <button (click)="this.deselectEntireFieldCategory(category)">Deselect all</button></legend>
<ng-container *ngFor="let field of fields">
<div *ngIf="field.category === category">
<label>
@ -43,14 +43,12 @@
</label>
</fieldset>
<div class="text-center">
<div class="text-center mb-2 mt-2">
<button (click)="exportSettings()">Export Query</button>
<button (click)="fileInput.click()" style="margin-left: 5px">Import Query</button>
<div class="text-center mt-2">
<button (click)="exportSettings()">Export settings</button>
<button (click)="fileInput.click()" style="margin-left: 5px">Import settings</button>
<input type="file" #fileInput style="display: none" (change)="importSettings($event)" accept=".json">
</div>
<div class="text-center mt-1">
<button (click)="search()" class="mb-2" style="font-size: 18px">Search</button>
</div>
@ -60,13 +58,18 @@
</div>
</ng-container>
<div class="text-center alert-error" *ngIf="this.isError">
<p>Looks like something went wrong... :(</p>
<p>I'll look into what caused the error - but feel free to get in touch.</p>
</div>
<ng-container *ngIf="response">
<fieldset class="mb-2">
<legend>tools</legend>
<div class="text-center">
<button (click)="this.downloadFilesService.downloadCSV(response.scores)">Download .csv</button>
<button (click)="this.downloadFilesService.downloadJSON(response.scores)">Download .json</button>
<button (click)="this.downloadFilesService.downloadXLSX(response.scores)">Download .xslx</button>
<button (click)="this.downloadFilesService.downloadXLSX(response.scores)">Download .xlsx</button>
</div>
</fieldset>
<div class="scrollable-table">

35
nise-frontend/src/app/search/search.component.ts
View File

@ -9,7 +9,6 @@ import {Field, Query, QueryBuilderComponent} from "../../corelib/components/quer
import {RouterLink} from "@angular/router";
import {CalculatePageRangePipe} from "../../corelib/calculate-page-range.pipe";
import {DownloadFilesService} from "../../corelib/service/download-files.service";
import {catchError, throwError} from "rxjs";
interface SchemaField {
name: string;
@ -96,6 +95,7 @@ export class SearchComponent implements OnInit {
constructor(private httpClient: HttpClient, public downloadFilesService: DownloadFilesService) { }
isError = false;
isLoading = false;
response: SearchResponse | null = null;
@ -189,6 +189,24 @@ export class SearchComponent implements OnInit {
};
}
deselectEntireFieldCategory(categoryName: string): void {
this.fields.forEach(field => {
if (field.category === categoryName) {
field.active = false;
}
});
this.saveColumnsStatusToLocalStorage();
}
selectEntireFieldCategory(categoryName: string): void {
this.fields.forEach(field => {
if (field.category === categoryName) {
field.active = true;
}
});
this.saveColumnsStatusToLocalStorage();
}
mapSchemaFieldsToFields(): Field[] {
return this.fields.map(field => {
return {
@ -248,25 +266,22 @@ export class SearchComponent implements OnInit {
search(pageNumber: number = 1): void {
this.isLoading = true;
this.isError = false;
this.response = null;
const body = {
queries: this.queries,
sorting: this.sortingOrder,
page: pageNumber
}
this.httpClient.post<SearchResponse>(`${environment.apiUrl}/search`, body).pipe(
catchError(error => {
// Handle the error or rethrow
console.error('An error occurred:', error);
return throwError(() => new Error('An error occurred')); // Rethrow or return a new observable
})
).subscribe({
this.httpClient.post<SearchResponse>(`${environment.apiUrl}/search`, body)
.subscribe({
next: (response) => {
this.response = response;
this.isLoading = false;
},
error: (error) => {
// Handle subscription error
console.error('Subscription error:', error);
this.isError = true;
this.isLoading = false;
}
});

4
nise-frontend/src/assets/style.css
View File

@ -202,6 +202,10 @@ a.btn-success:hover {
margin-bottom: 40px;
}
.mt-1 {
margin-top: 10px;
}
.mt-2 {
margin-top: 20px;
}

8
nise-frontend/src/corelib/components/query-builder/query-builder.component.ts
View File

@ -5,6 +5,7 @@ import {QueryComponent} from "../query/query.component";
export type FieldType = 'number' | 'string' | 'flag' | 'grade' | 'boolean';
export type OperatorType = '=' | '>' | '<' | 'contains' | 'like' | '>=' | '<=' | '!=';
export type ValueType = 'any' | 'boolean';
export interface Field {
name: string;
@ -13,10 +14,15 @@ export interface Field {
export interface Predicate {
field: Field | null;
operator: OperatorType | null;
operator: Operator | null;
value: string | number | null;
}
export interface Operator {
operatorType: OperatorType;
acceptsValues: ValueType;
}
export interface Query {
predicates: Predicate[];
logicalOperator: 'AND' | 'OR';

24
nise-frontend/src/corelib/components/query/query.component.html
View File

@ -18,13 +18,31 @@
<option *ngFor="let field of fields" (click)="onFieldChange(predicate, field)" [selected]="field.name === predicate.field?.name">{{ field.name }}</option>
</select>
<select [(ngModel)]="predicate.operator" [disabled]="!predicate.field">
<option *ngFor="let operator of getOperators(predicate.field?.type)" [value]="operator" (change)="this.queryChanged.emit()">
{{ operator }}
<select [disabled]="!predicate.field">
<option *ngFor="let operator of getOperators(predicate.field?.type)"
[selected]="compare(operator.operatorType, predicate.operator?.operatorType)"
(click)="predicate.operator = operator; this.queryChanged.emit()">
{{ operator.operatorType }}
</option>
</select>
<ng-container *ngIf="predicate.operator">
<ng-container *ngIf="predicate.operator.acceptsValues == 'any'">
<input [(ngModel)]="predicate.value" type="text" placeholder="Value" [disabled]="!predicate.field" (change)="this.queryChanged.emit()">
</ng-container>
<ng-container *ngIf="predicate.operator.acceptsValues == 'boolean'">
<select [(ngModel)]="predicate.value" [disabled]="!predicate.field" (change)="this.queryChanged.emit()">
<option value="True">True</option>
<option value="False">False</option>
</select>
</ng-container>
</ng-container>
<button (click)="removePredicate(i)">X</button>
</div>

26
nise-frontend/src/corelib/components/query/query.component.ts
View File

@ -1,6 +1,6 @@
import {Component, EventEmitter, Input, Output} from '@angular/core';
import {Field, FieldType, OperatorType, Predicate, Query} from "../query-builder/query-builder.component";
import {NgForOf} from "@angular/common";
import {Field, FieldType, Operator, OperatorType, Predicate, Query} from "../query-builder/query-builder.component";
import {JsonPipe, NgForOf, NgIf} from "@angular/common";
import {FormsModule, ReactiveFormsModule} from "@angular/forms";
import { v4 as uuidv4 } from 'uuid';
@ -10,7 +10,9 @@ import { v4 as uuidv4 } from 'uuid';
imports: [
NgForOf,
ReactiveFormsModule,
FormsModule
FormsModule,
NgIf,
JsonPipe
],
templateUrl: './query.component.html',
styleUrl: './query.component.css'
@ -32,17 +34,29 @@ export class QueryComponent {
predicate.operator = this.getOperators(selectedField.type)[0];
}
getOperators(fieldType: FieldType | undefined): OperatorType[] {
getOperators(fieldType: FieldType | undefined): Operator[] {
switch (fieldType) {
case 'number':
return ['=', '>', '<', '>=', '<=', '!='];
return ['=', '>', '<', '>=', '<=', '!=']
.map((operatorType: String) => ({ operatorType: operatorType, acceptsValues: 'any'}) as Operator);
case 'string':
return ['=', 'contains', 'like'];
return ['=', 'contains', 'like']
.map((operatorType: String) => ({ operatorType: operatorType, acceptsValues: 'any'}) as Operator);
case 'boolean':
return ['=', '!=']
.map((operatorType: String) => ({ operatorType: operatorType, acceptsValues: 'boolean'}) as Operator);
default:
return [];
}
}
compare(a: any, b: any): boolean {
console.warn('compare', a, b);
console.warn('compare', a === b)
console.error();
return a === b;
}
addPredicate(): void {
this.query.predicates.push({ field: null, operator: null, value: null });
this.queryChanged.emit();