Ionic 3 рассчитать предметы после выполнения перетаскивания - PullRequest
Новая
       33

Ionic 3 рассчитать предметы после выполнения перетаскивания

0 голосов
/ 16 мая 2019

Я очень новичок в программном проекте и в настоящее время работаю над проектом последнего года - мобильными приложениями, использующими ionic 3 framework. У меня есть функция перетаскивания, первое ведро со списком элементов, а второе пустое. Когда я хочу перетащить элементы из 1-го блока во 2-й блок, я хочу рассчитать цену для каждой записи во втором блоке, но у меня действительно нет идеи сделать это. Может кто-нибудь помочь мне с кодами: (

это мой расчет.тс 

  q1 = [];
  q2 = [];
  details: any = [];
  totalPrice: number;

  constructor(public navCtrl: NavController, private postPvdr: PostProvider, public navParams: NavParams, public dragulaService: DragulaService, public AlertController:AlertController) {

    dragulaService.drop().subscribe((value) => {

      console.log(value)
  });

    const bag: any = this.dragulaService.find('bag');
    if (bag !== undefined ) this.dragulaService.destroy('bag');

    this.dragulaService.createGroup('bag', {
      revertOnSpill: true,
    });


  }

  ionViewDidLoad() {
    this.details = [];
    this.getlist();
    this.getTotalPrice()
  }

  getlist(){
    let body = {
      aksi: 'get_user'
    };
    this.postPvdr.postData(body, 'aksi_user.php').subscribe(data => {
      for(let detail of data.result){
        this.details.push(detail);
        console.log(data);
      }

    });
  }

  getTotalPrice(){
    let totalPrice = 0;
    let body = {
      aksi: 'get_user'
    };
    this.postPvdr.postData(body, 'aksi_user.php').subscribe(data => {
    for(let detail of data.result){
      totalPrice += Number.parseFloat(detail.dest_budget);

    }
  });
  console.log(totalPrice);
    return totalPrice;
  }

эти строки кода кажутся странными, потому что я просто попробую n error

это мой пересчет.html 

<ion-content padding>
  <ion-row>
    <ion-col width-50 class="left">
      <div class="header">First Bucket</div>
      <ion-list [dragula]='"bag"' [(dragulaModel)]="details">
        <button ion-item *ngFor="let detail of details">
          {{detail.dest_name}}
          <p>{{ detail.dest_budget}}</p>
        </button>
      </ion-list>
    </ion-col>

    <ion-col width-50 class="right">
      <div class="header">Second Bucket</div>
      <ion-list [dragula]='"bag"' [(dragulaModel)]="q2">
        <div ion-item *ngFor="let detail of q2">
          {{detail.dest_name}}
          <p>{{ detail.dest_budget }}</p>
        </div>
      </ion-list>
    </ion-col>
  </ion-row>
</ion-content>

<ion-footer>
    <ion-toolbar>
      <ion-title>Total Price:</ion-title>
    </ion-toolbar>
  </ion-footer>

общая цена должна отображаться в нижнем колонтитуле

вот мой интерфейс выглядит как

надеюсь, кто-то может помочь:)

1 Ответ

0 голосов
/ 16 мая 2019

функция вызова здесь 

dragulaService.drop().subscribe((value) => {
    this.getTotalPrice();
});

изменить функцию 

getTotalPrice(){
    this.totalPrice = 0;
    let body = {
        aksi: 'get_user'
    };
    this.postPvdr.postData(body, 'aksi_user.php').subscribe(data => {
        for(let detail of data.result){
            this.totalPrice += Number.parseFloat(detail.dest_budget);
        }
    });
}

и модель связывания 

<ion-footer>
    <ion-toolbar>
        <ion-title>Total Price:{{totalPrice}}</ion-title>
    </ion-toolbar>
</ion-footer>
...