From b515cf162b0c22df4ccdacd7254cfc7703d1137d Mon Sep 17 00:00:00 2001
From: Hera Zhao <hera@euphon.net>
Date: Mon, 6 Apr 2026 21:20:08 +0000
Subject: [PATCH] Add preview environment banner in App.vue

Shows orange warning banner on pr-{id}.oil.oci.euphon.net with PR number.
Production site (oil.oci.euphon.net) is unaffected.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 frontend/src/App.vue | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 573084e..a6948ab 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -1,4 +1,7 @@
 <template>
+  <div v-if="isPreview" style="background:#e65100;color:white;text-align:center;padding:6px 16px;font-size:13px;font-weight:600;letter-spacing:0.5px;position:sticky;top:0;z-index:100">
+    ⚠️ 预览环境 · PR #{{ prId }} · 数据为生产副本，修改不影响正式环境
+  </div>
   <div class="app-header" style="position:relative">
     <div class="header-inner" style="padding-right:80px">
       <div class="header-icon">🌿</div>
@@ -82,6 +85,12 @@ const ui = useUiStore()
 const router = useRouter()
 const showUserMenu = ref(false)
 
+// Preview environment detection: pr-{id}.oil.oci.euphon.net
+const hostname = window.location.hostname
+const prMatch = hostname.match(/^pr-(\d+)\./)
+const isPreview = !!prMatch
+const prId = prMatch ? prMatch[1] : ''
+
 function goSection(name) {
   ui.showSection(name)
   router.push('/' + (name === 'search' ? '' : name))