HEX
Server: Apache/2.4.41 (Ubuntu)
System: Linux ip-172-31-42-149 5.15.0-1084-aws #91~20.04.1-Ubuntu SMP Fri May 2 07:00:04 UTC 2025 aarch64
User: ubuntu (1000)
PHP: 7.4.33
Disabled: pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare,
Upload Files
File: /var/www/vhost/disk-apps/pwa.sports-crowd.com/src/app/pages/detail-product/detail-product.html
<ion-header class="ion-no-border">
  <ion-toolbar color="primary">
    <ion-buttons slot="end">
      <ion-button (click)="cancel()" strong color="light">{{ 'all.close' | translate}}</ion-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

<ion-content no-bounce>
  <ion-list>
    <ion-slides pager *ngIf="product.product_images.length > 1">
      <ion-slide *ngFor="let item of product.product_images">
        <img *ngIf="itsImage(item.name)" [src]="cityProvider._urlGallery+'products/'+item.name" #myImage
          (click)="previewImage(myImage)" class="imageDetailProduct" valid-url-image />
        <img *ngIf="!itsImage(item.name)" src="assets/img/video_icon_default.png"
          (click)="playVideo(cityProvider._urlGallery+'products/'+item.name)" class="videoDetailProduct" />
      </ion-slide>
    </ion-slides>

    <ion-item lines="none" *ngIf="product.product_images.length == 1">
      <img *ngIf="itsImage(product.product_images[0].name)"
        [src]="cityProvider._urlGallery+'products/'+product.product_images[0].name" #myImage
        (click)="previewImage(myImage)" class="imageDetailProduct" valid-url-image />
      <img *ngIf="!itsImage(product.product_images[0].name)" src="assets/img/video_icon_default.png"
        (click)="playVideo(cityProvider._urlGallery+'products/'+product.product_images[0].name)"
        class="videoDetailProduct" />
    </ion-item>

    <ion-item lines="none" *ngIf="product.product_images.length == 0">
      <img src="assets/img/default.png" class="imageDetailProduct" />
    </ion-item>

    <ion-item lines="none" class="ion-text-center ion-text-wrap">
      <ion-label class="textItemProduct textNameProduct"> {{ product.name }} </ion-label>
    </ion-item>

    <!-- precio del producto cuando no tiene descuento porcentaje ni relampago -->
    <ion-item lines="none" class="ion-text-center item-primary"
      *ngIf="!product.priceAfterSpecialPriceTag && !product.priceAfterFlash && !product.priceAfterDiscount">
      <ion-label class="textItemProduct textPriceProduct">
        {{ product.price | formatCurrency : currency }}
      </ion-label>
    </ion-item>

    <ion-item lines="none" *ngIf="product.priceAfterSpecialPriceTag" class="align-item-flex item-primary-special">
      <ion-label class="priceDiscount marginRight7 ion-text-end">
        <ion-text>
          <ion-text class="priceTag" color="secondary">
            <ion-icon name="pricetag-outline"></ion-icon>
            <h5>{{ product.special_tag }}</h5>
          </ion-text>
          <p class="priceDiscount marginRight7">
            {{ product.priceAfterSpecialPriceTag | formatCurrency : currency }}
          </p>
        </ion-text>
      </ion-label>
      <ion-label class="priceDecorationThrough marginTop16 ion-text-start">
        {{ product.price | formatCurrency : currency }}
      </ion-label>
    </ion-item>

    <ion-item lines="none" *ngIf="product.priceAfterFlash" class="align-item-flex item-primary">
      <ion-label class="priceDiscount marginRight7 ion-text-end">
        <ion-icon class="ion-text-start" name="flash-outline"></ion-icon>
        {{ product.priceAfterFlash | formatCurrency : currency }}
      </ion-label>
      <ion-label class="priceDecorationThrough ion-text-start">
        {{ product.price | formatCurrency : currency }}
      </ion-label>
    </ion-item>

    <ion-item lines="none" *ngIf="product.priceAfterDiscount" class="align-item-flex item-primary">
      <ion-label class="priceDiscount marginRight7 ion-text-end">
        {{ product.priceAfterDiscount | formatCurrency : currency }}
      </ion-label>
      <ion-label class="priceDecorationThrough marginTop13 ion-text-start">
        {{ product.price | formatCurrency : currency }}
      </ion-label>
    </ion-item>

    <ion-item lines="none" class="ion-text-center item-secondary"
      *ngIf="product.productAttributes && product.productAttributes.length == 1 && product.productAttributes[0].pum">
      <ion-label class="ion-no-margin textItemProduct">
        <app-pum-info [product]="product" [type]="'label'"></app-pum-info>
      </ion-label>
    </ion-item>

    <ion-item lines="none" class="ion-text-center item-secondary" hidden>
      <app-coin-info [price]="product.price" class="centerCoin"></app-coin-info>
    </ion-item>

    <ion-item lines="none" class="ion-text-center item-secondary" *ngIf="product.plu">
      <ion-label class="ion-no-margin textItemProduct">{{ 'PLU' | translate }}: {{ product.plu}} </ion-label>
    </ion-item>

    <ion-item lines="none" class="ion-text-center item-secondary" *ngIf="product.bar_code">
      <ion-label class="ion-no-margin textItemProduct">{{ 'BARCODE' | translate }}: {{ product.bar_code}}</ion-label>
    </ion-item>

    <ion-item lines="none" class="ion-text-center item-secondary" *ngIf="product.brand">
      <ion-label class="ion-no-margin textItemProduct">{{ 'BRAND' | translate }}: {{ product.brand.name}}</ion-label>
    </ion-item>

    <ion-item lines="none" class="ion-text-center item-secondary">
      <ion-label class="ion-no-margin textItemProduct">{{ 'AVAILABLE_UNITS' | translate }}: {{ stock }} </ion-label>
    </ion-item>

    <ion-item lines="none" class="ion-text-center item-secondary" *ngIf="product.max_units_per_order">
      <ion-label class="ion-no-margin textItemProduct">{{ 'MAX_UNITS_PER_ATTRIBUTTE' | translate }}:
        {{ product?.max_units_per_order}}
      </ion-label>
    </ion-item>

    <ion-item lines="none" class="ion-text-center item-secondary" *ngIf="product.max_units_per_product">
      <ion-label class="ion-no-margin textItemProduct">{{ 'MAX_UNITS_PER_PRODUCT' | translate }}:
        {{ product?.max_units_per_product}}
      </ion-label>
    </ion-item>

    <div *ngIf="origin == 'orderDetail'">
      <div *ngIf="product.order_product_attributes">
        <ion-list *ngFor="let items of product.order_product_attributes | groupBy:'attribute_id'">
          <ion-list-header>
            <ion-label> {{ items.value[0].attribute.display_name }} </ion-label>
          </ion-list-header>

          <ion-item *ngFor="let attribute of items.value" lines="none">
            <ion-label class="displayContents">{{ attribute.value }}
              <div class="pickerColor" *ngIf="attribute.attribute.attribute_type_id == 4"
                [style.background]="attribute.value"></div>
              ({{ attribute.quantity ? attribute.quantity : 1 }}) - {{ attribute.price_additional | formatCurrency : currency }}
            </ion-label>
          </ion-item>
        </ion-list>
      </div>
      <div *ngIf="product.comments">
        <ion-item lines="none">
          <ion-label text-wrap class="textItemProduct">Comentarios: {{ product.comments }}</ion-label>
        </ion-item>
      </div>
    </div>

    <div *ngIf="origin != 'orderDetail' && product.productAttributes.length > 1">
      <div *ngFor="let attribute of this.attributes; let i=index">
        <ion-label class="ion-text-center textItemProduct" *ngIf="attribute[1][0].attribute.attribute_type_id == 1">{{
          attribute[1][0].value }}</ion-label>

        <ion-list *ngIf="attribute[1][0].attribute.attribute_type_id == 2">
          <ion-radio-group [value]="valueControl[i]" (ionChange)="updateControlRadio($event,i)">
            <ion-list-header>
              <ion-item lines="none" style="width:100%">
                <ion-label slot="start"> {{ attribute[1][0].attribute.display_name }} </ion-label>
                <ion-chip color="danger" slot="end" *ngIf="attribute[1][0].attribute.required">
                  <ion-label color="danger" class="ion-text-capitalize">{{ 'REQUIRED' | translate }}</ion-label>
                </ion-chip>
              </ion-item>
            </ion-list-header>

            <ion-item *ngFor="let item of attribute[1]; let j=index">
              <ion-radio slot="start" [value]="item.id" mode="md" [disabled]="item.available_units == 0"></ion-radio>
              <ion-label class="ion-text-wrap itemAttribute">{{ item.value }}
                <app-pum-info *ngIf="item.pum" style="margin-left: 10px;" [attribute]="item"></app-pum-info>
                <p *ngIf="!item.pum" style="margin-left: 10px; color: grey; font-size: min(3vw, 10px);">
                  {{ item.available_units }} {{ 'AVAILABLE_UNITS' | translate }}
                </p>
              </ion-label>
              <ion-label class="ion-text-end" *ngIf="item.price_additional > 0">
                {{ item.price_additional | formatCurrency : currency }}
              </ion-label>
            </ion-item>
          </ion-radio-group>
        </ion-list>

        <ion-list *ngIf="attribute[1][0].attribute.attribute_type_id == 3">
          <ion-list-header>
            <ion-label>
              <ion-item lines="none">
                <ion-label slot="start"> {{ attribute[1][0].attribute.display_name }} </ion-label>
                <ion-chip color="danger" slot="end" *ngIf="attribute[1][0].attribute.required">
                  <ion-label color="danger" class="ion-text-capitalize">{{ 'REQUIRED' | translate }}</ion-label>
                </ion-chip>
              </ion-item>
            </ion-label>
          </ion-list-header>
          <ion-item *ngFor="let item of attribute[1]; let j=index">
            <ion-checkbox slot="start" [(ngModel)]="valueControlCheckbox[i][j].status"
              (ionChange)="updateCheckedOptions(i)" [disabled]="item.available_units == 0"></ion-checkbox>
            <ion-label class="ion-text-wrap zindex">{{ item.value }} ({{ item.available_units }} {{ 'AVAILABLE_UNITS' |
              translate }})</ion-label>
            <ion-label class="ion-text-end zindex" *ngIf="item.price_additional > 0">{{ item.price_additional | formatCurrency : currency }}</ion-label>
            <ion-item lines="none" class="ion-text-end moreOne zindex"
              *ngIf="attribute[1][0].attribute.is_more_one && valueControlCheckbox[i][j].status">
              <ion-button slot="start" color="secondary" size="small" fill="outline" class="f-s-8"
                (click)="removeMoreOne(i,j)">
                <ion-icon slot="icon-only" name="remove-outline"></ion-icon>
              </ion-button>
              <ion-label>{{ valueControlCheckbox[i][j].quantity }}</ion-label>
              <ion-button slot="end" color="secondary" size="small" fill="outline" class="f-s-8"
                (click)="addMoreOne(i,j)">
                <ion-icon slot="icon-only" name="add-outline"></ion-icon>
              </ion-button>
            </ion-item>
          </ion-item>
        </ion-list>
        <!-- [(colorPicker)]="color"
        [cpOutputFormat]="'hex'" -->
        <div class="divContainer" margin *ngIf="attribute[1][0].attribute.attribute_type_id == 4">
          <ion-fab vertical="bottom" horizontal="start" slot="fixed" class="fabColor">
            <ion-fab-button>
              <ion-fab-button [style.background]="color" (colorPickerClose)="closePicker()"></ion-fab-button>
            </ion-fab-button>
          </ion-fab>

          <ion-label class="labelColor">Código color: {{ color }}</ion-label>
        </div>

        <div [style.background]="color" *ngIf="attribute[1][0].attribute.attribute_type_id == 4" class="divSuite">
          <img src="assets/img/suite.png" alt="suite" />
        </div>
      </div>
    </div>

    <ion-row *ngIf="origin != 'orderDetail'" class="ion-margin-top">
      <ion-col>
        <ion-label>{{ 'COMMENTS_ADITIONAL' | translate }}</ion-label>
        <ion-input [(ngModel)]="comments" debounce="1000" (ionChange)="inputCommentsChange()" type="text"
          placeholder="{{ 'COMMENTS_ADITIONAL_2' | translate }}" class="inputComments ion-margin-top"></ion-input>
      </ion-col>
    </ion-row>
  </ion-list>
</ion-content>

<ion-footer class="ion-no-border" *ngIf="origin != 'orderDetail'">
  <ion-toolbar color="light">
    <ion-grid>
      <ion-row class="align-items-center">
        <ion-col size="5">
          <ion-item lines="none" class="containerQuantity">
            <ion-button slot="start" color="secondary" size="small" fill="clear" class="ion-no-margin"
              (click)="removeProductCart()"
              [disabled]="!quantity || quantity == 0 || (quantity == 1 && product.quantity == 0)">
              <ion-icon name="remove-outline" class="ion-no-margin"></ion-icon>
            </ion-button>
            <ion-label class="ion-text-center">{{ quantity }}</ion-label>
            <ion-button slot="end" color="secondary" size="small" fill="clear" class="ion-no-margin"
              (click)="addProductCart()" [disabled]="quantity >= maxStock">
              <ion-icon name="add-outline" class="ion-no-margin"></ion-icon>
            </ion-button>
          </ion-item>
        </ion-col>

        <ion-col size="7">
          <ion-button color="{{ propertyButtonAdd.color}}" expand="block" (click)="productChange(propertyButtonAdd.id)">
            <ion-label slot="start" class="b-l ion-text-start ion-float-left"> {{ propertyButtonAdd.name }} </ion-label>
            <ion-label slot="end" class="b-r ion-text-end ion-float-right">{{ priceTotal | formatCurrency : currency }}</ion-label>
          </ion-button>
        </ion-col>
      </ion-row>
    </ion-grid>
  </ion-toolbar>
</ion-footer>