Update app.py

app.py

@@ -8,7 +8,7 @@ import qrcode
 from PIL import Image
 import io
 
-# 自訂 CSS 確保標題不換行、調整圖片大小、優化按鈕布局並添加右下角資訊
+# 自訂 CSS 確保標題不換行、調整圖片大小、優化按鈕布局、右下角資訊並添加頒獎台樣式
 st.markdown("""
     <style>
     .stApp header h1 {
@@ -33,7 +33,7 @@ st.markdown("""
     .st-ds {
         justify-content: space-between; /* 兩列間距均等 */
     }
-    /* 添加右下角資訊 */
+    /* 右下角資訊 */
     .footer {
         position: fixed;
         bottom: 10px;
@@ -42,6 +42,48 @@ st.markdown("""
         color: #666;
         padding: 5px;
     }
+    /* 頒獎台樣式 */
+    .podium-container {
+        display: flex;
+        justify-content: center;
+        align-items: flex-end;
+        margin-top: 20px;
+        margin-bottom: 20px;
+    }
+    .podium {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        margin: 0 10px;
+    }
+    .podium-step {
+        background-color: #d3d3d3; /* 灰色台子 */
+        border: 2px solid #000;
+        text-align: center;
+        font-weight: bold;
+        color: #333;
+    }
+    .podium-step.first {
+        width: 100px;
+        height: 150px; /* 第一名台子最高 */
+        background-color: #ffd700; /* 金色 */
+    }
+    .podium-step.second {
+        width: 100px;
+        height: 120px; /* 第二名次之 */
+        background-color: #c0c0c0; /* 銀色 */
+    }
+    .podium-step.third {
+        width: 100px;
+        height: 90px; /* 第三名最低 */
+        background-color: #cd7f32; /* 銅色 */
+    }
+    .podium-label {
+        margin-top: 5px;
+        font-size: 1rem;
+        text-align: center;
+        color: #333;
+    }
     </style>
 """, unsafe_allow_html=True)
 
@@ -255,8 +297,58 @@ def main():
                 )
                 # 顯示圖表
                 st.plotly_chart(fig, use_container_width=True)
+
+                # 新增頒獎台功能
+                st.subheader("頒獎台：查詢結果前三名")
+                # 獲取前三名（已按查詢結果降序排序）
+                top_3 = valid_df.head(3)
+                
+                if len(top_3) > 0:
+                    # 準備頒獎台 HTML
+                    podium_html = '<div class="podium-container">'
+
+                    # 第二名（如果有）
+                    if len(top_3) >= 2:
+                        second = top_3.iloc[1]
+                        podium_html += f'''
+                        <div class="podium">
+                            <div class="podium-step second">{int(second['查詢結果'])}</div>
+                            <div class="podium-label">{second['姓名']}<br>{second['幸運號碼']}</div>
+                        </div>
+                        '''
+                    else:
+                        podium_html += '<div class="podium"><div class="podium-step second"></div><div class="podium-label"></div></div>'
+
+                    # 第一名（如果有）
+                    if len(top_3) >= 1:
+                        first = top_3.iloc[0]
+                        podium_html += f'''
+                        <div class="podium">
+                            <div class="podium-step first">{int(first['查詢結果'])}</div>
+                            <div class="podium-label">{first['姓名']}<br>{first['幸運號碼']}</div>
+                        </div>
+                        '''
+                    else:
+                        podium_html += '<div class="podium"><div class="podium-step first"></div><div class="podium-label"></div></div>'
+
+                    # 第三名（如果有）
+                    if len(top_3) >= 3:
+                        third = top_3.iloc[2]
+                        podium_html += f'''
+                        <div class="podium">
+                            <div class="podium-step third">{int(third['查詢結果'])}</div>
+                            <div class="podium-label">{third['姓名']}<br>{third['幸運號碼']}</div>
+                        </div>
+                        '''
+                    else:
+                        podium_html += '<div class="podium"><div class="podium-step third"></div><div class="podium-label"></div></div>'
+
+                    podium_html += '</div>'
+                    st.markdown(podium_html, unsafe_allow_html=True)
+                else:
+                    st.warning("無有效的查詢結果可供顯示頒獎台。")
             else:
-                st.warning("無有效的查詢結果可供繪製長條圖。請確認資料是否正確。")
+                st.warning("無有效的查詢結果可供繪製長條圖或頒獎台。請確認資料是否正確。")
                 
         except Exception as e:
             st.error(f"處理檔案時發生錯誤: {str(e)}")