cors

.gitignore

@@ -1,3 +1,5 @@
 __pycache__/
 ENV
+api/config/dbconfig.ini
+api/config/authservice.pub
 

.gitlab-ci.yml

@@ -2,6 +2,7 @@ stages:
         - check
         - build
         - dockerize
+        - deploy
 
 
 check:
@@ -55,6 +56,7 @@ build-ui:
                 - cd ui/hv2-ui
                 - if [ "$CI_COMMIT_TAG" != "" ]; then
                     sed -i -e 's/GITTAGVERSION/'"$CI_COMMIT_TAG"':'"$CI_COMMIT_SHORT_SHA"'/' ./src/app/navigation/navigation.component.html;
+                    sed -i -e 's,http://localhost:8080,https://api.hv.nober.de,' ./src/app/config.ts;
                   fi
                 - npm install
                 - ./node_modules/.bin/ng build --prod
@@ -80,4 +82,38 @@ dockerize-ui:
                     docker push $IMAGE_NAME:${CI_COMMIT_TAG};
                   fi
 
+.deploy:
+        image: registry.hottis.de/dockerized/docker-bash:latest
+        stage: deploy
+        tags:
+                - hottis
+                - linux
+                - docker
+        only:
+                - tags
+        variables:
+                GIT_STRATEGY: none
+        script:
+                - docker stop $CONTAINER_NAME || echo "container not running, never mind"
+                - docker rm $CONTAINER_NAME || echo "container not existing, never mind"
+                - docker run -d --network docker-server 
+                                --ip $CONTAINER_IP
+                                --name $CONTAINER_NAME
+                                --restart always 
+                                $IMAGE_NAME:$CI_COMMIT_TAG
 
+deploy-api:
+        extends: 
+                - .deploy
+        variables:
+                IMAGE_NAME: ${CI_REGISTRY}/${CI_PROJECT_PATH}/api
+                CONTAINER_NAME: hv2-api
+                CONTAINER_IP: 172.16.10.38
+
+deploy-ui:
+        extends: 
+                - .deploy
+        variables:
+                IMAGE_NAME: ${CI_REGISTRY}/${CI_PROJECT_PATH}/ui
+                CONTAINER_NAME: hv2-ui
+                CONTAINER_IP: 172.16.10.39

api/additional_endpoints.yaml

@@ -0,0 +1,75 @@
+# -------------------------------------------------------------------
+# ATTENTION: This file will not be parsed by Cheetah
+#            Use plain openapi/yaml syntax, no Cheetah
+#            escaping
+# -------------------------------------------------------------------
+
+
+  /v1/overhead_advances/flat/{flatId}:
+    get:
+      tags: [ "overhead_advance", "flat" ]
+      summary: Return overhead_advances by flat
+      operationId: additional_methods.get_overhead_advances_by_flat
+      parameters:
+        - name: flatId
+          in: path
+          required: true
+          schema:
+            type: integer
+      responses:
+        '200':
+          description: overhead_advances_by_flat response
+          content:
+            'application/json':
+              schema:
+                type: array
+                items:
+                  $ref: '#/components/schemas/overhead_advance'
+      security:
+      - jwt: ['secret']
+  /v1/fees/tenancy/{tenancyId}:
+    get:
+      tags: [ "fee", "tenancy" ]
+      summary: Return fees by tenancy
+      operationId: additional_methods.get_fees_by_tenancy
+      parameters:
+        - name: tenancyId
+          in: path
+          required: true
+          schema:
+            type: integer
+      responses:
+        '200':
+          description: get_fees_by_tenancy response
+          content:
+            'application/json':
+              schema:
+                type: array
+                items:
+                  $ref: '#/components/schemas/fee'
+      security:
+      - jwt: ['secret']
+  /v1/account/saldo/{accountId}:
+    get:
+      tags: [ "account" ]
+      summary: Return saldo of the account
+      operationId: additional_methods.get_account_saldo
+      parameters:
+        - name: accountId
+          in: path
+          required: true
+          schema:
+            type: integer
+      responses:
+        '200':
+          description: get_account_saldo
+          content:
+            'application/json':
+              schema:
+                type: object
+                properties:
+                  saldo:
+                    type: number
+      security:
+      - jwt: ['secret']
+

api/additional_methods.py

@@ -0,0 +1,34 @@
+
+from db import dbGetMany, dbGetOne, dbInsert, dbUpdate
+from loguru import logger
+import werkzeug
+
+
+
+
+def get_overhead_advances_by_flat(user, token_info, flatId=None):
+    return dbGetMany(user, token_info, {
+            "statement": """
+SELECT o.id ,o.description ,o.amount ,o.startdate ,o.enddate
+  FROM overhead_advance_t o, overhead_advance_flat_mapping_t m
+  WHERE o.id = m.overhead_advance and m.flat = %s""", 
+            "params": (flatId, )
+        }
+    )
+
+def get_fees_by_tenancy(user, token_info, tenancyId=None):
+    return dbGetMany(user, token_info, {
+            "statement": """
+SELECT o.id, o.description, o.amount, o.fee_type, o.startdate, o.enddate
+  FROM fee_t o, tenancy_fee_mapping_t m
+  WHERE o.id = m.fee and m.tenancy = %s""", 
+            "params": (tenancyId, )
+        }
+    )
+
+def get_account_saldo(user, token_info, accountId=None):
+    return dbGetOne(user, token_info, {
+            "statement": "SELECT sum(amount) as saldo FROM account_entry_t WHERE account=%s",
+            "params": (accountId, )
+        }
+    )

api/auth.py

@@ -8,7 +8,7 @@ JWT_PUB_KEY = ""
 try:
     JWT_PUB_KEY = os.environ["JWT_PUB_KEY"]
 except KeyError:
-    with open('/opt/app/config/authservice.pub', 'r') as f:
+    with open('./config/authservice.pub', 'r') as f:
         JWT_PUB_KEY = f.read()
 
 

api/db.py

@@ -19,7 +19,7 @@ try:
     DB_NAME = os.environ["DB_NAME"]
 except KeyError:
     config = configparser.ConfigParser()
-    config.read('/opt/app/config/dbconfig.ini')
+    config.read('./config/dbconfig.ini')
     DB_USER = config["database"]["user"]
     DB_PASS = config["database"]["pass"]
     DB_HOST = config["database"]["host"]
@@ -49,8 +49,11 @@ def execDatabaseOperation(func, params):
                                 sslmode = 'require')
         conn.autocommit = False
 
-        with conn.cursor(cursor_factory = psycopg2.extras.RealDictCursor) as cur:
-            return func(cur, params)
+        with conn:
+            with conn.cursor(cursor_factory = psycopg2.extras.RealDictCursor) as cur:
+                params["params"] = [ v if not v=='' else None for v in params["params"] ]
+                logger.debug("edo: {}".format(str(params)))
+                return func(cur, params)
     except psycopg2.Error as err:
         raise Exception("Error when connecting to database: {}".format(err))
     finally:
@@ -61,7 +64,7 @@ def execDatabaseOperation(func, params):
 
 def _opGetMany(cursor, params):
     items = []
-    cursor.execute(params["statement"])
+    cursor.execute(params["statement"], params["params"])
     for itemObj in cursor:
         logger.debug("item received {}".format(str(itemObj)))
         items.append(itemObj)
@@ -101,3 +104,19 @@ def dbGetOne(user, token_info, params):
     except Exception as e:
         logger.error(f"Exception: {e}")
         raise werkzeug.exceptions.InternalServerError
+
+def dbInsert(user, token_info, params):
+    logger.info("params: {}, token: {}".format(params, json.dumps(token_info)))
+    try:
+        return execDatabaseOperation(_opGetOne, params)
+    except Exception as e:
+        logger.error(f"Exception: {e}")
+        raise werkzeug.exceptions.InternalServerError
+
+def dbUpdate(user, token_info, params):
+    logger.info("params: {}, token: {}".format(params, json.dumps(token_info)))
+    try:
+        return execDatabaseOperation(_opGetOne, params)
+    except Exception as e:
+        logger.error(f"Exception: {e}")
+        raise werkzeug.exceptions.InternalServerError

api/methods.py.tmpl

@@ -1,4 +1,8 @@
-from db import dbGetMany, dbGetOne
+$GENERATED_PYTHON_COMMENT
+
+from db import dbGetMany, dbGetOne, dbInsert, dbUpdate
+from loguru import logger
+import werkzeug
 
 #for $table in $tables
 def get_${table.name}s(user, token_info):
@@ -10,11 +14,56 @@ SELECT
   ,$column.name
 #end for
   FROM ${table.name}_t
+#if $table.selectors
+  ORDER BY
+#set $sep = ""  
+#for $selector in $table.selectors
+    $sep$selector
+#set $sep = ","    
+#end for
+#end if  
                          """, 
             "params": ()
         }
     )
 
+def insert_${table.name}(user, token_info, **args):
+  try:
+    body = args["body"]
+#for $column in $table.columns
+    v_$column.name = body["$column.name"]
+#end for
+    return dbInsert(user, token_info, {
+      "statement": """
+INSERT INTO ${table.name}_t
+  (
+#set $sep=""
+#for $column in $table.columns
+    $sep$column.name
+#set $sep=","
+#end for   
+  ) VALUES (
+#set $sep=""
+#for $column in $table.columns
+    $sep%s
+#set $sep=","
+#end for   
+  )
+  RETURNING *
+""",
+      "params": [
+#set $sep=""
+#for $column in $table.columns
+    ${sep}v_$column.name
+#set $sep=","
+#end for   
+      ]      
+    })
+  except KeyError as e:
+    logger.warning("insert_${table.name}: parameter missing: {}".format(e))
+    raise werkzeug.exceptions.UnprocessableEntity("parameter missing: {}".format(e))
+
+
 def get_${table.name}(user, token_info, ${table.name}Id=None):
     return dbGetOne(user, token_info, {
             "statement": """
@@ -29,4 +78,62 @@ SELECT
             "params": (${table.name}Id, )
         }
     )
+
+#if (('immutable' not in $table) or (not $table.immutable))
+def update_${table.name}(user, token_info, ${table.name}Id=None, **args):
+  try:
+    body = args["body"]
+#for $column in $table.columns
+#if (('immutable' not in $column) or (not $column.immutable))
+    v_$column.name = body["$column.name"]
+#end if
+#end for
+    return dbUpdate(user, token_info, {
+      "statement": """
+UPDATE ${table.name}_t
+  SET
+#set $sep=""
+#for $column in $table.columns
+#if (('immutable' not in $column) or (not $column.immutable))
+    $sep$column.name = %s
+#end if
+#set $sep=","
+#end for   
+  WHERE id = %s
+  RETURNING *
+""",
+      "params": [
+#for $column in $table.columns
+#if (('immutable' not in $column) or (not $column.immutable))
+    v_${column.name},
+#end if
+#end for   
+    ${table.name}Id
+      ]      
+    })
+  except KeyError as e:
+    logger.warning("update_${table.name}: parameter missing: {}".format(e))
+    raise werkzeug.exceptions.UnprocessableEntity("parameter missing: {}".format(e))
+#end if
+
+#for $column in $table.columns
+#if (('foreignkey' in $column) and $column.foreignkey)
+
+def get_${table.name}_by_${column.name}(user, token_info, ${column.name}Id=None):
+    return dbGetMany(user, token_info, {
+            "statement": """
+SELECT 
+  id
+#for $innerColumn in $table.columns  
+  ,$innerColumn.name
+#end for
+  FROM ${table.name}_t
+  WHERE ${column.name} = %s
+                         """, 
+            "params": (${column.name}Id, )
+        }
+    )
+#end if
+#end for
+
 #end for

api/openapi.yaml.tmpl

@@ -1,3 +1,5 @@
+$GENERATED_YAML_COMMENT
+
 openapi: 3.0.0
 info:
   title: hv2-api
@@ -29,6 +31,27 @@ paths:
                   \$ref: '#/components/schemas/$table.name'
       security:
       - jwt: ['secret']
+    post:
+      tags: [ "$table.name" ]
+      summary: Insert a ${table.name}
+      operationId: methods.insert_${table.name}
+      requestBody:
+        description: $table.name
+        content:
+          application/json:
+            schema:
+              \$ref: '#/components/schemas/$table.name'
+      responses:
+        '200':
+          description: ${table.name} successfully inserted
+          content:
+            'application/json':
+              schema:
+                type: array
+                items:
+                  \$ref: '#/components/schemas/$table.name'
+      security:
+      - jwt: ['secret']
   /v1/${table.name}s/{${table.name}Id}:
     get:
       tags: [ "$table.name" ]
@@ -51,7 +74,64 @@ paths:
                   \$ref: '#/components/schemas/$table.name'
       security:
       - jwt: ['secret']
+#if (('immutable' not in $table) or (not $table.immutable))
+    put:
+      tags: [ "$table.name" ]
+      summary: Update a ${table.name}
+      operationId: methods.update_${table.name}
+      parameters:
+        - name: ${table.name}Id
+          in: path
+          required: true
+          schema:
+            type: integer
+      requestBody:
+        description: $table.name
+        content:
+          application/json:
+            schema:
+              \$ref: '#/components/schemas/$table.name'
+      responses:
+        '200':
+          description: ${table.name} successfully inserted
+          content:
+            'application/json':
+              schema:
+                type: array
+                items:
+                  \$ref: '#/components/schemas/$table.name'
+      security:
+      - jwt: ['secret']
+#end if
+#for $column in $table.columns
+#if (('foreignkey' in $column) and $column.foreignkey)
+  /v1/${table.name}s/${column.name}/{${column.name}Id}:
+    get:
+      tags: [ "$table.name", "$column.name" ]
+      summary: Return $table.name by $$column.name
+      operationId: methods.get_${table.name}_by_${column.name}
+      parameters:
+        - name: ${column.name}Id
+          in: path
+          required: true
+          schema:
+            type: integer
+      responses:
+        '200':
+          description: $table.name response
+          content:
+            'application/json':
+              schema:
+                type: array
+                items:
+                  \$ref: '#/components/schemas/$table.name'
+      security:
+      - jwt: ['secret']
+#end if
 #end for
+#end for
+
+#include raw "./api/additional_endpoints.yaml"
 
 components:
   securitySchemes:
@@ -71,5 +151,8 @@ components:
 #for $column in $table.columns
         $column.name:
           type: $column.apitype
+#if (('notnull' not in $column) or  (not $column.notnull))
+          nullable: true
+#end if
 #end for
 #end for          

api/run.sh

@@ -1,14 +0,0 @@
-#!/bin/bash
-
-. ENV
-
-IMAGE_NAME="registry.hottis.de/hv2/hv2-api"
-VERSION=0.0.x
-
-
-docker run \
-    -d \
-    --rm \
-    --name "hv2-api" \
-    -p 5000:5000
-    ${IMAGE_NAME}:${VERSION}

api/server.py

@@ -6,7 +6,10 @@ app = connexion.App(__name__)
 app.add_api('openapi.yaml')
 
 # CORSify it - otherwise Angular won't accept it
-CORS(app.app)
+CORS(app.app, origins=[
+    "http://localhost:4200",
+    "https://base.hv.nober.de"
+])
 
 # provide the webservice application to uwsgi
 application = app.app

api/test.py

@@ -1,8 +1,10 @@
 import connexion
 import logging
+from flask_cors import CORS
 
 logging.basicConfig(level=logging.DEBUG)
 
 app = connexion.App('hv2-api')
 app.add_api('./openapi.yaml')
+CORS(app.app)
 app.run(port=8080)

generate.py

@@ -10,9 +10,9 @@ parser.add_argument('--schema', '-s',
                     default='./schema.json')
 parser.add_argument('--template', '-t',
                     help="""Template file, templates files must be named as the final output file
-with an additional .tmpl extension. Default: all template files in the current folder.""",                    
+with an additional .tmpl extension. Default: all template files recursively from the current folder.""",                    
                     required=False,
-                    default="*.tmpl")
+                    default="**/*.tmpl")
 args = parser.parse_args()
 
 
@@ -20,7 +20,8 @@ with open(args.schema) as schemaFile:
     schema = json.load(schemaFile)
 
 for table in schema["tables"]:
-    for column in table["columns"]:
+    columns = table["columns"]
+    for column in columns:
         if column["sqltype"] == 'serial':
             column["apitype"] = 'integer'
             column["jstype"] = 'number'
@@ -33,14 +34,43 @@ for table in schema["tables"]:
         elif column["sqltype"] == 'timestamp':
             column["apitype"] = 'string'
             column["jstype"] = 'string'
+        elif column["sqltype"] == 'boolean':
+            column["apitype"] = 'boolean'
+            column["jstype"] = 'boolean'
         elif column["sqltype"].startswith('varchar'):
             column["apitype"] = 'string'
             column["jstype"] = 'string'
         elif column["sqltype"].startswith('numeric'):
             column["apitype"] = 'number'
             column["jstype"] = 'number'
+    table["selectors"] = [ y["name"] for y in sorted([ x for x in columns if "selector" in x ], key=lambda x: x["selector"])]
 
-for f in glob.glob(args.template):
+schema["GENERATED_SQL_COMMENT"] = """
+-- ----------------------------------------
+-- THIS FILE HAS BEEN GENERATED
+-- DO NOT EDIT MANUALLY
+-- ----------------------------------------
+"""
+schema["GENERATED_PYTHON_COMMENT"] = """
+# -----------------------------------------
+# THIS FILE HAS BEEN GENERATED
+# DO NOT EDIT MANUALLY
+# -----------------------------------------
+"""
+schema["GENERATED_YAML_COMMENT"] = """
+# -----------------------------------------
+# THIS FILE HAS BEEN GENERATED
+# DO NOT EDIT MANUALLY
+# -----------------------------------------
+"""
+schema["GENERATED_TS_COMMENT"] = """
+// -----------------------------------------
+// THIS FILE HAS BEEN GENERATED
+// DO NOT EDIT MANUALLY
+// -----------------------------------------
+"""
+
+for f in glob.glob(args.template, recursive=True):
     print(f"process {f}")
     tmpl = Template(file=f, searchList=[schema])
     with open(f[:-5], 'w') as outFile:

generate.sh

@@ -1,5 +0,0 @@
-#!/bin/bash
-
-find . -name \*.tmpl -exec  python generate.py --schema schema.json --template {} \;
-
-

readme.md

@@ -0,0 +1,16 @@
+# Developing in HV2 umbrella project
+
+## Tools and Templates
+
+* all tools provide should work on Linux and on Windows, shell scripts are avoided
+* templates files must be generated at development time, generated files must be put into the repository
+* use ``generate.py`` in the umbrella project's root without any arguments to generate all template files in all subdirectories using the ``schema.json`` from the umbrella project's root
+
+
+## Subprojects
+
+### API
+* to start the API set the required env variables (see ``ENV.tmp``) or the configuration files in the subdirectory ``./config`` and run ``test.py`` from the API subproject
+* make sure these configuration files are not added to the repository, they contain secrets
+* in the development environment the API will answer at ``http://localhost:8080``, the Swagger-UI is available at ``http://localhost:8080/ui``
+

schema.json

@@ -3,15 +3,15 @@
         {
             "name": "account",
             "columns": [
-                { "name": "description", "sqltype": "varchar(128)", "notnull": true }
+                { "name": "description", "sqltype": "varchar(128)", "notnull": true, "unique": true, "selector": 0 }
             ]
         },
         {
             "name": "tenant",
             "columns": [
                 { "name": "salutation", "sqltype": "varchar(128)" },
-                { "name": "firstname", "sqltype": "varchar(128)" },
-                { "name": "lastname", "sqltype": "varchar(128)" },
+                { "name": "firstname", "sqltype": "varchar(128)", "selector": 1 },
+                { "name": "lastname", "sqltype": "varchar(128)", "selector": 0 },
                 { "name": "address1", "sqltype": "varchar(128)" },
                 { "name": "address2", "sqltype": "varchar(128)" },
                 { "name": "address3", "sqltype": "varchar(128)" },
@@ -20,13 +20,16 @@
                 { "name": "phone1", "sqltype": "varchar(64)" },
                 { "name": "phone2", "sqltype": "varchar(64)" },
                 { "name": "iban", "sqltype": "varchar(64)" },
-                { "name": "account", "sqltype": "integer", "notnull": true, "foreignkey": true }
+                { "name": "account", "sqltype": "integer", "notnull": true, "foreignkey": true, "immutable": true, "unique": true }
+            ]            ,
+            "tableConstraints": [ 
+                "unique(firstname, lastname)"
             ]
         },
         {
             "name": "premise",
             "columns": [
-                { "name": "description", "sqltype": "varchar(128)" },
+                { "name": "description", "sqltype": "varchar(128)", "selector": 0, "unique": true },
                 { "name": "street", "sqltype": "varchar(128)", "notnull": true },
                 { "name": "zip", "sqltype": "varchar(10)", "notnull": true },
                 { "name": "city", "sqltype": "varchar(128)", "notnull": true }
@@ -35,84 +38,118 @@
         {
             "name": "flat",
             "columns": [
-                { "name": "description", "sqltype": "varchar(128)" },
-                { "name": "premise", "sqltype": "integer", "foreignkey": true },
+                { "name": "description", "sqltype": "varchar(128)", "selector": 1 },
+                { "name": "premise", "sqltype": "integer", "foreignkey": true, "selector": 0 },
                 { "name": "area", "sqltype": "numeric(10,2)", "notnull": true },
                 { "name": "flat_no", "sqltype": "integer" }
+            ],
+            "tableConstraints": [ 
+                "unique(description, premise)"
             ]
         },
         { 
             "name": "overhead_advance",
             "columns": [
-                { "name": "description", "sqltype": "varchar(128)" },
-                { "name": "amount", "sqltype": "numeric(10,4)", "notnull": true },
-                { "name": "startdate", "sqltype": "date" },
+                { "name": "description", "sqltype": "varchar(128)", "selector": 0, "unique": true },
+                { "name": "amount", "sqltype": "numeric(10,4)", "notnull": true, "immutable": true },
+                { "name": "startdate", "sqltype": "date", "selector": 1, "immutable": true },
                 { "name": "enddate", "sqltype": "date" }
             ]
         },
         { 
             "name": "overhead_advance_flat_mapping",
+            "immutable": true,
             "columns": [
-                { "name": "overhead_advance", "sqltype": "integer", "notnull": true, "foreignkey": true },
-                { "name": "flat", "sqltype": "integer", "notnull": true, "foreignkey": true }
+                { "name": "overhead_advance", "sqltype": "integer", "notnull": true, "foreignkey": true, "selector": 0 },
+                { "name": "flat", "sqltype": "integer", "notnull": true, "foreignkey": true, "selector": 1 }
             ]
         },
         {
             "name": "parking",
             "columns": [
-                { "name": "description", "sqltype": "varchar(128)" },
-                { "name": "premise", "sqltype": "integer", "foreignkey": true }
+                { "name": "description", "sqltype": "varchar(128)", "selector": 1 },
+                { "name": "premise", "sqltype": "integer", "foreignkey": true, "selector": 0 }
+            ],
+            "tableConstraints": [ 
+                "unique(description, premise)"
             ]
         },
         {
             "name": "commercial_premise",
             "columns": [
-                { "name": "description", "sqltype": "varchar(128)" },
-                { "name": "premise", "sqltype": "integer", "foreignkey": true }
+                { "name": "description", "sqltype": "varchar(128)", "selector": 1 },
+                { "name": "premise", "sqltype": "integer", "foreignkey": true, "selector": 0 }
+            ],
+            "tableConstraints": [ 
+                "unique(description, premise)"
             ]
         },
         {
             "name": "tenancy",
             "columns": [
-                { "name": "description", "sqltype": "varchar(128)" },
-                { "name": "tenant", "sqltype": "integer", "notnull": true, "foreignkey": true },
-                { "name": "flat", "sqltype": "integer", "notnull": false, "foreignkey": true },
-                { "name": "parking", "sqltype": "integer", "notnull": false, "foreignkey": true },
-                { "name": "commercial_premise", "sqltype": "integer", "notnull": false, "foreignkey": true },
-                { "name": "startdate", "sqltype": "date", "notnull": true },
+                { "name": "description", "sqltype": "varchar(128)", "selector": 0, "unique": true },
+                { "name": "tenant", "sqltype": "integer", "notnull": true, "foreignkey": true, "immutable": true },
+                { "name": "flat", "sqltype": "integer", "notnull": false, "foreignkey": true, "immutable": true },
+                { "name": "parking", "sqltype": "integer", "notnull": false, "foreignkey": true, "immutable": true },
+                { "name": "commercial_premise", "sqltype": "integer", "notnull": false, "foreignkey": true, "immutable": true },
+                { "name": "startdate", "sqltype": "date", "notnull": true, "selector": 1, "immutable": true },
                 { "name": "enddate", "sqltype": "date", "notnull": false }
             ],
             "tableConstraints": [ 
-                "constraint tenancy_only_one_object check ((flat is not null and parking is null and commercial_premise is null) or (flat is null and parking is not null and commercial_premise is null) or (flat is null and parking is null and commercial_premise is not null))"
+                "check ((flat is not null and parking is null and commercial_premise is null) or (flat is null and parking is not null and commercial_premise is null) or (flat is null and parking is null and commercial_premise is not null))",
+                "unique(flat, parking, commercial_premise, startdate)"
             ]
         },
         {
             "name": "fee",
             "columns": [
-                { "name": "description", "sqltype": "varchar(128)" },
-                { "name": "amount", "sqltype": "numeric(10,2)", "notnull": true },
-                { "name": "fee_type", "sqltype": "varchar(10)", "notnull": true },
-                { "name": "startdate", "sqltype": "date" },
+                { "name": "description", "sqltype": "varchar(128)", "selector": 0, "unique": true },
+                { "name": "amount", "sqltype": "numeric(10,2)", "notnull": true, "immutable": true },
+                { "name": "fee_type", "sqltype": "varchar(10)", "notnull": true, "immutable": true },
+                { "name": "startdate", "sqltype": "date", "selector": 1, "immutable": true },
                 { "name": "enddate", "sqltype": "date" }
             ],
             "tableConstraints": [
-                "constraint fee_fee_type check (fee_type = 'per_area' or fee_type = 'total')"
+                "check (fee_type = 'per_area' or fee_type = 'total')"
             ]
         },
         { 
             "name": "tenancy_fee_mapping",
+            "immutable": true,
             "columns": [
                 { "name": "tenancy", "sqltype": "integer", "notnull": true, "foreignkey": true },
                 { "name": "fee", "sqltype": "integer", "notnull": true, "foreignkey": true }
             ]
         },
+        {
+            "name": "account_entry_category",
+            "immutable": true,
+            "columns": [
+                { "name": "description", "sqltype": "varchar(128)", "notnull": true, "selector": 0, "unique": true },
+                { "name": "overhead_relevant", "sqltype": "boolean", "notnull": true, "default": "true" }
+            ]
+        },
         {
             "name": "account_entry",
+            "immutable": true,
             "columns": [
                 { "name": "description", "sqltype": "varchar(128)", "notnull": true },
                 { "name": "account", "sqltype": "integer", "notnull": true, "foreignkey": true },
                 { "name": "created_at", "sqltype": "timestamp", "notnull": true, "default": "now()" },
-                { "name": "amount", "sqltype": "numeric(10,2)", "notnull": true }
+                { "name": "amount", "sqltype": "numeric(10,2)", "notnull": true, "selector": 0 },
+                { "name": "account_entry_category", "sqltype": "integer", "notnull": true, "foreignkey": true }
+            ],
+            "tableConstraints": [ 
+                "unique(description, account, created_at)"
+            ]
+        },
+        {
+            "name": "note",
+            "immutable": true,
+            "columns": [
+                { "name": "created_at", "sqltype": "timestamp", "notnull": true, "default": "now()" },
+                { "name": "tenant", "sqltype": "integer", "notnull": true, "foreignkey": true },
+                { "name": "note", "sqltype": "varchar(4096)", "notnull": true }
             ]
         }
     ]

schema/create.sql

@@ -1,8 +1,18 @@
+
+-- ----------------------------------------
+-- THIS FILE HAS BEEN GENERATED
+-- DO NOT EDIT MANUALLY
+-- ----------------------------------------
+
+
 CREATE TABLE account_t (
   id serial not null primary key
-  ,description varchar(128)     not null 
+  ,description varchar(128)     not null     unique 
 );
 
+GRANT SELECT, INSERT, UPDATE ON account_t TO hv2;
+GRANT SELECT, UPDATE ON account_t_id_seq TO hv2;
+
 CREATE TABLE tenant_t (
   id serial not null primary key
   ,salutation varchar(128) 
@@ -16,86 +26,146 @@ CREATE TABLE tenant_t (
   ,phone1 varchar(64) 
   ,phone2 varchar(64) 
   ,iban varchar(64) 
-  ,account integer     not null   references account_t (id) 
+  ,account integer     not null   references account_t (id)     unique 
+  ,unique(firstname, lastname)
 );
 
+GRANT SELECT, INSERT, UPDATE ON tenant_t TO hv2;
+GRANT SELECT, UPDATE ON tenant_t_id_seq TO hv2;
+
 CREATE TABLE premise_t (
   id serial not null primary key
-  ,description varchar(128) 
+  ,description varchar(128)     unique 
   ,street varchar(128)     not null 
   ,zip varchar(10)     not null 
   ,city varchar(128)     not null 
 );
 
+GRANT SELECT, INSERT, UPDATE ON premise_t TO hv2;
+GRANT SELECT, UPDATE ON premise_t_id_seq TO hv2;
+
 CREATE TABLE flat_t (
   id serial not null primary key
   ,description varchar(128) 
   ,premise integer   references premise_t (id) 
   ,area numeric(10,2)     not null 
   ,flat_no integer 
+  ,unique(description, premise)
 );
 
+GRANT SELECT, INSERT, UPDATE ON flat_t TO hv2;
+GRANT SELECT, UPDATE ON flat_t_id_seq TO hv2;
+
 CREATE TABLE overhead_advance_t (
   id serial not null primary key
-  ,description varchar(128) 
+  ,description varchar(128)     unique 
   ,amount numeric(10,4)     not null 
   ,startdate date 
   ,enddate date 
 );
 
+GRANT SELECT, INSERT, UPDATE ON overhead_advance_t TO hv2;
+GRANT SELECT, UPDATE ON overhead_advance_t_id_seq TO hv2;
+
 CREATE TABLE overhead_advance_flat_mapping_t (
   id serial not null primary key
   ,overhead_advance integer     not null   references overhead_advance_t (id) 
   ,flat integer     not null   references flat_t (id) 
 );
 
+GRANT SELECT, INSERT ON overhead_advance_flat_mapping_t TO hv2;
+GRANT SELECT, UPDATE ON overhead_advance_flat_mapping_t_id_seq TO hv2;
+
 CREATE TABLE parking_t (
   id serial not null primary key
   ,description varchar(128) 
   ,premise integer   references premise_t (id) 
+  ,unique(description, premise)
 );
 
+GRANT SELECT, INSERT, UPDATE ON parking_t TO hv2;
+GRANT SELECT, UPDATE ON parking_t_id_seq TO hv2;
+
 CREATE TABLE commercial_premise_t (
   id serial not null primary key
   ,description varchar(128) 
   ,premise integer   references premise_t (id) 
+  ,unique(description, premise)
 );
 
+GRANT SELECT, INSERT, UPDATE ON commercial_premise_t TO hv2;
+GRANT SELECT, UPDATE ON commercial_premise_t_id_seq TO hv2;
+
 CREATE TABLE tenancy_t (
   id serial not null primary key
-  ,description varchar(128) 
+  ,description varchar(128)     unique 
   ,tenant integer     not null   references tenant_t (id) 
   ,flat integer   references flat_t (id) 
   ,parking integer   references parking_t (id) 
   ,commercial_premise integer   references commercial_premise_t (id) 
   ,startdate date     not null 
   ,enddate date 
-  ,constraint tenancy_only_one_object check ((flat is not null and parking is null and commercial_premise is null) or (flat is null and parking is not null and commercial_premise is null) or (flat is null and parking is null and commercial_premise is not null))
+  ,check ((flat is not null and parking is null and commercial_premise is null) or (flat is null and parking is not null and commercial_premise is null) or (flat is null and parking is null and commercial_premise is not null))
+  ,unique(flat, parking, commercial_premise, startdate)
 );
 
+GRANT SELECT, INSERT, UPDATE ON tenancy_t TO hv2;
+GRANT SELECT, UPDATE ON tenancy_t_id_seq TO hv2;
+
 CREATE TABLE fee_t (
   id serial not null primary key
-  ,description varchar(128) 
+  ,description varchar(128)     unique 
   ,amount numeric(10,2)     not null 
   ,fee_type varchar(10)     not null 
   ,startdate date 
   ,enddate date 
-  ,constraint fee_fee_type check (fee_type = 'per_area' or fee_type = 'total')
+  ,check (fee_type = 'per_area' or fee_type = 'total')
 );
 
+GRANT SELECT, INSERT, UPDATE ON fee_t TO hv2;
+GRANT SELECT, UPDATE ON fee_t_id_seq TO hv2;
+
 CREATE TABLE tenancy_fee_mapping_t (
   id serial not null primary key
   ,tenancy integer     not null   references tenancy_t (id) 
   ,fee integer     not null   references fee_t (id) 
 );
 
+GRANT SELECT, INSERT ON tenancy_fee_mapping_t TO hv2;
+GRANT SELECT, UPDATE ON tenancy_fee_mapping_t_id_seq TO hv2;
+
+CREATE TABLE account_entry_category_t (
+  id serial not null primary key
+  ,description varchar(128)     not null     unique 
+  ,overhead_relevant boolean     not null   default true 
+);
+
+GRANT SELECT, INSERT ON account_entry_category_t TO hv2;
+GRANT SELECT, UPDATE ON account_entry_category_t_id_seq TO hv2;
+
 CREATE TABLE account_entry_t (
   id serial not null primary key
   ,description varchar(128)     not null 
   ,account integer     not null   references account_t (id) 
   ,created_at timestamp     not null   default now() 
   ,amount numeric(10,2)     not null 
+  ,account_entry_category integer     not null   references account_entry_category_t (id) 
+  ,unique(description, account, created_at)
 );
 
+GRANT SELECT, INSERT ON account_entry_t TO hv2;
+GRANT SELECT, UPDATE ON account_entry_t_id_seq TO hv2;
+
+CREATE TABLE note_t (
+  id serial not null primary key
+  ,created_at timestamp     not null   default now() 
+  ,tenant integer     not null   references tenant_t (id) 
+  ,note varchar(4096)     not null 
+);
+
+GRANT SELECT, INSERT ON note_t TO hv2;
+GRANT SELECT, UPDATE ON note_t_id_seq TO hv2;
+
+
 
 

schema/create.sql.tmpl

@@ -1,3 +1,5 @@
+$GENERATED_SQL_COMMENT
+
 #for $table in $tables
 CREATE TABLE ${table.name}_t (
   id serial not null primary key
@@ -12,6 +14,9 @@ CREATE TABLE ${table.name}_t (
   #if (('foreignkey' in $column) and $column.foreignkey)
   references ${column.name}_t (id) #slurp
   #end if
+  #if (('unique' in $column) and $column.unique)
+    unique #slurp
+  #end if
   #if ('default' in $column)
   default $column.default #slurp
   #end if
@@ -24,6 +29,14 @@ CREATE TABLE ${table.name}_t (
 #end if
 );
 
+GRANT SELECT, INSERT#slurp
+#if (('immutable' not in $table) or (not $table.immutable))
+, UPDATE#slurp
+#end if
+ ON ${table.name}_t TO hv2;
+GRANT SELECT, UPDATE ON ${table.name}_t_id_seq TO hv2;
+
 #end for
 
 
+

ui/hv2-ui/package-lock.json

@@ -460,6 +460,141 @@
         "tslib": "^2.0.0"
       }
     },
+    "@angular/localize": {
+      "version": "11.0.9",
+      "resolved": "https://registry.npmjs.org/@angular/localize/-/localize-11.0.9.tgz",
+      "integrity": "sha512-5NtyqCcBN8G6muXpyrHuVHTdD9slpyUAl6vF6NbyejgVeuV35wPXwIa+3qauPiVlFGEBQpn/uKAU57mVGm8WUg==",
+      "dev": true,
+      "requires": {
+        "@babel/core": "7.8.3",
+        "glob": "7.1.2",
+        "yargs": "^16.1.1"
+      },
+      "dependencies": {
+        "@babel/core": {
+          "version": "7.8.3",
+          "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.8.3.tgz",
+          "integrity": "sha512-4XFkf8AwyrEG7Ziu3L2L0Cv+WyY47Tcsp70JFmpftbAA1K7YL/sgE9jh9HyNj08Y/U50ItUchpN0w6HxAoX1rA==",
+          "dev": true,
+          "requires": {
+            "@babel/code-frame": "^7.8.3",
+            "@babel/generator": "^7.8.3",
+            "@babel/helpers": "^7.8.3",
+            "@babel/parser": "^7.8.3",
+            "@babel/template": "^7.8.3",
+            "@babel/traverse": "^7.8.3",
+            "@babel/types": "^7.8.3",
+            "convert-source-map": "^1.7.0",
+            "debug": "^4.1.0",
+            "gensync": "^1.0.0-beta.1",
+            "json5": "^2.1.0",
+            "lodash": "^4.17.13",
+            "resolve": "^1.3.2",
+            "semver": "^5.4.1",
+            "source-map": "^0.5.0"
+          }
+        },
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "dev": true,
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "cliui": {
+          "version": "7.0.4",
+          "resolved": "https://registry.npmjs.org/cliui/-/cliui-7.0.4.tgz",
+          "integrity": "sha512-OcRE68cOsVMXp1Yvonl/fzkQOyjLSu/8bhPDfQt0e0/Eb283TKP20Fs2MqoPsr9SwA595rRCA+QMzYc9nBP+JQ==",
+          "dev": true,
+          "requires": {
+            "string-width": "^4.2.0",
+            "strip-ansi": "^6.0.0",
+            "wrap-ansi": "^7.0.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "dev": true,
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+          "dev": true
+        },
+        "glob": {
+          "version": "7.1.2",
+          "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz",
+          "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==",
+          "dev": true,
+          "requires": {
+            "fs.realpath": "^1.0.0",
+            "inflight": "^1.0.4",
+            "inherits": "2",
+            "minimatch": "^3.0.4",
+            "once": "^1.3.0",
+            "path-is-absolute": "^1.0.0"
+          }
+        },
+        "semver": {
+          "version": "5.7.1",
+          "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+          "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+          "dev": true
+        },
+        "source-map": {
+          "version": "0.5.7",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz",
+          "integrity": "sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=",
+          "dev": true
+        },
+        "wrap-ansi": {
+          "version": "7.0.0",
+          "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+          "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+          "dev": true,
+          "requires": {
+            "ansi-styles": "^4.0.0",
+            "string-width": "^4.1.0",
+            "strip-ansi": "^6.0.0"
+          }
+        },
+        "y18n": {
+          "version": "5.0.8",
+          "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+          "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+          "dev": true
+        },
+        "yargs": {
+          "version": "16.2.0",
+          "resolved": "https://registry.npmjs.org/yargs/-/yargs-16.2.0.tgz",
+          "integrity": "sha512-D1mvvtDG0L5ft/jGWkLpG1+m0eQxOfaBvTNELraWj22wSVUMWxZUvYgJYcKh6jGGIkJFhH4IZPQhR4TKpc8mBw==",
+          "dev": true,
+          "requires": {
+            "cliui": "^7.0.2",
+            "escalade": "^3.1.1",
+            "get-caller-file": "^2.0.5",
+            "require-directory": "^2.1.1",
+            "string-width": "^4.2.0",
+            "y18n": "^5.0.5",
+            "yargs-parser": "^20.2.2"
+          }
+        },
+        "yargs-parser": {
+          "version": "20.2.9",
+          "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-20.2.9.tgz",
+          "integrity": "sha512-y11nGElTIV+CT3Zv9t7VKl+Q3hTQoT9a1Qzezhhl6Rp21gJ/IVTW7Z3y9EWXhuUBC2Shnf+DX0antecpAwSP8w==",
+          "dev": true
+        }
+      }
+    },
     "@angular/material": {
       "version": "11.2.13",
       "resolved": "https://registry.npmjs.org/@angular/material/-/material-11.2.13.tgz",
@@ -468,6 +603,14 @@
         "tslib": "^2.0.0"
       }
     },
+    "@angular/material-moment-adapter": {
+      "version": "11.2.13",
+      "resolved": "https://registry.npmjs.org/@angular/material-moment-adapter/-/material-moment-adapter-11.2.13.tgz",
+      "integrity": "sha512-KDD7QcfePpwvPG3HYy4kA8Ju222fUZeoyGXxFVE98KgaIIHrTRIGPFLHbpzxIl+AYVgJcW2OiIXKLI09FiYirg==",
+      "requires": {
+        "tslib": "^2.0.0"
+      }
+    },
     "@angular/platform-browser": {
       "version": "11.0.9",
       "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-11.0.9.tgz",
@@ -7618,6 +7761,11 @@
         "minimist": "^1.2.5"
       }
     },
+    "moment": {
+      "version": "2.29.1",
+      "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz",
+      "integrity": "sha512-kHmoybcPV8Sqy59DwNDY3Jefr64lK/by/da0ViFcuA4DH0vQg5Q6Ze5VimxkfQNSC+Mls/Kx53s7TjP1RhFEDQ=="
+    },
     "move-concurrently": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz",

ui/hv2-ui/package.json

@@ -9,7 +9,6 @@
     "lint": "ng lint",
     "e2e": "ng e2e",
     "generate": "python ../helpers/hv2-api/generate.py -s ../helpers/hv2-api/schema.json -t ./src/app/*.tmpl"
-
   },
   "private": true,
   "dependencies": {
@@ -20,10 +19,12 @@
     "@angular/core": "~11.0.6",
     "@angular/forms": "~11.0.6",
     "@angular/material": "^11.2.13",
+    "@angular/material-moment-adapter": "^11.2.13",
     "@angular/platform-browser": "~11.0.6",
     "@angular/platform-browser-dynamic": "~11.0.6",
     "@angular/router": "~11.0.6",
     "jwt-decode": "^3.1.2",
+    "moment": "^2.29.1",
     "rxjs": "~6.6.0",
     "tslib": "^2.0.0",
     "zone.js": "~0.10.2"
@@ -32,6 +33,7 @@
     "@angular-devkit/build-angular": "~0.1100.6",
     "@angular/cli": "~11.0.6",
     "@angular/compiler-cli": "~11.0.6",
+    "@angular/localize": "^11.0.9",
     "@types/jasmine": "~3.6.0",
     "@types/node": "^12.11.1",
     "codelyzer": "^6.0.0",

ui/hv2-ui/src/app/account/account.component.css

@@ -0,0 +1,33 @@
+table {
+    width: 75%;
+    border-spacing: 20px;
+}
+
+.spacer {
+    flex: 1 1 auto;
+}
+
+#addEntryfield {
+    margin-right: 15px;
+}
+
+#divider {
+    margin-top: 20px;
+}
+
+#firstblock {
+    margin-bottom: 20px;
+}
+
+#secondblock {
+    margin-top: 20px;
+}
+
+.rightaligned {
+    text-align: right;
+}
+
+.large {
+    font-size: large;
+}
+

ui/hv2-ui/src/app/account/account.component.html

@@ -0,0 +1,76 @@
+<mat-card class="defaultCard">
+    <mat-card-header>
+        <mat-card-title>
+            {{account?.description}} ({{account?.id}})
+        </mat-card-title>
+    </mat-card-header>
+    <mat-card-content>
+        <mat-accordion>
+            <mat-expansion-panel (opened)="collapse = true"
+                                (closed)="collapse = false">
+                <mat-expansion-panel-header>
+                    <mat-panel-title *ngIf="!collapse">
+                        Kontoübersicht, Saldo: {{saldo?.saldo | number:'1.2-2'}} €
+                    </mat-panel-title>
+                    <mat-panel-description>
+                    </mat-panel-description>
+                </mat-expansion-panel-header>
+    <div id="firstBlock">
+            <form (ngSubmit)="addAccountEntry()">
+                <mat-form-field appearance="outline" id="addEntryfield">
+                    <mat-label>Datum</mat-label>
+                    <input matInput name="createdAt" [(ngModel)]="newAccountEntry.created_at" [matDatepicker]="createdAtPicker"/>
+                    <mat-datepicker-toggle matSuffix [for]="createdAtPicker"></mat-datepicker-toggle>
+                    <mat-datepicker #createdAtPicker></mat-datepicker>
+                </mat-form-field>
+                <mat-form-field appearance="outline">
+                    <mat-label>Kategorie</mat-label>
+                    <mat-select [(ngModel)]="newAccountEntry.account_entry_category" name="category" disabled="shallBeRentPayment">
+                        <mat-option *ngFor="let p of accountEntryCategories" [value]="p.id">{{p.description}}</mat-option>
+                    </mat-select>
+                </mat-form-field>
+                <mat-form-field appearance="outline">
+                    <mat-label>Betrag (€)</mat-label>
+                    <input matInput type="number" name="amount" [(ngModel)]="newAccountEntry.amount"/>
+                </mat-form-field>
+                <mat-form-field appearance="outline">
+                    <mat-label>Beschreibung</mat-label>
+                    <input matInput name="description" [(ngModel)]="newAccountEntry.description"/>
+                </mat-form-field>
+                <button #addAccountEntryButton type="submit" mat-raised-button color="primary">Buchung speichern</button>
+            </form>
+        </div>
+        <div class="large">
+            Saldo: {{saldo?.saldo | number:'1.2-2'}} €
+        </div>
+        <div id="secondBlock">
+            <table mat-table [dataSource]="accountEntriesDataSource" #zftable>
+                <ng-container matColumnDef="createdAt">
+                    <th mat-header-cell *matHeaderCellDef>Datum</th>
+                    <td mat-cell *matCellDef="let element">{{element.rawAccountEntry.created_at | date}}</td>
+                </ng-container>
+                <ng-container matColumnDef="description">
+                    <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                    <td mat-cell *matCellDef="let element">{{element.rawAccountEntry.description}}</td>
+                </ng-container>
+                <ng-container matColumnDef="amount">
+                    <th mat-header-cell *matHeaderCellDef>Betrag</th>
+                    <td mat-cell *matCellDef="let element" class="rightaligned">{{element.rawAccountEntry.amount | number:'1.2-2'}} €</td>
+                </ng-container>
+                <ng-container matColumnDef="category">
+                    <th mat-header-cell *matHeaderCellDef>Kategorie</th>
+                    <td mat-cell *matCellDef="let element">{{element.accountEntryCategory}}</td>
+                </ng-container>
+                <ng-container matColumnDef="overhead_relevant">
+                    <th mat-header-cell *matHeaderCellDef>BK relevant</th>
+                    <td mat-cell *matCellDef="let element">{{element.overheadRelevant}}</td>
+                </ng-container>
+                <tr mat-header-row *matHeaderRowDef="accountEntriesDisplayedColumns"></tr>
+                <tr mat-row *matRowDef="let row; columns: accountEntriesDisplayedColumns;"></tr>
+            </table>
+        </div>
+    </mat-expansion-panel>
+</mat-accordion>
+
+    </mat-card-content>
+</mat-card>

ui/hv2-ui/src/app/account/account.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AccountComponent } from './account.component';
+
+describe('AccountComponent', () => {
+  let component: AccountComponent;
+  let fixture: ComponentFixture<AccountComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ AccountComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AccountComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/account/account.component.ts

@@ -0,0 +1,139 @@
+import { Component, Input, OnInit, OnChanges, ViewChild } from '@angular/core';
+import { MatButton } from '@angular/material/button';
+import { MatTableDataSource } from '@angular/material/table';
+import { AccountEntryCategoryService, AccountEntryService, AccountService } from '../data-object-service';
+import { Account, AccountEntry, AccountEntryCategory, NULL_AccountEntry } from '../data-objects';
+import { ExtApiService } from '../ext-data-object-service';
+import { Saldo } from '../ext-data-objects';
+import { MessageService } from '../message.service';
+
+
+
+interface DN_AccountEntry {
+  rawAccountEntry: AccountEntry
+  accountEntryCategory: string
+  overheadRelevant: boolean
+}
+
+
+@Component({
+  selector: 'app-account',
+  templateUrl: './account.component.html',
+  styleUrls: ['./account.component.css']
+})
+export class AccountComponent implements OnInit {
+
+  @Input() selectedAccountId: number
+  @Input() shallBeRentPayment: boolean
+  @ViewChild('addAccountEntryButton') addAccountEntryButton: MatButton
+
+  collapse: boolean = false
+
+  account: Account
+  accountEntries: DN_AccountEntry[]
+  accountEntriesDataSource: MatTableDataSource<DN_AccountEntry>
+  accountEntriesDisplayedColumns: string[] = [ "description", "amount", "createdAt", "category", "overhead_relevant" ]
+  saldo: Saldo
+
+  accountEntryCategories: AccountEntryCategory[]
+  accountEntryCategoriesMap: Map<number, AccountEntryCategory>
+  accountEntryCategoriesInverseMap: Map<string, AccountEntryCategory>
+
+  newAccountEntry: AccountEntry = NULL_AccountEntry
+
+
+  constructor(
+    private accountService: AccountService,
+    private accountEntryService: AccountEntryService,
+    private extApiService: ExtApiService,
+    private accountEntryCategoryService: AccountEntryCategoryService,
+    private messageService: MessageService
+  ) { }
+
+  async getAccount(): Promise<void> {
+    try {
+      if (this.selectedAccountId) {
+        this.messageService.add(`Trying to load account ${this.selectedAccountId} and entries`)
+        this.account = await this.accountService.getAccount(this.selectedAccountId)
+        this.messageService.add(`Account: ${JSON.stringify(this.account, undefined, 4)}`)
+        this.getAccountEntries()
+      }
+    } catch (err) {
+      this.messageService.add(`Error in getAccount: ${JSON.stringify(err, undefined, 4)}`)
+    }
+  }
+
+  async getAccountEntries(): Promise<void> {
+    try {
+      const rawAccountEntries = await this.accountEntryService.getAccountEntrysByAccount(this.selectedAccountId)
+      rawAccountEntries.reverse()
+      this.messageService.add(`AccountEntries: ${JSON.stringify(rawAccountEntries, undefined, 4)}`)
+      this.accountEntries = []
+      for (let f of rawAccountEntries) {
+        this.accountEntries.push({
+          rawAccountEntry: f,
+          accountEntryCategory: this.accountEntryCategoriesMap.get(f.account_entry_category).description,
+          overheadRelevant: this.accountEntryCategoriesMap.get(f.account_entry_category).overhead_relevant
+        })
+      }
+
+      this.accountEntriesDataSource = new MatTableDataSource<DN_AccountEntry>(this.accountEntries)
+      this.saldo = await this.extApiService.getAccountSaldo(this.selectedAccountId)
+    } catch (err) {
+      throw err
+
+      this.messageService.add(`Error in getAccountEntries: ${JSON.stringify(err, undefined, 4)}`)
+    }
+  }
+
+  async addAccountEntry(): Promise<void> {
+      try {
+        this.addAccountEntryButton.disabled = true
+        this.newAccountEntry.account = this.account.id
+        this.messageService.add(`addAccountEntry: ${ JSON.stringify(this.newAccountEntry, undefined, 4) }`)
+        this.newAccountEntry = await this.accountEntryService.postAccountEntry(this.newAccountEntry)
+        this.messageService.add(`New accountEntry created: ${this.newAccountEntry.id}`)
+        this.newAccountEntry = { 'account': this.account.id, 'amount': undefined, 'created_at': '', 'description': '', 'id': 0, 'account_entry_category': 0 }
+        this.getAccountEntries()
+      } catch (err) {
+        this.messageService.add(`Error in addAccountEntry: ${JSON.stringify(err, undefined, 4)}`)
+        } finally {
+        this.addAccountEntryButton.disabled = false
+      }
+  }
+
+  async getAccountEntryCategories(): Promise<void> {
+    try {
+      this.accountEntryCategories = await this.accountEntryCategoryService.getAccountEntryCategorys()
+      this.accountEntryCategoriesMap = new Map<number, AccountEntryCategory>()
+      this.accountEntryCategoriesInverseMap = new Map<string, AccountEntryCategory>()
+      for (let p of this.accountEntryCategories) {
+        this.accountEntryCategoriesMap.set(p.id, p)
+        this.accountEntryCategoriesInverseMap.set(p.description, p)
+      }
+
+      this.messageService.add(`getAccountEntryCategories: ${JSON.stringify(this.accountEntryCategories, undefined, 4)}`)
+    } catch (err) {
+      this.messageService.add(`Error in getAccountEntryCategories: ${JSON.stringify(err, undefined, 4)}`)
+    }
+  }
+
+  private async init(): Promise<void> {
+    this.messageService.add(`AccountComponent.init, account: ${this.selectedAccountId}`)
+    this.getAccount()
+    await this.getAccountEntryCategories()
+    if (this.shallBeRentPayment) {
+      this.messageService.add('shall be rentpayment')
+      this.newAccountEntry.account_entry_category = this.accountEntryCategoriesInverseMap.get('Mietzahlung').id
+    }
+  }
+
+  ngOnInit(): void {
+    this.init()
+  }
+
+  ngOnChanges(): void {
+    this.init()
+  }
+
+}

ui/hv2-ui/src/app/app-routing.module.ts

@@ -3,12 +3,44 @@ import { RouterModule, Routes } from '@angular/router';
 import { AuthGuardService } from './auth-guard.service';
 import { LoginComponent } from './login/login.component';
 import { LogoutComponent } from './logout/logout.component';
-import { TestOutputComponent } from './test-output/test-output.component';
-
+import { MyTenantsComponent } from './my-tenants/my-tenants.component';
+import { MyPremisesComponent } from './my-premises/my-premises.component';
+import { MyFlatsComponent } from './my-flats/my-flats.component';
+import { MyParkingsComponent } from './my-parkings/my-parkings.component';
+import { MyCommercialUnitsComponent } from './my-commercial-units/my-commercial-units.component';
+import { TenantDetailsComponent } from './tenant-details/tenant-details.component';
+import { PremiseDetailsComponent } from './premise-details/premise-details.component';
+import { FlatDetailsComponent } from './flat-details/flat-details.component';
+import { ParkingDetailsComponent } from './parking-details/parking-details.component';
+import { CommercialUnitDetailsComponent } from './commercial-unit-details/commercial-unit-details.component';
+import { OverheadAdvanceListComponent } from './overhead-advance-list/overhead-advance-list.component';
+import { OverheadAdvanceDetailsComponent } from './overhead-advance-details/overhead-advance-details.component';
+import { FeeListComponent } from './fee-list/fee-list.component';
+import { FeeDetailsComponent } from './fee-details/fee-details.component';
 
 
 const routes: Routes = [
-  { path: 'test', component: TestOutputComponent, canActivate: [ AuthGuardService ] },
+  { path: 'tenants', component: MyTenantsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'premises', component: MyPremisesComponent, canActivate: [ AuthGuardService ] },
+  { path: 'flats', component: MyFlatsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'parkings', component: MyParkingsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'commercialunits', component: MyCommercialUnitsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'tenant/:id', component: TenantDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'tenant', component: TenantDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'premise/:id', component: PremiseDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'premise', component: PremiseDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'flat/:id', component: FlatDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'flat', component: FlatDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'parking/:id', component: ParkingDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'parking', component: ParkingDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'commercialunit/:id', component: CommercialUnitDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'commercialunit', component: CommercialUnitDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'overheadadvances', component: OverheadAdvanceListComponent, canActivate: [ AuthGuardService ] },
+  { path: 'overheadadvance/:id', component: OverheadAdvanceDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'overheadadvance', component: OverheadAdvanceDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'fees', component: FeeListComponent, canActivate: [ AuthGuardService ] },
+  { path: 'fee/:id', component: FeeDetailsComponent, canActivate: [ AuthGuardService ] },
+  { path: 'fee', component: FeeDetailsComponent, canActivate: [ AuthGuardService ] },
   { path: 'logout', component: LogoutComponent },
   { path: 'login', component: LoginComponent }
 ]

ui/hv2-ui/src/app/app.module.ts

@@ -1,5 +1,7 @@
 import { BrowserModule } from '@angular/platform-browser';
-import { NgModule } from '@angular/core';
+import { LOCALE_ID, NgModule } from '@angular/core';
+import localeDe from '@angular/common/locales/de';
+import { registerLocaleData } from '@angular/common';
 
 import { AppComponent } from './app.component';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
@@ -21,7 +23,31 @@ import { LogoutComponent } from './logout/logout.component';
 import { LoginComponent } from './login/login.component';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { MatInputModule } from '@angular/material/input';
+import { MatFormFieldModule } from '@angular/material/form-field'
+import { MyTenantsComponent } from './my-tenants/my-tenants.component';
+import { MatTableModule } from '@angular/material/table';
+import { MyPremisesComponent } from './my-premises/my-premises.component';
+import { MyFlatsComponent } from './my-flats/my-flats.component';
+import { MyParkingsComponent } from './my-parkings/my-parkings.component';
+import { MyCommercialUnitsComponent } from './my-commercial-units/my-commercial-units.component';
+import { TenantDetailsComponent } from './tenant-details/tenant-details.component';
+import { PremiseDetailsComponent } from './premise-details/premise-details.component';
+import { FlatDetailsComponent } from './flat-details/flat-details.component';
+import { MatSelectModule } from '@angular/material/select';
+import { ParkingDetailsComponent } from './parking-details/parking-details.component';
+import { CommercialUnitDetailsComponent } from './commercial-unit-details/commercial-unit-details.component';
+import { OverheadAdvanceListComponent } from './overhead-advance-list/overhead-advance-list.component';
+import { OverheadAdvanceDetailsComponent } from './overhead-advance-details/overhead-advance-details.component'
+import { MatDatepickerModule } from '@angular/material/datepicker'
+import { MatNativeDateModule } from '@angular/material/core';
+import { FeeListComponent } from './fee-list/fee-list.component';
+import { FeeDetailsComponent } from './fee-details/fee-details.component';
+import { MatExpansionModule } from '@angular/material/expansion';
+import { AccountComponent } from './account/account.component';
+import { NoteComponent } from './note/note.component'
+import { MatMomentDateModule, MAT_MOMENT_DATE_ADAPTER_OPTIONS } from '@angular/material-moment-adapter'
 
+registerLocaleData(localeDe)
 
 @NgModule({
   declarations: [
@@ -30,7 +56,23 @@ import { MatInputModule } from '@angular/material/input';
     MessagesComponent,
     TestOutputComponent,
     LogoutComponent,
-    LoginComponent
+    LoginComponent,
+    MyTenantsComponent,
+    MyPremisesComponent,
+    MyFlatsComponent,
+    MyParkingsComponent,
+    MyCommercialUnitsComponent,
+    TenantDetailsComponent,
+    PremiseDetailsComponent,
+    FlatDetailsComponent,
+    ParkingDetailsComponent,
+    CommercialUnitDetailsComponent,
+    OverheadAdvanceListComponent,
+    OverheadAdvanceDetailsComponent,
+    FeeListComponent,
+    FeeDetailsComponent,
+    AccountComponent,
+    NoteComponent
   ],
   imports: [
     BrowserModule,
@@ -46,11 +88,22 @@ import { MatInputModule } from '@angular/material/input';
     AppRoutingModule,
     FormsModule,
     ReactiveFormsModule,
-    MatInputModule
+    MatTableModule,
+    MatInputModule,
+    MatFormFieldModule,
+    MatSelectModule,
+    MatDatepickerModule,
+    MatNativeDateModule,
+    MatExpansionModule
+  ],
+  exports: [
+    MatMomentDateModule
   ],
   providers: [
     { provide: HTTP_INTERCEPTORS, useClass: ErrorHandlerInterceptor, multi: true },
-    { provide: HTTP_INTERCEPTORS, useClass: AuthHandlerInterceptor, multi: true }
+    { provide: HTTP_INTERCEPTORS, useClass: AuthHandlerInterceptor, multi: true },
+    { provide: LOCALE_ID, useValue: 'de' },
+    { provide: MAT_MOMENT_DATE_ADAPTER_OPTIONS, useValue: { useUtc: true } }
   ],
   bootstrap: [AppComponent]
 })

ui/hv2-ui/src/app/auth-handler.interceptor.ts

@@ -8,6 +8,8 @@ import {
 import { Observable } from 'rxjs';
 import { MessageService } from './message.service';
 import { TokenService } from './token.service';
+import { serviceBaseUrl } from './config';
+
 
 @Injectable()
 export class AuthHandlerInterceptor implements HttpInterceptor {
@@ -15,8 +17,12 @@ export class AuthHandlerInterceptor implements HttpInterceptor {
   constructor(private tokenService: TokenService, private messageService: MessageService) {}
 
   intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
-    const token = localStorage.getItem(TokenService.Id_Token_Key)
-    if (request.url.includes('api.hv.nober.de') && token) {
+    const token = localStorage.getItem(TokenService.Id_AuthToken_Key)
+    if (request.url.includes(serviceBaseUrl) && token) {
+      this.messageService.add("start refresh of tokens")
+      this.tokenService.refresh()
+
+      this.messageService.add("api request intercepted")
       const clone = request.clone({
         setHeaders: { Authorization: `Bearer ${token}`}
       })

ui/hv2-ui/src/app/commercial-unit-details/commercial-unit-details.component.html

@@ -0,0 +1,31 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                {{commercialPremise?.description}} {{premise?.description}}
+            </mat-card-title>
+            <mat-card-subtitle>
+                ID: {{commercialPremise?.id}}
+            </mat-card-subtitle>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <form (ngSubmit)="saveCommercialPremise()">
+                    <div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Beschreibung</mat-label>
+                            <input matInput name="description" [(ngModel)]="commercialPremise.description"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Haus</mat-label>
+                            <mat-select [(ngModel)]="commercialPremise.premise" name="premise">
+                                <mat-option *ngFor="let p of premises" [value]="p.id">{{p.description}}</mat-option>
+                            </mat-select>
+                        </mat-form-field>
+                    </div>
+                    <button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
+                </form>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/commercial-unit-details/commercial-unit-details.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { CommercialUnitDetailsComponent } from './commercial-unit-details.component';
+
+describe('CommercialUnitDetailsComponent', () => {
+  let component: CommercialUnitDetailsComponent;
+  let fixture: ComponentFixture<CommercialUnitDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ CommercialUnitDetailsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(CommercialUnitDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/commercial-unit-details/commercial-unit-details.component.ts

@@ -0,0 +1,79 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { MatButton } from '@angular/material/button';
+import { ActivatedRoute, Router } from '@angular/router';
+import { CommercialPremiseService, PremiseService } from '../data-object-service';
+import { NULL_CommercialPremise, NULL_Premise, CommercialPremise, Premise } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-commercial-unit-details',
+  templateUrl: './commercial-unit-details.component.html',
+  styleUrls: ['./commercial-unit-details.component.css']
+})
+export class CommercialUnitDetailsComponent implements OnInit {
+
+  @ViewChild('submitButton') submitButton: MatButton
+  
+  commercialPremise: CommercialPremise = NULL_CommercialPremise
+  premise: Premise = NULL_Premise
+
+  premises: Premise[]
+
+  constructor(
+    private commercialPremiseService: CommercialPremiseService,
+    private premiseService: PremiseService,
+    private messageService: MessageService,
+    private route: ActivatedRoute,
+    private router: Router
+  ) { }
+
+
+
+  async getCommercialPremise(): Promise<void> {
+    try {
+      const id = +this.route.snapshot.paramMap.get('id')
+      if (id != 0) {
+        this.commercialPremise = await this.commercialPremiseService.getCommercialPremise(id)
+        this.premise = await this.premiseService.getPremise(this.commercialPremise.premise)
+      }
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  async getPremises(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load premises")
+      this.premises = await this.premiseService.getPremises()
+      this.messageService.add("Premises loaded")
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+  
+  async saveCommercialPremise() {
+    try {
+      this.submitButton.disabled = true
+      this.messageService.add(`saveCommercialPremise: ${ JSON.stringify(this.commercialPremise, undefined, 4) }`)
+      if (this.commercialPremise.id == 0) {
+        this.messageService.add("about to insert new commercialPremise")
+        this.commercialPremise = await this.commercialPremiseService.postCommercialPremise(this.commercialPremise)
+        this.messageService.add(`Successfully added commercialPremise with id ${this.commercialPremise.id}`)
+      } else {
+        this.messageService.add("about to update existing commercialPremise")
+        this.commercialPremise = await this.commercialPremiseService.putCommercialPremise(this.commercialPremise)
+        this.messageService.add(`Successfully changed commercialPremise with id ${this.commercialPremise.id}`)
+      }
+      this.router.navigate(['/commercialunits'])
+    } finally {
+      this.submitButton.disabled = false
+    }
+  }
+
+
+  ngOnInit(): void {
+    this.getPremises()
+    this.getCommercialPremise()
+  }
+
+}

ui/hv2-ui/src/app/config.ts

@@ -1,2 +1,5 @@
-export const serviceBaseUrl = "https://api.hv.nober.de";
+// export const serviceBaseUrl = "https://api.hv.nober.de";
 // export const serviceBaseUrl = "http://172.16.10.38:5000";
+export const serviceBaseUrl = "http://localhost:8080"
+export const authserviceBaseUrl = "https://authservice.hottis.de"
+export const applicationId = "hv2"

ui/hv2-ui/src/app/data-object-service.ts

@@ -1,6 +1,13 @@
+
+// -----------------------------------------
+// THIS FILE HAS BEEN GENERATED
+// DO NOT EDIT MANUALLY
+// -----------------------------------------
+
+
+
 import { Injectable } from '@angular/core';
-import { Observable, of } from 'rxjs';
-import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { HttpClient } from '@angular/common/http';
 
 import { MessageService } from './message.service';
 import { serviceBaseUrl } from './config';
@@ -17,124 +24,494 @@ import { CommercialPremise } from './data-objects';
 import { Tenancy } from './data-objects';
 import { Fee } from './data-objects';
 import { TenancyFeeMapping } from './data-objects';
+import { AccountEntryCategory } from './data-objects';
 import { AccountEntry } from './data-objects';
-
-
-@Injectable({
-  providedIn: 'root'
-})
+import { Note } from './data-objects';
 
 
 
 
 
 
+
+
+@Injectable({ providedIn: 'root' })
 export class AccountService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getAccount(): Promise<Account> {
-    this.messageService.add(`AccountService: fetch data`);
-    return this.http.get<Account>(`${serviceBaseUrl}/v1/account`).toPromise()
+  async getAccounts(): Promise<Account[]> {
+    this.messageService.add(`AccountService: get data`);
+    return this.http.get<Account[]>(`${serviceBaseUrl}/v1/accounts`).toPromise()
   }
+
+  async getAccount(id: number): Promise<Account> {
+    this.messageService.add(`AccountService: get data for ${id}`);
+    return this.http.get<Account>(`${serviceBaseUrl}/v1/accounts/${id}`).toPromise()
+  }
+
+  async postAccount(item: Account): Promise<Account> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`AccountService: post data for ${itemStr}`);
+    return this.http.post<Account>(`${serviceBaseUrl}/v1/accounts`, item).toPromise()
+  }
+
+  async putAccount(item: Account): Promise<Account> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`AccountService: put data for ${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<Account>(`${serviceBaseUrl}/v1/accounts/${id}`, item).toPromise()
+  }
+
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class TenantService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getTenant(): Promise<Tenant> {
-    this.messageService.add(`TenantService: fetch data`);
-    return this.http.get<Tenant>(`${serviceBaseUrl}/v1/tenant`).toPromise()
+  async getTenants(): Promise<Tenant[]> {
+    this.messageService.add(`TenantService: get data`);
+    return this.http.get<Tenant[]>(`${serviceBaseUrl}/v1/tenants`).toPromise()
   }
+
+  async getTenant(id: number): Promise<Tenant> {
+    this.messageService.add(`TenantService: get data for ${id}`);
+    return this.http.get<Tenant>(`${serviceBaseUrl}/v1/tenants/${id}`).toPromise()
+  }
+
+  async postTenant(item: Tenant): Promise<Tenant> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`TenantService: post data for ${itemStr}`);
+    return this.http.post<Tenant>(`${serviceBaseUrl}/v1/tenants`, item).toPromise()
+  }
+
+  async putTenant(item: Tenant): Promise<Tenant> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`TenantService: put data for ${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<Tenant>(`${serviceBaseUrl}/v1/tenants/${id}`, item).toPromise()
+  }
+
+
+  async getTenantsByAccount(id: number): Promise<Tenant[]> {
+    this.messageService.add(`TenantService: get data by Account ${id}`);
+    return this.http.get<Tenant[]>(`${serviceBaseUrl}/v1/tenants/account/${id}`).toPromise()
+  }
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class PremiseService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getPremise(): Promise<Premise> {
-    this.messageService.add(`PremiseService: fetch data`);
-    return this.http.get<Premise>(`${serviceBaseUrl}/v1/premise`).toPromise()
+  async getPremises(): Promise<Premise[]> {
+    this.messageService.add(`PremiseService: get data`);
+    return this.http.get<Premise[]>(`${serviceBaseUrl}/v1/premises`).toPromise()
   }
+
+  async getPremise(id: number): Promise<Premise> {
+    this.messageService.add(`PremiseService: get data for ${id}`);
+    return this.http.get<Premise>(`${serviceBaseUrl}/v1/premises/${id}`).toPromise()
+  }
+
+  async postPremise(item: Premise): Promise<Premise> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`PremiseService: post data for ${itemStr}`);
+    return this.http.post<Premise>(`${serviceBaseUrl}/v1/premises`, item).toPromise()
+  }
+
+  async putPremise(item: Premise): Promise<Premise> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`PremiseService: put data for ${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<Premise>(`${serviceBaseUrl}/v1/premises/${id}`, item).toPromise()
+  }
+
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class FlatService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getFlat(): Promise<Flat> {
-    this.messageService.add(`FlatService: fetch data`);
-    return this.http.get<Flat>(`${serviceBaseUrl}/v1/flat`).toPromise()
+  async getFlats(): Promise<Flat[]> {
+    this.messageService.add(`FlatService: get data`);
+    return this.http.get<Flat[]>(`${serviceBaseUrl}/v1/flats`).toPromise()
   }
+
+  async getFlat(id: number): Promise<Flat> {
+    this.messageService.add(`FlatService: get data for ${id}`);
+    return this.http.get<Flat>(`${serviceBaseUrl}/v1/flats/${id}`).toPromise()
+  }
+
+  async postFlat(item: Flat): Promise<Flat> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`FlatService: post data for ${itemStr}`);
+    return this.http.post<Flat>(`${serviceBaseUrl}/v1/flats`, item).toPromise()
+  }
+
+  async putFlat(item: Flat): Promise<Flat> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`FlatService: put data for ${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<Flat>(`${serviceBaseUrl}/v1/flats/${id}`, item).toPromise()
+  }
+
+
+  async getFlatsByPremise(id: number): Promise<Flat[]> {
+    this.messageService.add(`FlatService: get data by Premise ${id}`);
+    return this.http.get<Flat[]>(`${serviceBaseUrl}/v1/flats/premise/${id}`).toPromise()
+  }
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class OverheadAdvanceService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getOverheadAdvance(): Promise<OverheadAdvance> {
-    this.messageService.add(`OverheadAdvanceService: fetch data`);
-    return this.http.get<OverheadAdvance>(`${serviceBaseUrl}/v1/overhead_advance`).toPromise()
+  async getOverheadAdvances(): Promise<OverheadAdvance[]> {
+    this.messageService.add(`OverheadAdvanceService: get data`);
+    return this.http.get<OverheadAdvance[]>(`${serviceBaseUrl}/v1/overhead_advances`).toPromise()
   }
+
+  async getOverheadAdvance(id: number): Promise<OverheadAdvance> {
+    this.messageService.add(`OverheadAdvanceService: get data for ${id}`);
+    return this.http.get<OverheadAdvance>(`${serviceBaseUrl}/v1/overhead_advances/${id}`).toPromise()
+  }
+
+  async postOverheadAdvance(item: OverheadAdvance): Promise<OverheadAdvance> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`OverheadAdvanceService: post data for ${itemStr}`);
+    return this.http.post<OverheadAdvance>(`${serviceBaseUrl}/v1/overhead_advances`, item).toPromise()
+  }
+
+  async putOverheadAdvance(item: OverheadAdvance): Promise<OverheadAdvance> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`OverheadAdvanceService: put data for ${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<OverheadAdvance>(`${serviceBaseUrl}/v1/overhead_advances/${id}`, item).toPromise()
+  }
+
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class OverheadAdvanceFlatMappingService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getOverheadAdvanceFlatMapping(): Promise<OverheadAdvanceFlatMapping> {
-    this.messageService.add(`OverheadAdvanceFlatMappingService: fetch data`);
-    return this.http.get<OverheadAdvanceFlatMapping>(`${serviceBaseUrl}/v1/overhead_advance_flat_mapping`).toPromise()
+  async getOverheadAdvanceFlatMappings(): Promise<OverheadAdvanceFlatMapping[]> {
+    this.messageService.add(`OverheadAdvanceFlatMappingService: get data`);
+    return this.http.get<OverheadAdvanceFlatMapping[]>(`${serviceBaseUrl}/v1/overhead_advance_flat_mappings`).toPromise()
   }
+
+  async getOverheadAdvanceFlatMapping(id: number): Promise<OverheadAdvanceFlatMapping> {
+    this.messageService.add(`OverheadAdvanceFlatMappingService: get data for ${id}`);
+    return this.http.get<OverheadAdvanceFlatMapping>(`${serviceBaseUrl}/v1/overhead_advance_flat_mappings/${id}`).toPromise()
+  }
+
+  async postOverheadAdvanceFlatMapping(item: OverheadAdvanceFlatMapping): Promise<OverheadAdvanceFlatMapping> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`OverheadAdvanceFlatMappingService: post data for ${itemStr}`);
+    return this.http.post<OverheadAdvanceFlatMapping>(`${serviceBaseUrl}/v1/overhead_advance_flat_mappings`, item).toPromise()
+  }
+
+
+
+  async getOverheadAdvanceFlatMappingsByOverheadAdvance(id: number): Promise<OverheadAdvanceFlatMapping[]> {
+    this.messageService.add(`OverheadAdvanceFlatMappingService: get data by OverheadAdvance ${id}`);
+    return this.http.get<OverheadAdvanceFlatMapping[]>(`${serviceBaseUrl}/v1/overhead_advance_flat_mappings/overhead_advance/${id}`).toPromise()
+  }
+
+  async getOverheadAdvanceFlatMappingsByFlat(id: number): Promise<OverheadAdvanceFlatMapping[]> {
+    this.messageService.add(`OverheadAdvanceFlatMappingService: get data by Flat ${id}`);
+    return this.http.get<OverheadAdvanceFlatMapping[]>(`${serviceBaseUrl}/v1/overhead_advance_flat_mappings/flat/${id}`).toPromise()
+  }
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class ParkingService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getParking(): Promise<Parking> {
-    this.messageService.add(`ParkingService: fetch data`);
-    return this.http.get<Parking>(`${serviceBaseUrl}/v1/parking`).toPromise()
+  async getParkings(): Promise<Parking[]> {
+    this.messageService.add(`ParkingService: get data`);
+    return this.http.get<Parking[]>(`${serviceBaseUrl}/v1/parkings`).toPromise()
   }
+
+  async getParking(id: number): Promise<Parking> {
+    this.messageService.add(`ParkingService: get data for ${id}`);
+    return this.http.get<Parking>(`${serviceBaseUrl}/v1/parkings/${id}`).toPromise()
+  }
+
+  async postParking(item: Parking): Promise<Parking> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`ParkingService: post data for ${itemStr}`);
+    return this.http.post<Parking>(`${serviceBaseUrl}/v1/parkings`, item).toPromise()
+  }
+
+  async putParking(item: Parking): Promise<Parking> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`ParkingService: put data for ${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<Parking>(`${serviceBaseUrl}/v1/parkings/${id}`, item).toPromise()
+  }
+
+
+  async getParkingsByPremise(id: number): Promise<Parking[]> {
+    this.messageService.add(`ParkingService: get data by Premise ${id}`);
+    return this.http.get<Parking[]>(`${serviceBaseUrl}/v1/parkings/premise/${id}`).toPromise()
+  }
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class CommercialPremiseService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getCommercialPremise(): Promise<CommercialPremise> {
-    this.messageService.add(`CommercialPremiseService: fetch data`);
-    return this.http.get<CommercialPremise>(`${serviceBaseUrl}/v1/commercial_premise`).toPromise()
+  async getCommercialPremises(): Promise<CommercialPremise[]> {
+    this.messageService.add(`CommercialPremiseService: get data`);
+    return this.http.get<CommercialPremise[]>(`${serviceBaseUrl}/v1/commercial_premises`).toPromise()
   }
+
+  async getCommercialPremise(id: number): Promise<CommercialPremise> {
+    this.messageService.add(`CommercialPremiseService: get data for ${id}`);
+    return this.http.get<CommercialPremise>(`${serviceBaseUrl}/v1/commercial_premises/${id}`).toPromise()
+  }
+
+  async postCommercialPremise(item: CommercialPremise): Promise<CommercialPremise> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`CommercialPremiseService: post data for ${itemStr}`);
+    return this.http.post<CommercialPremise>(`${serviceBaseUrl}/v1/commercial_premises`, item).toPromise()
+  }
+
+  async putCommercialPremise(item: CommercialPremise): Promise<CommercialPremise> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`CommercialPremiseService: put data for ${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<CommercialPremise>(`${serviceBaseUrl}/v1/commercial_premises/${id}`, item).toPromise()
+  }
+
+
+  async getCommercialPremisesByPremise(id: number): Promise<CommercialPremise[]> {
+    this.messageService.add(`CommercialPremiseService: get data by Premise ${id}`);
+    return this.http.get<CommercialPremise[]>(`${serviceBaseUrl}/v1/commercial_premises/premise/${id}`).toPromise()
+  }
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class TenancyService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getTenancy(): Promise<Tenancy> {
-    this.messageService.add(`TenancyService: fetch data`);
-    return this.http.get<Tenancy>(`${serviceBaseUrl}/v1/tenancy`).toPromise()
+  async getTenancys(): Promise<Tenancy[]> {
+    this.messageService.add(`TenancyService: get data`);
+    return this.http.get<Tenancy[]>(`${serviceBaseUrl}/v1/tenancys`).toPromise()
   }
+
+  async getTenancy(id: number): Promise<Tenancy> {
+    this.messageService.add(`TenancyService: get data for ${id}`);
+    return this.http.get<Tenancy>(`${serviceBaseUrl}/v1/tenancys/${id}`).toPromise()
+  }
+
+  async postTenancy(item: Tenancy): Promise<Tenancy> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`TenancyService: post data for ${itemStr}`);
+    return this.http.post<Tenancy>(`${serviceBaseUrl}/v1/tenancys`, item).toPromise()
+  }
+
+  async putTenancy(item: Tenancy): Promise<Tenancy> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`TenancyService: put data for ${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<Tenancy>(`${serviceBaseUrl}/v1/tenancys/${id}`, item).toPromise()
+  }
+
+
+  async getTenancysByTenant(id: number): Promise<Tenancy[]> {
+    this.messageService.add(`TenancyService: get data by Tenant ${id}`);
+    return this.http.get<Tenancy[]>(`${serviceBaseUrl}/v1/tenancys/tenant/${id}`).toPromise()
+  }
+
+  async getTenancysByFlat(id: number): Promise<Tenancy[]> {
+    this.messageService.add(`TenancyService: get data by Flat ${id}`);
+    return this.http.get<Tenancy[]>(`${serviceBaseUrl}/v1/tenancys/flat/${id}`).toPromise()
+  }
+
+  async getTenancysByParking(id: number): Promise<Tenancy[]> {
+    this.messageService.add(`TenancyService: get data by Parking ${id}`);
+    return this.http.get<Tenancy[]>(`${serviceBaseUrl}/v1/tenancys/parking/${id}`).toPromise()
+  }
+
+  async getTenancysByCommercialPremise(id: number): Promise<Tenancy[]> {
+    this.messageService.add(`TenancyService: get data by CommercialPremise ${id}`);
+    return this.http.get<Tenancy[]>(`${serviceBaseUrl}/v1/tenancys/commercial_premise/${id}`).toPromise()
+  }
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class FeeService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getFee(): Promise<Fee> {
-    this.messageService.add(`FeeService: fetch data`);
-    return this.http.get<Fee>(`${serviceBaseUrl}/v1/fee`).toPromise()
+  async getFees(): Promise<Fee[]> {
+    this.messageService.add(`FeeService: get data`);
+    return this.http.get<Fee[]>(`${serviceBaseUrl}/v1/fees`).toPromise()
   }
+
+  async getFee(id: number): Promise<Fee> {
+    this.messageService.add(`FeeService: get data for ${id}`);
+    return this.http.get<Fee>(`${serviceBaseUrl}/v1/fees/${id}`).toPromise()
+  }
+
+  async postFee(item: Fee): Promise<Fee> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`FeeService: post data for ${itemStr}`);
+    return this.http.post<Fee>(`${serviceBaseUrl}/v1/fees`, item).toPromise()
+  }
+
+  async putFee(item: Fee): Promise<Fee> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`FeeService: put data for ${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<Fee>(`${serviceBaseUrl}/v1/fees/${id}`, item).toPromise()
+  }
+
+
+
 }
 
+@Injectable({ providedIn: 'root' })
 export class TenancyFeeMappingService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getTenancyFeeMapping(): Promise<TenancyFeeMapping> {
-    this.messageService.add(`TenancyFeeMappingService: fetch data`);
-    return this.http.get<TenancyFeeMapping>(`${serviceBaseUrl}/v1/tenancy_fee_mapping`).toPromise()
+  async getTenancyFeeMappings(): Promise<TenancyFeeMapping[]> {
+    this.messageService.add(`TenancyFeeMappingService: get data`);
+    return this.http.get<TenancyFeeMapping[]>(`${serviceBaseUrl}/v1/tenancy_fee_mappings`).toPromise()
   }
+
+  async getTenancyFeeMapping(id: number): Promise<TenancyFeeMapping> {
+    this.messageService.add(`TenancyFeeMappingService: get data for ${id}`);
+    return this.http.get<TenancyFeeMapping>(`${serviceBaseUrl}/v1/tenancy_fee_mappings/${id}`).toPromise()
+  }
+
+  async postTenancyFeeMapping(item: TenancyFeeMapping): Promise<TenancyFeeMapping> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`TenancyFeeMappingService: post data for ${itemStr}`);
+    return this.http.post<TenancyFeeMapping>(`${serviceBaseUrl}/v1/tenancy_fee_mappings`, item).toPromise()
+  }
+
+
+
+  async getTenancyFeeMappingsByTenancy(id: number): Promise<TenancyFeeMapping[]> {
+    this.messageService.add(`TenancyFeeMappingService: get data by Tenancy ${id}`);
+    return this.http.get<TenancyFeeMapping[]>(`${serviceBaseUrl}/v1/tenancy_fee_mappings/tenancy/${id}`).toPromise()
+  }
+
+  async getTenancyFeeMappingsByFee(id: number): Promise<TenancyFeeMapping[]> {
+    this.messageService.add(`TenancyFeeMappingService: get data by Fee ${id}`);
+    return this.http.get<TenancyFeeMapping[]>(`${serviceBaseUrl}/v1/tenancy_fee_mappings/fee/${id}`).toPromise()
+  }
+
+
 }
 
+@Injectable({ providedIn: 'root' })
+export class AccountEntryCategoryService {
+  constructor(private messageService: MessageService, private http: HttpClient) { }
+  
+  async getAccountEntryCategorys(): Promise<AccountEntryCategory[]> {
+    this.messageService.add(`AccountEntryCategoryService: get data`);
+    return this.http.get<AccountEntryCategory[]>(`${serviceBaseUrl}/v1/account_entry_categorys`).toPromise()
+  }
+
+  async getAccountEntryCategory(id: number): Promise<AccountEntryCategory> {
+    this.messageService.add(`AccountEntryCategoryService: get data for ${id}`);
+    return this.http.get<AccountEntryCategory>(`${serviceBaseUrl}/v1/account_entry_categorys/${id}`).toPromise()
+  }
+
+  async postAccountEntryCategory(item: AccountEntryCategory): Promise<AccountEntryCategory> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`AccountEntryCategoryService: post data for ${itemStr}`);
+    return this.http.post<AccountEntryCategory>(`${serviceBaseUrl}/v1/account_entry_categorys`, item).toPromise()
+  }
+
+
+
+
+}
+
+@Injectable({ providedIn: 'root' })
 export class AccountEntryService {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async getAccountEntry(): Promise<AccountEntry> {
-    this.messageService.add(`AccountEntryService: fetch data`);
-    return this.http.get<AccountEntry>(`${serviceBaseUrl}/v1/account_entry`).toPromise()
+  async getAccountEntrys(): Promise<AccountEntry[]> {
+    this.messageService.add(`AccountEntryService: get data`);
+    return this.http.get<AccountEntry[]>(`${serviceBaseUrl}/v1/account_entrys`).toPromise()
   }
+
+  async getAccountEntry(id: number): Promise<AccountEntry> {
+    this.messageService.add(`AccountEntryService: get data for ${id}`);
+    return this.http.get<AccountEntry>(`${serviceBaseUrl}/v1/account_entrys/${id}`).toPromise()
+  }
+
+  async postAccountEntry(item: AccountEntry): Promise<AccountEntry> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`AccountEntryService: post data for ${itemStr}`);
+    return this.http.post<AccountEntry>(`${serviceBaseUrl}/v1/account_entrys`, item).toPromise()
+  }
+
+
+
+  async getAccountEntrysByAccount(id: number): Promise<AccountEntry[]> {
+    this.messageService.add(`AccountEntryService: get data by Account ${id}`);
+    return this.http.get<AccountEntry[]>(`${serviceBaseUrl}/v1/account_entrys/account/${id}`).toPromise()
+  }
+
+  async getAccountEntrysByAccountEntryCategory(id: number): Promise<AccountEntry[]> {
+    this.messageService.add(`AccountEntryService: get data by AccountEntryCategory ${id}`);
+    return this.http.get<AccountEntry[]>(`${serviceBaseUrl}/v1/account_entrys/account_entry_category/${id}`).toPromise()
+  }
+
+
+}
+
+@Injectable({ providedIn: 'root' })
+export class NoteService {
+  constructor(private messageService: MessageService, private http: HttpClient) { }
+  
+  async getNotes(): Promise<Note[]> {
+    this.messageService.add(`NoteService: get data`);
+    return this.http.get<Note[]>(`${serviceBaseUrl}/v1/notes`).toPromise()
+  }
+
+  async getNote(id: number): Promise<Note> {
+    this.messageService.add(`NoteService: get data for ${id}`);
+    return this.http.get<Note>(`${serviceBaseUrl}/v1/notes/${id}`).toPromise()
+  }
+
+  async postNote(item: Note): Promise<Note> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`NoteService: post data for ${itemStr}`);
+    return this.http.post<Note>(`${serviceBaseUrl}/v1/notes`, item).toPromise()
+  }
+
+
+
+  async getNotesByTenant(id: number): Promise<Note[]> {
+    this.messageService.add(`NoteService: get data by Tenant ${id}`);
+    return this.http.get<Note[]>(`${serviceBaseUrl}/v1/notes/tenant/${id}`).toPromise()
+  }
+
+
 }
 
 

ui/hv2-ui/src/app/data-object-service.ts.tmpl

@@ -1,6 +1,8 @@
+$GENERATED_TS_COMMENT
+
+
 import { Injectable } from '@angular/core';
-import { Observable, of } from 'rxjs';
-import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { HttpClient } from '@angular/common/http';
 
 import { MessageService } from './message.service';
 import { serviceBaseUrl } from './config';
@@ -11,9 +13,6 @@ import { ${JsNameConverter($table.name)} } from './data-objects';
 #end for
 
 
-@Injectable({
-  providedIn: 'root'
-})
 
 
 
@@ -22,13 +21,46 @@ import { ${JsNameConverter($table.name)} } from './data-objects';
 #from generateHelper import JsNameConverter
 
 #for $table in $tables    
+@Injectable({ providedIn: 'root' })
 export class ${JsNameConverter($table.name)}Service {
   constructor(private messageService: MessageService, private http: HttpClient) { }
   
-  async get${JsNameConverter($table.name)}(): Promise<${JsNameConverter($table.name)}> {
-    this.messageService.add(`${JsNameConverter($table.name)}Service: fetch data`);
-    return this.http.get<${JsNameConverter($table.name)}>(`\${serviceBaseUrl}/v1/${table.name}`).toPromise()
+  async get${JsNameConverter($table.name)}s(): Promise<${JsNameConverter($table.name)}[]> {
+    this.messageService.add(`${JsNameConverter($table.name)}Service: get data`);
+    return this.http.get<${JsNameConverter($table.name)}[]>(`\${serviceBaseUrl}/v1/${table.name}s`).toPromise()
   }
+
+  async get${JsNameConverter($table.name)}(id: number): Promise<${JsNameConverter($table.name)}> {
+    this.messageService.add(`${JsNameConverter($table.name)}Service: get data for \${id}`);
+    return this.http.get<${JsNameConverter($table.name)}>(`\${serviceBaseUrl}/v1/${table.name}s/\${id}`).toPromise()
+  }
+
+  async post${JsNameConverter($table.name)}(item: ${JsNameConverter($table.name)}): Promise<${JsNameConverter($table.name)}> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`${JsNameConverter($table.name)}Service: post data for \${itemStr}`);
+    return this.http.post<${JsNameConverter($table.name)}>(`\${serviceBaseUrl}/v1/${table.name}s`, item).toPromise()
+  }
+
+#if (('immutable' not in $table) or (not $table.immutable))
+  async put${JsNameConverter($table.name)}(item: ${JsNameConverter($table.name)}): Promise<${JsNameConverter($table.name)}> {
+    let itemStr: string = JSON.stringify(item, undefined, 4)
+    this.messageService.add(`${JsNameConverter($table.name)}Service: put data for \${itemStr}`)
+    let id: number = item["id"]
+    return this.http.put<${JsNameConverter($table.name)}>(`\${serviceBaseUrl}/v1/${table.name}s/\${id}`, item).toPromise()
+  }
+#end if
+
+
+#for $column in $table.columns
+#if (('foreignkey' in $column) and $column.foreignkey)
+  async get${JsNameConverter($table.name)}sBy${JsNameConverter($column.name)}(id: number): Promise<${JsNameConverter($table.name)}[]> {
+    this.messageService.add(`${JsNameConverter($table.name)}Service: get data by ${JsNameConverter($column.name)} \${id}`);
+    return this.http.get<${JsNameConverter($table.name)}[]>(`\${serviceBaseUrl}/v1/${table.name}s/${column.name}/\${id}`).toPromise()
+  }
+
+#end if
+#end for
+
 }
 
 #end for          

ui/hv2-ui/src/app/data-objects.ts

@@ -1,9 +1,22 @@
 
+// -----------------------------------------
+// THIS FILE HAS BEEN GENERATED
+// DO NOT EDIT MANUALLY
+// -----------------------------------------
+
+
+
 export interface Account {
+    id: number
     description: string
 }
+export const NULL_Account: Account = {
+    id: 0
+    ,description:   ''
+}
 
 export interface Tenant {
+    id: number
     salutation: string
     firstname: string
     lastname: string
@@ -17,44 +30,102 @@ export interface Tenant {
     iban: string
     account: number
 }
+export const NULL_Tenant: Tenant = {
+    id: 0
+    ,salutation:   ''
+    ,firstname:   ''
+    ,lastname:   ''
+    ,address1:   ''
+    ,address2:   ''
+    ,address3:   ''
+    ,zip:   ''
+    ,city:   ''
+    ,phone1:   ''
+    ,phone2:   ''
+    ,iban:   ''
+    ,account:   undefined
+}
 
 export interface Premise {
+    id: number
     description: string
     street: string
     zip: string
     city: string
 }
+export const NULL_Premise: Premise = {
+    id: 0
+    ,description:   ''
+    ,street:   ''
+    ,zip:   ''
+    ,city:   ''
+}
 
 export interface Flat {
+    id: number
     description: string
     premise: number
     area: number
     flat_no: number
 }
+export const NULL_Flat: Flat = {
+    id: 0
+    ,description:   ''
+    ,premise:   undefined
+    ,area:   undefined
+    ,flat_no:   undefined
+}
 
 export interface OverheadAdvance {
+    id: number
     description: string
     amount: number
     startdate: string
     enddate: string
 }
+export const NULL_OverheadAdvance: OverheadAdvance = {
+    id: 0
+    ,description:   ''
+    ,amount:   undefined
+    ,startdate:   ''
+    ,enddate:   ''
+}
 
 export interface OverheadAdvanceFlatMapping {
+    id: number
     overhead_advance: number
     flat: number
 }
+export const NULL_OverheadAdvanceFlatMapping: OverheadAdvanceFlatMapping = {
+    id: 0
+    ,overhead_advance:   undefined
+    ,flat:   undefined
+}
 
 export interface Parking {
+    id: number
     description: string
     premise: number
 }
+export const NULL_Parking: Parking = {
+    id: 0
+    ,description:   ''
+    ,premise:   undefined
+}
 
 export interface CommercialPremise {
+    id: number
     description: string
     premise: number
 }
+export const NULL_CommercialPremise: CommercialPremise = {
+    id: 0
+    ,description:   ''
+    ,premise:   undefined
+}
 
 export interface Tenancy {
+    id: number
     description: string
     tenant: number
     flat: number
@@ -63,25 +134,84 @@ export interface Tenancy {
     startdate: string
     enddate: string
 }
+export const NULL_Tenancy: Tenancy = {
+    id: 0
+    ,description:   ''
+    ,tenant:   undefined
+    ,flat:   undefined
+    ,parking:   undefined
+    ,commercial_premise:   undefined
+    ,startdate:   ''
+    ,enddate:   ''
+}
 
 export interface Fee {
+    id: number
     description: string
     amount: number
     fee_type: string
     startdate: string
     enddate: string
 }
+export const NULL_Fee: Fee = {
+    id: 0
+    ,description:   ''
+    ,amount:   undefined
+    ,fee_type:   ''
+    ,startdate:   ''
+    ,enddate:   ''
+}
 
 export interface TenancyFeeMapping {
+    id: number
     tenancy: number
     fee: number
 }
+export const NULL_TenancyFeeMapping: TenancyFeeMapping = {
+    id: 0
+    ,tenancy:   undefined
+    ,fee:   undefined
+}
+
+export interface AccountEntryCategory {
+    id: number
+    description: string
+    overhead_relevant: boolean
+}
+export const NULL_AccountEntryCategory: AccountEntryCategory = {
+    id: 0
+    ,description:   ''
+    ,overhead_relevant:   false
+}
 
 export interface AccountEntry {
+    id: number
     description: string
     account: number
     created_at: string
     amount: number
+    account_entry_category: number
+}
+export const NULL_AccountEntry: AccountEntry = {
+    id: 0
+    ,description:   ''
+    ,account:   undefined
+    ,created_at:   ''
+    ,amount:   undefined
+    ,account_entry_category:   undefined
+}
+
+export interface Note {
+    id: number
+    created_at: string
+    tenant: number
+    note: string
+}
+export const NULL_Note: Note = {
+    id: 0
+    ,created_at:   ''
+    ,tenant:   undefined
+    ,note:   ''
 }
 
 

ui/hv2-ui/src/app/data-objects.ts.tmpl

@@ -1,11 +1,27 @@
+$GENERATED_TS_COMMENT
+
 #from generateHelper import JsNameConverter
 
 #for $table in $tables    
 export interface $JsNameConverter($table.name) {
+    id: number
 #for $column in $table.columns
     ${column.name}: ${column.jstype}
 #end for
 }
+export const NULL_$JsNameConverter($table.name): $JsNameConverter($table.name) = {
+    id: 0
+#for $column in $table.columns
+    ,${column.name}: #slurp
+#if $column.jstype == "string"
+  ''
+#else if $column.jstype == "number"
+  undefined
+#else if $column.jstype == "boolean"
+  false
+#end if
+#end for
+}
 
 #end for          
 

ui/hv2-ui/src/app/ext-data-object-service.ts

@@ -0,0 +1,31 @@
+
+import { Injectable } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+
+import { MessageService } from './message.service';
+import { serviceBaseUrl } from './config';
+
+
+import { Fee, OverheadAdvance } from './data-objects';
+import { Saldo } from './ext-data-objects';
+
+
+@Injectable({ providedIn: 'root' })
+export class ExtApiService {
+  constructor(private messageService: MessageService, private http: HttpClient) { }
+  
+  async getOverheadAdvancesByFlat(id: number): Promise<OverheadAdvance[]> {
+    this.messageService.add(`ExtApiService: get overheadadvances by flat ${id}`);
+    return this.http.get<OverheadAdvance[]>(`${serviceBaseUrl}/v1/overhead_advances/flat/${id}`).toPromise()
+  }
+  
+  async getFeeByTenancies(id: number): Promise<Fee[]> {
+    this.messageService.add(`ExtApiService: get fees by flat ${id}`);
+    return this.http.get<Fee[]>(`${serviceBaseUrl}/v1/fees/tenancy/${id}`).toPromise()
+  }
+
+  async getAccountSaldo(id: number): Promise<Saldo> {
+    this.messageService.add(`ExtApiService: get saldo for account ${id}`);
+    return this.http.get<Saldo>(`${serviceBaseUrl}/v1/account/saldo/${id}`).toPromise()
+  }
+}

ui/hv2-ui/src/app/ext-data-objects.ts

@@ -0,0 +1,5 @@
+
+export interface Saldo {
+    saldo: number
+}
+  

ui/hv2-ui/src/app/fee-details/fee-details.component.html

@@ -0,0 +1,49 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                {{fee?.description}}
+            </mat-card-title>
+            <mat-card-subtitle>
+                ID: {{fee?.id}}
+            </mat-card-subtitle>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <form (ngSubmit)="saveFee()">
+                    <div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Beschreibung</mat-label>
+                            <input matInput name="description" [(ngModel)]="fee.description"/>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Betrag (€)</mat-label>
+                            <input matInput type="number" name="amount" [(ngModel)]="fee.amount" [readonly]="readonly"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Typ</mat-label>
+                            <mat-select [(ngModel)]="fee.fee_type" name="fee_type">
+                                <mat-option *ngFor="let p of fee_types" [value]="p">{{p}}</mat-option>
+                            </mat-select>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Beginn</mat-label>
+                            <input matInput name="startdate" [(ngModel)]="fee.startdate" [matDatepicker]="startdatepicker" [readonly]="readonly"/>
+                            <mat-datepicker-toggle matSuffix [for]="startdatepicker" [disabled]="readonly"></mat-datepicker-toggle>
+                            <mat-datepicker #startdatepicker></mat-datepicker>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Ende</mat-label>
+                            <input matInput name="enddate" [(ngModel)]="fee.enddate" [matDatepicker]="enddatepicker"/>
+                            <mat-datepicker-toggle matSuffix [for]="enddatepicker"></mat-datepicker-toggle>
+                            <mat-datepicker #enddatepicker></mat-datepicker>
+                        </mat-form-field>
+                    </div>
+                    <button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
+                </form>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/fee-details/fee-details.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FeeDetailsComponent } from './fee-details.component';
+
+describe('FeeDetailsComponent', () => {
+  let component: FeeDetailsComponent;
+  let fixture: ComponentFixture<FeeDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ FeeDetailsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(FeeDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/fee-details/fee-details.component.ts

@@ -0,0 +1,73 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { MatButton } from '@angular/material/button';
+import { ActivatedRoute, Router } from '@angular/router';
+import { FeeService } from '../data-object-service';
+import { NULL_Fee, Fee } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-fee-details',
+  templateUrl: './fee-details.component.html',
+  styleUrls: ['./fee-details.component.css']
+})
+export class FeeDetailsComponent implements OnInit {
+
+  @ViewChild('submitButton') submitButton: MatButton
+
+  fee: Fee = NULL_Fee
+  fee_types: string[] = [ "total", "per_area" ]
+  readonly: boolean
+
+  constructor(
+    private feeService: FeeService,
+    private messageService: MessageService,
+    private route: ActivatedRoute,
+    private router: Router
+  ) { }
+
+  async getFee(): Promise<void> {
+    try {
+      const id = +this.route.snapshot.paramMap.get('id')
+      this.readonly = false
+      if (id != 0) {
+        this.fee = await this.feeService.getFee(id)
+        this.readonly = true
+      }
+      this.messageService.add(`Fee is ${ JSON.stringify(this.fee, undefined, 4)}`)
+    } catch (err) {
+      this.messageService.add(`Error in getFee: ${ JSON.stringify(err, undefined, 4) }`)
+    }
+  }
+
+  async saveFee() {
+    try {
+      this.submitButton.disabled = true
+      this.messageService.add("saveFee")
+      this.messageService.add(JSON.stringify(this.fee, undefined, 4))
+      if (this.fee.enddate == null) {
+        this.fee.enddate = ''
+      }
+      if (this.fee.startdate == null) {
+        this.fee.startdate = ''
+      }
+      if (this.fee.id == 0) {
+        this.messageService.add("about to insert new fee")
+        this.fee = await this.feeService.postFee(this.fee)
+        this.messageService.add(`Successfully added fee with id ${this.fee.id}`)
+      } else {
+        this.messageService.add("about to update existing fee")
+        this.fee = await this.feeService.putFee(this.fee)
+        this.messageService.add(`Successfully changed fee with id ${this.fee.id}`)
+      }
+      this.router.navigate(['/fees'])
+    } finally {
+      this.submitButton.disabled = false
+    }
+  }
+
+
+  ngOnInit(): void {
+    this.getFee()
+  }
+
+}

ui/hv2-ui/src/app/fee-list/fee-list.component.css

@@ -0,0 +1,8 @@
+table {
+    width: 75%;
+}
+
+.spacer {
+    flex: 1 1 auto;
+}
+  

ui/hv2-ui/src/app/fee-list/fee-list.component.html

@@ -0,0 +1,39 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                <span>Mietsätze</span>
+                <span class="spacer"></span>
+                <a mat-button routerLink="/fee">Neu anlegen</a>
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <table mat-table [dataSource]="dataSource" #zftable>
+                    <ng-container matColumnDef="description">
+                        <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                        <td mat-cell *matCellDef="let element">{{element.description}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="amount">
+                        <th mat-header-cell *matHeaderCellDef>Betrag</th>
+                        <td mat-cell *matCellDef="let element">{{element.amount | number:'1.2-2'}} €</td>
+                    </ng-container>
+                    <ng-container matColumnDef="fee_type">
+                        <th mat-header-cell *matHeaderCellDef>Typ</th>
+                        <td mat-cell *matCellDef="let element">{{element.fee_type}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="startdate">
+                        <th mat-header-cell *matHeaderCellDef>Beginn</th>
+                        <td mat-cell *matCellDef="let element">{{element.startdate | date}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="enddate">
+                        <th mat-header-cell *matHeaderCellDef>Ende</th>
+                        <td mat-cell *matCellDef="let element">{{element.enddate | date}}</td>
+                    </ng-container>
+                    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+                    <tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="['/fee/', row.id]"></tr>
+                </table>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/fee-list/fee-list.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FeeListComponent } from './fee-list.component';
+
+describe('FeeListComponent', () => {
+  let component: FeeListComponent;
+  let fixture: ComponentFixture<FeeListComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ FeeListComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(FeeListComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/fee-list/fee-list.component.ts

@@ -0,0 +1,42 @@
+import { Component, OnInit } from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table';
+import { FeeService } from '../data-object-service';
+import { Fee } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-fee-list',
+  templateUrl: './fee-list.component.html',
+  styleUrls: ['./fee-list.component.css']
+})
+export class FeeListComponent implements OnInit {
+
+  fees: Fee[]
+  dataSource: MatTableDataSource<Fee>
+  displayedColumns: string[] = [ "description", "amount", "fee_type", "startdate", "enddate" ]
+
+
+
+  constructor(
+    private feeService: FeeService,
+    private messageService: MessageService
+  ) { }
+
+  async getFees(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load fees")
+      this.fees = await this.feeService.getFees()
+      this.messageService.add("Fees loaded")
+
+      this.dataSource = new MatTableDataSource<Fee>(this.fees)
+    } catch (err) {
+      this.messageService.add(`Error in getFees: ${ JSON.stringify(err, undefined, 4) }`)
+    }
+  }
+
+  ngOnInit(): void {
+    this.messageService.add("FeeListComponent.ngOnInit")
+    this.getFees()
+  }
+
+}

ui/hv2-ui/src/app/flat-details/flat-details.component.css

@@ -0,0 +1,11 @@
+table {
+    width: 75%;
+}
+
+.spacer {
+    flex: 1 1 auto;
+}
+
+#addoverheadfield {
+    margin-right: 15px;
+}

ui/hv2-ui/src/app/flat-details/flat-details.component.html

@@ -0,0 +1,84 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                {{flat?.description}} {{flat?.flat_no}} {{premise?.description}}
+            </mat-card-title>
+            <mat-card-subtitle>
+                ID: {{flat?.id}}
+            </mat-card-subtitle>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <form (ngSubmit)="saveFlat()">
+                    <div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Beschreibung</mat-label>
+                            <input matInput name="description" [(ngModel)]="flat.description"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Haus</mat-label>
+                            <mat-select [(ngModel)]="flat.premise" name="premise">
+                                <mat-option *ngFor="let p of premises" [value]="p.id">{{p.description}}</mat-option>
+                            </mat-select>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Fläche</mat-label>
+                            <input type="number" matInput name="area" [(ngModel)]="flat.area"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Wohnungsnummer</mat-label>
+                            <input type="number" matInput name="flat_no" [(ngModel)]="flat.flat_no"/>
+                        </mat-form-field>
+                    </div>
+                    <button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
+                </form>
+            </div>
+        </mat-card-content>
+    </mat-card>
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                Betriebskostenzuordnungen
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <table mat-table [dataSource]="dataSource" #zftable>
+                    <ng-container matColumnDef="description">
+                        <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                        <td mat-cell *matCellDef="let element">{{element.description}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="amount">
+                        <th mat-header-cell *matHeaderCellDef>Betrag</th>
+                        <td mat-cell *matCellDef="let element">{{element.amount}} €</td>
+                    </ng-container>
+                    <ng-container matColumnDef="startdate">
+                        <th mat-header-cell *matHeaderCellDef>Beginn</th>
+                        <td mat-cell *matCellDef="let element">{{element.startdate}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="enddate">
+                        <th mat-header-cell *matHeaderCellDef>Ende</th>
+                        <td mat-cell *matCellDef="let element">{{element.enddate}}</td>
+                    </ng-container>
+                    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+                    <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
+                </table>
+            </div>
+            <div>
+                <form (ngSubmit)="addOverheadAdvance()">
+                    <mat-form-field appearance="standard" id="addoverheadfield">
+                        <mat-label>Betriebskostensatz</mat-label>
+                        <mat-select #mapSelect [(ngModel)]="selectedOverheadAdvance" name="overheadadvance">
+                            <mat-option *ngFor="let p of allOverheadAdvances" [value]="p.id">{{p.description}} {{p.startdate}}</mat-option>
+                        </mat-select>
+                    </mat-form-field>
+                    <button #mapButton type="submit" mat-raised-button color="primary">Zuordnen</button>
+                </form>
+
+            </div>
+
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/flat-details/flat-details.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FlatDetailsComponent } from './flat-details.component';
+
+describe('FlatDetailsComponent', () => {
+  let component: FlatDetailsComponent;
+  let fixture: ComponentFixture<FlatDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ FlatDetailsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(FlatDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/flat-details/flat-details.component.ts

@@ -0,0 +1,131 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { MatButton } from '@angular/material/button';
+import { MatSelect } from '@angular/material/select';
+import { MatTableDataSource } from '@angular/material/table';
+import { ActivatedRoute, Router } from '@angular/router';
+import { FlatService, OverheadAdvanceFlatMappingService, OverheadAdvanceService, PremiseService } from '../data-object-service';
+import { Flat, NULL_Flat, NULL_Premise, OverheadAdvance, OverheadAdvanceFlatMapping, Premise } from '../data-objects';
+import { ExtApiService } from '../ext-data-object-service';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-flat-details',
+  templateUrl: './flat-details.component.html',
+  styleUrls: ['./flat-details.component.css']
+})
+export class FlatDetailsComponent implements OnInit {
+
+  flat: Flat = NULL_Flat
+
+  premise: Premise = NULL_Premise
+
+  premises: Premise[]
+  mappedOverheadAdvances: OverheadAdvance[]
+  allOverheadAdvances: OverheadAdvance[]
+  selectedOverheadAdvance: number
+  dataSource: MatTableDataSource<OverheadAdvance>
+  displayedColumns: string[] = [ "description", "amount", "startdate", "enddate" ]
+
+  @ViewChild('submitButton') submitButton: MatButton
+  @ViewChild('mapButton') mapButton: MatButton
+  @ViewChild('mapSelect') mapSelect: MatSelect
+
+  constructor(
+    private flatService: FlatService,
+    private premiseService: PremiseService,
+    private extApiService: ExtApiService,
+    private overheadAdvanceService: OverheadAdvanceService,
+    private overheadAdvanceFlatMappingService: OverheadAdvanceFlatMappingService,
+    private messageService: MessageService,
+    private route: ActivatedRoute,
+    private router: Router
+  ) { }
+
+  async getFlat(): Promise<void> {
+    try {
+      const id = +this.route.snapshot.paramMap.get('id')
+      this.messageService.add(`getFlat ${id}`)
+      if (id != 0) {
+        this.flat = await this.flatService.getFlat(id)
+        this.premise = await this.premiseService.getPremise(this.flat.premise)
+        this.mappedOverheadAdvances = await this.extApiService.getOverheadAdvancesByFlat(this.flat.id)
+        this.dataSource = new MatTableDataSource<OverheadAdvance>(this.mappedOverheadAdvances)
+      } else {
+        this.flat = NULL_Flat
+        this.premise = NULL_Premise
+        this.mappedOverheadAdvances = undefined
+        this.dataSource = undefined
+      }
+    } catch (err) {
+      throw err
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  async getPremises(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load premises")
+      this.premises = await this.premiseService.getPremises()
+      this.messageService.add("Premises loaded")
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  async getOverheadAdvances(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load overheadadvances")
+      this.allOverheadAdvances = await this.overheadAdvanceService.getOverheadAdvances()
+      this.messageService.add("overheadadvances loaded")
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+
+
+  async saveFlat() {
+    try {
+      this.submitButton.disabled = true
+      this.messageService.add(`saveFlat: ${ JSON.stringify(this.flat, undefined, 4) }`)
+      if (this.flat.id == 0) {
+        this.messageService.add("about to insert new flat")
+        this.flat = await this.flatService.postFlat(this.flat)
+        this.messageService.add(`Successfully added flat with id ${this.flat.id}`)
+      } else {
+        this.messageService.add("about to update existing flat")
+        this.flat = await this.flatService.putFlat(this.flat)
+        this.messageService.add(`Successfully changed flat with id ${this.flat.id}`)
+      }
+      this.router.navigate(['/flats'])
+    } finally {
+      this.submitButton.disabled = false
+    }
+  }
+
+  async addOverheadAdvance() {
+    try {
+      this.mapButton.disabled = true
+      this.messageService.add(`addOverheadAdvance: ${ JSON.stringify(this.selectedOverheadAdvance, undefined, 4) }`)
+      let newMapping: OverheadAdvanceFlatMapping = {
+        'flat': this.flat.id,
+        'overhead_advance': this.selectedOverheadAdvance,
+        'id': 0
+      }
+      newMapping = await this.overheadAdvanceFlatMappingService.postOverheadAdvanceFlatMapping(newMapping)
+      this.messageService.add(`New overheadadvance flat mapping created: ${newMapping.id}`)
+      this.selectedOverheadAdvance = undefined
+      this.getFlat()
+    } finally {
+      this.mapButton.disabled = false
+    }
+  }
+
+  ngOnInit(): void {
+    this.messageService.add("FlatDetailsComponent.ngOnInit")
+    this.getPremises()
+    this.getOverheadAdvances()
+    this.getFlat()
+  }
+
+}

ui/hv2-ui/src/app/messages/messages.component.html

@@ -1,11 +1,24 @@
 <section class="mat-typography">
-    <mat-card class="defaultCard" *ngIf="messageService.messages.length">
+    <mat-card class="defaultCard">
         <mat-card-header>
             <mat-card-title>Messages</mat-card-title>
         </mat-card-header>
         <mat-card-content>
-            <button (click)="messageService.clear()">clear</button>
+            <mat-accordion>
+                <mat-expansion-panel (opened)="collapse = true"
+                                    (closed)="collapse = false">
+                    <mat-expansion-panel-header>
+                        <mat-panel-title *ngIf="!collapse">
+                            Übersicht
+                        </mat-panel-title>
+                        <mat-panel-description>
+                        </mat-panel-description>
+                    </mat-expansion-panel-header>
+                <button (click)="messageService.clear()">clear</button>
             <div *ngFor='let message of messageService.messages'> {{message}} </div>
+        </mat-expansion-panel>
+    </mat-accordion>
+    
         </mat-card-content>
     </mat-card>
 </section>

ui/hv2-ui/src/app/messages/messages.component.ts

@@ -8,6 +8,8 @@ import { MessageService } from '../message.service';
 })
 export class MessagesComponent implements OnInit {
 
+  collapse: boolean = false
+  
   constructor(public messageService: MessageService) { }
 
   ngOnInit(): void {

ui/hv2-ui/src/app/my-commercial-units/my-commercial-units.component.html

@@ -0,0 +1,28 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                Meine Büros
+                <span>Meine Büros</span>
+                <span class="spacer"></span>
+                <a mat-button routerLink="/commercialunit">Neu anlegen</a>
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <table mat-table [dataSource]="dataSource" #zftable>
+                    <ng-container matColumnDef="description">
+                        <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                        <td mat-cell *matCellDef="let element">{{element.commercialPremise.description}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="premise">
+                        <th mat-header-cell *matHeaderCellDef>Haus</th>
+                        <td mat-cell *matCellDef="let element">{{element.premise.description}}</td>
+                    </ng-container>
+                    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+                    <tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="['/commercialunit/', row.commercialPremise.id]"></tr>
+                </table>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/my-commercial-units/my-commercial-units.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyCommercialUnitsComponent } from './my-commercial-units.component';
+
+describe('MyCommercialUnitsComponent', () => {
+  let component: MyCommercialUnitsComponent;
+  let fixture: ComponentFixture<MyCommercialUnitsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MyCommercialUnitsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyCommercialUnitsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/my-commercial-units/my-commercial-units.component.ts

@@ -0,0 +1,64 @@
+import { Component, OnInit } from '@angular/core';
+import { MessageService } from '../message.service';
+import { CommercialPremiseService, PremiseService } from '../data-object-service';
+import { CommercialPremise, Premise } from '../data-objects';
+import { MatTableDataSource } from '@angular/material/table'
+
+interface DN_CommercialPremise {
+  commercialPremise: CommercialPremise
+  premise: Premise
+}
+
+@Component({
+  selector: 'app-my-commercial-units',
+  templateUrl: './my-commercial-units.component.html',
+  styleUrls: ['./my-commercial-units.component.css']
+})
+export class MyCommercialUnitsComponent implements OnInit {
+
+  commercialPremises: CommercialPremise[]
+  premises: Premise[]
+  dnCommercialPremises: DN_CommercialPremise[] = []
+
+  dataSource: MatTableDataSource<DN_CommercialPremise>
+  displayedColumns: string[] = ["description", "premise"]
+
+  constructor(
+    private commercialPremiseService: CommercialPremiseService, 
+    private premiseService: PremiseService,
+    private messageService: MessageService
+  ) { }
+
+  async getCommercialPremises(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load commercialPremises")
+      this.commercialPremises = await this.commercialPremiseService.getCommercialPremises()
+      this.messageService.add("CommercialPremises loaded")
+      this.messageService.add("Trying to load premises")
+      this.premises = await this.premiseService.getPremises()
+      this.messageService.add(`Premises loaded: ${ JSON.stringify(this.premises, undefined, 4) }`)
+
+      const premisesDict = new Map<number, Premise>()
+      for (let p of this.premises) {
+        premisesDict.set(p.id, p)
+      }
+      for (let f of this.commercialPremises) {
+        this.dnCommercialPremises.push({
+          commercialPremise: f,
+          premise: premisesDict.get(f.premise)
+        })
+      }
+
+
+      this.dataSource = new MatTableDataSource<DN_CommercialPremise>(this.dnCommercialPremises)
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  ngOnInit(): void {
+    this.messageService.add("MyCommercialUnitsComponent.ngOnInit")
+    this.getCommercialPremises()
+  }
+
+}

ui/hv2-ui/src/app/my-flats/my-flats.component.html

@@ -0,0 +1,35 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                <span>Meine Wohnungen</span>
+                <span class="spacer"></span>
+                <a mat-button routerLink="/flat">Neu anlegen</a>
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <table mat-table [dataSource]="dataSource" #zftable>
+                    <ng-container matColumnDef="description">
+                        <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                        <td mat-cell *matCellDef="let element">{{element.flat.description}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="premise">
+                        <th mat-header-cell *matHeaderCellDef>Haus</th>
+                        <td mat-cell *matCellDef="let element">{{element.premise.description}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="area">
+                        <th mat-header-cell *matHeaderCellDef>Wohnfläche</th>
+                        <td mat-cell *matCellDef="let element">{{element.flat.area | number:'1.2-2'}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="flat_no">
+                        <th mat-header-cell *matHeaderCellDef>Wohnungsnummer</th>
+                        <td mat-cell *matCellDef="let element">{{element.flat.flat_no}}</td>
+                    </ng-container>
+                    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+                    <tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="['/flat/', row.flat.id]"></tr>
+                </table>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/my-flats/my-flats.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyFlatsComponent } from './my-flats.component';
+
+describe('MyFlatsComponent', () => {
+  let component: MyFlatsComponent;
+  let fixture: ComponentFixture<MyFlatsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MyFlatsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyFlatsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/my-flats/my-flats.component.ts

@@ -0,0 +1,63 @@
+import { Component, OnInit } from '@angular/core';
+import { MessageService } from '../message.service';
+import { FlatService, PremiseService } from '../data-object-service';
+import { Flat, Premise } from '../data-objects';
+import { MatTableDataSource } from '@angular/material/table'
+
+interface DN_Flat {
+  flat: Flat
+  premise: Premise
+}
+
+@Component({
+  selector: 'app-my-flats',
+  templateUrl: './my-flats.component.html',
+  styleUrls: ['./my-flats.component.css']
+})
+export class MyFlatsComponent implements OnInit {
+  flats: Flat[]
+  premises: Premise[]
+  dnFlats: DN_Flat[] = []
+
+  dataSource: MatTableDataSource<DN_Flat>
+  displayedColumns: string[] = ["description", "premise", "area", "flat_no"]
+
+  constructor(
+    private flatService: FlatService, 
+    private premiseService: PremiseService,
+    private messageService: MessageService
+  ) { }
+
+  async getFlats(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load flats")
+      this.flats = await this.flatService.getFlats()
+      this.messageService.add(`Flats loaded: ${ JSON.stringify(this.flats, undefined, 4) }`)
+      this.messageService.add("Trying to load premises")
+      this.premises = await this.premiseService.getPremises()
+      this.messageService.add(`Premises loaded: ${ JSON.stringify(this.premises, undefined, 4) }`)
+
+      const premisesDict = new Map<number, Premise>()
+      for (let p of this.premises) {
+        premisesDict.set(p.id, p)
+      }
+      for (let f of this.flats) {
+        this.dnFlats.push({
+          flat: f,
+          premise: premisesDict.get(f.premise)
+        })
+      }
+
+      this.dataSource = new MatTableDataSource<DN_Flat>(this.dnFlats)
+    } catch (err) {
+      // throw err
+      this.messageService.add(`Error in getFlats: ${ JSON.stringify(err, undefined, 4) }`)
+    }
+  }
+
+  ngOnInit(): void {
+    this.messageService.add("MyFlatsComponent.ngOnInit")
+    this.getFlats()
+  }
+
+}

ui/hv2-ui/src/app/my-parkings/my-parkings.component.html

@@ -0,0 +1,28 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                Meine Garagen
+                <span>Meine Garagen</span>
+                <span class="spacer"></span>
+                <a mat-button routerLink="/parking">Neu anlegen</a>
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <table mat-table [dataSource]="dataSource" #zftable>
+                    <ng-container matColumnDef="description">
+                        <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                        <td mat-cell *matCellDef="let element">{{element.parking.description}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="premise">
+                        <th mat-header-cell *matHeaderCellDef>Haus</th>
+                        <td mat-cell *matCellDef="let element">{{element.premise.description}}</td>
+                    </ng-container>
+                    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+                    <tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="['/parking/', row.parking.id]"></tr>
+                </table>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/my-parkings/my-parkings.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyParkingsComponent } from './my-parkings.component';
+
+describe('MyParkingsComponent', () => {
+  let component: MyParkingsComponent;
+  let fixture: ComponentFixture<MyParkingsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MyParkingsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyParkingsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/my-parkings/my-parkings.component.ts

@@ -0,0 +1,62 @@
+import { Component, OnInit } from '@angular/core';
+import { MessageService } from '../message.service';
+import { ParkingService, PremiseService } from '../data-object-service';
+import { Parking, Premise } from '../data-objects';
+import { MatTableDataSource } from '@angular/material/table'
+
+interface DN_Parking {
+  parking: Parking
+  premise: Premise
+}
+
+@Component({
+  selector: 'app-my-parkings',
+  templateUrl: './my-parkings.component.html',
+  styleUrls: ['./my-parkings.component.css']
+})
+export class MyParkingsComponent implements OnInit {
+  parkings: Parking[]
+  premises: Premise[]
+  dnParkings: DN_Parking[] = []
+
+  dataSource: MatTableDataSource<DN_Parking>
+  displayedColumns: string[] = ["description", "premise"]
+
+  constructor(
+    private parkingService: ParkingService, 
+    private premiseService: PremiseService,
+    private messageService: MessageService
+  ) { }
+
+  async getParkings(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load parkings")
+      this.parkings = await this.parkingService.getParkings()
+      this.messageService.add("Parkings loaded")
+      this.messageService.add("Trying to load premises")
+      this.premises = await this.premiseService.getPremises()
+      this.messageService.add(`Premises loaded: ${ JSON.stringify(this.premises, undefined, 4) }`)
+
+      const premisesDict = new Map<number, Premise>()
+      for (let p of this.premises) {
+        premisesDict.set(p.id, p)
+      }
+      for (let p of this.parkings) {
+        this.dnParkings.push({
+          parking: p,
+          premise: premisesDict.get(p.premise)
+        })
+      }
+
+      this.dataSource = new MatTableDataSource<DN_Parking>(this.dnParkings)
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  ngOnInit(): void {
+    this.messageService.add("MyParkingsComponent.ngOnInit")
+    this.getParkings()
+  }
+
+}

ui/hv2-ui/src/app/my-premises/my-premises.component.html

@@ -0,0 +1,35 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                <span>Meine Häuser</span>
+                <span class="spacer"></span>
+                <a mat-button routerLink="/premise">Neu anlegen</a>
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <table mat-table [dataSource]="dataSource" #zftable>
+                    <ng-container matColumnDef="description">
+                        <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                        <td mat-cell *matCellDef="let element">{{element.description}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="street">
+                        <th mat-header-cell *matHeaderCellDef>Strasse</th>
+                        <td mat-cell *matCellDef="let element">{{element.street}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="zip">
+                        <th mat-header-cell *matHeaderCellDef>PLZ</th>
+                        <td mat-cell *matCellDef="let element">{{element.zip}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="city">
+                        <th mat-header-cell *matHeaderCellDef>Ort</th>
+                        <td mat-cell *matCellDef="let element">{{element.city}}</td>
+                    </ng-container>
+                    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+                    <tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="['/premise/', row.id]"></tr>
+                </table>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/my-premises/my-premises.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyPremisesComponent } from './my-premises.component';
+
+describe('MyPremisesComponent', () => {
+  let component: MyPremisesComponent;
+  let fixture: ComponentFixture<MyPremisesComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MyPremisesComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyPremisesComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/my-premises/my-premises.component.ts

@@ -0,0 +1,37 @@
+import { Component, OnInit } from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table';
+import { PremiseService } from '../data-object-service';
+import { MessageService } from '../message.service';
+import { Premise } from '../data-objects'
+
+@Component({
+  selector: 'app-my-premises',
+  templateUrl: './my-premises.component.html',
+  styleUrls: ['./my-premises.component.css']
+})
+export class MyPremisesComponent implements OnInit {
+
+  premises: Premise[]
+  dataSource: MatTableDataSource<Premise>
+  displayedColumns: string[] = [ "description", "street", "zip", "city" ]
+
+  constructor(private premiseService: PremiseService, private messageService: MessageService) { }
+
+  async getPremises(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load premises")
+      this.premises = await this.premiseService.getPremises()
+      this.messageService.add("Premises loaded")
+
+      this.dataSource = new MatTableDataSource<Premise>(this.premises)
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  ngOnInit(): void {
+    this.messageService.add("MyPremisesComponent.ngOnInit")
+    this.getPremises()
+  }
+
+}

ui/hv2-ui/src/app/my-tenants/my-tenants.component.html

@@ -0,0 +1,31 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                <span>Meine Mieter/innen</span>
+                <span class="spacer"></span>
+                <a mat-button routerLink="/tenant">Neu anlegen</a>
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <table mat-table [dataSource]="dataSource" #zftable>
+                    <ng-container matColumnDef="lastname">
+                        <th mat-header-cell *matHeaderCellDef>Nachname</th>
+                        <td mat-cell *matCellDef="let element">{{element.lastname}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="firstname">
+                        <th mat-header-cell *matHeaderCellDef>Vorname</th>
+                        <td mat-cell *matCellDef="let element">{{element.firstname}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="address1">
+                        <th mat-header-cell *matHeaderCellDef>Adresse 1</th>
+                        <td mat-cell *matCellDef="let element">{{element.address1}}</td>
+                    </ng-container>
+                    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+                    <tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="['/tenant/', row.id]"></tr>
+                </table>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/my-tenants/my-tenants.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MyTenantsComponent } from './my-tenants.component';
+
+describe('MyTenantsComponent', () => {
+  let component: MyTenantsComponent;
+  let fixture: ComponentFixture<MyTenantsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ MyTenantsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MyTenantsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/my-tenants/my-tenants.component.ts

@@ -0,0 +1,37 @@
+import { Component, OnInit } from '@angular/core';
+import { MessageService } from '../message.service';
+import { TenantService } from '../data-object-service';
+import { Tenant } from '../data-objects';
+import { MatTableDataSource } from '@angular/material/table'
+
+@Component({
+  selector: 'app-my-tenants',
+  templateUrl: './my-tenants.component.html',
+  styleUrls: ['./my-tenants.component.css']
+})
+export class MyTenantsComponent implements OnInit {
+
+  tenants: Tenant[]
+  dataSource: MatTableDataSource<Tenant>
+  displayedColumns: string[] = ["lastname", "firstname", "address1"]
+
+  constructor(private tenantService: TenantService, private messageService: MessageService) { }
+
+  async getTenants(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load tenants")
+      this.tenants = await this.tenantService.getTenants()
+      this.messageService.add("Tenants loaded")
+
+      this.dataSource = new MatTableDataSource<Tenant>(this.tenants)
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  ngOnInit(): void {
+    this.messageService.add("MyTenantsComponent.ngOnInit")
+    this.getTenants()
+  }
+
+}

ui/hv2-ui/src/app/navigation/navigation.component.css

@@ -16,10 +16,6 @@
   z-index: 1;
 }
 
-.spacer {
-  flex: 1 1 auto;
-}
-
 .gittagversion {
   font-size: x-small;
   margin-right: 5em;

ui/hv2-ui/src/app/navigation/navigation.component.html

@@ -5,7 +5,16 @@
       [opened]="(isHandset$ | async) === false">
     <mat-toolbar>Menu</mat-toolbar>
     <mat-nav-list>
-      <a mat-list-item href="/test">Mein Test</a>
+      <a mat-list-item href="/tenants">Meine Mieter/innen</a>
+    </mat-nav-list><mat-divider></mat-divider><mat-nav-list>
+      <a mat-list-item href="/flats">Meine Wohnungen</a>
+      <a mat-list-item href="/parkings">Meine Garagen</a>
+      <a mat-list-item href="/commercialunits">Meine Büros</a>
+    </mat-nav-list><mat-divider></mat-divider><mat-nav-list>
+      <a mat-list-item href="/overheadadvances">Betriebskostensätze</a>
+      <a mat-list-item href="/fees">Mietsätze</a>
+    </mat-nav-list><mat-divider></mat-divider><mat-nav-list>
+      <a mat-list-item href="/premises">Meine Häuser</a>
     </mat-nav-list>
   </mat-sidenav>
   <mat-sidenav-content>
@@ -21,6 +30,7 @@
       <span>Nober Grundbesitz GbR Hausverwaltung</span>
       <span class="spacer"></span>
       <span class="gittagversion">GITTAGVERSION</span>
+      <span class="gittagversion" *ngIf="authenticated">Läuft aus in {{expiryTime | async }} Sekunden</span>
       <a *ngIf="!authenticated" mat-button routerLink="/login">Login</a>
       <a *ngIf="authenticated" mat-button routerLink="/logout">Logout</a>
     </mat-toolbar>

ui/hv2-ui/src/app/navigation/navigation.component.ts

@@ -5,6 +5,8 @@ import { map, shareReplay } from 'rxjs/operators';
 import { TokenService } from '../token.service';
 import { NavigationEnd, Router } from '@angular/router';
 
+
+
 @Component({
   selector: 'app-navigation',
   templateUrl: './navigation.component.html',
@@ -31,6 +33,10 @@ export class NavigationComponent {
     })
   }
 
+  get expiryTime(): Observable<number> {
+    return this.tokenService.expiryTime
+  }
+
   ngOnInit() {
     this.authenticated = this.tokenService.checkAuthenticated()
   }

ui/hv2-ui/src/app/note/note.component.css

@@ -0,0 +1,32 @@
+#addEntryfield {
+    margin-right: 15px;
+}
+
+#divider {
+    margin-top: 20px;
+}
+
+#firstblock {
+    margin-bottom: 20px;
+}
+
+#secondblock {
+    margin-top: 20px;
+}
+
+.rightaligned {
+    justify-self: right;
+}
+
+.large {
+    font-size: large;
+}
+
+.notearea {
+    width: 75%;
+}
+
+.topalign {
+    vertical-align: top;
+    padding-right: 10px;
+}

ui/hv2-ui/src/app/note/note.component.html

@@ -0,0 +1,53 @@
+<mat-card class="defaultCard">
+    <mat-card-header>
+        <mat-card-title>
+            Notizen
+        </mat-card-title>
+    </mat-card-header>
+    <mat-card-content>
+        <mat-accordion>
+            <mat-expansion-panel (opened)="collapse = true"
+                                (closed)="collapse = false">
+                <mat-expansion-panel-header>
+                    <mat-panel-title *ngIf="!collapse">
+                        Übersicht
+                    </mat-panel-title>
+                    <mat-panel-description>
+                    </mat-panel-description>
+                </mat-expansion-panel-header>
+    <div id="firstBlock">
+            <form (ngSubmit)="addNote()">
+                <div>
+                    <mat-form-field appearance="outline" class="notearea">
+                        <mat-label>Text</mat-label>
+                        <textarea matInput 
+                            cdkTextareaAutosize
+                            #autosize="cdkTextareaAutosize"
+                            cdkAutosizeMinRows="5"
+                            cdkAutosizeMaxRows="10"            
+                            name="note" [(ngModel)]="newNote.note"></textarea>
+                    </mat-form-field>
+                </div><div>
+                    <button #addNoteButton type="submit" mat-raised-button color="primary">Speichern</button>
+                </div>
+            </form>
+        </div>
+        <div id="secondBlock">
+            <table mat-table [dataSource]="notesDataSource" #zftable>
+                <ng-container matColumnDef="createdAt">
+                    <th mat-header-cell *matHeaderCellDef>Datum</th>
+                    <td mat-cell *matCellDef="let element" class="topalign">{{element.created_at | date}}</td>
+                </ng-container>
+                <ng-container matColumnDef="note">
+                    <th mat-header-cell *matHeaderCellDef>Notiz</th>
+                    <td mat-cell *matCellDef="let element" class="topalign">{{element.note}}</td>
+                </ng-container>
+                <tr mat-header-row *matHeaderRowDef="notesDisplayedColumns"></tr>
+                <tr mat-row *matRowDef="let row; columns: notesDisplayedColumns;"></tr>
+            </table>
+        </div>
+    </mat-expansion-panel>
+</mat-accordion>
+
+    </mat-card-content>
+</mat-card>

ui/hv2-ui/src/app/note/note.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NoteComponent } from './note.component';
+
+describe('NoteComponent', () => {
+  let component: NoteComponent;
+  let fixture: ComponentFixture<NoteComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ NoteComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(NoteComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/note/note.component.ts

@@ -0,0 +1,77 @@
+import { Component, Input, OnInit, OnChanges, ViewChild } from '@angular/core';
+import { MatButton } from '@angular/material/button';
+import { MatTableDataSource } from '@angular/material/table';
+import { NoteService } from '../data-object-service';
+import { Note, NULL_Note } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-note',
+  templateUrl: './note.component.html',
+  styleUrls: ['./note.component.css']
+})
+export class NoteComponent implements OnInit {
+
+  @Input() selectedTenantId: number
+  @ViewChild('addNoteButton') addNoteButton: MatButton
+
+  collapse: boolean = false
+
+  notes: Note[]
+  notesDataSource: MatTableDataSource<Note>
+  notesDisplayedColumns: string[] = [ "createdAt", "note" ]
+
+  newNote : Note = NULL_Note
+
+  constructor(
+    private noteService: NoteService,
+    private messageService: MessageService
+  ) { }
+
+
+  async getNotes(): Promise<void> {
+    try {
+      if (this.selectedTenantId) {
+        this.messageService.add(`Trying to load note for  ${this.selectedTenantId}`)
+        this.notes = await this.noteService.getNotesByTenant(this.selectedTenantId)
+        this.notes.reverse()
+        this.messageService.add(`Notes: ${JSON.stringify(this.notes, undefined, 4)}`)
+        this.notesDataSource = new MatTableDataSource<Note>(this.notes)
+      }
+    } catch (err) {
+      this.messageService.add(`Error in getNotes: ${JSON.stringify(err, undefined, 4)}`)
+    }
+  }
+
+  
+  async addNote(): Promise<void> {
+    try {
+      this.addNoteButton.disabled = true
+      this.newNote.tenant = this.selectedTenantId
+      this.newNote.created_at = new Date().toDateString()
+      this.messageService.add(`addNote: ${ JSON.stringify(this.newNote, undefined, 4) }`)
+      this.newNote = await this.noteService.postNote(this.newNote)
+      this.messageService.add(`New addNote created: ${this.newNote.id}`)
+      this.newNote = { 'tenant': this.selectedTenantId, 'note': '', 'created_at': '', 'id': 0 }
+      this.getNotes()
+    } catch (err) {
+      this.messageService.add(`Error in addNote: ${JSON.stringify(err, undefined, 4)}`)
+      } finally {
+      this.addNoteButton.disabled = false
+    }
+  }
+
+
+  ngOnInit(): void {
+    this.messageService.add(`NoteComponent.ngOnInit, account: ${this.selectedTenantId}`)
+    this.getNotes()
+
+  }
+
+  ngOnChanges(): void {
+    this.messageService.add(`NoteComponent.ngOnChanges, account: ${this.selectedTenantId}`)
+    this.getNotes()
+
+  }
+
+}

ui/hv2-ui/src/app/overhead-advance-details/overhead-advance-details.component.html

@@ -0,0 +1,43 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                {{overheadAdvance?.description}}
+            </mat-card-title>
+            <mat-card-subtitle>
+                ID: {{overheadAdvance?.id}}
+            </mat-card-subtitle>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <form (ngSubmit)="saveOverheadAdvance()">
+                    <div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Beschreibung</mat-label>
+                            <input matInput name="description" [(ngModel)]="overheadAdvance.description"/>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Betrag (€)</mat-label>
+                            <input matInput type="number" name="amount" [(ngModel)]="overheadAdvance.amount" [readonly]="readonly"/>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Beginn</mat-label>
+                            <input matInput name="startdate" [(ngModel)]="overheadAdvance.startdate" [matDatepicker]="startdatepicker" [readonly]="readonly"/>
+                            <mat-datepicker-toggle matSuffix [for]="startdatepicker" [disabled]="readonly"></mat-datepicker-toggle>
+                            <mat-datepicker #startdatepicker></mat-datepicker>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Ende</mat-label>
+                            <input matInput name="enddate" [(ngModel)]="overheadAdvance.enddate" [matDatepicker]="enddatepicker"/>
+                            <mat-datepicker-toggle matSuffix [for]="enddatepicker"></mat-datepicker-toggle>
+                            <mat-datepicker #enddatepicker></mat-datepicker>
+                        </mat-form-field>
+                    </div>
+                    <button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
+                </form>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/overhead-advance-details/overhead-advance-details.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { OverheadAdvanceDetailsComponent } from './overhead-advance-details.component';
+
+describe('OverheadAdvanceDetailsComponent', () => {
+  let component: OverheadAdvanceDetailsComponent;
+  let fixture: ComponentFixture<OverheadAdvanceDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ OverheadAdvanceDetailsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(OverheadAdvanceDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/overhead-advance-details/overhead-advance-details.component.ts

@@ -0,0 +1,71 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { MatButton } from '@angular/material/button';
+import { ActivatedRoute, Router } from '@angular/router';
+import { OverheadAdvanceService } from '../data-object-service';
+import { NULL_OverheadAdvance, OverheadAdvance } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-overhead-advance-details',
+  templateUrl: './overhead-advance-details.component.html',
+  styleUrls: ['./overhead-advance-details.component.css']
+})
+export class OverheadAdvanceDetailsComponent implements OnInit {
+
+  @ViewChild('submitButton') submitButton: MatButton
+
+  overheadAdvance: OverheadAdvance = NULL_OverheadAdvance
+  readonly: boolean
+
+  constructor(
+    private overheadAdvanceService: OverheadAdvanceService,
+    private messageService: MessageService,
+    private route: ActivatedRoute,
+    private router: Router
+  ) { }
+
+  async getOverheadAdvance(): Promise<void> {
+    try {
+      const id = +this.route.snapshot.paramMap.get('id')
+      this.readonly = false
+      if (id != 0) {
+        this.overheadAdvance = await this.overheadAdvanceService.getOverheadAdvance(id)
+        this.readonly = true
+      }
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  async saveOverheadAdvance() {
+    try {
+      this.submitButton.disabled = true
+      this.messageService.add("saveOverheadAdvance")
+      this.messageService.add(JSON.stringify(this.overheadAdvance, undefined, 4))
+      if (this.overheadAdvance.enddate == null) {
+        this.overheadAdvance.enddate = ''
+      }
+      if (this.overheadAdvance.startdate == null) {
+        this.overheadAdvance.startdate = ''
+      }
+      if (this.overheadAdvance.id == 0) {
+        this.messageService.add("about to insert new overheadAdvance")
+        this.overheadAdvance = await this.overheadAdvanceService.postOverheadAdvance(this.overheadAdvance)
+        this.messageService.add(`Successfully added overheadAdvance with id ${this.overheadAdvance.id}`)
+      } else {
+        this.messageService.add("about to update existing overheadAdvance")
+        this.overheadAdvance = await this.overheadAdvanceService.putOverheadAdvance(this.overheadAdvance)
+        this.messageService.add(`Successfully changed overheadAdvance with id ${this.overheadAdvance.id}`)
+      }
+      this.router.navigate(['/overheadadvances'])
+    } finally {
+      this.submitButton.disabled = false
+    }
+  }
+
+
+  ngOnInit(): void {
+    this.getOverheadAdvance()
+  }
+
+}

ui/hv2-ui/src/app/overhead-advance-list/overhead-advance-list.component.html

@@ -0,0 +1,35 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                <span>Betriebskostensätze</span>
+                <span class="spacer"></span>
+                <a mat-button routerLink="/overheadadvance">Neu anlegen</a>
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <table mat-table [dataSource]="dataSource" #zftable>
+                    <ng-container matColumnDef="description">
+                        <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                        <td mat-cell *matCellDef="let element">{{element.description}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="amount">
+                        <th mat-header-cell *matHeaderCellDef>Betrag</th>
+                        <td mat-cell *matCellDef="let element">{{element.amount | number:'1.2-2'}} €</td>
+                    </ng-container>
+                    <ng-container matColumnDef="startdate">
+                        <th mat-header-cell *matHeaderCellDef>Beginn</th>
+                        <td mat-cell *matCellDef="let element">{{element.startdate | date}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="enddate">
+                        <th mat-header-cell *matHeaderCellDef>Ende</th>
+                        <td mat-cell *matCellDef="let element">{{element.enddate | date}}</td>
+                    </ng-container>
+                    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+                    <tr mat-row *matRowDef="let row; columns: displayedColumns;" [routerLink]="['/overheadadvance/', row.id]"></tr>
+                </table>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/overhead-advance-list/overhead-advance-list.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { OverheadAdvanceListComponent } from './overhead-advance-list.component';
+
+describe('OverheadAdvanceListComponent', () => {
+  let component: OverheadAdvanceListComponent;
+  let fixture: ComponentFixture<OverheadAdvanceListComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ OverheadAdvanceListComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(OverheadAdvanceListComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/overhead-advance-list/overhead-advance-list.component.ts

@@ -0,0 +1,41 @@
+import { Component, OnInit } from '@angular/core';
+import { MatTableDataSource } from '@angular/material/table';
+import { OverheadAdvanceService } from '../data-object-service';
+import { OverheadAdvance } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-overhead-advance-list',
+  templateUrl: './overhead-advance-list.component.html',
+  styleUrls: ['./overhead-advance-list.component.css']
+})
+export class OverheadAdvanceListComponent implements OnInit {
+
+  overheadAdvances: OverheadAdvance[]
+  dataSource: MatTableDataSource<OverheadAdvance>
+  displayedColumns: string[] = [ "description", "amount", "startdate", "enddate" ]
+
+  constructor(
+    private overheadAdvanceService: OverheadAdvanceService,
+    private messageService: MessageService
+  ) { }
+  
+  async getOverheadAdvances(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load overheadAdvances")
+      this.overheadAdvances = await this.overheadAdvanceService.getOverheadAdvances()
+      this.messageService.add("OverheadAdvances loaded")
+
+      this.dataSource = new MatTableDataSource<OverheadAdvance>(this.overheadAdvances)
+    } catch (err) {
+      this.messageService.add(`Error in getOverheadAdvances: ${ JSON.stringify(err, undefined, 4) }`)
+    }
+  }
+
+
+  ngOnInit(): void {
+    this.messageService.add("OverheadAdvanceListComponent.ngOnInit")
+    this.getOverheadAdvances()
+  }
+
+}

ui/hv2-ui/src/app/parking-details/parking-details.component.html

@@ -0,0 +1,31 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                {{parking?.description}} {{premise?.description}}
+            </mat-card-title>
+            <mat-card-subtitle>
+                ID: {{parking?.id}}
+            </mat-card-subtitle>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <form (ngSubmit)="saveParking()">
+                    <div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Beschreibung</mat-label>
+                            <input matInput name="description" [(ngModel)]="parking.description"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Haus</mat-label>
+                            <mat-select [(ngModel)]="parking.premise" name="premise">
+                                <mat-option *ngFor="let p of premises" [value]="p.id">{{p.description}}</mat-option>
+                            </mat-select>
+                        </mat-form-field>
+                    </div>
+                    <button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
+                </form>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/parking-details/parking-details.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ParkingDetailsComponent } from './parking-details.component';
+
+describe('ParkingDetailsComponent', () => {
+  let component: ParkingDetailsComponent;
+  let fixture: ComponentFixture<ParkingDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ ParkingDetailsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ParkingDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/parking-details/parking-details.component.ts

@@ -0,0 +1,79 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { MatButton } from '@angular/material/button';
+import { ActivatedRoute, Router } from '@angular/router';
+import { ParkingService, PremiseService } from '../data-object-service';
+import { NULL_Parking, NULL_Premise, Parking, Premise } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-parking-details',
+  templateUrl: './parking-details.component.html',
+  styleUrls: ['./parking-details.component.css']
+})
+export class ParkingDetailsComponent implements OnInit {
+
+  @ViewChild('submitButton') submitButton: MatButton
+  
+  parking: Parking = NULL_Parking
+  premise: Premise = NULL_Premise
+
+  premises: Premise[]
+
+  constructor(
+    private parkingService: ParkingService,
+    private premiseService: PremiseService,
+    private messageService: MessageService,
+    private route: ActivatedRoute,
+    private router: Router
+  ) { }
+
+
+
+  async getParking(): Promise<void> {
+    try {
+      const id = +this.route.snapshot.paramMap.get('id')
+      if (id != 0) {
+        this.parking = await this.parkingService.getParking(id)
+        this.premise = await this.premiseService.getPremise(this.parking.premise)
+      }
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  async getPremises(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load premises")
+      this.premises = await this.premiseService.getPremises()
+      this.messageService.add("Premises loaded")
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+  
+  async saveParking() {
+    try {
+      this.submitButton.disabled = true
+      this.messageService.add(`saveParking: ${ JSON.stringify(this.parking, undefined, 4) }`)
+      if (this.parking.id == 0) {
+        this.messageService.add("about to insert new parking")
+        this.parking = await this.parkingService.postParking(this.parking)
+        this.messageService.add(`Successfully added parking with id ${this.parking.id}`)
+      } else {
+        this.messageService.add("about to update existing parking")
+        this.parking = await this.parkingService.putParking(this.parking)
+        this.messageService.add(`Successfully changed parking with id ${this.parking.id}`)
+      }
+      this.router.navigate(['/parkings'])
+    } finally {
+      this.submitButton.disabled = false
+    }
+  }
+
+
+  ngOnInit(): void {
+    this.getPremises()
+    this.getParking()
+  }
+
+}

ui/hv2-ui/src/app/premise-details/premise-details.component.html

@@ -0,0 +1,39 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                {{premise?.description}}
+            </mat-card-title>
+            <mat-card-subtitle>
+                ID: {{premise?.id}}
+            </mat-card-subtitle>
+        </mat-card-header>
+        <mat-card-content>
+            <div>
+                <form (ngSubmit)="savePremise()">
+                    <div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Beschreibung</mat-label>
+                            <input matInput name="description" [(ngModel)]="premise.description"/>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Strasse</mat-label>
+                            <input matInput name="street" [(ngModel)]="premise.street"/>
+                        </mat-form-field>
+                    </div><div>
+                        <mat-form-field appearance="outline">
+                            <mat-label>PLZ</mat-label>
+                            <input matInput name="zip" [(ngModel)]="premise.zip"/>
+                        </mat-form-field>
+                        <mat-form-field appearance="outline">
+                            <mat-label>Ort</mat-label>
+                            <input matInput name="city" [(ngModel)]="premise.city"/>
+                        </mat-form-field>
+                    </div>
+                    <button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
+                </form>
+            </div>
+        </mat-card-content>
+    </mat-card>
+</section>

ui/hv2-ui/src/app/premise-details/premise-details.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PremiseDetailsComponent } from './premise-details.component';
+
+describe('PremiseDetailsComponent', () => {
+  let component: PremiseDetailsComponent;
+  let fixture: ComponentFixture<PremiseDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ PremiseDetailsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PremiseDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/premise-details/premise-details.component.ts

@@ -0,0 +1,67 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { MatButton } from '@angular/material/button';
+import { ActivatedRoute, Router } from '@angular/router';
+import { PremiseService } from '../data-object-service';
+import { Premise } from '../data-objects';
+import { MessageService } from '../message.service';
+
+@Component({
+  selector: 'app-premise-details',
+  templateUrl: './premise-details.component.html',
+  styleUrls: ['./premise-details.component.css']
+})
+export class PremiseDetailsComponent implements OnInit {
+
+  @ViewChild('submitButton') submitButton: MatButton
+
+  premise: Premise = {
+    id: 0,
+    description: '',
+    street: '',
+    zip: '',
+    city: ''
+  }
+
+  constructor(
+    private premiseService: PremiseService,
+    private messageService: MessageService,
+    private route: ActivatedRoute,
+    private router: Router
+  ) { }
+
+  async getPremise(): Promise<void> {
+    try {
+      const id = +this.route.snapshot.paramMap.get('id')
+      if (id != 0) {
+        this.premise = await this.premiseService.getPremise(id)
+      }
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  async savePremise() {
+    try {
+      this.submitButton.disabled = true
+      this.messageService.add("savePremise")
+      this.messageService.add(JSON.stringify(this.premise, undefined, 4))
+      if (this.premise.id == 0) {
+        this.messageService.add("about to insert new premise")
+        this.premise = await this.premiseService.postPremise(this.premise)
+        this.messageService.add(`Successfully added premises with id ${this.premise.id}`)
+      } else {
+        this.messageService.add("about to update existing premise")
+        this.premise = await this.premiseService.putPremise(this.premise)
+        this.messageService.add(`Successfully changed premises with id ${this.premise.id}`)
+      }
+      this.router.navigate(['/premises'])
+    } finally {
+      this.submitButton.disabled = false
+    }
+  }
+
+  ngOnInit(): void {
+    this.getPremise()
+  }
+
+}

ui/hv2-ui/src/app/tenant-details/tenant-details.component.css

@@ -0,0 +1,7 @@
+#setenddatefield {
+    margin-right: 15px;
+}
+
+#addfeefield {
+    margin-right: 15px;
+}

ui/hv2-ui/src/app/tenant-details/tenant-details.component.html

@@ -0,0 +1,262 @@
+<section class="mat-typography">
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                {{tenant?.firstname}} {{tenant?.lastname}} 
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <mat-accordion>
+                <mat-expansion-panel (opened)="collapseTenantDetails = true"
+                                    (closed)="collapseTenantDetails = false">
+                    <mat-expansion-panel-header>
+                        <mat-panel-title *ngIf="!collapseTenantDetails">
+                            Details
+                        </mat-panel-title>
+                        <mat-panel-description>
+                        </mat-panel-description>
+                    </mat-expansion-panel-header>
+                    <div>
+                        <form (ngSubmit)="saveTenant()">
+                            <div>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Anrede</mat-label>
+                                    <input matInput name="salutation" [(ngModel)]="tenant.salutation"/>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Vorname</mat-label>
+                                    <input matInput name="firstname" [(ngModel)]="tenant.firstname"/>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Nachname</mat-label>
+                                    <input matInput name="lastname" [(ngModel)]="tenant.lastname"/>
+                                </mat-form-field>
+                            </div><div>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Adresse 1 (Straße)</mat-label>
+                                    <input matInput name="address" [(ngModel)]="tenant.address1"/>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Adresse 2</mat-label>
+                                    <input matInput name="address2" [(ngModel)]="tenant.address2"/>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Adresse 3</mat-label>
+                                    <input matInput name="address3" [(ngModel)]="tenant.address3"/>
+                                </mat-form-field>
+                            </div><div>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>PLZ</mat-label>
+                                    <input matInput name="zip" [(ngModel)]="tenant.zip"/>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Ort</mat-label>
+                                    <input matInput name="city" [(ngModel)]="tenant.city"/>
+                                </mat-form-field>
+                            </div><div>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Telefon 1</mat-label>
+                                    <input matInput name="phone1" [(ngModel)]="tenant.phone1"/>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Telefon 2</mat-label>
+                                    <input matInput name="phone2" [(ngModel)]="tenant.phone2"/>
+                                </mat-form-field>
+                            </div><div>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>IBAN</mat-label>
+                                    <input matInput name="iban" [(ngModel)]="tenant.iban"/>
+                                </mat-form-field>
+                            </div>
+<!--
+                            <div>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Account ID</mat-label>
+                                    <input matInput name="account_id" [readonly]="true" [ngModel]="account.id"/>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Account Description</mat-label>
+                                    <input matInput name="account_desc" [readonly]="true" [ngModel]="account.description"/>
+                                </mat-form-field>
+                            </div>
+-->                            
+                            <button #submitButton type="submit" mat-raised-button color="primary">Speichern</button>
+                        </form>
+                    </div>
+                </mat-expansion-panel>
+            </mat-accordion>
+        </mat-card-content>
+    </mat-card>
+          
+    <app-note [selectedTenantId]="tenantId"></app-note>
+
+    <mat-card class="defaultCard">
+        <mat-card-header>
+            <mat-card-title>
+                Mietverhältnisse
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            <mat-accordion>
+                <mat-expansion-panel #panelTenancies
+                                     (opened)="collapseTenancies = true"
+                                     (closed)="collapseTenancies = false">
+                    <mat-expansion-panel-header>
+                        <mat-panel-title *ngIf="!collapseTenancies">
+                            Übersicht
+                        </mat-panel-title>
+                        <mat-panel-description>
+                        </mat-panel-description>
+                    </mat-expansion-panel-header>
+                    <div>
+                        <table mat-table [dataSource]="tenancyDataSource" #zftable>
+                            <ng-container matColumnDef="description">
+                                <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                                <td mat-cell *matCellDef="let element">{{element.rawTenancy.description}}</td>
+                            </ng-container>
+                            <ng-container matColumnDef="flat">
+                                <th mat-header-cell *matHeaderCellDef>Wohnung</th>
+                                <td mat-cell *matCellDef="let element">{{element.flat}}</td>
+                            </ng-container>
+                            <ng-container matColumnDef="parking">
+                                <th mat-header-cell *matHeaderCellDef>Garage</th>
+                                <td mat-cell *matCellDef="let element">{{element.parking}}</td>
+                            </ng-container>
+                            <ng-container matColumnDef="commercial_premise">
+                                <th mat-header-cell *matHeaderCellDef>Büro</th>
+                                <td mat-cell *matCellDef="let element">{{element.commercial_premise}}</td>
+                            </ng-container>
+                            <ng-container matColumnDef="startdate">
+                                <th mat-header-cell *matHeaderCellDef>Beginn</th>
+                                <td mat-cell *matCellDef="let element">{{element.rawTenancy.startdate | date}}</td>
+                            </ng-container>
+                            <ng-container matColumnDef="enddate">
+                                <th mat-header-cell *matHeaderCellDef>Ende</th>
+                                <td mat-cell *matCellDef="let element">{{element.rawTenancy.enddate | date}}</td>
+                            </ng-container>
+                            <tr mat-header-row *matHeaderRowDef="tenancyDisplayColumns"></tr>
+                            <tr mat-row *matRowDef="let row; columns: tenancyDisplayColumns;" (click)="setSelectedTenancy(row.rawTenancy)"></tr>
+                        </table>
+                    </div>
+                </mat-expansion-panel>
+                <mat-expansion-panel #panelAddMapping
+                                     (opened)="openTenancyMapping()"
+                                     (closed)="closeTenancyMapping()">
+                    <mat-expansion-panel-header>
+                        <mat-panel-title *ngIf="!collapseTenancyMapping">
+                            Mietverhältnis hinzufügen
+                        </mat-panel-title>
+                        <mat-panel-description>
+                        </mat-panel-description>
+                    </mat-expansion-panel-header>
+                    <div>
+                        <form (ngSubmit)="addTenancyToTenant()">
+                            <div>
+                                <mat-form-field appearance="outline" id="setenddatefield">
+                                    <mat-label>Beginn</mat-label>
+                                    <input matInput name="startdate" [(ngModel)]="newTenancy.startdate" [matDatepicker]="newtenancystartdatepicker"/>
+                                    <mat-datepicker-toggle matSuffix [for]="newtenancystartdatepicker"></mat-datepicker-toggle>
+                                    <mat-datepicker #newtenancystartdatepicker></mat-datepicker>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Beschreibung</mat-label>
+                                    <input matInput name="description" [(ngModel)]="newTenancy.description"/>
+                                </mat-form-field>
+                            </div><div>
+                                <mat-form-field appearance="outline">
+                                    <mat-select #mapSelect [(ngModel)]="newTenancy.flat" name="flat" (selectionChange)="flatSelected()">
+                                    <mat-label>Wohnung</mat-label>
+                                        <mat-option *ngFor="let p of allFlats" [value]="p.rawFlat.id">{{p.rawFlat.description}} {{p.premise}}</mat-option>
+                                    </mat-select>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Garage</mat-label>
+                                    <mat-select #mapSelect [(ngModel)]="newTenancy.parking" name="parking" (selectionChange)="parkingSelected()">
+                                        <mat-option *ngFor="let p of allParkings" [value]="p.rawParking.id">{{p.rawParking.description}} {{p.premise}}</mat-option>
+                                    </mat-select>
+                                </mat-form-field>
+                                <mat-form-field appearance="outline">
+                                    <mat-label>Büro</mat-label>
+                                    <mat-select #mapSelect [(ngModel)]="newTenancy.commercial_premise" name="commercial_premise" (selectionChange)="commercialPremiseSelected()">
+                                        <mat-option *ngFor="let p of allCommercialPremises" [value]="p.rawCommercialPremise.id">{{p.rawCommercialPremise.description}} {{p.premise}}</mat-option>
+                                    </mat-select>
+                                </mat-form-field>
+            
+                            </div>
+                            <button #addTenancyToTenantButton type="submit" mat-raised-button color="primary">Anlegen</button>
+                        </form>
+                            </div>
+                </mat-expansion-panel>
+            </mat-accordion>
+        </mat-card-content>
+    </mat-card>
+
+    <mat-card class="defaultCard" *ngIf="selectedTenancy">
+        <mat-card-header>
+            <mat-card-title>
+                <span>{{selectedTenancy.description}}</span>
+                <button mat-icon-button color="accent" aria-label="Schließen" (click)="clearSelectedTenancy()">
+                    <mat-icon>done</mat-icon>
+                </button>
+            </mat-card-title>
+        </mat-card-header>
+        <mat-card-content>
+            Mietdetails: {{selectedTenancy.description}}
+
+            <div>
+                <form (ngSubmit)="setTenancyEndData()">
+                    <mat-form-field appearance="outline" id="setenddatefield">
+                        <mat-label>Ende</mat-label>
+                        <input matInput name="enddate" [(ngModel)]="selectedTenancy.enddate" [matDatepicker]="enddatepicker"/>
+                        <mat-datepicker-toggle matSuffix [for]="enddatepicker"></mat-datepicker-toggle>
+                        <mat-datepicker #enddatepicker></mat-datepicker>
+                    </mat-form-field>
+                    <button #setTenancyEndDataButton type="submit" mat-raised-button color="primary">Enddatum setzen</button>
+                </form>
+            </div>
+
+            <div>
+                <table mat-table [dataSource]="mappedFeesDataSource" #zftable>
+                    <ng-container matColumnDef="description">
+                        <th mat-header-cell *matHeaderCellDef>Beschreibung</th>
+                        <td mat-cell *matCellDef="let element">{{element.description}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="amount">
+                        <th mat-header-cell *matHeaderCellDef>Betrag</th>
+                        <td mat-cell *matCellDef="let element">{{element.amount | number:'1.2-2'}} €</td>
+                    </ng-container>
+                    <ng-container matColumnDef="fee_type">
+                        <th mat-header-cell *matHeaderCellDef>Typ</th>
+                        <td mat-cell *matCellDef="let element">{{element.fee_type}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="startdate">
+                        <th mat-header-cell *matHeaderCellDef>Beginn</th>
+                        <td mat-cell *matCellDef="let element">{{element.startdate | date}}</td>
+                    </ng-container>
+                    <ng-container matColumnDef="enddate">
+                        <th mat-header-cell *matHeaderCellDef>Ende</th>
+                        <td mat-cell *matCellDef="let element">{{element.enddate | date}}</td>
+                    </ng-container>
+                    <tr mat-header-row *matHeaderRowDef="mappedFeesDisplayedColumns"></tr>
+                    <tr mat-row *matRowDef="let row; columns: mappedFeesDisplayedColumns;"></tr>
+                </table>
+            </div>
+            <div>
+                <form (ngSubmit)="addFee()">
+                    <mat-form-field appearance="standard" id="addfeefield">
+                        <mat-label>Mietsatz</mat-label>
+                        <mat-select #mapSelect [(ngModel)]="selectedFee" name="fee">
+                            <mat-option *ngFor="let p of allFees" [value]="p.id">{{p.description}} {{p.amount}} {{p.startdate}}</mat-option>
+                        </mat-select>
+                    </mat-form-field>
+                    <button #mapFeeButton type="submit" mat-raised-button color="primary">Zuordnen</button>
+                </form>
+
+            </div>
+
+        </mat-card-content>
+    </mat-card>
+
+    <app-account [selectedAccountId]="tenant.account" [shallBeRentPayment]="true"></app-account>
+
+</section>

ui/hv2-ui/src/app/tenant-details/tenant-details.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { TenantDetailsComponent } from './tenant-details.component';
+
+describe('TenantDetailsComponent', () => {
+  let component: TenantDetailsComponent;
+  let fixture: ComponentFixture<TenantDetailsComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ TenantDetailsComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TenantDetailsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ui/hv2-ui/src/app/tenant-details/tenant-details.component.ts

@@ -0,0 +1,294 @@
+import { Component, OnInit, ViewChild } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { AccountService, CommercialPremiseService, FeeService, FlatService, ParkingService, PremiseService, TenancyFeeMappingService, TenancyService, TenantService } from '../data-object-service';
+import { Account, CommercialPremise, Fee, Flat, NULL_Account, NULL_CommercialPremise, NULL_Flat, NULL_Parking, NULL_Tenancy, NULL_Tenant, Parking, Premise, Tenancy, TenancyFeeMapping, Tenant } from '../data-objects';
+import { MessageService } from '../message.service';
+import { MatButton } from '@angular/material/button';
+import { MatTableDataSource } from '@angular/material/table';
+import { ExtApiService } from '../ext-data-object-service';
+import { MatExpansionPanel } from '@angular/material/expansion';
+
+
+interface DN_Tenancy {
+  rawTenancy: Tenancy
+  flat: string
+  parking: string
+  commercialPremise: string  
+}
+
+interface DN_Flat {
+  rawFlat: Flat
+  premise: string
+}
+
+interface DN_Parking {
+  rawParking: Parking
+  premise: string
+}
+
+interface DN_CommercialPremise {
+  rawCommercialPremise: CommercialPremise
+  premise: string
+}
+
+@Component({
+  selector: 'app-tenant-details',
+  templateUrl: './tenant-details.component.html',
+  styleUrls: ['./tenant-details.component.css']
+})
+export class TenantDetailsComponent implements OnInit {
+
+  tenant: Tenant = NULL_Tenant
+  tenantId: number
+
+  account: Account = NULL_Account
+
+  premisesMap: Map<number, Premise>
+
+  tenancies: DN_Tenancy[]
+  tenancyDataSource: MatTableDataSource<DN_Tenancy>
+  tenancyDisplayColumns: string[] = [ "description", "flat", "parking", "commercial_premise", "startdate", "enddate" ]
+
+  collapseTenantDetails: boolean = false
+  collapseTenancies: boolean = false
+  collapseTenancyMapping: boolean = false
+
+  selectedTenancy: Tenancy = undefined
+  mappedFees: Fee[]
+  mappedFeesDataSource: MatTableDataSource<Fee>
+  mappedFeesDisplayedColumns: string[] = [ "description", "amount", "fee_type", "startdate", "enddate" ]
+  allFees: Fee[]
+  selectedFee: number
+
+  newTenancy: Tenancy = NULL_Tenancy
+  allFlats: DN_Flat[]
+  allParkings: DN_Parking[]
+  allCommercialPremises: DN_CommercialPremise[]
+
+  @ViewChild('submitButton') submitButton: MatButton
+  @ViewChild('mapFeeButton') mapFeeButton: MatButton
+  @ViewChild('panelTenancies') panelTenancies: MatExpansionPanel
+  @ViewChild('panelAddMapping') panelAddMapping: MatExpansionPanel
+
+  constructor(
+    private tenantService: TenantService, 
+    private accountService: AccountService,
+    private tenancyService: TenancyService,
+    private flatService: FlatService,
+    private parkingService: ParkingService,
+    private commercialPremiseService: CommercialPremiseService,
+    private tenancyFeeMappingService: TenancyFeeMappingService,
+    private feeService: FeeService,
+    private extApiService: ExtApiService,
+    private premiseService: PremiseService,
+    private messageService: MessageService,
+    private route: ActivatedRoute,
+    private router: Router
+  ) { }
+
+  async getTenant(): Promise<void> {
+    try {
+      const id = +this.route.snapshot.paramMap.get('id')
+      if (id != 0) {
+        this.tenantId = id
+        this.tenant = await this.tenantService.getTenant(id)
+        this.account = await this.accountService.getAccount(this.tenant.account)
+        this.getTenancies()
+      }
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  async getTenancies(): Promise<void> {
+    try {
+      this.tenancies = []
+      await this.getPremises()
+      for (let t of await this.tenancyService.getTenancysByTenant(this.tenant.id)) {
+        const flat: Flat = (t.flat) ? await this.flatService.getFlat(t.flat) : NULL_Flat
+        const parking: Parking = (t.parking) ? await this.parkingService.getParking(t.parking) : NULL_Parking
+        const commercialPremise: CommercialPremise = (t.commercial_premise) ? await this.commercialPremiseService.getCommercialPremise(t.commercial_premise) : NULL_CommercialPremise
+        this.tenancies.push({
+          rawTenancy: t,
+          flat: (flat != NULL_Flat) ? `${flat.description} (${this.premisesMap.get(flat.premise).description})` : '',
+          parking: (parking != NULL_Parking) ? `${parking.description} (${this.premisesMap.get(parking.premise).description})` : '',
+          commercialPremise: (commercialPremise != NULL_CommercialPremise) ? `${commercialPremise.description} (${this.premisesMap.get(commercialPremise.premise).description})` : ''
+        })
+      }
+      this.tenancyDataSource = new MatTableDataSource<DN_Tenancy>(this.tenancies)
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  async saveTenant(): Promise<void> {
+    try {
+      this.submitButton.disabled = true
+      this.messageService.add("saveTenant")
+      this.messageService.add(JSON.stringify(this.tenant, undefined, 4))
+      if (this.tenant.id == 0) {
+        this.messageService.add("about to insert new tenant")
+        this.account = { 
+          "id": 0, 
+          "description": `account_${this.tenant.firstname}_${this.tenant.lastname}`
+        }
+        this.account = await this.accountService.postAccount(this.account)
+        this.tenant.account = this.account.id
+        this.tenant = await this.tenantService.postTenant(this.tenant)
+        this.messageService.add(`Successfully added account with id ${this.account.id} and tenant with id ${this.tenant.id}`)
+      } else {
+        this.messageService.add("about to update existing tenant")
+        for (const k in this.tenant) {
+          this.tenant[k] = (this.tenant[k] == undefined) ? '' : this.tenant[k]
+        }
+        this.tenant = await this.tenantService.putTenant(this.tenant)
+        this.messageService.add(`Successfully changed tenant with id ${this.tenant.id}`)
+      }
+      this.router.navigate(['/tenants'])
+    } finally {
+      this.submitButton.disabled = false
+    }
+  }
+
+  async setSelectedTenancy(selectedTenancy: Tenancy): Promise<void> {
+    this.selectedTenancy = selectedTenancy
+    this.getMappedFees()
+  }
+
+  async getMappedFees(): Promise<void> {
+    this.mappedFees = await this.extApiService.getFeeByTenancies(this.selectedTenancy.id)
+    this.messageService.add(`setSelectedTenancy: mappedFees: ${JSON.stringify(this.mappedFees, undefined, 4)}`)
+    this.mappedFeesDataSource = new MatTableDataSource<Fee>(this.mappedFees)
+    this.messageService.add("mappedFeesDataSource set")
+  }
+
+  clearSelectedTenancy(): void {
+    this.selectedTenancy = undefined
+  }
+
+  
+  async getFees(): Promise<void> {
+    try {
+      this.messageService.add("Trying to load fees")
+      this.allFees = await this.feeService.getFees()
+      this.messageService.add("fees loaded")
+    } catch (err) {
+      this.messageService.add(JSON.stringify(err, undefined, 4))
+    }
+  }
+
+  async getPremises(): Promise<void> {
+    if ((! this.premisesMap) || (this.premisesMap.size == 0)) {
+      try {
+        this.messageService.add("Trying to load premises")
+        const premises = await this.premiseService.getPremises()
+        this.premisesMap = new Map<number, Premise>()
+        for (let p of premises) {
+          this.premisesMap.set(p.id, p)
+        }
+        this.messageService.add("Premises loaded")
+      } catch (err) {
+        this.messageService.add(`Error in getPremises: ${ JSON.stringify(err, undefined, 4) }`)
+      }
+    } else {
+      this.messageService.add("Premises already loaded")
+    }
+  }
+
+  async addFee(): Promise<void> {
+    try {
+      this.mapFeeButton.disabled = true
+      this.messageService.add(`fee: ${ JSON.stringify(this.selectedFee, undefined, 4) }`)
+      let newMapping: TenancyFeeMapping = {
+        'tenancy': this.selectedTenancy.id,
+        'fee': this.selectedFee,
+        'id': 0
+      }
+      newMapping = await this.tenancyFeeMappingService.postTenancyFeeMapping(newMapping)
+      this.messageService.add(`New fee tenancy mapping created: ${newMapping.id}`)
+      this.selectedFee = undefined
+      this.getMappedFees()
+    } finally {
+      this.mapFeeButton.disabled = false
+    }
+  }
+
+  async openTenancyMapping(): Promise<void> {
+    this.messageService.add("TenancyMapping opened")
+    this.collapseTenancyMapping = true
+    await this.getPremises()
+    if (! this.allFlats) {
+      let flats = await this.flatService.getFlats()
+      this.allFlats = []
+      for (let p of flats) {
+        this.allFlats.push({
+          rawFlat: p,
+          premise: this.premisesMap.get(p.premise).description
+        })
+      }
+    }
+    if (! this.allParkings) {
+      let parkings = await this.parkingService.getParkings()
+      this.allParkings = []
+      for (let p of parkings) {
+        this.allParkings.push({
+          rawParking: p,
+          premise: this.premisesMap.get(p.premise).description
+        })
+      }
+    }
+    if (! this.allCommercialPremises) {
+      let commercialPremises = await this.commercialPremiseService.getCommercialPremises()
+      this.allCommercialPremises = []
+      for (let p of commercialPremises) {
+        this.allCommercialPremises.push({
+          rawCommercialPremise: p,
+          premise: this.premisesMap.get(p.premise).description
+        })
+      }
+    }
+  }
+
+  async closeTenancyMapping(): Promise<void> {
+    this.messageService.add("TenancyMapping closed")
+    this.collapseTenancyMapping = false
+
+  }
+
+  flatSelected(): void {
+    this.newTenancy.parking = null
+    this.newTenancy.commercial_premise = null
+  }
+
+  parkingSelected(): void {
+    this.newTenancy.flat = null
+    this.newTenancy.commercial_premise = null
+  }
+
+  commercialPremiseSelected(): void {
+    this.newTenancy.parking = null
+    this.newTenancy.flat = null
+  }
+
+  async addTenancyToTenant(): Promise<void> {
+    try {
+      this.messageService.add(`Going to mapping ${JSON.stringify(this.newTenancy, undefined, 4)}`)
+      this.newTenancy.tenant = this.tenant.id
+      this.messageService.add(`new tenancy is ${JSON.stringify(this.newTenancy, undefined, 4)}`)
+      this.newTenancy = await this.tenancyService.postTenancy(this.newTenancy)
+      this.messageService.add(`New tenancy added with id ${this.newTenancy.id}`)
+      this.panelAddMapping.close()
+      this.panelTenancies.open()
+      this.getTenancies()
+    } catch (err) {
+      this.messageService.add(`Error in addTenancyToTenant: ${ JSON.stringify(err, undefined, 4)}`)
+    }
+  }
+
+
+  ngOnInit(): void {
+    this.getTenant()
+    this.getFees()
+  }
+
+}