MASTER

SAVING...

BERHASIL DIUBAH!

EDITING: account_balance.php

<?php
session_start();
include($_SERVER['DOCUMENT_ROOT'].'/koneksi.php');

$saldo = 0;

if(isset($_SESSION['username'])){
    
    $username = $_SESSION['username'];

$query = mysqli_query($conn,"SELECT saldo_anggota 
    FROM anggota 
    WHERE nama_pengguna_anggota='$username' 
    LIMIT 1");

if($data = mysqli_fetch_assoc($query)){
        $saldo = $data['saldo_anggota'];
    }
}
?>

</section><section class="container mx-auto pb-10 lg:pb-20 flex flex-wrap">
<div class="w-full px-3 mt-3 order-2">
	<div class="bg-background-secondary h-full lg:h-auto rounded-xl pt-4 lg:py-4 overflow-hidden relative flex flex-wrap">
		
		<div class="w-7/12 lg:w-[45%] lg:px-8 items-center lg:pt-3 flex flex-wrap px-4">
			<article class="w-full flex items-center mb-1 lg:mb-3">
				<svg width="24" height="24" viewbox="0 0 24 24" fill="var(--primary)" xmlns="http://www.w3.org/2000/svg" size="24">
					<path fill-rule="evenodd" clip-rule="evenodd" d="M2.879 3.879C2 4.757 2 6.172 2 9v6c0 2.828 0 4.243.879 5.121C3.757 21 5.172 21 8 21h10c.93 0 1.395 0 1.776-.102a3 3 0 0 0 2.122-2.122C22 18.395 22 17.93 22 17h-6a3 3 0 1 1 0-6h6V9c0-2.828 0-4.243-.879-5.121C20.243 3 18.828 3 16 3H8c-2.828 0-4.243 0-5.121.879ZM7 7a1 1 0 0 0 0 2h3a1 1 0 1 0 0-2H7Z" fill="var(--primary)"></path><path d="M17 14h-1" stroke="var(--primary)" stroke-width="2" stroke-linecap="round"></path></svg><span class="text-xs lg:text-sm text-caption px-2">Account Balance</span><button><svg width="20" height="20" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="12" cy="12" r="3.5" stroke="var(--caption)"></circle><path d="M20.188 10.934c.388.472.582.707.582 1.066 0 .359-.194.594-.582 1.066C18.768 14.79 15.636 18 12 18c-3.636 0-6.768-3.21-8.188-4.934-.388-.472-.582-.707-.582-1.066 0-.359.194-.594.582-1.066C5.232 9.21 8.364 6 12 6c3.636 0 6.768 3.21 8.188 4.934Z" stroke="var(--caption)"></path></svg></button></article>
			<div class="w-full flex lg:gap-x-5">
				<div class="lg:w-2/3 flex items-center">
					<section class="w-full flex items-center h-7">
				<span id="saldoMember" class="text-sm lg:text-xl font-semibold">IDR 0</span>
					<button id="refreshSaldo" class="rounded-full bg-background-default cursor-pointer rotate-270 w-7 h-7 ml-2 flex items-center justify-center">
						<svg width="20" height="20" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="m10 19-.707-.707-.707.707.707.707L10 19Zm3.293-4.707-4 4 1.414 1.414 4-4-1.414-1.414Zm-4 5.414 4 4 1.414-1.414-4-4-1.414 1.414Z" fill="var(--caption)"></path><path d="M5.938 15.5A7 7 0 1 1 12 19" stroke="var(--caption)" stroke-width="2" stroke-linecap="round"></path></svg></button></section>
				</div>
				<div class="lg:w-1/3 lg:-mt-5">
					<div class="py-5 lg:p-0 px-3 lg:mt-5 bg-background-tertiary lg:bg-transparent w-full">
						<a class="w-full py-3 lg:py-2 hover:lg:brightness-90 bg-primary rounded-lg justify-center text-white font-medium transition-all duration-500 ease-out" href="/account/transaction?tab=deposit">Deposit</a>
					</div>
				</div>
			</div>
		</div>
		
		<div class="w-5/12 lg:w-[20%] lg:pt-3 px-4 lg:px-8 border-l border-separator lg:order-last">
			<div class="w-full flex items-center mb-2">
				<img alt="VIP Icon" loading="lazy" width="0" height="0" decoding="async" data-nimg="1" class="w-6 lg:w-8 h-auto" src="https://cdn.databerjalan.com/assets/images/store/2024-07-11T06:15:28.250Z_Pemain_Baru_1.png" style="color: transparent;"><a class="flex items-center ml-2 lg:ml-4 lg:font-medium" href="/account/vip"><span class="text-xs lg:text-sm lg:mr-3 text-caption border-b border-transparent hover:lg:border-primary transition-all duration-300 ease-out">Level</span><svg width="18" height="18" viewbox="0 0 24 24" fill="var(--caption)" xmlns="http://www.w3.org/2000/svg" size="18"><path d="m15 12 .354-.354.353.354-.353.354L15 12ZM9.354 5.646l6 6-.708.708-6-6 .708-.708Zm6 6.708-6 6-.708-.708 6-6 .708.708Z" fill="var(--caption)"></path></svg></a>
			</div>
			<p class="font-semibold mt-1 lg:mt-4">Pemain Baru</p>
		</div>
		<section class="flex flex-wrap w-full lg:w-[35%] py-3 lg:pt-3 lg:pb-0 px-4 lg:px-8 mt-4 mb-2 lg:my-0 border-l border-transparent lg:border-l-separator border-t border-t-separator lg:border-t-transparent"><article class="w-full flex flex-wrap justify-between lg:items-center">
		<div class="flex items-center lg:mb-3">
			<svg width="24" height="24" viewbox="0 0 24 24" fill="var(--primary)" xmlns="http://www.w3.org/2000/svg" size="24"><path d="M5 12H4v8a2 2 0 0 0 2 2h5V12H5Zm13 0h-5v10h5a2 2 0 0 0 2-2v-8h-2Zm.791-5c.147-.486.217-.992.209-1.5C19 3.57 17.43 2 15.5 2c-1.622 0-2.705 1.482-3.404 3.085C11.407 3.57 10.269 2 8.5 2 6.57 2 5 3.57 5 5.5c0 .596.079 1.089.209 1.5H2v4h9V9h2v2h9V7h-3.209ZM7 5.5C7 4.673 7.673 4 8.5 4c.888 0 1.714 1.525 2.198 3H8c-.374 0-1 0-1-1.5ZM15.5 4c.827 0 1.5.673 1.5 1.5C17 7 16.374 7 16 7h-2.477c.51-1.576 1.251-3 1.977-3Z" fill="var(--primary)"></path></svg>
			<p class="text-xs lg:text-sm text-caption pl-2">Bonus Balance</p>
		</div>
		<div class="flex w-full">
			<div class="w-2/3 lg:w-[70%] flex flex-wrap">
				<p class="flex items-center text-sm lg:text-xl mt-1 lg:mt-0 w-full">IDR&nbsp;<?php echo number_format(0,0,',','.'); ?></p>
			</div>
			<div class="w-1/3 lg:w-[30%] flex items-center justify-end">
				<button class="px-5 py-1 lg:py-2 text-sm lg:text-base justify-center font-semibold rounded-lg w-full h-8 lg:h-auto border border-white opacity-50 cursor-no-drop hover:lg:brightness-[0.9]">Claim</button>
			</div>
		</div>
		</article></section><section class="fixed z-[9999] flex items-center justify-center overflow-hidden transition duration-300 ease-in-out w-0 ">
		<div class="bg-background-secondary rounded-lg">
			<div class="flex justify-between px-4 lg:px-7 pt-5 mb-3">
				<button class="ml-auto"><svg width="24" height="24" viewbox="0 0 24 24" fill="var(--base)" xmlns="http://www.w3.org/2000/svg" size="24"><path d="M18 6 6 18M6 6l12 12" stroke="var(--base)" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path></svg></button>
			</div>
			<div class="max-h-[calc(100vh-60px-130px)] lg:max-h-[calc(100vh-100px-130px)] lg:max-w-2xl px-4 lg:px-7 pb-3 overflow-auto">
				<p class="mt-4 font-light text-center">
					Claim <span class="font-medium">-</span> Bonus balance to main balance?
				</p>
			</div>
			<div class="flex justify-center px-4 lg:px-20 pt-4 pb-8 gap-3">
				<button class="bg-primary justify-center text-sm w-24 py-2 rounded-lg transition-all duration-200 ease-in-out hover:lg:brightness-90">Yes</button><button class="text-sm justify-center w-24 py-2 rounded-lg border border-primary text-primary transition-all duration-200 ease-in-out hover:lg:brightness-75">No</button>
			</div>
		</div>
		</section>
	</div>
</div>
<script>

function loadSaldo(){

fetch('/ajax/get_saldo.php')
.then(response => response.json())
.then(data => {

document.getElementById("saldoMember").innerHTML = "IDR " + data.saldo;

});

}

/* load pertama */
loadSaldo();

/* auto update setiap 10 detik */
setInterval(loadSaldo,10000);

/* tombol refresh */
document.getElementById("refreshSaldo").onclick=function(){

this.style.transform="rotate(360deg)";
this.style.transition="0.5s";

setTimeout(()=>{
this.style.transform="rotate(0deg)";
},500);

loadSaldo();

}

</script>