Initial commit for gisaf/fastapi
This commit is contained in:
commit
adce44722f
1361 changed files with 42521 additions and 0 deletions
12
.browserslistrc
Normal file
12
.browserslistrc
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
|
||||||
|
# For additional information regarding the format and rule options, please see:
|
||||||
|
# https://github.com/browserslist/browserslist#queries
|
||||||
|
|
||||||
|
# You can see what browsers were selected by your queries by running:
|
||||||
|
# npx browserslist
|
||||||
|
|
||||||
|
> 0.5%
|
||||||
|
last 2 versions
|
||||||
|
Firefox ESR
|
||||||
|
not dead
|
||||||
|
not IE 9-11 # For IE 9-11 support, remove 'not'.
|
||||||
13
.editorconfig
Normal file
13
.editorconfig
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
# Editor configuration, see http://editorconfig.org
|
||||||
|
root = true
|
||||||
|
|
||||||
|
[*]
|
||||||
|
charset = utf-8
|
||||||
|
indent_style = space
|
||||||
|
indent_size = 2
|
||||||
|
insert_final_newline = true
|
||||||
|
trim_trailing_whitespace = true
|
||||||
|
|
||||||
|
[*.md]
|
||||||
|
max_line_length = off
|
||||||
|
trim_trailing_whitespace = false
|
||||||
41
.gitignore
vendored
Normal file
41
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,41 @@
|
||||||
|
# See http://help.github.com/ignore-files/ for more about ignoring files.
|
||||||
|
|
||||||
|
# compiled output
|
||||||
|
/dist
|
||||||
|
/tmp
|
||||||
|
|
||||||
|
# dependencies
|
||||||
|
/node_modules
|
||||||
|
|
||||||
|
# IDEs and editors
|
||||||
|
/.idea
|
||||||
|
.project
|
||||||
|
.classpath
|
||||||
|
.c9/
|
||||||
|
*.launch
|
||||||
|
.settings/
|
||||||
|
|
||||||
|
# IDE - VSCode
|
||||||
|
.vscode/*
|
||||||
|
!.vscode/settings.json
|
||||||
|
!.vscode/tasks.json
|
||||||
|
!.vscode/launch.json
|
||||||
|
!.vscode/extensions.json
|
||||||
|
|
||||||
|
# misc
|
||||||
|
/.angular/cache
|
||||||
|
/.sass-cache
|
||||||
|
/connect.lock
|
||||||
|
/coverage/*
|
||||||
|
/libpeerconnection.log
|
||||||
|
npm-debug.log
|
||||||
|
testem.log
|
||||||
|
/typings
|
||||||
|
|
||||||
|
# e2e
|
||||||
|
/e2e/*.js
|
||||||
|
/e2e/*.map
|
||||||
|
|
||||||
|
#System Files
|
||||||
|
.DS_Store
|
||||||
|
Thumbs.db
|
||||||
31
README.md
Normal file
31
README.md
Normal file
|
|
@ -0,0 +1,31 @@
|
||||||
|
# GisafApp
|
||||||
|
|
||||||
|
This project was generated with [angular-cli](https://github.com/angular/angular-cli) version 1.0.0-beta.24.
|
||||||
|
|
||||||
|
## Development server
|
||||||
|
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
|
||||||
|
|
||||||
|
## Code scaffolding
|
||||||
|
|
||||||
|
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive/pipe/service/class/module`.
|
||||||
|
|
||||||
|
## Build
|
||||||
|
|
||||||
|
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `-prod` flag for a production build.
|
||||||
|
|
||||||
|
## Running unit tests
|
||||||
|
|
||||||
|
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
|
||||||
|
|
||||||
|
## Running end-to-end tests
|
||||||
|
|
||||||
|
Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
|
||||||
|
Before running the tests make sure you are serving the app via `ng serve`.
|
||||||
|
|
||||||
|
## Deploying to Github Pages
|
||||||
|
|
||||||
|
Run `ng github-pages:deploy` to deploy to Github Pages.
|
||||||
|
|
||||||
|
## Further help
|
||||||
|
|
||||||
|
To get more help on the `angular-cli` use `ng help` or go check out the [Angular-CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
|
||||||
184
angular.json
Normal file
184
angular.json
Normal file
|
|
@ -0,0 +1,184 @@
|
||||||
|
{
|
||||||
|
"version": 1,
|
||||||
|
"newProjectRoot": "projects",
|
||||||
|
"projects": {
|
||||||
|
"gisaf-app": {
|
||||||
|
"root": "",
|
||||||
|
"projectType": "application",
|
||||||
|
"architect": {
|
||||||
|
"build": {
|
||||||
|
"builder": "@angular-devkit/build-angular:browser",
|
||||||
|
"options": {
|
||||||
|
"outputPath": "dist",
|
||||||
|
"index": "src/index.html",
|
||||||
|
"main": "src/main.ts",
|
||||||
|
"tsConfig": "src/tsconfig.app.json",
|
||||||
|
"polyfills": "src/polyfills.ts",
|
||||||
|
"assets": [
|
||||||
|
{
|
||||||
|
"glob": "**/*",
|
||||||
|
"input": "src/assets",
|
||||||
|
"output": "/assets"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"glob": "favicon.ico",
|
||||||
|
"input": "src",
|
||||||
|
"output": "/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"glob": "**/*",
|
||||||
|
"input": "src/undefined",
|
||||||
|
"output": "/"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"styles": [
|
||||||
|
{
|
||||||
|
"input": "node_modules/maplibre-gl/dist/maplibre-gl.css",
|
||||||
|
"inject": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"input": "src/styles.css",
|
||||||
|
"inject": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"input": "src/icons.css",
|
||||||
|
"inject": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"input": "src/gisaf-icons.css",
|
||||||
|
"inject": true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"scripts": [
|
||||||
|
"node_modules/plotly.js-basic-dist-min/plotly-basic.min.js"
|
||||||
|
],
|
||||||
|
"allowedCommonJsDependencies": [
|
||||||
|
"@turf/bbox",
|
||||||
|
"@turf/meta",
|
||||||
|
"graphql-tag",
|
||||||
|
"suggestions",
|
||||||
|
"subscriptions-transport-ws",
|
||||||
|
"zen-observable",
|
||||||
|
"maplibre-gl",
|
||||||
|
"@mapbox/point-geometry"
|
||||||
|
],
|
||||||
|
"vendorChunk": true,
|
||||||
|
"extractLicenses": false,
|
||||||
|
"buildOptimizer": false,
|
||||||
|
"sourceMap": true,
|
||||||
|
"optimization": false,
|
||||||
|
"namedChunks": true
|
||||||
|
},
|
||||||
|
"configurations": {
|
||||||
|
"production": {
|
||||||
|
"budgets": [
|
||||||
|
{
|
||||||
|
"type": "anyComponentStyle",
|
||||||
|
"maximumWarning": "6kb"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"optimization": true,
|
||||||
|
"outputHashing": "all",
|
||||||
|
"sourceMap": false,
|
||||||
|
"namedChunks": false,
|
||||||
|
"extractLicenses": true,
|
||||||
|
"vendorChunk": false,
|
||||||
|
"buildOptimizer": true,
|
||||||
|
"fileReplacements": [
|
||||||
|
{
|
||||||
|
"src": "src/environments/environment.ts",
|
||||||
|
"replaceWith": "src/environments/environment.prod.ts"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"serve": {
|
||||||
|
"builder": "@angular-devkit/build-angular:dev-server",
|
||||||
|
"options": {
|
||||||
|
"browserTarget": "gisaf-app:build"
|
||||||
|
},
|
||||||
|
"configurations": {
|
||||||
|
"production": {
|
||||||
|
"browserTarget": "gisaf-app:build:production"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"extract-i18n": {
|
||||||
|
"builder": "@angular-devkit/build-angular:extract-i18n",
|
||||||
|
"options": {
|
||||||
|
"browserTarget": "gisaf-app:build"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"test": {
|
||||||
|
"builder": "@angular-devkit/build-angular:karma",
|
||||||
|
"options": {
|
||||||
|
"main": "src/test.ts",
|
||||||
|
"karmaConfig": "./karma.conf.js",
|
||||||
|
"polyfills": "src/polyfills.ts",
|
||||||
|
"tsConfig": "src/tsconfig.spec.json",
|
||||||
|
"scripts": [],
|
||||||
|
"styles": [
|
||||||
|
{
|
||||||
|
"input": "node_modules/maplibre-gl/dist/maplibre-gl.css",
|
||||||
|
"inject": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"input": "src/styles.css",
|
||||||
|
"inject": true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"input": "src/icons.css",
|
||||||
|
"inject": true
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"assets": [
|
||||||
|
{
|
||||||
|
"glob": "**/*",
|
||||||
|
"input": "src/assets",
|
||||||
|
"output": "/assets"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"glob": "favicon.ico",
|
||||||
|
"input": "src",
|
||||||
|
"output": "/"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"glob": "**/*",
|
||||||
|
"input": "src/undefined",
|
||||||
|
"output": "/"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"gisaf-app-e2e": {
|
||||||
|
"root": "",
|
||||||
|
"projectType": "application",
|
||||||
|
"cli": {},
|
||||||
|
"schematics": {},
|
||||||
|
"architect": {
|
||||||
|
"e2e": {
|
||||||
|
"builder": "@angular-devkit/build-angular:protractor",
|
||||||
|
"options": {
|
||||||
|
"protractorConfig": "./protractor.conf.js",
|
||||||
|
"devServerTarget": "gisaf-app:serve"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"schematics": {
|
||||||
|
"@schematics/angular:component": {
|
||||||
|
"prefix": "app",
|
||||||
|
"style": "css"
|
||||||
|
},
|
||||||
|
"@schematics/angular:directive": {
|
||||||
|
"prefix": "app"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"cli": {
|
||||||
|
"analytics": false
|
||||||
|
}
|
||||||
|
}
|
||||||
33
karma.conf.js
Normal file
33
karma.conf.js
Normal file
|
|
@ -0,0 +1,33 @@
|
||||||
|
// Karma configuration file, see link for more information
|
||||||
|
// https://karma-runner.github.io/1.0/config/configuration-file.html
|
||||||
|
|
||||||
|
module.exports = function (config) {
|
||||||
|
config.set({
|
||||||
|
basePath: '',
|
||||||
|
frameworks: ['jasmine', '@angular-devkit/build-angular'],
|
||||||
|
plugins: [
|
||||||
|
require('karma-jasmine'),
|
||||||
|
require('karma-chrome-launcher'),
|
||||||
|
require('karma-jasmine-html-reporter'),
|
||||||
|
require('karma-coverage-istanbul-reporter'),
|
||||||
|
require('@angular-devkit/build-angular/plugins/karma')
|
||||||
|
],
|
||||||
|
client:{
|
||||||
|
clearContext: false // leave Jasmine Spec Runner output visible in browser
|
||||||
|
},
|
||||||
|
coverageIstanbulReporter: {
|
||||||
|
dir: require('path').join(__dirname, 'coverage'), reports: [ 'html', 'lcovonly' ],
|
||||||
|
fixWebpackSourcePaths: true
|
||||||
|
},
|
||||||
|
angularCli: {
|
||||||
|
environment: 'dev'
|
||||||
|
},
|
||||||
|
reporters: ['progress', 'kjhtml'],
|
||||||
|
port: 9876,
|
||||||
|
colors: true,
|
||||||
|
logLevel: config.LOG_INFO,
|
||||||
|
autoWatch: true,
|
||||||
|
browsers: ['Chrome'],
|
||||||
|
singleRun: false
|
||||||
|
});
|
||||||
|
};
|
||||||
14554
package-lock.json
generated
Normal file
14554
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load diff
87
package.json
Normal file
87
package.json
Normal file
|
|
@ -0,0 +1,87 @@
|
||||||
|
{
|
||||||
|
"name": "gisaf-app",
|
||||||
|
"displayName": "Gisaf",
|
||||||
|
"version": "0.1.0",
|
||||||
|
"license": "GPL-3.0",
|
||||||
|
"description": "Gisaf Geomatics",
|
||||||
|
"repository": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "https://git.bluelightav.org:2222/gisaf.git"
|
||||||
|
},
|
||||||
|
"author": "Philippe May",
|
||||||
|
"angular-cli": {},
|
||||||
|
"scripts": {
|
||||||
|
"ng": "ng",
|
||||||
|
"start": "node --max_old_space_size=4096 ./node_modules/@angular/cli/bin/ng serve --proxy-config proxy.conf.json --watch",
|
||||||
|
"build": "node --max_old_space_size=4096 ./node_modules/@angular/cli/bin/ng build",
|
||||||
|
"test": "ng test",
|
||||||
|
"lint": "ng lint",
|
||||||
|
"e2e": "ng e2e",
|
||||||
|
"generate-client": "openapi --input http://127.0.0.1:5000/openapi.json --output ./src/app/openapi --client angular --useOptions --useUnionTypes"
|
||||||
|
},
|
||||||
|
"licenses": [
|
||||||
|
{
|
||||||
|
"type": "MIT",
|
||||||
|
"url": "https://github.com/angular/angular.io/blob/master/LICENSE"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"private": true,
|
||||||
|
"dependencies": {
|
||||||
|
"@angular/animations": "^15.2.1",
|
||||||
|
"@angular/cdk": "^15.2.1",
|
||||||
|
"@angular/common": "^15.2.1",
|
||||||
|
"@angular/compiler": "^15.2.1",
|
||||||
|
"@angular/core": "^15.2.1",
|
||||||
|
"@angular/forms": "^15.2.1",
|
||||||
|
"@angular/material": "^15.2.1",
|
||||||
|
"@angular/platform-browser": "^15.2.1",
|
||||||
|
"@angular/platform-browser-dynamic": "^15.2.1",
|
||||||
|
"@angular/platform-server": "^15.2.1",
|
||||||
|
"@angular/router": "^15.2.1",
|
||||||
|
"@apollo/client": "^3.4.16",
|
||||||
|
"@mapbox/point-geometry": "^0.1.0",
|
||||||
|
"@maplibre/ngx-maplibre-gl": "^13.0.0",
|
||||||
|
"@turf/bbox": "^6.5.0",
|
||||||
|
"@turf/distance": "^6.5.0",
|
||||||
|
"angular-plotly.js": "^4.0.4",
|
||||||
|
"apollo-angular": "^4.2.1",
|
||||||
|
"core-js": "^2.6.3",
|
||||||
|
"graphql": "^15.6.1",
|
||||||
|
"maplibre-gl": "^2.4.0",
|
||||||
|
"ngx-flexible-layout": "15.0.1",
|
||||||
|
"plotly.js-basic-dist-min": "^2.8.1",
|
||||||
|
"rxjs": "^7.4.0",
|
||||||
|
"subscriptions-transport-ws": "^0.9.17",
|
||||||
|
"ts-helpers": "^1.1.2",
|
||||||
|
"zone.js": "~0.11.4"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"@angular-devkit/build-angular": "^15.2.1",
|
||||||
|
"@angular/cli": "^15.2.1",
|
||||||
|
"@angular/compiler-cli": "^15.2.1",
|
||||||
|
"@angular/language-service": "^15.2.1",
|
||||||
|
"@types/core-js": "^2.5.0",
|
||||||
|
"@types/geojson": "^7946.0.7",
|
||||||
|
"@types/jasmine": "~3.6.0",
|
||||||
|
"@types/jasminewd2": "^2.0.2",
|
||||||
|
"@types/node": "^12.11.1",
|
||||||
|
"@types/plotly.js-dist-min": "^2.3.0",
|
||||||
|
"clean-css": "^4.2.1",
|
||||||
|
"codelyzer": "^6.0.0",
|
||||||
|
"fontnik": "^0.7.1",
|
||||||
|
"jasmine-core": "~3.6.0",
|
||||||
|
"jasmine-spec-reporter": "~5.0.0",
|
||||||
|
"karma": "~6.3.2",
|
||||||
|
"karma-chrome-launcher": "~3.1.0",
|
||||||
|
"karma-cli": "^2.0.0",
|
||||||
|
"karma-coverage-istanbul-reporter": "~3.0.2",
|
||||||
|
"karma-jasmine": "~4.0.0",
|
||||||
|
"openapi-typescript-codegen": "^0.27.0",
|
||||||
|
"protractor": "~7.0.0",
|
||||||
|
"source-map-explorer": "^2.2.2",
|
||||||
|
"ts-node": "^8.0.2",
|
||||||
|
"tslib": "^2.0.0",
|
||||||
|
"tslint": "~6.1.0",
|
||||||
|
"typescript": "~4.8.4"
|
||||||
|
}
|
||||||
|
}
|
||||||
28
protractor.conf.js
Normal file
28
protractor.conf.js
Normal file
|
|
@ -0,0 +1,28 @@
|
||||||
|
// Protractor configuration file, see link for more information
|
||||||
|
// https://github.com/angular/protractor/blob/master/lib/config.ts
|
||||||
|
|
||||||
|
const { SpecReporter } = require('jasmine-spec-reporter');
|
||||||
|
|
||||||
|
exports.config = {
|
||||||
|
allScriptsTimeout: 11000,
|
||||||
|
specs: [
|
||||||
|
'./e2e/**/*.e2e-spec.ts'
|
||||||
|
],
|
||||||
|
capabilities: {
|
||||||
|
'browserName': 'chrome'
|
||||||
|
},
|
||||||
|
directConnect: true,
|
||||||
|
baseUrl: 'http://localhost:4200/',
|
||||||
|
framework: 'jasmine',
|
||||||
|
jasmineNodeOpts: {
|
||||||
|
showColors: true,
|
||||||
|
defaultTimeoutInterval: 30000,
|
||||||
|
print: function() {}
|
||||||
|
},
|
||||||
|
onPrepare() {
|
||||||
|
require('ts-node').register({
|
||||||
|
project: 'e2e/tsconfig.e2e.json'
|
||||||
|
});
|
||||||
|
jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
|
||||||
|
}
|
||||||
|
};
|
||||||
37
proxy.conf.json
Normal file
37
proxy.conf.json
Normal file
|
|
@ -0,0 +1,37 @@
|
||||||
|
{
|
||||||
|
"/static": {
|
||||||
|
"target": "http://127.0.0.1:5000",
|
||||||
|
"secure": false
|
||||||
|
},
|
||||||
|
"/gj": {
|
||||||
|
"target": "http://127.0.0.1:5000",
|
||||||
|
"secure": false,
|
||||||
|
"ws": true
|
||||||
|
},
|
||||||
|
"/sched": {
|
||||||
|
"target": "http://127.0.0.1:8000",
|
||||||
|
"secure": false
|
||||||
|
},
|
||||||
|
"/_sched": {
|
||||||
|
"target": "http://127.0.0.1:8000",
|
||||||
|
"secure": false,
|
||||||
|
"ws": true
|
||||||
|
},
|
||||||
|
"/api": {
|
||||||
|
"target": "http://127.0.0.1:5000",
|
||||||
|
"secure": false,
|
||||||
|
"ws": true
|
||||||
|
},
|
||||||
|
"/static/tiles": {
|
||||||
|
"target": "/home/phil/gisaf_misc/map/tiles",
|
||||||
|
"secure": false,
|
||||||
|
"changeOrigin": true,
|
||||||
|
"pathRewrite": {
|
||||||
|
"^/static/tiles" : ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"/terrain": {
|
||||||
|
"target": "http://127.0.0.1:8899",
|
||||||
|
"secure": false
|
||||||
|
}
|
||||||
|
}
|
||||||
7
src/app/_models/user.ts
Normal file
7
src/app/_models/user.ts
Normal file
|
|
@ -0,0 +1,7 @@
|
||||||
|
export class User {
|
||||||
|
constructor(
|
||||||
|
public userName: string,
|
||||||
|
public token: string,
|
||||||
|
public password?: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
232
src/app/_services/actions.service.ts
Normal file
232
src/app/_services/actions.service.ts
Normal file
|
|
@ -0,0 +1,232 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
|
||||||
|
import { Observable, pipe, BehaviorSubject } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { Apollo, gql } from 'apollo-angular'
|
||||||
|
|
||||||
|
import { Tag } from '../info/info-tags/tags.service'
|
||||||
|
import { TaggedLayer, TaggedFeature, FormFieldInput } from '../info/info-data.service'
|
||||||
|
|
||||||
|
export class ActionParam {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public type: string,
|
||||||
|
public dflt: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Action {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public roles: string[],
|
||||||
|
public params: ActionParam[],
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ActionsStore {
|
||||||
|
constructor(
|
||||||
|
public store: string,
|
||||||
|
public actions: Action[],
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ActionResult {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public message: string,
|
||||||
|
public taggedLayers: TaggedLayer[],
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ActionResults {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public message: string,
|
||||||
|
public actionResults: ActionResult[],
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ActionsResults {
|
||||||
|
constructor(
|
||||||
|
public message: string,
|
||||||
|
public actionResults: ActionResults[],
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ActionAction {
|
||||||
|
constructor(
|
||||||
|
public plugin: string,
|
||||||
|
public name: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export class Store {
|
||||||
|
constructor(
|
||||||
|
public store: string,
|
||||||
|
public actions: ActionAction[],
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const getTagsActionsQuery = gql`
|
||||||
|
query actionsPlugins {
|
||||||
|
actionsPlugins {
|
||||||
|
store
|
||||||
|
actions {
|
||||||
|
name
|
||||||
|
roles
|
||||||
|
params {
|
||||||
|
name
|
||||||
|
type
|
||||||
|
dflt
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const executeTagsActionsQuery = gql`
|
||||||
|
mutation executeAction(
|
||||||
|
$stores: [String]!,
|
||||||
|
$ids: [[String]]!,
|
||||||
|
$names: [String]!,
|
||||||
|
$params: [ActionParamInput],
|
||||||
|
$formFields: [FormFieldInput]
|
||||||
|
) {
|
||||||
|
executeAction(
|
||||||
|
stores: $stores,
|
||||||
|
ids: $ids,
|
||||||
|
names: $names,
|
||||||
|
params: $params,
|
||||||
|
formFields: $formFields,
|
||||||
|
) {
|
||||||
|
result {
|
||||||
|
message
|
||||||
|
actionResults {
|
||||||
|
name
|
||||||
|
message
|
||||||
|
actionResults {
|
||||||
|
message
|
||||||
|
taggedLayers {
|
||||||
|
store
|
||||||
|
taggedFeatures {
|
||||||
|
id
|
||||||
|
lon
|
||||||
|
lat
|
||||||
|
tags {
|
||||||
|
key
|
||||||
|
value
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class ActionsService {
|
||||||
|
actionsStores: ActionsStore[] = []
|
||||||
|
|
||||||
|
public actionsProviderService = new BehaviorSubject<ActionsStore[]>([])
|
||||||
|
public actionsProviderService$ = this.actionsProviderService.asObservable()
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private apollo: Apollo,
|
||||||
|
) {
|
||||||
|
this.getTagsActionsStores().subscribe(
|
||||||
|
actionsStores => {
|
||||||
|
this.actionsStores = actionsStores
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
public getTagsActionsStores(): Observable<ActionsStore[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getTagsActionsQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res => {
|
||||||
|
let actionStores = res['data']['actionsPlugins'].map(pipe(
|
||||||
|
store => new Store(
|
||||||
|
store['store'],
|
||||||
|
store['actions'].map(
|
||||||
|
action => new Action(
|
||||||
|
action['name'],
|
||||||
|
action['roles'],
|
||||||
|
action['params'].map(
|
||||||
|
param => new ActionParam(
|
||||||
|
param['name'],
|
||||||
|
param['type'],
|
||||||
|
param['dflt']
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
))
|
||||||
|
this.actionsProviderService.next(actionStores)
|
||||||
|
return actionStores
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
public execute(
|
||||||
|
stores: string[],
|
||||||
|
ids: string[][],
|
||||||
|
actionNames: string[],
|
||||||
|
params: ActionParam[],
|
||||||
|
formFields?: FormFieldInput[]
|
||||||
|
): Observable<ActionsResults> {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: executeTagsActionsQuery,
|
||||||
|
variables: {
|
||||||
|
stores: stores,
|
||||||
|
ids: ids,
|
||||||
|
names: actionNames,
|
||||||
|
params: params,
|
||||||
|
formFields: formFields
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
result => result['data']['executeAction']['result'].map(
|
||||||
|
res => new ActionsResults(
|
||||||
|
res['message'],
|
||||||
|
res['actionResults'].map(
|
||||||
|
r => new ActionResults(
|
||||||
|
r['name'],
|
||||||
|
r['message'],
|
||||||
|
r['actionResults'] && r['actionResults'].map(
|
||||||
|
actionResults => new ActionResult(
|
||||||
|
actionResults['name'],
|
||||||
|
actionResults['message'],
|
||||||
|
(actionResults['taggedLayers'] || []).map(
|
||||||
|
taggedLayer => new TaggedLayer(
|
||||||
|
taggedLayer['store'],
|
||||||
|
taggedLayer['taggedFeatures'].map(
|
||||||
|
taggedFeature => new TaggedFeature(
|
||||||
|
taggedFeature['id'],
|
||||||
|
taggedFeature['lon'],
|
||||||
|
taggedFeature['lat'],
|
||||||
|
taggedFeature['tags'].map(
|
||||||
|
tag => new Tag(
|
||||||
|
tag['key'],
|
||||||
|
tag['value']
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
}
|
||||||
404
src/app/_services/apollo.service.ts
Normal file
404
src/app/_services/apollo.service.ts
Normal file
|
|
@ -0,0 +1,404 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { Validators, UntypedFormGroup, UntypedFormControl } from '@angular/forms'
|
||||||
|
|
||||||
|
import { MatTableDataSource } from '@angular/material/table'
|
||||||
|
|
||||||
|
import { Observable, forkJoin } from 'rxjs'
|
||||||
|
import { map, mergeMap } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { Apollo, gql } from 'apollo-angular'
|
||||||
|
|
||||||
|
const fieldTypeMap = {
|
||||||
|
Int: 'number',
|
||||||
|
Float: 'number',
|
||||||
|
Boolean: 'checkbox',
|
||||||
|
}
|
||||||
|
|
||||||
|
const introspectionQuery = gql`
|
||||||
|
query introspect ($modelName: String!) {
|
||||||
|
__type(name: $modelName) {
|
||||||
|
name
|
||||||
|
fields {
|
||||||
|
name
|
||||||
|
type {
|
||||||
|
name
|
||||||
|
kind
|
||||||
|
ofType {
|
||||||
|
name
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const inspectionQuery = gql`
|
||||||
|
query inspect ($modelName: String!) {
|
||||||
|
inspect(modelName: $modelName) {
|
||||||
|
pkFields
|
||||||
|
relation_fields
|
||||||
|
joins {
|
||||||
|
name
|
||||||
|
target
|
||||||
|
rel_field
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const dashboardPageQuery = gql`
|
||||||
|
query dashboard_page ($group: String!, $name: String!) {
|
||||||
|
dashboard_page(group: $group, name: $name) {
|
||||||
|
name
|
||||||
|
group
|
||||||
|
description
|
||||||
|
html
|
||||||
|
notebook
|
||||||
|
time
|
||||||
|
dfData
|
||||||
|
plotData
|
||||||
|
attachment
|
||||||
|
expandedPanes
|
||||||
|
sections {
|
||||||
|
name
|
||||||
|
plot
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}`
|
||||||
|
|
||||||
|
export class FieldIntrospection {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public type: string,
|
||||||
|
public primary: boolean = false,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
get inputType() {
|
||||||
|
return fieldTypeMap[this.type] || 'text'
|
||||||
|
}
|
||||||
|
|
||||||
|
get isTextArea() {
|
||||||
|
return this.type == 'JSONString'
|
||||||
|
}
|
||||||
|
|
||||||
|
get isText() {
|
||||||
|
return this.type == 'String' || this.type == 'Int' || this.type == 'Float'
|
||||||
|
}
|
||||||
|
|
||||||
|
get isCheckbox() {
|
||||||
|
return this.type == 'Boolean'
|
||||||
|
}
|
||||||
|
|
||||||
|
get validator() {
|
||||||
|
if (this.type == 'ID') {
|
||||||
|
return Validators.required
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ModelIntrospection {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public fields: FieldIntrospection[],
|
||||||
|
public relations: object[],
|
||||||
|
) {}
|
||||||
|
|
||||||
|
pkFields(): FieldIntrospection[] {
|
||||||
|
return this.fields.filter(f => f.primary)
|
||||||
|
}
|
||||||
|
|
||||||
|
columns(): string[] {
|
||||||
|
return this.fields.map(f => f.name)
|
||||||
|
}
|
||||||
|
|
||||||
|
columnsForGql(): string {
|
||||||
|
return this.columns().join(' ')
|
||||||
|
}
|
||||||
|
|
||||||
|
get mutationFields(): string {
|
||||||
|
return this.fields.map(t => '$' + t.name + ':' + t.type).join(',')
|
||||||
|
}
|
||||||
|
|
||||||
|
get mutationVars(): string {
|
||||||
|
return this.fields.map(t => t.name + ':$' + t.name).join(',')
|
||||||
|
}
|
||||||
|
|
||||||
|
get mutationData(): string {
|
||||||
|
return this.columns().join(',')
|
||||||
|
}
|
||||||
|
|
||||||
|
getMutationQuery() {
|
||||||
|
return gql`
|
||||||
|
mutation mutation(${this.mutationFields}) {
|
||||||
|
mutation(${this.mutationVars}) {
|
||||||
|
${this.mutationData}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class JoinField {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public target: string,
|
||||||
|
public rel_field: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ModelInspection {
|
||||||
|
constructor(
|
||||||
|
public pkFields: string[],
|
||||||
|
public relations: string[],
|
||||||
|
public joins: JoinField[],
|
||||||
|
) {}
|
||||||
|
|
||||||
|
get joinedFieldNames() {
|
||||||
|
return this.joins.map(join => join.rel_field)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class DashboardPageSection {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public plot: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class DashboardPage {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public group: string,
|
||||||
|
public errors: string = undefined,
|
||||||
|
public description: string = undefined,
|
||||||
|
public html: string = undefined,
|
||||||
|
public notebook: string = undefined,
|
||||||
|
public dfData: MatTableDataSource<object> = undefined,
|
||||||
|
public plotData: Object = undefined,
|
||||||
|
public time: Date = undefined,
|
||||||
|
public attachment: string = undefined,
|
||||||
|
public expandedPanes: string[] = [],
|
||||||
|
public sections: DashboardPageSection[] = []
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Model {
|
||||||
|
constructor(
|
||||||
|
public inspection: ModelInspection,
|
||||||
|
public introspection: ModelIntrospection,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
getFormFields(formGroup: UntypedFormGroup, item): FieldIntrospection[] {
|
||||||
|
// Return the form fields and build the FormGroup controls accordingly
|
||||||
|
// XXX: move to another class, aka admin.models.Model?
|
||||||
|
let formFields = []
|
||||||
|
this.introspection.fields.forEach(
|
||||||
|
field => {
|
||||||
|
// Don't add fields which are in inspection.relations
|
||||||
|
if (this.inspection.joinedFieldNames.indexOf(field.name) >= 0) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
let control = new UntypedFormControl(field.name, field.validator)
|
||||||
|
control.setValue(item[field.name])
|
||||||
|
formGroup.addControl(field.name, control)
|
||||||
|
formFields.push(field)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
this.inspection.joins.forEach(
|
||||||
|
join => {
|
||||||
|
let control = new UntypedFormControl()
|
||||||
|
control.setValue(item[join.rel_field])
|
||||||
|
formGroup.addControl(join.name, control)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
return formFields
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class ModelDataService {
|
||||||
|
constructor(
|
||||||
|
private apollo: Apollo
|
||||||
|
) {}
|
||||||
|
|
||||||
|
fullInspect(modelName): Observable<Model> {
|
||||||
|
return forkJoin([
|
||||||
|
this.inspect(modelName),
|
||||||
|
this.introspect(modelName),
|
||||||
|
]).pipe(map(
|
||||||
|
res => new Model(res[0], res[1])
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
inspect(modelName): Observable<ModelInspection> {
|
||||||
|
// Inspection (Gisaf)
|
||||||
|
return this.get(inspectionQuery, {'modelName': modelName}).pipe(map(
|
||||||
|
res => {
|
||||||
|
let joins = res['inspect']['joins'].map(
|
||||||
|
join => new JoinField(join['name'], join['target'], join['rel_field'])
|
||||||
|
)
|
||||||
|
return new ModelInspection(
|
||||||
|
res['inspect']['pkFields'],
|
||||||
|
res['inspect']['relation_fields'],
|
||||||
|
joins
|
||||||
|
)
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
introspect(modelName): Observable<ModelIntrospection> {
|
||||||
|
// Introspection (Graphql)
|
||||||
|
return this.get(introspectionQuery, {'modelName': modelName}).pipe(map(
|
||||||
|
res => {
|
||||||
|
var relations = []
|
||||||
|
let _fields = res['__type']['fields']
|
||||||
|
// Find the primary keys
|
||||||
|
var fields = _fields.filter(f => !f.type.name && f.type.kind=='NON_NULL').map(
|
||||||
|
f => new FieldIntrospection(f.name, f['type']['ofType']['name'], true)
|
||||||
|
)
|
||||||
|
var pkFieldNames = fields.map(f => f.name)
|
||||||
|
_fields.forEach(
|
||||||
|
resField => {
|
||||||
|
let name = resField['name']
|
||||||
|
let type = resField['type']
|
||||||
|
// Skip primary keys
|
||||||
|
if (pkFieldNames.indexOf(name) != -1) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (name == 'geom') {
|
||||||
|
// Remove geom column
|
||||||
|
// XXX: Should be marked as geojson type
|
||||||
|
// and might be a link to the map or something like that
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (type['kind'] == 'OBJECT') {
|
||||||
|
// Relation
|
||||||
|
return
|
||||||
|
}
|
||||||
|
fields.push(new FieldIntrospection(name, type['name']))
|
||||||
|
}
|
||||||
|
)
|
||||||
|
return new ModelIntrospection(modelName, fields, relations)
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
mutate(model: ModelIntrospection, values: object): Observable<object> {
|
||||||
|
let mutationQuery = model.getMutationQuery()
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: mutationQuery,
|
||||||
|
variables: values,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
resolveItemData(modelName: string, pk: string): Observable<object> {
|
||||||
|
return this.fullInspect(modelName).pipe(
|
||||||
|
mergeMap(
|
||||||
|
model => {
|
||||||
|
// XXX: get pk type and name from model introspection
|
||||||
|
let pkField = model.introspection.pkFields()[0]
|
||||||
|
let query = gql`
|
||||||
|
query item ($pk: ID) {
|
||||||
|
${modelName} (pk:$pk) {
|
||||||
|
${model.introspection.columnsForGql()}
|
||||||
|
}
|
||||||
|
}`
|
||||||
|
return this.get(query, {pk: pk}).pipe(map(
|
||||||
|
item => {
|
||||||
|
if (item) {
|
||||||
|
return {
|
||||||
|
'item': item,
|
||||||
|
'model': model,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
all(model: ModelIntrospection, fields?: string[]): Observable<object> {
|
||||||
|
if (!fields) {
|
||||||
|
fields = model.columns()
|
||||||
|
}
|
||||||
|
const fieldList = fields.join(' ')
|
||||||
|
const query = gql`query model {${model.name}{${fieldList}}}`
|
||||||
|
return this.get(query)
|
||||||
|
}
|
||||||
|
|
||||||
|
get(query, vars: object = {}): Observable<any> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: query,
|
||||||
|
variables: vars,
|
||||||
|
errorPolicy: 'all',
|
||||||
|
}).pipe(map(
|
||||||
|
result => {
|
||||||
|
if (result.errors) {
|
||||||
|
throw result.errors.map(err => err.message).join(', ')
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
return result.data
|
||||||
|
}
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class DashboardDataService {
|
||||||
|
constructor(
|
||||||
|
private apollo: Apollo
|
||||||
|
) {}
|
||||||
|
|
||||||
|
getDashboardPage(group: string, name: string): Observable<DashboardPage> {
|
||||||
|
return this.get(dashboardPageQuery, {'name': name, 'group': group}).pipe(map(
|
||||||
|
res => {
|
||||||
|
if (res['errors'] && res['errors'].length > 0) {
|
||||||
|
return new DashboardPage(
|
||||||
|
name,
|
||||||
|
group,
|
||||||
|
res['errors'].map(e => e.message).join(', '),
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
let page = res['dashboard_page']
|
||||||
|
return new DashboardPage(
|
||||||
|
page['name'],
|
||||||
|
page['group'],
|
||||||
|
'',
|
||||||
|
page['description'],
|
||||||
|
page['html'],
|
||||||
|
page['notebook'],
|
||||||
|
JSON.parse(page['dfData']),
|
||||||
|
JSON.parse(page['plotData']),
|
||||||
|
page['time'],
|
||||||
|
page['attachment'],
|
||||||
|
page['expandedPanes'],
|
||||||
|
page['sections'] ? page['sections'].map(
|
||||||
|
section => new DashboardPageSection(
|
||||||
|
section['name'],
|
||||||
|
section['plot']
|
||||||
|
)
|
||||||
|
) : []
|
||||||
|
)
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
get(query, vars: object = {}): Observable<any> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: query,
|
||||||
|
variables: vars
|
||||||
|
}).pipe(map(
|
||||||
|
result => {
|
||||||
|
if (result.errors && result.errors.length > 0) {
|
||||||
|
return result
|
||||||
|
}
|
||||||
|
return result.data
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
}
|
||||||
16
src/app/_services/authentication.service.spec.ts
Normal file
16
src/app/_services/authentication.service.spec.ts
Normal file
|
|
@ -0,0 +1,16 @@
|
||||||
|
/* tslint:disable:no-unused-variable */
|
||||||
|
|
||||||
|
import { TestBed, inject, waitForAsync } from '@angular/core/testing';
|
||||||
|
import { AuthenticationService } from './authentication.service';
|
||||||
|
|
||||||
|
describe('AuthenticationService', () => {
|
||||||
|
beforeEach(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
providers: [AuthenticationService]
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should ...', inject([AuthenticationService], (service: AuthenticationService) => {
|
||||||
|
expect(service).toBeTruthy();
|
||||||
|
}));
|
||||||
|
});
|
||||||
125
src/app/_services/authentication.service.ts
Normal file
125
src/app/_services/authentication.service.ts
Normal file
|
|
@ -0,0 +1,125 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
|
||||||
|
import { HttpClient, HttpHeaders } from '@angular/common/http'
|
||||||
|
import { Observable, BehaviorSubject, from, throwError } from 'rxjs'
|
||||||
|
import { map, catchError } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { User } from '../_models/user'
|
||||||
|
import { RoleReadNoUsers } from '../openapi'
|
||||||
|
|
||||||
|
interface AuthResponse {
|
||||||
|
access_token: string,
|
||||||
|
roles: string[]
|
||||||
|
}
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class AuthenticationService {
|
||||||
|
user = new BehaviorSubject<User>(undefined)
|
||||||
|
user$ = this.user.asObservable()
|
||||||
|
roles: RoleReadNoUsers[] = []
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private _http: HttpClient,
|
||||||
|
) {
|
||||||
|
// set token if saved in local storage
|
||||||
|
this.user.next(<User>JSON.parse(localStorage.getItem('user')))
|
||||||
|
}
|
||||||
|
|
||||||
|
isLoggedIn() : Observable<boolean> {
|
||||||
|
if (!this.user.value) {
|
||||||
|
return from([false])
|
||||||
|
}
|
||||||
|
let body = JSON.stringify({
|
||||||
|
token: this.user.value.token,
|
||||||
|
})
|
||||||
|
return this._http.post(
|
||||||
|
'/auth/isLoggedIn',
|
||||||
|
body,
|
||||||
|
{
|
||||||
|
headers: new HttpHeaders({ 'Content-Type': 'application/json' })
|
||||||
|
}
|
||||||
|
).pipe(
|
||||||
|
map(resp => true),
|
||||||
|
catchError(
|
||||||
|
err => {
|
||||||
|
const userName = this.user.value['userName']
|
||||||
|
this.user.next(undefined)
|
||||||
|
this.roles = []
|
||||||
|
localStorage.removeItem('user')
|
||||||
|
return throwError(
|
||||||
|
() => new Error('Session of user "' + userName + '" expired.')
|
||||||
|
)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
login(userName: string, password: string): Observable<boolean> {
|
||||||
|
let body = JSON.stringify({
|
||||||
|
userName: userName,
|
||||||
|
password: password
|
||||||
|
})
|
||||||
|
return this._http.post<AuthResponse>(
|
||||||
|
'/auth/login',
|
||||||
|
body,
|
||||||
|
{
|
||||||
|
headers: new HttpHeaders({ 'Content-Type': 'application/json' })
|
||||||
|
}
|
||||||
|
).pipe(map(
|
||||||
|
(response: AuthResponse) => {
|
||||||
|
// login successful if there's a jwt token in the response
|
||||||
|
let token = response.access_token
|
||||||
|
if (token) {
|
||||||
|
//const decodedToken = this.helper.decodeToken(token)
|
||||||
|
// store userName and jwt token in local storage to keep user logged in between page refreshes
|
||||||
|
localStorage.setItem('user',
|
||||||
|
JSON.stringify({
|
||||||
|
userName: userName,
|
||||||
|
token: token,
|
||||||
|
roles: response.roles,
|
||||||
|
})
|
||||||
|
)
|
||||||
|
|
||||||
|
console.log('TODO: AuthenticationService roles to be set by refreshing bootstrap')
|
||||||
|
// this.roles = response.roles
|
||||||
|
|
||||||
|
// Notify
|
||||||
|
this.user.next(new User(userName, token))
|
||||||
|
|
||||||
|
// return true to indicate successful login
|
||||||
|
return true
|
||||||
|
} else {
|
||||||
|
this.user.next(undefined)
|
||||||
|
this.roles = []
|
||||||
|
// return false to indicate failed login
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
logout(): boolean {
|
||||||
|
// XXX: not completly safe: the server might be down:
|
||||||
|
// We should actually *check* that the logout response is OK and display message
|
||||||
|
// clear token remove user from local storage to log user out
|
||||||
|
let has_token: boolean = this.user.value && !!this.user.value.token
|
||||||
|
localStorage.removeItem('user')
|
||||||
|
this.user.next(undefined)
|
||||||
|
this.roles = []
|
||||||
|
|
||||||
|
// Tell server that the user has logged out
|
||||||
|
if (has_token) {
|
||||||
|
this._http.get('/auth/logout').subscribe(response => {})
|
||||||
|
}
|
||||||
|
return has_token
|
||||||
|
}
|
||||||
|
|
||||||
|
logoutAdmin(): void {
|
||||||
|
}
|
||||||
|
|
||||||
|
isAuthorized(roles: string[]) {
|
||||||
|
// Return true if at least one role in given list matches one role of the authenticated user
|
||||||
|
if (roles.length == 0) return true
|
||||||
|
return this.roles.filter(value => -1 !== roles.indexOf(value.name)).length > 0
|
||||||
|
}
|
||||||
|
}
|
||||||
16
src/app/_services/bootstrap.service.spec.ts
Normal file
16
src/app/_services/bootstrap.service.spec.ts
Normal file
|
|
@ -0,0 +1,16 @@
|
||||||
|
/* tslint:disable:no-unused-variable */
|
||||||
|
|
||||||
|
import { TestBed, inject, waitForAsync } from '@angular/core/testing';
|
||||||
|
import { BootstrapService } from './bootstrap.service';
|
||||||
|
|
||||||
|
describe('BootstrapService', () => {
|
||||||
|
beforeEach(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
providers: [BootstrapService]
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should ...', inject([BootstrapService], (service: BootstrapService) => {
|
||||||
|
expect(service).toBeTruthy();
|
||||||
|
}));
|
||||||
|
});
|
||||||
15
src/app/_services/bootstrap.service.ts
Normal file
15
src/app/_services/bootstrap.service.ts
Normal file
|
|
@ -0,0 +1,15 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { Observable } from 'rxjs'
|
||||||
|
|
||||||
|
import { ApiService, BootstrapData } from '../openapi'
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class BootstrapService {
|
||||||
|
constructor(
|
||||||
|
private api: ApiService,
|
||||||
|
){ }
|
||||||
|
|
||||||
|
get(): Observable<BootstrapData> {
|
||||||
|
return this.api.bootstrapApiBootstrapGet()
|
||||||
|
}
|
||||||
|
}
|
||||||
72
src/app/_services/data.service.ts
Normal file
72
src/app/_services/data.service.ts
Normal file
|
|
@ -0,0 +1,72 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { HttpClient, HttpParams, HttpResponse } from '@angular/common/http'
|
||||||
|
import { Observable } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
export class MeasuresItem {
|
||||||
|
constructor(
|
||||||
|
public $uri: string,
|
||||||
|
public caption: string,
|
||||||
|
) {}
|
||||||
|
get id(): string {
|
||||||
|
return this.$uri.substr(this.$uri.lastIndexOf('/') + 1)
|
||||||
|
}
|
||||||
|
get name(): string {
|
||||||
|
return this.caption || this.id
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class MeasuresItemsList {
|
||||||
|
constructor(
|
||||||
|
public items: MeasuresItem[]
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class DataService {
|
||||||
|
constructor(private _http: HttpClient){ }
|
||||||
|
|
||||||
|
getResources(): Observable<Object[]> {
|
||||||
|
return this._http.get<Object[]>('/api/list')
|
||||||
|
}
|
||||||
|
|
||||||
|
getList(store: string): Observable<MeasuresItem[]> {
|
||||||
|
return this._http.get<MeasuresItem[]>('/api/' + store).pipe(
|
||||||
|
map(res => res.map(
|
||||||
|
item => new MeasuresItem(item['$uri'], item['caption'])
|
||||||
|
))
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
getValues(
|
||||||
|
store: string,
|
||||||
|
id: number,
|
||||||
|
value: string,
|
||||||
|
sampling?: string,
|
||||||
|
format: string = 'json',
|
||||||
|
rangeFrom?: string,
|
||||||
|
rangeTo?: string
|
||||||
|
): Observable<HttpResponse<Object>> {
|
||||||
|
let p = {}
|
||||||
|
let s = {}
|
||||||
|
p[store] = id
|
||||||
|
if (rangeFrom && rangeTo) {
|
||||||
|
p['time'] = {"$between": [rangeFrom, rangeTo]}
|
||||||
|
}
|
||||||
|
s['time'] = false
|
||||||
|
let params = new HttpParams()
|
||||||
|
.set('where', JSON.stringify(p))
|
||||||
|
.set('sort', JSON.stringify(s))
|
||||||
|
.set('resample', sampling)
|
||||||
|
.set('format', format)
|
||||||
|
// FIXME: add the name of the value to fetch
|
||||||
|
return this._http.get<Object>(
|
||||||
|
'/api/' + store + '/values/' + value,
|
||||||
|
{
|
||||||
|
params: params,
|
||||||
|
observe: 'response'
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
102
src/app/_services/geojson.service.ts
Normal file
102
src/app/_services/geojson.service.ts
Normal file
|
|
@ -0,0 +1,102 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { HttpClient, HttpHeaders, HttpResponse } from '@angular/common/http'
|
||||||
|
|
||||||
|
import { Observable, forkJoin } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { Apollo, gql } from 'apollo-angular'
|
||||||
|
|
||||||
|
import { WebsocketService } from '../_services/websocket.service'
|
||||||
|
|
||||||
|
const getLayerQuery = gql`
|
||||||
|
query mapboxStyle($store: String!) {
|
||||||
|
mapboxStyle (store: $store) {
|
||||||
|
paint
|
||||||
|
layout
|
||||||
|
attribution
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
export class MapboxStyle {
|
||||||
|
constructor(
|
||||||
|
public paint: string,
|
||||||
|
public layout: string,
|
||||||
|
public attribution: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export class MapboxDataAndStyle {
|
||||||
|
constructor(
|
||||||
|
public data: object,
|
||||||
|
public style: MapboxStyle,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class GeoJsonService {
|
||||||
|
constructor(
|
||||||
|
private _http: HttpClient,
|
||||||
|
private apollo: Apollo
|
||||||
|
) {}
|
||||||
|
|
||||||
|
getLayer(url: string, params?: object): Observable<object> {
|
||||||
|
if (!params) {
|
||||||
|
params = {}
|
||||||
|
}
|
||||||
|
return this._http.get<object>(url, {
|
||||||
|
headers: <HttpHeaders>params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
getStyle(store: string): Observable<MapboxStyle> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getLayerQuery,
|
||||||
|
variables: {
|
||||||
|
store: store
|
||||||
|
},
|
||||||
|
errorPolicy: 'all',
|
||||||
|
}).pipe(map(
|
||||||
|
result => new MapboxStyle(
|
||||||
|
result['data']['mapboxStyle']['paint'],
|
||||||
|
result['data']['mapboxStyle']['layout'],
|
||||||
|
result['data']['mapboxStyle']['attribution'],
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getAll(url: string, store: string, params?: object): Observable<MapboxDataAndStyle> {
|
||||||
|
return forkJoin([
|
||||||
|
this.getLayer(url, params),
|
||||||
|
this.getStyle(store),
|
||||||
|
]).pipe(map(
|
||||||
|
res => new MapboxDataAndStyle(res[0], res[1])
|
||||||
|
))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class LiveGeoJsonService {
|
||||||
|
messages = {}
|
||||||
|
ws: any
|
||||||
|
constructor(
|
||||||
|
private wsService: WebsocketService
|
||||||
|
) {}
|
||||||
|
|
||||||
|
connect(channel: string) {
|
||||||
|
const hostname = window.location.hostname
|
||||||
|
const port = window.location.port
|
||||||
|
let protocol = window.location.protocol == 'https:' ? 'wss:' : 'ws:'
|
||||||
|
this.wsService.connect(
|
||||||
|
protocol + '//' + hostname + ':' + port + '/gj/live/' + channel
|
||||||
|
)
|
||||||
|
return this.wsService.ws
|
||||||
|
}
|
||||||
|
|
||||||
|
disconnect() {
|
||||||
|
this.wsService.disconnect()
|
||||||
|
}
|
||||||
|
}
|
||||||
30
src/app/_services/websocket.service.ts
Normal file
30
src/app/_services/websocket.service.ts
Normal file
|
|
@ -0,0 +1,30 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { Subject, Observable, Observer } from 'rxjs'
|
||||||
|
import { webSocket, WebSocketSubject } from 'rxjs/webSocket'
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class WebsocketService {
|
||||||
|
ws: WebSocketSubject<any>
|
||||||
|
|
||||||
|
public connect(url: string, openObserver?: Subject<any>, closeObserver?: Subject<any>) {
|
||||||
|
this.ws = webSocket({
|
||||||
|
url: url,
|
||||||
|
openObserver: openObserver,
|
||||||
|
closeObserver: closeObserver
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
public disconnect() {
|
||||||
|
if (this.ws) {
|
||||||
|
this.ws.complete()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public subscribe(message: string) {
|
||||||
|
return this.ws.next('subscribe/' + message)
|
||||||
|
}
|
||||||
|
|
||||||
|
public unsubscribe(message: string) {
|
||||||
|
return this.ws.next('unsubscribe/' + message)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,6 @@
|
||||||
|
.item {
|
||||||
|
border: 1px solid grey;
|
||||||
|
margin: 0 3px;
|
||||||
|
padding: 0 2px;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
<div class='item'>
|
||||||
|
<div class='path'>
|
||||||
|
{{ file.path }}
|
||||||
|
</div>
|
||||||
|
<div class='url'>
|
||||||
|
{{ file.url }}
|
||||||
|
</div>
|
||||||
|
<div class='status'>
|
||||||
|
{{ file.status }}
|
||||||
|
</div>
|
||||||
|
<div class='store'>
|
||||||
|
{{ file.store }}
|
||||||
|
</div>
|
||||||
|
<div class='time'>
|
||||||
|
{{ file.time }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { Component, OnInit, Input,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core'
|
||||||
|
import { ActivatedRoute } from '@angular/router'
|
||||||
|
|
||||||
|
import { AdminDataService } from '../../admin-data.service'
|
||||||
|
import { AdminBasketFile } from '../data.service'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-basket-item',
|
||||||
|
templateUrl: './basket-item.component.html',
|
||||||
|
styleUrls: ['./basket-item.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class AdminBasketItemComponent implements OnInit {
|
||||||
|
constructor(
|
||||||
|
public adminDataService: AdminDataService,
|
||||||
|
private route: ActivatedRoute,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
@Input() file: AdminBasketFile
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
}
|
||||||
|
}
|
||||||
19
src/app/admin/admin-basket/admin-basket-resolver.service.ts
Normal file
19
src/app/admin/admin-basket/admin-basket-resolver.service.ts
Normal file
|
|
@ -0,0 +1,19 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { Router, Resolve, RouterStateSnapshot, ActivatedRouteSnapshot } from '@angular/router'
|
||||||
|
import { Observable, forkJoin } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { AdminBasket, AdminBasketDataService } from './data.service'
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class BasketResolver implements Resolve<object> {
|
||||||
|
constructor(
|
||||||
|
private router: Router,
|
||||||
|
private basketDataService: AdminBasketDataService,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<AdminBasket> {
|
||||||
|
var name = route.paramMap.get('name')
|
||||||
|
return this.basketDataService.getBasket(name)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,30 @@
|
||||||
|
.container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container mat-form-field {
|
||||||
|
flex: 1 1 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container form {
|
||||||
|
border: 1px solid grey;
|
||||||
|
padding: 2px 1em;
|
||||||
|
border-radius: 0.6em;
|
||||||
|
margin-bottom: 3px;
|
||||||
|
background-color: #424242;
|
||||||
|
}
|
||||||
|
|
||||||
|
.importButtonGroup {
|
||||||
|
flex: 5 1 0;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
mat-form-field.store {
|
||||||
|
width: 18em;
|
||||||
|
}
|
||||||
|
|
||||||
|
mat-form-field.status {
|
||||||
|
width: 4em;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,76 @@
|
||||||
|
<div class='container'>
|
||||||
|
<form [formGroup]="formGroup">
|
||||||
|
<mat-form-field [hidden]="is_upload_field_hidden('project')">
|
||||||
|
<mat-label>Project</mat-label>
|
||||||
|
<mat-select formControlName="project">
|
||||||
|
<mat-option
|
||||||
|
*ngFor="let item of basket.projects || adminDataService.surveyMeta.projects"
|
||||||
|
[value]="item.name">
|
||||||
|
{{ item.name }}
|
||||||
|
</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field [hidden]="is_upload_field_hidden('surveyor')">
|
||||||
|
<mat-label>Surveyor</mat-label>
|
||||||
|
<mat-select formControlName="surveyor">
|
||||||
|
<mat-option
|
||||||
|
*ngFor="let item of adminDataService.surveyMeta.surveyors"
|
||||||
|
[value]="item.name">
|
||||||
|
{{ item.name }}
|
||||||
|
</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field [hidden]="is_upload_field_hidden('equipment')">
|
||||||
|
<mat-label>Equipment</mat-label>
|
||||||
|
<mat-select formControlName="equipment">
|
||||||
|
<mat-option
|
||||||
|
*ngFor="let item of adminDataService.surveyMeta.equipments"
|
||||||
|
[value]="item.name">
|
||||||
|
{{ item.name }}
|
||||||
|
</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field class='store' [hidden]="is_upload_field_hidden('store_line_work')">
|
||||||
|
<mat-label>Store</mat-label>
|
||||||
|
<mat-select formControlName="store_line_work">
|
||||||
|
<mat-option
|
||||||
|
*ngFor="let item of adminDataService.surveyMeta.stores_line_work"
|
||||||
|
[value]="item.name">
|
||||||
|
{{ item.name }}
|
||||||
|
</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field class='store' [hidden]="is_upload_field_hidden('store_misc')">
|
||||||
|
<mat-label>Store</mat-label>
|
||||||
|
<mat-select formControlName="store_misc">
|
||||||
|
<mat-option
|
||||||
|
*ngFor="let item of adminDataService.surveyMeta.stores_misc"
|
||||||
|
[value]="item.name">
|
||||||
|
{{ item.name }}
|
||||||
|
</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field class='status' [hidden]="is_upload_field_hidden('status')">
|
||||||
|
<mat-label>Status</mat-label>
|
||||||
|
<mat-select formControlName="status">
|
||||||
|
<mat-option
|
||||||
|
*ngFor="let item of adminDataService.surveyMeta.statuses"
|
||||||
|
[value]="item">
|
||||||
|
{{ item }}
|
||||||
|
</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
|
|
||||||
|
<div class='importButtonGroup'>
|
||||||
|
<button mat-button (click)="fileInput.click()" [disabled]="!formGroup.valid">
|
||||||
|
<mat-icon>file_upload</mat-icon>
|
||||||
|
Add file
|
||||||
|
</button>
|
||||||
|
<mat-checkbox formControlName='autoImport'
|
||||||
|
matTooltip='Automatically import the content of the file in the database when its added to the basket'>
|
||||||
|
Auto import
|
||||||
|
</mat-checkbox>
|
||||||
|
</div>
|
||||||
|
<input hidden (change)="onFileUpload()" #fileInput type="file" id="file">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,115 @@
|
||||||
|
import { Component, OnInit, Input, ViewChild, ElementRef,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy, SimpleChanges, OnChanges } from '@angular/core'
|
||||||
|
import { HttpClient } from '@angular/common/http'
|
||||||
|
import { UntypedFormGroup, UntypedFormControl, Validators } from '@angular/forms'
|
||||||
|
|
||||||
|
import { MatTableDataSource } from '@angular/material/table'
|
||||||
|
|
||||||
|
import { AdminDataService } from '../../admin-data.service'
|
||||||
|
import { AdminBasketFile, AdminBasket } from '../data.service'
|
||||||
|
import { MatSnackBar } from '@angular/material/snack-bar'
|
||||||
|
import { HtmlSnackbarComponent } from '../../../custom-snackbar/custom-snackbar.component'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-basket-upload',
|
||||||
|
templateUrl: './basket-upload.component.html',
|
||||||
|
styleUrls: ['./basket-upload.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class AdminBasketUploadComponent implements OnInit, OnChanges {
|
||||||
|
constructor(
|
||||||
|
public adminDataService: AdminDataService,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
private http: HttpClient,
|
||||||
|
private snackBar: MatSnackBar,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
@ViewChild('fileInput') fileInput: ElementRef
|
||||||
|
@Input() basket: AdminBasket
|
||||||
|
@Input() dataSource: MatTableDataSource<object>
|
||||||
|
|
||||||
|
//upload_fields = ['store', 'status', 'project', 'surveyor', 'equipment']
|
||||||
|
|
||||||
|
formGroup: UntypedFormGroup = new UntypedFormGroup({})
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
let defaults = this.adminDataService.surveyMeta.defaults
|
||||||
|
this.formGroup = new UntypedFormGroup({
|
||||||
|
'store_misc': new UntypedFormControl(defaults['store_misc'], [Validators.required]),
|
||||||
|
'store_line_work': new UntypedFormControl(defaults['store_line_work'], [Validators.required]),
|
||||||
|
'status': new UntypedFormControl(defaults['status'], [Validators.required]),
|
||||||
|
'project': new UntypedFormControl(defaults['project'], [Validators.required]),
|
||||||
|
'surveyor': new UntypedFormControl(defaults['surveyor'], [Validators.required]),
|
||||||
|
'equipment': new UntypedFormControl(defaults['equipment'], [Validators.required]),
|
||||||
|
'autoImport': new UntypedFormControl(true),
|
||||||
|
})
|
||||||
|
this.setupRequired()
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnChanges(changes: SimpleChanges) {
|
||||||
|
this.setupRequired()
|
||||||
|
}
|
||||||
|
|
||||||
|
setupRequired() {
|
||||||
|
for (let field in this.formGroup.controls) {
|
||||||
|
if (this.basket.uploadFields.includes(field)) {
|
||||||
|
this.formGroup.controls[field].setValidators(Validators.required)
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.formGroup.controls[field].clearValidators()
|
||||||
|
}
|
||||||
|
this.formGroup.controls[field].updateValueAndValidity({onlySelf: true})
|
||||||
|
}
|
||||||
|
this.formGroup.updateValueAndValidity({onlySelf: true})
|
||||||
|
}
|
||||||
|
|
||||||
|
onFileUpload() {
|
||||||
|
const formData = new FormData()
|
||||||
|
formData.append('file', <File>this.fileInput.nativeElement.files[0])
|
||||||
|
let fg = this.formGroup.getRawValue()
|
||||||
|
for (let field in fg) {
|
||||||
|
if (this.basket.uploadFields.indexOf(field) != -1) {
|
||||||
|
formData.append(field, fg[field])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
formData.append('autoImport', this.formGroup.get('autoImport').value)
|
||||||
|
this.http.post('upload/basket/' + this.basket.name, formData).subscribe(
|
||||||
|
resp => {
|
||||||
|
let importResult = resp['import_result']
|
||||||
|
const importTime = resp['time'] || (importResult && importResult['time'])
|
||||||
|
const fileImport = new AdminBasketFile(
|
||||||
|
resp['id'],
|
||||||
|
resp['dir'],
|
||||||
|
resp['name'],
|
||||||
|
resp['url'],
|
||||||
|
resp['md5'],
|
||||||
|
importTime && new Date(importTime),
|
||||||
|
resp['comment'],
|
||||||
|
resp['status'],
|
||||||
|
resp['store'],
|
||||||
|
resp['project'],
|
||||||
|
resp['surveyor'],
|
||||||
|
resp['equipment'],
|
||||||
|
)
|
||||||
|
this.dataSource.data.push(fileImport)
|
||||||
|
this.dataSource.data = this.dataSource.data
|
||||||
|
let msg = 'File ' + fileImport.name + ' added to basket'
|
||||||
|
if (importResult) {
|
||||||
|
this.snackBar.openFromComponent(HtmlSnackbarComponent, {
|
||||||
|
data: importResult
|
||||||
|
//duration: 3000
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.snackBar.open(msg, 'Close')
|
||||||
|
}
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
is_upload_field_hidden(fname: string) {
|
||||||
|
return this.basket.uploadFields.indexOf(fname)==-1
|
||||||
|
}
|
||||||
|
}
|
||||||
66
src/app/admin/admin-basket/basket.component.css
Normal file
66
src/app/admin/admin-basket/basket.component.css
Normal file
|
|
@ -0,0 +1,66 @@
|
||||||
|
h1 {
|
||||||
|
margin-top: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
gisaf-admin-basket-upload {
|
||||||
|
flex: 1 1 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter button {
|
||||||
|
min-width: 1em!important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cdk-column-delete, .cdk-column-import {
|
||||||
|
max-width: 4em;
|
||||||
|
width: 3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cdk-column-name>span {
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.even {
|
||||||
|
background-color: #f5f5f512;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tools {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tools .filter {
|
||||||
|
width: 10em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tools .upload {
|
||||||
|
flex: 1 1 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
:host ::ng-deep th.mat-mdc-header-cell, :host ::ng-deep td.mat-mdc-cell, :host ::ng-deep td.mat-mdc-footer-cell {
|
||||||
|
padding: 0 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
:host ::ng-deep td.mat-mdc-cell {
|
||||||
|
border-bottom-style: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
table.content {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-delete, .mat-column-import {
|
||||||
|
width: 3em;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
th.mat-mdc-header-cell:first-of-type, td.mat-mdc-cell:first-of-type, td.mat-mdc-footer-cell:first-of-type {
|
||||||
|
padding-left: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
th.mat-mdc-header-cell:last-of-type, td.mat-mdc-cell:last-of-type, td.mat-mdc-footer-cell:last-of-type {
|
||||||
|
padding-right: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
td .mat-mdc-button {
|
||||||
|
min-width: inherit ! important;
|
||||||
|
}
|
||||||
107
src/app/admin/admin-basket/basket.component.html
Normal file
107
src/app/admin/admin-basket/basket.component.html
Normal file
|
|
@ -0,0 +1,107 @@
|
||||||
|
<div fxFlexFill fxLayout='column'>
|
||||||
|
<h1>Basket: {{ basket.name }}</h1>
|
||||||
|
<div class='tools'>
|
||||||
|
<mat-form-field class='filter'>
|
||||||
|
<mat-label>Filter table</mat-label>
|
||||||
|
<input matInput
|
||||||
|
(input)="applyFilter()"
|
||||||
|
matTooltip="Filter the items of the basket from the table"
|
||||||
|
[(ngModel)]="filterText"/>
|
||||||
|
<button mat-button matSuffix mat-icon-button
|
||||||
|
*ngIf="filterText"
|
||||||
|
aria-label="Clear"
|
||||||
|
(click)="filterText='';applyFilter()"
|
||||||
|
>
|
||||||
|
<mat-icon>close</mat-icon>
|
||||||
|
</button>
|
||||||
|
</mat-form-field>
|
||||||
|
<gisaf-admin-basket-upload [basket]='basket' [dataSource]='dataSource'>
|
||||||
|
</gisaf-admin-basket-upload>
|
||||||
|
</div>
|
||||||
|
<table mat-table matSort [dataSource]="dataSource" class='content'>
|
||||||
|
<ng-container matColumnDef="delete">
|
||||||
|
<th mat-header-cell *matHeaderCellDef>
|
||||||
|
<form [formGroup]="unlockDeleteFormGroup">
|
||||||
|
<mat-checkbox formControlName='canDelete' matTooltip='Unlock delete buttons'>
|
||||||
|
</mat-checkbox>
|
||||||
|
</form>
|
||||||
|
</th>
|
||||||
|
<td mat-cell *matCellDef="let item">
|
||||||
|
<button mat-button (click)="deleteItem(item)" matTooltip="Delete"
|
||||||
|
[disabled]="!unlockDeleteFormGroup.controls['canDelete'].value">
|
||||||
|
<mat-icon aria-label="delete">delete</mat-icon>
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="import">
|
||||||
|
<th mat-header-cell *matHeaderCellDef>Import</th>
|
||||||
|
<td mat-cell *matCellDef="let item">
|
||||||
|
<button mat-button (click)="importItem(item, $event.ctrlKey)"
|
||||||
|
matTooltip="Import to the database. Press 'Control' key for a dry run (no actual change will happen)"
|
||||||
|
>
|
||||||
|
<mat-icon aria-label="import">input</mat-icon>
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="name">
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>Name</th>
|
||||||
|
<td mat-cell *matCellDef="let item">
|
||||||
|
<span (click)="download(item)" [title]="item.dir">{{ item.name }}</span>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="store">
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>Store</th>
|
||||||
|
<td mat-cell *matCellDef="let item">{{ item.store }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="time">
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>Import time</th>
|
||||||
|
<td mat-cell *matCellDef="let item">{{ isDate(item.time) ? (item.time | date:'dd/MM/yyyy, HH:mm:ss') : 'never' }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="url">
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>URL</th>
|
||||||
|
<td mat-cell *matCellDef="let item">{{ item.url }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="status">
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>Status</th>
|
||||||
|
<td mat-cell *matCellDef="let item">{{ item.status }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="project">
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>Project</th>
|
||||||
|
<td mat-cell *matCellDef="let item">{{ item.project }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="surveyor">
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>Surveyor</th>
|
||||||
|
<td mat-cell *matCellDef="let item">{{ item.surveyor }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="equipment">
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>Equipment</th>
|
||||||
|
<td mat-cell *matCellDef="let item">{{ item.equipment }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<tr mat-header-row *matHeaderRowDef="getColumns();sticky:true"></tr>
|
||||||
|
<tr mat-row [ngClass]="{even: even}"
|
||||||
|
*matRowDef="let row; let even = even; columns:getColumns()"
|
||||||
|
></tr>
|
||||||
|
</table>
|
||||||
|
<!--
|
||||||
|
<gisaf-admin-basket-item [file]='file' *ngFor='let file of basket.file'>
|
||||||
|
</gisaf-admin-basket-item>
|
||||||
|
-->
|
||||||
|
<mat-paginator
|
||||||
|
class="paginator"
|
||||||
|
[pageSizeOptions]="[10, 20, 50, 100]"
|
||||||
|
[pageIndex]='0'
|
||||||
|
[pageSize]='10'
|
||||||
|
showFirstLastButtons
|
||||||
|
>
|
||||||
|
</mat-paginator>
|
||||||
|
</div>
|
||||||
107
src/app/admin/admin-basket/basket.component.ts
Normal file
107
src/app/admin/admin-basket/basket.component.ts
Normal file
|
|
@ -0,0 +1,107 @@
|
||||||
|
import { Component, OnInit, Input, ViewChild, ElementRef,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core'
|
||||||
|
import { ActivatedRoute } from '@angular/router'
|
||||||
|
import { UntypedFormGroup, UntypedFormControl } from '@angular/forms'
|
||||||
|
|
||||||
|
import { SelectionModel } from '@angular/cdk/collections'
|
||||||
|
import { MatPaginator } from '@angular/material/paginator'
|
||||||
|
import { MatSnackBar } from '@angular/material/snack-bar'
|
||||||
|
import { MatSort } from '@angular/material/sort'
|
||||||
|
import { MatTableDataSource } from '@angular/material/table'
|
||||||
|
|
||||||
|
import { AdminDataService } from '../admin-data.service'
|
||||||
|
import { AdminBasketDataService, AdminBasket, AdminBasketFile } from './data.service'
|
||||||
|
import { HtmlSnackbarComponent } from '../../custom-snackbar/custom-snackbar.component'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-basket',
|
||||||
|
templateUrl: './basket.component.html',
|
||||||
|
styleUrls: ['./basket.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class AdminBasketComponent implements OnInit {
|
||||||
|
constructor(
|
||||||
|
public adminDataService: AdminDataService,
|
||||||
|
public adminBasketDataService: AdminBasketDataService,
|
||||||
|
private route: ActivatedRoute,
|
||||||
|
private snackBar: MatSnackBar,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
basket: AdminBasket
|
||||||
|
dataSource: MatTableDataSource<object>
|
||||||
|
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator
|
||||||
|
@ViewChild(MatSort, {static: true}) sort: MatSort
|
||||||
|
selection = new SelectionModel(true, [])
|
||||||
|
unlockDeleteFormGroup: UntypedFormGroup = new UntypedFormGroup({})
|
||||||
|
columns: string[] = [
|
||||||
|
'name',
|
||||||
|
'status',
|
||||||
|
'time',
|
||||||
|
'store',
|
||||||
|
'project',
|
||||||
|
'surveyor',
|
||||||
|
'equipment',
|
||||||
|
'import',
|
||||||
|
'delete',
|
||||||
|
]
|
||||||
|
filterText: string
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.route.data.subscribe(
|
||||||
|
(basket: object) => {
|
||||||
|
this.basket = basket['basket']
|
||||||
|
this.dataSource = new MatTableDataSource(this.basket.files)
|
||||||
|
this.dataSource.sort = this.sort
|
||||||
|
this.dataSource.paginator = this.paginator
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
this.unlockDeleteFormGroup = new UntypedFormGroup({
|
||||||
|
'canDelete': new UntypedFormControl(),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
getColumns() {
|
||||||
|
return this.columns.filter(
|
||||||
|
col => this.basket.columns.indexOf(col) != -1
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
applyFilter() {
|
||||||
|
this.dataSource.filter = this.filterText.trim().toLowerCase()
|
||||||
|
}
|
||||||
|
|
||||||
|
download(item: AdminBasketFile) {
|
||||||
|
window.open('/download/basket/' + this.basket.name + '/' + item.id + '/' + item.name)
|
||||||
|
}
|
||||||
|
|
||||||
|
importItem(item: AdminBasketFile, dryRun: boolean) {
|
||||||
|
this.adminBasketDataService.importItem(this.basket.name, item.id, dryRun).subscribe(
|
||||||
|
resp => {
|
||||||
|
this.basket.files.find(row => row.id == item.id).time = new Date(resp.time)
|
||||||
|
this.snackBar.openFromComponent(HtmlSnackbarComponent, {
|
||||||
|
data: resp,
|
||||||
|
//duration: 3000
|
||||||
|
})
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteItem(item: AdminBasketFile) {
|
||||||
|
this.adminBasketDataService.deleteItem(this.basket.name, item.id).subscribe(
|
||||||
|
id => {
|
||||||
|
let dsi = this.dataSource.data.findIndex(fi => fi['id'] == id)
|
||||||
|
this.dataSource.data.splice(dsi, 1)
|
||||||
|
// Force Angular change detection (??)
|
||||||
|
this.dataSource.data = this.dataSource.data
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
isDate(val: any) {
|
||||||
|
return val instanceof Date && isFinite(<any>val)
|
||||||
|
}
|
||||||
|
}
|
||||||
223
src/app/admin/admin-basket/data.service.ts
Normal file
223
src/app/admin/admin-basket/data.service.ts
Normal file
|
|
@ -0,0 +1,223 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
|
||||||
|
import { Observable } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { Apollo, gql } from 'apollo-angular'
|
||||||
|
|
||||||
|
import { Project } from '../admin-data.service'
|
||||||
|
|
||||||
|
export class AdminBasketFile {
|
||||||
|
constructor(
|
||||||
|
public id: number,
|
||||||
|
public dir: string,
|
||||||
|
public name: string,
|
||||||
|
public url: string,
|
||||||
|
public md5: string,
|
||||||
|
public time: Date,
|
||||||
|
public comment: string,
|
||||||
|
public status: string,
|
||||||
|
public store: string,
|
||||||
|
public project: string,
|
||||||
|
public surveyor: string,
|
||||||
|
public equipment: string,
|
||||||
|
public import_result?: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class AdminBasket {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public files?: AdminBasketFile[],
|
||||||
|
public columns?: string[],
|
||||||
|
public uploadFields?: string[],
|
||||||
|
public projects?: Project[],
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class BasketImportResult {
|
||||||
|
constructor(
|
||||||
|
public time: Date,
|
||||||
|
public message: string,
|
||||||
|
public details?: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class AdminBasketUploadFieldData {
|
||||||
|
constructor(
|
||||||
|
public stores: string[],
|
||||||
|
public statuses: string[],
|
||||||
|
public projects: string[],
|
||||||
|
public surveyors: string[],
|
||||||
|
public equipments: string[],
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
const getAdminBasketsQuery = gql`
|
||||||
|
query admin_baskets {
|
||||||
|
admin_baskets {
|
||||||
|
name
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const getAdminBasketUploadFieldDataQuery = gql`
|
||||||
|
query admin_basket_upload_field_data {
|
||||||
|
admin_basket_upload_field_data {
|
||||||
|
store
|
||||||
|
status
|
||||||
|
project
|
||||||
|
surveyor
|
||||||
|
equipment
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const getAdminBasketQuery = gql`
|
||||||
|
query admin_basket ($name: String!) {
|
||||||
|
admin_basket (name: $name) {
|
||||||
|
name
|
||||||
|
files {
|
||||||
|
id
|
||||||
|
name
|
||||||
|
dir
|
||||||
|
url
|
||||||
|
md5
|
||||||
|
time
|
||||||
|
comment
|
||||||
|
status
|
||||||
|
store
|
||||||
|
project
|
||||||
|
surveyor
|
||||||
|
equipment
|
||||||
|
}
|
||||||
|
columns
|
||||||
|
uploadFields
|
||||||
|
projects
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const deleteAdminBasketItemMutation = gql`
|
||||||
|
mutation deleteBasketItem ($basket: String!, $id: Int!) {
|
||||||
|
deleteBasketItem (basket: $basket, id: $id) {
|
||||||
|
result
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const importAdminBasketItemMutation = gql`
|
||||||
|
mutation importBasketItem ($basket: String!, $id: Int!, $dryRun: Boolean) {
|
||||||
|
importBasketItem (basket: $basket, id: $id, dryRun: $dryRun) {
|
||||||
|
result {
|
||||||
|
message
|
||||||
|
time
|
||||||
|
details
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class AdminBasketDataService {
|
||||||
|
constructor(
|
||||||
|
private apollo: Apollo,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
getBaskets(): Observable<AdminBasket[]> {
|
||||||
|
// Get the list a basket names
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getAdminBasketsQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['admin_baskets'].map(
|
||||||
|
(data: object) => new AdminBasket(
|
||||||
|
data['name'],
|
||||||
|
)
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getBasketUploadFieldData(): Observable<AdminBasketUploadFieldData> {
|
||||||
|
// Get the list a basket names
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getAdminBasketUploadFieldDataQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['admin_basket_upload_field_data'].map(
|
||||||
|
(data: object) => new AdminBasketUploadFieldData(
|
||||||
|
data['store'],
|
||||||
|
data['status'],
|
||||||
|
data['project'],
|
||||||
|
data['surveyor'],
|
||||||
|
data['equipment'],
|
||||||
|
)
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getBasket(name: string): Observable<AdminBasket> {
|
||||||
|
// Get all info and content of a basket
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getAdminBasketQuery,
|
||||||
|
variables: {
|
||||||
|
name: name
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => {
|
||||||
|
let data = res['data']['admin_basket']
|
||||||
|
return new AdminBasket(
|
||||||
|
data['name'],
|
||||||
|
data['files'].map(file => new AdminBasketFile(
|
||||||
|
file['id'],
|
||||||
|
file['dir'],
|
||||||
|
file['name'],
|
||||||
|
file['url'],
|
||||||
|
file['md5'],
|
||||||
|
new Date(file['time']),
|
||||||
|
file['comment'],
|
||||||
|
file['status'],
|
||||||
|
file['store'],
|
||||||
|
file['project'],
|
||||||
|
file['surveyor'],
|
||||||
|
file['equipment'],
|
||||||
|
)),
|
||||||
|
data['columns'],
|
||||||
|
data['uploadFields'],
|
||||||
|
// XXX: the proejct id isn't actually used in the UI,
|
||||||
|
// but required in class definition
|
||||||
|
data['projects'] && data['projects'].map(
|
||||||
|
(projectName: string) => new Project(undefined, projectName)
|
||||||
|
),
|
||||||
|
)
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
importItem(basket: string, id: number, dryRun: boolean=false): Observable<BasketImportResult> {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: importAdminBasketItemMutation,
|
||||||
|
variables: {
|
||||||
|
basket: basket,
|
||||||
|
id: id,
|
||||||
|
dryRun: dryRun
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
resp => new BasketImportResult(
|
||||||
|
resp['data']['importBasketItem']['result']['time'],
|
||||||
|
resp['data']['importBasketItem']['result']['message'],
|
||||||
|
JSON.parse(resp['data']['importBasketItem']['result']['details']),
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteItem(basket: string, id: number) {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: deleteAdminBasketItemMutation,
|
||||||
|
variables: {
|
||||||
|
basket: basket,
|
||||||
|
id: id,
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
resp => resp['data']['deleteBasketItem']['result']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
}
|
||||||
125
src/app/admin/admin-data.service.ts
Normal file
125
src/app/admin/admin-data.service.ts
Normal file
|
|
@ -0,0 +1,125 @@
|
||||||
|
import { Injectable, Input } from '@angular/core'
|
||||||
|
import { Observable } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { Apollo, gql } from 'apollo-angular'
|
||||||
|
|
||||||
|
import { Store } from './admin-manage/data.service'
|
||||||
|
|
||||||
|
export class Project {
|
||||||
|
constructor(
|
||||||
|
public id: number,
|
||||||
|
public name: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Surveyor {
|
||||||
|
constructor(
|
||||||
|
public id: number,
|
||||||
|
public name: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Equipment {
|
||||||
|
constructor(
|
||||||
|
public id: number,
|
||||||
|
public name: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class SurveyMeta {
|
||||||
|
constructor(
|
||||||
|
public projects: Project[],
|
||||||
|
public surveyors: Surveyor[],
|
||||||
|
public equipments: Equipment[],
|
||||||
|
public statuses: string[],
|
||||||
|
public stores_misc: Store[],
|
||||||
|
public stores_line_work: Store[],
|
||||||
|
public defaults: Object
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
const getSurveyMeta = gql`
|
||||||
|
query survey_meta {
|
||||||
|
survey_meta {
|
||||||
|
projects {
|
||||||
|
id
|
||||||
|
name
|
||||||
|
}
|
||||||
|
surveyors {
|
||||||
|
id
|
||||||
|
name
|
||||||
|
}
|
||||||
|
equipments {
|
||||||
|
id
|
||||||
|
name
|
||||||
|
}
|
||||||
|
stores_misc {
|
||||||
|
name
|
||||||
|
}
|
||||||
|
stores_line_work {
|
||||||
|
name
|
||||||
|
}
|
||||||
|
statuses
|
||||||
|
default
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const admin_models_menu_bar_query = gql`
|
||||||
|
query admin_models_menu_bar {
|
||||||
|
admin_models_menu_bar{
|
||||||
|
name
|
||||||
|
items{
|
||||||
|
name
|
||||||
|
module
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}`
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class AdminDataService {
|
||||||
|
surveyMeta: SurveyMeta
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private apollo: Apollo,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
getModelsMenuBar(): Observable<object[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: admin_models_menu_bar_query
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['admin_models_menu_bar_query']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getSurveyMeta(): Observable<SurveyMeta> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getSurveyMeta,
|
||||||
|
}).pipe(map(
|
||||||
|
resp => {
|
||||||
|
let data = resp['data']['survey_meta']
|
||||||
|
this.surveyMeta = new SurveyMeta(
|
||||||
|
data['projects'].map(
|
||||||
|
item => new Project(item['id'], item['name'])
|
||||||
|
).sort((i, j) => i.name > j.name ? 1 : -1),
|
||||||
|
data['surveyors'].map(
|
||||||
|
item => new Surveyor(item['id'], item['name'])
|
||||||
|
).sort((i, j) => i.name > j.name ? 1 : -1),
|
||||||
|
data['equipments'].map(
|
||||||
|
item => new Equipment(item['id'], item['name'])
|
||||||
|
).sort((i, j) => i.name > j.name ? 1 : -1),
|
||||||
|
data['statuses'],
|
||||||
|
data['stores_misc'].map(
|
||||||
|
item => new Store(item['name'])
|
||||||
|
).sort((i, j) => i.name > j.name ? 1 : -1),
|
||||||
|
data['stores_line_work'].map(
|
||||||
|
item => new Store(item['name'])
|
||||||
|
).sort((i, j) => i.name > j.name ? 1 : -1),
|
||||||
|
JSON.parse(data['default']),
|
||||||
|
)
|
||||||
|
return this.surveyMeta
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
}
|
||||||
31
src/app/admin/admin-detail/admin-detail-resolver.service.ts
Normal file
31
src/app/admin/admin-detail/admin-detail-resolver.service.ts
Normal file
|
|
@ -0,0 +1,31 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { Router, Resolve, RouterStateSnapshot, ActivatedRouteSnapshot } from '@angular/router'
|
||||||
|
import { Observable } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { ModelDataService } from '../../_services/apollo.service'
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class DetailResolver implements Resolve<object> {
|
||||||
|
constructor(
|
||||||
|
private modelDataService: ModelDataService,
|
||||||
|
private router: Router
|
||||||
|
) {}
|
||||||
|
|
||||||
|
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<object> {
|
||||||
|
var pk = route.paramMap.get('pk')
|
||||||
|
var modelName = route.paramMap.get('modelName')
|
||||||
|
|
||||||
|
return this.modelDataService.resolveItemData(modelName, pk).pipe(map(
|
||||||
|
res => {
|
||||||
|
if (!res) {
|
||||||
|
this.router.navigate(['/admin', modelName])
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
return res
|
||||||
|
}
|
||||||
|
}
|
||||||
|
))
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
58
src/app/admin/admin-detail/admin-detail.component.css
Normal file
58
src/app/admin/admin-detail/admin-detail.component.css
Normal file
|
|
@ -0,0 +1,58 @@
|
||||||
|
/*@import '../node_modules/@angular/material/prebuilt-themes/purple-green.css';*/
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card {
|
||||||
|
margin: 0 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card .form {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card .form>* {
|
||||||
|
/*display: block;*/
|
||||||
|
margin: 0 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
textarea {
|
||||||
|
height: 5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card-footer {
|
||||||
|
text-align: center;
|
||||||
|
padding-bottom: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card-footer > button {
|
||||||
|
margin: 0 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
.form {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form>div>* {
|
||||||
|
margin: 0 1em;
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
|
mat-form-field.field-symbol input {
|
||||||
|
font-family: GisafSymbols;
|
||||||
|
font-size: 200%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
mat-form-field.field-symbol {
|
||||||
|
width: 4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
mat-form-field.field-id {
|
||||||
|
width: 4em;
|
||||||
|
}
|
||||||
52
src/app/admin/admin-detail/admin-detail.component.html
Normal file
52
src/app/admin/admin-detail/admin-detail.component.html
Normal file
|
|
@ -0,0 +1,52 @@
|
||||||
|
<mat-card appearance="outlined">
|
||||||
|
<mat-card-title>
|
||||||
|
{{ modelName }} #{{ pk }}
|
||||||
|
</mat-card-title>
|
||||||
|
<mat-card-content *ngIf="model">
|
||||||
|
<div [formGroup]="formGroup" class='form'>
|
||||||
|
<ng-container *ngFor="let field of fields">
|
||||||
|
<mat-checkbox
|
||||||
|
matInput
|
||||||
|
*ngIf="field.isCheckbox"
|
||||||
|
[formControlName]="field.name"
|
||||||
|
>
|
||||||
|
{{ field.name }}
|
||||||
|
</mat-checkbox>
|
||||||
|
<mat-form-field *ngIf="field.isTextArea">
|
||||||
|
<mat-label>{{ field.name }}</mat-label>
|
||||||
|
<textarea matInput
|
||||||
|
[formControlName]="field.name"
|
||||||
|
>
|
||||||
|
</textarea>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field
|
||||||
|
*ngIf="!field.isTextArea && !field.isCheckbox"
|
||||||
|
[class]="'field-' + field.name"
|
||||||
|
>
|
||||||
|
<mat-label>{{ field.name }}</mat-label>
|
||||||
|
<input matInput
|
||||||
|
[type]="field.inputType"
|
||||||
|
[formControlName]="field.name"
|
||||||
|
/>
|
||||||
|
</mat-form-field>
|
||||||
|
</ng-container>
|
||||||
|
<ng-container *ngFor="let join of model.inspection.joins">
|
||||||
|
<join-select
|
||||||
|
[join]='join'
|
||||||
|
[formGroup]='formGroup'
|
||||||
|
>
|
||||||
|
</join-select>
|
||||||
|
</ng-container>
|
||||||
|
</div>
|
||||||
|
</mat-card-content>
|
||||||
|
<mat-card-footer>
|
||||||
|
<button mat-raised-button color='primary' (click)="submit()" [disabled]="!formGroup.valid">
|
||||||
|
<mat-icon aria-label="submit">done</mat-icon>
|
||||||
|
Submit
|
||||||
|
</button>
|
||||||
|
<button mat-raised-button routerLink="..">
|
||||||
|
<mat-icon aria-label="cancel">cancel</mat-icon>
|
||||||
|
Cancel
|
||||||
|
</button>
|
||||||
|
</mat-card-footer>
|
||||||
|
</mat-card>
|
||||||
88
src/app/admin/admin-detail/admin-detail.component.ts
Normal file
88
src/app/admin/admin-detail/admin-detail.component.ts
Normal file
|
|
@ -0,0 +1,88 @@
|
||||||
|
import { Component, Input, ViewChild, OnInit, HostBinding,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core'
|
||||||
|
import { ActivatedRoute, ParamMap, Router } from '@angular/router'
|
||||||
|
import { UntypedFormGroup, FormControl } from '@angular/forms'
|
||||||
|
|
||||||
|
import { fadeInAnimation } from '../../animations'
|
||||||
|
import {
|
||||||
|
ModelDataService,
|
||||||
|
Model,
|
||||||
|
FieldIntrospection,
|
||||||
|
} from '../../_services/apollo.service'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-detail',
|
||||||
|
templateUrl: './admin-detail.component.html',
|
||||||
|
styleUrls: ['./admin-detail.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
animations: [ fadeInAnimation ]
|
||||||
|
})
|
||||||
|
|
||||||
|
export class AdminDetailComponent implements OnInit {
|
||||||
|
/*
|
||||||
|
@HostBinding('@fadeInAnimation') fadeInAnimation = true
|
||||||
|
@HostBinding('style.display') display = 'block'
|
||||||
|
@HostBinding('style.position') position = 'absolute'
|
||||||
|
*/
|
||||||
|
|
||||||
|
@Input() modelName: string
|
||||||
|
@Input() pk: string
|
||||||
|
model: Model
|
||||||
|
item: object
|
||||||
|
formGroup: UntypedFormGroup
|
||||||
|
fields: FieldIntrospection[]
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
protected route: ActivatedRoute,
|
||||||
|
protected router: Router,
|
||||||
|
public modelDataService: ModelDataService,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
// Set an empty formGroup
|
||||||
|
this.formGroup = new UntypedFormGroup({})
|
||||||
|
// In case i'm initiated with the route resolver:
|
||||||
|
// TODO: use secondary route
|
||||||
|
this.route.data.subscribe(
|
||||||
|
(data) => {
|
||||||
|
if (Object.keys(data).length != 0) {
|
||||||
|
this.route.params.subscribe(
|
||||||
|
params => {
|
||||||
|
let item = data['item']
|
||||||
|
// FIXME (with secondary route)
|
||||||
|
/*
|
||||||
|
this.setItem(
|
||||||
|
params['modelName'],
|
||||||
|
item['model'],
|
||||||
|
item['item'][params['modelName']][0],
|
||||||
|
)
|
||||||
|
*/
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
setItem(modelName, model, item) {
|
||||||
|
// Fill me with the provided model and item data
|
||||||
|
// Can be called from the init and route resolver or manually (map, etc)
|
||||||
|
this.formGroup = new UntypedFormGroup({})
|
||||||
|
this.modelName = modelName
|
||||||
|
this.item = item
|
||||||
|
this.model = model
|
||||||
|
// Get the form fields and build the formGroup controls
|
||||||
|
this.fields = this.model.getFormFields(this.formGroup, item)
|
||||||
|
this.pk = this.item[this.model.introspection.pkFields()[0].name]
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
|
||||||
|
submit() {
|
||||||
|
this.modelDataService.mutate(this.model.introspection, this.formGroup.value).subscribe(
|
||||||
|
res => {
|
||||||
|
console.log('TODO: submit', res)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
40
src/app/admin/admin-detail/admin-detail.module.ts
Normal file
40
src/app/admin/admin-detail/admin-detail.module.ts
Normal file
|
|
@ -0,0 +1,40 @@
|
||||||
|
import { NgModule } from '@angular/core'
|
||||||
|
import { CommonModule } from '@angular/common'
|
||||||
|
import { ReactiveFormsModule } from '@angular/forms'
|
||||||
|
|
||||||
|
import { MatButtonModule } from '@angular/material/button'
|
||||||
|
import { MatCardModule } from '@angular/material/card'
|
||||||
|
import { MatCheckboxModule } from '@angular/material/checkbox'
|
||||||
|
import { MatFormFieldModule } from '@angular/material/form-field'
|
||||||
|
import { MatIconModule } from '@angular/material/icon'
|
||||||
|
import { MatInputModule } from '@angular/material/input'
|
||||||
|
import { MatSelectModule } from '@angular/material/select'
|
||||||
|
|
||||||
|
import { JoinSelectComponent } from './join-select.component'
|
||||||
|
|
||||||
|
import { AdminDetailComponent } from './admin-detail.component'
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
imports: [
|
||||||
|
CommonModule,
|
||||||
|
|
||||||
|
ReactiveFormsModule,
|
||||||
|
|
||||||
|
MatButtonModule,
|
||||||
|
MatCardModule,
|
||||||
|
MatCheckboxModule,
|
||||||
|
MatFormFieldModule,
|
||||||
|
MatIconModule,
|
||||||
|
MatInputModule,
|
||||||
|
MatSelectModule,
|
||||||
|
],
|
||||||
|
declarations: [
|
||||||
|
AdminDetailComponent,
|
||||||
|
JoinSelectComponent
|
||||||
|
],
|
||||||
|
exports: [
|
||||||
|
AdminDetailComponent,
|
||||||
|
JoinSelectComponent
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class AdminDetailModule { }
|
||||||
14
src/app/admin/admin-detail/join-select.component.html
Normal file
14
src/app/admin/admin-detail/join-select.component.html
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
<mat-form-field [formGroup]="formGroup">
|
||||||
|
<mat-label>{{ join.name }}</mat-label>
|
||||||
|
<mat-select
|
||||||
|
[title]="join.name"
|
||||||
|
[formControlName]="join.name"
|
||||||
|
>
|
||||||
|
<mat-option
|
||||||
|
*ngFor='let choice of choices'
|
||||||
|
[value]="choice['id']"
|
||||||
|
>
|
||||||
|
{{ choice['name'] }}
|
||||||
|
</mat-option>
|
||||||
|
</mat-select>
|
||||||
|
</mat-form-field>
|
||||||
42
src/app/admin/admin-detail/join-select.component.ts
Normal file
42
src/app/admin/admin-detail/join-select.component.ts
Normal file
|
|
@ -0,0 +1,42 @@
|
||||||
|
import { Component, Input, ViewChild, OnInit,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core'
|
||||||
|
|
||||||
|
import { UntypedFormGroup, FormControl } from '@angular/forms'
|
||||||
|
|
||||||
|
import { map, switchMap } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { gql } from 'apollo-angular'
|
||||||
|
|
||||||
|
import { ModelDataService, JoinField } from '../../_services/apollo.service'
|
||||||
|
import { Relation } from '../models'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'join-select',
|
||||||
|
templateUrl: './join-select.component.html',
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class JoinSelectComponent implements OnInit {
|
||||||
|
@Input() join: JoinField
|
||||||
|
@Input() formGroup: UntypedFormGroup
|
||||||
|
choices: object[]
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
protected modelDataService: ModelDataService,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
var modelName = this.join.target.split('.').pop()
|
||||||
|
let query = gql`query model {${modelName}{name id}}`
|
||||||
|
this.modelDataService.get(query).pipe(map(data => {
|
||||||
|
return data[modelName]
|
||||||
|
})).subscribe(data => {
|
||||||
|
this.choices = data.map(
|
||||||
|
item => {
|
||||||
|
return {id: +item['id'], name: item['name']}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
1
src/app/admin/admin-home/admin-home.component.css
Normal file
1
src/app/admin/admin-home/admin-home.component.css
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
/*@import '../node_modules/@angular/material/prebuilt-themes/purple-green.css';*/
|
||||||
9
src/app/admin/admin-home/admin-home.component.html
Normal file
9
src/app/admin/admin-home/admin-home.component.html
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
<mat-card appearance="outlined">
|
||||||
|
<mat-card-title>Gisaf admin/control center</mat-card-title>
|
||||||
|
<mat-card-content>
|
||||||
|
<p>
|
||||||
|
This is the adminstration area: baskets for importing files,
|
||||||
|
tools for the management of the database...
|
||||||
|
</p>
|
||||||
|
</mat-card-content>
|
||||||
|
</mat-card>
|
||||||
9
src/app/admin/admin-home/admin-home.component.ts
Normal file
9
src/app/admin/admin-home/admin-home.component.ts
Normal file
|
|
@ -0,0 +1,9 @@
|
||||||
|
import { Component } from '@angular/core'
|
||||||
|
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-home',
|
||||||
|
templateUrl: './admin-home.component.html',
|
||||||
|
styleUrls: ['./admin-home.component.css']
|
||||||
|
})
|
||||||
|
export class AdminHomeComponent {}
|
||||||
77
src/app/admin/admin-list/admin-list.component.css
Normal file
77
src/app/admin/admin-list/admin-list.component.css
Normal file
|
|
@ -0,0 +1,77 @@
|
||||||
|
/*@import '../node_modules/@angular/material/prebuilt-themes/purple-green.css';*/
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card {
|
||||||
|
margin: 0 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
width: 100%
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-mdc-header-cell {
|
||||||
|
font-weight: 800;
|
||||||
|
font-size: 14px;
|
||||||
|
background-color: #2f2f2f;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.mat-mdc-cell:first-child, th.mat-mdc-header-cell:first-child {
|
||||||
|
padding-left: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.mat-mdc-cell, th.mat-mdc-header-cell {
|
||||||
|
border-left: 1px solid rgba(255,255,255,.12);
|
||||||
|
padding: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.mat-mdc-cell:last-child, th.mat-mdc-header-cell:last-child {
|
||||||
|
border-right: 1px solid #8080802b;
|
||||||
|
padding-right: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
tr.mat-mdc-header-row {
|
||||||
|
height: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
tr.mat-mdc-row {
|
||||||
|
height: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cdk-column-select {
|
||||||
|
width: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cdk-column-actions {
|
||||||
|
width: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.mat-column-symbol>div {
|
||||||
|
font-family: GisafSymbols;
|
||||||
|
font-size: 200%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card-footer {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card-footer .actions {
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card-footer .actions {
|
||||||
|
margin: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*TODO(mdc-migration): The following rule targets internal classes of card that may no longer apply for the MDC version.*/
|
||||||
|
mat-card-footer .filter {
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.mat-mdc-cell>div {
|
||||||
|
max-height: 5em;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
79
src/app/admin/admin-list/admin-list.component.html
Normal file
79
src/app/admin/admin-list/admin-list.component.html
Normal file
|
|
@ -0,0 +1,79 @@
|
||||||
|
<mat-card appearance="outlined">
|
||||||
|
<mat-card-title *ngIf="model">{{ model.name }}</mat-card-title>
|
||||||
|
<mat-card-content>
|
||||||
|
<table mat-table
|
||||||
|
matSort
|
||||||
|
*ngIf="model"
|
||||||
|
[dataSource]="dataSource"
|
||||||
|
>
|
||||||
|
<ng-container matColumnDef="select">
|
||||||
|
<th mat-header-cell *matHeaderCellDef>
|
||||||
|
<mat-checkbox (change)="$event ? masterToggle() : null"
|
||||||
|
[checked]="(selection.selected.length > 0) && isAllSelected()"
|
||||||
|
[indeterminate]="(selection.selected.length > 0) && !isAllSelected()">
|
||||||
|
</mat-checkbox>
|
||||||
|
</th>
|
||||||
|
<td mat-cell *matCellDef="let row">
|
||||||
|
<mat-checkbox (click)="$event.stopPropagation()"
|
||||||
|
(change)="$event ? selection.toggle(row) : null"
|
||||||
|
[checked]="selection.isSelected(row)">
|
||||||
|
</mat-checkbox>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
<ng-container matColumnDef="actions">
|
||||||
|
<th mat-header-cell *matHeaderCellDef>
|
||||||
|
</th>
|
||||||
|
<td mat-cell *matCellDef="let row">
|
||||||
|
<button mat-icon-button
|
||||||
|
(click)='showDetail(row)'>
|
||||||
|
<mat-icon aria-label="edit">edit</mat-icon>
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
<ng-container
|
||||||
|
*ngFor="let colName of model.columns()"
|
||||||
|
[matColumnDef]="colName">
|
||||||
|
<th mat-header-cell mat-sort-header *matHeaderCellDef>{{ colName }}</th>
|
||||||
|
<td mat-cell *matCellDef="let element">
|
||||||
|
<div>
|
||||||
|
{{ element[colName] }}
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<tr mat-header-row *matHeaderRowDef="allColumns; sticky: true"></tr>
|
||||||
|
<tr mat-row *matRowDef="let row; columns: allColumns;"
|
||||||
|
(click)="showDetail(row)"></tr>
|
||||||
|
</table>
|
||||||
|
</mat-card-content>
|
||||||
|
<mat-card-footer>
|
||||||
|
<div class="actions">
|
||||||
|
<button
|
||||||
|
mat-button
|
||||||
|
(click)='add()'
|
||||||
|
>
|
||||||
|
<mat-icon aria-label="add">add</mat-icon>
|
||||||
|
Add new
|
||||||
|
</button>
|
||||||
|
<button
|
||||||
|
mat-button
|
||||||
|
(click)='deleteSelected()'
|
||||||
|
>
|
||||||
|
<mat-icon aria-label="delete">delete</mat-icon>
|
||||||
|
Delete selected
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<mat-form-field class="filter">
|
||||||
|
<mat-label>Filter</mat-label>
|
||||||
|
<input matInput (keyup)="applyFilter($event.target)">
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-paginator
|
||||||
|
class="paginator"
|
||||||
|
[pageSizeOptions]="[10, 20, 50, 100]"
|
||||||
|
[pageIndex]='0'
|
||||||
|
[pageSize]='10'
|
||||||
|
showFirstLastButtons
|
||||||
|
>
|
||||||
|
</mat-paginator>
|
||||||
|
</mat-card-footer>
|
||||||
|
</mat-card>
|
||||||
25
src/app/admin/admin-list/admin-list.component.spec.ts
Normal file
25
src/app/admin/admin-list/admin-list.component.spec.ts
Normal file
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { AdminListComponent } from './admin-list.component';
|
||||||
|
|
||||||
|
describe('AdminListComponent', () => {
|
||||||
|
let component: AdminListComponent;
|
||||||
|
let fixture: ComponentFixture<AdminListComponent>;
|
||||||
|
|
||||||
|
beforeEach(waitForAsync(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ AdminListComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(AdminListComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
121
src/app/admin/admin-list/admin-list.component.ts
Normal file
121
src/app/admin/admin-list/admin-list.component.ts
Normal file
|
|
@ -0,0 +1,121 @@
|
||||||
|
import { Component, Input, ViewChild, OnInit, HostBinding,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core'
|
||||||
|
import { ActivatedRoute, ParamMap, Router } from '@angular/router'
|
||||||
|
|
||||||
|
import { SelectionModel } from '@angular/cdk/collections'
|
||||||
|
import { MatPaginator } from '@angular/material/paginator'
|
||||||
|
import { MatSnackBar } from '@angular/material/snack-bar'
|
||||||
|
import { MatSort } from '@angular/material/sort'
|
||||||
|
import { MatTableDataSource } from '@angular/material/table'
|
||||||
|
|
||||||
|
import { map, switchMap } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { slideInDownAnimation } from '../../animations'
|
||||||
|
|
||||||
|
import { ModelDataService, ModelIntrospection, FieldIntrospection } from '../../_services/apollo.service'
|
||||||
|
//import { TableDataSource } from './datasource'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-list',
|
||||||
|
templateUrl: './admin-list.component.html',
|
||||||
|
styleUrls: ['./admin-list.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
animations: [ slideInDownAnimation ]
|
||||||
|
})
|
||||||
|
export class AdminListComponent implements OnInit {
|
||||||
|
/*
|
||||||
|
@HostBinding('@slideInDownAnimation') slideInDownAnimation = true
|
||||||
|
@HostBinding('style.display') display = 'block'
|
||||||
|
@HostBinding('style.position') position = 'absolute'
|
||||||
|
*/
|
||||||
|
|
||||||
|
dataSource: MatTableDataSource<object>
|
||||||
|
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator
|
||||||
|
@ViewChild(MatSort, {static: true}) sort: MatSort
|
||||||
|
model: ModelIntrospection
|
||||||
|
allColumns: string[] = []
|
||||||
|
pageIndex: number
|
||||||
|
pageSize: number
|
||||||
|
selection = new SelectionModel(true, [])
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
protected route: ActivatedRoute,
|
||||||
|
protected router: Router,
|
||||||
|
protected dataService: ModelDataService,
|
||||||
|
public snackBar: MatSnackBar,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.route.params.subscribe(params => {
|
||||||
|
this.setModel(params['modelName'])
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
setModel(modelName) {
|
||||||
|
if (!modelName) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.dataService.introspect(modelName).subscribe(
|
||||||
|
res => {
|
||||||
|
this.model = res
|
||||||
|
this.allColumns = ['select', 'actions'].concat(this.model.columns())
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
getData() {
|
||||||
|
this.dataService.all(this.model).pipe(map(data => {
|
||||||
|
return data[this.model.name]
|
||||||
|
})).subscribe({
|
||||||
|
next: data => {
|
||||||
|
if (data) {
|
||||||
|
this.dataSource = new MatTableDataSource(data)
|
||||||
|
this.dataSource.paginator = this.paginator
|
||||||
|
this.dataSource.sort = this.sort
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.dataSource = new MatTableDataSource([])
|
||||||
|
}
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
},
|
||||||
|
error: err => {
|
||||||
|
this.snackBar.open(err, 'close', {duration: 3000})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Whether the number of selected elements matches the total number of rows. */
|
||||||
|
isAllSelected() {
|
||||||
|
const numSelected = this.selection.selected.length
|
||||||
|
const numRows = this.dataSource.data.length
|
||||||
|
return numSelected === numRows
|
||||||
|
}
|
||||||
|
|
||||||
|
/** Selects all rows if they are not all selected; otherwise clear selection. */
|
||||||
|
masterToggle() {
|
||||||
|
this.isAllSelected() ?
|
||||||
|
this.selection.clear() :
|
||||||
|
this.dataSource.data.forEach(row => this.selection.select(row))
|
||||||
|
}
|
||||||
|
|
||||||
|
applyFilter(target: EventTarget) {
|
||||||
|
let filterValue = target['value']
|
||||||
|
this.dataSource.filter = filterValue.trim().toLowerCase()
|
||||||
|
|
||||||
|
if (this.dataSource.paginator) {
|
||||||
|
this.dataSource.paginator.firstPage()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
showDetail(item) {
|
||||||
|
this.router.navigate(['/admin/model', this.model.name, item[this.model.pkFields()[0].name]])
|
||||||
|
}
|
||||||
|
|
||||||
|
add() {
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteSelected() {
|
||||||
|
}
|
||||||
|
}
|
||||||
404
src/app/admin/admin-manage/access/access-data.service.ts
Normal file
404
src/app/admin/admin-manage/access/access-data.service.ts
Normal file
|
|
@ -0,0 +1,404 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
|
||||||
|
import { Observable, BehaviorSubject, forkJoin } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { Apollo, gql } from 'apollo-angular'
|
||||||
|
|
||||||
|
import { MatDialog } from '@angular/material/dialog'
|
||||||
|
|
||||||
|
import { GisafAdminAccessRoleDialogComponent } from './role-dialog.component'
|
||||||
|
import { GisafAdminAccessUserDialogComponent } from './user-dialog.component'
|
||||||
|
import { Role, User, ACL } from './models'
|
||||||
|
|
||||||
|
|
||||||
|
const getUsersQuery = gql`
|
||||||
|
query users {
|
||||||
|
users {
|
||||||
|
id
|
||||||
|
name
|
||||||
|
email
|
||||||
|
active
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const getRolesQuery = gql`
|
||||||
|
query getRoles {
|
||||||
|
roles {
|
||||||
|
id
|
||||||
|
name
|
||||||
|
description
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const getAclsQuery = gql`
|
||||||
|
query acls {
|
||||||
|
acls {
|
||||||
|
user_id
|
||||||
|
role_ids
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const addUserRoleMutation = gql`
|
||||||
|
mutation addUserRole(
|
||||||
|
$user_id: Int!,
|
||||||
|
$role_id: Int!,
|
||||||
|
) {
|
||||||
|
addUserRole(
|
||||||
|
user_id: $user_id,
|
||||||
|
role_id: $role_id,
|
||||||
|
) {
|
||||||
|
result
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const deleteUserRoleMutation = gql`
|
||||||
|
mutation deleteUserRole(
|
||||||
|
$user_id: Int!,
|
||||||
|
$role_id: Int!,
|
||||||
|
) {
|
||||||
|
deleteUserRole(
|
||||||
|
user_id: $user_id,
|
||||||
|
role_id: $role_id,
|
||||||
|
) {
|
||||||
|
result
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const deleteUserMutation = gql`
|
||||||
|
mutation deleteUser(
|
||||||
|
$id: Int!,
|
||||||
|
) {
|
||||||
|
deleteUser(
|
||||||
|
id: $id,
|
||||||
|
) {
|
||||||
|
id
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const deleteRoleMutation = gql`
|
||||||
|
mutation deleteRole(
|
||||||
|
$id: Int!,
|
||||||
|
) {
|
||||||
|
deleteRole(
|
||||||
|
id: $id,
|
||||||
|
) {
|
||||||
|
id
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const saveRoleMutation = gql`
|
||||||
|
mutation saveRole(
|
||||||
|
$id: Int,
|
||||||
|
$name: String!,
|
||||||
|
$description: String!
|
||||||
|
) {
|
||||||
|
saveRole (
|
||||||
|
id: $id,
|
||||||
|
name: $name,
|
||||||
|
description: $description
|
||||||
|
) {
|
||||||
|
id
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const saveUserMutation = gql`
|
||||||
|
mutation saveUser(
|
||||||
|
$id: Int,
|
||||||
|
$name: String!,
|
||||||
|
$email: String!,
|
||||||
|
$password: String,
|
||||||
|
$active: Boolean!,
|
||||||
|
) {
|
||||||
|
saveUser (
|
||||||
|
id: $id,
|
||||||
|
name: $name,
|
||||||
|
email: $email,
|
||||||
|
active: $active,
|
||||||
|
password: $password
|
||||||
|
) {
|
||||||
|
id
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class AdminManageAccessDataService {
|
||||||
|
constructor(
|
||||||
|
private apollo: Apollo,
|
||||||
|
public dialog: MatDialog,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
private _users = new BehaviorSubject<User[]>([])
|
||||||
|
private _roles = new BehaviorSubject<Role[]>([])
|
||||||
|
private _acls = new BehaviorSubject<ACL[]>([])
|
||||||
|
users$: Observable<User[]> = this._users.asObservable()
|
||||||
|
roles$: Observable<Role[]> = this._roles.asObservable()
|
||||||
|
acls$: Observable<ACL[]> = this._acls.asObservable()
|
||||||
|
|
||||||
|
init() {
|
||||||
|
this.getAllAccessData().subscribe()
|
||||||
|
this.acls$.subscribe(
|
||||||
|
(acls: ACL[]) => {
|
||||||
|
/*
|
||||||
|
acls.forEach(
|
||||||
|
(acl: ACL) => {
|
||||||
|
// Scan all the list of users, should be an object
|
||||||
|
let user: User = this._users.value.find(u=>u.id==acl.user_id)
|
||||||
|
user._roles.next(acl.role_ids.map(
|
||||||
|
role_id => this._roles.value.find(
|
||||||
|
(role: Role) => role.id == role_id
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
this._users.value.forEach(
|
||||||
|
(user: User) => {
|
||||||
|
let acl: ACL = acls.find(a => a.user_id == user.id)
|
||||||
|
// Scan all the list of roles, should be an object (optimize)
|
||||||
|
if (acl && acl.role_ids) {
|
||||||
|
user._roles.next(acl.role_ids.map(
|
||||||
|
role_id => this._roles.value.find(
|
||||||
|
(role: Role) => role.id == role_id
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
user._roles.next([])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
getUsers(): Observable<User[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getUsersQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res =>
|
||||||
|
res['data']['users'].map(
|
||||||
|
// Really create an object because User has roles in its constructor
|
||||||
|
(item: object) => new User(
|
||||||
|
item['id'],
|
||||||
|
item['name'],
|
||||||
|
item['email'],
|
||||||
|
item['active'],
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
getRoles(): Observable<Role[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getRolesQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res =>
|
||||||
|
res['data']['roles'].map(
|
||||||
|
(item: object) => item as Role
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
getACLs(): Observable<ACL[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getAclsQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res =>
|
||||||
|
res['data']['acls'].map(
|
||||||
|
(item: object) => item as ACL
|
||||||
|
)
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
getAllAccessData(): Observable<void> {
|
||||||
|
return forkJoin([
|
||||||
|
this.getUsers(),
|
||||||
|
this.getRoles(),
|
||||||
|
this.getACLs(),
|
||||||
|
]).pipe(map(
|
||||||
|
([users, roles, acls]) => {
|
||||||
|
this._users.next(users)
|
||||||
|
this._roles.next(roles)
|
||||||
|
this._acls.next(acls)
|
||||||
|
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getUserRoles(user: User): Role[] {
|
||||||
|
let roles = this._acls.value.find(
|
||||||
|
userRole => userRole.user_id === user.id
|
||||||
|
)
|
||||||
|
if (!roles) {
|
||||||
|
return []
|
||||||
|
}
|
||||||
|
return roles.role_ids.map(
|
||||||
|
role_id => this._roles.value.find(
|
||||||
|
role => role.id == role_id
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
addUserRole(user: User, role: Role) {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: addUserRoleMutation,
|
||||||
|
variables: {
|
||||||
|
user_id: user.id,
|
||||||
|
role_id: role.id
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => {
|
||||||
|
this.getACLs().subscribe(
|
||||||
|
res => this._acls.next(res)
|
||||||
|
)
|
||||||
|
return res['data']['addUserRole']
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteUserRole(user: User, role: Role) {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: deleteUserRoleMutation,
|
||||||
|
variables: {
|
||||||
|
user_id: user.id,
|
||||||
|
role_id: role.id
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => {
|
||||||
|
this.getACLs().subscribe(
|
||||||
|
res => this._acls.next(res)
|
||||||
|
)
|
||||||
|
return res['data']['deleteUserRole']
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteUser(user: User) {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: deleteUserMutation,
|
||||||
|
variables: {
|
||||||
|
id: user.id,
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['deleteUser']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteRole(role: Role) {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: deleteRoleMutation,
|
||||||
|
variables: {
|
||||||
|
id: role.id,
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['deleteRole']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
saveRole(role: Role) {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: saveRoleMutation,
|
||||||
|
variables: {
|
||||||
|
id: role.id,
|
||||||
|
name: role.name,
|
||||||
|
description: role.description
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['saveRole']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
saveUser(user: User) {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: saveUserMutation,
|
||||||
|
variables: {
|
||||||
|
id: user.id,
|
||||||
|
name: user.name,
|
||||||
|
email: user.email,
|
||||||
|
active: user.active,
|
||||||
|
password: user.password,
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['saveUser']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
openUserDialog(user?: User) {
|
||||||
|
const dialogRef = this.dialog.open(GisafAdminAccessUserDialogComponent, {
|
||||||
|
width: '75%',
|
||||||
|
data: {
|
||||||
|
'user': user
|
||||||
|
}
|
||||||
|
})
|
||||||
|
dialogRef.afterClosed().subscribe(
|
||||||
|
(user: User) => user &&
|
||||||
|
this.saveUser(
|
||||||
|
user
|
||||||
|
).subscribe({
|
||||||
|
next: (name: string) => {
|
||||||
|
if (user) {
|
||||||
|
// Update
|
||||||
|
//let row = this.dataSource.data.findIndex(c=>c['name'] == name)
|
||||||
|
//this.dataSource.data[row] = user
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// New
|
||||||
|
this.saveUser(user)
|
||||||
|
}
|
||||||
|
this.init()
|
||||||
|
},
|
||||||
|
error: err => {
|
||||||
|
// Popup the dialog again, the error is catched by Apollo
|
||||||
|
this.openUserDialog(user)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
openRoleDialog(role?: Role) {
|
||||||
|
const dialogRef = this.dialog.open(GisafAdminAccessRoleDialogComponent, {
|
||||||
|
width: '75%',
|
||||||
|
data: {
|
||||||
|
'role': role
|
||||||
|
}
|
||||||
|
})
|
||||||
|
dialogRef.afterClosed().subscribe(
|
||||||
|
(role: Role) => role &&
|
||||||
|
this.saveRole(
|
||||||
|
role
|
||||||
|
).subscribe({
|
||||||
|
next: (name: string) => {
|
||||||
|
if (role) {
|
||||||
|
// Update
|
||||||
|
//let row = this.dataSource.data.findIndex(c=>c['name'] == name)
|
||||||
|
//this.dataSource.data[row] = role
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// New
|
||||||
|
this.saveRole(role)
|
||||||
|
}
|
||||||
|
this.init()
|
||||||
|
},
|
||||||
|
error: err => {
|
||||||
|
// Popup the dialog again, the error is catched by Apollo
|
||||||
|
this.openRoleDialog(role)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
31
src/app/admin/admin-manage/access/models.ts
Normal file
31
src/app/admin/admin-manage/access/models.ts
Normal file
|
|
@ -0,0 +1,31 @@
|
||||||
|
import { Observable, BehaviorSubject } from 'rxjs'
|
||||||
|
|
||||||
|
export class User {
|
||||||
|
_roles: BehaviorSubject<Role[]>
|
||||||
|
roles$: Observable<Role[]>
|
||||||
|
constructor(
|
||||||
|
public id: number,
|
||||||
|
public name: string,
|
||||||
|
public email: string,
|
||||||
|
public active: boolean,
|
||||||
|
public password?: string,
|
||||||
|
) {
|
||||||
|
this._roles = new BehaviorSubject<Role[]>([])
|
||||||
|
this.roles$ = this._roles.asObservable()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Role {
|
||||||
|
constructor(
|
||||||
|
public id: number,
|
||||||
|
public name: string,
|
||||||
|
public description: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class ACL {
|
||||||
|
constructor(
|
||||||
|
public user_id: number,
|
||||||
|
public role_ids: number[],
|
||||||
|
) {}
|
||||||
|
}
|
||||||
32
src/app/admin/admin-manage/access/role-dialog.component.html
Normal file
32
src/app/admin/admin-manage/access/role-dialog.component.html
Normal file
|
|
@ -0,0 +1,32 @@
|
||||||
|
<h1 mat-dialog-title>Edit role</h1>
|
||||||
|
|
||||||
|
<div [formGroup]="formGroup" class='form'>
|
||||||
|
<div mat-dialog-content fxLayout="column">
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>id</mat-label>
|
||||||
|
<input matInput
|
||||||
|
formControlName="id"
|
||||||
|
class="id"
|
||||||
|
[readonly]='true'
|
||||||
|
>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Name</mat-label>
|
||||||
|
<input matInput
|
||||||
|
formControlName="name"
|
||||||
|
class="name"
|
||||||
|
>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Description</mat-label>
|
||||||
|
<input matInput
|
||||||
|
formControlName="description"
|
||||||
|
class="description"
|
||||||
|
>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div mat-dialog-actions>
|
||||||
|
<button mat-button (click)="dialogRef.close()">Cancel</button>
|
||||||
|
<button mat-button (click)="save()" type="submit" [disabled]="!formGroup.valid">Ok</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
34
src/app/admin/admin-manage/access/role-dialog.component.ts
Normal file
34
src/app/admin/admin-manage/access/role-dialog.component.ts
Normal file
|
|
@ -0,0 +1,34 @@
|
||||||
|
import { Component, OnInit, Inject } from '@angular/core'
|
||||||
|
import { UntypedFormGroup, UntypedFormControl, Validators } from '@angular/forms'
|
||||||
|
|
||||||
|
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'
|
||||||
|
|
||||||
|
import { Role } from './models'
|
||||||
|
|
||||||
|
export interface DialogData {
|
||||||
|
role: Role
|
||||||
|
}
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-access-role-dialog',
|
||||||
|
templateUrl: 'role-dialog.component.html',
|
||||||
|
styleUrls: ['role-dialog.component.css'],
|
||||||
|
})
|
||||||
|
export class GisafAdminAccessRoleDialogComponent implements OnInit {
|
||||||
|
formGroup: UntypedFormGroup = new UntypedFormGroup({})
|
||||||
|
constructor(
|
||||||
|
public dialogRef: MatDialogRef<GisafAdminAccessRoleDialogComponent>,
|
||||||
|
@Inject(MAT_DIALOG_DATA) public data: DialogData
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
let role: Role = this.data['role'] || new Role(undefined, '', '')
|
||||||
|
this.formGroup.addControl('id', new UntypedFormControl(role.id))
|
||||||
|
this.formGroup.addControl('name', new UntypedFormControl(role.name, [Validators.required]))
|
||||||
|
this.formGroup.addControl('description', new UntypedFormControl(role.description, [Validators.required]))
|
||||||
|
}
|
||||||
|
|
||||||
|
save() {
|
||||||
|
this.dialogRef.close(this.formGroup.value);
|
||||||
|
}
|
||||||
|
}
|
||||||
26
src/app/admin/admin-manage/access/role.component.css
Normal file
26
src/app/admin/admin-manage/access/role.component.css
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
.container {
|
||||||
|
border: 1px solid grey;
|
||||||
|
border-radius: 5px;
|
||||||
|
margin: 2px;
|
||||||
|
background-color: #424242;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 1px;
|
||||||
|
font-size: 110%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleBar .mat-mdc-button {
|
||||||
|
line-height: inherit;
|
||||||
|
min-width: inherit ! important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleBar .mat-mdc-button .mat-icon{
|
||||||
|
height: inherit;
|
||||||
|
width: inherit;
|
||||||
|
font-size: inherit;
|
||||||
|
vertical-align: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.name {
|
||||||
|
padding: 2px 3px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
13
src/app/admin/admin-manage/access/role.component.html
Normal file
13
src/app/admin/admin-manage/access/role.component.html
Normal file
|
|
@ -0,0 +1,13 @@
|
||||||
|
<div class='container' cdkDrag [cdkDragData]="{'role': role}">
|
||||||
|
<div class='titleBar' fxLayout>
|
||||||
|
<div class='name' [title]='role.description' fxFlex>
|
||||||
|
{{ role.name }}
|
||||||
|
</div>
|
||||||
|
<button mat-button fxFlex='0 1 0%' matTooltip='Edit role' (click)='edit()'>
|
||||||
|
<mat-icon>edit</mat-icon>
|
||||||
|
</button>
|
||||||
|
<button mat-button fxFlex='0 1 0%' matTooltip='Delete role' (click)='delete()'>
|
||||||
|
<mat-icon>delete</mat-icon>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
31
src/app/admin/admin-manage/access/role.component.ts
Normal file
31
src/app/admin/admin-manage/access/role.component.ts
Normal file
|
|
@ -0,0 +1,31 @@
|
||||||
|
import { Component, ChangeDetectorRef, ChangeDetectionStrategy, Input } from '@angular/core'
|
||||||
|
|
||||||
|
import { Role } from './models'
|
||||||
|
import { AdminManageAccessDataService } from './access-data.service'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-role',
|
||||||
|
templateUrl: './role.component.html',
|
||||||
|
styleUrls: ['./role.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class AdminRoleComponent {
|
||||||
|
@Input() role: Role
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
public adminManageAccessDataService: AdminManageAccessDataService,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
delete() {
|
||||||
|
this.adminManageAccessDataService.deleteRole(this.role).subscribe(
|
||||||
|
res => {
|
||||||
|
this.adminManageAccessDataService.init()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
edit() {
|
||||||
|
this.adminManageAccessDataService.openRoleDialog(this.role)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
.mat-mdc-dialog-content {
|
||||||
|
height: 20em;
|
||||||
|
}
|
||||||
47
src/app/admin/admin-manage/access/user-dialog.component.html
Normal file
47
src/app/admin/admin-manage/access/user-dialog.component.html
Normal file
|
|
@ -0,0 +1,47 @@
|
||||||
|
<h1 mat-dialog-title>Edit user</h1>
|
||||||
|
|
||||||
|
<div [formGroup]="formGroup" class='form'>
|
||||||
|
<div mat-dialog-content fxLayout="column">
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>id</mat-label>
|
||||||
|
<input matInput
|
||||||
|
readonly=true
|
||||||
|
formControlName="id"
|
||||||
|
class="id"
|
||||||
|
>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Name</mat-label>
|
||||||
|
<input matInput
|
||||||
|
formControlName="name"
|
||||||
|
class="name"
|
||||||
|
>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Password</mat-label>
|
||||||
|
<input matInput
|
||||||
|
type="password"
|
||||||
|
formControlName="password"
|
||||||
|
class="password"
|
||||||
|
>
|
||||||
|
</mat-form-field>
|
||||||
|
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Email</mat-label>
|
||||||
|
<input matInput
|
||||||
|
formControlName="email"
|
||||||
|
class="email"
|
||||||
|
>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-checkbox matInput
|
||||||
|
formControlName="active"
|
||||||
|
class="active"
|
||||||
|
>
|
||||||
|
Active
|
||||||
|
</mat-checkbox>
|
||||||
|
</div>
|
||||||
|
<div mat-dialog-actions>
|
||||||
|
<button mat-button (click)="dialogRef.close()">Cancel</button>
|
||||||
|
<button mat-button (click)="save()" type="submit" [disabled]="!formGroup.valid">Ok</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
37
src/app/admin/admin-manage/access/user-dialog.component.ts
Normal file
37
src/app/admin/admin-manage/access/user-dialog.component.ts
Normal file
|
|
@ -0,0 +1,37 @@
|
||||||
|
import { Component, OnInit, Inject } from '@angular/core'
|
||||||
|
import { UntypedFormGroup, UntypedFormControl, Validators } from '@angular/forms'
|
||||||
|
|
||||||
|
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'
|
||||||
|
|
||||||
|
import { User } from './models'
|
||||||
|
|
||||||
|
export interface DialogData {
|
||||||
|
user: User
|
||||||
|
}
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-access-user-dialog',
|
||||||
|
templateUrl: 'user-dialog.component.html',
|
||||||
|
styleUrls: ['user-dialog.component.css'],
|
||||||
|
})
|
||||||
|
export class GisafAdminAccessUserDialogComponent implements OnInit {
|
||||||
|
formGroup: UntypedFormGroup
|
||||||
|
constructor(
|
||||||
|
public dialogRef: MatDialogRef<GisafAdminAccessUserDialogComponent>,
|
||||||
|
@Inject(MAT_DIALOG_DATA) public data: DialogData
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
let user: User = this.data['user'] || new User(undefined, '', '', true)
|
||||||
|
this.formGroup = new UntypedFormGroup({})
|
||||||
|
this.formGroup.addControl('id', new UntypedFormControl(user.id))
|
||||||
|
this.formGroup.addControl('name', new UntypedFormControl(user.name, [Validators.required]))
|
||||||
|
this.formGroup.addControl('email', new UntypedFormControl(user.email, [Validators.required, Validators.email]))
|
||||||
|
this.formGroup.addControl('password', new UntypedFormControl(''))
|
||||||
|
this.formGroup.addControl('active', new UntypedFormControl(user.active))
|
||||||
|
}
|
||||||
|
|
||||||
|
save() {
|
||||||
|
this.dialogRef.close(this.formGroup.value);
|
||||||
|
}
|
||||||
|
}
|
||||||
49
src/app/admin/admin-manage/access/user.component.css
Normal file
49
src/app/admin/admin-manage/access/user.component.css
Normal file
|
|
@ -0,0 +1,49 @@
|
||||||
|
.container {
|
||||||
|
border: 1px solid grey;
|
||||||
|
border-radius: 5px;
|
||||||
|
margin: 1px;
|
||||||
|
background-color: #424242;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inactive .name {
|
||||||
|
color: #ffc0c0;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleBar .mat-mdc-button {
|
||||||
|
line-height: inherit;
|
||||||
|
min-width: inherit ! important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleBar .mat-mdc-button .mat-icon{
|
||||||
|
height: inherit;
|
||||||
|
width: inherit;
|
||||||
|
font-size: inherit;
|
||||||
|
vertical-align: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.name {
|
||||||
|
font-weight: 600;
|
||||||
|
padding-left: 2px;
|
||||||
|
padding-bottom: 0.5em;
|
||||||
|
font-size: 115%;
|
||||||
|
text-align: center;
|
||||||
|
color: #aaccbf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chips {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cdk-drop-list {
|
||||||
|
min-height: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-mdc-standard-chip.mat-mdcc-chip-with-trailing-icon {
|
||||||
|
min-height: 1.5em;
|
||||||
|
padding-right: 3px;
|
||||||
|
padding-left: 8px;
|
||||||
|
}
|
||||||
26
src/app/admin/admin-manage/access/user.component.html
Normal file
26
src/app/admin/admin-manage/access/user.component.html
Normal file
|
|
@ -0,0 +1,26 @@
|
||||||
|
<div class='container' [class]="user.active?'active':'inactive'"
|
||||||
|
cdkDropList
|
||||||
|
(cdkDropListDropped)="drop($event)"
|
||||||
|
>
|
||||||
|
<div class='titleBar' fxLayout>
|
||||||
|
<div class='name' [title]='user.email' fxFlex>
|
||||||
|
{{ user.name }}
|
||||||
|
</div>
|
||||||
|
<button mat-button fxFlex='0 1 0%' matTooltip='Edit user' (click)='edit()'>
|
||||||
|
<mat-icon>edit</mat-icon>
|
||||||
|
</button>
|
||||||
|
<button mat-button fxFlex='0 1 0%' matTooltip='Delete user' (click)='delete()'>
|
||||||
|
<mat-icon>delete</mat-icon>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<mat-chip-listbox #chipList>
|
||||||
|
<mat-chip-option *ngFor='let role of user.roles$ | async'
|
||||||
|
[selectable]='true'
|
||||||
|
[removable]='true'
|
||||||
|
(removed)="removeUserRole(user, role)"
|
||||||
|
>
|
||||||
|
{{ role.name }}
|
||||||
|
<mat-icon matChipRemove>cancel</mat-icon>
|
||||||
|
</mat-chip-option>
|
||||||
|
</mat-chip-listbox>
|
||||||
|
</div>
|
||||||
40
src/app/admin/admin-manage/access/user.component.ts
Normal file
40
src/app/admin/admin-manage/access/user.component.ts
Normal file
|
|
@ -0,0 +1,40 @@
|
||||||
|
import { Component, ChangeDetectorRef, ChangeDetectionStrategy, Input } from '@angular/core'
|
||||||
|
import {COMMA, ENTER} from '@angular/cdk/keycodes'
|
||||||
|
|
||||||
|
import { User, Role } from './models'
|
||||||
|
import { AdminManageAccessDataService } from './access-data.service'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-user',
|
||||||
|
templateUrl: './user.component.html',
|
||||||
|
styleUrls: ['./user.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class AdminUserComponent {
|
||||||
|
@Input() user: User
|
||||||
|
readonly separatorKeysCodes: number[] = [ENTER, COMMA];
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
public adminManageAccessDataService: AdminManageAccessDataService,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
drop(evt) {
|
||||||
|
// Assign a role to the user
|
||||||
|
this.adminManageAccessDataService.addUserRole(this.user, evt.item.data['role']).subscribe()
|
||||||
|
}
|
||||||
|
|
||||||
|
removeUserRole(user: User, role: Role) {
|
||||||
|
this.adminManageAccessDataService.deleteUserRole(user, role).subscribe()
|
||||||
|
}
|
||||||
|
|
||||||
|
delete() {
|
||||||
|
this.adminManageAccessDataService.deleteUser(this.user).subscribe(
|
||||||
|
res => this.adminManageAccessDataService.init()
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
edit() {
|
||||||
|
this.adminManageAccessDataService.openUserDialog(this.user)
|
||||||
|
}
|
||||||
|
}
|
||||||
24
src/app/admin/admin-manage/access/users-roles.component.css
Normal file
24
src/app/admin/admin-manage/access/users-roles.component.css
Normal file
|
|
@ -0,0 +1,24 @@
|
||||||
|
h1 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.deleteItem {
|
||||||
|
height: 2em;
|
||||||
|
border: 1px solid grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
.users {
|
||||||
|
padding: 0 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
gisaf-admin-user {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.roles {
|
||||||
|
padding: 0 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
gisaf-admin-role {
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
30
src/app/admin/admin-manage/access/users-roles.component.html
Normal file
30
src/app/admin/admin-manage/access/users-roles.component.html
Normal file
|
|
@ -0,0 +1,30 @@
|
||||||
|
<div cdkDropListGroup fxFlexFill>
|
||||||
|
<h1>Users and roles</h1>
|
||||||
|
<div fxLayout='row'>
|
||||||
|
<div class='users' fxFlex='3 1 0'>
|
||||||
|
<div>Users</div>
|
||||||
|
<button mat-raised-button (click)='adminManageAccessDataService.openUserDialog()'>New user...</button>
|
||||||
|
<div id='gisaf-admin-users'>
|
||||||
|
<gisaf-admin-user
|
||||||
|
*ngFor="let user of adminManageAccessDataService.users$ | async"
|
||||||
|
[user]="user"
|
||||||
|
>
|
||||||
|
</gisaf-admin-user>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class='roles' fxFlex>
|
||||||
|
<div>Roles (<span style='font-style: italic;'>Drag to users</span>)
|
||||||
|
</div>
|
||||||
|
<button mat-raised-button (click)='adminManageAccessDataService.openRoleDialog()'>New role...</button>
|
||||||
|
|
||||||
|
<div cdkDropList cdkDropListSortingDisabled id='gisaf-admin-roles'>
|
||||||
|
<gisaf-admin-role
|
||||||
|
*ngFor="let role of adminManageAccessDataService.roles$ | async"
|
||||||
|
[role]="role"
|
||||||
|
>
|
||||||
|
</gisaf-admin-role>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
22
src/app/admin/admin-manage/access/users-roles.component.ts
Normal file
22
src/app/admin/admin-manage/access/users-roles.component.ts
Normal file
|
|
@ -0,0 +1,22 @@
|
||||||
|
import { Component, OnInit, ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core'
|
||||||
|
import { ActivatedRoute } from '@angular/router'
|
||||||
|
|
||||||
|
import { AdminManageAccessDataService } from './access-data.service'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-users-roles',
|
||||||
|
templateUrl: './users-roles.component.html',
|
||||||
|
styleUrls: ['./users-roles.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class AdminAccessComponent implements OnInit {
|
||||||
|
constructor(
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
private route: ActivatedRoute,
|
||||||
|
public adminManageAccessDataService: AdminManageAccessDataService,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.adminManageAccessDataService.init()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { Router, Resolve, RouterStateSnapshot, ActivatedRouteSnapshot } from '@angular/router'
|
||||||
|
import { Observable } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { AdminManageDataService, Category } from '../data.service'
|
||||||
|
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class CategoryResolver implements Resolve<object> {
|
||||||
|
constructor(
|
||||||
|
private adminManageDataService: AdminManageDataService,
|
||||||
|
private router: Router
|
||||||
|
) {}
|
||||||
|
|
||||||
|
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Category[]> {
|
||||||
|
return this.adminManageDataService.getCategories()
|
||||||
|
}
|
||||||
|
}
|
||||||
51
src/app/admin/admin-manage/category/category.component.css
Normal file
51
src/app/admin/admin-manage/category/category.component.css
Normal file
|
|
@ -0,0 +1,51 @@
|
||||||
|
h1 {
|
||||||
|
margin-top: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tools button {
|
||||||
|
width: 12em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter button {
|
||||||
|
min-width: 1.5em!important;
|
||||||
|
max-width: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.cdk-column-symbol {
|
||||||
|
font-family: "GisafSymbols";
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.even {
|
||||||
|
background-color: #f5f5f512;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unlockCheckbox {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
td .mat-mdc-button {
|
||||||
|
min-width: inherit ! important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-delete, .mat-column-edit {
|
||||||
|
width: 3em;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-symbol {
|
||||||
|
width: 3em;
|
||||||
|
}
|
||||||
|
|
||||||
|
th.mat-mdc-header-cell:first-of-type, td.mat-mdc-cell:first-of-type, td.mat-mdc-footer-cell:first-of-type {
|
||||||
|
padding-left: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
th.mat-mdc-header-cell:last-of-type, td.mat-mdc-cell:last-of-type, td.mat-mdc-footer-cell:last-of-type {
|
||||||
|
padding-right: inherit;
|
||||||
|
}
|
||||||
82
src/app/admin/admin-manage/category/category.component.html
Normal file
82
src/app/admin/admin-manage/category/category.component.html
Normal file
|
|
@ -0,0 +1,82 @@
|
||||||
|
<h1>Survey categories</h1>
|
||||||
|
<div class='tools' fxLayout='row' fxLayoutAlign="space-around center">
|
||||||
|
<mat-form-field class='filter' fxFlex="1 1 0">
|
||||||
|
<mat-label>Filter in table</mat-label>
|
||||||
|
<input matInput
|
||||||
|
(input)="applyFilter()"
|
||||||
|
matTooltip="Filter the items from the table"
|
||||||
|
[(ngModel)]="filterText"/>
|
||||||
|
<button mat-button matSuffix mat-icon-button
|
||||||
|
*ngIf="filterText"
|
||||||
|
aria-label="Clear"
|
||||||
|
(click)="filterText='';applyFilter()"
|
||||||
|
>
|
||||||
|
<mat-icon>close</mat-icon>
|
||||||
|
</button>
|
||||||
|
</mat-form-field>
|
||||||
|
<button mat-raised-button aria-label="New"
|
||||||
|
*ngIf="authenticationService.isAuthorized(edit_roles)"
|
||||||
|
(click)="editItem()">
|
||||||
|
<mat-icon>create</mat-icon>
|
||||||
|
Add new category
|
||||||
|
</button>
|
||||||
|
<!--
|
||||||
|
<button mat-raised-button aria-label="Update Gisaf registry"
|
||||||
|
matTooltip='After change in categories, Gisaf needs to update database tables and update its registry of categories'
|
||||||
|
(click)="updateRegistry()">
|
||||||
|
<mat-icon>update</mat-icon>
|
||||||
|
Update Gisaf registry
|
||||||
|
</button>
|
||||||
|
-->
|
||||||
|
</div>
|
||||||
|
<table mat-table matSort [dataSource]="dataSource" class='content'
|
||||||
|
matSortActive="name" matSortDirection="asc">
|
||||||
|
<ng-container [matColumnDef]="field" *ngFor='let field of fields'>
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ field }}</th>
|
||||||
|
<td mat-cell *matCellDef="let item">{{ item[field] }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="delete"
|
||||||
|
*ngIf="authenticationService.isAuthorized(edit_roles)"
|
||||||
|
>
|
||||||
|
<th mat-header-cell *matHeaderCellDef>
|
||||||
|
<form [formGroup]="unlockDeleteFormGroup" class='unlockCheckbox'>
|
||||||
|
<mat-checkbox formControlName='canDelete' matTooltip='Unlock delete buttons'>
|
||||||
|
</mat-checkbox>
|
||||||
|
</form>
|
||||||
|
</th>
|
||||||
|
<td mat-cell *matCellDef="let item">
|
||||||
|
<button mat-button (click)="deleteItem(item)"
|
||||||
|
[disabled]="!unlockDeleteFormGroup.controls['canDelete'].value"
|
||||||
|
matTooltip="Delete"
|
||||||
|
>
|
||||||
|
<mat-icon aria-label="delete">delete</mat-icon>
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="edit">
|
||||||
|
<th mat-header-cell *matHeaderCellDef>Edit</th>
|
||||||
|
<td mat-cell *matCellDef="let item">
|
||||||
|
<button mat-button (click)="editItem(item)"
|
||||||
|
matTooltip="Edit the item"
|
||||||
|
>
|
||||||
|
<mat-icon aria-label="edit">edit</mat-icon>
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<tr mat-header-row *matHeaderRowDef="columns;sticky:true"></tr>
|
||||||
|
<tr mat-row [ngClass]="{even: even}"
|
||||||
|
*matRowDef="let row; let even = even;columns:columns"
|
||||||
|
></tr>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<mat-paginator
|
||||||
|
class="paginator"
|
||||||
|
[pageSizeOptions]="[10, 20, 50, 100]"
|
||||||
|
[pageIndex]='0'
|
||||||
|
[pageSize]='10'
|
||||||
|
showFirstLastButtons
|
||||||
|
>
|
||||||
|
</mat-paginator>
|
||||||
136
src/app/admin/admin-manage/category/category.component.ts
Normal file
136
src/app/admin/admin-manage/category/category.component.ts
Normal file
|
|
@ -0,0 +1,136 @@
|
||||||
|
import { Component, OnInit,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy, ViewChild } from '@angular/core'
|
||||||
|
import { ActivatedRoute } from '@angular/router'
|
||||||
|
import { UntypedFormGroup, UntypedFormControl } from '@angular/forms'
|
||||||
|
|
||||||
|
import { MatTableDataSource } from '@angular/material/table'
|
||||||
|
import { MatSnackBar } from '@angular/material/snack-bar'
|
||||||
|
import { MatSort } from '@angular/material/sort'
|
||||||
|
import { MatPaginator } from '@angular/material/paginator'
|
||||||
|
import { MatDialog } from '@angular/material/dialog'
|
||||||
|
|
||||||
|
import { GisafAdminCategoryDialogComponent } from './dialog.component'
|
||||||
|
import { Category, AdminManageDataService } from '../data.service'
|
||||||
|
import { AuthenticationService } from '../../../_services/authentication.service'
|
||||||
|
import { CategoryField, categoryFields } from './fields'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-category',
|
||||||
|
templateUrl: './category.component.html',
|
||||||
|
styleUrls: ['./category.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class CategoryComponent implements OnInit {
|
||||||
|
edit_roles = ['category manager']
|
||||||
|
categories: Category[] = []
|
||||||
|
fields: string[] = categoryFields.map(f=>f.name)
|
||||||
|
actions: string[] = [
|
||||||
|
'edit',
|
||||||
|
'delete'
|
||||||
|
]
|
||||||
|
columns: string[]
|
||||||
|
dataSource: MatTableDataSource<object>
|
||||||
|
@ViewChild(MatSort, {static: true}) sort: MatSort
|
||||||
|
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator
|
||||||
|
unlockDeleteFormGroup: UntypedFormGroup = new UntypedFormGroup({})
|
||||||
|
filterText: string
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
private route: ActivatedRoute,
|
||||||
|
private snackBar: MatSnackBar,
|
||||||
|
private adminManageDataService: AdminManageDataService,
|
||||||
|
public authenticationService: AuthenticationService,
|
||||||
|
public dialog: MatDialog,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.route.data.subscribe(
|
||||||
|
data => {
|
||||||
|
this.categories = data['categories']
|
||||||
|
this.dataSource = new MatTableDataSource(this.categories)
|
||||||
|
this.dataSource.sort = this.sort
|
||||||
|
this.dataSource.paginator = this.paginator
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
this.unlockDeleteFormGroup = new UntypedFormGroup({
|
||||||
|
'canDelete': new UntypedFormControl(),
|
||||||
|
})
|
||||||
|
this.columns = categoryFields.filter(f=>f.inTable).map(f=>f.name)
|
||||||
|
if (this.authenticationService.isAuthorized(this.edit_roles)) {
|
||||||
|
this.columns = this.columns.concat(this.actions)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
applyFilter() {
|
||||||
|
this.dataSource.filter = this.filterText.trim().toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
editItem(data?: Category) {
|
||||||
|
const dialogRef = this.dialog.open(GisafAdminCategoryDialogComponent, {
|
||||||
|
width: '75%',
|
||||||
|
data: {
|
||||||
|
'category': data || new Category(''),
|
||||||
|
}
|
||||||
|
})
|
||||||
|
dialogRef.afterClosed().subscribe(
|
||||||
|
(category: Category) => category &&
|
||||||
|
this.adminManageDataService.saveCategory(
|
||||||
|
category
|
||||||
|
).subscribe({
|
||||||
|
next: (result: object) => {
|
||||||
|
let _mode: string = result['_mode']
|
||||||
|
if (_mode == 'updated') {
|
||||||
|
let row = this.dataSource.data.findIndex(c=>c['name'] == category.name)
|
||||||
|
this.dataSource.data[row] = category
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.dataSource.data.push(category as Category)
|
||||||
|
}
|
||||||
|
let msg = 'Category ' + category.name + ' ' + result['_mode']
|
||||||
|
if (result['message']) {
|
||||||
|
msg += result['message']
|
||||||
|
}
|
||||||
|
this.snackBar.open(msg, 'Close')
|
||||||
|
this.dataSource.data = this.dataSource.data
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
},
|
||||||
|
error: err => {
|
||||||
|
// Popup the dialog again, the error is catched by Apollo
|
||||||
|
console.error(err)
|
||||||
|
this.editItem(category)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteItem(category: Category) {
|
||||||
|
this.adminManageDataService.deleteCategory(category).subscribe({
|
||||||
|
next: (message: string) => {
|
||||||
|
this.snackBar.open(message, 'Close')
|
||||||
|
// Remove from table
|
||||||
|
let dsi = this.dataSource.data.findIndex(fi => fi['name'] == category.name)
|
||||||
|
this.dataSource.data.splice(dsi, 1)
|
||||||
|
// Force Angular change detection (??)
|
||||||
|
this.dataSource.data = this.dataSource.data
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
},
|
||||||
|
error: err => {
|
||||||
|
this.snackBar.open(err, 'Close')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
updateRegistry() {
|
||||||
|
this.adminManageDataService.updateRegistry().subscribe(
|
||||||
|
resp => {
|
||||||
|
this.snackBar.open(
|
||||||
|
'Success: tables created, registry updated, other Gisaf processes notified',
|
||||||
|
'Close',
|
||||||
|
{duration: 3000}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
8
src/app/admin/admin-manage/category/dialog.component.css
Normal file
8
src/app/admin/admin-manage/category/dialog.component.css
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
mat-form-field {
|
||||||
|
padding: 0 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.symbol {
|
||||||
|
font-family: "GisafSymbols";
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
17
src/app/admin/admin-manage/category/dialog.component.html
Normal file
17
src/app/admin/admin-manage/category/dialog.component.html
Normal file
|
|
@ -0,0 +1,17 @@
|
||||||
|
<h1 mat-dialog-title>Edit category</h1>
|
||||||
|
|
||||||
|
<div [formGroup]="formGroup" class='form'>
|
||||||
|
<div mat-dialog-content>
|
||||||
|
<mat-form-field *ngFor="let keyvalue of formGroup.controls | keyvalue">
|
||||||
|
<mat-label>{{ keyvalue.key }}</mat-label>
|
||||||
|
<input matInput
|
||||||
|
[formControlName]="keyvalue.key"
|
||||||
|
[class]="keyvalue.key"
|
||||||
|
>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div mat-dialog-actions>
|
||||||
|
<button mat-button (click)="dialogRef.close()">Cancel</button>
|
||||||
|
<button mat-button (click)="save()" type="submit" [disabled]="!formGroup.valid">Ok</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
46
src/app/admin/admin-manage/category/dialog.component.ts
Normal file
46
src/app/admin/admin-manage/category/dialog.component.ts
Normal file
|
|
@ -0,0 +1,46 @@
|
||||||
|
import { Component, OnInit, Input,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy, ViewChild, Inject } from '@angular/core'
|
||||||
|
import { UntypedFormGroup, UntypedFormControl, Validators } from '@angular/forms'
|
||||||
|
|
||||||
|
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'
|
||||||
|
|
||||||
|
import { Category } from '../data.service'
|
||||||
|
import { categoryFields } from './fields'
|
||||||
|
|
||||||
|
export interface DialogData {
|
||||||
|
category: Category
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-category-dialog',
|
||||||
|
templateUrl: 'dialog.component.html',
|
||||||
|
styleUrls: ['dialog.component.css'],
|
||||||
|
})
|
||||||
|
export class GisafAdminCategoryDialogComponent implements OnInit {
|
||||||
|
formGroup: UntypedFormGroup
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
public dialogRef: MatDialogRef<GisafAdminCategoryDialogComponent>,
|
||||||
|
@Inject(MAT_DIALOG_DATA) public data: DialogData
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
let category: Category = this.data['category']
|
||||||
|
this.formGroup = new UntypedFormGroup({})
|
||||||
|
//this.formGroup.addControl('name', new FormControl(category.name, [Validators.required]))
|
||||||
|
for (let categoryField of categoryFields) {
|
||||||
|
this.formGroup.addControl(
|
||||||
|
categoryField.name,
|
||||||
|
new UntypedFormControl(
|
||||||
|
category[categoryField.name] || categoryField.defaultValue,
|
||||||
|
categoryField.validators,
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
save() {
|
||||||
|
this.dialogRef.close(this.formGroup.value);
|
||||||
|
}
|
||||||
|
}
|
||||||
29
src/app/admin/admin-manage/category/fields.ts
Normal file
29
src/app/admin/admin-manage/category/fields.ts
Normal file
|
|
@ -0,0 +1,29 @@
|
||||||
|
import { Validators } from '@angular/forms'
|
||||||
|
|
||||||
|
export class CategoryField {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public validators = [],
|
||||||
|
public type: string = 'string',
|
||||||
|
public defaultValue?: string,
|
||||||
|
public inTable: boolean = true
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const categoryFields: CategoryField[] = [
|
||||||
|
new CategoryField('name', [Validators.required]),
|
||||||
|
new CategoryField('description', [Validators.required]),
|
||||||
|
new CategoryField('group', [Validators.required, Validators.maxLength(4), Validators.minLength(4)]),
|
||||||
|
new CategoryField('minor_group_1', [Validators.required, Validators.maxLength(4), Validators.minLength(4)]),
|
||||||
|
new CategoryField('minor_group_2', [Validators.required, Validators.maxLength(4), Validators.minLength(4)], 'string', '----'),
|
||||||
|
new CategoryField('status', [Validators.required, Validators.maxLength(1), Validators.minLength(1)], 'string', 'E'),
|
||||||
|
//new CategoryField('auto_import', [], 'boolean'),
|
||||||
|
new CategoryField('model_type', [Validators.required, Validators.pattern('^(Point|Line|Polygon)$')], 'string', 'Point'),
|
||||||
|
new CategoryField('long_name'),
|
||||||
|
new CategoryField('symbol', [Validators.maxLength(1), Validators.minLength(1)], 'string'),
|
||||||
|
new CategoryField('mapbox_type_custom', [], 'string', '', false),
|
||||||
|
new CategoryField('mapbox_paint', [], 'string', '', false),
|
||||||
|
new CategoryField('mapbox_layout', [], 'string', '', false),
|
||||||
|
new CategoryField('viewable_role', [], 'string', '', false),
|
||||||
|
new CategoryField('extra', [], 'string', '', false),
|
||||||
|
]
|
||||||
525
src/app/admin/admin-manage/data.service.ts
Normal file
525
src/app/admin/admin-manage/data.service.ts
Normal file
|
|
@ -0,0 +1,525 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
|
||||||
|
import { Observable, BehaviorSubject, forkJoin, of as observableOf } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { Apollo, gql } from 'apollo-angular'
|
||||||
|
|
||||||
|
const getSurveyStores = gql`
|
||||||
|
query geo_survey_stores {
|
||||||
|
geo_survey_stores {
|
||||||
|
name
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const getRawSurveyStores = gql`
|
||||||
|
query geo_raw_survey_stores {
|
||||||
|
geo_raw_survey_stores {
|
||||||
|
name
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const getRawSurveyPoints = gql`
|
||||||
|
query raw_survey_points ($orig_id: String!) {
|
||||||
|
raw_survey_points(orig_id: $orig_id) {
|
||||||
|
id
|
||||||
|
category
|
||||||
|
date
|
||||||
|
orig_id
|
||||||
|
store
|
||||||
|
status
|
||||||
|
type
|
||||||
|
project
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const reconciliationItemMutation = gql`
|
||||||
|
mutation reconciliationItem(
|
||||||
|
$id: String!,
|
||||||
|
$category: String!
|
||||||
|
) {
|
||||||
|
reconciliationItem(
|
||||||
|
id: $id,
|
||||||
|
category: $category
|
||||||
|
) {
|
||||||
|
result {
|
||||||
|
message
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const changeSurveyPointMutation = gql`
|
||||||
|
mutation changeSurveyPointStatus(
|
||||||
|
$id: String!,
|
||||||
|
$status: String!
|
||||||
|
) {
|
||||||
|
changePointStatus(
|
||||||
|
id: $id,
|
||||||
|
status: $status
|
||||||
|
) {
|
||||||
|
result {
|
||||||
|
message
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const deleteSurveyPointMutation = gql`
|
||||||
|
mutation deletePoint(
|
||||||
|
$id: String!,
|
||||||
|
) {
|
||||||
|
deletePoint(
|
||||||
|
id: $id,
|
||||||
|
) {
|
||||||
|
result {
|
||||||
|
message
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
|
||||||
|
const categoryMutation = gql`
|
||||||
|
mutation categoryMutation(
|
||||||
|
$category: CategoryInput!,
|
||||||
|
) {
|
||||||
|
editCategory(
|
||||||
|
category: $category,
|
||||||
|
) {
|
||||||
|
result {
|
||||||
|
name
|
||||||
|
_message
|
||||||
|
_mode
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const projectMutation = gql`
|
||||||
|
mutation projectMutation(
|
||||||
|
$project: ProjectInput!,
|
||||||
|
) {
|
||||||
|
editProject(
|
||||||
|
project: $project,
|
||||||
|
) {
|
||||||
|
result {
|
||||||
|
id
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const categoryDeleteMutation = gql`
|
||||||
|
mutation deleteCategory(
|
||||||
|
$name: String!
|
||||||
|
) {
|
||||||
|
deleteCategory(
|
||||||
|
name: $name,
|
||||||
|
) {
|
||||||
|
result
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const projectDeleteMutation = gql`
|
||||||
|
mutation deleteProject(
|
||||||
|
$id: Int!
|
||||||
|
) {
|
||||||
|
deleteProject(
|
||||||
|
id: $id,
|
||||||
|
) {
|
||||||
|
result
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const categoriesQuery = gql`
|
||||||
|
query categories {
|
||||||
|
categories {
|
||||||
|
name
|
||||||
|
description
|
||||||
|
group
|
||||||
|
minor_group_1
|
||||||
|
minor_group_2
|
||||||
|
status
|
||||||
|
auto_import
|
||||||
|
model_type
|
||||||
|
long_name
|
||||||
|
symbol
|
||||||
|
mapbox_type_custom
|
||||||
|
mapbox_paint
|
||||||
|
mapbox_layout
|
||||||
|
viewable_role
|
||||||
|
extra
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const projectsQuery = gql`
|
||||||
|
query projects {
|
||||||
|
projects {
|
||||||
|
id
|
||||||
|
name
|
||||||
|
contact_person
|
||||||
|
site
|
||||||
|
date_approved
|
||||||
|
start_date_planned
|
||||||
|
start_date_effective
|
||||||
|
end_date_planned
|
||||||
|
end_date_effective
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const updateRegistryQuery = gql`
|
||||||
|
query updateRegistry {
|
||||||
|
updateRegistry
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const vacuumDbQuery = gql`
|
||||||
|
query vacuumDb {
|
||||||
|
vacuumDb
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const runIntegrityCheckQuery = gql`
|
||||||
|
query runIntegrityCheck(
|
||||||
|
$integrityCheckId: String!
|
||||||
|
) {
|
||||||
|
integrityCheckRun(
|
||||||
|
integrityCheckId: $integrityCheckId
|
||||||
|
) {
|
||||||
|
name
|
||||||
|
description
|
||||||
|
dfData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
const integrityCheckQuery = gql`
|
||||||
|
query integrityChecks {
|
||||||
|
integrityChecks {
|
||||||
|
id
|
||||||
|
name
|
||||||
|
description
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
|
export class Store {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Category {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public description?: string,
|
||||||
|
public group?: string,
|
||||||
|
public minor_group_1?: string,
|
||||||
|
public minor_group_2?: string,
|
||||||
|
public status?: string,
|
||||||
|
public auto_import?: string,
|
||||||
|
public model_type?: string,
|
||||||
|
public long_name?: string,
|
||||||
|
public symbol?: string,
|
||||||
|
public mapbox_type_custom?: string,
|
||||||
|
public mapbox_paint?: string,
|
||||||
|
public mapbox_layout?: string,
|
||||||
|
public viewable_role?: string,
|
||||||
|
public extra?: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Project {
|
||||||
|
constructor(
|
||||||
|
public id: number,
|
||||||
|
public name: string,
|
||||||
|
public contact_person?: string,
|
||||||
|
public site?: string,
|
||||||
|
public date_approved?: Date,
|
||||||
|
public start_date_planned?: Date,
|
||||||
|
public start_date_effective?: Date,
|
||||||
|
public end_date_planned?: Date,
|
||||||
|
public end_date_effective?: Date,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class RawSurveyPoint {
|
||||||
|
constructor(
|
||||||
|
public id: String,
|
||||||
|
public orig_id: String,
|
||||||
|
public date: Date,
|
||||||
|
public category: String,
|
||||||
|
public status: String,
|
||||||
|
public store: String,
|
||||||
|
public type: String,
|
||||||
|
public project: String,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Field {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public type: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class DF {
|
||||||
|
constructor(
|
||||||
|
public fields: Field[],
|
||||||
|
public rows: object[]
|
||||||
|
) {}
|
||||||
|
|
||||||
|
get fieldNames() {
|
||||||
|
return this.fields.map(f=>f.name)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class IntegrityReport {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public description: string,
|
||||||
|
public df?: DF,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class IntegrityCheck {
|
||||||
|
constructor(
|
||||||
|
public id: string,
|
||||||
|
public name: string,
|
||||||
|
public description: string,
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class AdminManageDataService {
|
||||||
|
constructor(
|
||||||
|
private apollo: Apollo,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
getRawSurveyStores(): Observable<Store[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getRawSurveyStores,
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['geo_raw_survey_stores'].map(
|
||||||
|
(store: object) => new Store(
|
||||||
|
store['name'],
|
||||||
|
)
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getSurveyStores(): Observable<Store[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getSurveyStores,
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['geo_survey_stores'].map(
|
||||||
|
(store: object) => new Store(
|
||||||
|
store['name'],
|
||||||
|
)
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getRawSurveyPoints(orig_id: string): Observable<RawSurveyPoint[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: getRawSurveyPoints,
|
||||||
|
variables: {
|
||||||
|
orig_id: orig_id
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['raw_survey_points'].map(
|
||||||
|
(rawSurveyPoint: object) => new RawSurveyPoint(
|
||||||
|
rawSurveyPoint['id'],
|
||||||
|
rawSurveyPoint['orig_id'],
|
||||||
|
rawSurveyPoint['date'],
|
||||||
|
rawSurveyPoint['category'],
|
||||||
|
rawSurveyPoint['status'],
|
||||||
|
rawSurveyPoint['store'],
|
||||||
|
rawSurveyPoint['type'],
|
||||||
|
rawSurveyPoint['project'],
|
||||||
|
)
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
reconcile(item: RawSurveyPoint, category: string): Observable<string> {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: reconciliationItemMutation,
|
||||||
|
variables: {
|
||||||
|
id: item.id,
|
||||||
|
category: category
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['reconciliationItem']['result']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
changeStatus(item: RawSurveyPoint, status: string): Observable<string> {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: changeSurveyPointMutation,
|
||||||
|
variables: {
|
||||||
|
id: item.id,
|
||||||
|
status: status
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['changePointStatus']['result']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
delete(item: RawSurveyPoint): Observable<string> {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: deleteSurveyPointMutation,
|
||||||
|
variables: {
|
||||||
|
id: item.id,
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['deletePoint']['result']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getCategories(): Observable<Category[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: categoriesQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['categories'].map(
|
||||||
|
(category: object) => new Category(
|
||||||
|
category['name'],
|
||||||
|
category['description'],
|
||||||
|
category['group'],
|
||||||
|
category['minor_group_1'],
|
||||||
|
category['minor_group_2'],
|
||||||
|
category['status'],
|
||||||
|
category['auto_import'],
|
||||||
|
category['model_type'],
|
||||||
|
category['long_name'],
|
||||||
|
category['symbol'],
|
||||||
|
category['mapbox_type_custom'],
|
||||||
|
category['mapbox_paint'],
|
||||||
|
category['mapbox_layout'],
|
||||||
|
category['viewable_role'],
|
||||||
|
category['extra'],
|
||||||
|
)
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getProjects(): Observable<Project[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: projectsQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['projects'].map(
|
||||||
|
(project: object) => project as Project
|
||||||
|
)
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
saveCategory(category: Category): Observable<object> {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: categoryMutation,
|
||||||
|
variables: {
|
||||||
|
category: category,
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['editCategory']['result']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteCategory(category: Category): Observable<string> {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: categoryDeleteMutation,
|
||||||
|
variables: {
|
||||||
|
name: category.name,
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
// TODO: distinguish message and error
|
||||||
|
res => res['data']['deleteCategory']['result']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
saveProject(project: Project): Observable<number> {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: projectMutation,
|
||||||
|
variables: {
|
||||||
|
project: project,
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['editProject']['result']['id']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteProject(project: Project): Observable<number> {
|
||||||
|
return this.apollo.mutate({
|
||||||
|
mutation: projectDeleteMutation,
|
||||||
|
variables: {
|
||||||
|
id: project.id,
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['deleteProject']['result']['id']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
updateRegistry() {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: updateRegistryQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['updateRegistry']['result']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
vacuumDb(): Observable<boolean> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: vacuumDbQuery,
|
||||||
|
}).pipe(map(
|
||||||
|
res => res['data']['vacuumDb']
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
runIntegrityCheck(integrityCheck: IntegrityCheck): Observable<IntegrityReport> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: runIntegrityCheckQuery,
|
||||||
|
variables: {
|
||||||
|
integrityCheckId: integrityCheck.id
|
||||||
|
}
|
||||||
|
}).pipe(map(
|
||||||
|
res => {
|
||||||
|
let report = res['data']['integrityCheckRun']
|
||||||
|
let dfData = JSON.parse(report['dfData'])
|
||||||
|
return new IntegrityReport(
|
||||||
|
report['name'],
|
||||||
|
report['description'],
|
||||||
|
dfData && new DF(
|
||||||
|
dfData['schema']['fields'].map(
|
||||||
|
field => new Field(field['name'], field['type'])
|
||||||
|
),
|
||||||
|
dfData['data']
|
||||||
|
),
|
||||||
|
)
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
|
||||||
|
getIntegrityChecks(): Observable<IntegrityCheck[]> {
|
||||||
|
return this.apollo.query({
|
||||||
|
query: integrityCheckQuery
|
||||||
|
}).pipe(map(
|
||||||
|
resp => {
|
||||||
|
let data = resp['data']['integrityChecks']
|
||||||
|
return data.map(
|
||||||
|
(item: object) => new IntegrityCheck(
|
||||||
|
item['id'],
|
||||||
|
item['name'],
|
||||||
|
item['description']
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
))
|
||||||
|
}
|
||||||
|
}
|
||||||
19
src/app/admin/admin-manage/integrity/integrity.component.css
Normal file
19
src/app/admin/admin-manage/integrity/integrity.component.css
Normal file
|
|
@ -0,0 +1,19 @@
|
||||||
|
.buttons {
|
||||||
|
margin: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.buttons button {
|
||||||
|
margin: 0 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
th.mat-mdc-header-cell, td.mat-mdc-cell, td.mat-mdc-footer-cell {
|
||||||
|
padding: 0 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tools {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.even {
|
||||||
|
background-color: #f5f5f512;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,52 @@
|
||||||
|
<div class='buttons'>
|
||||||
|
<span>Integrity checks:</span>
|
||||||
|
<button mat-raised-button
|
||||||
|
*ngFor='let integrityCheck of integrityChecks'
|
||||||
|
[title]='integrityCheck.description'
|
||||||
|
(click)='runIntegrityCheck(integrityCheck)'
|
||||||
|
>
|
||||||
|
<mat-icon>report</mat-icon>
|
||||||
|
{{ integrityCheck.name }}
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<mat-progress-bar
|
||||||
|
*ngIf='pleaseWait'
|
||||||
|
mode='indeterminate'
|
||||||
|
color='accent'
|
||||||
|
value=100
|
||||||
|
>
|
||||||
|
</mat-progress-bar>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div *ngIf='report'>
|
||||||
|
<h2>{{ report.name }}</h2>
|
||||||
|
<p>{{ report.description }}</p>
|
||||||
|
</div>
|
||||||
|
<div class='tools'>
|
||||||
|
<mat-form-field class='filter'>
|
||||||
|
<mat-label>Filter in report</mat-label>
|
||||||
|
<input matInput
|
||||||
|
(input)='applyFilter()'
|
||||||
|
matTooltip='Filter the items of the report from the table'
|
||||||
|
[(ngModel)]='filterText'/>
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<table mat-table matSort [dataSource]='dataSource'>
|
||||||
|
<ng-container *ngFor='let colName of fieldNames'
|
||||||
|
[matColumnDef]='colName'>
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ colName }}</th>
|
||||||
|
<td mat-cell *matCellDef="let value"> {{ value[colName] }} </td>
|
||||||
|
</ng-container>
|
||||||
|
<tr mat-header-row *matHeaderRowDef="fieldNames; sticky: true"></tr>
|
||||||
|
<tr mat-row [ngClass]="{even: even}"
|
||||||
|
*matRowDef="let row; let even = even; columns: fieldNames"></tr>
|
||||||
|
</table>
|
||||||
|
<mat-paginator
|
||||||
|
class="paginator"
|
||||||
|
[pageSizeOptions]="[10, 20, 50, 100]"
|
||||||
|
[pageIndex]='0'
|
||||||
|
[pageSize]='10'
|
||||||
|
showFirstLastButtons
|
||||||
|
>
|
||||||
|
</mat-paginator>
|
||||||
67
src/app/admin/admin-manage/integrity/integrity.component.ts
Normal file
67
src/app/admin/admin-manage/integrity/integrity.component.ts
Normal file
|
|
@ -0,0 +1,67 @@
|
||||||
|
import { Component, OnInit, ViewChild,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core';
|
||||||
|
|
||||||
|
import { MatSnackBar } from '@angular/material/snack-bar'
|
||||||
|
import { MatPaginator } from '@angular/material/paginator'
|
||||||
|
import { MatSort } from '@angular/material/sort'
|
||||||
|
import { MatTableDataSource } from '@angular/material/table'
|
||||||
|
|
||||||
|
import { AdminManageDataService, IntegrityReport, IntegrityCheck } from '../data.service'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-integrity',
|
||||||
|
templateUrl: './integrity.component.html',
|
||||||
|
styleUrls: ['./integrity.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class AdminIntegrityComponent implements OnInit {
|
||||||
|
integrityChecks: IntegrityCheck[] = []
|
||||||
|
report: IntegrityReport
|
||||||
|
pleaseWait: boolean = false
|
||||||
|
filterText: string
|
||||||
|
dataSource: MatTableDataSource<object>
|
||||||
|
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator
|
||||||
|
@ViewChild(MatSort, {static: true}) sort: MatSort
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
public adminManageDataService: AdminManageDataService,
|
||||||
|
private snackBar: MatSnackBar,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
) { }
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
this.adminManageDataService.getIntegrityChecks().subscribe(
|
||||||
|
resp => {
|
||||||
|
this.integrityChecks = resp
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
get fieldNames(): string[] {
|
||||||
|
return this.report && this.report.df ? this.report.df.fieldNames : []
|
||||||
|
}
|
||||||
|
|
||||||
|
runIntegrityCheck(integrityCheck: IntegrityCheck) {
|
||||||
|
this.pleaseWait = true
|
||||||
|
this.adminManageDataService.runIntegrityCheck(integrityCheck).subscribe(
|
||||||
|
(report: IntegrityReport) => {
|
||||||
|
this.pleaseWait = false
|
||||||
|
this.snackBar.open(
|
||||||
|
`Integrity check ${integrityCheck.name} executed`,
|
||||||
|
'Close',
|
||||||
|
{ duration: 3000 }
|
||||||
|
)
|
||||||
|
this.report = report
|
||||||
|
this.dataSource = new MatTableDataSource(report.df ? report.df.rows : [])
|
||||||
|
this.dataSource.sort = this.sort
|
||||||
|
this.dataSource.paginator = this.paginator
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
applyFilter() {
|
||||||
|
this.dataSource.filter = this.filterText.trim().toLowerCase()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
<button mat-button (click)="vacuumDb()">
|
||||||
|
<mat-icon>healing</mat-icon>
|
||||||
|
Vacuum DB
|
||||||
|
</button>
|
||||||
|
|
@ -0,0 +1,32 @@
|
||||||
|
import { Component, OnInit, ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core';
|
||||||
|
|
||||||
|
import { MatSnackBar } from '@angular/material/snack-bar'
|
||||||
|
|
||||||
|
import { AdminManageDataService } from '../data.service'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-maintenance',
|
||||||
|
templateUrl: './maintenance.component.html',
|
||||||
|
styleUrls: ['./maintenance.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class AdminMaintenanceComponent implements OnInit {
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private adminManageDataService: AdminManageDataService,
|
||||||
|
private snackBar: MatSnackBar,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
) { }
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
}
|
||||||
|
|
||||||
|
vacuumDb() {
|
||||||
|
this.adminManageDataService.vacuumDb().subscribe(
|
||||||
|
resp => this.snackBar.open(
|
||||||
|
'Database vacuum OK',
|
||||||
|
'Close',
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,23 @@
|
||||||
|
.destination {
|
||||||
|
width: 40em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form, .points {
|
||||||
|
margin: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.seachForm {
|
||||||
|
margin: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.opForm {
|
||||||
|
border: 1px solid grey;
|
||||||
|
padding: 2px 1em;
|
||||||
|
border-radius: 0.6em;
|
||||||
|
margin-bottom: 3px;
|
||||||
|
background-color: #424242;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newStatus {
|
||||||
|
width: 6em;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,53 @@
|
||||||
|
<form>
|
||||||
|
<div [formGroup]="formGroup" class='form' fxLayout="row">
|
||||||
|
<div fxFlex fxLayout="column" class='seachForm'>
|
||||||
|
<mat-form-field fxFlex='0 0 0%'>
|
||||||
|
<mat-label>Original ID (search in the raw survey points)</mat-label>
|
||||||
|
<input matInput type="text"
|
||||||
|
formControlName="originalId"
|
||||||
|
required/>
|
||||||
|
</mat-form-field>
|
||||||
|
|
||||||
|
<button type="submit" class="submitButton"
|
||||||
|
fxFlex='0 0 0%'
|
||||||
|
mat-raised-button
|
||||||
|
color='secondary'
|
||||||
|
(click)="submit()"
|
||||||
|
[disabled]="!formGroup.valid">
|
||||||
|
Search points
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<div fxFlex fxLayout="column" class='opForm'>
|
||||||
|
<mat-form-field fxFlex class='newStatus'>
|
||||||
|
<mat-label>New status</mat-label>
|
||||||
|
<input matInput type="text" formControlName="newStatus"/>
|
||||||
|
</mat-form-field>
|
||||||
|
|
||||||
|
<mat-form-field class='destination'>
|
||||||
|
<mat-label>Reconciliation destination</mat-label>
|
||||||
|
<input matInput type="text" formControlName="destination"
|
||||||
|
[matAutocomplete]="auto"/>
|
||||||
|
</mat-form-field>
|
||||||
|
|
||||||
|
<mat-autocomplete #auto="matAutocomplete">
|
||||||
|
<mat-option *ngFor="let category of filteredCategories | async" [value]="category.name">
|
||||||
|
{{ category.name }} ({{ category.group }}-{{ category.minor_group_1}}, {{ category.description }}, {{ category.status }})
|
||||||
|
</mat-option>
|
||||||
|
</mat-autocomplete>
|
||||||
|
|
||||||
|
<mat-checkbox formControlName="canDelete">
|
||||||
|
Enable delete buttons
|
||||||
|
</mat-checkbox>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
<hr/>
|
||||||
|
<div fxLayout="column" fxLayoutAlign="center start" class="points">
|
||||||
|
<gisaf-admin-raw-survey-point fxFlex *ngFor="let rawSurveyPoint of rawSurveyPoints"
|
||||||
|
[rawSurveyPoint]='rawSurveyPoint'
|
||||||
|
[newStatus]="formGroup.value['newStatus']"
|
||||||
|
[canDelete]="formGroup.value['canDelete']"
|
||||||
|
[category]="formGroup.value['destination']"
|
||||||
|
>
|
||||||
|
</gisaf-admin-raw-survey-point>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,63 @@
|
||||||
|
import { Component, OnInit, Input,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core'
|
||||||
|
|
||||||
|
import { UntypedFormGroup, UntypedFormControl } from '@angular/forms'
|
||||||
|
|
||||||
|
import { map, startWith } from 'rxjs/operators'
|
||||||
|
import { Observable } from 'rxjs'
|
||||||
|
|
||||||
|
import { AdminManageDataService, Category, RawSurveyPoint } from '../data.service'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-points-by-orig-id',
|
||||||
|
templateUrl: './points-by-orig-id.component.html',
|
||||||
|
styleUrls: ['./points-by-orig-id.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class AdminPointsByOrigIdComponent implements OnInit {
|
||||||
|
formGroup: UntypedFormGroup
|
||||||
|
categories: Category[]
|
||||||
|
rawSurveyPoints: RawSurveyPoint[]
|
||||||
|
filteredCategories: Observable<Category[]>
|
||||||
|
destinationControl: UntypedFormControl = new UntypedFormControl()
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private adminManageDataService: AdminManageDataService,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.formGroup = new UntypedFormGroup({})
|
||||||
|
this.formGroup.addControl('originalId', new UntypedFormControl())
|
||||||
|
this.formGroup.addControl('newStatus', new UntypedFormControl())
|
||||||
|
this.formGroup.addControl('canDelete', new UntypedFormControl())
|
||||||
|
this.formGroup.addControl('destination', this.destinationControl)
|
||||||
|
this.adminManageDataService.getCategories().subscribe(
|
||||||
|
categories => {
|
||||||
|
this.categories = categories
|
||||||
|
this.filteredCategories = this.destinationControl.valueChanges.pipe(
|
||||||
|
startWith(''),
|
||||||
|
map(value => this._filter(value))
|
||||||
|
)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
private _filter(value: string): Category[] {
|
||||||
|
const filterValue = value.toUpperCase()
|
||||||
|
return this.categories.filter(
|
||||||
|
category => category.name.indexOf(filterValue) != -1
|
||||||
|
|| category.group.toUpperCase().indexOf(filterValue) != -1
|
||||||
|
|| category.minor_group_1.toUpperCase().indexOf(filterValue) != -1
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
submit() {
|
||||||
|
this.adminManageDataService.getRawSurveyPoints(this.formGroup.value['originalId']).subscribe(
|
||||||
|
res => {
|
||||||
|
this.rawSurveyPoints = res
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
8
src/app/admin/admin-manage/project/dialog.component.css
Normal file
8
src/app/admin/admin-manage/project/dialog.component.css
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
mat-form-field {
|
||||||
|
padding: 0 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.symbol {
|
||||||
|
font-family: "GisafSymbols";
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
57
src/app/admin/admin-manage/project/dialog.component.html
Normal file
57
src/app/admin/admin-manage/project/dialog.component.html
Normal file
|
|
@ -0,0 +1,57 @@
|
||||||
|
<h1 mat-dialog-title>Edit project</h1>
|
||||||
|
|
||||||
|
<div [formGroup]="formGroup" class='form'>
|
||||||
|
<div mat-dialog-content>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>id</mat-label>
|
||||||
|
<input matInput formControlName="id" [readonly]="true">
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Name</mat-label>
|
||||||
|
<input matInput formControlName="name">
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Contact person</mat-label>
|
||||||
|
<input matInput formControlName="contact_person">
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Site</mat-label>
|
||||||
|
<input matInput formControlName="site">
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Date approved</mat-label>
|
||||||
|
<input matInput formControlName="date_approved" [matDatepicker]="date_approved">
|
||||||
|
<mat-datepicker-toggle matSuffix [for]="date_approved"></mat-datepicker-toggle>
|
||||||
|
<mat-datepicker #date_approved></mat-datepicker>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Start date planned</mat-label>
|
||||||
|
<input matInput formControlName="start_date_planned" [matDatepicker]="start_date_planned">
|
||||||
|
<mat-datepicker-toggle matSuffix [for]="start_date_planned"></mat-datepicker-toggle>
|
||||||
|
<mat-datepicker #start_date_planned></mat-datepicker>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>Start date effective</mat-label>
|
||||||
|
<input matInput formControlName="start_date_effective" [matDatepicker]="start_date_effective">
|
||||||
|
<mat-datepicker-toggle matSuffix [for]="start_date_effective"></mat-datepicker-toggle>
|
||||||
|
<mat-datepicker #start_date_effective></mat-datepicker>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>End date planned</mat-label>
|
||||||
|
<input matInput formControlName="end_date_planned" [matDatepicker]="end_date_planned">
|
||||||
|
<mat-datepicker-toggle matSuffix [for]="end_date_planned"></mat-datepicker-toggle>
|
||||||
|
<mat-datepicker #end_date_planned></mat-datepicker>
|
||||||
|
</mat-form-field>
|
||||||
|
<mat-form-field>
|
||||||
|
<mat-label>End date effective</mat-label>
|
||||||
|
<input matInput formControlName="end_date_effective" [matDatepicker]="end_date_effective">
|
||||||
|
<mat-datepicker-toggle matSuffix [for]="end_date_effective"></mat-datepicker-toggle>
|
||||||
|
<mat-datepicker #end_date_effective></mat-datepicker>
|
||||||
|
</mat-form-field>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div mat-dialog-actions>
|
||||||
|
<button mat-button (click)="dialogRef.close()">Cancel</button>
|
||||||
|
<button mat-button (click)="save()" type="submit" [disabled]="!formGroup.valid">Ok</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
60
src/app/admin/admin-manage/project/dialog.component.ts
Normal file
60
src/app/admin/admin-manage/project/dialog.component.ts
Normal file
|
|
@ -0,0 +1,60 @@
|
||||||
|
import { Component, OnInit, Input,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy, ViewChild, Inject } from '@angular/core'
|
||||||
|
import { UntypedFormGroup, UntypedFormControl, Validators } from '@angular/forms'
|
||||||
|
|
||||||
|
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'
|
||||||
|
|
||||||
|
import { Project } from '../data.service'
|
||||||
|
import { projectFields, ProjectField } from './fields'
|
||||||
|
|
||||||
|
export interface DialogData {
|
||||||
|
project: Project
|
||||||
|
}
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-project-dialog',
|
||||||
|
templateUrl: 'dialog.component.html',
|
||||||
|
styleUrls: ['dialog.component.css'],
|
||||||
|
})
|
||||||
|
export class GisafAdminProjectDialogComponent implements OnInit {
|
||||||
|
formGroup: UntypedFormGroup
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
public dialogRef: MatDialogRef<GisafAdminProjectDialogComponent>,
|
||||||
|
@Inject(MAT_DIALOG_DATA) public data: DialogData
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
let project: Project = this.data['project']
|
||||||
|
this.formGroup = new UntypedFormGroup({})
|
||||||
|
//this.formGroup.addControl('id', new FormControl(project.id))
|
||||||
|
for (let projectField of projectFields) {
|
||||||
|
this.formGroup.addControl(
|
||||||
|
projectField.name,
|
||||||
|
new UntypedFormControl(
|
||||||
|
project[projectField.name] || projectField.defaultValue,
|
||||||
|
projectField.validators,
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
save() {
|
||||||
|
// Ugly hack for just getting an ISO date like YYYY-MM-DD
|
||||||
|
projectFields.filter(
|
||||||
|
f => f.type == 'date'
|
||||||
|
).forEach(
|
||||||
|
f => {
|
||||||
|
if (this.formGroup.value[f.name] instanceof Date) {
|
||||||
|
let qq = this.formGroup.value[f.name]
|
||||||
|
this.formGroup.value[f.name] = [
|
||||||
|
qq.getFullYear(),
|
||||||
|
qq.getMonth().toFixed().padStart(2, 0),
|
||||||
|
qq.getDate().toFixed().padStart(2, 0)
|
||||||
|
].join('-')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
this.dialogRef.close(this.formGroup.value);
|
||||||
|
}
|
||||||
|
}
|
||||||
23
src/app/admin/admin-manage/project/fields.ts
Normal file
23
src/app/admin/admin-manage/project/fields.ts
Normal file
|
|
@ -0,0 +1,23 @@
|
||||||
|
import { Validators } from '@angular/forms'
|
||||||
|
|
||||||
|
export class ProjectField {
|
||||||
|
constructor(
|
||||||
|
public name: string,
|
||||||
|
public validators = [],
|
||||||
|
public type: string = 'string',
|
||||||
|
public defaultValue?: string,
|
||||||
|
public inTable: boolean = true
|
||||||
|
) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const projectFields: ProjectField[] = [
|
||||||
|
new ProjectField('id'),
|
||||||
|
new ProjectField('name', [Validators.required]),
|
||||||
|
new ProjectField('contact_person'),
|
||||||
|
new ProjectField('site'),
|
||||||
|
new ProjectField('date_approved', [], 'date'),
|
||||||
|
new ProjectField('start_date_planned', [], 'date'),
|
||||||
|
new ProjectField('start_date_effective', [], 'date'),
|
||||||
|
new ProjectField('end_date_planned', [], 'date'),
|
||||||
|
new ProjectField('end_date_effective', [], 'date'),
|
||||||
|
]
|
||||||
|
|
@ -0,0 +1,19 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { Router, Resolve, RouterStateSnapshot, ActivatedRouteSnapshot } from '@angular/router'
|
||||||
|
import { Observable } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { AdminManageDataService, Project } from '../data.service'
|
||||||
|
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class ProjectResolver implements Resolve<object> {
|
||||||
|
constructor(
|
||||||
|
private adminManageDataService: AdminManageDataService,
|
||||||
|
private router: Router
|
||||||
|
) {}
|
||||||
|
|
||||||
|
resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Project[]> {
|
||||||
|
return this.adminManageDataService.getProjects()
|
||||||
|
}
|
||||||
|
}
|
||||||
47
src/app/admin/admin-manage/project/project.component.css
Normal file
47
src/app/admin/admin-manage/project/project.component.css
Normal file
|
|
@ -0,0 +1,47 @@
|
||||||
|
h1 {
|
||||||
|
margin-top: 0;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tools button {
|
||||||
|
width: 12em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter button {
|
||||||
|
min-width: 1.5em!important;
|
||||||
|
max-width: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
td.cdk-column-symbol {
|
||||||
|
font-family: "GisafSymbols";
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.even {
|
||||||
|
background-color: #f5f5f512;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unlockCheckbox {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
td .mat-mdc-button {
|
||||||
|
min-width: inherit ! important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-delete, .mat-column-edit {
|
||||||
|
width: 3em;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
th.mat-mdc-header-cell:first-of-type, td.mat-mdc-cell:first-of-type, td.mat-mdc-footer-cell:first-of-type {
|
||||||
|
padding-left: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
th.mat-mdc-header-cell:last-of-type, td.mat-mdc-cell:last-of-type, td.mat-mdc-footer-cell:last-of-type {
|
||||||
|
padding-right: inherit;
|
||||||
|
}
|
||||||
74
src/app/admin/admin-manage/project/project.component.html
Normal file
74
src/app/admin/admin-manage/project/project.component.html
Normal file
|
|
@ -0,0 +1,74 @@
|
||||||
|
<h1>Survey projects</h1>
|
||||||
|
<div class='tools' fxLayout='row' fxLayoutAlign="space-around center">
|
||||||
|
<mat-form-field class='filter' fxFlex="0 1 0">
|
||||||
|
<mat-label>Filter in table</mat-label>
|
||||||
|
<input matInput
|
||||||
|
(input)="applyFilter()"
|
||||||
|
matTooltip="Filter the items of the basket from the table"
|
||||||
|
[(ngModel)]="filterText"/>
|
||||||
|
<button mat-button matSuffix mat-icon-button
|
||||||
|
*ngIf="filterText"
|
||||||
|
aria-label="Clear"
|
||||||
|
(click)="filterText='';applyFilter()"
|
||||||
|
>
|
||||||
|
<mat-icon>close</mat-icon>
|
||||||
|
</button>
|
||||||
|
</mat-form-field>
|
||||||
|
<button mat-raised-button aria-label="New"
|
||||||
|
*ngIf="authenticationService.isAuthorized(edit_roles)"
|
||||||
|
(click)="editItem()">
|
||||||
|
<mat-icon>create</mat-icon>
|
||||||
|
Add new project
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
<table mat-table matSort [dataSource]="dataSource" class='content'
|
||||||
|
matSortActive="name" matSortDirection="asc">
|
||||||
|
<ng-container [matColumnDef]="field" *ngFor='let field of fields'>
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header>{{ field }}</th>
|
||||||
|
<td mat-cell *matCellDef="let item">{{ item[field] }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="delete"
|
||||||
|
*ngIf="authenticationService.isAuthorized(edit_roles)"
|
||||||
|
>
|
||||||
|
<th mat-header-cell *matHeaderCellDef>
|
||||||
|
<form [formGroup]="unlockDeleteFormGroup" class='unlockCheckbox'>
|
||||||
|
<mat-checkbox formControlName='canDelete' matTooltip='Unlock delete buttons'>
|
||||||
|
</mat-checkbox>
|
||||||
|
</form>
|
||||||
|
</th>
|
||||||
|
<td mat-cell *matCellDef="let item">
|
||||||
|
<button mat-button (click)="deleteItem(item)"
|
||||||
|
[disabled]="!unlockDeleteFormGroup.controls['canDelete'].value"
|
||||||
|
matTooltip="Delete"
|
||||||
|
>
|
||||||
|
<mat-icon aria-label="delete">delete</mat-icon>
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="edit">
|
||||||
|
<th mat-header-cell *matHeaderCellDef>Edit</th>
|
||||||
|
<td mat-cell *matCellDef="let item">
|
||||||
|
<button mat-button (click)="editItem(item)"
|
||||||
|
matTooltip="Edit the item"
|
||||||
|
>
|
||||||
|
<mat-icon aria-label="edit">edit</mat-icon>
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<tr mat-header-row *matHeaderRowDef="columns;sticky:true"></tr>
|
||||||
|
<tr mat-row [ngClass]="{even: even}"
|
||||||
|
*matRowDef="let row; let even = even;columns:columns"
|
||||||
|
></tr>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<mat-paginator
|
||||||
|
class="paginator"
|
||||||
|
[pageSizeOptions]="[10, 20, 50, 100]"
|
||||||
|
[pageIndex]='0'
|
||||||
|
[pageSize]='10'
|
||||||
|
showFirstLastButtons
|
||||||
|
>
|
||||||
|
</mat-paginator>
|
||||||
126
src/app/admin/admin-manage/project/project.component.ts
Normal file
126
src/app/admin/admin-manage/project/project.component.ts
Normal file
|
|
@ -0,0 +1,126 @@
|
||||||
|
import { Component, OnInit,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy, ViewChild } from '@angular/core'
|
||||||
|
import { UntypedFormGroup, UntypedFormControl } from '@angular/forms'
|
||||||
|
import { ActivatedRoute } from '@angular/router'
|
||||||
|
|
||||||
|
import { MatTableDataSource } from '@angular/material/table'
|
||||||
|
import { MatSnackBar } from '@angular/material/snack-bar'
|
||||||
|
import { MatSort } from '@angular/material/sort'
|
||||||
|
import { MatPaginator } from '@angular/material/paginator'
|
||||||
|
import { MatDialog } from '@angular/material/dialog'
|
||||||
|
|
||||||
|
import { AdminDataService } from '../../admin-data.service'
|
||||||
|
import { Project, AdminManageDataService } from '../data.service'
|
||||||
|
import { GisafAdminProjectDialogComponent } from './dialog.component'
|
||||||
|
import { AuthenticationService } from '../../../_services/authentication.service'
|
||||||
|
import { ProjectField, projectFields } from './fields'
|
||||||
|
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-project',
|
||||||
|
templateUrl: './project.component.html',
|
||||||
|
styleUrls: ['./project.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class ProjectComponent implements OnInit {
|
||||||
|
edit_roles = ['project manager']
|
||||||
|
projects: Project[] = []
|
||||||
|
fields: string[] = projectFields.map(f=>f.name)
|
||||||
|
actions: string[] = [
|
||||||
|
'edit',
|
||||||
|
'delete'
|
||||||
|
]
|
||||||
|
columns: string[]
|
||||||
|
dataSource: MatTableDataSource<object>
|
||||||
|
@ViewChild(MatSort, {static: true}) sort: MatSort
|
||||||
|
@ViewChild(MatPaginator, {static: true}) paginator: MatPaginator
|
||||||
|
unlockDeleteFormGroup: UntypedFormGroup = new UntypedFormGroup({})
|
||||||
|
filterText: string
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
private route: ActivatedRoute,
|
||||||
|
public authenticationService: AuthenticationService,
|
||||||
|
private snackBar: MatSnackBar,
|
||||||
|
private dataService: AdminDataService,
|
||||||
|
private adminManageDataService: AdminManageDataService,
|
||||||
|
public dialog: MatDialog,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
this.route.data.subscribe(
|
||||||
|
data => {
|
||||||
|
this.projects = data['projects']
|
||||||
|
this.dataSource = new MatTableDataSource(this.projects)
|
||||||
|
this.dataSource.sort = this.sort
|
||||||
|
this.dataSource.paginator = this.paginator
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
this.unlockDeleteFormGroup = new UntypedFormGroup({
|
||||||
|
'canDelete': new UntypedFormControl(),
|
||||||
|
})
|
||||||
|
this.columns = projectFields.filter(f=>f.inTable).map(f=>f.name)
|
||||||
|
if (this.authenticationService.isAuthorized(this.edit_roles)) {
|
||||||
|
this.columns = this.columns.concat(this.actions)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
applyFilter() {
|
||||||
|
this.dataSource.filter = this.filterText.trim().toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
editItem(data?: Project) {
|
||||||
|
const dialogRef = this.dialog.open(GisafAdminProjectDialogComponent, {
|
||||||
|
width: '75%',
|
||||||
|
data: {
|
||||||
|
'project': data || new Project(undefined, ''),
|
||||||
|
}
|
||||||
|
})
|
||||||
|
dialogRef.afterClosed().subscribe(
|
||||||
|
(project: Project) => project &&
|
||||||
|
this.adminManageDataService.saveProject(
|
||||||
|
project
|
||||||
|
).subscribe(
|
||||||
|
(id: number) => {
|
||||||
|
if (data) {
|
||||||
|
// Update
|
||||||
|
let row = this.dataSource.data.findIndex(c=>c['id'] == id)
|
||||||
|
this.dataSource.data[row] = project
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
// New
|
||||||
|
project['id'] = id
|
||||||
|
this.dataSource.data.push(project as Project)
|
||||||
|
}
|
||||||
|
this.dataSource.data = this.dataSource.data
|
||||||
|
this.dataService.getSurveyMeta().subscribe()
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
},
|
||||||
|
err => {
|
||||||
|
// Popup the dialog again, the error is catched by Apollo
|
||||||
|
this.editItem(project)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteItem(project: Project) {
|
||||||
|
this.adminManageDataService.deleteProject(project).subscribe(
|
||||||
|
_ => {
|
||||||
|
this.snackBar.open(
|
||||||
|
'Project ' + project.name + ' deleted',
|
||||||
|
'Close',
|
||||||
|
{duration: 3000}
|
||||||
|
)
|
||||||
|
// Remove from table
|
||||||
|
let dsi = this.dataSource.data.findIndex(row => row['id'] == project.id)
|
||||||
|
this.dataSource.data.splice(dsi, 1)
|
||||||
|
// Force Angular change detection (??)
|
||||||
|
this.dataSource.data = this.dataSource.data
|
||||||
|
this.dataService.getSurveyMeta().subscribe()
|
||||||
|
this.cdr.markForCheck()
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,27 @@
|
||||||
|
.container {
|
||||||
|
border: 1px solid grey;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 3px;
|
||||||
|
margin: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.id {
|
||||||
|
width: 15em;
|
||||||
|
font-weight: 800;
|
||||||
|
}
|
||||||
|
|
||||||
|
.date {
|
||||||
|
width: 15em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.category {
|
||||||
|
width: 25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.action {
|
||||||
|
padding-left: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.buttons button {
|
||||||
|
margin: 0.5em;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,42 @@
|
||||||
|
<div class='container' fxLayout fxLayoutAlign='center start'>
|
||||||
|
<div fxFlex class='info'>
|
||||||
|
<div class='id'>
|
||||||
|
Database id: {{ rawSurveyPoint.id }}
|
||||||
|
</div>
|
||||||
|
<div class='category'>
|
||||||
|
Survey category: {{ rawSurveyPoint.category }} ({{ rawSurveyPoint.store }})
|
||||||
|
</div>
|
||||||
|
<div class='date'>
|
||||||
|
Survey date: {{ rawSurveyPoint.date }}
|
||||||
|
</div>
|
||||||
|
<div class='status'>
|
||||||
|
Status: {{ rawSurveyPoint.status }}
|
||||||
|
</div>
|
||||||
|
<div class='date'>
|
||||||
|
Type: {{ rawSurveyPoint.type }}
|
||||||
|
</div>
|
||||||
|
<div class='project'>
|
||||||
|
Project: {{ rawSurveyPoint.project }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class='buttons' fxFlex='1 1 60%'>
|
||||||
|
<button class='action' mat-raised-button color='secondary'
|
||||||
|
[disabled]='!newStatus'
|
||||||
|
(click)="changeStatus($event)">
|
||||||
|
Change status
|
||||||
|
<mat-icon aria-label="change_status">swap_horiz</mat-icon>
|
||||||
|
</button>
|
||||||
|
<button class='action' mat-raised-button color='secondary'
|
||||||
|
[disabled]='!category'
|
||||||
|
(click)="reconcile($event)">
|
||||||
|
Reconcile
|
||||||
|
<mat-icon aria-label="reconcile">forward</mat-icon>
|
||||||
|
</button>
|
||||||
|
<button class='action' mat-raised-button color='primary'
|
||||||
|
[disabled]='!canDelete'
|
||||||
|
(click)="delete($event)">
|
||||||
|
Delete
|
||||||
|
<mat-icon aria-label="delete">delete</mat-icon>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
@ -0,0 +1,50 @@
|
||||||
|
import { Component, OnInit, Input,
|
||||||
|
ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core'
|
||||||
|
|
||||||
|
import { MatSnackBar } from '@angular/material/snack-bar'
|
||||||
|
|
||||||
|
import { AdminManageDataService, RawSurveyPoint, Category } from '../data.service'
|
||||||
|
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-raw-survey-point',
|
||||||
|
templateUrl: './raw-survey-point.component.html',
|
||||||
|
styleUrls: ['./raw-survey-point.component.css'],
|
||||||
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||||
|
})
|
||||||
|
export class RawSurveyPointComponent {
|
||||||
|
@Input() rawSurveyPoint: RawSurveyPoint
|
||||||
|
@Input() newStatus: string
|
||||||
|
@Input() category: string
|
||||||
|
@Input() canDelete: boolean
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private adminManageDataService: AdminManageDataService,
|
||||||
|
private cdr: ChangeDetectorRef,
|
||||||
|
private snackBar: MatSnackBar,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
changeStatus(evt) {
|
||||||
|
this.adminManageDataService.changeStatus(this.rawSurveyPoint, this.newStatus).subscribe(
|
||||||
|
(res: Object) => {
|
||||||
|
this.snackBar.open(res['message'], 'OK')
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
delete(evt) {
|
||||||
|
this.adminManageDataService.delete(this.rawSurveyPoint).subscribe(
|
||||||
|
(res: Object) => {
|
||||||
|
this.snackBar.open(res['message'], 'OK')
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
reconcile(evt) {
|
||||||
|
this.adminManageDataService.reconcile(this.rawSurveyPoint, this.category).subscribe(
|
||||||
|
(res: Object) => {
|
||||||
|
this.snackBar.open(res['message'], 'OK')
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
23
src/app/admin/admin-menu/admin-menu.component.css
Normal file
23
src/app/admin/admin-menu/admin-menu.component.css
Normal file
|
|
@ -0,0 +1,23 @@
|
||||||
|
/*@import '../node_modules/@angular/material/prebuilt-themes/purple-green.css';*/
|
||||||
|
|
||||||
|
.active {
|
||||||
|
color: #efe00b;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-expansion-panel-header {
|
||||||
|
font-weight: 900;
|
||||||
|
padding: 0 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
:host ::ng-deep .mat-expansion-panel-body {
|
||||||
|
padding: 0 10px 10px 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
:host::ng-deep .mat-mdc-list-item-content, :host::ng-deep .mat-mdc-list-item-content button {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-expansion-panel-header-description {
|
||||||
|
flex-grow: 0;
|
||||||
|
}
|
||||||
159
src/app/admin/admin-menu/admin-menu.component.html
Normal file
159
src/app/admin/admin-menu/admin-menu.component.html
Normal file
|
|
@ -0,0 +1,159 @@
|
||||||
|
<mat-accordion>
|
||||||
|
<mat-expansion-panel [expanded]=true>
|
||||||
|
<mat-expansion-panel-header>
|
||||||
|
<mat-panel-title>
|
||||||
|
Baskets
|
||||||
|
</mat-panel-title>
|
||||||
|
<mat-panel-description>
|
||||||
|
<mat-icon>shopping-basket</mat-icon>
|
||||||
|
</mat-panel-description>
|
||||||
|
</mat-expansion-panel-header>
|
||||||
|
<mat-list-item *ngFor="let basket of baskets">
|
||||||
|
<button mat-button
|
||||||
|
matTooltip="{{ basket['name'] }}"
|
||||||
|
routerLink="/admin/basket/{{ basket['name'] }}"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
{{ basket['name'] }}
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
</mat-expansion-panel>
|
||||||
|
|
||||||
|
<mat-expansion-panel>
|
||||||
|
<mat-expansion-panel-header>
|
||||||
|
<mat-panel-title>
|
||||||
|
Survey
|
||||||
|
</mat-panel-title>
|
||||||
|
<mat-panel-description>
|
||||||
|
<mat-icon>gps_fixed</mat-icon>
|
||||||
|
</mat-panel-description>
|
||||||
|
</mat-expansion-panel-header>
|
||||||
|
<mat-list-item>
|
||||||
|
<button mat-button
|
||||||
|
routerLink="/admin/survey/categories"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
Categories
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
</mat-expansion-panel>
|
||||||
|
|
||||||
|
<mat-expansion-panel>
|
||||||
|
<mat-expansion-panel-header>
|
||||||
|
<mat-panel-title>
|
||||||
|
Scheduler
|
||||||
|
</mat-panel-title>
|
||||||
|
<mat-panel-description>
|
||||||
|
<mat-icon>alarm</mat-icon>
|
||||||
|
</mat-panel-description>
|
||||||
|
</mat-expansion-panel-header>
|
||||||
|
<mat-list-item>
|
||||||
|
<button mat-button
|
||||||
|
routerLink="/admin/scheduler/jobs"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
Jobs
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
<mat-list-item>
|
||||||
|
<button mat-button
|
||||||
|
routerLink="/admin/scheduler/messages"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
Messages
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
</mat-expansion-panel>
|
||||||
|
|
||||||
|
<mat-expansion-panel
|
||||||
|
*ngIf="authenticationService.isAuthorized(['manager'])"
|
||||||
|
>
|
||||||
|
<mat-expansion-panel-header>
|
||||||
|
<mat-panel-title>
|
||||||
|
Manage
|
||||||
|
</mat-panel-title>
|
||||||
|
<mat-panel-description>
|
||||||
|
<mat-icon>settings</mat-icon>
|
||||||
|
</mat-panel-description>
|
||||||
|
</mat-expansion-panel-header>
|
||||||
|
|
||||||
|
<mat-list-item>
|
||||||
|
<button mat-button
|
||||||
|
routerLink="/admin/manage/projects"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
Projects
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
|
||||||
|
<mat-list-item class='root'
|
||||||
|
*ngIf="authenticationService.isAuthorized(['manager'])"
|
||||||
|
>
|
||||||
|
<button mat-button
|
||||||
|
routerLink="/admin/manage/access"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
Access
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
|
||||||
|
<mat-list-item>
|
||||||
|
<button mat-button
|
||||||
|
routerLink="/admin/manage/integrity"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
Integrity
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
|
||||||
|
<mat-list-item>
|
||||||
|
<button mat-button
|
||||||
|
routerLink="/admin/manage/maintenance"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
Maintenance
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
|
||||||
|
<mat-list-item>
|
||||||
|
<button mat-button
|
||||||
|
routerLink="/admin/manage/points-by-orig-id"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
Points by orig. ID
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
|
||||||
|
</mat-expansion-panel>
|
||||||
|
|
||||||
|
<!-- Models are currently disabled, need fixes
|
||||||
|
<mat-expansion-panel [disabled]=true>
|
||||||
|
<mat-expansion-panel-header>
|
||||||
|
<mat-panel-title>
|
||||||
|
Models
|
||||||
|
</mat-panel-title>
|
||||||
|
</mat-expansion-panel-header>
|
||||||
|
</mat-expansion-panel>
|
||||||
|
|
||||||
|
<mat-expansion-panel
|
||||||
|
*ngFor="let menuItem of adminModelsMenuItems"
|
||||||
|
>
|
||||||
|
<mat-expansion-panel-header>
|
||||||
|
<mat-panel-title>
|
||||||
|
{{ menuItem['name'] }}
|
||||||
|
</mat-panel-title>
|
||||||
|
</mat-expansion-panel-header>
|
||||||
|
<mat-list-item
|
||||||
|
*ngFor="let item of menuItem['items']"
|
||||||
|
>
|
||||||
|
<button mat-button
|
||||||
|
matTooltip="{{ item['name'] }}"
|
||||||
|
routerLink="/admin/model/{{ item['name'] }}"
|
||||||
|
routerLinkActive="active"
|
||||||
|
>
|
||||||
|
{{ item['name'] }}
|
||||||
|
</button>
|
||||||
|
</mat-list-item>
|
||||||
|
</mat-expansion-panel>
|
||||||
|
-->
|
||||||
|
</mat-accordion>
|
||||||
25
src/app/admin/admin-menu/admin-menu.component.spec.ts
Normal file
25
src/app/admin/admin-menu/admin-menu.component.spec.ts
Normal file
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { AdminMenuComponent } from './admin-menu.component';
|
||||||
|
|
||||||
|
describe('AdminMenuComponent', () => {
|
||||||
|
let component: AdminMenuComponent;
|
||||||
|
let fixture: ComponentFixture<AdminMenuComponent>;
|
||||||
|
|
||||||
|
beforeEach(waitForAsync(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ AdminMenuComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(AdminMenuComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
17
src/app/admin/admin-menu/admin-menu.component.ts
Normal file
17
src/app/admin/admin-menu/admin-menu.component.ts
Normal file
|
|
@ -0,0 +1,17 @@
|
||||||
|
import { Component, Input } from '@angular/core'
|
||||||
|
|
||||||
|
import { AuthenticationService } from '../../_services/authentication.service'
|
||||||
|
import { AdminBasket } from '../admin-basket/data.service'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'gisaf-admin-menu',
|
||||||
|
templateUrl: './admin-menu.component.html',
|
||||||
|
styleUrls: ['./admin-menu.component.css'],
|
||||||
|
})
|
||||||
|
export class AdminMenuComponent {
|
||||||
|
@Input() adminModelsMenuItems: object[]
|
||||||
|
@Input() baskets: AdminBasket[]
|
||||||
|
constructor(
|
||||||
|
public authenticationService: AuthenticationService
|
||||||
|
) {}
|
||||||
|
}
|
||||||
29
src/app/admin/admin-resolver.service.ts
Normal file
29
src/app/admin/admin-resolver.service.ts
Normal file
|
|
@ -0,0 +1,29 @@
|
||||||
|
import { Injectable } from '@angular/core'
|
||||||
|
import { Router, Resolve, RouterStateSnapshot, ActivatedRouteSnapshot } from '@angular/router'
|
||||||
|
import { Observable, forkJoin } from 'rxjs'
|
||||||
|
import { map } from 'rxjs/operators'
|
||||||
|
|
||||||
|
import { AdminDataService } from './admin-data.service'
|
||||||
|
import { SurveyMeta } from './admin-data.service'
|
||||||
|
import { AdminBasketDataService, AdminBasket } from './admin-basket/data.service'
|
||||||
|
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class AdminResolver implements Resolve<object> {
|
||||||
|
constructor(
|
||||||
|
private router: Router,
|
||||||
|
private dataService: AdminDataService,
|
||||||
|
private basketDataService: AdminBasketDataService,
|
||||||
|
) {}
|
||||||
|
|
||||||
|
resolve(
|
||||||
|
route: ActivatedRouteSnapshot,
|
||||||
|
state: RouterStateSnapshot,
|
||||||
|
): Observable<[AdminBasket[], SurveyMeta/*, object[]*/]> {
|
||||||
|
return forkJoin(
|
||||||
|
this.basketDataService.getBaskets(),
|
||||||
|
this.dataService.getSurveyMeta(),
|
||||||
|
//this.dataService.getModelsMenuBar(),
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
105
src/app/admin/admin-routing.module.ts
Normal file
105
src/app/admin/admin-routing.module.ts
Normal file
|
|
@ -0,0 +1,105 @@
|
||||||
|
import { NgModule } from '@angular/core'
|
||||||
|
import { Routes, RouterModule } from '@angular/router'
|
||||||
|
|
||||||
|
import { AdminComponent } from './admin.component'
|
||||||
|
import { AdminAccessComponent } from './admin-manage/access/users-roles.component'
|
||||||
|
import { AdminListComponent } from './admin-list/admin-list.component'
|
||||||
|
import { AdminDetailComponent } from './admin-detail/admin-detail.component'
|
||||||
|
import { AdminBasketComponent } from './admin-basket/basket.component'
|
||||||
|
import { AdminPointsByOrigIdComponent } from './admin-manage/points-by-orig-id/points-by-orig-id.component'
|
||||||
|
import { AdminResolver } from './admin-resolver.service'
|
||||||
|
import { DetailResolver } from './admin-detail/admin-detail-resolver.service'
|
||||||
|
import { BasketResolver } from './admin-basket/admin-basket-resolver.service'
|
||||||
|
import { CategoryComponent } from './admin-manage/category/category.component'
|
||||||
|
import { CategoryResolver } from './admin-manage/category/category-resolver.service'
|
||||||
|
import { ProjectComponent } from './admin-manage/project/project.component'
|
||||||
|
import { ProjectResolver } from './admin-manage/project/project-resolver.service'
|
||||||
|
import { AdminIntegrityComponent } from './admin-manage/integrity/integrity.component'
|
||||||
|
import { AdminMaintenanceComponent } from './admin-manage/maintenance/maintenance.component'
|
||||||
|
import { AdminSchedulerJobsComponent } from './admin-scheduler/jobs.component'
|
||||||
|
import { AdminSchedulerMessagesComponent } from './admin-scheduler/messages.component'
|
||||||
|
|
||||||
|
const routes: Routes = [
|
||||||
|
{
|
||||||
|
path: '',
|
||||||
|
component: AdminComponent,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: 'basket/:name',
|
||||||
|
component: AdminBasketComponent,
|
||||||
|
resolve: {
|
||||||
|
basket: BasketResolver,
|
||||||
|
},
|
||||||
|
data: {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'manage/access',
|
||||||
|
component: AdminAccessComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'survey/categories',
|
||||||
|
component: CategoryComponent,
|
||||||
|
resolve: {
|
||||||
|
categories: CategoryResolver
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'scheduler/jobs',
|
||||||
|
component: AdminSchedulerJobsComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'scheduler/messages',
|
||||||
|
component: AdminSchedulerMessagesComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'manage/projects',
|
||||||
|
component: ProjectComponent,
|
||||||
|
resolve: {
|
||||||
|
projects: ProjectResolver
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'manage/integrity',
|
||||||
|
component: AdminIntegrityComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'manage/maintenance',
|
||||||
|
component: AdminMaintenanceComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'manage/points-by-orig-id',
|
||||||
|
component: AdminPointsByOrigIdComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'model/:modelName',
|
||||||
|
component: AdminListComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'model/:modelName/:pk',
|
||||||
|
component: AdminDetailComponent,
|
||||||
|
resolve: {
|
||||||
|
item: DetailResolver
|
||||||
|
}
|
||||||
|
},
|
||||||
|
],
|
||||||
|
resolve: {
|
||||||
|
item: AdminResolver
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
imports: [RouterModule.forChild(routes)],
|
||||||
|
exports: [RouterModule],
|
||||||
|
providers: [
|
||||||
|
AdminResolver,
|
||||||
|
//AdminAccessResolver,
|
||||||
|
BasketResolver,
|
||||||
|
CategoryResolver,
|
||||||
|
ProjectResolver,
|
||||||
|
DetailResolver,
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class AdminRoutingModule { }
|
||||||
8
src/app/admin/admin-scheduler/feature.component.css
Normal file
8
src/app/admin/admin-scheduler/feature.component.css
Normal file
|
|
@ -0,0 +1,8 @@
|
||||||
|
.container {
|
||||||
|
margin: 2px;
|
||||||
|
padding: 2px;
|
||||||
|
border-radius: 2px;
|
||||||
|
background-color: #212121;
|
||||||
|
cursor: pointer;
|
||||||
|
width: fit-content;
|
||||||
|
}
|
||||||
5
src/app/admin/admin-scheduler/feature.component.html
Normal file
5
src/app/admin/admin-scheduler/feature.component.html
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
<div class='container'
|
||||||
|
matTooltip='View on map'
|
||||||
|
(click)='show()'>
|
||||||
|
{{ feature.store }} #{{ feature.id }}
|
||||||
|
</div>
|
||||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Add table
Add a link
Reference in a new issue