How to set Strat time ,End time and the Time duration in one dialog Box using Ionic (Angular)

Question

Here, I develop a mobile application for physical activity using ionic software. Here I added some physical activity lists. So when I click one of the physical images should display a dialog box. So the dialog box should contain Start time, End time, and time Duration. I have tried, it didn't work for me. Could anyone help me to solve this?

Code:- ts.file

import { Component, OnInit } from '@angular/core';
import { AlertController } from '@ionic/angular';
import { NavController } from '@ionic/angular';
import { Router } from '@angular/router';

@Component({
 selector: 'app-phyisicalactivity',
 templateUrl: './phyisicalactivity.page.html',
 styleUrls: ['./phyisicalactivity.page.scss'],
  })
 export class PhyisicalactivityPage implements OnInit {
 dateTime;
 io: any
 constructor(public alertController: AlertController, public navCtrl: NavController) {}
  async walk() {
  const alert = await this.alertController.create({
  cssClass: 'my-custom-class',
  header: 'Activity Details',
  inputs: [
    {
      name: 'Start time',
      type: 'checkbox',
      label: 'Start time',
      value: 'value1',
      handler: () => {
        console.log('Checkbox 1 selected');
      },
      checked: true
    },

    {
      name: 'Stop time',
      type: 'checkbox',
      label: 'Stop time',
      value: 'value2',
      handler: () => {
        console.log('Checkbox 2 selected');
      }
    },
    {
      name: 'title',
      placeholder: 'Title',
    },
  ],
  buttons: [
    {
      text: 'Cancel',
      role: 'cancel',
      cssClass: 'secondary',
      handler: () => {
        console.log('Confirm Cancel');
      }
    }, {
      text: 'Ok',
      handler: () => {
        console.log('Confirm Ok');
      }
    }
  ]
});

await alert.present();
 }

 showPrompt() {
   this.alertController.create({
   cssClass: 'my-custom-class',
   header: 'Activity Details',
   inputs: [
    {
      name: 'title',
      placeholder: 'Title',
    },{
      name: 'password',
      placeholder: 'Password'
    },
  ],
  buttons: [
    {
      text: 'Cancel',
      handler: data => {
        console.log('Cancel clicked');
      }
    },
    {
      text: 'Save',
      handler: data => {
        console.log('Saved clicked');
        document.getElementById("isi").innerHTML = data.password;
      }
    }
  ]
}).then(res => {
  res.present();
});


 }

  ngOnInit() {
  setTimeout(() => {
  this.dateTime = new Date().toISOString();
   });
  }
 }

HTML:-

 <ion-grid>

  <ion-row>
  <ion-col size="4">
    <ion-button fill="clear" expand="full" color="light" (click)="walk()">
      <ion-img src="./assets/badminton.png"></ion-img>
    </ion-button>
    </ion-col><ion-grid>

The code I have tried after a suggestion by Nasam.

import { Component, OnInit } from '@angular/core';
import { AlertController } from '@ionic/angular';
import { NavController } from '@ionic/angular';
import { Router } from '@angular/router';

 @Component({
   selector: 'app-phyisicalactivity',
   templateUrl: './phyisicalactivity.page.html',
   styleUrls: ['./phyisicalactivity.page.scss'],
    })
   export class PhyisicalactivityPage implements OnInit {
    dateTime;
    startTime;
    stopTime;
    finalTimeDifference;
    io: any
  constructor(public alertController: AlertController, public navCtrl: 
NavController) {}
async walk() {
const alert = await this.alertController.create({
cssClass: 'my-custom-class',
header: 'Activity Details',
inputs: [
 {
   name: 'Start time',
   type: 'checkbox',
   label: 'Start time',
   value: 'value1',
   handler: () => {
     console.log('Checkbox 1 selected');
     this.startTime = new Date().getTime();
   },
   checked: true
 },

 {
   name: 'Stop time',
   type: 'checkbox',
   label: 'Stop time',
   value: 'value2',
   handler: () => {
     console.log('Checkbox 2 selected');
     this.stopTime = new Date().getTime();
   }
 },
 {
   name: 'title',
   placeholder: 'Title',
 },
  ],
  buttons: [
    {
   text: 'Cancel',
   role: 'cancel',
   cssClass: 'secondary',
   handler: () => {
     console.log('Confirm Cancel');
   }
 }, {
   text: 'Ok',
   handler: () => {
     console.log('Confirm Ok');
     this.finalTimeDifference = this.stopTime - this.startTime; // calculate time difference on Okay click.
     console.log(this.finalTimeDifference);
   }
 }
    ]
    });

  await alert.present();
   }
    ngOnInit() {
    setTimeout(() => {
    this.dateTime = new Date().toISOString();
   });
   }
    }