Update app.py

app.py

@@ -1,15 +1,18 @@
 import time
 import gradio as gr
 
-# -------------------- 모델/로직 --------------------
+# ----- 고정 기본값(화면에는 노출 안 함) -----
 DEFAULTS = dict(
-    Hn=8.0, Qn=3.5,
-    rain_thr=40.0,   # 고유량 판정 강수량 (mm/24h)
-    dp_limit=3.0,    # 트래시랙 허용 한계 (kPa) -> 정비
-    soc_limit=90.0,  # ESS SoC 허용 한계 (%) -> 정비
-    rho=1000.0, g=9.80665
+    Hn=8.0,       # 기준 낙차 (m)
+    Qn=3.5,       # 기준 유량 (m3/s)
+    rain_thr=40.0,# 고유량 판정 강수량 (mm/24h)
+    dp_limit=3.0, # 트래시랙 허용 한계 (kPa) -> 정비
+    soc_limit=90.0, # ESS SoC 허용 한계 (%) -> 정비
+    rho=1000.0,
+    g=9.80665
 )
 
+# ====== 계산 로직 ======
 def electrical_power_kw(Q, H, eta, rho=DEFAULTS["rho"], g=DEFAULTS["g"]):
     if Q <= 0 or H <= 0 or eta <= 0:
         return 0.0
@@ -69,31 +72,35 @@ def mode_badge(mode:str)->str:
     col=colors.get(mode,"#6b7280")
     icon = "●" if mode!="정비" else "⚠️"
     return f"""
-    <div style="padding:6px 10px;border-radius:10px;background:{col};
-                color:#fff;font-weight:800;display:inline-flex;gap:8px;align-items:center;font-size:13px">
-      <span>{icon}</span><span>{'정비 모드' if mode=='정비' else '운전 모드 : '+mode}</span>
+    <div style="padding:12px 16px;border-radius:14px;background:{col};
+                color:#fff;font-weight:800;display:inline-flex;gap:10px;align-items:center;font-size:18px">
+      <span style="font-size:18px">{icon}</span><span>{'정비 모드' if mode=='정비' else '운전 모드 : '+mode}</span>
     </div>"""
 
-# 초소형 도넛(110px) — 숫자 가독성 보강
+# --- 더 크게 보이도록 도넛 게이지 확대 ---
 def donut(label:str, value:float, maxv:float, unit:str=""):
     disp_val = round(float(value), 1)
     maxv = max(1e-6, float(maxv))
     pct = max(0.0, min(float(value)/maxv, 1.0))
-    size, r, stroke = 110, 44, 12
+
+    size = 220  # ↑ 확대
+    r = 86
+    stroke = 18
     C = 2*3.14159*r
     offset = C*(1-pct)
+
     return f"""
-    <div style="display:flex;flex-direction:column;align-items:center;gap:6px;">
+    <div style="display:flex;flex-direction:column;align-items:center;gap:12px;">
       <svg width="{size}" height="{size}" viewBox="0 0 {size} {size}">
         <circle cx="{size/2}" cy="{size/2}" r="{r}" stroke="#e5e7eb" stroke-width="{stroke}" fill="none"/>
         <circle cx="{size/2}" cy="{size/2}" r="{r}" stroke="#3b82f6" stroke-width="{stroke}" fill="none"
                 stroke-dasharray="{C:.1f}" stroke-dashoffset="{offset:.1f}"
                 stroke-linecap="round" transform="rotate(-90 {size/2} {size/2})"/>
-        <text x="{size/2}" y="{size/2 - 3}" text-anchor="middle" dominant-baseline="middle"
-              font-size="18" font-weight="800"
-              fill="#ffffff" stroke="#111111" stroke-width="1.3" paint-order="stroke">{disp_val:.1f}{unit}</text>
-        <text x="{size/2}" y="{size/2 + 14}" text-anchor="middle" dominant-baseline="middle"
-              font-size="11" fill="#64748b">{label}</text>
+        <text x="{size/2}" y="{size/2 - 6}" text-anchor="middle" dominant-baseline="middle"
+              font-size="30" font-weight="800"
+              fill="#ffffff" stroke="#111111" stroke-width="2" paint-order="stroke">{disp_val:.1f}{unit}</text>
+        <text x="{size/2}" y="{size/2 + 28}" text-anchor="middle" dominant-baseline="middle"
+              font-size="15" fill="#64748b">{label}</text>
       </svg>
     </div>"""
 
@@ -101,163 +108,143 @@ def chip(label:str, on:bool, on_color="#10b981"):
     bg=on_color if on else "#e5e7eb"
     fg="#fff" if on else "#111827"
     txt="ON" if on else "OFF"
-    return f"""<div style="padding:4px 8px;border-radius:999px;background:{bg};color:{fg};
-                     font-size:11px;font-weight:700;display:inline-block;">{label}: {txt}</div>"""
+    return f"""<div style="padding:8px 12px;border-radius:999px;background:{bg};color:{fg};
+                     font-size:13px;font-weight:700;display:inline-block;">{label}: {txt}</div>"""
 
 def action_box(mode:str)->str:
     if mode=="정비":
-        body="""<b>발전 중지</b> · <b>정비 필요</b>"""
+        body="""<ul style="margin:0;padding:0;list-style:disc inside;font-size:15px">
+                  <li style="color:#000"><b>발전 중지</b></li>
+                  <li style="color:#000"><b>정비 필요</b></li>
+                </ul>"""
         style='border:1px solid #fecaca;background:#fef2f2;'
     elif mode=="고유량":
-        body='<b>출력 제한</b> · <b>바이패스</b>'
+        body='<div style="color:#000;font-size:15px"><b>출력 제한·바이패스 병행</b></div>'
         style='border:1px solid #fde68a;background:#fffbeb;'
     elif mode=="저유량":
-        body='<b>출력 축소</b> · <b>효율 최적화</b>'
+        body='<div style="color:#000;font-size:15px"><b>출력 축소·효율 최적화</b></div>'
         style='border:1px solid #e5e7eb;background:#f9fafb;'
     else:
-        body='<b>효율 최적��� 운전</b>'
+        body='<div style="color:#000;font-size:15px"><b>효율 최적점 운전</b></div>'
         style='border:1px solid #e5e7eb;background:#f9fafb;'
-    return f"""<div style="padding:8px 10px;border-radius:8px;{style};font-size:12px">{body}</div>"""
+    return f"""<div style="padding:14px 16px;border-radius:10px;{style}">{body}</div>"""
 
 MODE_COLOR = {"정상":"#16a34a","저유량":"#eab308","고유량":"#f59e0b","정비":"#dc2626"}
 
-def _evaluate(Q_in, rain_mm, dp_kpa, soc_pct, Hn, Qn, rain_thr, dp_limit, soc_limit):
+def _evaluate(Q_in, rain_mm, dp_kpa, soc_pct,
+              Hn=DEFAULTS["Hn"], Qn=DEFAULTS["Qn"],
+              rain_thr=DEFAULTS["rain_thr"], dp_limit=DEFAULTS["dp_limit"], soc_limit=DEFAULTS["soc_limit"]):
     mode = decide_mode(Q_in, Qn, rain_mm, dp_kpa, soc_pct, rain_thr, dp_limit, soc_limit)
     st = mode_policy(mode, Q_in, Qn, Hn)
     p_ref = electrical_power_kw(Qn, Hn, 0.9)
 
     header = mode_badge(mode)
-    donuts = f"""<div style="display:flex;gap:16px;align-items:center">
+    donuts = f"""<div style="display:flex;gap:40px;flex-wrap:wrap;align-items:center">
                    {donut("효율(η)", st['eta']*100, 100, "%")}
                    {donut("출력(kW)", st['p_kw'], max(1.0, p_ref), " kW")}
                  </div>"""
 
-    chips = f"""<div style="display:flex;gap:6px;flex-wrap:wrap">
+    chips = f"""<div style="display:flex;gap:10px;flex-wrap:wrap">
                   {chip("출력 제한", st['curtail'])}
                   {chip("바이패스", st['bypass'])}
                   {chip("정비 필요", st['service'], on_color="#ef4444")}
                 </div>"""
 
     color = MODE_COLOR.get(mode, "#111827")
-    summary = (f"<div style='font-size:12px;line-height:1.35'>"
-               f"<b style='color:{color}'>현재 모드: {mode}</b> · "
-               f"Q={Q_in:.1f} m³/s (Qₙ={Qn:.1f}) · "
-               f"강수={rain_mm:.1f} (≤{rain_thr:.1f}) · "
-               f"트래시랙={dp_kpa:.1f} kPa (≤{dp_limit:.1f}) · "
-               f"SoC={soc_pct:.1f}% (≤{soc_limit:.1f}%)</div>")
-
-    right = f"""
-      <div style="display:flex;flex-direction:column;gap:8px">
-        {header}
-        {donuts}
-        {chips}
-        {action_box(mode)}
-        {summary}
-      </div>
-    """
-    return summary, right, ""  # summary는 유지(다운로드나 로그용), 화면은 right 패널만 써도 충분
-
-def run(Q_in, rain_mm, dp_kpa, soc_pct, Hn, Qn, rain_thr, dp_limit, soc_limit):
+    summary = (f"<div style='font-size:16px'><b style='color:{color}'>현재 모드: {mode}</b></div>\n\n"
+               f"- 현재 유량 Q: {Q_in:.1f} m³/s (기준 Qₙ={Qn:.1f})\n"
+               f"- 강수량: {rain_mm:.1f} mm/24h (허용 {rain_thr:.1f})\n"
+               f"- 트래시랙: {dp_kpa:.1f} kPa (허용 {dp_limit:.1f})\n"
+               f"- ESS 충전상태: {soc_pct:.1f}% (허용 {soc_limit:.1f}%)\n\n"
+               f"▶ {st['note']}")
+
+    panel = f"""<div style="display:flex;flex-direction:column;gap:18px">{header}{donuts}{chips}</div>"""
+    extra = action_box(mode)
+    return summary, panel, extra
+
+# ====== 외부에서 호출되는 함수들(화면은 Q/rain/dp/soc만 받음) ======
+def run(Q_in, rain_mm, dp_kpa, soc_pct):
     try:
         Q_in=float(Q_in); rain_mm=float(rain_mm); dp_kpa=float(dp_kpa); soc_pct=float(soc_pct)
-        Hn=float(Hn); Qn=float(Qn); rain_thr=float(rain_thr); dp_limit=float(dp_limit); soc_limit=float(soc_limit)
     except Exception:
         return "⚠️ 입력 오류를 확인하세요.","",""
-    return _evaluate(Q_in, rain_mm, dp_kpa, soc_pct, Hn, Qn, rain_thr, dp_limit, soc_limit)
-
-# 프리셋 & 자동 시연
-def preset_normal_and_run(Hn, Qn, rain_thr, dp_limit, soc_limit):
-    Q=0.8*float(Qn); rain=10.0; dp=1.0; soc=50.0
-    md, right, _ = _evaluate(Q, rain, dp, soc, float(Hn), float(Qn), float(rain_thr), float(dp_limit), float(soc_limit))
-    return round(Q,1), round(rain,1), round(dp,1), round(soc,1), md, right, ""
-
-def preset_low_and_run(Hn, Qn, rain_thr, dp_limit, soc_limit):
-    Q=0.3*float(Qn); rain=5.0; dp=1.0; soc=50.0
-    md, right, _ = _evaluate(Q, rain, dp, soc, float(Hn), float(Qn), float(rain_thr), float(dp_limit), float(soc_limit))
-    return round(Q,1), round(rain,1), round(dp,1), round(soc,1), md, right, ""
-
-def preset_high_and_run(Hn, Qn, rain_thr, dp_limit, soc_limit):
-    Q=1.3*float(Qn); rain=max(50.0, float(rain_thr)); dp=1.0; soc=50.0
-    md, right, _ = _evaluate(Q, rain, dp, soc, float(Hn), float(Qn), float(rain_thr), float(dp_limit), float(soc_limit))
-    return round(Q,1), round(rain,1), round(dp,1), round(soc,1), md, right, ""
-
-def preset_maint_and_run(Hn, Qn, rain_thr, dp_limit, soc_limit):
-    Q=0.8*float(Qn); rain=10.0; dp=float(dp_limit)+0.5; soc=50.0
-    md, right, _ = _evaluate(Q, rain, dp, soc, float(Hn), float(Qn), float(rain_thr), float(dp_limit), float(soc_limit))
-    return round(Q,1), round(rain,1), round(dp,1), round(soc,1), md, right, ""
-
-def autoplay(Hn, Qn, rain_thr, dp_limit, soc_limit):
-    steps = [preset_normal_and_run, preset_low_and_run, preset_high_and_run, preset_maint_and_run]
-    for fn in steps:
-        Q, rain, dp, soc, md, right, _ = fn(Hn, Qn, rain_thr, dp_limit, soc_limit)
-        yield (Q, rain, dp, soc, md, right, "")
-        time.sleep(2.0)
+    return _evaluate(Q_in, rain_mm, dp_kpa, soc_pct)
 
-# -------------------- UI: 스크롤 없는 1페이지 콤팩트 --------------------
-CSS = """
-body, .gradio-container { font-size: 13px; }
-#title { margin-bottom: 6px; }
-#preset-row button { min-height: 30px; }
-"""
+def preset_normal_and_run():
+    Q=0.8*DEFAULTS["Qn"]; rain=10.0; dp=1.0; soc=50.0
+    md, panel, extra = _evaluate(Q, rain, dp, soc)
+    return round(Q,1), round(rain,1), round(dp,1), round(soc,1), md, panel, extra
 
-with gr.Blocks(theme=gr.themes.Soft(), title="소수력 스마트 운전모드 대시보드", css=CSS) as app:
-    gr.Markdown("#### 🌊 소수력 스마트 운전모드", elem_id="title")
+def preset_low_and_run():
+    Q=0.3*DEFAULTS["Qn"]; rain=5.0; dp=1.0; soc=50.0
+    md, panel, extra = _evaluate(Q, rain, dp, soc)
+    return round(Q,1), round(rain,1), round(dp,1), round(soc,1), md, panel, extra
 
-    with gr.Row(equal_height=True):
-        # 좌측: 입력(2x2 그리드 + 작은 고급값)
-        with gr.Column(scale=6, min_width=420):
-            with gr.Row():
-                Q_in = gr.Number(label="유량 Q (m³/s)", value=2.0, scale=1, precision=1)
-                rain = gr.Number(label="강수량 (mm/24h)", value=10.0, scale=1, precision=1)
-            with gr.Row():
-                dp   = gr.Number(label="트래시랙 (kPa)", value=1.0, scale=1, precision=1)
-                soc  = gr.Number(label="SoC (%)", value=50.0, scale=1, precision=1)
+def preset_high_and_run():
+    Q=1.3*DEFAULTS["Qn"]; rain=max(50.0, DEFAULTS["rain_thr"]); dp=1.0; soc=50.0
+    md, panel, extra = _evaluate(Q, rain, dp, soc)
+    return round(Q,1), round(rain,1), round(dp,1), round(soc,1), md, panel, extra
 
-            # 고급값 1행에 몰아서 (라벨 짧게)
-            with gr.Row():
-                Hn = gr.Number(label="Hₙ(m)", value=DEFAULTS["Hn"], precision=1)
-                Qn = gr.Number(label="Qₙ(m³/s)", value=DEFAULTS["Qn"], precision=1)
-                rain_thr = gr.Number(label="강수한계", value=DEFAULTS["rain_thr"], precision=0)
-                dp_limit = gr.Number(label="차압한계", value=DEFAULTS["dp_limit"], precision=1)
-                soc_limit= gr.Number(label="SoC한계", value=DEFAULTS["soc_limit"], precision=0)
+def preset_maint_and_run():
+    Q=0.8*DEFAULTS["Qn"]; rain=10.0; dp=DEFAULTS["dp_limit"]+0.5; soc=50.0
+    md, panel, extra = _evaluate(Q, rain, dp, soc)
+    return round(Q,1), round(rain,1), round(dp,1), round(soc,1), md, panel, extra
 
-            with gr.Row():
-                run_btn = gr.Button("▶ 실행", variant="primary", scale=2)
-                demo_btn = gr.Button("자동 시연", scale=1)
+def autoplay():
+    steps = [preset_normal_and_run, preset_low_and_run, preset_high_and_run, preset_maint_and_run]
+    for fn in steps:
+        Q, rain, dp, soc, md, panel, extra = fn()
+        yield (Q, rain, dp, soc, md, panel, extra)
+        time.sleep(2.0)
 
-            with gr.Row(elem_id="preset-row"):
+# ====== Gradio UI (한 화면, 우측 출력 크게) ======
+with gr.Blocks(theme=gr.themes.Soft(), title="소수력 스마트 운전모드 대시보드") as app:
+    # 약간의 전역 스타일(우측 출력 가독성 ↑)
+    gr.HTML("""
+    <style>
+      .gradio-container {max-width: 1200px !important;}
+      .wrap-panel > div {font-size: 16px;}
+    </style>
+    """)
+
+    gr.Markdown("## 🌊 소수력 스마트 운전모드 대시보드")
+
+    with gr.Row():
+        # 좌측 입력(필요한 4개만)
+        with gr.Column(scale=1):
+            Q_in = gr.Number(label="유량 Q (m³/s)", value=2.0)
+            rain = gr.Number(label="강수량 (mm/24h)", value=10.0)
+            dp   = gr.Number(label="트래시랙 (kPa)", value=1.0)
+            soc  = gr.Number(label="SoC (%)", value=50.0)
+
+            run_btn = gr.Button("▶ 실행", variant="primary")
+
+            gr.Markdown("🔘 즉시 실행")
+            with gr.Row():
                 btn_norm  = gr.Button("정상", variant="secondary")
                 btn_low   = gr.Button("저유량", variant="secondary")
                 btn_high  = gr.Button("고유량", variant="secondary")
                 btn_maint = gr.Button("정비", variant="stop")
 
-        # 우측: 시각화 패널(한 화면용 초간단 배치)
-        with gr.Column(scale=6, min_width=420):
-            out_md    = gr.Markdown(visible=False)   # 내부적으로 유지만
-            out_vis   = gr.HTML()                    # 모드/도넛/칩/요약
-            out_extra = gr.HTML(visible=False)       # 사용 안함
+            demo_btn = gr.Button("자동 시연")
+
+        # 우측 출력(더 크게: scale=3)
+        with gr.Column(scale=3):
+            out_vis   = gr.HTML(elem_classes=["wrap-panel"])   # 뱃지/도넛/칩 (크게)
+            out_md    = gr.Markdown()                          # 상단 요약
+            out_extra = gr.HTML()                              # 하단 ‘동작’ 박스
 
-    # 이벤트 바인딩
+    # 바인딩 (입력 4개만 사용)
     run_btn.click(fn=run,
-                  inputs=[Q_in, rain, dp, soc, Hn, Qn, rain_thr, dp_limit, soc_limit],
+                  inputs=[Q_in, rain, dp, soc],
                   outputs=[out_md, out_vis, out_extra])
 
-    demo_btn.click(fn=autoplay,
-                   inputs=[Hn, Qn, rain_thr, dp_limit, soc_limit],
-                   outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
-
-    btn_norm.click(fn=preset_normal_and_run,
-                   inputs=[Hn, Qn, rain_thr, dp_limit, soc_limit],
-                   outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
-    btn_low.click(fn=preset_low_and_run,
-                  inputs=[Hn, Qn, rain_thr, dp_limit, soc_limit],
-                  outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
-    btn_high.click(fn=preset_high_and_run,
-                   inputs=[Hn, Qn, rain_thr, dp_limit, soc_limit],
-                   outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
-    btn_maint.click(fn=preset_maint_and_run,
-                    inputs=[Hn, Qn, rain_thr, dp_limit, soc_limit],
-                    outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
+    btn_norm.click(fn=preset_normal_and_run, outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
+    btn_low.click(fn=preset_low_and_run,    outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
+    btn_high.click(fn=preset_high_and_run,  outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
+    btn_maint.click(fn=preset_maint_and_run,outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
+
+    demo_btn.click(fn=autoplay, outputs=[Q_in, rain, dp, soc, out_md, out_vis, out_extra])
 
 if __name__ == "__main__":
     app.launch()