Untitled

<insight-edit
  [header]='header'
  [editForm]="editForm"
  [actionCmd]="actionCmd"
  [master]="master"
  [(entity)]="entity"
  (entityChange)="entityChange.emit()"
  (addBtnClick)="onAdd()"
  (updateBtnClick)="onUpdate()"
  (deleteBtnClick)="onDelete()"
  (cancelBtnClick)="onCancel()"
  [addBtnEnabled]="addBtnEnabled"
  [addConfirmIcon]="addConfirmIcon"
  [addConfirmHeader]="addConfirmHeader"
  [addConfirmMsg]="addConfirmMsg"
  [addSuccessMsg]="addSuccessMsg"
  [updateBtnEnabled]="updateBtnEnabled"
  [updateConfirmIcon]="updateConfirmIcon"
  [updateConfirmHeader]="updateConfirmHeader"
  [updateConfirmMsg]="updateConfirmMsg"
  [updateSuccessMsg]="updateSuccessMsg"
  [deleteBtnEnabled]="deleteBtnEnabled"
  [deleteConfirmIcon]="deleteConfirmIcon"
  [deleteConfirmHeader]="deleteConfirmHeader"
  [deleteConfirmMsg]="deleteConfirmMsg"
  [deleteSuccessMsg]="deleteSuccessMsg"
>
  <ng-template pTemplate="editTemplate">
    <div class="p-fluid p-formgrid p-grid" [formGroup]="editForm">

      <!-- Thông tin chung -->
      <div *ngFor="let item of workOrderType">
        <div class="p-col-12">
          <p-panel [toggleable]='true' [collapsed]='false' class='p-col-12 p-mb-2' [transitionOptions]="'0ms'">
            <ng-template pTemplate='header'>
              <p class='card-title' style="color: #0062a7;">
                Thông Tin Chung
              </p>
            </ng-template>
            <div class='p-grid'>
              <div *ngIf="layout.visible('name')"
                    [class]="layout.styleClass('name','p-field p-col-12')">
                <label class="app-display-label">
                  {{layout.label('name', 'construct.work-order.name') | translate}}
                  <small class="text-danger" *ngIf="layout.required('name')"> (*)</small>
                </label>
                <input formControlName="name" pInputText type="text" [required]="layout.required('name')" [maxLength]='300'>
                <div class="p-error" ngxErrors="name">
                  <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>
                </div>
              </div>
              <div [class]="layout.offsetClass('name')"
                  *ngIf="layout.offset('name')">
              </div>
              <div *ngIf="layout.visible('orderTypeId')"
                  [class]="layout.styleClass('orderTypeId','p-field p-col-12 p-xl-3')">
                <label class="app-display-label">
                  {{layout.label('orderTypeId', 'construct.work-order.order-type-id') | translate}}
                  <small class="text-danger" *ngIf="layout.required('orderTypeId')"> (*)</small>
                </label>
                <insight-work-order-type-dropdown formControlName="orderTypeId"
                                                  [optional]="layout.optional('orderTypeId')"
                                                  (ngModelChange) ="onWorkTypeChange($event)" ></insight-work-order-type-dropdown>
                <div class="p-error" ngxErrors="orderTypeId">
                </div>

              </div>

              <div [class]="layout.offsetClass('orderTypeId')"
                  *ngIf="layout.offset('orderTypeId')">
              </div>
              <div *ngIf="layout.visible('orderDate', false)"
                  [class]="layout.styleClass('orderDate','p-field p-col-12 p-xl-2')">
                <label class="app-display-label">
                  {{layout.label('orderDate', 'construct.work-order.order-date') | translate}}
                  <small class="text-danger" *ngIf="layout.required('orderDate')"> (*)</small>
                </label>
                <p-calendar formControlName="orderDate"
                            dateFormat="dd/mm/yy" [required]="layout.required('orderDate')" [showButtonBar]='true'></p-calendar>
                <div class="p-error" ngxErrors="orderDate">

                </div>
              </div>
              <div [class]="layout.offsetClass('orderDate')"
                  *ngIf="layout.offset('orderDate')">
              </div>
              <div *ngIf="layout.visible('estStartDate')"
                  [class]="layout.styleClass('estStartDate','p-field p-col-12 p-xl-2')">
                <label class="app-display-label">
                  {{layout.label('estStartDate', 'construct.work-order.est-start-date') | translate}}
                  <small class="text-danger" *ngIf="layout.required('estStartDate')"> (*)</small>
                </label>
                <p-calendar formControlName="estStartDate"
                            dateFormat="dd/mm/yy" [required]="layout.required('estStartDate')"
                            [showButtonBar]='true'></p-calendar>
                <div class="p-error" ngxErrors="estStartDate">
                  <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>

                </div>
              </div>
              <div [class]="layout.offsetClass('estStartDate')"
                  *ngIf="layout.offset('estStartDate')">
              </div>
              <div *ngIf="layout.visible('estEndDate')"
                  [class]="layout.styleClass('estEndDate','p-field p-col-12 p-xl-2')">
                <label class="app-display-label">
                  {{layout.label('estEndDate', 'construct.work-order.est-end-date') | translate}}
                  <small class="text-danger" *ngIf="layout.required('estEndDate')"> (*)</small>
                </label>
                <p-calendar formControlName="estEndDate"
                            dateFormat="dd/mm/yy" [required]="layout.required('estEndDate')"
                            [showButtonBar]='true'></p-calendar>
                <div class="p-error" ngxErrors="estEndDate">
                  <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>
                  <small ngxError='geTo' when='dirty'>{{'end-date-must-greeter-than-or-equal-start-date' | translate}}</small>
                </div>
              </div>
              <div [class]="layout.offsetClass('estEndDate')"
                  *ngIf="layout.offset('estEndDate')">
              </div>
              <div *ngIf="layout.visible('estFinishDate')"
                  [class]="layout.styleClass('estFinishDate','p-field p-col-12 p-xl-2')">
                <label class="app-display-label">
                  {{layout.label('estFinishDate', 'construct.work-order.est-finish-date') | translate}}
                  <small class="text-danger" *ngIf="layout.required('estFinishDate')"> (*)</small>
                </label>
                <p-calendar formControlName="estFinishDate"
                            dateFormat="dd/mm/yy" [required]="layout.required('estFinishDate')"
                            [showButtonBar]='true'></p-calendar>
                <div class="p-error" ngxErrors="estFinishDate">

                </div>
              </div>
              <div [class]="layout.offsetClass('estFinishDate')"
                  *ngIf="layout.offset('estFinishDate')">
              </div>
              <div *ngIf="layout.visible('status')"
                  [class]="layout.styleClass('status','p-field p-col-12 p-xl-3')">
                <label class="app-display-label">
                  {{layout.label('status', 'construct.work-order.status') | translate}}
                  <small class="text-danger" *ngIf="layout.required('status')"> (*)</small>
                </label>
                <insight-status formControlName="status"></insight-status>
                <div class="p-error" ngxErrors="status">
                  <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>

                </div>
              </div>
              <div *ngIf="layout.visible('description')"
                  [class]="layout.styleClass('description','p-field p-col-12')">
                <label class="app-display-label">
                  {{layout.label('description', 'construct.work-order.description') | translate}}
                  <small class="text-danger" *ngIf="layout.required('description')"> (*)</small>
                </label>
                <textarea pInputTextarea formControlName="description" [required]="layout.required('description')"></textarea>
                <div class="p-error" ngxErrors="description">

                </div>
              </div>

              <!-- Ngày nhận nhiệm vụ -->
              <div *ngIf="workType === 1"
                  [class]="layout.styleClass('estFinishDate','p-field p-col-12 p-xl-7')">
                <label class="app-display-label">
                  Ngày nhận nhiệm vụ**Todo line 153
                  <small class="text-danger"> (*)</small>
                </label>
                <p-calendar formControlName="estFinishDate"
                            dateFormat="dd/mm/yy" [required]="layout.required('estFinishDate')"
                            [showButtonBar]='true'></p-calendar>
                <div class="p-error" ngxErrors="estFinishDate">

                </div>
              </div>

              <div *ngIf="layout.visible('status') && workType === 1"
                  [class]="layout.styleClass('status','p-field p-col-12 p-xl-5')">
                <label class="app-display-label">
                  Số chứng chỉ văn bằng giám sát ------------- line 176
                  <small class="text-danger" *ngIf="layout.required('status')"> (*)</small>
                </label>
                <insight-status formControlName="status"></insight-status>
                <div class="p-error" ngxErrors="status">
                  <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>

                </div>
              </div>
              <!-- End -->

              <div [class]="layout.offsetClass('description')"
                  *ngIf="layout.offset('description')">
              </div>
              <div [class]="layout.offsetClass('status')"
                  *ngIf="layout.offset('status')">
              </div>
            </div>
          </p-panel>
        </div>
      </div>
      <!-- End Thông tin chung -->

      <!-- Thông tin bổ sung -->
      <div class="p-col-12" *ngIf="workType === 2">
        <p-panel [toggleable]='true' [collapsed]='true' class='p-col-12 p-mb-2' [transitionOptions]="'0ms'">
          <ng-template pTemplate='header'>
            <p class='card-title' style="color: #0062a7;">
              Thông tin bổ sung
            </p>
          </ng-template>
          <div class='p-grid'>
            <div *ngIf="layout.visible('name')"
                 [class]="layout.styleClass('name','p-field p-col-12')">
              <label class="app-display-label">
                Hiện trạng mặt bằng
                <small class="text-danger"> (*)</small>
              </label>
              <textarea pInputTextarea formControlName="description" [required]="layout.required('description')"></textarea>
              <div class="p-error" ngxErrors="name">
                <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>
              </div>
            </div>

            <div *ngIf="layout.visible('name')"
                 [class]="layout.styleClass('name','p-field p-col-12')">
              <label class="app-display-label">
                Cán mốc chuẩn
                <small class="text-danger"> (*)</small>
              </label>
              <input formControlName="name" pInputText type="text" [required]="layout.required('name')" [maxLength]='300'>
              <div class="p-error" ngxErrors="name">
                <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>
              </div>
            </div>


            <div *ngIf="layout.visible('name')"
                 [class]="layout.styleClass('name','p-field p-col-6')">
              <label class="app-display-label">
                Ngày gửi phương án thi công
                <small class="text-danger"> (*)</small>
              </label>
              <p-calendar formControlName="estFinishDate"
                          dateFormat="dd/mm/yy" [required]="layout.required('estFinishDate')"
                          [showButtonBar]='true'></p-calendar>
              <div class="p-error" ngxErrors="name">
                <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>
              </div>
            </div>

            <div *ngIf="layout.visible('name')"
                 [class]="layout.styleClass('name','p-field p-col-6')">
              <label class="app-display-label">
                Ngày bàn giao
                <small class="text-danger"> (*)</small>
              </label>
              <p-calendar formControlName="estFinishDate"
                          dateFormat="dd/mm/yy" [required]="layout.required('estFinishDate')"
                          [showButtonBar]='true'></p-calendar>
              <div class="p-error" ngxErrors="name">
                <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>
              </div>
            </div>

            <div *ngIf="layout.visible('name')"
                 [class]="layout.styleClass('name','p-field p-col-12')">
              <label class="app-display-label">
                Tại
                <small class="text-danger"> (*)</small>
              </label>
              <input formControlName="name" pInputText type="text" [required]="layout.required('name')" [maxLength]='300'>
              <div class="p-error" ngxErrors="name">
                <small ngxError='required' when='dirty'>{{'this-field-is-required' | translate}}</small>
              </div>
            </div>
          </div>
        </p-panel>
      </div>
      <!-- End: Thông tin bổ sung -->

      <!-- Thành phần -->
      <div class="p-col-12">
        <p-panel [toggleable]='true' [collapsed]='true' class='p-col-12 p-mb-2' [transitionOptions]="'0ms'">
          <ng-template pTemplate='header'>
            <p class='card-title' style="color: #0062a7;">
              {{ 'construct.work-order.headers.partner-class' | translate}}
            </p>
          </ng-template>
          <div class='p-grid'>
            <div class="p-col-12">
              <insight-work-order-assignment-search
                [toolbarEnabled]="true"
                [(data)]="entity.assignments"
                [master]='{workspaceId: entity?.id}'
                [batchMode]='true' [lazy]='false' [paginator]='false'
              >
              </insight-work-order-assignment-search>
            </div>
          </div>
        </p-panel>
      </div>
      <!--End: Thành phần -->

      <!-- Địa điểm làm việc -->
      <div class="p-col-12" >
        <p-panel [toggleable]='true' [collapsed]='true' class='p-col-12 p-mb-2' [transitionOptions]="'0ms'">
          <ng-template pTemplate='header'>
            <p class='card-title' style="color: #0062a7">
              {{ 'construct.work-order.headers.work-location-class' | translate}}
            </p>
          </ng-template>
          <div class='p-grid'>
            <div *ngIf="layout.visible('countryId')"
                 [class]="layout.styleClass('countryId','p-field p-col-12 p-xl-3')">
              <label class="app-display-label">
                {{layout.label('countryId', 'construct.work-order.country-id') | translate}}
                <small class="text-danger" *ngIf="layout.required('countryId')"> (*)</small>
              </label>
              <insight-country-dropdown formControlName="countryId"
                                        [optional]="layout.optional('countryId')"></insight-country-dropdown>
              <div class="p-error" ngxErrors="countryId">

              </div>
            </div>
            <div [class]="layout.offsetClass('countryId')"
                 *ngIf="layout.offset('countryId')">
            </div>
            <div *ngIf="layout.visible('regionId')"
                 [class]="layout.styleClass('regionId','p-field p-col-12 p-xl-3')">
              <label class="app-display-label">
                {{layout.label('regionId', 'construct.work-order.region-id') | translate}}
                <small class="text-danger" *ngIf="layout.required('regionId')"> (*)</small>
              </label>
              <insight-region-dropdown formControlName="regionId"
                                       [master]="{countryId: getControlValue('countryId')}"
                                       [optional]="layout.optional('regionId')"
              >
              </insight-region-dropdown>
              <div class="p-error" ngxErrors="regionId">

              </div>
            </div>
            <div [class]="layout.offsetClass('regionId')"
                 *ngIf="layout.offset('regionId')">
            </div>
            <div *ngIf="layout.visible('territoryCode')"
                 [class]="layout.styleClass('territoryCode','p-field p-col-12 p-xl-6')">
              <label class="app-display-label">
                {{layout.label('territoryCode', 'construct.work-order.territory-code') | translate}}
                <small class="text-danger" *ngIf="layout.required('territoryCode')"> (*)</small>
              </label>
              <insight-territory-auto-complete formControlName="territoryCode"
                                               [optional]="layout.optional('territoryCode')"></insight-territory-auto-complete>
              <div class="p-error" ngxErrors="territoryCode">
              </div>
            </div>
            <div [class]="layout.offsetClass('territoryCode')"
                 *ngIf="layout.offset('territoryCode')">
            </div>
            <div *ngIf="layout.visible('city')"
                 [class]="layout.styleClass('city','p-field p-col-12 p-xl-3')">
              <label class="app-display-label">
                {{layout.label('city', 'construct.work-order.city') | translate}}
                <small class="text-danger" *ngIf="layout.required('city')"> (*)</small>
              </label>
              <input formControlName="city" pInputText type="text" [required]="layout.required('city')"
                     [maxLength]='40'>
              <div class="p-error" ngxErrors="city">

              </div>
            </div>
            <div [class]="layout.offsetClass('city')"
                 *ngIf="layout.offset('city')">
            </div>
            <div *ngIf="layout.visible('district')"
                 [class]="layout.styleClass('district','p-field p-col-12 p-xl-2')">
              <label class="app-display-label">
                {{layout.label('district', 'construct.work-order.district') | translate}}
                <small class="text-danger" *ngIf="layout.required('district')"> (*)</small>
              </label>
              <input formControlName="district" pInputText type="text" [required]="layout.required('district')"
                     [maxLength]='40'>
              <div class="p-error" ngxErrors="district">

              </div>
            </div>
            <div [class]="layout.offsetClass('district')"
                 *ngIf="layout.offset('district')">
            </div>
            <div *ngIf="layout.visible('street')"
                 [class]="layout.styleClass('street','p-field p-col-12 p-xl-6')">
              <label class="app-display-label">
                {{layout.label('street', 'construct.work-order.street') | translate}}
                <small class="text-danger" *ngIf="layout.required('street')"> (*)</small>
              </label>
              <input formControlName="street" pInputText type="text" [required]="layout.required('street')"
                     [maxLength]='100'>
              <div class="p-error" ngxErrors="street">

              </div>
            </div>
            <div [class]="layout.offsetClass('street')"
                 *ngIf="layout.offset('street')">
            </div>
            <div *ngIf="layout.visible('zipCode')"
                 [class]="layout.styleClass('zipCode','p-field p-col-12 p-xl-1')">
              <label class="app-display-label">
                {{layout.label('zipCode', 'construct.work-order.zip-code') | translate}}
                <small class="text-danger" *ngIf="layout.required('zipCode')"> (*)</small>
              </label>
              <input formControlName="zipCode" pInputText type="text" [required]="layout.required('zipCode')"
                     [maxLength]='6'>
              <div class="p-error" ngxErrors="zipCode">

              </div>
            </div>
            <div [class]="layout.offsetClass('zipCode')"
                 *ngIf="layout.offset('zipCode')">
            </div>
          </div>
        </p-panel>
      </div>
      <!-- End Địa điểm làm viêc -->

      <!-- Địa điểm xác nhận -->
      <div class="p-col-12">
        <p-panel [toggleable]='true' [collapsed]='true' class='p-col-12 p-mb-2' [transitionOptions]="'0ms'">
          <ng-template pTemplate='header'>
            <p class='card-title' style="color: #0062a7;">
              {{ 'construct.work-order.headers.sign-location-class' | translate}}
            </p>
          </ng-template>
          <div class='p-grid'>
            <div *ngIf="layout.visible('signCountryId')"
                 [class]="layout.styleClass('signCountryId','p-field p-col-12 p-xl-6')">
              <label class="app-display-label">
                {{layout.label('signCountryId', 'construct.work-order.sign-country-id') | translate}}
                <small class="text-danger" *ngIf="layout.required('signCountryId')"> (*)</small>
              </label>
              <insight-country-dropdown formControlName="signCountryId"
                                        [optional]="layout.optional('signCountryId')"></insight-country-dropdown>
              <div class="p-error" ngxErrors="signCountryId">

              </div>
            </div>
            <div [class]="layout.offsetClass('signCountryId')"
                 *ngIf="layout.offset('signCountryId')">
            </div>
            <div *ngIf="layout.visible('signRegionId')"
                 [class]="layout.styleClass('signRegionId','p-field p-col-12 p-xl-6')">
              <label class="app-display-label">
                {{layout.label('signRegionId', 'construct.work-order.sign-region-id') | translate}}
                <small class="text-danger" *ngIf="layout.required('signRegionId')"> (*)</small>
              </label>
              <insight-region-dropdown formControlName="signRegionId"
                                       [optional]="layout.optional('signRegionId')"></insight-region-dropdown>
              <div class="p-error" ngxErrors="signRegionId">

              </div>
            </div>
            <div [class]="layout.offsetClass('signRegionId')"
                 *ngIf="layout.offset('signRegionId')">
            </div>
            <div *ngIf="layout.visible('signTerritoryCode')"
                 [class]="layout.styleClass('signTerritoryCode','p-field p-col-12')">
              <label class="app-display-label">
                {{layout.label('signTerritoryCode', 'construct.work-order.sign-territory-code') | translate}}
                <small class="text-danger" *ngIf="layout.required('signTerritoryCode')"> (*)</small>
              </label>
              <insight-territory-auto-complete formControlName="signTerritoryCode"
                                               [optional]="layout.optional('signTerritoryCode')"></insight-territory-auto-complete>
              <div class="p-error" ngxErrors="signTerritoryCode">

              </div>
            </div>
            <div [class]="layout.offsetClass('signTerritoryCode')"
                 *ngIf="layout.offset('signTerritoryCode')">
            </div>
            <div *ngIf="layout.visible('signCity')"
                 [class]="layout.styleClass('signCity','p-field p-col-12 p-xl-6')">
              <label class="app-display-label">
                {{layout.label('signCity', 'construct.work-order.sign-city') | translate}}
                <small class="text-danger" *ngIf="layout.required('signCity')"> (*)</small>
              </label>
              <input formControlName="signCity" pInputText type="text" [required]="layout.required('signCity')"
                     [maxLength]='40'>
              <div class="p-error" ngxErrors="signCity">

              </div>
            </div>
            <div [class]="layout.offsetClass('signCity')"
                 *ngIf="layout.offset('signCity')">
            </div>

            <div *ngIf="layout.visible('signDistrict')"
                 [class]="layout.styleClass('signDistrict','p-field p-col-12 p-xl-6')">
              <label class="app-display-label">
                {{layout.label('signDistrict', 'construct.work-order.sign-district') | translate}}
                <small class="text-danger" *ngIf="layout.required('signDistrict')"> (*)</small>
              </label>
              <input formControlName="signDistrict" pInputText type="text" [required]="layout.required('signDistrict')"
                     [maxLength]='40'>
              <div class="p-error" ngxErrors="signDistrict">

              </div>
            </div>
            <div [class]="layout.offsetClass('signDistrict')"
                 *ngIf="layout.offset('signDistrict')">
            </div>
            <div *ngIf="layout.visible('signStreet')"
                 [class]="layout.styleClass('signStreet','p-field p-col-12 p-xl-8')">
              <label class="app-display-label">
                {{layout.label('signStreet', 'construct.work-order.sign-street') | translate}}
                <small class="text-danger" *ngIf="layout.required('signStreet')"> (*)</small>
              </label>
              <input formControlName="signStreet" pInputText type="text" [required]="layout.required('signStreet')"
                     [maxLength]='100'>
              <div class="p-error" ngxErrors="signStreet">

              </div>
            </div>
            <div [class]="layout.offsetClass('signStreet')"
                 *ngIf="layout.offset('signStreet')">
            </div>
            <div *ngIf="layout.visible('signZipCode')"
                 [class]="layout.styleClass('signZipCode','p-field p-col-12 p-xl-4')">
              <label class="app-display-label">
                {{layout.label('signZipCode', 'construct.work-order.sign-zip-code') | translate}}
                <small class="text-danger" *ngIf="layout.required('signZipCode')"> (*)</small>
              </label>
              <input formControlName="signZipCode" pInputText type="text" [required]="layout.required('signZipCode')"
                     [maxLength]='6'>
              <div class="p-error" ngxErrors="signZipCode">

              </div>
            </div>
            <div [class]="layout.offsetClass('signZipCode')"
                 *ngIf="layout.offset('signZipCode')">
            </div>
          </div>
        </p-panel>
      </div>
      <!-- End Địa điển xác nhận -->

      <!-- Tiến độ thực hiện -->
      <!-- <div class="p-col-12" *ngIf="workType !== 1 && workType !== 2">
        <p-panel [toggleable]='true' [collapsed]='true' class='p-col-12 p-mb-2' [transitionOptions]="'0ms'">
          <ng-template pTemplate='header'>
            <p class='card-title' style="color: #0062a7;">
              {{ 'construct.work-order.headers.progress-class' | translate}}
            </p>
          </ng-template>
          <div class='p-grid'>
            <div *ngIf="layout.visible('stageTypeId')"
                 [class]="layout.styleClass('stageTypeId','p-field p-col-12 p-xl-3')">
              <label class="app-display-label">
                {{layout.label('stageTypeId', 'construct.work-order.stage-type-id') | translate}}
                <small class="text-danger" *ngIf="layout.required('stageTypeId')"> (*)</small>
              </label>
              <insight-stage-type-dropdown formControlName="stageTypeId"
                                           [optional]="layout.optional('stageTypeId')"></insight-stage-type-dropdown>
              <div class="p-error" ngxErrors="stageTypeId">

              </div>
            </div>
            <div [class]="layout.offsetClass('stageTypeId')"
                 *ngIf="layout.offset('stageTypeId')">
            </div>
            <div *ngIf="layout.visible('progressTypeId')"
                 [class]="layout.styleClass('progressTypeId','p-field p-col-12 p-xl-3')">
              <label class="app-display-label">
                {{layout.label('progressTypeId', 'construct.work-order.progress-type-id') | translate}}
                <small class="text-danger" *ngIf="layout.required('progressTypeId')"> (*)</small>
              </label>
              <insight-progress-type-dropdown formControlName="progressTypeId"
                                              [optional]="layout.optional('progressTypeId')"></insight-progress-type-dropdown>
              <div class="p-error" ngxErrors="progressTypeId">

              </div>
            </div>
            <div [class]="layout.offsetClass('progressTypeId')"
                 *ngIf="layout.offset('progressTypeId')">
            </div>
          </div>
        </p-panel>
      </div> -->
      <!-- End Tiến độ thực hiện -->

      <!-- Kết luận -->
      <div class="p-col-12">
        <p-panel [toggleable]='true' [collapsed]='true' class='p-col-12 p-mb-2' [transitionOptions]="'0ms'">
          <ng-template pTemplate='header'>
            <p class='card-title' style="color: #0062a7;">
              {{ 'construct.work-order.headers.conclusion-class' | translate}}
            </p>
          </ng-template>
          <div class='p-grid'>
            <div *ngIf="layout.visible('conclusionTypeId')"
                 [class]="layout.styleClass('conclusionTypeId','p-field p-col-12 p-xl-8')">
              <label class="app-display-label">
                {{layout.label('conclusionTypeId', 'construct.work-order.conclusion-type-id') | translate}}
                <small class="text-danger"> (*)</small>
              </label>
              <insight-conclusion-type-dropdown formControlName="conclusionTypeId"
                                                [optional]="layout.optional('conclusionTypeId')"></insight-conclusion-type-dropdown>
              <div class="p-error" ngxErrors="conclusionTypeId">

              </div>
            </div>

            <div [class]="layout.offsetClass('conclusionTypeId')"
                 *ngIf="layout.offset('conclusionTypeId')">
            </div>
            <div *ngIf="layout.visible('actStartDate')"
                 [class]="layout.styleClass('actStartDate','p-field p-col-12 p-xl-4')">
              <label class="app-display-label">
                {{layout.label('actStartDate', 'Ngày ký') | translate}}
                <small class="text-danger"> (*)</small>
              </label>
              <p-calendar formControlName="actStartDate"
                          dateFormat="dd/mm/yy" [required]="layout.required('actStartDate')"
                          [showButtonBar]='true'></p-calendar>
              <div class="p-error" ngxErrors="actStartDate">

              </div>
            </div>
            <div [class]="layout.offsetClass('actStartDate')"
                 *ngIf="layout.offset('actStartDate')">
            </div>
            <div *ngIf="layout.visible('signDate')"
                 [class]="layout.styleClass('signDate','p-field p-col-12 p-xl-4')">
              <label class="app-display-label">
                {{layout.label('signDate', 'Ngày bắt đầu') | translate}}
                <small class="text-danger"> (*)</small>
              </label>
              <p-calendar formControlName="signDate"
                          dateFormat="dd/mm/yy" [required]="layout.required('signDate')"
                          [showButtonBar]='true'></p-calendar>
              <div class="p-error" ngxErrors="signDate">

              </div>
            </div>
            <div [class]="layout.offsetClass('signDate')"
                 *ngIf="layout.offset('signDate')">
            </div>

            <div *ngIf="layout.visible('signDate')"
                 [class]="layout.styleClass('signDate','p-field p-col-12 p-xl-4')">
              <label class="app-display-label">
                {{layout.label('signDate', 'Ngày kết thúc') | translate}}
                <small class="text-danger"> (*)</small>
              </label>
              <p-calendar formControlName="signDate"
                          dateFormat="dd/mm/yy" [required]="layout.required('signDate')"
                          [showButtonBar]='true'></p-calendar>
              <div class="p-error" ngxErrors="signDate">

              </div>
            </div>
            <div [class]="layout.offsetClass('signDate')"
                 *ngIf="layout.offset('signDate')">
            </div>

            <div *ngIf="layout.visible('signDate')"
                 [class]="layout.styleClass('signDate','p-field p-col-12 p-xl-4')">
              <label class="app-display-label">
                {{layout.label('signDate', 'Ngày hoàn thành') | translate}}
                <small class="text-danger"> (*)</small>
              </label>
              <p-calendar formControlName="signDate"
                          dateFormat="dd/mm/yy" [required]="layout.required('signDate')"
                          [showButtonBar]='true'></p-calendar>
              <div class="p-error" ngxErrors="signDate">

              </div>
            </div>
            <div [class]="layout.offsetClass('signDate')"
                 *ngIf="layout.offset('signDate')">
            </div>

          </div>
        </p-panel>
      </div>
      <!--End: Kết luận -->


      <!-- <div class="p-col-12">
        <p-tabView>
          <p-tabPanel [header]="'efforts' | translate">
            <div class='p-grid'>
              <div class="p-col-12">
                <insight-work-order-effort-search
                  [(data)]="efforts"
                  [master]='{workspaceId: entity?.id}'
                  [batchMode]='true' [lazy]='false' [paginator]='false'
                >
                </insight-work-order-effort-search>
              </div>
            </div>
          </p-tabPanel>
          <p-tabPanel [header]="'materials' | translate">
            <div class='p-grid'>
              <div class="p-col-12">
                <insight-work-order-material-search
                  [(data)]="materials"
                  [master]='{workspaceId: entity?.id}'
                  [batchMode]='true' [lazy]='false' [paginator]='false'
                >
                </insight-work-order-material-search>
              </div>
            </div>
          </p-tabPanel>
          <p-tabPanel [header]="'wbs' | translate">
            <div class='p-grid'>
              <div class="p-col-12">
              </div>
            </div>
          </p-tabPanel>
        </p-tabView>
        </div> -->
    </div>
  </ng-template>
</insight-edit>