File size: 3,800 Bytes
f154467
235357d
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
dad198c
 
 
235357d
 
 
 
 
 
 
 
 
 
 
783515c
5c41f19
d1bdca6
6711778
783515c
c07d010
eb20c2a
5c41f19
4c358e9
 
5c08b1a
 
 
 
dad198c
 
5c08b1a
df1915c
 
dad198c
 
 
 
 
 
 
df1915c
 
 
dad198c
 
 
 
 
 
df1915c
 
 
dad198c
 
 
 
 
 
5c41f19
c07d010
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
import gradio as gr
import plotly.graph_objects as go

# Функция для создания спидометра
def create_gauge(value):
    fig = go.Figure(go.Indicator(
        mode="gauge+number",
        value=value,
        gauge={
            'axis': {'range': [0, 100]},
            'bar': {'color': "black"},  # Цвет стрелки
            'steps': [
                {'range': [0, 40], 'color': "#55efc4"},  # Мягкий зеленый
                {'range': [40, 70], 'color': "#ffeaa7"},  # Желтый
                {'range': [70, 100], 'color': "#ff7675"}  # Мягкий красный
            ],
            'threshold': {
                'line': {'color': "black", 'width': 4},
                'thickness': 0.75,
                'value': value
            }
        },
        number={'font': {'size': 48}}  # Размер шрифта числа
    ))
    fig.update_layout(paper_bgcolor="#f8f9fa",
                      font={'color': "#2d3436", 'family': "Arial"},
                      width=200, height=150, margin=dict(l=20, r=20, t=20, b=20))
    return fig

# Значения для спидометров
def get_success_forecast_1():
    return create_gauge(76)

def get_success_forecast_2():
    return create_gauge(85)

def get_success_forecast_3():
    return create_gauge(62)

# Функция для смены вкладки
def change_tab(id):
    return gr.Tabs(selected=id)

with gr.Blocks() as demo:
    with gr.Tabs() as tabs:
        
        # Вкладка 4: Проверка
        with gr.TabItem("Проверка", id=3):
            
            # Заголовки столбцов
            with gr.Row():
                gr.Markdown("")
                gr.Markdown("### Корректор")
                gr.Markdown("### Аналитик")
                
            # Первый ряд
            with gr.Row():
                personalized_message_1 = gr.Textbox(label="Персонализированное сообщение 1", lines=4)
                check_message_1 = gr.Textbox(label="Проверка сообщения 1", lines=4)
                # Центрируем спидометр только в правом столбце
                with gr.Column():
                    gr.HTML("<div style='display:flex; justify-content:center; width:100%;'>")
                    success_forecast_1 = gr.Plot(value=get_success_forecast_1(), label="Прогноз успешности сообщения 1")
                    gr.HTML("</div>")
            
            # Второй ряд
            with gr.Row():
                personalized_message_2 = gr.Textbox(label="Персонализированное сообщение 2", lines=4)
                check_message_2 = gr.Textbox(label="Проверка сообщения 2", lines=4)
                with gr.Column():
                    gr.HTML("<div style='display:flex; justify-content:center; width:100%;'>")
                    success_forecast_2 = gr.Plot(value=get_success_forecast_2(), label="Прогноз успешности сообщения 2")
                    gr.HTML("</div>")
            
            # Третий ряд
            with gr.Row():
                personalized_message_3 = gr.Textbox(label="Персонализированное сообщение 3", lines=4)
                check_message_3 = gr.Textbox(label="Проверка сообщения 3", lines=4)
                with gr.Column():
                    gr.HTML("<div style='display:flex; justify-content:center; width:100%;'>")
                    success_forecast_3 = gr.Plot(value=get_success_forecast_3(), label="Прогноз успешности сообщения 3")
                    gr.HTML("</div>")

demo.launch()