<?= $this->extend('layouts/main.php') ?>

<?= $this->section('content') ?>

<div class="page-wrapper">
	<div class="container-fluid">
        <div class="row page-titles">
			<div class="col-md-5 align-self-center">
				<h4 class="text-themecolor">Activities Export</h4>
			</div>
		</div>
        <div class="row">
			<div class="col-12">
				<div class="alert alert-warning" role="alert">
					Tutorial untuk melakukan Export <u>PDF</u> Bisa dilihat <a class='fw-bold text-decoration-underline' onclick="window.open(this.href, 'Purpose Detail','width=900,height=800,toolbar=1,resizable=0'); return false;" href="https://services-summit.my.id/guidebook/view/2">Disini</a> 
				</div>
			</div>
			<div class="col-12">
				<div class="card">
					<div class="card-body">
						<form method='post' target="_blank">
							<div class="row mb-2">
								<div class="col md-6">
									<div class="input-group input-group-sm">
										<span class="input-group-text d-flex align-items-center justify-content-center" style="width: 80px;">From</span>
											<input class="form-control form-control-sm" type="date" name="opendate" value="<?= $opendate;?>"/>
									</div>
								</div>
								<div class="col md-6">
									<div class="input-group input-group-sm">
										<span class="input-group-text d-flex align-items-center justify-content-center" style="width: 80px;">To</span>
											<input class="form-control form-control-sm" type="date" name="closedate" value="<?= $closedate;?>"/>
									</div>
								</div>
							</div>

							<div class="row mb-2">
								<div class="col-6">
									<div class="input-group input-group-sm">
										<span class="input-group-text d-flex align-items-center justify-content-center" style="width:80px;">Site</span>
										<div class="col">
											<select name="siteid" class="form-select form-select-sm select2" id="site" >
												<option value="" selected>--</option>
                                                <?php foreach($sites as $data) :?>
                                                    <option value="<?=$data['siteid'];?>"><?=$data['sitename'];?></option>
                                                <?php endforeach ;?>
											</select>
										</div>
									</div>
								</div>
								
								<div class="col md-6">
									<div class="input-group input-group-sm">
										<span class="input-group-text d-flex align-items-center justify-content-center" style="width:80px;">Product</span>
										<div class="col">
											<!-- Untuk Dorpdown Production -->
											<span id='product_dropdown'>
											</span>
										</div>
									</div>
								</div>
							</div>
							<!-- Blueprint Dorpdown Production -->
							<span id='product_temporary'>
							</span>
							<div class="row mb-2">
								<div class="col md-6">
									<div class="input-group input-group-sm">
										<span class="input-group-text d-flex align-items-center justify-content-center" style="width: 80px;">Type</span>
										<div class="col">
											<select name="acttypeid" class="form-select form-select-sm select2" id="type">
												<option value="" selected>--</option>
                                                <?php foreach($acttype as $data) :?>
                                                    <option value="<?=$data['acttypeid'];?>"><?=$data['acttypecode'];?></option>
                                                <?php endforeach ;?>
											</select>
										</div>
									</div>
								</div>
								<div class="col md-6">
									<div class="input-group input-group-sm">
										<span class="input-group-text d-flex align-items-center justify-content-center" style="width: 80px;">Owner</span>
										<div class="col">
											<select name="userid_owner" class="form-select form-select-sm select2" id="owner">
												<option value="" selected>--</option>
                                                <?php foreach($users as $data) :?>
                                                    <option value="<?=$data['userid'];?>"><?=$data['firstname'].' '.$data['lastname'];?></option>
                                                <?php endforeach ;?>
											</select>
										</div>
									</div>
								</div>
							</div>
							<div class="row mb-2">
								<div class="col xs-12">
									<div class="input-group input-group-sm">
										<span class="input-group-text d-flex align-items-center justify-content-center" style="width: 80px;">Export</span>
										<div class="col">
											<select name="export" class="form-select form-select-sm select2" id="export" required>
												<option value="" selected>--</option>
                                                <?php foreach($exports as $qid => $qvalue) :?>
                                                    <option value="<?=$qid?>"><?=$qvalue?></option>
                                                <?php endforeach ;?>
											</select>
										</div>
									</div>
								</div>
							</div>
							<button type="submit" class="btn btn-success btn-sm text-white float-end"> <i class="fa fa-check"></i> Submit</button>
						</form>
					</div>
				</div>
			</div>
		</div>
    </div>
</div>

<?= $this->endSection() ?>

<?= $this->section('script') ?>

<!-- SCRIPT AJAX UNTUK MENAMPILKAN PRODUCT BERDASARKAN SITE YANG DIPILIH -->
<script>
$('#site').change(function() {
	
	var siteid=this.value;

	if (siteid != '') {

		// Mengosongkan Chil Pada Element product_dropdown
		$('#product_dropdown').empty();

		//Apabila Site berubah
		$.get("<?=base_url();?>/activities/getproduct/"+siteid, function(data) {
			
			// Salin element get_product pada product_temporary
			$('#product_temporary').html(data);
			
			// Salin element ke product_dropdown
			const product_dropdown = document.getElementById("product_dropdown");
			const productid = document.getElementById("productid");
			product_dropdown.appendChild(productid);

			// Hapus Elemen Child pada product_temporary
			const product_temporary = document.getElementById("get_product");
			$('#product_temporary').empty();

			$('.select2').select2({
				theme: 'bootstrap-5',
				width: '100%'
			});
		})
	} else {
		// Mengosongkan Chil Pada Element product_dropdown
		$('#product_dropdown').empty();
		$('#product_temporary').empty();
	}
	
})

$('.select2').select2();

</script>

<?= $this->endSection() ?>