<?php
	$profile_photo_path = !empty($rows['foto']) ? ltrim(str_replace('\\', '/', $rows['foto']), '/') : '';
	$profile_photo = ($profile_photo_path !== '' && is_file(FCPATH.$profile_photo_path)) ? base_url($profile_photo_path) : '';
	$profile_name = trim((string) $rows['nama_lengkap']);
	$profile_initial = function_exists('mb_substr') ? mb_strtoupper(mb_substr($profile_name, 0, 1)) : strtoupper(substr($profile_name, 0, 1));
	$is_primary_admin = ($rows['level'] === 'admin' && (int) $rows['parent'] === 0);
	$readonly = $is_primary_admin ? 'readonly' : '';
	$read = $is_primary_admin ? '' : 'readonly';
?>
<div class="container-fluid profile-editor-page" id="container-wrapper">
	<div class="profile-editor-hero">
		<div class="profile-hero-copy">
			<span class="profile-hero-icon"><i class="fa fa-user-circle"></i></span>
			<div><span class="profile-eyebrow">PENGATURAN PENGGUNA</span><h1>Edit Profil Pengguna</h1><p>Perbarui identitas, foto profil, keamanan akun, dan hak akses pengguna.</p></div>
		</div>
		<ol class="breadcrumb profile-breadcrumb"><li class="breadcrumb-item"><a href="<?=base_url('home');?>">Home</a></li><li class="breadcrumb-item"><a href="<?=base_url('user');?>">Data pengguna</a></li><li class="breadcrumb-item active" aria-current="page">Edit profil</li></ol>
	</div>

	<?=$this->session->flashdata('message');?>
	<?php echo form_open_multipart(current_url(), ['class'=>'profile-editor-form','role'=>'form','id'=>'profileEditorForm']); ?>
	<input type="hidden" name="id" value="<?=htmlspecialchars($rows['sesi_login'], ENT_QUOTES, 'UTF-8');?>">

	<div class="profile-editor-grid">
		<section class="profile-panel identity-panel" aria-labelledby="identityTitle">
			<div class="profile-panel-heading"><span><i class="fa fa-id-card-o"></i></span><div><h2 id="identityTitle">Informasi pengguna</h2><p>Identitas dan informasi utama akun.</p></div></div>

			<div class="profile-photo-uploader">
				<div class="profile-avatar-preview" id="profileAvatarPreview"><span <?=!empty($profile_photo)?'hidden':'';?>><?=htmlspecialchars($profile_initial ?: 'U', ENT_QUOTES, 'UTF-8');?></span><img src="<?=htmlspecialchars($profile_photo, ENT_QUOTES, 'UTF-8');?>" alt="Foto profil <?=htmlspecialchars($profile_name, ENT_QUOTES, 'UTF-8');?>" <?=empty($profile_photo)?'hidden':'';?>></div>
				<div class="profile-photo-info"><div class="profile-photo-title">Foto profil <span>Opsional</span></div><p>JPG, PNG, atau WebP maksimal 2 MB. Foto otomatis dipotong persegi dan dioptimalkan.</p><div class="profile-photo-actions"><label for="profile_photo" class="choose-photo-btn"><i class="fa fa-camera"></i> <?=empty($profile_photo)?'Pilih foto':'Ganti foto';?></label><button type="button" class="cancel-photo-btn" hidden><i class="fa fa-times"></i> Batalkan pilihan</button></div><input type="file" name="profile_photo" id="profile_photo" accept="image/jpeg,image/png,image/webp" hidden></div>
			</div>

			<div class="profile-fields-grid">
				<div class="form-group profile-field-full"><label for="email">Email</label><div class="profile-readonly-field"><input type="email" id="email" name="email" class="form-control" value="<?=htmlspecialchars($rows['email'], ENT_QUOTES, 'UTF-8');?>" readonly><i class="fa fa-lock" title="Email tidak dapat diubah"></i></div><small>Email digunakan sebagai identitas login dan tidak dapat diubah.</small></div>
				<div class="form-group"><label for="nama">Nama lengkap <b>*</b></label><input type="text" id="nama" name="nama" class="form-control" value="<?=htmlspecialchars($rows['nama_lengkap'], ENT_QUOTES, 'UTF-8');?>" placeholder="Nama lengkap pengguna" required></div>
				<div class="form-group"><label for="jabatan">Jabatan <b>*</b></label><input type="text" id="jabatan" name="jabatan" class="form-control" value="<?=htmlspecialchars($rows['app_secret'], ENT_QUOTES, 'UTF-8');?>" placeholder="Contoh: Administrator" required></div>
				<div class="form-group profile-field-full"><label for="password">Password baru <span class="field-optional">Opsional</span></label><div class="profile-password-field"><input type="password" id="password" name="password" class="form-control" placeholder="Kosongkan jika password tidak diubah"><button type="button" class="profile-password-toggle" aria-label="Tampilkan password"><i class="fa fa-eye"></i></button></div><small>Gunakan minimal 6 karakter agar akun lebih aman.</small></div>
				<div class="form-group profile-field-full"><label for="level">Level akses</label><select id="level" name="level" class="custom-select form-control" <?=$readonly;?>><?php
					$levels=$this->model_app->view_where_ordering('hak_akses',['level'=>$rows['level']],'id_level','ASC')->result_array();
					foreach($levels as $val){ echo '<option value="'.$val['id_level'].','.$val['level'].'" '.($val['id_level']==$rows['id_level']?'selected':'').'>'.htmlspecialchars($val['nama'], ENT_QUOTES, 'UTF-8').'</option>'; }
				?></select><?php if($is_primary_admin){ ?><small>Level administrator utama dikunci untuk menjaga akses aplikasi.</small><?php } ?></div>
			</div>

			<div class="profile-status-card"><div class="profile-status-icon"><i class="fa fa-check-circle"></i></div><div><strong>Status akun</strong><span>Pengguna dapat masuk dan menggunakan aplikasi.</span></div><span class="profile-status-badge">Aktif</span><input type="hidden" value="Y" id="aktif1" name="aktif"></div>
		</section>

		<section class="profile-panel access-panel" aria-labelledby="accessTitle">
			<div class="profile-panel-heading"><span><i class="fa fa-shield"></i></span><div><h2 id="accessTitle">Hak akses pengguna</h2><p>Tentukan menu dan tindakan yang dapat digunakan.</p></div></div>
			<div class="profile-access-box">
				<div class="profile-access-head"><div><strong>Menu aplikasi</strong><p>Pilih menu yang dapat dibuka oleh pengguna ini.</p></div><label for="select_all" class="profile-select-all"><input id="select_all" type="checkbox"><span>Pilih semua</span></label></div>
				<div class="over-profile profile-access-tree"><?php
					$lv = $rows['id_level']; $parent = $rows['parent'];
					$resultz = $this->db->query("SELECT * FROM menuadmin where FIND_IN_SET('$lv', CONCAT(id_level, ',')) AND aktif='Y' order by urutan");
					if($resultz->num_rows() > 0){ foreach($resultz->result_array() as $rowz){ $dataTz[$rowz['idparent']][]=$rowz; } echo checkbox($dataTz,0,$rowz['idparent'],$rows['idmenu'],$parent); }
				?></div>
			</div>
			<div class="profile-type-access"><div class="profile-subheading"><span><i class="fa fa-key"></i></span><div><strong>Tipe akses</strong><p>Atur kewenangan tindakan dan pengelolaan data.</p></div></div><?php if($is_primary_admin){ ?><select id="akses" name="akses[]" class="form-control select2-profil" multiple="multiple" <?=$read;?>><?php foreach($kategori as $rowz){ $dataTzx[$rowz->id_parent][]=$rowz; } if(!empty($dataTzx)){ echo select_badge($dataTzx,0,0,$rows['type_akses']); } ?></select><?php } else { foreach($kategori as $rowz){ $dataTzx[$rowz->id_parent][]=$rowz; } if(!empty($dataTzx)){ echo '<div class="profile-access-badges">'.select_badge($dataTzx,0,$rows['parent'],$rows['type_akses']).'</div>'; } } ?></div>
		</section>
	</div>

	<div class="profile-form-actions"><div><i class="fa fa-info-circle"></i><span>Pastikan informasi dan hak akses sudah sesuai sebelum menyimpan.</span></div><div class="profile-action-buttons"><a href="<?=base_url('user');?>" class="btn profile-cancel-btn">Batal</a><button type="submit" name="submit" class="btn profile-save-btn"><i class="fa fa-save"></i> Simpan perubahan</button></div></div>
	</form>
</div>

<style>
.profile-editor-page{--profile-primary:#1764be;--profile-ink:#17233d;--profile-muted:#7b879b;padding-bottom:32px}.profile-editor-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:22px;padding:4px 0}.profile-hero-copy{display:flex;align-items:center;gap:14px}.profile-hero-icon{display:grid;width:52px;height:52px;flex:0 0 52px;place-items:center;border-radius:15px;background:linear-gradient(135deg,#e5f1ff,#f1f7ff);color:var(--profile-primary);font-size:24px;box-shadow:0 5px 16px rgba(23,100,190,.1)}.profile-eyebrow{display:block;margin-bottom:3px;color:var(--profile-primary);font-size:10px;font-weight:800;letter-spacing:.09em}.profile-editor-hero h1{margin:0;color:var(--profile-ink);font-size:25px;font-weight:800;letter-spacing:-.02em}.profile-editor-hero p{margin:5px 0 0;color:var(--profile-muted);font-size:12px}.profile-breadcrumb{margin:0;padding:9px 13px;border:1px solid #e0e7f0;border-radius:10px;background:#fff;font-size:11px}.profile-editor-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:20px;align-items:start}.profile-panel{min-width:0;padding:22px;border:1px solid #e0e7f0;border-radius:18px;background:#fff;box-shadow:0 8px 28px rgba(25,50,85,.06)}.profile-panel-heading{display:flex;align-items:center;margin-bottom:19px;padding-bottom:16px;border-bottom:1px solid #edf1f6}.profile-panel-heading>span{display:grid;width:42px;height:42px;flex:0 0 42px;margin-right:11px;place-items:center;border-radius:12px;background:#eaf3ff;color:var(--profile-primary);font-size:18px}.profile-panel-heading h2{margin:0;color:var(--profile-ink);font-size:16px;font-weight:800}.profile-panel-heading p{margin:3px 0 0;color:var(--profile-muted);font-size:11px}.profile-photo-uploader{display:flex;align-items:center;gap:15px;margin-bottom:19px;padding:14px;border:1px dashed #c8d7e8;border-radius:14px;background:linear-gradient(135deg,#f7fbff,#fbfcfe);transition:.2s}.profile-photo-uploader:hover{border-color:#83addf;background:#f3f8ff}.profile-avatar-preview{display:grid;width:78px;height:78px;flex:0 0 78px;overflow:hidden;place-items:center;border:4px solid #fff;border-radius:22px;background:linear-gradient(135deg,#dcecff,#edf5ff);color:var(--profile-primary);font-size:27px;font-weight:800;box-shadow:0 5px 16px rgba(31,91,160,.17)}.profile-avatar-preview img{width:100%;height:100%;object-fit:cover}.profile-photo-info{min-width:0}.profile-photo-title{color:#293852;font-size:13px;font-weight:800}.profile-photo-title span,.field-optional{margin-left:5px;padding:2px 6px;border-radius:10px;background:#edf1f6;color:#7c899c;font-size:9px;font-weight:700}.profile-photo-info p{margin:4px 0 9px;color:#7c899d;font-size:10px;line-height:1.45}.profile-photo-actions{display:flex;flex-wrap:wrap;gap:7px}.choose-photo-btn,.cancel-photo-btn{display:inline-flex;align-items:center;gap:6px;min-height:32px;margin:0;padding:6px 11px;border-radius:9px;font-size:10px;font-weight:800;cursor:pointer;transition:.2s}.choose-photo-btn{border:1px solid #b8d0ed;background:#eaf3ff;color:var(--profile-primary)}.choose-photo-btn:hover{background:#ddecff}.cancel-photo-btn{border:0;background:#fff0f2;color:#c83c50}.profile-fields-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.profile-editor-page .form-group{min-width:0;margin:0}.profile-field-full{grid-column:1/-1}.profile-editor-page label{margin-bottom:6px;color:#354258;font-size:11px;font-weight:700}.profile-editor-page label b{color:#ef4444}.profile-editor-page .form-control{height:43px;border:1px solid #d7e0ec;border-radius:10px;background:#fff;color:#25344c;font-size:12px;transition:.2s}.profile-editor-page .form-control:focus{border-color:#4b92e5;box-shadow:0 0 0 3px rgba(35,115,211,.12)}.profile-editor-page .form-control[readonly]{background:#f2f5f9;color:#6d798c;cursor:not-allowed}.profile-editor-page .form-group small{display:block;margin-top:5px;color:#8a96a8;font-size:9px}.profile-readonly-field,.profile-password-field{position:relative}.profile-readonly-field input,.profile-password-field input{padding-right:42px}.profile-readonly-field>i{position:absolute;top:14px;right:14px;color:#98a5b7}.profile-password-toggle{position:absolute;top:5px;right:5px;width:33px;height:33px;border:0;border-radius:8px;background:transparent;color:#78869a}.profile-password-toggle:hover{background:#edf4fc;color:var(--profile-primary)}select[readonly]{pointer-events:none;touch-action:none}.profile-status-card{display:flex;align-items:center;gap:11px;margin-top:17px;padding:13px;border:1px solid #dce7e3;border-radius:12px;background:#f6fcf9}.profile-status-icon{display:grid;width:36px;height:36px;flex:0 0 36px;place-items:center;border-radius:10px;background:#ddf7eb;color:#12845f}.profile-status-card strong,.profile-status-card>div>span{display:block}.profile-status-card strong{color:#293852;font-size:12px}.profile-status-card>div>span{margin-top:2px;color:#778699;font-size:9px}.profile-status-badge{margin-left:auto!important;padding:6px 10px;border-radius:20px;background:#dff7ec;color:#11805c!important;font-size:9px!important;font-weight:800}.profile-access-box{overflow:hidden;border:1px solid #dfe7f1;border-radius:14px;background:#fbfcfe}.profile-access-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 15px;border-bottom:1px solid #e7edf4;background:#f5f8fc}.profile-access-head strong{color:#293852;font-size:12px}.profile-access-head p{margin:3px 0 0;color:#8490a2;font-size:9px}.profile-select-all{display:flex;align-items:center;gap:6px;margin:0!important;padding:7px 10px;border:1px solid #d6e2ef;border-radius:9px;background:#fff;color:var(--profile-primary)!important;white-space:nowrap;cursor:pointer}.profile-select-all input,.profile-access-tree input{accent-color:var(--profile-primary)}.profile-access-tree{height:350px;padding:14px 16px;overflow-y:auto;color:#445269;font-size:11px;scrollbar-width:thin;scrollbar-color:#b7c6d9 transparent}.profile-access-tree ul{margin-bottom:4px;padding-left:22px;list-style:none}.profile-access-tree>ul{padding-left:0}.profile-access-tree label{margin-bottom:5px;font-weight:500;cursor:pointer}.profile-access-tree input{margin-right:6px}.profile-type-access{margin-top:16px;padding:15px;border:1px solid #e0e7f0;border-radius:14px;background:#fff}.profile-subheading{display:flex;align-items:center;margin-bottom:12px}.profile-subheading>span{display:grid;width:35px;height:35px;flex:0 0 35px;margin-right:9px;place-items:center;border-radius:10px;background:#fff4dc;color:#b47700}.profile-subheading strong{display:block;color:#293852;font-size:12px}.profile-subheading p{margin:2px 0 0;color:#8490a2;font-size:9px}.profile-editor-page .select2-container{width:100%!important}.profile-editor-page .select2-container .select2-selection--multiple{min-height:43px;border-color:#d7e0ec;border-radius:10px}.profile-form-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:20px;padding:15px 18px;border:1px solid #e0e7f0;border-radius:14px;background:#fff;box-shadow:0 7px 24px rgba(25,50,85,.06)}.profile-form-actions>div:first-child{display:flex;align-items:center;gap:8px;color:#77869a;font-size:10px}.profile-form-actions>div:first-child i{color:var(--profile-primary)}.profile-action-buttons{display:flex;gap:9px}.profile-action-buttons .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:112px;height:41px;border-radius:10px;font-size:11px;font-weight:800}.profile-cancel-btn{border:1px solid #d6e0eb;background:#fff;color:#5e6c80}.profile-save-btn{border:1px solid var(--profile-primary);background:var(--profile-primary);color:#fff;box-shadow:0 5px 13px rgba(23,100,190,.22)}.profile-save-btn:hover{background:#1055a5;color:#fff;transform:translateY(-1px)}
@media(max-width:991.98px){.profile-editor-grid{grid-template-columns:1fr}.profile-access-tree{height:300px}}
@media(max-width:767.98px){.profile-editor-hero{align-items:flex-start;flex-direction:column}.profile-breadcrumb{display:none}.profile-form-actions{align-items:stretch;flex-direction:column}.profile-action-buttons{width:100%}.profile-action-buttons .btn{flex:1}}
@media(max-width:575.98px){.profile-editor-page{padding-left:12px;padding-right:12px}.profile-editor-hero h1{font-size:21px}.profile-editor-hero p{font-size:10px}.profile-panel{padding:16px;border-radius:14px}.profile-photo-uploader{align-items:flex-start}.profile-avatar-preview{width:62px;height:62px;flex-basis:62px;border-radius:18px}.profile-fields-grid{grid-template-columns:1fr}.profile-field-full{grid-column:auto}.profile-access-head{align-items:flex-start}.profile-form-actions{position:sticky;bottom:8px;z-index:10}.profile-form-actions>div:first-child{display:none}}
</style>
<script>
$(function(){
	$('.select2-profil').select2({placeholder:'Pilih tipe akses'});
	$('select[readonly=readonly] option:not(:selected)').prop('disabled',true);
	$('#select_all').on('change',function(){ $('.checkbox').prop('checked',this.checked); });
	$('.checkbox').on('change',function(){ $('#select_all').prop('checked',$('.checkbox:checked').length === $('.checkbox').length); });
	$('.profile-password-toggle').on('click',function(){ var input=$('#password'); var show=input.attr('type')==='password'; input.attr('type',show?'text':'password'); $(this).find('i').toggleClass('fa-eye',!show).toggleClass('fa-eye-slash',show); $(this).attr('aria-label',show?'Sembunyikan password':'Tampilkan password'); });
	var originalPhoto=$('#profileAvatarPreview img').attr('src')||'';
	$('#profile_photo').on('change',function(){ var file=this.files&&this.files[0]; if(!file){return;} if(['image/jpeg','image/png','image/webp'].indexOf(file.type)===-1||file.size>2097152){ this.value=''; notif(file.size>2097152?'Ukuran foto maksimal 2 MB':'Format foto harus JPG, PNG, atau WebP','danger'); return; } var url=URL.createObjectURL(file); $('#profileAvatarPreview img').attr('src',url).prop('hidden',false); $('#profileAvatarPreview span').prop('hidden',true); $('.cancel-photo-btn').prop('hidden',false); });
	$('.cancel-photo-btn').on('click',function(){ $('#profile_photo').val(''); $('#profileAvatarPreview img').attr('src',originalPhoto).prop('hidden',!originalPhoto); $('#profileAvatarPreview span').prop('hidden',!!originalPhoto); $(this).prop('hidden',true); });
	$('#profileEditorForm').on('submit',function(){ var button=$(this).find('.profile-save-btn'); button.prop('disabled',true).html('<i class="fa fa-circle-o-notch fa-spin"></i> Menyimpan...'); });
});
</script>
