@extends('layouts.templateregist')
@section('content')
<form class="form w-100" id="form_edit" method="post" action="{{ url('registrasi/update') }}" enctype="multipart/form-data">
@csrf @method('patch')
	<div class="mb-10 text-center">
		<h1 class="text-dark mb-3">Register your account</h1>
	</div>
	<div class="alert alert-warning">
	    <div class="d-flex flex-column">
	        <span>Anda belum melakukan registrasi</span>
	    </div>
	</div>
	<center>
		<div class="image-input image-input-outline" data-kt-image-input="true" style="background-image: url(/assets/media/avatars/blank.png)">
		    <div class="image-input-wrapper w-125px h-125px" style="background-image: url(/assets/media/avatars/blank.png)"></div>
				<label class="btn btn-icon btn-circle btn-active-color-primary w-25px h-25px bg-white shadow"
				data-kt-image-input-action="change"
				data-bs-toggle="tooltip"
				data-bs-dismiss="click"
				title="Change avatar">
				 <i class="bi bi-pencil-fill fs-7"></i>
					 <input type="file" data-max-file-size="4M" accept='image/*'capture='camera' name="avatar" class="dropify" required/>
					 <input type="hidden" name="avatar_remove" />
				</label>
				<span class="btn btn-icon btn-circle btn-active-color-primary w-25px h-25px bg-white shadow"
				data-kt-image-input-action="cancel"
				data-bs-toggle="tooltip"
				data-bs-dismiss="click"
				title="Cancel avatar">
					<i class="bi bi-x fs-2"></i>
				</span>
				<span class="btn btn-icon btn-circle btn-active-color-primary w-25px h-25px bg-white shadow"
				data-kt-image-input-action="remove"
				data-bs-toggle="tooltip"
				data-bs-dismiss="click"
				title="Remove avatar">
					<i class="bi bi-x fs-2"></i>
				</span>
	    </div>
	</center>
	<br>
	<div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">Nama Lengkap</label>
		<input class="form-control form-control-lg form-control-solid" type="text" placeholder="" name="nama" autocomplete="off" value="{{Auth::user()->name}}" required />
	</div>
	<div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">Region</label>
		<input class="form-control form-control-lg form-control-solid" type="text" placeholder="" name="region" autocomplete="off" readonly value="{{Auth::user()->region}}" />
		
	</div>
	<div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">Distributor</label>
		<select class="form-select form-select-lg form-select-solid" data-control="select2" data-placeholder="Select an option" id="sDistributor" name="distributor" required>
			@foreach($distributor as $dist)
		    	<option value="{{$dist}}" {{Auth::user()->distributor == $dist  ? 'selected' : ''}}>{{$dist}}</option>
		    @endforeach
		</select>
	</div>
	<div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">Territory</label>
		<select class="form-select form-select-lg form-select-solid" data-control="select2" data-placeholder="Select an option" id="sTerritory" required name="territory">
			@foreach($territory as $terr)
		    	<option value="{{$terr}}" {{Auth::user()->territory == $terr  ? 'selected' : ''}}>{{$terr}}</option>
		   @endforeach
		</select>
	</div>
	<div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">Jabatan</label>
		<select class="form-select form-select-lg form-select-solid" data-control="select2" data-placeholder="Select an option" required name="jabatan">
			@foreach($jabatan as $jab)
		    	<option value="{{$jab->jabatan}}" {{Auth::user()->jabatan == $jab->jabatan  ? 'selected' : ''}}>{{$jab->jabatan}}</option>
		   @endforeach
		</select>
	</div>
	<div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">User ID DMS</label>
		<input class="form-control form-control-lg form-control-solid" type="text" placeholder="" name="usernamedms" autocomplete="off" readonly value="{{Auth::user()->username}}"/>
	</div>
	<div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">No HP</label>
		<input class="form-control form-control-lg form-control-solid" type="number" placeholder="Contoh : 085692133687" name="no_hp" autocomplete="off" required oninput="this.value = this.value.replace(/[^0-9.]/g, ''); this.value = this.value.replace(/(\..*)\./g, '$1');" onKeyDown="if(this.value.length==13 && event.keyCode!=8) return false;"/>
	</div>

	<div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">No HP (Akun LinkAja)</label>
		<input class="form-control form-control-lg form-control-solid" type="number" placeholder="Contoh : 085692133687" name="no_linkaja" autocomplete="off" required oninput="this.value = this.value.replace(/[^0-9.]/g, ''); this.value = this.value.replace(/(\..*)\./g, '$1');" onKeyDown="if(this.value.length==13 && event.keyCode!=8) return false;"/>
	</div>

	<div class="mb-10 fv-row" data-kt-password-meter="true">
        <div class="mb-1">
            <label class="form-label fw-bolder text-dark fs-6">New Password <span style="font-size:12px; color:grey;">(*minimal 8 karakter)</span></label>
            <div class="position-relative mb-3">
                <input id="password" type="password" class="form-control form-control-lg form-control-solid @error('password') is-invalid @enderror" name="password" required autocomplete="new-password">
		        @error('password')
		            <span class="invalid-feedback" role="alert">
		                <strong>{{ $message }}</strong>
		            </span>
		        @enderror
                <span class="btn btn-sm btn-icon position-absolute translate-middle top-50 end-0 me-n2" data-kt-password-meter-control="visibility">
                    <i class="bi bi-eye-slash fs-2"></i>
                    <i class="bi bi-eye fs-2 d-none"></i>
                </span>
            </div>
        </div>
    </div>
    <div class="mb-10 fv-row" data-kt-password-meter="true">
        <div class="mb-1">
            <label class="form-label fw-bolder text-dark fs-6">Confirm Password</label>
            <div class="position-relative mb-3">
                <input id="password-confirm" type="password" class="form-control form-control-lg form-control-solid" name="password_confirmation" required autocomplete="new-password">
		        @error('password')
		            <span class="invalid-feedback" role="alert">
		                <strong>{{ $message }}</strong>
		            </span>
		        @enderror
                <span class="btn btn-sm btn-icon position-absolute translate-middle top-50 end-0 me-n2" data-kt-password-meter-control="visibility">
                    <i class="bi bi-eye-slash fs-2"></i>
                    <i class="bi bi-eye fs-2 d-none"></i>
                </span>
            </div>
        </div>
    </div>
	<!-- <div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">Password</label>
		<input class="form-control form-control-lg form-control-solid" type="password" placeholder="" name="password" autocomplete="off" required minlength="8" />
		<hint>*minimal 8 karakter</hint>
	</div> -->
	<!-- <div class="fv-row mb-7">
		<label class="form-label fw-bolder text-dark fs-6">Confirm Password</label>
		<input class="form-control form-control-lg form-control-solid" type="password" placeholder="" name="no_hp" autocomplete="off" required />
	</div> -->
	<div class="text-center">
		<button type="submit" id="kt_sign_up_submit" class="btn btn-lg btn-primary">
			<span class="indicator-label">Submit</span>
		</button>
	</div>
	<!--end::Actions-->
</form>
@endsection