import{Rb as y}from"./chunk-YSQLW2JA.js";import{H as r,T as k,za as v}from"./chunk-NVJ2ZZFT.js";import{Aa as i,Hb as u,Nc as g,Pd as h,Qf as S,Sd as C,ab as m,cb as p,db as f,dd as x,gb as b,ya as d}from"./chunk-SKPDQO4E.js";var w=`<div class="modal-header">
  <span class="text-lg">{{remoteAccessPointName}}</span>
</div>

<div class="modal-body">
  <ng-container *ngFor="let accessControlPointRemoteState of accessControlPointRemoteStates">
    <div class="row">
      <div class="col-12">
        <ng-container [ngSwitch]="accessControlPointRemoteState.direction">
          <div class="title" *ngSwitchCase="0">{{'DIRECTIONTYPE.BOTH'|translate}}</div>
          <div class="title" *ngSwitchCase="1">{{'DIRECTIONTYPE.ENTRANCE'|translate}}</div>
          <div class="title" *ngSwitchCase="2">{{'DIRECTIONTYPE.EXIT'|translate}}</div>
        </ng-container>
        <div class="settings-container">
          <ng-template *ngTemplateOutlet="stateSelection; context: {$implicit: accessControlPointRemoteState}">
          </ng-template>
        </div>
      </div>
    </div>
  </ng-container>
</div>
<div class="modal-footer">
  <button class="btn btn-outline-primary me-2" (click)="onCancelClicked($event)">{{'BUTTON.CLOSE' | translate}}</button>
  <button class="btn btn-primary" (click)="onSaveClicked($event)">
    {{'BUTTON.SAVE' | translate}}
  </button>
</div>

<!-- SELECTION UI TEMPLATE -->
<ng-template #stateSelection let-accessControlPointRemoteState>
  <div class="row">
    <div class="col-4">
      <div class="state-button" [attr.state]="2" [attr.selected]="accessControlPointRemoteState.state==2"
        (click)="accessControlPointRemoteState.state=2">
        <div class="icon-container">
          <cds-icon shape="walking" style="width: 42px; height: 42px;"></cds-icon>
        </div>
        <span class="title">{{'REMOTECONTROL.CONTROL_STATE_STAYOPENNED' | translate}}</span>
        <span class="sub-title">{{'REMOTECONTROL.CONTROL_STATE_NO_CREDENTIAL_CONTROL' | translate}}</span>
      </div>
    </div>
    <div class="col-4">
      <div class="state-button" [attr.state]="1" [attr.selected]="accessControlPointRemoteState.state==1"
        (click)="accessControlPointRemoteState.state=1">
        <div class="icon-container">
          <cds-icon shape="police-hat" style="width: 42px; height: 42px;"></cds-icon>
        </div>
        <span class="title">{{'REMOTECONTROL.CONTROL_STATE_NORMAL' | translate}}</span>
        <span class="sub-title">{{'REMOTECONTROL.CONTROL_STATE_CREDENTIAL_CONTROL' | translate}}</span>
      </div>
    </div>
    <div class="col-4">
      <div class="state-button" [attr.state]="3" [attr.selected]="accessControlPointRemoteState.state==3"
        (click)="accessControlPointRemoteState.state=3">
        <div class="icon-container">
          <cds-icon shape="no-access" style="width: 60px; height: 60px;" solid></cds-icon>
        </div>
        <span class="title">{{'REMOTECONTROL.CONTROL_STATE_DISABLED' | translate}}</span>
        <span class="sub-title">{{'REMOTECONTROL.CONTROL_STATE_NO_CREDENTIAL_CONTROL' | translate}}</span>
      </div>
    </div>
  </div>
</ng-template>`;var E=`.justify-content-center{-webkit-box-pack:center;-moz-box-pack:center;-webkit-flex-pack:center;-ms-flex-pack:center;-moz-justify-content:center;-webkit-justify-content:center;justify-content:center}.justify-content-flex-end{-webkit-box-pack:end;-moz-box-pack:end;-webkit-flex-pack:end;-ms-flex-pack:end;-moz-justify-content:flex-end;-webkit-justify-content:flex-end;justify-content:flex-end}.card-footer{padding:.28rem .7rem}.alert{font-size:.756rem}@media screen and (min-width: 992px){.modal-xxl{max-width:1640px}}@media screen and (min-width: 1200px){.modal-xxxl{max-width:1860px}}.modal-fs{max-width:none;position:absolute;margin:auto;inset:16px;height:100vh;display:flex}.btn-link{text-decoration:none}.btn-link:hover{text-decoration:underline}.invalid-feedback{margin-top:0!important;font-size:.672rem!important}.settings-container{margin:6px 0}.settings-container .state-button{display:-webkit-box;display:-moz-box;display:-webkit-flexbox;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-moz-box-orient:vertical;-webkit-flex-direction:column;-moz-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;-moz-align-items:center;align-items:center;-webkit-box-pack:center;-moz-box-pack:center;-webkit-flex-pack:center;-ms-flex-pack:center;-moz-justify-content:center;-webkit-justify-content:center;justify-content:center;-webkit-border-radius:.56rem;-moz-border-radius:.56rem;border-radius:.56rem;border:2px solid #FFF;padding:12px 6px;height:140px}.settings-container .state-button[selected=true]{cursor:default;pointer-events:none;-webkit-filter:grayscale(0%);-moz-filter:grayscale(0%);-ms-filter:grayscale(0%);-o-filter:grayscale(0%);filter:grayscale(0%)}.settings-container .state-button[selected=false]{opacity:.4;-webkit-filter:grayscale(90%);-moz-filter:grayscale(90%);-ms-filter:grayscale(90%);-o-filter:grayscale(90%);filter:grayscale(90%);cursor:pointer}.settings-container .state-button[selected=false]:hover{-webkit-filter:grayscale(0%);-moz-filter:grayscale(0%);-ms-filter:grayscale(0%);-o-filter:grayscale(0%);filter:grayscale(0%);opacity:.8}.settings-container .state-button .icon-container{width:60px;height:60px;display:-webkit-box;display:-moz-box;display:-webkit-flexbox;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-orient:vertical;-moz-box-orient:vertical;-webkit-flex-direction:column;-moz-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;-moz-align-items:center;align-items:center;-webkit-box-pack:center;-moz-box-pack:center;-webkit-flex-pack:center;-ms-flex-pack:center;-moz-justify-content:center;-webkit-justify-content:center;justify-content:center;color:#fff;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;padding:0;margin-bottom:6px}.settings-container .state-button .title{text-align:center;font-size:.672rem}.settings-container .state-button .sub-title{text-align:center;margin-top:auto;font-size:.588rem;-ms-flex-item-align:stretch;-webkit-align-self:stretch;-moz-align-self:stretch;align-self:stretch}.settings-container .state-button[state="1"]{border-color:#2680a1;background-color:#f4f9fa}.settings-container .state-button[state="1"] .icon-container{background-color:#2680a1}.settings-container .state-button[state="1"] .title{color:#2680a1}.settings-container .state-button[state="1"] .sub-title{color:#93c0d0}.settings-container .state-button[state="2"]{border-color:#62a325;background-color:#f7faf4}.settings-container .state-button[state="2"] .icon-container{background-color:#62a325}.settings-container .state-button[state="2"] .title{color:#62a325}.settings-container .state-button[state="2"] .sub-title{color:#b1d192}.settings-container .state-button[state="3"]{border-color:#c82602;background-color:#fcf4f2}.settings-container .state-button[state="3"] .icon-container{color:#c82602;background-color:#fff}.settings-container .state-button[state="3"] .title{color:#c82602}.settings-container .state-button[state="3"] .sub-title{color:#e49381}
`;var N=function(a,e,t,o){var n=arguments.length,s=n<3?e:o===null?o=Object.getOwnPropertyDescriptor(e,t):o,c;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")s=Reflect.decorate(a,e,t,o);else for(var l=a.length-1;l>=0;l--)(c=a[l])&&(s=(n<3?c(s):n>3?c(e,t,s):c(e,t))||s);return n>3&&s&&Object.defineProperty(e,t,s),s},T=class extends C{router;accessControlPointService;interactionService;sessionService;remoteAccessPointId;remoteAccessPointName;accessControlPointRemoteStates=[];showAll=!1;showEntrance=!1;showExit=!1;visible=!1;constructor(e,t,o,n){super(),this.router=e,this.accessControlPointService=t,this.interactionService=o,this.sessionService=n}onModalInitialized(){super.onModalInitialized(),this.checkState(this.showAll,r.All),this.checkState(this.showEntrance,r.Entrance),this.checkState(this.showExit,r.Exit),this.visible=!0}checkState(e,t){if(e&&e==!0)this.accessControlPointRemoteStates.findIndex(o=>o.direction==t)==-1&&this.accessControlPointRemoteStates.push(k.getEmptyModel(t));else if(e==!1){let o=this.accessControlPointRemoteStates.findIndex(n=>n.direction==t);o>-1&&this.accessControlPointRemoteStates.splice(o,1)}}onSaveClicked(e){let t=new v;t.accessControlPointId=this.remoteAccessPointId,t.stateList=this.accessControlPointRemoteStates,this.accessControlPointService.changeAccessControlPointState(t).subscribe(o=>{this.interactionService.showMessage("REMOTECONTROL.SETTINGS_SAVE_SUCCEED",null,g.Success),this.closeModal(t.stateList)},o=>{})}static ctorParameters=()=>[{type:u},{type:y},{type:S},{type:h}];static propDecorators={remoteAccessPointId:[{type:i}],remoteAccessPointName:[{type:i}],accessControlPointRemoteStates:[{type:i}],showAll:[{type:i}],showEntrance:[{type:i}],showExit:[{type:i}]}};T=N([d({selector:"armon-access-control-point-control-settings",template:w,standalone:!0,imports:[m,p,f,b,x],styles:[E]})],T);export{T as a};
