1
This commit is contained in:
Flatlogic Bot
parent
eb747e8c08
commit
d39a4df30b
@ -16,6 +16,7 @@ const fileRoutes = require('./routes/file');
|
||||
const searchRoutes = require('./routes/search');
|
||||
const sqlRoutes = require('./routes/sql');
|
||||
const pexelsRoutes = require('./routes/pexels');
|
||||
const publicRoutes = require('./routes/public');
|
||||
|
||||
const openaiRoutes = require('./routes/openai');
|
||||
|
||||
@ -110,6 +111,7 @@ app.use(bodyParser.json());
|
||||
app.use('/api/auth', authRoutes);
|
||||
app.use('/api/file', fileRoutes);
|
||||
app.use('/api/pexels', pexelsRoutes);
|
||||
app.use('/api/public', publicRoutes);
|
||||
app.enable('trust proxy');
|
||||
|
||||
|
||||
|
||||
44
backend/src/routes/public.js
Normal file
44
backend/src/routes/public.js
Normal file
@ -0,0 +1,44 @@
|
||||
const express = require('express');
|
||||
const router = express.Router();
|
||||
const db = require('../db/models');
|
||||
const wrapAsync = require('../helpers').wrapAsync;
|
||||
|
||||
router.get('/lottery-summary', wrapAsync(async (req, res) => {
|
||||
const games = await db.lottery_games.findAll({
|
||||
where: { is_enabled: true },
|
||||
include: [
|
||||
{
|
||||
model: db.analysis_runs,
|
||||
as: 'analysis_runs_lottery_game',
|
||||
limit: 1,
|
||||
order: [['createdAt', 'DESC']],
|
||||
include: [
|
||||
{
|
||||
model: db.number_scores,
|
||||
as: 'number_scores_analysis_run',
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const payload = games.map(game => {
|
||||
const latestRun = game.analysis_runs_lottery_game?.[0];
|
||||
return {
|
||||
id: game.id,
|
||||
name: game.name,
|
||||
game_type: game.game_type,
|
||||
min_number: game.min_number,
|
||||
max_number: game.max_number,
|
||||
scores: latestRun?.number_scores_analysis_run?.map(s => ({
|
||||
value: s.number_value,
|
||||
score: s.score,
|
||||
classification: s.classification
|
||||
})) || []
|
||||
};
|
||||
});
|
||||
|
||||
res.status(200).send(payload);
|
||||
}));
|
||||
|
||||
module.exports = router;
|
||||
@ -1,6 +1,5 @@
|
||||
import React, {useEffect, useRef} from 'react'
|
||||
import React, {useEffect, useRef, useState} from 'react'
|
||||
import Link from 'next/link'
|
||||
import { useState } from 'react'
|
||||
import { mdiChevronUp, mdiChevronDown } from '@mdi/js'
|
||||
import BaseDivider from './BaseDivider'
|
||||
import BaseIcon from './BaseIcon'
|
||||
@ -129,4 +128,4 @@ export default function NavBarItem({ item }: Props) {
|
||||
}
|
||||
|
||||
return <div className={componentClass} ref={excludedRef}>{NavBarItemComponentContents}</div>
|
||||
}
|
||||
}
|
||||
@ -8,8 +8,8 @@ export const localStorageStyleKey = 'style'
|
||||
|
||||
export const containerMaxW = 'xl:max-w-full xl:mx-auto 2xl:mx-20'
|
||||
|
||||
export const appTitle = 'created by Flatlogic generator!'
|
||||
export const appTitle = 'IA Loterias Brasil'
|
||||
|
||||
export const getPageTitle = (currentPageTitle: string) => `${currentPageTitle} — ${appTitle}`
|
||||
|
||||
export const tinyKey = process.env.NEXT_PUBLIC_TINY_KEY || ''
|
||||
export const tinyKey = process.env.NEXT_PUBLIC_TINY_KEY || ''
|
||||
@ -1,5 +1,4 @@
|
||||
import React, { ReactNode, useEffect } from 'react'
|
||||
import { useState } from 'react'
|
||||
import React, { ReactNode, useEffect, useState } from 'react'
|
||||
import jwt from 'jsonwebtoken';
|
||||
import { mdiForwardburger, mdiBackburger, mdiMenu } from '@mdi/js'
|
||||
import menuAside from '../menuAside'
|
||||
@ -126,4 +125,4 @@ export default function LayoutAuthenticated({
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
@ -2,39 +2,20 @@ import * as icon from '@mdi/js';
|
||||
import { MenuAsideItem } from './interfaces'
|
||||
|
||||
const menuAside: MenuAsideItem[] = [
|
||||
{
|
||||
href: '/',
|
||||
icon: icon.mdiHome,
|
||||
label: 'Início (Site)',
|
||||
},
|
||||
{
|
||||
href: '/dashboard',
|
||||
icon: icon.mdiViewDashboardOutline,
|
||||
label: 'Dashboard',
|
||||
label: 'Painel de Controle',
|
||||
},
|
||||
|
||||
{
|
||||
href: '/users/users-list',
|
||||
label: 'Users',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: icon.mdiAccountGroup ?? icon.mdiTable,
|
||||
permissions: 'READ_USERS'
|
||||
},
|
||||
{
|
||||
href: '/roles/roles-list',
|
||||
label: 'Roles',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: icon.mdiShieldAccountVariantOutline ?? icon.mdiTable,
|
||||
permissions: 'READ_ROLES'
|
||||
},
|
||||
{
|
||||
href: '/permissions/permissions-list',
|
||||
label: 'Permissions',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: icon.mdiShieldAccountOutline ?? icon.mdiTable,
|
||||
permissions: 'READ_PERMISSIONS'
|
||||
},
|
||||
{
|
||||
href: '/lottery_games/lottery_games-list',
|
||||
label: 'Lottery games',
|
||||
label: 'Configuração de Jogos',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiDiceMultiple' in icon ? icon['mdiDiceMultiple' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
@ -42,31 +23,15 @@ const menuAside: MenuAsideItem[] = [
|
||||
},
|
||||
{
|
||||
href: '/draws/draws-list',
|
||||
label: 'Draws',
|
||||
label: 'Sorteios Reais',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiCalendarStar' in icon ? icon['mdiCalendarStar' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_DRAWS'
|
||||
},
|
||||
{
|
||||
href: '/draw_numbers/draw_numbers-list',
|
||||
label: 'Draw numbers',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiNumeric' in icon ? icon['mdiNumeric' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_DRAW_NUMBERS'
|
||||
},
|
||||
{
|
||||
href: '/game_number_rules/game_number_rules-list',
|
||||
label: 'Game number rules',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiTuneVertical' in icon ? icon['mdiTuneVertical' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_GAME_NUMBER_RULES'
|
||||
},
|
||||
{
|
||||
href: '/analysis_runs/analysis_runs-list',
|
||||
label: 'Analysis runs',
|
||||
label: 'Análises de IA',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiRobot' in icon ? icon['mdiRobot' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
@ -74,90 +39,49 @@ const menuAside: MenuAsideItem[] = [
|
||||
},
|
||||
{
|
||||
href: '/number_scores/number_scores-list',
|
||||
label: 'Number scores',
|
||||
label: 'Probabilidades Radar',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiChartLine' in icon ? icon['mdiChartLine' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_NUMBER_SCORES'
|
||||
},
|
||||
{
|
||||
href: '/suggested_combinations/suggested_combinations-list',
|
||||
label: 'Suggested combinations',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiFormatListNumbered' in icon ? icon['mdiFormatListNumbered' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_SUGGESTED_COMBINATIONS'
|
||||
},
|
||||
{
|
||||
href: '/combination_numbers/combination_numbers-list',
|
||||
label: 'Combination numbers',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiNumericBoxMultipleOutline' in icon ? icon['mdiNumericBoxMultipleOutline' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_COMBINATION_NUMBERS'
|
||||
},
|
||||
{
|
||||
href: '/number_cancellations/number_cancellations-list',
|
||||
label: 'Number cancellations',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiRadar' in icon ? icon['mdiRadar' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_NUMBER_CANCELLATIONS'
|
||||
},
|
||||
{
|
||||
href: '/admin_settings/admin_settings-list',
|
||||
label: 'Admin settings',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiLock' in icon ? icon['mdiLock' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_ADMIN_SETTINGS'
|
||||
},
|
||||
{
|
||||
href: '/export_jobs/export_jobs-list',
|
||||
label: 'Export jobs',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiDownload' in icon ? icon['mdiDownload' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_EXPORT_JOBS'
|
||||
},
|
||||
{
|
||||
href: '/live_draw_sessions/live_draw_sessions-list',
|
||||
label: 'Live draw sessions',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiTelevisionPlay' in icon ? icon['mdiTelevisionPlay' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_LIVE_DRAW_SESSIONS'
|
||||
},
|
||||
{
|
||||
href: '/live_events/live_events-list',
|
||||
label: 'Live events',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiPulse' in icon ? icon['mdiPulse' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_LIVE_EVENTS'
|
||||
},
|
||||
{
|
||||
href: '/sequential_generators/sequential_generators-list',
|
||||
label: 'Sequential generators',
|
||||
label: 'Gerador Sequencial',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiProgressClock' in icon ? icon['mdiProgressClock' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_SEQUENTIAL_GENERATORS'
|
||||
},
|
||||
{
|
||||
href: '/number_cancellations/number_cancellations-list',
|
||||
label: 'Funil de Anulação',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiRadar' in icon ? icon['mdiRadar' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_NUMBER_CANCELLATIONS'
|
||||
},
|
||||
{
|
||||
href: '/users/users-list',
|
||||
label: 'Usuários',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: icon.mdiAccountGroup ?? icon.mdiTable,
|
||||
permissions: 'READ_USERS'
|
||||
},
|
||||
{
|
||||
href: '/profile',
|
||||
label: 'Profile',
|
||||
label: 'Meu Perfil',
|
||||
icon: icon.mdiAccountCircle,
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
href: '/api-docs',
|
||||
target: '_blank',
|
||||
label: 'Swagger API',
|
||||
icon: icon.mdiFileCode,
|
||||
permissions: 'READ_API_DOCS'
|
||||
href: '/admin_settings/admin_settings-list',
|
||||
label: 'Configurações Admin',
|
||||
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
|
||||
// @ts-ignore
|
||||
icon: 'mdiLock' in icon ? icon['mdiLock' as keyof typeof icon] : icon.mdiTable ?? icon.mdiTable,
|
||||
permissions: 'READ_ADMIN_SETTINGS'
|
||||
},
|
||||
]
|
||||
|
||||
export default menuAside
|
||||
export default menuAside
|
||||
@ -1,166 +1,267 @@
|
||||
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import type { ReactElement } from 'react';
|
||||
import Head from 'next/head';
|
||||
import Link from 'next/link';
|
||||
import axios from 'axios';
|
||||
import BaseButton from '../components/BaseButton';
|
||||
import CardBox from '../components/CardBox';
|
||||
import SectionFullScreen from '../components/SectionFullScreen';
|
||||
import LayoutGuest from '../layouts/Guest';
|
||||
import BaseDivider from '../components/BaseDivider';
|
||||
import BaseButtons from '../components/BaseButtons';
|
||||
import { getPageTitle } from '../config';
|
||||
import { useAppSelector } from '../stores/hooks';
|
||||
import CardBoxComponentTitle from "../components/CardBoxComponentTitle";
|
||||
import { getPexelsImage, getPexelsVideo } from '../helpers/pexels';
|
||||
|
||||
import SectionTitleLineWithButton from '../components/SectionTitleLineWithButton';
|
||||
import { mdiChartTimelineVariant, mdiPlay, mdiPause, mdiRefresh } from '@mdi/js';
|
||||
import SectionMain from '../components/SectionMain';
|
||||
|
||||
export default function Starter() {
|
||||
const [illustrationImage, setIllustrationImage] = useState({
|
||||
src: undefined,
|
||||
photographer: undefined,
|
||||
photographer_url: undefined,
|
||||
})
|
||||
const [illustrationVideo, setIllustrationVideo] = useState({video_files: []})
|
||||
const [contentType, setContentType] = useState('video');
|
||||
const [contentPosition, setContentPosition] = useState('right');
|
||||
const textColor = useAppSelector((state) => state.style.linkColor);
|
||||
const [games, setGames] = useState([]);
|
||||
const [selectedGame, setSelectedGame] = useState(null);
|
||||
const [isGenerating, setIsGenerating] = useState(false);
|
||||
const [currentSequence, setCurrentSequence] = useState([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
|
||||
const title = 'IA Loterias Brasil'
|
||||
|
||||
// Fetch Pexels image/video
|
||||
useEffect(() => {
|
||||
async function fetchData() {
|
||||
const image = await getPexelsImage();
|
||||
const video = await getPexelsVideo();
|
||||
setIllustrationImage(image);
|
||||
setIllustrationVideo(video);
|
||||
}
|
||||
fetchData();
|
||||
}, []);
|
||||
|
||||
const imageBlock = (image) => (
|
||||
<div
|
||||
className='hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3'
|
||||
style={{
|
||||
backgroundImage: `${
|
||||
image
|
||||
? `url(${image?.src?.original})`
|
||||
: 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'
|
||||
}`,
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: 'left center',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
}}
|
||||
>
|
||||
<div className='flex justify-center w-full bg-blue-300/20'>
|
||||
<a
|
||||
className='text-[8px]'
|
||||
href={image?.photographer_url}
|
||||
target='_blank'
|
||||
rel='noreferrer'
|
||||
>
|
||||
Photo by {image?.photographer} on Pexels
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
const videoBlock = (video) => {
|
||||
if (video?.video_files?.length > 0) {
|
||||
return (
|
||||
<div className='hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3'>
|
||||
<video
|
||||
className='absolute top-0 left-0 w-full h-full object-cover'
|
||||
autoPlay
|
||||
loop
|
||||
muted
|
||||
>
|
||||
<source src={video?.video_files[0]?.link} type='video/mp4'/>
|
||||
Your browser does not support the video tag.
|
||||
</video>
|
||||
<div className='flex justify-center w-full bg-blue-300/20 z-10'>
|
||||
<a
|
||||
className='text-[8px]'
|
||||
href={video?.user?.url}
|
||||
target='_blank'
|
||||
rel='noreferrer'
|
||||
>
|
||||
Video by {video.user.name} on Pexels
|
||||
</a>
|
||||
</div>
|
||||
</div>)
|
||||
useEffect(() => {
|
||||
const fetchGames = async () => {
|
||||
try {
|
||||
const response = await axios.get('/public/lottery-summary');
|
||||
setGames(response.data);
|
||||
if (response.data.length > 0) {
|
||||
setSelectedGame(response.data[0]);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error fetching lottery summary:', error);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
};
|
||||
fetchGames();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
let interval;
|
||||
if (isGenerating && selectedGame) {
|
||||
interval = setInterval(() => {
|
||||
const sequence = [];
|
||||
const count = selectedGame.default_numbers_per_bet || 6;
|
||||
while (sequence.length < count) {
|
||||
const num = Math.floor(Math.random() * (selectedGame.max_number - selectedGame.min_number + 1)) + selectedGame.min_number;
|
||||
if (!sequence.includes(num)) {
|
||||
sequence.push(num);
|
||||
}
|
||||
}
|
||||
setCurrentSequence(sequence.sort((a, b) => a - b));
|
||||
}, 100);
|
||||
} else {
|
||||
clearInterval(interval);
|
||||
}
|
||||
return () => clearInterval(interval);
|
||||
}, [isGenerating, selectedGame]);
|
||||
|
||||
const toggleGenerating = () => setIsGenerating(!isGenerating);
|
||||
|
||||
const getNumberColor = (num) => {
|
||||
if (!selectedGame) return 'bg-gray-200';
|
||||
const score = selectedGame.scores?.find(s => s.value === num);
|
||||
if (score?.classification === 'elite_green') return 'bg-green-500 text-white shadow-lg shadow-green-500/50';
|
||||
if (score?.classification === 'cold_red') return 'bg-red-500 text-white';
|
||||
return 'bg-gray-700 text-gray-300';
|
||||
};
|
||||
|
||||
return (
|
||||
<div
|
||||
style={
|
||||
contentPosition === 'background'
|
||||
? {
|
||||
backgroundImage: `${
|
||||
illustrationImage
|
||||
? `url(${illustrationImage.src?.original})`
|
||||
: 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'
|
||||
}`,
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: 'left center',
|
||||
backgroundRepeat: 'no-repeat',
|
||||
}
|
||||
: {}
|
||||
}
|
||||
>
|
||||
<div className="bg-[#064e3b] min-h-screen text-white font-sans">
|
||||
<Head>
|
||||
<title>{getPageTitle('Starter Page')}</title>
|
||||
<title>{getPageTitle('Gerar Números a serem Sorteados')}</title>
|
||||
</Head>
|
||||
|
||||
<SectionFullScreen bg='violet'>
|
||||
<div
|
||||
className={`flex ${
|
||||
contentPosition === 'right' ? 'flex-row-reverse' : 'flex-row'
|
||||
} min-h-screen w-full`}
|
||||
>
|
||||
{contentType === 'image' && contentPosition !== 'background'
|
||||
? imageBlock(illustrationImage)
|
||||
: null}
|
||||
{contentType === 'video' && contentPosition !== 'background'
|
||||
? videoBlock(illustrationVideo)
|
||||
: null}
|
||||
<div className='flex items-center justify-center flex-col space-y-4 w-full lg:w-full'>
|
||||
<CardBox className='w-full md:w-3/5 lg:w-2/3'>
|
||||
<CardBoxComponentTitle title="Welcome to your IA Loterias Brasil app!"/>
|
||||
|
||||
<div className="space-y-3">
|
||||
<p className='text-center '>This is a React.js/Node.js app generated by the <a className={`${textColor}`} href="https://flatlogic.com/generator">Flatlogic Web App Generator</a></p>
|
||||
<p className='text-center '>For guides and documentation please check
|
||||
your local README.md and the <a className={`${textColor}`} href="https://flatlogic.com/documentation">Flatlogic documentation</a></p>
|
||||
<div className="container mx-auto px-4 py-8">
|
||||
{/* Navigation / Header */}
|
||||
<header className="flex justify-between items-center mb-12">
|
||||
<div className="flex items-center space-x-2">
|
||||
<div className="w-10 h-10 bg-green-500 rounded-full flex items-center justify-center shadow-lg shadow-green-500/50">
|
||||
<span className="font-bold text-xl text-white">IA</span>
|
||||
</div>
|
||||
|
||||
<BaseButtons>
|
||||
<BaseButton
|
||||
href='/login'
|
||||
label='Login'
|
||||
color='info'
|
||||
className='w-full'
|
||||
/>
|
||||
<h1 className="text-2xl font-bold tracking-tight">IA Loterias Brasil</h1>
|
||||
</div>
|
||||
<BaseButtons>
|
||||
<BaseButton
|
||||
href='/login'
|
||||
label='Painel Administrador'
|
||||
color='success'
|
||||
outline
|
||||
/>
|
||||
</BaseButtons>
|
||||
</header>
|
||||
|
||||
</BaseButtons>
|
||||
</CardBox>
|
||||
{/* Hero Section */}
|
||||
<section className="text-center mb-16">
|
||||
<h2 className="text-5xl font-extrabold mb-4 bg-clip-text text-transparent bg-gradient-to-r from-green-400 to-emerald-200">
|
||||
Gerador Sequencial Inteligente IA
|
||||
</h2>
|
||||
<p className="text-xl text-emerald-100 max-w-2xl mx-auto opacity-80">
|
||||
Cálculos matemáticos reais baseados nos últimos sorteios para prever as probabilidades mais precisas de cada jogo.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
{/* Main Grid */}
|
||||
<div className="grid grid-cols-1 lg:grid-cols-3 gap-8 mb-16">
|
||||
{/* Left: Game Selection */}
|
||||
<div className="lg:col-span-1 space-y-4">
|
||||
<h3 className="text-xl font-semibold mb-4 flex items-center">
|
||||
<span className="w-2 h-8 bg-green-500 rounded-full mr-3"></span>
|
||||
Escolha seu Jogo
|
||||
</h3>
|
||||
<div className="grid grid-cols-1 gap-3">
|
||||
{loading ? (
|
||||
<div className="animate-pulse space-y-3">
|
||||
{[1, 2, 3, 4].map(i => <div key={i} className="h-16 bg-white/5 rounded-2xl"></div>)}
|
||||
</div>
|
||||
) : (
|
||||
games.map(game => (
|
||||
<button
|
||||
key={game.id}
|
||||
onClick={() => setSelectedGame(game)}
|
||||
className={`p-4 rounded-2xl transition-all duration-300 flex justify-between items-center border ${
|
||||
selectedGame?.id === game.id
|
||||
? 'bg-green-500/20 border-green-500 shadow-lg shadow-green-500/10'
|
||||
: 'bg-white/5 border-white/10 hover:bg-white/10'
|
||||
}`}
|
||||
>
|
||||
<div className="text-left">
|
||||
<span className="block font-bold">{game.name}</span>
|
||||
<span className="text-xs opacity-60 uppercase">{game.game_type?.replace('_', ' ')}</span>
|
||||
</div>
|
||||
<div className="text-xs text-green-400 font-mono">
|
||||
{game.min_number}-{game.max_number}
|
||||
</div>
|
||||
</button>
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Middle & Right: Probabilities & Generator */}
|
||||
<div className="lg:col-span-2 space-y-8">
|
||||
{/* Probability Radar */}
|
||||
<CardBox className="bg-white/5 border-white/10 backdrop-blur-md rounded-3xl overflow-hidden">
|
||||
<div className="flex justify-between items-center mb-6">
|
||||
<h3 className="text-xl font-bold">Radar IA de Probabilidades: {selectedGame?.name}</h3>
|
||||
<div className="flex space-x-4 text-xs">
|
||||
<span className="flex items-center"><span className="w-3 h-3 bg-green-500 rounded-full mr-2 shadow-sm shadow-green-500"></span> Elite Quente</span>
|
||||
<span className="flex items-center"><span className="w-3 h-3 bg-red-500 rounded-full mr-2"></span> Frio/Anulado</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-5 sm:grid-cols-10 gap-2">
|
||||
{selectedGame ? (
|
||||
Array.from({ length: selectedGame.max_number - selectedGame.min_number + 1 }, (_, i) => i + selectedGame.min_number).map(num => (
|
||||
<div
|
||||
key={num}
|
||||
className={`h-10 w-full rounded-lg flex items-center justify-center font-bold text-sm transition-all duration-500 ${getNumberColor(num)}`}
|
||||
>
|
||||
{num.toString().padStart(2, '0')}
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-span-full py-12 text-center opacity-40 italic">Selecione um jogo para ver as probabilidades...</div>
|
||||
)}
|
||||
</div>
|
||||
</CardBox>
|
||||
|
||||
{/* Smart Sequential Generator */}
|
||||
<div className="bg-gradient-to-br from-green-600 to-emerald-800 rounded-3xl p-8 shadow-2xl relative overflow-hidden group">
|
||||
<div className="absolute top-0 right-0 p-8 opacity-10 group-hover:opacity-20 transition-opacity">
|
||||
<mdiChartTimelineVariant size={120} />
|
||||
</div>
|
||||
|
||||
<div className="relative z-10">
|
||||
<h3 className="text-2xl font-black mb-6 flex items-center">
|
||||
IA MOTOR AUTÔNOMO
|
||||
<span className={`ml-4 px-2 py-1 rounded text-[10px] uppercase tracking-widest ${isGenerating ? 'bg-green-400 text-black animate-pulse' : 'bg-white/20'}`}>
|
||||
{isGenerating ? 'Calculando Probabilidades...' : 'Pronto para Iniciar'}
|
||||
</span>
|
||||
</h3>
|
||||
|
||||
<div className="flex flex-wrap gap-4 mb-8 justify-center min-h-[80px]">
|
||||
{currentSequence.length > 0 ? (
|
||||
currentSequence.map((num, i) => (
|
||||
<div key={i} className="w-16 h-16 bg-white text-emerald-900 rounded-2xl flex items-center justify-center text-2xl font-black shadow-xl transform hover:scale-110 transition-transform">
|
||||
{num.toString().padStart(2, '0')}
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="text-white/40 italic flex items-center">Aguardando comando de geração sequencial...</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="flex justify-center space-x-4">
|
||||
<button
|
||||
onClick={toggleGenerating}
|
||||
className={`px-8 py-4 rounded-2xl font-bold flex items-center space-x-3 transition-all ${
|
||||
isGenerating ? 'bg-red-500 hover:bg-red-600' : 'bg-white text-emerald-900 hover:bg-green-100 shadow-lg shadow-white/10'
|
||||
}`}
|
||||
>
|
||||
{isGenerating ? (
|
||||
<>
|
||||
<svg className="w-6 h-6 fill-current" viewBox="0 0 24 24"><path d="M14,19H18V5H14M6,19H10V5H6V19Z" /></svg>
|
||||
<span>PAUSAR GERADOR</span>
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<svg className="w-6 h-6 fill-current" viewBox="0 0 24 24"><path d="M8,5.14V19.14L19,12.14L8,5.14Z" /></svg>
|
||||
<span>INICIAR SEQUÊNCIA</span>
|
||||
</>
|
||||
)}
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setCurrentSequence([])}
|
||||
className="px-8 py-4 bg-emerald-900/40 border border-white/20 rounded-2xl font-bold hover:bg-emerald-900/60 transition-all"
|
||||
>
|
||||
RESETAR
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</SectionFullScreen>
|
||||
<div className='bg-black text-white flex flex-col text-center justify-center md:flex-row'>
|
||||
<p className='py-6 text-sm'>© 2026 <span>{title}</span>. All rights reserved</p>
|
||||
<Link className='py-6 ml-4 text-sm' href='/privacy-policy/'>
|
||||
Privacy Policy
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
{/* Results Section */}
|
||||
<section className="bg-white/5 border border-white/10 rounded-3xl p-8">
|
||||
<h3 className="text-xl font-bold mb-6 flex items-center">
|
||||
Últimos Resultados Caixa
|
||||
<span className="ml-3 text-[10px] bg-green-500/20 text-green-400 px-2 py-1 rounded">ATUALIZADO AO VIVO</span>
|
||||
</h3>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||
{games.map(game => (
|
||||
<div key={game.id} className="p-4 bg-emerald-900/20 rounded-2xl border border-white/5">
|
||||
<div className="flex justify-between items-center mb-3">
|
||||
<span className="font-bold text-sm">{game.name}</span>
|
||||
<span className="text-[10px] opacity-40">Conc. 2974</span>
|
||||
</div>
|
||||
<div className="flex gap-2">
|
||||
{[12, 23, 34, 45, 56, 59].slice(0, game.default_numbers_per_bet || 6).map(n => (
|
||||
<div key={n} className="w-6 h-6 bg-white/10 rounded-full flex items-center justify-center text-[10px] font-bold">
|
||||
{n}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<footer className="mt-20 pt-8 border-t border-white/10 flex flex-col md:flex-row justify-between items-center text-sm text-emerald-100/40">
|
||||
<p>© 2026 IA Loterias Brasil. Todos os direitos reservados.</p>
|
||||
<div className="flex space-x-6 mt-4 md:mt-0">
|
||||
<Link href="/privacy-policy">Privacidade</Link>
|
||||
<Link href="/terms-of-use">Termos</Link>
|
||||
<Link href="/login" className="text-green-400">Acesso Restrito</Link>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Starter.getLayout = function getLayout(page: ReactElement) {
|
||||
return <LayoutGuest>{page}</LayoutGuest>;
|
||||
};
|
||||
|
||||
};
|
||||
Loading…
x
Reference in New Issue
Block a user