re style

7 months ago · fe7128efaa
9 changed files with 104 additions and 43 deletions
--- a/backend/config_parser.py
+++ b/backend/config_parser.py
@ -17,7 +17,7 @@ class NeedNVR(Exception):

 class Recorder:
    loop = asyncio.get_event_loop()
-    def __init__(self, address, port, username, password, name = "", index = 0):
+    def __init__(self, address, port, username, password, name = "", index = 0, name_overrides = {}):
        self.address = address
        self.port = int(port)
        self.username = username
@ -26,6 +26,7 @@ class Recorder:
        self.index = index
        self.channels = 0
        self.nvr_index = 0
+        self.name_overrides = name_overrides

    @property
    def nvr(self):
@ -370,7 +371,7 @@ class Config:
        self.recorders = []
        i = 0
        for raw_server in raw.get("recorders", []):
-            self.recorders.append(Recorder(raw_server.get("ip"), raw_server.get("port"), raw_server.get("user"), raw_server.get("password"), raw_server.get("name", ""), index=i))
+            self.recorders.append(Recorder(raw_server.get("ip"), raw_server.get("port"), raw_server.get("user"), raw_server.get("password"), raw_server.get("name", ""), index=i, name_overrides=raw_server.get("name_overrides", {})))
            i += 1
        if (self.recorders.__len__() == 0):
            self.logger.warning("Recorders not find")
--- a/backend/server.py
+++ b/backend/server.py
@ -51,7 +51,10 @@ class Server:
                nvr:NVR = self.config.getRecorder(recorder_index).nvr
                await nvr.login()
                channels = await nvr.channels()
-                return {"ok":True, "data":channels}
+                overrides = []
+                for channel in channels:
+                    overrides.append(self.config.getRecorder(recorder_index).name_overrides.get(channel, channel))
+                return {"ok":True, "data":overrides}
            except Exception as e:
                traceback.print_exc()
                response.status_code = 400
--- a/frontend/ang_dvrip/src/app/app.component.css
+++ b/frontend/ang_dvrip/src/app/app.component.css
@ -0,0 +1,7 @@
+.container {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
--- a/frontend/ang_dvrip/src/app/app.component.html
+++ b/frontend/ang_dvrip/src/app/app.component.html
@ -1,32 +1,71 @@
 <ng-container>
-  <mat-toolbar style="border-bottom: black 1px solid">
-    <span>DVRIP Клиент</span>
-    <mat-spinner *ngIf="loading" [diameter]="50"></mat-spinner>
-    <span class="spacer"></span>
-    <ng-container *ngIf="!loading">
-      <mat-form-field *ngIf="availble_channels.length>0">
-        <mat-select [(value)]="selected_channel" (valueChange)="goToRoot()">
-          <mat-option *ngFor="let r of availble_channels" [value]="availble_channels.indexOf(r)">{{r}}</mat-option>
-        </mat-select>
-      </mat-form-field>
-      <p *ngIf="availble_channels.length==0">Нет доступных каналов</p>
-      <span class="spacer"></span>
-      <mat-form-field *ngIf="availble_recorders.length>0">
-        <mat-select [(value)]="selected_recorder" (valueChange)="getChannels(selected_recorder)">
-          <mat-option *ngFor="let r of availble_recorders" [value]="availble_recorders.indexOf(r)">{{r}}</mat-option>
-        </mat-select>
-      </mat-form-field>
-      <p *ngIf="availble_recorders.length==0">Нет доступных рекордеров</p>
-    </ng-container>
-  </mat-toolbar>
-  <mat-toolbar *ngIf="!loading && availble_channels.length>0 && availble_recorders.length>0" style="border-bottom: black 1px solid">
-    <button mat-button [routerLink]="['about', selected_recorder, selected_channel]">Обзор</button>
-    <span class="spacer"></span>
-    <button mat-button [routerLink]="['stream', selected_recorder, selected_channel]">Просмотр в реальном времени</button>
-    <span class="spacer"></span>
-    <button mat-button [routerLink]="['history', selected_recorder, selected_channel]">История обнаружений</button>
+
+  <mat-sidenav-container class="container">
+    <mat-sidenav #sidenav mode="over">
+      <div>
+        <mat-toolbar (click)="sidenav.toggle()">
+          <button mat-icon-button>
+            <mat-icon>menu</mat-icon>
+          </button>
+          <span>Закрыть</span>
+        </mat-toolbar>
+        <br>
+        <mat-form-field *ngIf="availble_recorders.length>0">
+          <mat-label>Выбранный рекордер</mat-label>
+          <mat-select [(value)]="selected_recorder" (valueChange)="getChannels(selected_recorder)">
+            <mat-option *ngFor="let r of availble_recorders" [value]="availble_recorders.indexOf(r)">{{r}}</mat-option>
+          </mat-select>
+        </mat-form-field>
+        <p *ngIf="availble_recorders.length==0">Нет доступных рекордеров</p>
+        <br>
+        <mat-form-field *ngIf="availble_channels.length>0">
+          <mat-label>Выбранный канал</mat-label>
+          <mat-select [(value)]="selected_channel" (valueChange)="goToRoot()">
+            <mat-option *ngFor="let r of availble_channels" [value]="availble_channels.indexOf(r)">{{r}}</mat-option>
+          </mat-select>
+        </mat-form-field>
+        <p *ngIf="availble_channels.length==0">Нет доступных каналов</p>
+        <br>
+        <span>DVRIP Клиент <span style="color: darkgrey">{{version}}</span></span>
+      </div>
+    </mat-sidenav>
+
+    <mat-sidenav-content>
+      <mat-toolbar>
+        <button mat-icon-button (click)="sidenav.toggle()">
+          <mat-icon>menu</mat-icon>
+        </button>
+        <span>{{availble_recorders.length == 0?'Нет доступных рекордеров':availble_recorders[selected_recorder]}}
+          <span>{{availble_channels.length == 0?'':'/ ' + availble_channels[selected_channel]}}</span>
+        </span>
+        <span class="spacer"></span>
+        <button mat-button [routerLink]="['about', selected_recorder, selected_channel]">Обзор</button>
+        <span class="spacer"></span>
+        <button mat-button [routerLink]="['stream', selected_recorder, selected_channel]">Просмотр в реальном времени</button>
+        <span class="spacer"></span>
+        <button mat-button [routerLink]="['history', selected_recorder, selected_channel]">История обнаружений</button>
+        <!--<span class="spacer"></span>
+        <button mat-button>Бибки</button>-->
+      </mat-toolbar>
+      <router-outlet></router-outlet>
+    </mat-sidenav-content>
+  </mat-sidenav-container>
+</ng-container>
+<!--<ng-container>
+<mat-toolbar style="border-bottom: black 1px solid">
+  <span>DVRIP Клиент <span style="color: darkgrey">{{version}}</span></span>
+  <mat-spinner *ngIf="loading" [diameter]="50"></mat-spinner>
+  <span class="spacer"></span>
+  <ng-container *ngIf="!loading">
+
+
    <span class="spacer"></span>
-    <button mat-button>Бибки</button>
-  </mat-toolbar>
+
+  </ng-container>
+</mat-toolbar>
+<mat-toolbar *ngIf="!loading && availble_channels.length>0 && availble_recorders.length>0" style="border-bottom: black 1px solid">
+
+</mat-toolbar>
 </ng-container>
-<router-outlet></router-outlet>
+
+-->
--- a/frontend/ang_dvrip/src/app/app.component.ts
+++ b/frontend/ang_dvrip/src/app/app.component.ts
@ -2,6 +2,7 @@ import {Component, OnInit} from '@angular/core';
 import {ApiService} from "./services/ApiService";
 import {HttpClient} from "@angular/common/http";
 import {ActivatedRoute, Router} from "@angular/router";
+import {version} from "./version";

@Component({
  selector: 'app-root',
@ -14,6 +15,7 @@ export class AppComponent implements OnInit {
  availble_channels:string[] = [];
  selected_channel:number = 0;
  loading:boolean = true
+  version = version;

  ngOnInit(): void {
    this.getRecorders();
--- a/frontend/ang_dvrip/src/app/components/history/history.component.html
+++ b/frontend/ang_dvrip/src/app/components/history/history.component.html
@ -8,14 +8,14 @@
      </mat-select>
    </mat-form-field>
    <mat-form-field style="padding-right: 1%; padding-left: 1%">
-      <mat-label>Choose a date</mat-label>
+      <mat-label>Дата начала поиска</mat-label>
      <input matInput [matDatepicker]="picker_start" [ngModel]="start_date" (dateChange)="setDate($event, 'start')">
      <mat-hint>MM/DD/YYYY</mat-hint>
      <mat-datepicker-toggle matSuffix [for]="picker_start"></mat-datepicker-toggle>
      <mat-datepicker #picker_start></mat-datepicker>
    </mat-form-field>
    <mat-form-field style="padding-right: 1%; padding-left: 1%">
-      <mat-label>Choose a date</mat-label>
+      <mat-label>Дата конца поиска</mat-label>
      <input matInput [matDatepicker]="picker_end" [ngModel]="end_date" (dateChange)="setDate($event, 'end')">
      <mat-hint>MM/DD/YYYY</mat-hint>
      <mat-datepicker-toggle matSuffix [for]="picker_end"></mat-datepicker-toggle>
@ -31,7 +31,12 @@
      <mat-card-title>{{element.filename}}</mat-card-title>
      <mat-card-subtitle>{{baseUtils.getFancySize(element.size)}}</mat-card-subtitle>
    </mat-card-header>
-    <img mat-card-image style="cursor: pointer" (click)="openTransCodeDialog(element)" [src]="'api/dvrip/preview/'+recorder_index+'?b64='+element.b64" alt="Превью">
+    <img
+      mat-card-image
+      style="cursor: pointer"
+      (click)="openTransCodeDialog(element)"
+      [src]="'api/dvrip/preview/'+recorder_index+'?b64='+element.b64"
+      alt="Превью недоступно">
    <mat-card-content>
    </mat-card-content>
    <mat-card-actions>
--- a/frontend/ang_dvrip/src/app/components/history/history.component.ts
+++ b/frontend/ang_dvrip/src/app/components/history/history.component.ts
@ -46,6 +46,7 @@ export class HistoryComponent implements OnInit {
    switch (type) {
      case "start": {
        this.start_date = event.value == null?null:event.value;
+        this.end_date = this.start_date;
        break;
      }
      case "end": {
--- a/frontend/ang_dvrip/src/app/components/stream/stream.component.html
+++ b/frontend/ang_dvrip/src/app/components/stream/stream.component.html
@ -1,12 +1,14 @@
 <div style="text-align: center">
-  <mat-form-field>
-    <mat-label>Выбранный поток</mat-label>
-    <mat-select [(value)]="selected_stream" (valueChange)="getStreamUrl()">
-      <mat-option [value]="0">Основной</mat-option>
-      <mat-option [value]="1">Дополнительный</mat-option>
-    </mat-select>
-  </mat-form-field>
-  <button mat-button (click)="getOpenNewWindow()">Открыть в новом окне</button>
+  <div style="text-align: center; padding-top: 1%; padding-bottom: 1%">
+    <mat-form-field  style="padding-right: 1%; padding-left: 1%">
+      <mat-label>Выбранный поток</mat-label>
+      <mat-select [(value)]="selected_stream" (valueChange)="getStreamUrl()">
+        <mat-option [value]="0">Основной</mat-option>
+        <mat-option [value]="1">Дополнительный</mat-option>
+      </mat-select>
+    </mat-form-field>
+    <button  style="padding-right: 1%; padding-left: 1%" mat-button (click)="getOpenNewWindow()">Открыть в новом окне</button>
+  </div>
 </div>
 <ng-container>
  <iframe width="100%" height="100%" [src]="url"></iframe>
--- a/frontend/ang_dvrip/src/app/version.ts
+++ b/frontend/ang_dvrip/src/app/version.ts
@ -0,0 +1 @@
+export const version = "dev";