Autosave: 20260216-055045
This commit is contained in:
Flatlogic Bot
parent
3d64b056c5
commit
9f605f214e
1
admin/ai_control.php
Normal file
1
admin/ai_control.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
1
admin/backend_settings.php
Normal file
1
admin/backend_settings.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
1
admin/binary.php
Normal file
1
admin/binary.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
1
admin/contract.php
Normal file
1
admin/contract.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
167
admin/customer_service.php
Normal file
167
admin/customer_service.php
Normal file
@ -0,0 +1,167 @@
|
||||
<?php
|
||||
session_start();
|
||||
require_once __DIR__ . '/../db/config.php';
|
||||
|
||||
// Check if admin
|
||||
if (!isset($_SESSION['user_id'])) {
|
||||
header("Location: /auth/login.php");
|
||||
exit;
|
||||
}
|
||||
|
||||
// In a real app, check for admin role here
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>Byro Admin | 客服系统</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
body { background-color: #f0f2f5; font-family: 'Noto Sans SC', sans-serif; height: 100vh; margin: 0; }
|
||||
.sidebar { width: 350px; background: #fff; border-right: 1px solid #ddd; display: flex; flex-direction: column; }
|
||||
.main-chat { flex: 1; display: flex; flex-direction: column; background: #fff; }
|
||||
.user-list { flex: 1; overflow-y: auto; }
|
||||
.user-card { padding: 15px; border-bottom: 1px solid #f0f0f0; cursor: pointer; transition: all 0.2s; }
|
||||
.user-card:hover { background: #f8f9fa; }
|
||||
.user-card.active { background: #e7f3ff; border-left: 5px solid #007bff; }
|
||||
.chat-header { padding: 15px 25px; border-bottom: 1px solid #ddd; background: #fff; z-index: 10; }
|
||||
.messages-area { flex: 1; padding: 25px; background: #f9f9f9; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; }
|
||||
.msg { max-width: 75%; padding: 10px 15px; border-radius: 18px; font-size: 14px; line-height: 1.5; }
|
||||
.msg-admin { align-self: flex-end; background: #007bff; color: #fff; border-bottom-right-radius: 2px; }
|
||||
.msg-user { align-self: flex-start; background: #fff; color: #333; border: 1px solid #eee; border-bottom-left-radius: 2px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); }
|
||||
.chat-input-area { padding: 20px; border-top: 1px solid #ddd; background: #fff; }
|
||||
.status-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; margin-right: 5px; }
|
||||
.status-online { background: #28a745; }
|
||||
</style>
|
||||
</head>
|
||||
<body class="d-flex">
|
||||
|
||||
<div class="sidebar">
|
||||
<div class="p-3 bg-primary text-white d-flex justify-content-between align-items-center">
|
||||
<h5 class="m-0 fw-bold">Byro 客服中心</h5>
|
||||
<span class="badge bg-light text-primary">Live</span>
|
||||
</div>
|
||||
<div class="p-2">
|
||||
<input type="text" class="form-control form-control-sm" placeholder="搜索用户 UID / IP">
|
||||
</div>
|
||||
<div class="user-list" id="user-list">
|
||||
<!-- User cards -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="main-chat">
|
||||
<div class="chat-header" id="chat-header" style="display: none;">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<h5 class="m-0 fw-bold" id="header-name">用户名称</h5>
|
||||
<div class="small text-muted" id="header-meta">UID: --- | IP: ---</div>
|
||||
</div>
|
||||
<div class="text-end">
|
||||
<span class="status-dot status-online"></span>
|
||||
<span class="small text-success fw-bold">正在对话</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="messages-area" id="messages-area">
|
||||
<div class="m-auto text-center text-muted">
|
||||
<i class="bi bi-chat-left-dots fs-1 d-block mb-3"></i>
|
||||
<p>从左侧选择一个会话开始实时对话</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="chat-input-area" id="input-area" style="display: none;">
|
||||
<form id="chat-form" class="d-flex gap-2">
|
||||
<input type="text" id="msg-input" class="form-control" placeholder="输入消息回复用户..." autocomplete="off">
|
||||
<button type="submit" class="btn btn-primary px-4 fw-bold">发送回复</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let selectedUser = null;
|
||||
let selectedIp = null;
|
||||
let lastMsgId = 0;
|
||||
|
||||
async function refreshUsers() {
|
||||
const r = await fetch('/api/chat.php?action=admin_get_all');
|
||||
const users = await r.json();
|
||||
const list = document.getElementById('user-list');
|
||||
|
||||
let html = '';
|
||||
users.forEach(u => {
|
||||
const isActive = (selectedIp === u.ip_address && selectedUser == u.user_id);
|
||||
html += `
|
||||
<div class="user-card ${isActive ? 'active' : ''}" onclick="openChat('${u.user_id}', '${u.ip_address}', '${u.username || '匿名用户'}', '${u.uid || '---'}')">
|
||||
<div class="d-flex justify-content-between mb-1">
|
||||
<span class="fw-bold">${u.username || '匿名用户'}</span>
|
||||
<span class="small text-muted">${new Date(u.created_at).toLocaleTimeString()}</span>
|
||||
</div>
|
||||
<div class="small text-truncate text-muted mb-1">${u.message}</div>
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<span class="badge bg-light text-dark border" style="font-size: 10px;">UID: ${u.uid || '---'}</span>
|
||||
<span class="text-primary" style="font-size: 10px;">${u.ip_address}</span>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
});
|
||||
list.innerHTML = html;
|
||||
}
|
||||
|
||||
function openChat(userId, ip, name, uid) {
|
||||
selectedUser = userId;
|
||||
selectedIp = ip;
|
||||
document.getElementById('header-name').innerText = name;
|
||||
document.getElementById('header-meta').innerText = `UID: ${uid} | IP: ${ip}`;
|
||||
document.getElementById('chat-header').style.display = 'block';
|
||||
document.getElementById('input-area').style.display = 'block';
|
||||
lastMsgId = 0;
|
||||
fetchMessages();
|
||||
}
|
||||
|
||||
async function fetchMessages() {
|
||||
if (!selectedIp) return;
|
||||
const r = await fetch(`/api/chat.php?action=get_messages&user_id=${selectedUser}&ip=${selectedIp}`);
|
||||
const msgs = await r.json();
|
||||
const area = document.getElementById('messages-area');
|
||||
|
||||
// Simple filter for the specific conversation
|
||||
const filtered = msgs.filter(m => m.ip_address === selectedIp && (m.user_id == selectedUser || m.user_id == 0));
|
||||
|
||||
if (filtered.length > lastMsgId) {
|
||||
area.innerHTML = '';
|
||||
filtered.forEach(m => {
|
||||
const div = document.createElement('div');
|
||||
div.className = `msg ${m.sender === 'admin' ? 'msg-admin' : 'msg-user'}`;
|
||||
div.innerText = m.message;
|
||||
area.appendChild(div);
|
||||
});
|
||||
area.scrollTop = area.scrollHeight;
|
||||
lastMsgId = filtered.length;
|
||||
}
|
||||
}
|
||||
|
||||
document.getElementById('chat-form').addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
const input = document.getElementById('msg-input');
|
||||
const msg = input.value.trim();
|
||||
if (!msg) return;
|
||||
|
||||
const fd = new URLSearchParams();
|
||||
fd.append('message', msg);
|
||||
fd.append('user_id', selectedUser);
|
||||
fd.append('ip_address', selectedIp);
|
||||
|
||||
await fetch('/api/chat.php?action=admin_send', { method: 'POST', body: fd });
|
||||
input.value = '';
|
||||
fetchMessages();
|
||||
});
|
||||
|
||||
setInterval(refreshUsers, 5000);
|
||||
setInterval(fetchMessages, 2000);
|
||||
refreshUsers();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
1
admin/exchange.php
Normal file
1
admin/exchange.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
1
admin/finance.php
Normal file
1
admin/finance.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
1
admin/frontend_settings.php
Normal file
1
admin/frontend_settings.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
146
admin/index.php
Normal file
146
admin/index.php
Normal file
@ -0,0 +1,146 @@
|
||||
<?php
|
||||
require_once __DIR__ . '/layout.php';
|
||||
|
||||
ob_start();
|
||||
?>
|
||||
|
||||
<div class="row g-4 mb-4">
|
||||
<div class="col-md-3">
|
||||
<div class="card p-3">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<div class="text-muted small">总用户数</div>
|
||||
<div class="fs-3 fw-bold">1,234</div>
|
||||
</div>
|
||||
<div class="bg-primary bg-opacity-10 p-3 rounded-circle text-primary">
|
||||
<i class="bi bi-people fs-4"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-3 small text-success">
|
||||
<i class="bi bi-arrow-up"></i> 12% 较上月
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="card p-3">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<div class="text-muted small">总充值 (USDT)</div>
|
||||
<div class="fs-3 fw-bold">542,000</div>
|
||||
</div>
|
||||
<div class="bg-success bg-opacity-10 p-3 rounded-circle text-success">
|
||||
<i class="bi bi-cash-stack fs-4"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-3 small text-success">
|
||||
<i class="bi bi-arrow-up"></i> 5.4% 较昨日
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="card p-3">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<div class="text-muted small">今日成交额</div>
|
||||
<div class="fs-3 fw-bold">1.2M</div>
|
||||
</div>
|
||||
<div class="bg-warning bg-opacity-10 p-3 rounded-circle text-warning">
|
||||
<i class="bi bi-activity fs-4"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-3 small text-danger">
|
||||
<i class="bi bi-arrow-down"></i> 2.1% 较昨日
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="card p-3">
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div>
|
||||
<div class="text-muted small">待审核提现</div>
|
||||
<div class="fs-3 fw-bold text-danger">15</div>
|
||||
</div>
|
||||
<div class="bg-danger bg-opacity-10 p-3 rounded-circle text-danger">
|
||||
<i class="bi bi-clock-history fs-4"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-3 small text-muted">
|
||||
需要尽快处理
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-4">
|
||||
<div class="col-md-8">
|
||||
<div class="table-container">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h6 class="mb-0 fw-bold">最新用户注册</h6>
|
||||
<button class="btn btn-sm btn-link text-decoration-none">查看全部</button>
|
||||
</div>
|
||||
<table class="table table-hover align-middle">
|
||||
<thead>
|
||||
<tr class="text-muted">
|
||||
<th>UID</th>
|
||||
<th>账号</th>
|
||||
<th>信用分</th>
|
||||
<th>注册时间</th>
|
||||
<th>状态</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php
|
||||
$stmt = db()->prepare("SELECT * FROM users ORDER BY created_at DESC LIMIT 5");
|
||||
$stmt->execute();
|
||||
while ($user = $stmt->fetch()):
|
||||
?>
|
||||
<tr>
|
||||
<td><code><?= $user['uid'] ?></code></td>
|
||||
<td><?= htmlspecialchars($user['username']) ?></td>
|
||||
<td><?= $user['credit_score'] ?></td>
|
||||
<td><?= date('Y-m-d H:i', strtotime($user['created_at'])) ?></td>
|
||||
<td><span class="badge bg-success opacity-75">正常</span></td>
|
||||
<td>
|
||||
<button class="btn btn-sm btn-outline-primary py-0">编辑</button>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endwhile; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="table-container">
|
||||
<h6 class="mb-4 fw-bold">系统通知</h6>
|
||||
<div class="list-group list-group-flush">
|
||||
<div class="list-group-item px-0 py-3">
|
||||
<div class="d-flex justify-content-between mb-1">
|
||||
<span class="fw-bold small">系统升级成功</span>
|
||||
<span class="text-muted" style="font-size: 10px;">1小时前</span>
|
||||
</div>
|
||||
<p class="text-muted small mb-0">版本 2.1.0 已发布，优化了交易引擎性能。</p>
|
||||
</div>
|
||||
<div class="list-group-item px-0 py-3">
|
||||
<div class="d-flex justify-content-between mb-1">
|
||||
<span class="fw-bold small">数据库备份</span>
|
||||
<span class="text-muted" style="font-size: 10px;">5小时前</span>
|
||||
</div>
|
||||
<p class="text-muted small mb-0">每日自动备份已完成，状态正常。</p>
|
||||
</div>
|
||||
<div class="list-group-item px-0 py-3">
|
||||
<div class="d-flex justify-content-between mb-1">
|
||||
<span class="fw-bold small">新提现申请</span>
|
||||
<span class="text-muted" style="font-size: 10px;">8小时前</span>
|
||||
</div>
|
||||
<p class="text-muted small mb-0">用户 UID:618120456 申请提现 500 USDT。</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
$content = ob_get_clean();
|
||||
renderAdminPage($content);
|
||||
?>
|
||||
151
admin/layout.php
Normal file
151
admin/layout.php
Normal file
@ -0,0 +1,151 @@
|
||||
<?php
|
||||
require_once __DIR__ . '/../db/config.php';
|
||||
if (session_status() === PHP_SESSION_NONE) session_start();
|
||||
|
||||
// Admin check
|
||||
$user = null;
|
||||
if (isset($_SESSION['user_id'])) {
|
||||
$stmt = db()->prepare("SELECT * FROM users WHERE id = ?");
|
||||
$stmt->execute([$_SESSION['user_id']]);
|
||||
$user = $stmt->fetch();
|
||||
}
|
||||
|
||||
if (!$user || $user['username'] !== 'admin') {
|
||||
header('Location: /auth/login.php');
|
||||
exit;
|
||||
}
|
||||
|
||||
function renderAdminPage($content, $title = '后台管理') {
|
||||
?>
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title><?= $title ?> - Byro Admin</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
|
||||
<style>
|
||||
:root {
|
||||
--sidebar-width: 240px;
|
||||
--header-height: 60px;
|
||||
--bg-color: #f8f9fa;
|
||||
--text-color: #333;
|
||||
--border-color: #dee2e6;
|
||||
}
|
||||
body {
|
||||
background-color: var(--bg-color);
|
||||
color: var(--text-color);
|
||||
font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
|
||||
}
|
||||
.admin-sidebar {
|
||||
width: var(--sidebar-width);
|
||||
height: 100vh;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background: #fff;
|
||||
border-right: 1px solid var(--border-color);
|
||||
z-index: 1000;
|
||||
overflow-y: auto;
|
||||
}
|
||||
.admin-header {
|
||||
height: var(--header-height);
|
||||
background: #fff;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
position: fixed;
|
||||
left: var(--sidebar-width);
|
||||
right: 0;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 24px;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.admin-main {
|
||||
margin-left: var(--sidebar-width);
|
||||
margin-top: var(--header-height);
|
||||
padding: 24px;
|
||||
}
|
||||
.sidebar-logo {
|
||||
height: var(--header-height);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 20px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
font-weight: bold;
|
||||
font-size: 20px;
|
||||
color: #0062ff;
|
||||
}
|
||||
.nav-link {
|
||||
padding: 12px 20px;
|
||||
color: #555;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
text-decoration: none;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
.nav-link:hover, .nav-link.active {
|
||||
background: #f0f7ff;
|
||||
color: #0062ff;
|
||||
}
|
||||
.nav-link i {
|
||||
font-size: 18px;
|
||||
}
|
||||
.card {
|
||||
border: none;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
|
||||
}
|
||||
.table-container {
|
||||
background: #fff;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="admin-sidebar">
|
||||
<div class="sidebar-logo">
|
||||
<i class="bi bi-shield-lock-fill me-2"></i> 管理系统
|
||||
</div>
|
||||
<div class="admin-nav">
|
||||
<a href="/admin/index.php" class="nav-link active"><i class="bi bi-house-door"></i> 首页</a>
|
||||
<a href="/admin/stats.php" class="nav-link"><i class="bi bi-graph-up"></i> 平台数据</a>
|
||||
<a href="/admin/users.php" class="nav-link"><i class="bi bi-people"></i> 玩家管理</a>
|
||||
<a href="/admin/finance.php" class="nav-link"><i class="bi bi-wallet2"></i> 充提管理</a>
|
||||
<a href="/admin/binary.php" class="nav-link"><i class="bi bi-clock"></i> 秒合约管理</a>
|
||||
<a href="/admin/contract.php" class="nav-link"><i class="bi bi-layers"></i> 永续合约</a>
|
||||
<a href="/admin/spot.php" class="nav-link"><i class="bi bi-currency-exchange"></i> 币币交易</a>
|
||||
<a href="/admin/exchange.php" class="nav-link"><i class="bi bi-arrow-left-right"></i> 兑换管理</a>
|
||||
<a href="/admin/mining.php" class="nav-link"><i class="bi bi-cpu"></i> 质押挖矿</a>
|
||||
<a href="/admin/ai_control.php" class="nav-link"><i class="bi bi-robot"></i> AI控盘</a>
|
||||
<a href="/admin/customer_service.php" class="nav-link"><i class="bi bi-headset"></i> 客服管理</a>
|
||||
<a href="/admin/frontend_settings.php" class="nav-link"><i class="bi bi-display"></i> 前端设置</a>
|
||||
<a href="/admin/backend_settings.php" class="nav-link"><i class="bi bi-gear"></i> 后台设置</a>
|
||||
<a href="/admin/profile.php" class="nav-link"><i class="bi bi-person-gear"></i> 个人设置</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="admin-header">
|
||||
<div class="d-flex align-items-center">
|
||||
<h5 class="mb-0"><?= $title ?></h5>
|
||||
</div>
|
||||
<div class="d-flex align-items-center gap-3">
|
||||
<div class="text-muted small">欢迎您, 管理员</div>
|
||||
<a href="/" class="btn btn-sm btn-outline-primary">返回首页</a>
|
||||
<a href="/auth/logout.php" class="btn btn-sm btn-outline-danger">登出</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="admin-main">
|
||||
<?= $content ?>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
1
admin/mining.php
Normal file
1
admin/mining.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
1
admin/profile.php
Normal file
1
admin/profile.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
1
admin/spot.php
Normal file
1
admin/spot.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
1
admin/stats.php
Normal file
1
admin/stats.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
1
admin/users.php
Normal file
1
admin/users.php
Normal file
@ -0,0 +1 @@
|
||||
<?php require_once __DIR__ . '/layout.php'; ob_start(); ?> <div class='card p-5 text-center'><h3 class='text-muted'>正在开发中...</h3><p>此模块即将上线，敬请期待。</p></div> <?php $content = ob_get_clean(); renderAdminPage($content, '模块管理'); ?>
|
||||
53
api/chat.php
Normal file
53
api/chat.php
Normal file
@ -0,0 +1,53 @@
|
||||
<?php
|
||||
session_start();
|
||||
require_once __DIR__ . '/../db/config.php';
|
||||
|
||||
$action = $_GET['action'] ?? '';
|
||||
|
||||
if ($action === 'send_message') {
|
||||
$message = $_POST['message'] ?? '';
|
||||
if (!$message) exit(json_encode(['success' => false]));
|
||||
|
||||
$user_id = $_SESSION['user_id'] ?? 0;
|
||||
$sender = 'user';
|
||||
$ip = $_SERVER['REMOTE_ADDR'];
|
||||
|
||||
$stmt = db()->prepare("INSERT INTO messages (user_id, sender, message, ip_address) VALUES (?, ?, ?, ?)");
|
||||
$stmt->execute([$user_id, $sender, $message, $ip]);
|
||||
echo json_encode(['success' => true]);
|
||||
exit;
|
||||
}
|
||||
|
||||
if ($action === 'get_messages') {
|
||||
$user_id = $_SESSION['user_id'] ?? 0;
|
||||
// For simplicity, we get all messages for this user session or UID
|
||||
// If not logged in, we could use session_id or IP, but let's stick to user_id or all recent for the session
|
||||
$stmt = db()->prepare("SELECT * FROM messages WHERE user_id = ? OR (user_id = 0 AND ip_address = ?) ORDER BY created_at ASC");
|
||||
$stmt->execute([$user_id, $_SERVER['REMOTE_ADDR']]);
|
||||
$messages = $stmt->fetchAll();
|
||||
echo json_encode($messages);
|
||||
exit;
|
||||
}
|
||||
|
||||
if ($action === 'admin_send') {
|
||||
$message = $_POST['message'] ?? '';
|
||||
$user_id = $_POST['user_id'] ?? 0;
|
||||
$target_ip = $_POST['ip_address'] ?? '';
|
||||
|
||||
if (!$message) exit(json_encode(['success' => false]));
|
||||
|
||||
$admin_id = $_SESSION['user_id'] ?? 1; // Default to admin
|
||||
$sender = 'admin';
|
||||
|
||||
$stmt = db()->prepare("INSERT INTO messages (user_id, admin_id, sender, message, ip_address) VALUES (?, ?, ?, ?, ?)");
|
||||
$stmt->execute([$user_id, $admin_id, $sender, $message, $target_ip]);
|
||||
echo json_encode(['success' => true]);
|
||||
exit;
|
||||
}
|
||||
|
||||
if ($action === 'admin_get_all') {
|
||||
// Get distinct users/IPs who have messaged
|
||||
$stmt = db()->query("SELECT m.*, u.username, u.uid FROM messages m LEFT JOIN users u ON m.user_id = u.id WHERE m.id IN (SELECT MAX(id) FROM messages GROUP BY user_id, ip_address) ORDER BY created_at DESC");
|
||||
echo json_encode($stmt->fetchAll());
|
||||
exit;
|
||||
}
|
||||
@ -21,12 +21,32 @@ body {
|
||||
color: var(--text-muted) !important;
|
||||
}
|
||||
|
||||
.text-light {
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
.fs-3, .fs-5, h1, h2, h3, h4 {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.card {
|
||||
background-color: var(--card-bg);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
/* Contrast optimization */
|
||||
.alert {
|
||||
background: rgba(239, 83, 80, 0.1);
|
||||
color: #ef5350;
|
||||
border: 1px solid rgba(239, 83, 80, 0.2);
|
||||
}
|
||||
|
||||
.bg-black {
|
||||
background-color: #000000 !important;
|
||||
}
|
||||
|
||||
|
||||
/* Hero Carousel Optimization */
|
||||
.carousel-item {
|
||||
transition: transform 0.6s ease-in-out;
|
||||
|
||||
@ -7,27 +7,228 @@
|
||||
--term-primary: #0062ff;
|
||||
--term-success: #26a69a;
|
||||
--term-danger: #ef5350;
|
||||
--header-height: 50px;
|
||||
--sidebar-width: 260px;
|
||||
--orderbook-width: 280px;
|
||||
--header-height: 60px;
|
||||
--sidebar-width: 280px;
|
||||
--orderbook-width: 300px;
|
||||
}
|
||||
|
||||
.terminal-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: calc(100vh - 70px);
|
||||
height: 100vh;
|
||||
background: var(--term-bg);
|
||||
color: var(--term-text);
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.terminal-top-nav {
|
||||
height: var(--header-height);
|
||||
.sidebar-tabs {
|
||||
display: flex;
|
||||
height: 60px;
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
background: var(--term-surface);
|
||||
}
|
||||
|
||||
.sidebar-tabs .terminal-tab {
|
||||
flex: 1;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 13px;
|
||||
border-right: 1px solid var(--term-border);
|
||||
color: var(--term-muted);
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.sidebar-tabs .terminal-tab:hover {
|
||||
color: var(--term-text);
|
||||
background: rgba(255,255,255,0.03);
|
||||
}
|
||||
|
||||
.sidebar-tabs .terminal-tab.active {
|
||||
background: var(--term-bg);
|
||||
color: var(--term-primary);
|
||||
border-bottom: 2px solid var(--term-primary);
|
||||
}
|
||||
|
||||
.sidebar-tabs .terminal-tab:last-child {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.sidebar-search {
|
||||
padding: 10px 12px;
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: var(--term-surface);
|
||||
}
|
||||
|
||||
.sidebar-search input {
|
||||
background: #0b0e11;
|
||||
border: 1px solid var(--term-border);
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
height: 38px;
|
||||
padding: 0 12px;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
outline: none;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.content-header {
|
||||
height: 50px;
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0;
|
||||
padding: 0 15px;
|
||||
gap: 20px;
|
||||
background: var(--term-surface);
|
||||
}
|
||||
|
||||
.terminal-sidebar {
|
||||
width: var(--sidebar-width);
|
||||
border-right: 1px solid var(--term-border);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: var(--term-surface);
|
||||
}
|
||||
|
||||
.terminal-right-sidebar {
|
||||
width: var(--orderbook-width);
|
||||
border-left: 1px solid var(--term-border);
|
||||
background: var(--term-surface);
|
||||
}
|
||||
|
||||
|
||||
.sidebar-search input {
|
||||
background: #0b0e11;
|
||||
border: 1px solid var(--term-border);
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
padding: 8px 15px;
|
||||
border-radius: 8px;
|
||||
font-size: 13px;
|
||||
outline: none;
|
||||
transition: border-color 0.2s;
|
||||
}
|
||||
|
||||
.sidebar-search input:focus {
|
||||
border-color: var(--term-primary);
|
||||
}
|
||||
|
||||
/* Order Book Beautification */
|
||||
.order-book {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
font-family: 'Roboto Mono', 'Noto Sans SC', monospace;
|
||||
background: #0b0e11;
|
||||
}
|
||||
|
||||
.ob-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 12px 15px;
|
||||
font-size: 11px;
|
||||
color: #848e9c;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
}
|
||||
|
||||
.ob-list {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.ob-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 2px 15px;
|
||||
font-size: 12px;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.ob-mid-price {
|
||||
padding: 10px 15px;
|
||||
text-align: left;
|
||||
background: rgba(0,0,0,0.4);
|
||||
border-top: 1px solid var(--term-border);
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
}
|
||||
|
||||
.ob-mid-price .val {
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.ob-row:hover {
|
||||
background: rgba(255,255,255,0.05);
|
||||
}
|
||||
|
||||
.ob-row .price { font-weight: 600; z-index: 2; }
|
||||
.asks .price { color: #f6465d; }
|
||||
.bids .price { color: #0ecb81; }
|
||||
.ob-row .amount { color: #eaecef; opacity: 0.9; z-index: 2; }
|
||||
|
||||
.ob-row-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
z-index: 1;
|
||||
opacity: 0.1;
|
||||
transition: width 0.3s ease;
|
||||
}
|
||||
|
||||
.asks .ob-row-bg { background: #f6465d; }
|
||||
.bids .ob-row-bg { background: #0ecb81; }
|
||||
|
||||
.ob-mid-price {
|
||||
padding: 15px;
|
||||
text-align: left;
|
||||
background: rgba(0,0,0,0.3);
|
||||
border-top: 1px solid var(--term-border);
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
}
|
||||
|
||||
.ob-mid-price .val {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
display: block;
|
||||
}
|
||||
|
||||
|
||||
/* Order Panel Records */
|
||||
.order-history table {
|
||||
border-collapse: separate;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
.order-history th {
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
font-size: 10px;
|
||||
letter-spacing: 0.5px;
|
||||
color: var(--term-muted);
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.order-history td {
|
||||
padding: 12px 10px;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.03);
|
||||
}
|
||||
|
||||
.order-history tr:hover td {
|
||||
background: rgba(255,255,255,0.02);
|
||||
}
|
||||
|
||||
.terminal-tab {
|
||||
@ -71,14 +272,17 @@
|
||||
.sidebar-search {
|
||||
padding: 12px;
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.sidebar-search input {
|
||||
background: #2b3139;
|
||||
border: none;
|
||||
border: 1px solid var(--term-border);
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
padding: 8px 12px;
|
||||
padding: 6px 12px;
|
||||
border-radius: 4px;
|
||||
font-size: 13px;
|
||||
outline: none;
|
||||
@ -87,227 +291,138 @@
|
||||
.coin-list-container {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
}
|
||||
.coin-list-container::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.coin-row {
|
||||
padding: 10px 15px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 10px 12px;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.02);
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
||||
.coin-row:hover {
|
||||
background: rgba(255,255,255,0.05);
|
||||
}
|
||||
|
||||
.coin-row .coin-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.coin-row img {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.coin-row .symbol {
|
||||
font-weight: 600;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.coin-row .price {
|
||||
font-size: 13px;
|
||||
text-align: right;
|
||||
font-family: monospace;
|
||||
}
|
||||
|
||||
.coin-row .change {
|
||||
font-size: 11px;
|
||||
display: block;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.coin-row .price {
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.terminal-content {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
background: var(--term-bg);
|
||||
border-right: 1px solid var(--term-border);
|
||||
}
|
||||
|
||||
.content-header {
|
||||
height: 60px;
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 16px;
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.header-pair {
|
||||
font-size: 20px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.header-stat {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.header-stat label {
|
||||
font-size: 11px;
|
||||
color: var(--term-muted);
|
||||
}
|
||||
|
||||
.header-stat span {
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
padding: 0 20px;
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.kline-container {
|
||||
flex: 2;
|
||||
flex: 1;
|
||||
min-height: 400px;
|
||||
background: #000;
|
||||
position: relative;
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
}
|
||||
|
||||
.trading-panels {
|
||||
height: 280px;
|
||||
display: flex;
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
}
|
||||
|
||||
.order-form-container {
|
||||
flex: 1;
|
||||
padding: 16px;
|
||||
border-right: 1px solid var(--term-border);
|
||||
}
|
||||
|
||||
.order-form-tabs {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.order-form-tabs button {
|
||||
background: none;
|
||||
border: none;
|
||||
color: var(--term-muted);
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
padding-bottom: 4px;
|
||||
}
|
||||
|
||||
.order-form-tabs button.active {
|
||||
color: var(--term-text);
|
||||
border-bottom: 2px solid var(--term-primary);
|
||||
}
|
||||
|
||||
.input-group-custom {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.input-group-custom label {
|
||||
display: block;
|
||||
font-size: 11px;
|
||||
color: var(--term-muted);
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.input-wrapper {
|
||||
background: #2b3139;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
.input-wrapper input {
|
||||
background: transparent;
|
||||
border: none;
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
padding: 8px 0;
|
||||
outline: none;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.input-wrapper .suffix {
|
||||
font-size: 12px;
|
||||
color: var(--term-muted);
|
||||
padding: 20px;
|
||||
background: var(--term-surface);
|
||||
}
|
||||
|
||||
.order-history {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
.order-history::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.terminal-right-sidebar {
|
||||
width: var(--orderbook-width);
|
||||
border-left: 1px solid var(--term-border);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: var(--term-surface);
|
||||
}
|
||||
|
||||
.order-book {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.ob-header {
|
||||
padding: 8px 12px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
color: var(--term-muted);
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
}
|
||||
|
||||
.ob-list {
|
||||
flex: 1;
|
||||
/* Binary Order Panel */
|
||||
.cycle-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
gap: 1px;
|
||||
background: var(--term-border);
|
||||
border: 1px solid var(--term-border);
|
||||
border-radius: 4px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ob-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 2px 12px;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
.cycle-btn {
|
||||
background: var(--term-bg);
|
||||
border: none;
|
||||
color: var(--term-muted);
|
||||
padding: 12px 5px;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.ob-row .price { width: 40%; }
|
||||
.ob-row .amount { width: 30%; text-align: right; }
|
||||
.ob-row .total { width: 30%; text-align: right; }
|
||||
|
||||
.asks .price { color: var(--term-danger); }
|
||||
.bids .price { color: var(--term-success); }
|
||||
|
||||
.ob-row-bg {
|
||||
position: absolute;
|
||||
top: 0; right: 0; bottom: 0;
|
||||
z-index: -1;
|
||||
opacity: 0.15;
|
||||
.cycle-btn:hover {
|
||||
background: rgba(255,255,255,0.05);
|
||||
color: var(--term-text);
|
||||
}
|
||||
|
||||
.asks .ob-row-bg { background: var(--term-danger); }
|
||||
.bids .ob-row-bg { background: var(--term-success); }
|
||||
|
||||
.ob-mid-price {
|
||||
padding: 10px 12px;
|
||||
background: rgba(255,255,255,0.02);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
border-top: 1px solid var(--term-border);
|
||||
border-bottom: 1px solid var(--term-border);
|
||||
.cycle-btn.active {
|
||||
background: var(--term-primary);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.ob-mid-price .val { font-size: 18px; font-weight: 700; }
|
||||
.amount-input-wrapper input {
|
||||
height: 50px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 12px;
|
||||
font-weight: 600;
|
||||
color: var(--term-muted);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
.quick-amounts .btn {
|
||||
font-weight: 600;
|
||||
background: #2b3139;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.quick-amounts .btn:hover {
|
||||
background: #3b424c;
|
||||
}
|
||||
|
||||
.binary-order-panel {
|
||||
background: var(--term-surface);
|
||||
border-radius: 12px;
|
||||
}
|
||||
|
||||
.btn-buy { background: var(--term-success); border: none; color: #fff; width: 100%; padding: 10px; border-radius: 4px; font-weight: 700; margin-top: 10px; }
|
||||
.btn-sell { background: var(--term-danger); border: none; color: #fff; width: 100%; padding: 10px; border-radius: 4px; font-weight: 700; margin-top: 10px; }
|
||||
|
||||
BIN
assets/pasted-20260216-030754-d864743b.png
Normal file
BIN
assets/pasted-20260216-030754-d864743b.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
BIN
assets/pasted-20260216-045542-0f5ccd02.png
Normal file
BIN
assets/pasted-20260216-045542-0f5ccd02.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
BIN
assets/pasted-20260216-053957-3eccecf6.png
Normal file
BIN
assets/pasted-20260216-053957-3eccecf6.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
@ -16,7 +16,11 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
$user = $stmt->fetch();
|
||||
|
||||
if ($user && password_verify($password, $user['password_hash'])) {
|
||||
if (session_status() === PHP_SESSION_NONE) session_start();
|
||||
$_SESSION['user_id'] = $user['id'];
|
||||
$_SESSION['username'] = $user['username'];
|
||||
$_SESSION['uid'] = $user['uid'];
|
||||
$_SESSION['role'] = $user['role'];
|
||||
header('Location: /');
|
||||
exit;
|
||||
} else {
|
||||
@ -28,31 +32,53 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
include __DIR__ . '/../includes/header.php';
|
||||
?>
|
||||
|
||||
<div style="max-width: 400px; margin: 100px auto; padding: 40px; background: var(--surface); border-radius: 8px; border: 1px solid var(--border);">
|
||||
<h2 style="margin-bottom: 24px; text-align: center;"><?= __('login') ?></h2>
|
||||
|
||||
<?php if ($error): ?>
|
||||
<div style="background: rgba(239, 83, 80, 0.1); color: var(--danger); padding: 12px; border-radius: 4px; margin-bottom: 20px; font-size: 14px;">
|
||||
<?= $error ?>
|
||||
<div class="container py-5">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-5">
|
||||
<div class="card bg-dark border-0 shadow-lg p-4 p-md-5" style="border-radius: 30px; background: #161a1e !important; border: 1px solid var(--border) !important;">
|
||||
<div class="text-center mb-5">
|
||||
<div class="logo-container d-inline-flex mb-4">
|
||||
<div class="logo-icon p-2" style="width: 45px; height: 45px;">
|
||||
<svg width="28" height="28" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 2L2 7L12 12L22 7L12 2Z" fill="white"/>
|
||||
<path d="M2 17L12 22L22 17" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M2 12L12 17L22 12" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
<span class="logo-text fs-1 ms-2" style="letter-spacing: 2px;">BYRO</span>
|
||||
</div>
|
||||
<h2 class="fw-bold text-white mb-2"><?= __('login') ?></h2>
|
||||
<p class="text-muted">Welcome back to Byro Exchange</p>
|
||||
</div>
|
||||
|
||||
<?php if ($error): ?>
|
||||
<div class="alert alert-danger py-3 px-4 small border-0 bg-danger bg-opacity-10 text-danger rounded-4 mb-4">
|
||||
<i class="bi bi-exclamation-triangle-fill me-2"></i><?= $error ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<form method="POST">
|
||||
<div class="mb-4">
|
||||
<label class="form-label text-muted small fw-bold"><?= __('account') ?? 'Account / Email' ?></label>
|
||||
<input type="text" name="account" class="form-control bg-black border-secondary text-white py-3 px-4 rounded-4" style="background: #0b0e11 !important; border-color: #2b3139 !important;" required>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<div class="d-flex justify-content-between">
|
||||
<label class="form-label text-muted small fw-bold"><?= __('password') ?></label>
|
||||
<a href="#" class="small text-primary text-decoration-none">忘记密码？</a>
|
||||
</div>
|
||||
<input type="password" name="password" class="form-control bg-black border-secondary text-white py-3 px-4 rounded-4" style="background: #0b0e11 !important; border-color: #2b3139 !important;" required>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary w-100 py-3 fw-bold rounded-pill mb-4 shadow-primary"><?= __('login') ?></button>
|
||||
|
||||
<div class="text-center small text-muted">
|
||||
还没有账号？ <a href="/auth/register.php" class="text-primary fw-bold text-decoration-none"><?= __('register') ?></a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<form method="POST">
|
||||
<div style="margin-bottom: 20px;">
|
||||
<label style="display: block; margin-bottom: 8px; font-size: 14px; color: var(--text-muted);">Account / Email</label>
|
||||
<input type="text" name="account" style="width: 100%; padding: 12px; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; color: #fff; box-sizing: border-box;" required>
|
||||
</div>
|
||||
|
||||
<div style="margin-bottom: 24px;">
|
||||
<label style="display: block; margin-bottom: 8px; font-size: 14px; color: var(--text-muted);"><?= __('password') ?></label>
|
||||
<input type="password" name="password" style="width: 100%; padding: 12px; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; color: #fff; box-sizing: border-box;" required>
|
||||
</div>
|
||||
|
||||
<button type="submit" style="width: 100%; padding: 14px; background: var(--primary); border: none; border-radius: 4px; color: #fff; font-weight: bold; cursor: pointer;"><?= __('login') ?></button>
|
||||
</form>
|
||||
|
||||
<div style="margin-top: 24px; text-align: center; font-size: 14px; color: var(--text-muted);">
|
||||
New to OKX? <a href="/auth/register.php" style="color: var(--primary); text-decoration: none;">Create an account</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@ -33,19 +33,26 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
|
||||
} else {
|
||||
try {
|
||||
$hash = password_hash($password, PASSWORD_DEFAULT);
|
||||
$stmt = db()->prepare("INSERT INTO users (username, email, password_hash) VALUES (?, ?, ?)");
|
||||
$uid = '618120' . mt_rand(100000, 999999);
|
||||
$stmt = db()->prepare("INSERT INTO users (username, email, password_hash, uid, credit_score) VALUES (?, ?, ?, ?, ?)");
|
||||
|
||||
$username = strpos($account, '@') === false ? $account : explode('@', $account)[0];
|
||||
$email = strpos($account, '@') !== false ? $account : $account . '@byro.io';
|
||||
|
||||
$stmt->execute([$username, $email, $hash]);
|
||||
$stmt->execute([$username, $email, $hash, $uid, 80]);
|
||||
$userId = db()->lastInsertId();
|
||||
|
||||
if (session_status() === PHP_SESSION_NONE) session_start();
|
||||
$_SESSION['user_id'] = $userId;
|
||||
$_SESSION['username'] = $username;
|
||||
$_SESSION['uid'] = $uid;
|
||||
$_SESSION['role'] = 'user';
|
||||
$_SESSION['credit_score'] = 80;
|
||||
|
||||
// Initialize balance
|
||||
$stmt = db()->prepare("INSERT INTO user_balances (user_id, symbol, available) VALUES (?, 'USDT', 0)");
|
||||
$stmt = db()->prepare("INSERT INTO user_balances (user_id, symbol, available) VALUES (?, 'USDT', 1000)"); // Giving some demo USDT
|
||||
$stmt->execute([$userId]);
|
||||
|
||||
$_SESSION['user_id'] = $userId;
|
||||
header('Location: /');
|
||||
exit;
|
||||
} catch (PDOException $e) {
|
||||
@ -61,52 +68,52 @@ include __DIR__ . '/../includes/header.php';
|
||||
<div class="container py-5">
|
||||
<div class="row justify-content-center">
|
||||
<div class="col-md-5">
|
||||
<div class="card bg-dark border-secondary p-4 p-md-5 shadow-lg">
|
||||
<div class="text-center mb-4">
|
||||
<div class="logo-container d-inline-flex mb-3">
|
||||
<div class="logo-icon">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<div class="card bg-dark border-0 shadow-lg p-4 p-md-5" style="border-radius: 30px; background: #161a1e !important; border: 1px solid var(--border) !important;">
|
||||
<div class="text-center mb-5">
|
||||
<div class="logo-container d-inline-flex mb-4">
|
||||
<div class="logo-icon p-2" style="width: 45px; height: 45px;">
|
||||
<svg width="28" height="28" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 2L2 7L12 12L22 7L12 2Z" fill="white"/>
|
||||
<path d="M2 17L12 22L22 17" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M2 12L12 17L22 12" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
</div>
|
||||
<span class="logo-text fs-2">Byro</span>
|
||||
<span class="logo-text fs-1 ms-2" style="letter-spacing: 2px;">BYRO</span>
|
||||
</div>
|
||||
<h2 class="fw-bold"><?= __('register') ?></h2>
|
||||
<p class="text-muted small">Create your account to start trading</p>
|
||||
<h2 class="fw-bold text-white mb-2"><?= __('register') ?></h2>
|
||||
<p class="text-muted">Join the most secure digital asset exchange</p>
|
||||
</div>
|
||||
|
||||
<?php if ($error): ?>
|
||||
<div class="alert alert-danger py-2 small border-0 bg-danger bg-opacity-10 text-danger">
|
||||
<i class="bi bi-exclamation-triangle me-2"></i><?= $error ?>
|
||||
<div class="alert alert-danger py-3 px-4 small border-0 bg-danger bg-opacity-10 text-danger rounded-4 mb-4">
|
||||
<i class="bi bi-exclamation-triangle-fill me-2"></i><?= $error ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<form method="POST">
|
||||
<div class="mb-3">
|
||||
<label class="form-label text-muted small"><?= __('register') ?> (Account/Email)</label>
|
||||
<input type="text" name="account" class="form-control bg-black border-secondary text-white py-2" required>
|
||||
<label class="form-label text-muted small fw-bold"><?= __('account') ?></label>
|
||||
<input type="text" name="account" class="form-control bg-black border-secondary text-white py-3 px-4 rounded-4" style="background: #0b0e11 !important; border-color: #2b3139 !important;" required>
|
||||
</div>
|
||||
|
||||
<?php if ($email_verify_enabled): ?>
|
||||
<div class="mb-3">
|
||||
<label class="form-label text-muted small"><?= __('email_verify') ?></label>
|
||||
<label class="form-label text-muted small fw-bold"><?= __('email_verify') ?></label>
|
||||
<div class="input-group">
|
||||
<input type="text" name="verify_code" class="form-control bg-black border-secondary text-white">
|
||||
<button class="btn btn-outline-secondary btn-sm" type="button"><?= __('send_code') ?? 'Send Code' ?></button>
|
||||
<input type="text" name="verify_code" class="form-control bg-black border-secondary text-white py-3 px-4 rounded-start-4" style="background: #0b0e11 !important; border-color: #2b3139 !important;">
|
||||
<button class="btn btn-outline-primary px-3 rounded-end-4" type="button"><?= __('send_code') ?></button>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label text-muted small"><?= __('password') ?></label>
|
||||
<input type="password" name="password" class="form-control bg-black border-secondary text-white py-2" required>
|
||||
<label class="form-label text-muted small fw-bold"><?= __('password') ?></label>
|
||||
<input type="password" name="password" class="form-control bg-black border-secondary text-white py-3 px-4 rounded-4" style="background: #0b0e11 !important; border-color: #2b3139 !important;" required>
|
||||
</div>
|
||||
|
||||
<div class="mb-3">
|
||||
<label class="form-label text-muted small"><?= __('confirm_password') ?></label>
|
||||
<input type="password" name="confirm_password" class="form-control bg-black border-secondary text-white py-2" required>
|
||||
<label class="form-label text-muted small fw-bold"><?= __('confirm_password') ?></label>
|
||||
<input type="password" name="confirm_password" class="form-control bg-black border-secondary text-white py-3 px-4 rounded-4" style="background: #0b0e11 !important; border-color: #2b3139 !important;" required>
|
||||
</div>
|
||||
|
||||
<div class="mb-4 form-check small">
|
||||
@ -116,10 +123,10 @@ include __DIR__ . '/../includes/header.php';
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary w-100 py-2 fw-bold mb-3"><?= __('register') ?></button>
|
||||
<button type="submit" class="btn btn-primary w-100 py-3 fw-bold rounded-pill mb-4 shadow-primary"><?= __('register') ?></button>
|
||||
|
||||
<div class="text-center small text-muted">
|
||||
Already have an account? <a href="/auth/login.php" class="text-primary text-decoration-none"><?= __('login') ?></a>
|
||||
已经有账号？ <a href="/auth/login.php" class="text-primary fw-bold text-decoration-none"><?= __('login') ?></a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
16
create_admin.php
Normal file
16
create_admin.php
Normal file
@ -0,0 +1,16 @@
|
||||
<?php
|
||||
require_once __DIR__ . '/db/config.php';
|
||||
|
||||
try {
|
||||
$username = 'admin';
|
||||
$password = 'admin123';
|
||||
$hash = password_hash($password, PASSWORD_DEFAULT);
|
||||
$uid = '618120001';
|
||||
|
||||
$stmt = db()->prepare("INSERT INTO users (username, email, password_hash, uid, role, credit_score) VALUES (?, ?, ?, ?, ?, ?)");
|
||||
$stmt->execute([$username, 'admin@byro.io', $hash, $uid, 'admin', 100]);
|
||||
|
||||
echo "Admin user created successfully with password: admin123\n";
|
||||
} catch (Exception $e) {
|
||||
echo "Error or Admin already exists: " . $e->getMessage() . "\n";
|
||||
}
|
||||
@ -69,6 +69,122 @@
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Customer Service Widget -->
|
||||
<div id="cs-widget" style="position: fixed; bottom: 30px; right: 30px; z-index: 9999;">
|
||||
<button class="btn btn-primary rounded-circle shadow-lg p-0 d-flex align-items-center justify-content-center transition-all" id="cs-toggle" style="width: 70px; height: 70px; border: none; background: linear-gradient(135deg, #00c6ff, #0072ff); box-shadow: 0 10px 20px rgba(0, 114, 255, 0.4);">
|
||||
<img src="https://img.icons8.com/fluency/96/service.png" alt="Support" style="width: 45px; height: 45px;">
|
||||
</button>
|
||||
<div class="pulse-ring"></div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.pulse-ring {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
background: #0062ff;
|
||||
opacity: 0.5;
|
||||
animation: pulse 2s infinite;
|
||||
z-index: -1;
|
||||
}
|
||||
@keyframes pulse {
|
||||
0% { transform: scale(1); opacity: 0.5; }
|
||||
100% { transform: scale(1.5); opacity: 0; }
|
||||
}
|
||||
#cs-toggle:hover {
|
||||
transform: scale(1.1) rotate(5deg);
|
||||
box-shadow: 0 10px 25px rgba(0, 98, 255, 0.4) !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div id="cs-box" class="bg-surface border border-secondary shadow-lg d-none" style="position: fixed; bottom: 100px; right: 30px; width: 350px; height: 500px; border-radius: 20px; z-index: 9999; display: flex; flex-direction: column; overflow: hidden; background: #161a1e;">
|
||||
<div class="bg-primary p-3 d-flex justify-content-between align-items-center text-white">
|
||||
<div class="d-flex align-items-center gap-2">
|
||||
<div class="bg-white rounded-circle" style="width: 10px; height: 10px;"></div>
|
||||
<span class="fw-bold">Online Support</span>
|
||||
</div>
|
||||
<button class="btn btn-sm text-white border-0" id="cs-close"><i class="bi bi-x-lg"></i></button>
|
||||
</div>
|
||||
<div id="cs-messages" class="flex-grow-1 p-3 overflow-y-auto" style="scrollbar-width: none;">
|
||||
<div class="text-center text-muted small mb-3">Welcome to Byro Support! How can we help?</div>
|
||||
</div>
|
||||
<div class="p-3 border-top border-secondary bg-black bg-opacity-20">
|
||||
<form id="cs-form" class="d-flex gap-2">
|
||||
<input type="text" id="cs-input" class="form-control form-control-sm bg-dark border-secondary text-white" placeholder="Type a message...">
|
||||
<button type="submit" class="btn btn-primary btn-sm px-3"><i class="bi bi-send-fill"></i></button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const csToggle = document.getElementById('cs-toggle');
|
||||
const csBox = document.getElementById('cs-box');
|
||||
const csClose = document.getElementById('cs-close');
|
||||
const csForm = document.getElementById('cs-form');
|
||||
const csInput = document.getElementById('cs-input');
|
||||
const csMessages = document.getElementById('cs-messages');
|
||||
|
||||
csToggle.addEventListener('click', () => {
|
||||
csBox.classList.toggle('d-none');
|
||||
scrollToBottom();
|
||||
});
|
||||
|
||||
csClose.addEventListener('click', () => csBox.classList.add('d-none'));
|
||||
|
||||
function scrollToBottom() {
|
||||
csMessages.scrollTop = csMessages.scrollHeight;
|
||||
}
|
||||
|
||||
csForm.addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
const msg = csInput.value.trim();
|
||||
if (!msg) return;
|
||||
|
||||
appendMessage('user', msg);
|
||||
csInput.value = '';
|
||||
|
||||
try {
|
||||
await fetch('/api/chat.php?action=send_message', {
|
||||
method: 'POST',
|
||||
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
|
||||
body: `message=${encodeURIComponent(msg)}`
|
||||
});
|
||||
} catch (err) {
|
||||
console.error('Failed to send message:', err);
|
||||
}
|
||||
});
|
||||
|
||||
function appendMessage(sender, text) {
|
||||
const div = document.createElement('div');
|
||||
div.className = `mb-2 d-flex ${sender === 'user' ? 'justify-content-end' : 'justify-content-start'}`;
|
||||
div.innerHTML = `
|
||||
<div class="p-2 px-3 rounded-4 small ${sender === 'user' ? 'bg-primary text-white' : 'bg-dark text-muted border border-secondary'}" style="max-width: 80%;">
|
||||
${text}
|
||||
</div>
|
||||
`;
|
||||
csMessages.appendChild(div);
|
||||
scrollToBottom();
|
||||
}
|
||||
|
||||
// Polling for new messages
|
||||
let lastCount = 0;
|
||||
setInterval(async () => {
|
||||
if (csBox.classList.contains('d-none')) return;
|
||||
try {
|
||||
const resp = await fetch('/api/chat.php?action=get_messages');
|
||||
const data = await resp.json();
|
||||
if (data && data.length > lastCount) {
|
||||
csMessages.innerHTML = '<div class="text-center text-muted small mb-3">Welcome to Byro Support! How can we help?</div>';
|
||||
data.forEach(m => appendMessage(m.sender, m.message));
|
||||
lastCount = data.length;
|
||||
}
|
||||
} catch (err) {}
|
||||
}, 3000);
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.bg-darker {
|
||||
background-color: #080808;
|
||||
@ -76,6 +192,7 @@
|
||||
footer a:hover {
|
||||
color: var(--primary) !important;
|
||||
}
|
||||
#cs-messages::-webkit-scrollbar { display: none; }
|
||||
</style>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -26,6 +26,7 @@ function getSetting($key, $default = null) {
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
|
||||
<link rel="stylesheet" href="/assets/css/style.css?v=<?= time() ?>">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;700;900&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
:root {
|
||||
--primary: #0062ff;
|
||||
@ -40,7 +41,7 @@ function getSetting($key, $default = null) {
|
||||
body {
|
||||
background-color: var(--bg);
|
||||
color: var(--text);
|
||||
font-family: 'Inter', system-ui, -apple-system, sans-serif;
|
||||
font-family: 'Noto Sans SC', 'Inter', system-ui, -apple-system, sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
@ -169,6 +170,101 @@ function getSetting($key, $default = null) {
|
||||
.btn-register:hover {
|
||||
background: #0056e0;
|
||||
}
|
||||
|
||||
/* User Dropdown */
|
||||
.user-center {
|
||||
position: relative;
|
||||
}
|
||||
.profile-trigger {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
color: var(--text);
|
||||
text-decoration: none;
|
||||
padding: 8px 12px;
|
||||
border-radius: 8px;
|
||||
transition: background 0.2s;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
.profile-trigger:hover {
|
||||
background: rgba(255,255,255,0.05);
|
||||
border-color: var(--border);
|
||||
color: var(--primary);
|
||||
}
|
||||
.user-dropdown {
|
||||
display: none;
|
||||
position: absolute;
|
||||
top: calc(100% + 10px);
|
||||
right: 0;
|
||||
background: #1e2329;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 12px;
|
||||
width: 260px;
|
||||
padding: 16px;
|
||||
box-shadow: 0 10px 40px rgba(0,0,0,0.8);
|
||||
z-index: 1200;
|
||||
}
|
||||
.user-center:hover .user-dropdown {
|
||||
display: block;
|
||||
}
|
||||
.user-info-header {
|
||||
padding-bottom: 12px;
|
||||
border-bottom: 1px solid var(--border);
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.uid-tag {
|
||||
font-size: 12px;
|
||||
color: var(--text-muted);
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
.user-stats {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
font-size: 13px;
|
||||
}
|
||||
.stat-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.stat-label { color: var(--text-muted); }
|
||||
.stat-value { color: var(--text); font-weight: 500; }
|
||||
.stat-value.success { color: var(--success); }
|
||||
|
||||
.dropdown-links {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 8px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.dropdown-links a {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 6px;
|
||||
padding: 10px;
|
||||
background: rgba(255,255,255,0.05);
|
||||
border-radius: 8px;
|
||||
font-size: 13px;
|
||||
color: var(--text);
|
||||
text-decoration: none;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
.dropdown-links a:hover {
|
||||
background: var(--primary);
|
||||
color: #fff;
|
||||
}
|
||||
.logout-link {
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin-top: 16px;
|
||||
padding-top: 12px;
|
||||
border-top: 1px solid var(--border);
|
||||
color: var(--danger);
|
||||
text-decoration: none;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
@ -214,8 +310,44 @@ function getSetting($key, $default = null) {
|
||||
</div>
|
||||
<?php if ($user): ?>
|
||||
<div class="user-center">
|
||||
<a href="/profile.php" class="btn btn-outline-light btn-sm me-2"><i class="bi bi-person-circle me-1"></i> <?= __('personal') ?></a>
|
||||
<a href="/auth/logout.php" class="btn btn-link btn-sm text-muted text-decoration-none"><?= __('logout') ?></a>
|
||||
<a href="/profile.php" class="profile-trigger">
|
||||
<i class="bi bi-person-circle fs-5"></i>
|
||||
<span><?= htmlspecialchars($user['username']) ?></span>
|
||||
</a>
|
||||
<div class="user-dropdown">
|
||||
<div class="user-info-header">
|
||||
<div class="uid-tag">UID: <?= $user['uid'] ?? 'N/A' ?></div>
|
||||
<div class="fw-bold"><?= htmlspecialchars($user['username']) ?></div>
|
||||
</div>
|
||||
<div class="user-stats">
|
||||
<div class="stat-item">
|
||||
<span class="stat-label"><?= __('real_name') ?? 'Real-name' ?></span>
|
||||
<span class="stat-value <?= ($user['real_name_status'] ?? 0) ? 'success' : 'text-warning' ?>">
|
||||
<?= ($user['real_name_status'] ?? 0) ? (__('verified') ?? 'Verified') : (__('unverified') ?? 'Unverified') ?>
|
||||
</span>
|
||||
</div>
|
||||
<div class="stat-item">
|
||||
<span class="stat-label"><?= __('credit_score') ?? 'Credit Score' ?></span>
|
||||
<span class="stat-value text-primary"><?= $user['credit_score'] ?? 80 ?></span>
|
||||
</div>
|
||||
<?php
|
||||
$stmt = db()->prepare("SELECT available FROM user_balances WHERE user_id = ? AND symbol = 'USDT'");
|
||||
$stmt->execute([$user['id']]);
|
||||
$bal = $stmt->fetch();
|
||||
?>
|
||||
<div class="stat-item">
|
||||
<span class="stat-label"><?= __('assets') ?? 'Assets' ?></span>
|
||||
<span class="stat-value"><?= number_format($bal['available'] ?? 0, 2) ?> USDT</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dropdown-links">
|
||||
<a href="/profile.php"><i class="bi bi-person"></i> <?= __('personal') ?></a>
|
||||
<a href="/recharge.php"><i class="bi bi-wallet2"></i> <?= __('recharge') ?? 'Deposit' ?></a>
|
||||
<a href="/withdraw.php"><i class="bi bi-cash-stack"></i> <?= __('withdraw') ?? 'Withdraw' ?></a>
|
||||
<a href="/orders.php"><i class="bi bi-list-check"></i> <?= __('orders') ?? 'Orders' ?></a>
|
||||
</div>
|
||||
<a href="/auth/logout.php" class="logout-link"><?= __('logout') ?></a>
|
||||
</div>
|
||||
</div>
|
||||
<?php else: ?>
|
||||
<div class="auth-btns">
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<?php
|
||||
session_start();
|
||||
|
||||
$lang = $_SESSION['lang'] ?? 'zh';
|
||||
$lang = $_SESSION['lang'] ?? 'en';
|
||||
if (isset($_GET['lang'])) {
|
||||
$lang = $_GET['lang'] === 'en' ? 'en' : 'zh';
|
||||
$lang = $_GET['lang'] === 'zh' ? 'zh' : 'en';
|
||||
$_SESSION['lang'] = $lang;
|
||||
}
|
||||
|
||||
@ -78,6 +78,50 @@ $translations = [
|
||||
'news_content' => 'Byro 每日更新全球加密市场动态，包括最新的上币信息、行业动态、深度分析报告，助您掌握财富密码。',
|
||||
'fees_content' => 'Byro 致力于提供行业极具竞争力的费率标准。现货交易手续费低至 0.1%，根据您的交易量等级，还可以享受更大幅度的费率折扣。',
|
||||
'app_desc' => '随时随地，尽在掌握。下载 Byro 移动端，体验专业级交易。',
|
||||
'real_name' => '实名认证',
|
||||
'verified' => '已认证',
|
||||
'unverified' => '未认证',
|
||||
'credit_score' => '信用分',
|
||||
'recharge' => '充值',
|
||||
'orders' => '订单记录',
|
||||
'account' => '账号 / 邮箱',
|
||||
'market_view' => '市场行情',
|
||||
'sec_contract' => '秒合约',
|
||||
'secure_acc' => '保障账户安全',
|
||||
'from' => '从',
|
||||
'to' => '到',
|
||||
'balance' => '余额',
|
||||
'swap_now' => '立即兑换',
|
||||
'rate' => '汇率',
|
||||
'price_impact' => '价格影响',
|
||||
'slippage' => '滑点容差',
|
||||
'mining_title' => '专业矿池',
|
||||
'mining_desc' => '专业的云挖矿和质押平台。加入数千名用户，通过 Byro 的高效挖矿池赚取被动收入。',
|
||||
'est_apy' => '预计年化',
|
||||
'min_deposit' => '最低充值',
|
||||
'lock_period' => '锁定周期',
|
||||
'start_mining' => '开始挖矿',
|
||||
'why_mining' => '为什么选择 Byro 挖矿？',
|
||||
'adv_hardware' => '先进硬件',
|
||||
'adv_hardware_desc' => '我们使用最新的 ASIC 和 GPU 矿机，确保最高利润 and 稳定性。',
|
||||
'auto_compound' => '自动复利',
|
||||
'auto_compound_desc' => '自动重新投资您的每日奖励，以实现长期收益最大化。',
|
||||
'real_time_monitor' => '实时监控',
|
||||
'real_time_monitor_desc' => '通过我们直观的控制面板实时跟踪您的算力和收益。',
|
||||
'calc_profit' => '计算您的收益',
|
||||
'calc_desc' => '输入您的投资金额以估算每日收益。',
|
||||
'daily_profit' => '每日收益',
|
||||
'monthly_profit' => '每月收益',
|
||||
'try_calc' => '尝试挖矿计算器',
|
||||
'asset' => '资产',
|
||||
'vol_24h' => '24h 成交额',
|
||||
'cycle_settlement' => '周期/结算',
|
||||
'purchase_amount' => '买入量',
|
||||
'available_balance' => '可以金额',
|
||||
'expected_profit' => '预期收益',
|
||||
'buy_up' => '买涨',
|
||||
'buy_down' => '买跌',
|
||||
'profit' => '收益',
|
||||
],
|
||||
'en' => [
|
||||
'home' => 'Home',
|
||||
@ -149,6 +193,50 @@ $translations = [
|
||||
'news_content' => 'Byro updates daily global crypto market dynamics, including the latest listing info, industry trends, and in-depth analysis reports to help you master wealth opportunities.',
|
||||
'fees_content' => 'Byro is committed to providing industry-competitive fee standards. Spot trading fees as low as 0.1%, with deeper discounts based on your trading volume tier.',
|
||||
'app_desc' => 'Anytime, anywhere, at your fingertips. Download Byro mobile app for professional trading experience.',
|
||||
'real_name' => 'Real-name',
|
||||
'verified' => 'Verified',
|
||||
'unverified' => 'Unverified',
|
||||
'credit_score' => 'Credit Score',
|
||||
'recharge' => 'Recharge',
|
||||
'orders' => 'Orders',
|
||||
'account' => 'Account / Email',
|
||||
'market_view' => 'Market View',
|
||||
'sec_contract' => 'Second Contract',
|
||||
'secure_acc' => 'Secure My Account',
|
||||
'from' => 'From',
|
||||
'to' => 'To',
|
||||
'balance' => 'Balance',
|
||||
'swap_now' => 'Swap Now',
|
||||
'rate' => 'Rate',
|
||||
'price_impact' => 'Price Impact',
|
||||
'slippage' => 'Slippage Tolerance',
|
||||
'mining_title' => 'Mining Pool',
|
||||
'mining_desc' => 'Professional cloud mining and staking platform. Join thousands of users earning passive income with Byro\'s high-efficiency mining pools.',
|
||||
'est_apy' => 'Est. APY',
|
||||
'min_deposit' => 'Min. Deposit',
|
||||
'lock_period' => 'Lock Period',
|
||||
'start_mining' => 'Start Mining',
|
||||
'why_mining' => 'Why choose Byro Mining?',
|
||||
'adv_hardware' => 'Advanced Hardware',
|
||||
'adv_hardware_desc' => 'We use the latest ASIC and GPU miners to ensure maximum profitability and stability.',
|
||||
'auto_compound' => 'Auto Compounding',
|
||||
'auto_compound_desc' => 'Reinvest your daily rewards automatically to maximize your total yield over time.',
|
||||
'real_time_monitor' => 'Real-time Monitoring',
|
||||
'real_time_monitor_desc' => 'Track your hash rate and earnings in real-time through our intuitive dashboard.',
|
||||
'calc_profit' => 'Calculate Your Profit',
|
||||
'calc_desc' => 'Enter your investment amount to estimate your daily earnings.',
|
||||
'daily_profit' => 'Daily Profit',
|
||||
'monthly_profit' => 'Monthly Profit',
|
||||
'try_calc' => 'Try Mining Calculator',
|
||||
'asset' => 'Asset',
|
||||
'vol_24h' => '24h Volume',
|
||||
'cycle_settlement' => 'Cycle / Settlement',
|
||||
'purchase_amount' => 'Purchase Amount',
|
||||
'available_balance' => 'Available Balance',
|
||||
'expected_profit' => 'Expected Profit',
|
||||
'buy_up' => 'Buy Up',
|
||||
'buy_down' => 'Buy Down',
|
||||
'profit' => 'Profit',
|
||||
]
|
||||
];
|
||||
|
||||
@ -156,3 +244,32 @@ function __($key) {
|
||||
global $translations, $lang;
|
||||
return $translations[$lang][$key] ?? $key;
|
||||
}
|
||||
|
||||
function getCoinIcon($symbol) {
|
||||
$icon_ids = [
|
||||
'BTC' => '1/small/bitcoin.png',
|
||||
'ETH' => '279/small/ethereum.png',
|
||||
'USDT' => '325/small/tether.png',
|
||||
'BNB' => '825/small/binance-coin-logo.png',
|
||||
'SOL' => '4128/small/solana.png',
|
||||
'XRP' => '44/small/xrp-symbol-white-128.png',
|
||||
'ADA' => '975/small/cardano.png',
|
||||
'DOGE' => '5/small/dogecoin.png',
|
||||
'DOT' => '12171/small/polkadot.png',
|
||||
'MATIC' => '4713/small/matic-network.png',
|
||||
'AVAX' => '12559/small/avalanche.png',
|
||||
'LINK' => '877/small/chainlink.png',
|
||||
'SHIB' => '11939/small/shiba-inu.png',
|
||||
'TRX' => '1094/small/tron.png',
|
||||
'BCH' => '153/small/bitcoin-cash.png',
|
||||
'LTC' => '2/small/litecoin.png',
|
||||
'UNI' => '12504/small/uniswap.png',
|
||||
'ARB' => '29359/small/arbitrum.png',
|
||||
'OP' => '25244/small/optimism.png',
|
||||
'APT' => '27355/small/aptos.png',
|
||||
'USDC' => '6319/small/usdc.png',
|
||||
'PEPE' => '31386/small/pepe.png',
|
||||
];
|
||||
$id = $icon_ids[strtoupper($symbol)] ?? '1/small/bitcoin.png';
|
||||
return "https://assets.coingecko.com/coins/images/" . $id;
|
||||
}
|
||||
|
||||
@ -1,141 +1,287 @@
|
||||
<?php
|
||||
function renderTerminal($activeTab = 'spot') {
|
||||
global $lang;
|
||||
$coins = [
|
||||
['symbol' => 'BTC', 'name' => 'Bitcoin', 'id' => '1/small/bitcoin.png', 'price' => '64,234.50', 'change' => '+2.45%'],
|
||||
['symbol' => 'ETH', 'name' => 'Ethereum', 'id' => '279/small/ethereum.png', 'price' => '3,456.20', 'change' => '+1.12%'],
|
||||
['symbol' => 'BNB', 'name' => 'BNB', 'id' => '825/small/binance-coin-logo.png', 'price' => '598.40', 'change' => '-0.56%'],
|
||||
['symbol' => 'SOL', 'name' => 'Solana', 'id' => '4128/small/solana.png', 'price' => '145.20', 'change' => '+5.67%'],
|
||||
['symbol' => 'XRP', 'name' => 'Ripple', 'id' => '44/small/xrp-symbol-white-128.png', 'price' => '0.62', 'change' => '-1.23%'],
|
||||
['symbol' => 'ADA', 'name' => 'Cardano', 'id' => '975/small/cardano.png', 'price' => '0.58', 'change' => '+0.89%'],
|
||||
['symbol' => 'DOGE', 'name' => 'Dogecoin', 'id' => '5/small/dogecoin.png', 'price' => '0.16', 'change' => '+12.4%'],
|
||||
['symbol' => 'DOT', 'name' => 'Polkadot', 'id' => '12171/small/polkadot.png', 'price' => '8.45', 'change' => '-2.11%'],
|
||||
['symbol' => 'MATIC', 'name' => 'Polygon', 'id' => '4713/small/matic-network.png', 'price' => '0.92', 'change' => '+1.56%'],
|
||||
['symbol' => 'LINK', 'name' => 'Chainlink', 'id' => '877/small/chainlink.png', 'price' => '18.40', 'change' => '+3.22%'],
|
||||
global $lang, $user;
|
||||
$currentSymbol = $_GET['symbol'] ?? 'BTC';
|
||||
$currentSymbol = strtoupper($currentSymbol);
|
||||
|
||||
$full_coins = [
|
||||
['symbol' => 'BTC', 'name' => 'Bitcoin', 'price' => '64,234.50', 'change' => '+2.45%'],
|
||||
['symbol' => 'ETH', 'name' => 'Ethereum', 'price' => '3,456.20', 'change' => '+1.12%'],
|
||||
['symbol' => 'USDT', 'name' => 'Tether', 'price' => '1.00', 'change' => '+0.01%'],
|
||||
['symbol' => 'BNB', 'name' => 'BNB', 'price' => '598.40', 'change' => '-0.56%'],
|
||||
['symbol' => 'SOL', 'name' => 'Solana', 'price' => '145.20', 'change' => '+5.67%'],
|
||||
['symbol' => 'XRP', 'name' => 'Ripple', 'price' => '0.62', 'change' => '-1.23%'],
|
||||
['symbol' => 'ADA', 'name' => 'Cardano', 'price' => '0.58', 'change' => '+0.89%'],
|
||||
['symbol' => 'DOGE', 'name' => 'Dogecoin', 'price' => '0.16', 'change' => '+12.4%'],
|
||||
['symbol' => 'DOT', 'name' => 'Polkadot', 'price' => '8.45', 'change' => '-2.11%'],
|
||||
['symbol' => 'MATIC', 'name' => 'Polygon', 'price' => '0.92', 'change' => '+1.56%'],
|
||||
['symbol' => 'LINK', 'name' => 'Chainlink', 'price' => '18.40', 'change' => '+3.22%'],
|
||||
['symbol' => 'AVAX', 'name' => 'Avalanche', 'price' => '45.20', 'change' => '+4.12%'],
|
||||
['symbol' => 'SHIB', 'name' => 'Shiba Inu', 'price' => '0.000027', 'change' => '-3.45%'],
|
||||
['symbol' => 'TRX', 'name' => 'TRON', 'price' => '0.12', 'change' => '+0.56%'],
|
||||
['symbol' => 'BCH', 'name' => 'Bitcoin Cash', 'price' => '456.20', 'change' => '+2.12%'],
|
||||
['symbol' => 'LTC', 'name' => 'Litecoin', 'price' => '84.50', 'change' => '+1.45%'],
|
||||
['symbol' => 'UNI', 'name' => 'Uniswap', 'price' => '7.20', 'change' => '-2.12%'],
|
||||
];
|
||||
?>
|
||||
<link rel="stylesheet" href="/assets/css/terminal.css?v=<?= time() ?>">
|
||||
<div class="terminal-container">
|
||||
<!-- Top Nav Tabs -->
|
||||
<div class="terminal-top-nav">
|
||||
<a href="/binary.php" class="terminal-tab <?= $activeTab === 'binary' ? 'active' : '' ?>"><?= __('second_contract') ?></a>
|
||||
<a href="/trade.php" class="terminal-tab <?= $activeTab === 'spot' ? 'active' : '' ?>"><?= __('spot') ?></a>
|
||||
<a href="/contract.php" class="terminal-tab <?= $activeTab === 'contract' ? 'active' : '' ?>"><?= __('contract') ?></a>
|
||||
</div>
|
||||
|
||||
<div class="terminal-main">
|
||||
<!-- Left Sidebar -->
|
||||
<div class="terminal-sidebar">
|
||||
<!-- Top Nav Tabs moved here for alignment -->
|
||||
<div class="terminal-top-nav sidebar-tabs">
|
||||
<a href="/binary.php?symbol=<?= $currentSymbol ?>" class="terminal-tab <?= $activeTab === 'binary' ? 'active' : '' ?>"><?= __('sec_contract') ?></a>
|
||||
<a href="/trade.php?symbol=<?= $currentSymbol ?>" class="terminal-tab <?= $activeTab === 'spot' ? 'active' : '' ?>"><?= __('spot') ?></a>
|
||||
<a href="/contract.php?symbol=<?= $currentSymbol ?>" class="terminal-tab <?= $activeTab === 'contract' ? 'active' : '' ?>"><?= __('contract') ?></a>
|
||||
</div>
|
||||
<div class="sidebar-search">
|
||||
<input type="text" placeholder="<?= __('coin') ?> / USDT">
|
||||
<input type="text" placeholder="<?= __('search') ?? 'Search' ?> / USDT" class="shadow-sm">
|
||||
</div>
|
||||
<div class="coin-list-container">
|
||||
<?php foreach ($coins as $c): ?>
|
||||
<div class="coin-row">
|
||||
<div class="coin-info">
|
||||
<img src="https://assets.coingecko.com/coins/images/<?= $c['id'] ?>" alt="<?= $c['symbol'] ?>">
|
||||
<div>
|
||||
<span class="symbol"><?= $c['symbol'] ?></span>
|
||||
<span class="change <?= strpos($c['change'], '+') !== false ? 'text-success' : 'text-danger' ?>"><?= $c['change'] ?></span>
|
||||
<?php
|
||||
foreach ($full_coins as $c): ?>
|
||||
<div class="coin-row <?= $c['symbol'] === $currentSymbol ? 'active' : '' ?>" onclick="location.href='?symbol=<?= $c['symbol'] ?>'">
|
||||
<div class="d-flex align-items-center">
|
||||
<div class="bg-light p-1 rounded-circle me-2" style="width: 24px; height: 24px; display: flex; align-items: center; justify-content: center;">
|
||||
<img src="<?= getCoinIcon($c['symbol']) ?>" alt="<?= $c['symbol'] ?>" style="width: 18px; height: 18px; margin: 0;">
|
||||
</div>
|
||||
<div>
|
||||
<div class="symbol fw-bold text-white"><?= $c['symbol'] ?></div>
|
||||
<div class="change <?= strpos($c['change'], '+') !== false ? 'text-success' : 'text-danger' ?>" style="font-size: 10px;"><?= $c['change'] ?></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="price fw-bold text-white"><?= $c['price'] ?></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="price"><?= $c['price'] ?></div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Center Content -->
|
||||
<div class="terminal-content">
|
||||
<div class="content-header">
|
||||
<div class="header-pair">BTC/USDT</div>
|
||||
<div class="header-pair fw-bold fs-5 text-white"><?= $currentSymbol ?>/USDT</div>
|
||||
<div class="header-stat">
|
||||
<label><?= __('last_price') ?></label>
|
||||
<span class="text-success">64,234.50</span>
|
||||
<span class="text-success price-jump fw-bold">64,234.50</span>
|
||||
</div>
|
||||
<div class="header-stat">
|
||||
<label>24h <?= __('change_24h') ?></label>
|
||||
<span class="text-success">+2.45%</span>
|
||||
<span class="text-success fw-bold">+2.45%</span>
|
||||
</div>
|
||||
<div class="header-stat">
|
||||
<div class="header-stat d-none d-md-flex">
|
||||
<label>24h High</label>
|
||||
<span>65,120.00</span>
|
||||
<span class="text-white">65,120.00</span>
|
||||
</div>
|
||||
<div class="header-stat">
|
||||
<div class="header-stat d-none d-md-flex">
|
||||
<label>24h Low</label>
|
||||
<span>63,450.00</span>
|
||||
<span class="text-white">63,450.00</span>
|
||||
</div>
|
||||
<div class="header-stat d-none d-lg-flex">
|
||||
<label>24h <?= __('vol_24h') ?></label>
|
||||
<span class="text-white fw-bold bg-dark px-2 rounded" style="background: rgba(255,255,255,0.05) !important;">12,456.23</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="kline-container">
|
||||
<!-- Simulation of K-line -->
|
||||
<div id="tradingview_widget" style="height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; background: #000;">
|
||||
<span style="color: #333; font-size: 24px; font-weight: bold;">TRADING VIEW CHART</span>
|
||||
<!-- TradingView Widget BEGIN -->
|
||||
<div class="tradingview-widget-container" style="height:100%;width:100%">
|
||||
<div id="tradingview_54321" style="height:100%;width:100%"></div>
|
||||
<script type="text/javascript" src="https://s3.tradingview.com/tv.js"></script>
|
||||
<script type="text/javascript">
|
||||
new TradingView.widget(
|
||||
{
|
||||
"autosize": true,
|
||||
"symbol": "BINANCE:<?= $currentSymbol ?>USDT",
|
||||
"interval": "D",
|
||||
"timezone": "Etc/UTC",
|
||||
"theme": "dark",
|
||||
"style": "1",
|
||||
"locale": "<?= $lang === 'zh' ? 'zh_CN' : 'en' ?>",
|
||||
"toolbar_bg": "#f1f3f6",
|
||||
"enable_publishing": false,
|
||||
"hide_side_toolbar": false,
|
||||
"allow_symbol_change": true,
|
||||
"container_id": "tradingview_54321"
|
||||
}
|
||||
);
|
||||
</script>
|
||||
</div>
|
||||
<!-- TradingView Widget END -->
|
||||
</div>
|
||||
|
||||
<div class="trading-panels">
|
||||
<div class="order-form-container">
|
||||
<div class="order-form-tabs">
|
||||
<button class="active">Limit</button>
|
||||
<button>Market</button>
|
||||
<?php if ($activeTab === 'binary'): ?>
|
||||
<div class="binary-order-panel w-100">
|
||||
<div class="section-title mb-2"><?= __('cycle_settlement') ?? 'Cycle / Settlement' ?></div>
|
||||
<div class="cycle-grid mb-3">
|
||||
<button class="cycle-btn active" onclick="selectCycle(this, 60, 8, '100-4999')">60S/8%</button>
|
||||
<button class="cycle-btn" onclick="selectCycle(this, 90, 12, '5000-29999')">90S/12%</button>
|
||||
<button class="cycle-btn" onclick="selectCycle(this, 120, 15, '30000-99999')">120S/15%</button>
|
||||
<button class="cycle-btn" onclick="selectCycle(this, 180, 20, '100000-299999')">180S/20%</button>
|
||||
<button class="cycle-btn" onclick="selectCycle(this, 300, 30, '300000+')">300S/30%</button>
|
||||
</div>
|
||||
<div class="row g-3">
|
||||
|
||||
<div class="section-title mb-2"><?= __('purchase_amount') ?? 'Purchase Amount' ?> (USDT)</div>
|
||||
<div class="amount-input-wrapper mb-3">
|
||||
<input type="number" id="binary-amount" class="form-control bg-black text-white border-secondary" placeholder="100-4999" oninput="calculateProfit()">
|
||||
</div>
|
||||
|
||||
<div class="quick-amounts d-flex gap-2 mb-3">
|
||||
<?php foreach([10, 50, 100, 300, 500, 1000] as $amt): ?>
|
||||
<button class="btn btn-dark btn-sm flex-fill" onclick="setBinaryAmount(<?= $amt ?>)"><?= $amt ?></button>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
|
||||
<div class="d-flex justify-content-between mb-3 small align-items-center">
|
||||
<div class="text-muted"><?= __('available_balance') ?> <span class="text-white ms-1 fw-bold">1,000.00</span> USDT</div>
|
||||
<div class="text-muted"><span class="text-success fw-bold fs-6" id="profit-display">0.00</span> USDT</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-2">
|
||||
<div class="col-6">
|
||||
<div class="input-group-custom">
|
||||
<label>Buy Price</label>
|
||||
<div class="input-wrapper">
|
||||
<input type="number" value="64234.50">
|
||||
<span class="suffix">USDT</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-group-custom">
|
||||
<label>Amount</label>
|
||||
<div class="input-wrapper">
|
||||
<input type="number" placeholder="0.00">
|
||||
<span class="suffix">BTC</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn-buy">Buy BTC</button>
|
||||
<button class="btn btn-success w-100 py-3 fw-bold rounded-3 h-100 d-flex flex-column align-items-center justify-content-center">
|
||||
<div class="fs-5"><?= __('buy_up') ?></div>
|
||||
<div class="small opacity-75 fw-normal profit-rate-hint"><?= __('profit') ?> 8%</div>
|
||||
</button>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="input-group-custom">
|
||||
<label>Sell Price</label>
|
||||
<div class="input-wrapper">
|
||||
<input type="number" value="64234.50">
|
||||
<span class="suffix">USDT</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-group-custom">
|
||||
<label>Amount</label>
|
||||
<div class="input-wrapper">
|
||||
<input type="number" placeholder="0.00">
|
||||
<span class="suffix">BTC</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn-sell">Sell BTC</button>
|
||||
<button class="btn btn-danger w-100 py-3 fw-bold rounded-3 h-100 d-flex flex-column align-items-center justify-content-center">
|
||||
<div class="fs-5"><?= __('buy_down') ?></div>
|
||||
<div class="small opacity-75 fw-normal profit-rate-hint"><?= __('profit') ?> 8%</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="order-history p-3">
|
||||
<h6 class="mb-3">Open Orders</h6>
|
||||
<table class="table table-dark table-sm small">
|
||||
<thead>
|
||||
<tr class="text-muted">
|
||||
<th>Time</th>
|
||||
<th>Type</th>
|
||||
<th>Side</th>
|
||||
<th>Price</th>
|
||||
<th>Amount</th>
|
||||
<th>Status</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr><td colspan="6" class="text-center py-4 text-muted">No records found</td></tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<script>
|
||||
let currentProfitRate = 8;
|
||||
function selectCycle(btn, seconds, profit, hint) {
|
||||
document.querySelectorAll('.cycle-btn').forEach(el => el.classList.remove('active'));
|
||||
btn.classList.add('active');
|
||||
currentProfitRate = profit;
|
||||
document.getElementById('binary-amount').placeholder = hint;
|
||||
|
||||
// Update profit hints on buttons
|
||||
document.querySelectorAll('.profit-rate-hint').forEach(el => {
|
||||
el.innerText = '<?= __("profit") ?> ' + profit + '%';
|
||||
});
|
||||
calculateProfit();
|
||||
}
|
||||
|
||||
function setBinaryAmount(amt) {
|
||||
document.getElementById('binary-amount').value = amt;
|
||||
calculateProfit();
|
||||
}
|
||||
|
||||
function calculateProfit() {
|
||||
const amount = parseFloat(document.getElementById('binary-amount').value) || 0;
|
||||
const profit = (amount * currentProfitRate / 100).toFixed(2);
|
||||
document.getElementById('profit-display').innerText = profit + ' USDT';
|
||||
}
|
||||
</script>
|
||||
|
||||
<?php else: ?>
|
||||
<div class="order-form-container w-100">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="order-form-tabs m-0 d-flex gap-2">
|
||||
<button class="active btn btn-sm btn-outline-secondary py-1 px-3">Limit</button>
|
||||
<button class="btn btn-sm btn-outline-secondary py-1 px-3">Market</button>
|
||||
</div>
|
||||
<div class="small text-muted"><?= __('assets') ?>: <span class="text-white">1,000.00 USDT</span></div>
|
||||
</div>
|
||||
<div class="row g-3">
|
||||
<div class="col-6">
|
||||
<div class="input-group-custom mb-3">
|
||||
<label class="small text-muted mb-1 d-block">Buy Price</label>
|
||||
<div class="input-wrapper bg-black p-2 rounded border border-secondary d-flex justify-content-between">
|
||||
<input type="number" value="64234.50" class="bg-transparent border-0 text-white w-75 outline-none" style="outline: none;">
|
||||
<span class="suffix text-muted small">USDT</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-group-custom mb-3">
|
||||
<label class="small text-muted mb-1 d-block">Amount</label>
|
||||
<div class="input-wrapper bg-black p-2 rounded border border-secondary d-flex justify-content-between">
|
||||
<input type="number" placeholder="0.00" class="bg-transparent border-0 text-white w-75 outline-none" style="outline: none;">
|
||||
<span class="suffix text-muted small"><?= $currentSymbol ?></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex gap-1 mb-3">
|
||||
<?php foreach(['25%','50%','75%','100%'] as $p): ?>
|
||||
<button class="btn btn-dark btn-sm py-0 flex-fill" style="font-size: 10px;"><?= $p ?></button>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<button class="btn btn-success w-100 py-3 fw-bold rounded-3">Buy <?= $currentSymbol ?></button>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="input-group-custom mb-3">
|
||||
<label class="small text-muted mb-1 d-block">Sell Price</label>
|
||||
<div class="input-wrapper bg-black p-2 rounded border border-secondary d-flex justify-content-between">
|
||||
<input type="number" value="64234.50" class="bg-transparent border-0 text-white w-75 outline-none" style="outline: none;">
|
||||
<span class="suffix text-muted small">USDT</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="input-group-custom mb-3">
|
||||
<label class="small text-muted mb-1 d-block">Amount</label>
|
||||
<div class="input-wrapper bg-black p-2 rounded border border-secondary d-flex justify-content-between">
|
||||
<input type="number" placeholder="0.00" class="bg-transparent border-0 text-white w-75 outline-none" style="outline: none;">
|
||||
<span class="suffix text-muted small"><?= $currentSymbol ?></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="d-flex gap-1 mb-3">
|
||||
<?php foreach(['25%','50%','75%','100%'] as $p): ?>
|
||||
<button class="btn btn-dark btn-sm py-0 flex-fill" style="font-size: 10px;"><?= $p ?></button>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<button class="btn btn-danger w-100 py-3 fw-bold rounded-3">Sell <?= $currentSymbol ?></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
// Simulating price jump
|
||||
setInterval(() => {
|
||||
const el = document.querySelector('.price-jump');
|
||||
if (!el) return;
|
||||
const current = parseFloat(el.innerText.replace(',', ''));
|
||||
const diff = (Math.random() - 0.5) * 10;
|
||||
const next = (current + diff).toLocaleString('en-US', {minimumFractionDigits: 2, maximumFractionDigits: 2});
|
||||
el.innerText = next;
|
||||
el.style.color = diff > 0 ? '#26a69a' : '#ef5350';
|
||||
setTimeout(() => el.style.color = '#26a69a', 500);
|
||||
}, 2000);
|
||||
</script>
|
||||
|
||||
|
||||
<div class="order-history p-0">
|
||||
<div class="d-flex gap-0 border-bottom border-secondary bg-dark history-tabs">
|
||||
<h6 class="px-4 py-3 mb-0 active text-primary bg-black" onclick="showHistoryTab('open')" id="tab-open" style="cursor: pointer; font-size: 13px; font-weight: bold; border-bottom: 2px solid var(--term-primary) !important;">当前委托 (Open Orders)</h6>
|
||||
<h6 class="px-4 py-3 mb-0 text-muted" onclick="showHistoryTab('settlement')" id="tab-settlement" style="cursor: pointer; font-size: 13px;">结算部位 (Settlement)</h6>
|
||||
<h6 class="px-4 py-3 mb-0 text-muted" onclick="showHistoryTab('history')" id="tab-history" style="cursor: pointer; font-size: 13px;">成交历史 (Trade History)</h6>
|
||||
<h6 class="px-4 py-3 mb-0 text-muted" onclick="showHistoryTab('assets')" id="tab-assets" style="cursor: pointer; font-size: 13px;">资产 (Assets)</h6>
|
||||
</div>
|
||||
<div class="table-responsive">
|
||||
<table class="table table-dark table-sm mb-0" id="history-table" style="font-size: 12px;">
|
||||
<thead>
|
||||
<tr class="text-muted" style="background: rgba(255,255,255,0.02);">
|
||||
<th class="ps-3 py-2">时间</th>
|
||||
<th class="py-2">交易对</th>
|
||||
<th class="py-2">类型</th>
|
||||
<th class="py-2">方向</th>
|
||||
<th class="py-2">价格</th>
|
||||
<th class="py-2">数量</th>
|
||||
<th class="py-2">成交额</th>
|
||||
<th class="py-2">状态</th>
|
||||
<th class="pe-3 py-2 text-end">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="history-body">
|
||||
<!-- Data injected by JS -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -144,11 +290,11 @@ function renderTerminal($activeTab = 'spot') {
|
||||
<div class="order-book">
|
||||
<div class="ob-header">
|
||||
<span>Price(USDT)</span>
|
||||
<span>Amount(BTC)</span>
|
||||
<span>Amount(<?= $currentSymbol ?>)</span>
|
||||
</div>
|
||||
<div class="ob-list asks">
|
||||
<?php for($i=0;$i<10;$i++):
|
||||
$p = 64235 + $i * 1.5;
|
||||
<?php for($i=0;$i<12;$i++):
|
||||
$p = 64235 + (12-$i) * 1.5;
|
||||
$a = rand(10, 1000) / 1000;
|
||||
$w = rand(10, 90);
|
||||
?>
|
||||
@ -164,7 +310,7 @@ function renderTerminal($activeTab = 'spot') {
|
||||
<span class="small text-muted">≈ $64,234.50</span>
|
||||
</div>
|
||||
<div class="ob-list bids">
|
||||
<?php for($i=0;$i<10;$i++):
|
||||
<?php for($i=0;$i<12;$i++):
|
||||
$p = 64233 - $i * 1.5;
|
||||
$a = rand(10, 1000) / 1000;
|
||||
$w = rand(10, 90);
|
||||
@ -180,6 +326,67 @@ function renderTerminal($activeTab = 'spot') {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const historyData = {
|
||||
open: [
|
||||
{time: '2026-02-16 15:45:12', pair: 'BTC/USDT', type: 'Limit', side: 'Buy', price: '64,100.00', amount: '0.5000', total: '32,050.00', status: 'Pending'},
|
||||
{time: '2026-02-16 15:40:05', pair: '<?= $currentSymbol ?>/USDT', type: 'Limit', side: 'Sell', price: '64,500.00', amount: '0.2500', total: '16,125.00', status: 'Pending'}
|
||||
],
|
||||
settlement: [
|
||||
{time: '2026-02-16 14:30:11', pair: 'BTC/USDT', type: 'Binary', side: 'Buy Up', price: '64,234.50', amount: '100.00', total: '108.00', status: 'Profit'},
|
||||
{time: '2026-02-16 13:15:22', pair: 'ETH/USDT', type: 'Binary', side: 'Buy Down', price: '3,456.20', amount: '50.00', total: '0.00', status: 'Loss'}
|
||||
],
|
||||
history: [
|
||||
{time: '2026-02-16 12:00:00', pair: 'SOL/USDT', type: 'Market', side: 'Buy', price: '142.30', amount: '100.00', total: '14,230.00', status: 'Filled'}
|
||||
],
|
||||
assets: [
|
||||
{time: '-', pair: 'USDT', type: 'Wallet', side: '-', price: '1.00', amount: '1,000.00', total: '1,000.00', status: 'Available'},
|
||||
{time: '-', pair: 'BTC', type: 'Wallet', side: '-', price: '64,234.50', amount: '0.0500', total: '3,211.73', status: 'Available'}
|
||||
]
|
||||
};
|
||||
|
||||
function showHistoryTab(tab) {
|
||||
// Update tabs UI
|
||||
document.querySelectorAll('.history-tabs h6').forEach(el => {
|
||||
el.classList.remove('active', 'text-primary', 'bg-black');
|
||||
el.classList.add('text-muted');
|
||||
el.style.borderBottom = 'none';
|
||||
});
|
||||
const activeTab = document.getElementById('tab-' + tab);
|
||||
activeTab.classList.add('active', 'text-primary', 'bg-black');
|
||||
activeTab.classList.remove('text-muted');
|
||||
activeTab.style.borderBottom = '2px solid var(--term-primary)';
|
||||
|
||||
// Update table content
|
||||
const body = document.getElementById('history-body');
|
||||
body.innerHTML = '';
|
||||
|
||||
if (!historyData[tab] || historyData[tab].length === 0) {
|
||||
body.innerHTML = '<tr><td colspan="9" class="text-center py-5 text-muted">No records found</td></tr>';
|
||||
return;
|
||||
}
|
||||
|
||||
historyData[tab].forEach(row => {
|
||||
const tr = document.createElement('tr');
|
||||
tr.innerHTML = `
|
||||
<td class="ps-3 py-3 text-muted">${row.time}</td>
|
||||
<td class="py-3 fw-bold text-white">${row.pair}</td>
|
||||
<td class="py-3">${row.type}</td>
|
||||
<td class="py-3 ${row.side === 'Buy' ? 'text-success' : (row.side === 'Sell' ? 'text-danger' : 'text-white')}">${row.side}</td>
|
||||
<td class="py-3">${row.price}</td>
|
||||
<td class="py-3">${row.amount}</td>
|
||||
<td class="py-3">${row.total}</td>
|
||||
<td class="py-3"><span class="badge bg-success bg-opacity-10 text-success">${row.status}</span></td>
|
||||
<td class="pe-3 py-3 text-end"><button class="btn btn-sm btn-link text-muted p-0">Details</button></td>
|
||||
`;
|
||||
body.appendChild(tr);
|
||||
});
|
||||
}
|
||||
|
||||
// Initialize with open orders
|
||||
showHistoryTab('open');
|
||||
</script>
|
||||
<?php
|
||||
}
|
||||
?>
|
||||
|
||||
163
index.php
163
index.php
@ -10,39 +10,42 @@ require_once __DIR__ . '/includes/header.php';
|
||||
<div id="heroCarousel" class="carousel slide mb-5" data-bs-ride="carousel">
|
||||
<div class="carousel-inner rounded-4 shadow-lg">
|
||||
<div class="carousel-item active">
|
||||
<div class="carousel-content p-5 text-white d-flex align-items-center" style="height: 480px; background: url('https://images.pexels.com/photos/6771574/pexels-photo-6771574.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2');">
|
||||
<div class="carousel-overlay"></div>
|
||||
<div class="container">
|
||||
<div class="carousel-content p-5 text-white d-flex align-items-center" style="height: 520px; background: url('https://images.pexels.com/photos/6771664/pexels-photo-6771664.jpeg?auto=compress&cs=tinysrgb&w=1600') center/cover;">
|
||||
<div class="carousel-overlay" style="background: linear-gradient(90deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.3) 100%); position: absolute; top:0; left:0; right:0; bottom:0;"></div>
|
||||
<div class="container" style="position: relative; z-index: 2;">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-7">
|
||||
<h1 class="display-3 fw-bold mb-3"><?php echo __('hero_title'); ?></h1>
|
||||
<p class="lead fs-3 mb-4 text-light"><?php echo __('hero_subtitle'); ?></p>
|
||||
<a href="auth/register.php" class="btn btn-primary btn-lg px-5 py-3 fw-bold rounded-pill"><?php echo __('get_started'); ?></a>
|
||||
<p class="lead fs-3 mb-4 text-light-50"><?php echo __('hero_subtitle'); ?></p>
|
||||
<div class="d-flex gap-3">
|
||||
<a href="auth/register.php" class="btn btn-primary btn-lg px-5 py-3 fw-bold rounded-pill shadow-primary"><?php echo __('get_started'); ?></a>
|
||||
<a href="market.php" class="btn btn-outline-light btn-lg px-5 py-3 fw-bold rounded-pill"><?= __('market_view') ?></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="carousel-content p-5 text-white d-flex align-items-center" style="height: 480px; background: url('https://images.pexels.com/photos/6770610/pexels-photo-6770610.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2');">
|
||||
<div class="carousel-overlay"></div>
|
||||
<div class="container">
|
||||
<h1 class="display-3 fw-bold mb-3">Professional K-Line Chart</h1>
|
||||
<p class="lead fs-3 mb-4 text-light">Advanced analytical tools for precise market entries and exits.</p>
|
||||
<div class="carousel-content p-5 text-white d-flex align-items-center" style="height: 520px; background: url('https://images.pexels.com/photos/6771574/pexels-photo-6771574.jpeg?auto=compress&cs=tinysrgb&w=1600') center/cover;">
|
||||
<div class="carousel-overlay" style="background: linear-gradient(90deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.3) 100%); position: absolute; top:0; left:0; right:0; bottom:0;"></div>
|
||||
<div class="container" style="position: relative; z-index: 2;">
|
||||
<h1 class="display-3 fw-bold mb-3">Professional Trading Terminal</h1>
|
||||
<p class="lead fs-3 mb-4 text-light-50">High-performance execution with deep liquidity for every trade.</p>
|
||||
<div class="d-flex gap-3">
|
||||
<a href="trade.php" class="btn btn-outline-light btn-lg px-5 py-3 fw-bold rounded-pill"><?php echo __('trade'); ?></a>
|
||||
<a href="market.php" class="btn btn-primary btn-lg px-5 py-3 fw-bold rounded-pill">View Markets</a>
|
||||
<a href="trade.php" class="btn btn-primary btn-lg px-5 py-3 fw-bold rounded-pill shadow-primary"><?php echo __('trade'); ?></a>
|
||||
<a href="binary.php" class="btn btn-outline-light btn-lg px-5 py-3 fw-bold rounded-pill">Second Contract</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="carousel-content p-5 text-white d-flex align-items-center" style="height: 480px; background: url('https://images.pexels.com/photos/6771178/pexels-photo-6771178.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2');">
|
||||
<div class="carousel-overlay"></div>
|
||||
<div class="container">
|
||||
<h1 class="display-3 fw-bold mb-3">Byro Mining Pool</h1>
|
||||
<p class="lead fs-3 mb-4 text-light">The most efficient mining experience with daily payouts.</p>
|
||||
<a href="mining.php" class="btn btn-success btn-lg px-5 py-3 fw-bold rounded-pill">Start Mining</a>
|
||||
<div class="carousel-content p-5 text-white d-flex align-items-center" style="height: 520px; background: url('https://images.pexels.com/photos/5980866/pexels-photo-5980866.jpeg?auto=compress&cs=tinysrgb&w=1600') center/cover;">
|
||||
<div class="carousel-overlay" style="background: linear-gradient(90deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.3) 100%); position: absolute; top:0; left:0; right:0; bottom:0;"></div>
|
||||
<div class="container" style="position: relative; z-index: 2;">
|
||||
<h1 class="display-3 fw-bold mb-3">Institutional-Grade Security</h1>
|
||||
<p class="lead fs-3 mb-4 text-light-50">Multi-tier encryption and cold storage to keep your assets safe.</p>
|
||||
<a href="auth/register.php" class="btn btn-primary btn-lg px-5 py-3 fw-bold rounded-pill shadow-primary">Secure My Account</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -55,6 +58,22 @@ require_once __DIR__ . '/includes/header.php';
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.coin-card {
|
||||
background: #0b0e11;
|
||||
border: 1px solid #2b3139;
|
||||
transition: all 0.3s ease;
|
||||
border-radius: 16px;
|
||||
}
|
||||
.coin-card:hover {
|
||||
transform: translateY(-5px);
|
||||
border-color: #0062ff;
|
||||
background: #161a1e;
|
||||
}
|
||||
.price-display {
|
||||
color: #ffffff;
|
||||
}
|
||||
</style>
|
||||
<!-- Popular Markets (3x4 Layout) -->
|
||||
<section class="market-section mb-5">
|
||||
<div class="d-flex justify-content-between align-items-end mb-4">
|
||||
@ -64,43 +83,27 @@ require_once __DIR__ . '/includes/header.php';
|
||||
<div class="row g-4" id="market-list">
|
||||
<?php
|
||||
$coins = [
|
||||
['symbol' => 'BTC', 'name' => 'Bitcoin', 'color' => '#f7931a', 'id' => 'bitcoin'],
|
||||
['symbol' => 'ETH', 'name' => 'Ethereum', 'color' => '#627eea', 'id' => 'ethereum'],
|
||||
['symbol' => 'USDT', 'name' => 'Tether', 'color' => '#26a17b', 'id' => 'tether'],
|
||||
['symbol' => 'BNB', 'name' => 'BNB', 'color' => '#f3ba2f', 'id' => 'binancecoin'],
|
||||
['symbol' => 'SOL', 'name' => 'Solana', 'color' => '#14f195', 'id' => 'solana'],
|
||||
['symbol' => 'XRP', 'name' => 'XRP', 'color' => '#23292f', 'id' => 'ripple'],
|
||||
['symbol' => 'ADA', 'name' => 'Cardano', 'color' => '#0033ad', 'id' => 'cardano'],
|
||||
['symbol' => 'DOGE', 'name' => 'Dogecoin', 'color' => '#c2a633', 'id' => 'dogecoin'],
|
||||
['symbol' => 'DOT', 'name' => 'Polkadot', 'color' => '#e6007a', 'id' => 'polkadot'],
|
||||
['symbol' => 'MATIC', 'name' => 'Polygon', 'color' => '#8247e5', 'id' => 'matic-network'],
|
||||
['symbol' => 'LINK', 'name' => 'Chainlink', 'color' => '#2a5ada', 'id' => 'chainlink'],
|
||||
['symbol' => 'SHIB', 'name' => 'Shiba Inu', 'color' => '#ffad00', 'id' => 'shiba-inu']
|
||||
['symbol' => 'BTC', 'name' => 'Bitcoin', 'id' => 'bitcoin'],
|
||||
['symbol' => 'ETH', 'name' => 'Ethereum', 'id' => 'ethereum'],
|
||||
['symbol' => 'USDT', 'name' => 'Tether', 'id' => 'tether'],
|
||||
['symbol' => 'BNB', 'name' => 'BNB', 'id' => 'binancecoin'],
|
||||
['symbol' => 'SOL', 'name' => 'Solana', 'id' => 'solana'],
|
||||
['symbol' => 'XRP', 'name' => 'XRP', 'id' => 'ripple'],
|
||||
['symbol' => 'ADA', 'name' => 'Cardano', 'id' => 'cardano'],
|
||||
['symbol' => 'DOGE', 'name' => 'Dogecoin', 'id' => 'dogecoin'],
|
||||
['symbol' => 'DOT', 'name' => 'Polkadot', 'id' => 'polkadot'],
|
||||
['symbol' => 'MATIC', 'name' => 'Polygon', 'id' => 'matic-network'],
|
||||
['symbol' => 'LINK', 'name' => 'Chainlink', 'id' => 'chainlink'],
|
||||
['symbol' => 'SHIB', 'name' => 'Shiba Inu', 'id' => 'shiba-inu']
|
||||
];
|
||||
foreach ($coins as $coin):
|
||||
?>
|
||||
<div class="col-md-3">
|
||||
<div class="card coin-card h-100" data-symbol="<?php echo $coin['symbol']; ?>">
|
||||
<div class="card coin-card h-100" data-symbol="<?php echo $coin['symbol']; ?>" onclick="location.href='trade.php?symbol=<?php echo $coin['symbol']; ?>'" style="cursor: pointer;">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex justify-content-between align-items-center mb-3">
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://assets.coingecko.com/coins/images/<?php
|
||||
$icon_ids = [
|
||||
'BTC' => '1/small/bitcoin.png',
|
||||
'ETH' => '279/small/ethereum.png',
|
||||
'USDT' => '325/small/tether.png',
|
||||
'BNB' => '825/small/binance-coin-logo.png',
|
||||
'SOL' => '4128/small/solana.png',
|
||||
'XRP' => '44/small/xrp-symbol-white-128.png',
|
||||
'ADA' => '975/small/cardano.png',
|
||||
'DOGE' => '5/small/dogecoin.png',
|
||||
'DOT' => '12171/small/polkadot.png',
|
||||
'MATIC' => '4713/small/matic-network.png',
|
||||
'LINK' => '877/small/chainlink.png',
|
||||
'SHIB' => '11939/small/shiba-inu.png'
|
||||
];
|
||||
echo $icon_ids[$coin['symbol']];
|
||||
?>" width="32" height="32" class="me-2" alt="<?php echo $coin['symbol']; ?>">
|
||||
<img src="<?php echo getCoinIcon($coin['symbol']); ?>" width="32" height="32" class="me-2 rounded-circle bg-light p-1" alt="<?php echo $coin['symbol']; ?>" onerror="this.src='https://assets.coingecko.com/coins/images/1/small/bitcoin.png'">
|
||||
<span class="fw-bold fs-5"><?php echo $coin['symbol']; ?></span>
|
||||
<small class="text-muted ms-2">/USDT</small>
|
||||
</div>
|
||||
@ -197,38 +200,30 @@ require_once __DIR__ . '/includes/header.php';
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<script>
|
||||
const symbols = ['BTCUSDT', 'ETHUSDT', 'BNBUSDT', 'SOLUSDT', 'XRPUSDT', 'ADAUSDT', 'DOGEUSDT', 'DOTUSDT', 'MATICUSDT', 'LINKUSDT'];
|
||||
const symbols = ['BTCUSDT', 'ETHUSDT', 'BNBUSDT', 'SOLUSDT', 'XRPUSDT', 'ADAUSDT', 'DOGEUSDT', 'DOTUSDT', 'MATICUSDT', 'LINKUSDT', 'SHIBUSDT'];
|
||||
const coinData = {};
|
||||
|
||||
function initPriceUpdate() {
|
||||
setInterval(() => {
|
||||
document.querySelectorAll('.coin-card').forEach(card => {
|
||||
const symbol = card.dataset.symbol;
|
||||
if (symbol === 'USDT') {
|
||||
updateUI('USDT', 1.000, 0.01);
|
||||
return;
|
||||
}
|
||||
|
||||
// Simulating real-time drift for demo
|
||||
if (!coinData[symbol]) {
|
||||
const basePrices = {
|
||||
'BTC': 64000, 'ETH': 3450, 'BNB': 590, 'SOL': 145,
|
||||
'XRP': 0.62, 'ADA': 0.58, 'DOGE': 0.16, 'DOT': 8.4,
|
||||
'MATIC': 0.92, 'LINK': 18.4, 'SHIB': 0.000025
|
||||
};
|
||||
coinData[symbol] = {
|
||||
price: basePrices[symbol] || 100,
|
||||
change: (Math.random() * 10 - 5).toFixed(2)
|
||||
};
|
||||
}
|
||||
|
||||
const drift = (Math.random() - 0.5) * (coinData[symbol].price * 0.0005);
|
||||
coinData[symbol].price += drift;
|
||||
const change = (parseFloat(coinData[symbol].change) + (Math.random() - 0.5) * 0.05).toFixed(2);
|
||||
|
||||
updateUI(symbol, coinData[symbol].price, change);
|
||||
async function fetchPrices() {
|
||||
try {
|
||||
const response = await fetch('https://api.binance.com/api/v3/ticker/24hr');
|
||||
const data = await response.json();
|
||||
const relevant = data.filter(t => symbols.includes(t.symbol));
|
||||
|
||||
relevant.forEach(t => {
|
||||
const symbol = t.symbol.replace('USDT', '');
|
||||
updateUI(symbol, parseFloat(t.lastPrice), parseFloat(t.priceChangePercent));
|
||||
});
|
||||
}, 1500);
|
||||
|
||||
// Handle USDT specially
|
||||
updateUI('USDT', 1.000, 0.01);
|
||||
} catch (err) {
|
||||
console.error('Failed to fetch real-time prices:', err);
|
||||
}
|
||||
}
|
||||
|
||||
function initPriceUpdate() {
|
||||
fetchPrices();
|
||||
setInterval(fetchPrices, 5000);
|
||||
}
|
||||
|
||||
function updateUI(symbol, price, change) {
|
||||
@ -247,13 +242,21 @@ function updateUI(symbol, price, change) {
|
||||
});
|
||||
|
||||
if (Math.abs(price - oldPrice) > 0.000001) {
|
||||
priceEl.style.transition = 'color 0.3s';
|
||||
priceEl.style.transition = 'all 0.2s';
|
||||
const jumpDir = price > oldPrice ? -3 : 3;
|
||||
priceEl.style.transform = `translateY(${jumpDir}px)`;
|
||||
if (price > oldPrice) {
|
||||
priceEl.style.color = '#26a69a';
|
||||
setTimeout(() => priceEl.style.color = '', 400);
|
||||
setTimeout(() => {
|
||||
priceEl.style.transform = '';
|
||||
priceEl.style.color = '';
|
||||
}, 200);
|
||||
} else {
|
||||
priceEl.style.color = '#ef5350';
|
||||
setTimeout(() => priceEl.style.color = '', 400);
|
||||
setTimeout(() => {
|
||||
priceEl.style.transform = '';
|
||||
priceEl.style.color = '';
|
||||
}, 200);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
67
market.php
67
market.php
@ -4,19 +4,19 @@ require_once __DIR__ . '/includes/header.php';
|
||||
?>
|
||||
<main class="container py-5">
|
||||
<h1 class="mb-4 fw-bold"><?php echo __('market'); ?></h1>
|
||||
<div class="card bg-dark border-secondary overflow-hidden">
|
||||
<div class="table-responsive">
|
||||
<table class="table table-dark table-hover mb-0">
|
||||
<thead class="border-secondary">
|
||||
<tr class="text-muted small">
|
||||
<th class="ps-4">Coin</th>
|
||||
<th>Price</th>
|
||||
<th>24h Change</th>
|
||||
<th>24h Volume</th>
|
||||
<th class="text-end pe-4">Action</th>
|
||||
<div class="card border-0 bg-transparent">
|
||||
<div class="table-responsive rounded-4 shadow-lg" style="background: #0b0e11; border: 1px solid #2b3139;">
|
||||
<table class="table table-dark table-hover mb-0 align-middle">
|
||||
<thead style="background: #161a1e;">
|
||||
<tr class="text-light-50 small border-0">
|
||||
<th class="ps-4 py-4 border-0 fw-bold text-uppercase" style="letter-spacing: 1px; color: #ffffff !important;">Asset</th>
|
||||
<th class="py-4 border-0 fw-bold text-uppercase" style="letter-spacing: 1px; color: #ffffff !important;">Last Price</th>
|
||||
<th class="py-4 border-0 fw-bold text-uppercase" style="letter-spacing: 1px; color: #ffffff !important;">24h Change</th>
|
||||
<th class="py-4 border-0 fw-bold text-uppercase" style="letter-spacing: 1px; color: #ffffff !important;">24h Volume</th>
|
||||
<th class="text-end pe-4 py-4 border-0 fw-bold text-uppercase" style="letter-spacing: 1px; color: #ffffff !important;">Market</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="border-secondary">
|
||||
<tbody class="border-0">
|
||||
<?php
|
||||
$full_coins = [
|
||||
['name' => 'Bitcoin', 'symbol' => 'BTC', 'price' => '65,432.10', 'change' => '+2.5%', 'vol' => '32.1B'],
|
||||
@ -28,41 +28,36 @@ require_once __DIR__ . '/includes/header.php';
|
||||
['name' => 'Cardano', 'symbol' => 'ADA', 'price' => '0.45', 'change' => '+0.8%', 'vol' => '400M'],
|
||||
['name' => 'Dogecoin', 'symbol' => 'DOGE', 'price' => '0.16', 'change' => '+3.4%', 'vol' => '1.1B'],
|
||||
['name' => 'Polkadot', 'symbol' => 'DOT', 'price' => '8.90', 'change' => '-2.1%', 'vol' => '200M'],
|
||||
['name' => 'Polygon', 'symbol' => 'MATIC', 'price' => '0.92', 'change' => '+1.5%', 'vol' => '300M']
|
||||
['name' => 'Polygon', 'symbol' => 'MATIC', 'price' => '0.92', 'change' => '+1.5%', 'vol' => '300M'],
|
||||
['name' => 'Avalanche', 'symbol' => 'AVAX', 'price' => '45.20', 'change' => '+4.1%', 'vol' => '800M'],
|
||||
['name' => 'Chainlink', 'symbol' => 'LINK', 'price' => '18.40', 'change' => '+3.2%', 'vol' => '500M'],
|
||||
['name' => 'Shiba Inu', 'symbol' => 'SHIB', 'price' => '0.000027', 'change' => '-3.4%', 'vol' => '200M'],
|
||||
['name' => 'TRON', 'symbol' => 'TRX', 'price' => '0.12', 'change' => '+0.5%', 'vol' => '1.2B'],
|
||||
['name' => 'Bitcoin Cash', 'symbol' => 'BCH', 'price' => '456.20', 'change' => '+2.12%', 'vol' => '450M'],
|
||||
['name' => 'Litecoin', 'symbol' => 'LTC', 'price' => '84.50', 'change' => '+1.45%', 'vol' => '900M'],
|
||||
['name' => 'Uniswap', 'symbol' => 'UNI', 'price' => '7.20', 'change' => '-2.12%', 'vol' => '120M']
|
||||
];
|
||||
foreach ($full_coins as $coin):
|
||||
?>
|
||||
<tr class="align-middle">
|
||||
<td class="ps-4">
|
||||
<tr style="border-bottom: 1px solid rgba(255,255,255,0.05); transition: all 0.2s;">
|
||||
<td class="ps-4 py-3 border-0">
|
||||
<div class="d-flex align-items-center">
|
||||
<img src="https://assets.coingecko.com/coins/images/<?php
|
||||
$icon_ids = [
|
||||
'BTC' => '1/small/bitcoin.png',
|
||||
'ETH' => '279/small/ethereum.png',
|
||||
'USDT' => '325/small/tether.png',
|
||||
'BNB' => '825/small/binance-coin-logo.png',
|
||||
'SOL' => '4128/small/solana.png',
|
||||
'XRP' => '44/small/xrp-symbol-white-128.png',
|
||||
'ADA' => '975/small/cardano.png',
|
||||
'DOGE' => '5/small/dogecoin.png',
|
||||
'DOT' => '12171/small/polkadot.png',
|
||||
'MATIC' => '4713/small/matic-network.png'
|
||||
];
|
||||
echo $icon_ids[$coin['symbol']] ?? '1/small/bitcoin.png';
|
||||
?>" width="32" height="32" class="me-3" alt="<?= $coin['symbol'] ?>">
|
||||
<div class="bg-white p-1 rounded-circle me-3 shadow-sm" style="width: 38px; height: 38px; display: flex; align-items: center; justify-content: center;">
|
||||
<img src="<?php echo getCoinIcon($coin['symbol']); ?>" width="26" height="26" alt="<?= $coin['symbol'] ?>" onerror="this.src='https://assets.coingecko.com/coins/images/1/small/bitcoin.png'">
|
||||
</div>
|
||||
<div>
|
||||
<div class="fw-bold"><?php echo $coin['symbol']; ?></div>
|
||||
<div class="text-muted small"><?php echo $coin['name']; ?></div>
|
||||
<div class="fw-bold text-white fs-5"><?php echo $coin['symbol']; ?></div>
|
||||
<div class="text-muted small fw-medium"><?php echo $coin['name']; ?></div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="fw-bold">$<?php echo $coin['price']; ?></td>
|
||||
<td class="<?php echo strpos($coin['change'], '+') !== false ? 'text-success' : 'text-danger'; ?>">
|
||||
<td class="fw-bold text-white border-0 fs-5">$<?php echo $coin['price']; ?></td>
|
||||
<td class="border-0 fw-bold fs-5 <?php echo strpos($coin['change'], '+') !== false ? 'text-success' : 'text-danger'; ?>">
|
||||
<?php echo $coin['change']; ?>
|
||||
</td>
|
||||
<td class="text-muted"><?php echo $coin['vol']; ?></td>
|
||||
<td class="text-end pe-4">
|
||||
<a href="/trade.php?symbol=<?php echo $coin['symbol']; ?>" class="btn btn-outline-primary btn-sm px-3">Trade</a>
|
||||
<td class="text-light-50 border-0 fw-medium" style="color: #eaecef !important; opacity: 0.8;"><?php echo $coin['vol']; ?></td>
|
||||
<td class="text-end pe-4 border-0">
|
||||
<a href="trade.php?symbol=<?php echo $coin['symbol']; ?>" class="btn btn-primary btn-md px-4 rounded-pill fw-bold"><?= __('trade') ?></a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
|
||||
195
mining.php
195
mining.php
@ -2,121 +2,134 @@
|
||||
require_once __DIR__ . '/includes/lang.php';
|
||||
require_once __DIR__ . '/includes/header.php';
|
||||
?>
|
||||
<div class="container py-5">
|
||||
<main class="container py-5">
|
||||
<div class="text-center mb-5">
|
||||
<h1 class="display-4 fw-bold"><?= __('mining') ?></h1>
|
||||
<p class="lead text-muted">Join Byro's high-efficiency mining pools and earn daily rewards.</p>
|
||||
<h1 class="display-4 fw-bold mb-3"><?= __('mining') ?></h1>
|
||||
<p class="lead text-muted mx-auto" style="max-width: 700px;">
|
||||
Professional cloud mining and staking platform. Join thousands of users earning passive income with Byro's high-efficiency mining pools.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="row g-4">
|
||||
<div class="col-md-4">
|
||||
<div class="card h-100 bg-dark border-secondary shadow-sm">
|
||||
<div class="row g-4 mb-5">
|
||||
<?php
|
||||
$pools = [
|
||||
['symbol' => 'BTC', 'name' => 'Bitcoin Pool', 'apy' => '12.5%', 'min' => '0.01 BTC', 'term' => '30 Days', 'hot' => true],
|
||||
['symbol' => 'ETH', 'name' => 'ETH 2.0 Staking', 'apy' => '8.2%', 'min' => '0.1 ETH', 'term' => 'Flexible', 'hot' => false],
|
||||
['symbol' => 'USDT', 'name' => 'USDT Savings', 'apy' => '15.0%', 'min' => '100 USDT', 'term' => '90 Days', 'hot' => true],
|
||||
['symbol' => 'BNB', 'name' => 'BNB Smart Chain', 'apy' => '22.0%', 'min' => '1 BNB', 'term' => '180 Days', 'hot' => false],
|
||||
['symbol' => 'SOL', 'name' => 'Solana Yield', 'apy' => '14.2%', 'min' => '5 SOL', 'term' => '60 Days', 'hot' => false],
|
||||
['symbol' => 'AVAX', 'name' => 'Avalanche Pro', 'apy' => '18.5%', 'min' => '10 AVAX', 'term' => '120 Days', 'hot' => false],
|
||||
];
|
||||
|
||||
foreach ($pools as $pool): ?>
|
||||
<div class="col-lg-4 col-md-6">
|
||||
<div class="card h-100 bg-dark border-secondary shadow-hover transition-all position-relative overflow-hidden" style="border-radius: 20px;">
|
||||
<?php if ($pool['hot']): ?>
|
||||
<div class="position-absolute top-0 end-0 bg-primary text-white px-3 py-1 small fw-bold" style="border-bottom-left-radius: 20px;">HOT</div>
|
||||
<?php endif; ?>
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center mb-4">
|
||||
<img src="https://assets.coingecko.com/coins/images/1/small/bitcoin.png" width="40" height="40" class="me-3">
|
||||
<h3 class="m-0">BTC Pool</h3>
|
||||
<div class="bg-black p-2 rounded-circle me-3 shadow-sm">
|
||||
<img src="<?php echo getCoinIcon($pool['symbol']); ?>" width="40" height="40">
|
||||
</div>
|
||||
<h4 class="m-0 fw-bold"><?= $pool['name'] ?></h4>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
|
||||
<div class="bg-black rounded-3 p-3 mb-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<span class="text-muted">Est. APY</span>
|
||||
<span class="text-success fw-bold">12.5%</span>
|
||||
<span class="text-muted small"><?= __('est_apy') ?></span>
|
||||
<span class="text-success fw-bold fs-5"><?= $pool['apy'] ?></span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<span class="text-muted">Minimum</span>
|
||||
<span>0.01 BTC</span>
|
||||
<span class="text-muted small"><?= __('min_deposit') ?></span>
|
||||
<span class="text-white"><?= $pool['min'] ?></span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between">
|
||||
<span class="text-muted">Term</span>
|
||||
<span>30 Days</span>
|
||||
<span class="text-muted small"><?= __('lock_period') ?></span>
|
||||
<span class="text-primary fw-medium"><?= $pool['term'] ?></span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-primary w-100 py-2 fw-bold">Stake Now</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="card h-100 bg-dark border-secondary shadow-sm">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center mb-4">
|
||||
<img src="https://assets.coingecko.com/coins/images/279/small/ethereum.png" width="40" height="40" class="me-3">
|
||||
<h3 class="m-0">ETH 2.0</h3>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<span class="text-muted">Est. APY</span>
|
||||
<span class="text-success fw-bold">8.2%</span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<span class="text-muted">Minimum</span>
|
||||
<span>0.1 ETH</span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between">
|
||||
<span class="text-muted">Term</span>
|
||||
<span>Flexible</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-primary w-100 py-2 fw-bold">Stake Now</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="card h-100 bg-dark border-secondary shadow-sm">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex align-items-center mb-4">
|
||||
<img src="https://assets.coingecko.com/coins/images/325/small/tether.png" width="40" height="40" class="me-3">
|
||||
<h3 class="m-0">USDT Stable</h3>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<span class="text-muted">Est. APY</span>
|
||||
<span class="text-success fw-bold">15.0%</span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<span class="text-muted">Minimum</span>
|
||||
<span>100 USDT</span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between">
|
||||
<span class="text-muted">Term</span>
|
||||
<span>90 Days</span>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-primary w-100 py-2 fw-bold">Stake Now</button>
|
||||
|
||||
<div class="d-flex gap-2 mb-4 small text-muted">
|
||||
<i class="bi bi-shield-check text-success"></i> Principal Protected
|
||||
<i class="bi bi-lightning-fill text-warning ms-2"></i> Daily Payouts
|
||||
</div>
|
||||
|
||||
<button class="btn btn-primary w-100 py-3 fw-bold rounded-pill"><?= __('start_mining') ?></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
|
||||
<div class="mt-5 p-4 rounded-4" style="background: rgba(0, 98, 255, 0.05); border: 1px solid rgba(0, 98, 255, 0.2);">
|
||||
<h4 class="fw-bold mb-3">Why Mine with Byro?</h4>
|
||||
<div class="row g-4">
|
||||
<div class="col-md-4">
|
||||
<div class="d-flex gap-3">
|
||||
<i class="bi bi-lightning-charge-fill text-primary fs-3"></i>
|
||||
<div>
|
||||
<h6>Instant Payouts</h6>
|
||||
<p class="small text-muted">Daily settlements directly to your Byro wallet.</p>
|
||||
</div>
|
||||
<div class="row g-4 align-items-center py-5">
|
||||
<div class="col-md-6">
|
||||
<h2 class="fw-bold mb-4">Why choose Byro Mining?</h2>
|
||||
<div class="d-flex gap-4 mb-4">
|
||||
<div class="bg-primary bg-opacity-10 p-3 rounded-4">
|
||||
<i class="bi bi-cpu fs-2 text-primary"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="fw-bold">Advanced Hardware</h5>
|
||||
<p class="text-muted">We use the latest ASIC and GPU miners to ensure maximum profitability and stability.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="d-flex gap-3">
|
||||
<i class="bi bi-shield-check text-primary fs-3"></i>
|
||||
<div>
|
||||
<h6>Insured Funds</h6>
|
||||
<p class="small text-muted">Your staked assets are protected by our SAFU fund.</p>
|
||||
</div>
|
||||
<div class="d-flex gap-4 mb-4">
|
||||
<div class="bg-success bg-opacity-10 p-3 rounded-4">
|
||||
<i class="bi bi-wallet2 fs-2 text-success"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="fw-bold">Automatic Compounding</h5>
|
||||
<p class="text-muted">Reinvest your daily rewards automatically to maximize your total yield over time.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="d-flex gap-3">
|
||||
<i class="bi bi-graph-up text-primary fs-3"></i>
|
||||
<div>
|
||||
<h6>Compound Earnings</h6>
|
||||
<p class="small text-muted">Automatically reinvest your rewards for higher yield.</p>
|
||||
</div>
|
||||
<div class="d-flex gap-4">
|
||||
<div class="bg-info bg-opacity-10 p-3 rounded-4">
|
||||
<i class="bi bi-bar-chart-line fs-2 text-info"></i>
|
||||
</div>
|
||||
<div>
|
||||
<h5 class="fw-bold">Real-time Monitoring</h5>
|
||||
<p class="text-muted">Track your hash rate and earnings in real-time through our intuitive dashboard.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="bg-surface p-5 rounded-5 border border-secondary text-center shadow">
|
||||
<h3 class="fw-bold mb-3">Calculate Your Profit</h3>
|
||||
<p class="text-muted mb-4">Enter your investment amount to estimate your daily earnings.</p>
|
||||
<div class="input-group mb-4">
|
||||
<span class="input-group-text bg-black border-secondary text-white">USDT</span>
|
||||
<input type="number" class="form-control bg-black border-secondary text-white p-3" placeholder="Amount to invest">
|
||||
</div>
|
||||
<div class="bg-black p-4 rounded-4 mb-4">
|
||||
<div class="row">
|
||||
<div class="col-6 border-end border-secondary">
|
||||
<div class="text-muted small mb-1">Daily Profit</div>
|
||||
<div class="text-success fw-bold fs-4">$4.10</div>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<div class="text-muted small mb-1">Monthly Profit</div>
|
||||
<div class="text-success fw-bold fs-4">$123.00</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn btn-outline-primary w-100 py-3 rounded-pill fw-bold">Try Mining Calculator</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<style>
|
||||
.shadow-hover:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 1rem 3rem rgba(0,0,0,0.5) !important;
|
||||
}
|
||||
.transition-all {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.bg-surface {
|
||||
background-color: var(--surface);
|
||||
}
|
||||
</style>
|
||||
|
||||
<?php require_once __DIR__ . '/includes/footer.php'; ?>
|
||||
|
||||
144
profile.php
144
profile.php
@ -12,53 +12,107 @@ $stmt->execute([$user['id']]);
|
||||
$balances = $stmt->fetchAll();
|
||||
?>
|
||||
|
||||
<div class="section">
|
||||
<div class="container">
|
||||
<h1><?= __('personal') ?></h1>
|
||||
<div style="display: grid; grid-template-columns: 1fr 2fr; gap: 40px; margin-top: 40px;">
|
||||
<div style="background: var(--surface); padding: 30px; border-radius: 8px; border: 1px solid var(--border);">
|
||||
<div style="text-align: center; margin-bottom: 30px;">
|
||||
<i class="fas fa-user-circle" style="font-size: 80px; color: var(--primary);"></i>
|
||||
<h3 style="margin-top: 15px;"><?= htmlspecialchars($user['username']) ?></h3>
|
||||
<p style="color: var(--text-muted);"><?= htmlspecialchars($user['email'] ?? 'No email set') ?></p>
|
||||
</div>
|
||||
<div style="border-top: 1px solid var(--border); padding-top: 20px;">
|
||||
<p><strong>UID:</strong> <?= $user['id'] + 10000 ?></p>
|
||||
<p><strong>Status:</strong> <span style="color: var(--success)">Verified</span></p>
|
||||
<div class="container py-5">
|
||||
<div class="row g-4">
|
||||
<!-- User Info Card -->
|
||||
<div class="col-lg-4">
|
||||
<div class="card bg-dark border-0 shadow-lg h-100" style="background: #161a1e !important; border: 1px solid #2b3139 !important; border-radius: 24px;">
|
||||
<div class="card-body p-4 text-center">
|
||||
<div class="position-relative d-inline-block mb-3">
|
||||
<div class="rounded-circle bg-primary d-flex align-items-center justify-content-center text-white shadow-lg" style="width: 100px; height: 100px; font-size: 40px; background: linear-gradient(135deg, #0062ff, #00d2ff) !important;">
|
||||
<?= strtoupper(substr($user['username'], 0, 1)) ?>
|
||||
</div>
|
||||
<div class="position-absolute bottom-0 end-0 bg-success border border-4 border-dark rounded-circle" style="width: 25px; height: 25px;"></div>
|
||||
</div>
|
||||
<h3 class="fw-bold text-white mb-1"><?= htmlspecialchars($user['username']) ?></h3>
|
||||
<p class="text-muted small mb-4"><?= htmlspecialchars($user['email'] ?? 'No email linked') ?></p>
|
||||
|
||||
<div class="bg-black bg-opacity-25 rounded-4 p-3 mb-4 text-start border border-secondary border-opacity-25">
|
||||
<div class="d-flex justify-content-between mb-2 small">
|
||||
<span class="text-muted">UID</span>
|
||||
<span class="text-white fw-bold"><?= $user['uid'] ?? ($user['id'] + 10000) ?></span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between mb-2 small">
|
||||
<span class="text-muted">Account Status</span>
|
||||
<span class="text-success fw-bold"><i class="bi bi-patch-check-fill me-1"></i>Verified</span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between small">
|
||||
<span class="text-muted">Credit Score</span>
|
||||
<span class="text-primary fw-bold"><?= $user['credit_score'] ?? 80 ?></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-grid gap-2">
|
||||
<button class="btn btn-outline-secondary rounded-pill py-2 small fw-bold">Security Settings</button>
|
||||
<button class="btn btn-outline-danger border-0 rounded-pill py-2 small fw-bold" onclick="location.href='/auth/logout.php'">Logout</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="background: var(--surface); padding: 30px; border-radius: 8px; border: 1px solid var(--border);">
|
||||
<h3>My Assets</h3>
|
||||
<table style="width: 100%; border-collapse: collapse; margin-top: 20px;">
|
||||
<thead>
|
||||
<tr style="text-align: left; color: var(--text-muted); font-size: 14px; border-bottom: 1px solid var(--border);">
|
||||
<th style="padding: 12px 0;">Asset</th>
|
||||
<th style="padding: 12px 0;">Available</th>
|
||||
<th style="padding: 12px 0;">Frozen</th>
|
||||
<th style="padding: 12px 0; text-align: right;">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach($balances as $b): ?>
|
||||
<tr style="border-bottom: 1px solid var(--border);">
|
||||
<td style="padding: 16px 0; font-weight: bold;"><?= $b['symbol'] ?></td>
|
||||
<td style="padding: 16px 0;"><?= number_format((float)$b['available'], 4) ?></td>
|
||||
<td style="padding: 16px 0;"><?= number_format((float)$b['frozen'], 4) ?></td>
|
||||
<td style="padding: 16px 0; text-align: right;">
|
||||
<a href="/trade.php" style="color: var(--primary); font-size: 14px;">Trade</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
<?php if (empty($balances)): ?>
|
||||
<tr>
|
||||
<td colspan="4" style="padding: 40px; text-align: center; color: var(--text-muted);">No assets found.</td>
|
||||
</tr>
|
||||
<?php endif; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
<div style="margin-top: 30px; display: flex; gap: 16px;">
|
||||
<button class="btn btn-primary"><?= __('deposit') ?></button>
|
||||
<button class="btn btn-outline"><?= __('withdraw') ?></button>
|
||||
</div>
|
||||
|
||||
<!-- Assets Card -->
|
||||
<div class="col-lg-8">
|
||||
<div class="card bg-dark border-0 shadow-lg h-100" style="background: #161a1e !important; border: 1px solid #2b3139 !important; border-radius: 24px;">
|
||||
<div class="card-body p-4">
|
||||
<div class="d-flex justify-content-between align-items-center mb-4">
|
||||
<h4 class="fw-bold text-white m-0">Wallet Balances</h4>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-primary btn-sm px-3 rounded-pill me-2"><?= __('deposit') ?></button>
|
||||
<button class="btn btn-outline-light btn-sm px-3 rounded-pill"><?= __('withdraw') ?></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-dark table-hover mb-0 align-middle">
|
||||
<thead style="background: rgba(255,255,255,0.02);">
|
||||
<tr class="text-muted small border-0">
|
||||
<th class="ps-3 py-3 border-0">Asset</th>
|
||||
<th class="py-3 border-0 text-center">Icon</th>
|
||||
<th class="py-3 border-0">Available</th>
|
||||
<th class="py-3 border-0">Frozen</th>
|
||||
<th class="text-end pe-3 py-3 border-0">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="border-0">
|
||||
<?php
|
||||
$icons = [
|
||||
'USDT' => '325/small/tether.png',
|
||||
'BTC' => '1/small/bitcoin.png',
|
||||
'ETH' => '279/small/ethereum.png',
|
||||
'BNB' => '825/small/binance-coin-logo.png'
|
||||
];
|
||||
foreach($balances as $b):
|
||||
?>
|
||||
<tr style="border-bottom: 1px solid rgba(255,255,255,0.05);">
|
||||
<td class="ps-3 py-4 border-0">
|
||||
<div class="fw-bold text-white fs-5"><?= $b['symbol'] ?></div>
|
||||
</td>
|
||||
<td class="py-4 border-0 text-center">
|
||||
<img src="<?= getCoinIcon($b['symbol']) ?>" width="24" height="24">
|
||||
</td>
|
||||
<td class="py-4 border-0">
|
||||
<div class="fw-bold text-white"><?= number_format((float)$b['available'], 4) ?></div>
|
||||
</td>
|
||||
<td class="py-4 border-0 text-muted small">
|
||||
<?= number_format((float)$b['frozen'], 4) ?>
|
||||
</td>
|
||||
<td class="text-end pe-3 border-0">
|
||||
<a href="/trade.php?symbol=<?= $b['symbol'] ?>" class="btn btn-outline-primary btn-sm px-3 rounded-pill"><?= __('trade') ?></a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
|
||||
<?php if (empty($balances)): ?>
|
||||
<tr>
|
||||
<td colspan="5" class="py-5 text-center text-muted">
|
||||
<i class="bi bi-wallet2 fs-1 d-block mb-2"></i>
|
||||
No assets found in your wallet.
|
||||
</td>
|
||||
</tr>
|
||||
<?php endif; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
138
swap.php
138
swap.php
@ -3,62 +3,138 @@ require_once __DIR__ . '/includes/lang.php';
|
||||
require_once __DIR__ . '/includes/header.php';
|
||||
?>
|
||||
<div class="container py-5 d-flex justify-content-center">
|
||||
<div class="card bg-dark border-secondary shadow-lg" style="width: 100%; max-width: 480px; border-radius: 24px;">
|
||||
<div class="card bg-dark border-0 shadow-lg" style="width: 100%; max-width: 480px; border-radius: 28px; background: #0b0e11 !important; border: 1px solid #2b3139 !important; box-shadow: 0 20px 50px rgba(0,0,0,0.5) !important;">
|
||||
<div class="card-body p-4">
|
||||
<h3 class="fw-bold mb-4"><?= __('swap') ?></h3>
|
||||
<h3 class="fw-bold mb-4 text-white d-flex align-items-center gap-2">
|
||||
<i class="bi bi-lightning-charge-fill text-primary"></i>
|
||||
<?= __('swap') ?>
|
||||
</h3>
|
||||
|
||||
<!-- From -->
|
||||
<div class="p-3 mb-2 rounded-4" style="background: #1e2329;">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<span class="text-muted small">From</span>
|
||||
<span class="text-muted small">Balance: 0.00</span>
|
||||
<div class="p-4 mb-2 rounded-4" style="background: #161a1e; border: 1px solid #2b3139;">
|
||||
<div class="d-flex justify-content-between mb-3">
|
||||
<span class="text-white opacity-50 small fw-bold text-uppercase" style="letter-spacing: 1px;"><?= __('from') ?></span>
|
||||
<span class="text-white opacity-50 small"><?= __('balance') ?>: <span class="text-white fw-bold">1,000.00</span></span>
|
||||
</div>
|
||||
<div class="d-flex align-items-center">
|
||||
<input type="number" class="form-control bg-transparent border-0 text-white fs-3 p-0 shadow-none w-50" placeholder="0.00">
|
||||
<div class="ms-auto d-flex align-items-center bg-dark p-2 rounded-pill px-3 cursor-pointer">
|
||||
<img src="https://assets.coingecko.com/coins/images/325/small/tether.png" width="24" height="24" class="me-2">
|
||||
<span class="fw-bold">USDT</span>
|
||||
<i class="bi bi-chevron-down ms-2"></i>
|
||||
<input type="number" class="form-control bg-transparent border-0 text-white fs-1 p-0 shadow-none w-50 fw-bold" placeholder="0.00" style="color: #fff !important; font-size: 32px !important;">
|
||||
<div class="ms-auto dropdown">
|
||||
<div class="d-flex align-items-center bg-dark p-2 rounded-pill px-3 border border-secondary cursor-pointer shadow-sm dropdown-toggle" data-bs-toggle="dropdown">
|
||||
<img src="<?php echo getCoinIcon('USDT'); ?>" width="24" height="24" class="me-2 rounded-circle" id="from-coin-img">
|
||||
<span class="fw-bold text-white" id="from-coin-symbol">USDT</span>
|
||||
</div>
|
||||
<ul class="dropdown-menu dropdown-menu-dark bg-dark border-secondary rounded-4 shadow-lg p-2" style="max-height: 300px; overflow-y: auto;">
|
||||
<?php
|
||||
$swap_coins = ['BTC', 'ETH', 'USDT', 'BNB', 'SOL', 'XRP', 'ADA', 'DOGE', 'DOT', 'MATIC', 'LINK', 'SHIB'];
|
||||
foreach($swap_coins as $sc): ?>
|
||||
<li><a class="dropdown-item rounded-3 py-2 d-flex align-items-center gap-2" href="#" onclick="selectCoin('from', '<?= $sc ?>', '<?= getCoinIcon($sc) ?>')">
|
||||
<img src="<?= getCoinIcon($sc) ?>" width="20" height="20"> <?= $sc ?>
|
||||
</a></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- Switch Icon -->
|
||||
<div class="text-center my-n3 position-relative" style="z-index: 2;">
|
||||
<div class="bg-dark border border-secondary rounded-circle d-inline-flex p-2 shadow-sm" style="cursor: pointer;">
|
||||
<i class="bi bi-arrow-down-up text-primary"></i>
|
||||
<div class="bg-primary border border-4 border-dark rounded-circle d-inline-flex p-2 shadow-lg" style="cursor: pointer; transition: all 0.3s;" onclick="switchCoins()">
|
||||
<i class="bi bi-arrow-down-up text-white fs-5"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- To -->
|
||||
<div class="p-3 mt-n1 mb-4 rounded-4" style="background: #1e2329;">
|
||||
<div class="d-flex justify-content-between mb-2">
|
||||
<span class="text-muted small">To</span>
|
||||
<span class="text-muted small">Balance: 0.00</span>
|
||||
<div class="p-4 mt-n1 mb-4 rounded-4" style="background: #161a1e; border: 1px solid #2b3139;">
|
||||
<div class="d-flex justify-content-between mb-3">
|
||||
<span class="text-white opacity-50 small fw-bold text-uppercase" style="letter-spacing: 1px;"><?= __('to') ?></span>
|
||||
<span class="text-white opacity-50 small"><?= __('balance') ?>: <span class="text-white fw-bold">0.00</span></span>
|
||||
</div>
|
||||
<div class="d-flex align-items-center">
|
||||
<input type="number" class="form-control bg-transparent border-0 text-white fs-3 p-0 shadow-none w-50" placeholder="0.00" readonly>
|
||||
<div class="ms-auto d-flex align-items-center bg-dark p-2 rounded-pill px-3 cursor-pointer">
|
||||
<img src="https://assets.coingecko.com/coins/images/1/small/bitcoin.png" width="24" height="24" class="me-2">
|
||||
<span class="fw-bold">BTC</span>
|
||||
<i class="bi bi-chevron-down ms-2"></i>
|
||||
<input type="number" class="form-control bg-transparent border-0 text-white fs-1 p-0 shadow-none w-50 fw-bold" placeholder="0.00" readonly style="color: #fff !important; opacity: 1; font-size: 32px !important;">
|
||||
<div class="ms-auto dropdown">
|
||||
<div class="d-flex align-items-center bg-dark p-2 rounded-pill px-3 border border-secondary cursor-pointer shadow-sm dropdown-toggle" data-bs-toggle="dropdown">
|
||||
<img src="<?php echo getCoinIcon('BTC'); ?>" width="24" height="24" class="me-2 rounded-circle" id="to-coin-img">
|
||||
<span class="fw-bold text-white" id="to-coin-symbol">BTC</span>
|
||||
</div>
|
||||
<ul class="dropdown-menu dropdown-menu-dark bg-dark border-secondary rounded-4 shadow-lg p-2" style="max-height: 300px; overflow-y: auto;">
|
||||
<?php foreach($swap_coins as $sc): ?>
|
||||
<li><a class="dropdown-item rounded-3 py-2 d-flex align-items-center gap-2" href="#" onclick="selectCoin('to', '<?= $sc ?>', '<?= getCoinIcon($sc) ?>')">
|
||||
<img src="<?= getCoinIcon($sc) ?>" width="20" height="20"> <?= $sc ?>
|
||||
</a></li>
|
||||
<?php endforeach; ?>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4 small px-2">
|
||||
<div class="d-flex justify-content-between text-muted mb-1">
|
||||
<span>Rate</span>
|
||||
<span>1 BTC = 64,234.50 USDT</span>
|
||||
<div class="mb-4 small px-3 py-3 rounded-4" style="background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.05);">
|
||||
<div class="d-flex justify-content-between text-white opacity-50 mb-2">
|
||||
<span class="fw-medium"><?= __('rate') ?></span>
|
||||
<span id="swap-rate" class="text-white fw-bold">1 BTC ≈ 64,234.50 USDT</span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between text-muted">
|
||||
<span>Slippage Tolerance</span>
|
||||
<span>0.5%</span>
|
||||
<div class="d-flex justify-content-between text-white opacity-50 mb-2">
|
||||
<span class="fw-medium"><?= __('price_impact') ?></span>
|
||||
<span class="text-success fw-bold">< 0.01%</span>
|
||||
</div>
|
||||
<div class="d-flex justify-content-between text-white opacity-50">
|
||||
<span class="fw-medium"><?= __('slippage') ?></span>
|
||||
<span class="text-white fw-bold">0.5%</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-primary w-100 py-3 rounded-4 fw-bold fs-5">Swap Now</button>
|
||||
<button class="btn btn-primary w-100 py-3 rounded-pill fw-bold fs-5 shadow-primary transition-all active-scale" style="background: linear-gradient(135deg, #0062ff, #00d2ff); border: none;"><?= __('swap_now') ?></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const fromInput = document.querySelector('input[placeholder="0.00"]:not([readonly])');
|
||||
const toInput = document.querySelector('input[readonly]');
|
||||
const rateEl = document.getElementById('swap-rate');
|
||||
let rate = 1 / 64234.50;
|
||||
|
||||
function selectCoin(type, symbol, icon) {
|
||||
document.getElementById(type + '-coin-symbol').innerText = symbol;
|
||||
document.getElementById(type + '-coin-img').src = icon;
|
||||
// Update rate mockly
|
||||
if (symbol === 'BTC') rate = 1 / 64234.50;
|
||||
else if (symbol === 'ETH') rate = 1 / 3456.20;
|
||||
else rate = 1;
|
||||
updateCalculation();
|
||||
}
|
||||
|
||||
function switchCoins() {
|
||||
const fromSymbol = document.getElementById('from-coin-symbol').innerText;
|
||||
const fromIcon = document.getElementById('from-coin-img').src;
|
||||
const toSymbol = document.getElementById('to-coin-symbol').innerText;
|
||||
const toIcon = document.getElementById('to-coin-img').src;
|
||||
|
||||
selectCoin('from', toSymbol, toIcon);
|
||||
selectCoin('to', fromSymbol, fromIcon);
|
||||
}
|
||||
|
||||
function updateCalculation() {
|
||||
const val = parseFloat(fromInput.value) || 0;
|
||||
toInput.value = (val * rate).toFixed(8);
|
||||
const fromSymbol = document.getElementById('from-coin-symbol').innerText;
|
||||
const toSymbol = document.getElementById('to-coin-symbol').innerText;
|
||||
rateEl.innerText = `1 ${toSymbol} ≈ ${(1/rate).toLocaleString()} ${fromSymbol}`;
|
||||
}
|
||||
|
||||
fromInput.addEventListener('input', updateCalculation);
|
||||
|
||||
// Animate switch icon
|
||||
document.querySelector('.bg-primary.rounded-circle').addEventListener('click', function() {
|
||||
this.style.transform = this.style.transform === 'rotate(180deg)' ? 'rotate(0deg)' : 'rotate(180deg)';
|
||||
});
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.shadow-primary {
|
||||
box-shadow: 0 10px 25px rgba(0, 98, 255, 0.4);
|
||||
}
|
||||
.cursor-pointer { cursor: pointer; }
|
||||
#swap-rate { font-family: 'Roboto Mono', monospace; }
|
||||
.active-scale:active { transform: scale(0.98); }
|
||||
</style>
|
||||
<?php require_once __DIR__ . '/includes/footer.php'; ?>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user