C# developer on ionic - typescript - cant understand this?


#1

cannot understand this code that i have been given to modify.Could you guys help me out

how should i code this in typescript and ionic if i am new to .ts entirely and ionic entirely

import { Component, ViewChild, OnInit, AfterViewInit } from ‘@angular/core’;
import { IonicPage, Nav, NavController, NavParams, AlertController } from ‘ionic-angular’;
import { MenuController } from ‘ionic-angular’;
import { Items } from ‘…/…/providers/providers’;
import { AlertService, LocalStorageItemChangeService } from ‘…/…/service/’;
import { Storage } from ‘@ionic/storage’;
import { isArray } from ‘ionic-angular/util/util’;

@IonicPage()
@Component({
selector: ‘item-list’,
templateUrl: ‘item-list.html’
})
export class ItemListPage implements OnInit, AfterViewInit {

urlData: any = {};
searchData: any = {};
products: any;
custNo: any;
public searchStr = ‘’;
public order: Array = ;
public shouldShowCancel = true;
isSearchedFlag: boolean = false;

@ViewChild(Nav) nav: Nav;
constructor(public menuCtrl: MenuController,
private productService: Items,
private util: AlertService,
private alertCtrl: AlertController,
private navCtrl: NavController,
private storage: Storage,
private navParams: NavParams,
private orderChangeService: LocalStorageItemChangeService) {
// console.log(‘param====’ + this.navParams);
// console.log(‘param====’ + this.navParams.get(‘custNo’));
this.order = ;
this.custNo = this.navParams.get(‘custNo’);

}

ngOnInit() {
// console.log(‘in product list ngOnInit===’);
if (this.storage.get(‘order’)) {
let orderedData = this.storage.get(‘order’);
orderedData.then((data) => {
// console.log(‘datatype 1’ + isArray(this.order));

    if (data) {
      //    console.log('in local data==' + JSON.stringify(data));
      this.order = JSON.parse(data);
      if (isArray(this.order)) {

      } else {
        this.order = [];
      }
    } else {
      this.order = [];
    }
    //  console.log('datatype 2' + isArray(this.order));
  }, (err) => { });
}

this.orderChangeService.currentData.subscribe((data: any) => {
  // console.log('order data===' + JSON.stringify(data));
  // console.log('datatype 3' + isArray(this.order));
  if (data) {
    this.order = data;
  } else {
    this.order = [];
  }
  // console.log('datatype 4' + isArray(this.order));
});
this.urlData.skip = 0;
this.urlData.take = 10;
this.searchData.skip = 0;
this.searchData.take = 10;

if (this.navParams.get('custNo')) {
  // console.log("Url===" + this.navParams.get('custNo'))
  this.urlData.custNo = this.navParams.get('custNo');
  this.getproducts();
} else {
  this.storage.get('TEST').then((val) => {
    // console.log('user==11===', val.No);
    this.custNo = val.No;
    this.urlData.custNo = this.custNo;
    this.getproducts();
  });
}

}

ngAfterViewInit() {
// console.log(‘in product list page===’);

}

getproducts(event?: any) {
let spinner: any;
if (!event) {
spinner = this.util.loading();
}

this.productService.getProductList(this.urlData).subscribe((res: any) => {
  if (!event) {
    spinner.dismiss();
  }
  if (res.Status == 'Success') {
    this.searchData.skip = 0;
    this.searchData.take = 10;
    if (typeof res.PayLoad[0] === 'string') {
      this.util.present('No product found..');
      if (this.products.length === 1) {
        this.urlData.skip = 0;
        this.urlData.take = 10;
        this.searchData.skip = 0;
        this.searchData.take = 10;
        this.getproducts();
      }
    } else {
      if (event) {
        res.PayLoad.forEach(element => {
          this.products.push(element)
        });
        event.complete();
      } else {
        this.products = res.PayLoad;
      }
    }
  } else if (res.Status == "Failure") {
    this.util.present(res.ErrorMessage);
  }
}, err => {
  if (!event) {
    spinner.dismiss();
  }
  this.util.present('Error loading products...');
});

}

loadItems(event) {
this.urlData.skip += 10;
this.urlData.take += 10;
this.searchData.skip += 10;
this.searchData.take += 10;
if (this.searchStr) {
this.searchProduct(event);
} else {
this.getproducts(event);
}

}

addQuantity(item, value, index) {
const thisPtr = this;
if (item && item.Quantity && item.Quantity > 0) {
let alert = this.alertCtrl.create({
title: ‘Quantity’,
inputs: [
{
name: ‘Quantity’,
placeholder: ‘Enter quantity’,
type: ‘number’,
value: value
}
],
buttons: [
{
text: ‘Cancel’,
role: ‘cancel’,
handler: data => { }
},
{
text: ‘Done’,
handler: data => {
if (data.Quantity && data.Quantity !== ‘0’ && data.Quantity.indexOf(‘e’) === -1) {

            // item.orderedQuantity = data.Quantity;
            if (data.Quantity < 0) {
              this.util.present("Please enter proper quantity");
              item.orderedQuantity = 0;
            } else {
              item.orderedQuantity = data.Quantity;
              // console.log("snaldkajsd" + JSON.stringify(item));
              // console.log(' thisPtr.order' + isArray(thisPtr.order));
              // this.order.push(item);
              if (thisPtr.order && thisPtr.order.length > 0) {
                //  console.log('in order-3-----');
                thisPtr.order.forEach((orderElement, ind) => {
                  if (orderElement.ItemNo == item.ItemNo) {
                    //   console.log('in if------');
                    thisPtr.order.splice(ind, 1);
                  }
                });
              }
              if (thisPtr.order) {
                thisPtr.order.push(item);
              }
            }
          } else {
            delete item.orderedQuantity;
          }
        }
      }
    ]
  });
  alert.present();
} else {
  this.util.present("Sorry, Stock is over.");
}

}

public gotoReviewOreder() {
if (this.order) {
this.storage.set(‘order’, JSON.stringify(this.order));
this.navCtrl.push(‘OrderPage’);
}
}

public searchProduct(event) {
// Keyboard.close();
// console.log(‘search==’ + this.searchStr);
if (!this.searchStr || this.searchStr.length < 2) {
/// DO Nothing
} else {
let itemNo = {
“search”: this.searchStr,
“skip”: this.searchData.skip,
“take”: this.searchData.take
}
let spinner = this.util.loading();
this.productService.searchProduct(itemNo, this.custNo).subscribe((res: any) => {
spinner.dismiss();
if (res.Status == ‘Success’) {
if (typeof res.PayLoad[0] === ‘string’) {
this.util.present(‘No product found…’);
if (this.products.length === 1) {
this.urlData.skip = 0;
this.urlData.take = 10;
this.searchData.skip = 0;
this.searchData.take = 10;
this.getproducts();
}

      } else {
        this.isSearchedFlag = true;
        if (event) {
          res.PayLoad.forEach(element => {
            this.products.push(element)
          });
          event.complete();
        } else {
          this.products = res.PayLoad;
        }
      }
    } else if (res.Status == "Failure") {
      this.util.present(res.ErrorMessage);
    }
  }, err => {
    spinner.dismiss();
    this.util.present('Error loading products...');
  });
}

}
itemDetails(product) {
// this.navCtrl.push(ItemDetailsPage)
let alert = this.alertCtrl.create({
title: product.ItemNo,
subTitle: product.Description,
buttons: [‘OK’]
});
alert.present();
/* let modal = this.modalCtrl.create(ModalPage);
modal.present(); */

}
clearSearch() {
this.products.splice(0, this.products.length);
this.isSearchedFlag = false;
this.searchStr = “”;
this.urlData.skip = 0;
this.urlData.take = 10;
this.searchData.skip = 0;
this.searchData.take = 10;
this.getproducts();
}

}