producer-edit-documents.component.html 13.7 KB
Newer Older
1 2
<div class="fixed-header">
  Dokumentatsioon
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
3
  <button (click)="closeModal()" class="btn btn-sm btn-secondary close-modal-btn pull-right"><i class="fa fa-remove" aria-hidden="true"></i></button>
4
</div>
5
<section class="col card p-3 main-content scrollable-modal-content">
mark.kimask's avatar
mark.kimask committed
6
  <div class="my-1">
Kertu Hiire's avatar
Kertu Hiire committed
7
    <app-tooltip [text]='"Laadi üles infosüsteemi dokumentatsioon: arhitektuuri dokument, eelanalüüs, liideste kirjeldus ja muud sarnast"'></app-tooltip>
Mark Kimask's avatar
Mark Kimask committed
8
    <form #addForm="ngForm">
9
      <div class="form-group">
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
10
        <button class="btn btn-secondary ml-2"
11
                [disabled]="uploading"
12
                (click)="showAddFileFields = !showAddFileFields; showAddLinkFields = false"><i class="fa fa-plus fa-fw" aria-hidden="true"></i>&nbsp;Laadi fail</button>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
13
        <button class="btn btn-secondary ml-2"
14 15
                [disabled]="uploading"
                (click)="showAddLinkFields = !showAddLinkFields; showAddFileFields = false"><i class="fa fa-plus fa-fw" aria-hidden="true"></i>&nbsp;Lisa veebiviide</button>
16
      </div>
17 18 19 20
      <div *ngIf="showAddFileFields">
        <div class="form-group">
          <label for="dataFile" class="text-muted separated-text">Fail:</label>
          <div></div>
21
          <label class="btn btn-secondary input-file-label mb-0" style="margin-right:5px;" for="dataFile">Vali fail</label>
22 23 24 25
          <input class="d-none" id="dataFile" name="dataFile" type="file" (change)="fileChange($event)">
          <span *ngIf="docFile != null" claas="col-4">{{ docFile.name }}</span>
          <i *ngIf="uploading" class="fa fa-spinner fa-spin fa-fw"></i>
        </div>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
26
        <div class="form-group">
27
          <label for="fileType" class="text-muted separated-text">Liik:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
28 29 30
          <select id="fileType"
                  [ngClass]="{'is-invalid': fileType.invalid && (fileType.dirty || fileType.touched)}"
                  class="form-control col-12"
31 32 33 34
                  #fileType="ngModel"
                  [(ngModel)]="data.type"
                  name="fileType" required>
            <option [value]="''" disabled selected>Vali faili liik...</option>
35
            <option *ngFor="let type of generalHelperService.toArray(classifiers.document_types)" [value]="type.code" selected>{{ type.value }}</option>
36 37 38 39
          </select>
        </div>
        <div class="form-group row">
          <div class="col-12">
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
40
            <button class="btn btn-secondary pull-right"
41 42 43 44
                    [disabled]="docFile === null || uploading"
                    (click)="uploadFile($event, addForm)"><i class="fa fa-plus fa-fw" aria-hidden="true"></i>&nbsp;Lisa</button>
          </div>
        </div>
45
      </div>
46
      <div *ngIf="showAddLinkFields">
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
47
        <div class="form-group">
48
          <label for="url" class="text-muted separated-text">URL:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
49 50 51
          <input id="url"
                 [ngClass]="{'is-invalid': url.invalid && (url.dirty || url.touched)}"
                 class="form-control col-12"
52 53 54 55 56 57 58
                 #url="ngModel"
                 [disabled]="uploading"
                 [(ngModel)]="data.url"
                 type="url"
                 placeholder="http://www.example.com"
                 (keyup.enter)="addTechDoc(addForm)"
                 name="url" url required>
mark.kimask's avatar
mark.kimask committed
59

60
        </div>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
61
        <div class="form-group">
62
          <label for="linkName" class="text-muted separated-text">Pealkiri:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
63 64 65
          <input id="linkName"
                 [ngClass]="{'is-invalid': linkName.invalid && (linkName.dirty || linkName.touched)}"
                 class="form-control col-12"
66
                 #linkName="ngModel"
67 68 69 70
                 [disabled]="uploading"
                 [(ngModel)]="data.name"
                 placeholder="Lähtekood"
                 (keyup.enter)="addTechDoc(addForm)"
71
                 name="linkName" required>
mark.kimask's avatar
mark.kimask committed
72

73
        </div>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
74
        <div class="form-group">
75
          <label for="linkType" class="text-muted separated-text">Liik:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
76 77 78
          <select id="linkType"
                  [ngClass]="{'is-invalid': linkType.invalid && (linkType.dirty || linkType.touched)}"
                  class="form-control col-12"
79 80 81
                  #linkType="ngModel"
                  [(ngModel)]="data.type"
                  name="linkType" required>
82
            <option [value]="''" disabled selected>Vali veebiviite liik...</option>
83
            <option *ngFor="let type of generalHelperService.toArray(classifiers.document_types)" [value]="type.code" selected>{{ type.value }}</option>
84 85
          </select>
        </div>
86 87
        <div class="form-group row">
          <div class="col-12">
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
88
            <button class="btn btn-secondary pull-right"
89 90 91
                    [disabled]="uploading"
                    (click)="addTechDoc(addForm)"><i class="fa fa-plus fa-fw" aria-hidden="true"></i>&nbsp;Lisa</button>
          </div>
Mark Kimask's avatar
Mark Kimask committed
92 93
        </div>
      </div>
Mark Kimask's avatar
Mark Kimask committed
94 95 96 97 98
    </form>
    <form #editForm="ngForm">
      <div class="expandable-blocks">
        <div class="expandable-block" *ngFor="let doc of documents; let i = index">
          <div class="expandable-block-header" [ngClass]="{'highlighted': blocks[i]}">
99
            <app-file-icon [file]="doc" style="margin-right:5px;"></app-file-icon>
100
            <a href="{{ generalHelperService.getFileUrl(doc.url, system.details.short_name) }}" target="_blank">{{ doc.name }}</a>
101
            <app-file-hint [file]="doc"></app-file-hint>
Mark Kimask's avatar
Mark Kimask committed
102
            <button (click)="deleteTechDoc(i)" class="btn btn-danger btn-sm pull-right"><i class="fa fa-fw fa-trash-o"></i></button>
103
            <button (click)="blocks[i] = !blocks[i]" class="btn btn-sm pull-right mr-1 btn-primary"><i class="fa fa-fw" [ngClass]="{'fa-pencil': !blocks[i], 'fa-chevron-up': blocks[i] }"></i></button>
Mark Kimask's avatar
Mark Kimask committed
104 105
          </div>
          <div *ngIf="blocks[i]" class="expandable-block-body">
106
            <div *ngIf="!isUploaded(doc)">
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
107
              <div class="form-group">
108
                <label for="{{'url' + i}}" class="text-muted separated-text">URL:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
109 110 111
                <input id="{{'url' + i}}"
                       [ngClass]="{'is-invalid': urlEdit.invalid}"
                       class="form-control col-12"
112 113 114 115 116
                       [(ngModel)]="documents[i].url"
                       #urlEdit="ngModel"
                       type="url"
                       placeholder="http://www.example.com"
                       name="{{'url' + i}}" url required>
Mark Kimask's avatar
Mark Kimask committed
117

118
              </div>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
119
              <div class="form-group">
120
                <label for="{{'linkName' + i}}" class="text-muted separated-text">Pealkiri:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
121 122 123
                <input id="{{'linkName' + i}}"
                       [ngClass]="{'is-invalid': nameEdit.invalid}"
                       class="form-control col-12"
124 125 126 127 128 129
                       [(ngModel)]="documents[i].name"
                       #nameEdit="ngModel"
                       placeholder="Lähtekood"
                       name="{{'name' + i}}" required>

              </div>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
130
              <div class="form-group">
131
                <label for="{{'linkType' + i}}" class="text-muted separated-text">Liik:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
132 133 134
                <select id="{{'linkType' + i}}"
                        [ngClass]="{'is-invalid': linkTypeEdit.invalid}"
                        class="form-control col-12"
135 136 137
                        #linkTypeEdit="ngModel"
                        [(ngModel)]="documents[i].type"
                        name="{{'linkType' + i}}" required>
138
                  <option [value]="''" disabled selected>Vali veebiviite liik...</option>
139
                  <option *ngFor="let type of generalHelperService.toArray(classifiers.document_types)" [value]="type.code" selected>{{ type.value }}</option>
140 141
                </select>
              </div>
Mark Kimask's avatar
Mark Kimask committed
142
            </div>
143
            <div *ngIf="isUploaded(doc)">
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
144
              <div class="form-group">
145
                <label for="{{'fileName' + i}}" class="text-muted separated-text">Pealkiri:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
146 147 148
                <input id="{{'fileName' + i}}"
                       [ngClass]="{'is-invalid': nameEdit.invalid}"
                       class="form-control col-12"
149 150 151 152
                       [(ngModel)]="documents[i].name"
                       #nameEdit="ngModel"
                       placeholder="Lähtekood"
                       name="{{'name' + i}}" required>
Mark Kimask's avatar
Mark Kimask committed
153

154
              </div>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
155
              <div class="form-group">
156
                <label for="{{'fileType' + i}}" class="text-muted separated-text">Liik:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
157 158 159
                <select id="{{'fileType' + i}}"
                        [ngClass]="{'is-invalid': fileTypeEdit.invalid}"
                        class="form-control col-12"
160 161 162 163
                        #fileTypeEdit="ngModel"
                        [(ngModel)]="documents[i].type"
                        name="{{'fileType' + i}}" required>
                  <option [value]="''" disabled selected>Vali faili liik...</option>
164
                  <option *ngFor="let type of generalHelperService.toArray(classifiers.document_types)" [value]="type.code" selected>{{ type.value }}</option>
165 166
                </select>
              </div>
167 168 169 170 171 172 173 174 175 176 177
              <div class="my-2 mx-0 row switch-container">
                <div [ngClass]="{'text-muted': documents[i].accessRestriction}" class="mr-2">Juurdepääsupiiranguta</div>
                <ui-switch size="small"
                           color="#023cc1"
                           (change)="clearAccessRestriction($event, i)"
                           defaultBgColor="#7a838a"
                           defaultBoColor="#023cc1"
                           [checked]="documents[i].accessRestriction != null"></ui-switch>
                <div [ngClass]="{'text-muted': !documents[i].accessRestriction}" class="ml-2">Juurdepääsupiiranguga</div>
              </div>
              <div *ngIf="documents[i].accessRestriction">
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
178
                <div class="form-group mt-2">
179
                  <label for="restrictionReason" class="text-muted separated-text">Alus:</label>
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
180 181 182
                  <select id="restrictionReason"
                          [ngClass]="{'is-invalid': restrictionReason.invalid && (restrictionReason.dirty || restrictionReason.touched)}"
                          class="form-control col-12"
183
                          #restrictionReason="ngModel"
Mark Kimask's avatar
Mark Kimask committed
184
                          [(ngModel)]="documents[i].accessRestriction.reasonCode"
185
                          name="restrictionReason" required>
186
                    <option [value]="''" disabled selected>Vali piirangu alus...</option>
187
                    <option *ngFor="let reason of generalHelperService.toJsonArray(classifiers.access_restriction_reasons)" [value]="reason.code" selected>{{ reason.value.legislation }} - {{ reason.value.description }}</option>
188 189
                  </select>
                </div>
190 191 192 193
                <div class="row">
                  <div class="form-group col-6">
                    <label class="text-muted">Juurepääs piiratud alates:</label>
                    <div class="row">
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
194 195 196 197 198 199 200
                      <div class="input-group datepicker col-8">
                        <input id="{{ 'access_restriction_start_' + i }}"
                               [ngClass]="{'is-invalid': restrictionStartTimestampInput.invalid  && (restrictionStartTimestampInput.dirty || restrictionStartTimestampInput.touched)}"
                               class="form-control"
                               placeholder="yyyy-mm-dd"
                               [container]="'body'"
                               name="{{ 'restrictionStart' + i }}"
201 202 203 204
                               [(ngModel)]="documents[i].accessRestriction.startDate"
                               [required]="documents[i].accessRestriction"
                               #restrictionStartTimestampInput="ngModel"
                               ngbDatepicker
205
                               [placement]="'top'"
206 207 208 209 210 211 212 213 214 215
                               #restrictionStartTimestamp="ngbDatepicker">
                        <span class="input-group-btn">
                          <button (click)="restrictionStartTimestamp.toggle()" class="btn btn-outline-primary btn-02 open-datepicker"><span class="fa fa-calendar"></span></button>
                        </span>
                      </div>
                    </div>
                  </div>
                  <div class="form-group col-6">
                    <label class="text-muted">Juurepääs piiratud kuni:</label>
                    <div class="row">
Aleksandr Ivanov's avatar
fixed  
Aleksandr Ivanov committed
216 217 218 219 220
                      <div class="input-group datepicker col-8">
                        <input id="{{ 'access_restriction_end_' + i }}"
                               [ngClass]="{'is-invalid': restrictionEndTimestampInput.invalid  && (restrictionEndTimestampInput.dirty || restrictionEndTimestampInput.touched)}"
                               class="form-control"
                               placeholder="yyyy-mm-dd"
221
                               [container]="'body'"
222 223 224 225 226
                               name="{{ 'restrictionEnd' + i }}"
                               [(ngModel)]="documents[i].accessRestriction.endDate"
                               [required]="documents[i].accessRestriction"
                               #restrictionEndTimestampInput="ngModel"
                               ngbDatepicker
227
                               [placement]="'top'"
228 229 230 231 232
                               #restrictionEndTimestamp="ngbDatepicker">
                        <span class="input-group-btn">
                          <button (click)="restrictionEndTimestamp.toggle()" class="btn btn-outline-primary btn-02 open-datepicker"><span class="fa fa-calendar"></span></button>
                        </span>
                      </div>
233 234 235 236
                    </div>
                  </div>
                </div>
              </div>
Mark Kimask's avatar
Mark Kimask committed
237 238 239
            </div>
          </div>
        </div>
Mark Kimask's avatar
Mark Kimask committed
240
      </div>
241
      <div class="actions-bar mt-3">
Mark Kimask's avatar
Mark Kimask committed
242
        <div class="buttons pull-right">
Mark Kimask's avatar
Mark Kimask committed
243
          <button (click)="saveSystem(editForm)" class="btn btn-success pull-right">Salvesta</button>
Mark Kimask's avatar
Mark Kimask committed
244
        </div>
mark.kimask's avatar
mark.kimask committed
245
      </div>
Mark Kimask's avatar
Mark Kimask committed
246
    </form>
mark.kimask's avatar
mark.kimask committed
247 248
  </div>
</section>