File size: 3,682 Bytes
8e4579a | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 | import pandas as pd
import numpy as np
import gradio as gr
import random
# --- 1. LOGIC DỰ ĐOÁN ---
def predict_single(event_time, product_id, category_id, category_code, brand, price, user_id, user_session):
# --- ĐOẠN NÀY LÀ LOGIC GIẢ LẬP CỦA BẠN ---
# Ví dụ: trả về xác suất 85% và trạng thái "Mua"
probability = random.randint(40, 60)
label = "purchase" if probability > 50 else "not purchase"
# Thiết lập màu sắc Dynamic dựa trên kết quả
if probability >= 50:
main_color = "#00ff88" # Xanh Neon
glow_color = "rgba(0, 255, 136, 0.5)"
gradient_start = "#c75acd"
gradient_end = "#c469b8"
else:
main_color = "#ff4b2b" # Đỏ Neon
glow_color = "rgba(255, 75, 43, 0.5)"
gradient_start = "#ff4b2b"
gradient_end = "#ff416c"
# Tạo HTML cho vòng tròn phần trăm (CSS lồng vào)
html_result = f"""
<div style="
display: flex;
align-items: center;
justify-content: space-around;
padding: 30px;
background: #111827;
border-radius: 20px;
border: 2px solid {main_color};
box-shadow: 0 0 25px {glow_color};
max-width: 550px;
margin: 20px auto;
transition: all 0.5s ease;
">
<div style="position: relative; width: 130px; height: 130px; filter: drop-shadow(0 0 8px {glow_color});">
<svg viewBox="0 0 36 36" style="transform: rotate(-90deg); width: 100%; height: 100%;">
<defs>
<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:{gradient_start};stop-opacity:1" />
<stop offset="100%" style="stop-color:{gradient_end};stop-opacity:1" />
</linearGradient>
</defs>
<circle cx="18" cy="18" r="15.9155" fill="none" stroke="#2d3748" stroke-width="3" />
<circle cx="18" cy="18" r="15.9155" fill="none"
stroke="url(#grad1)"
stroke-width="3.5"
stroke-dasharray="{probability}, 100"
stroke-linecap="round"
style="transition: stroke-dasharray 1s ease-in-out;" />
</svg>
<div style="
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-family: 'Inter', sans-serif;
font-size: 22px;
font-weight: 800;
text-shadow: 0 0 10px rgba(255,255,255,0.3);
">
{probability}%
</div>
</div>
<div style="text-align: left; font-family: 'Inter', -apple-system, sans-serif;">
<p style="color: #94a3b8; margin: 0; font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 2.5px;">
Predict results
</p>
<h2 style="
color: white;
margin: 8px 0 0 0;
font-size: 38px;
font-weight: 900;
letter-spacing: -1px;
background: linear-gradient(to right, white, {main_color});
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
">
{label}
</h2>
</div>
</div>
"""
return html_result
|