From 3018d05bc43f70f83d5e6f4850e7505ab448faf7 Mon Sep 17 00:00:00 2001
From: zlwu <704541015@qq.com>
Date: Sun, 11 Oct 2026 10:09:21 +0800
Subject: [PATCH] feat(mobile-h5): show non-prod env stripe on home

Render a short local/test banner above the green header
so the active APP_ENV is obvious before WeChat upload.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 mobile-h5/pages/index/index.vue | 35 +++++++++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)

diff --git a/mobile-h5/pages/index/index.vue b/mobile-h5/pages/index/index.vue
index 83dd9c74..7d52b583 100644
--- a/mobile-h5/pages/index/index.vue
+++ b/mobile-h5/pages/index/index.vue
@@ -1,5 +1,12 @@
 <template>
   <view class="page-shell">
+    <view
+      v-if="envBanner.show"
+      class="env-banner"
+      :class="'env-banner--' + envBanner.tone"
+    >
+      <text class="env-banner__text">{{ envBanner.label }}</text>
+    </view>
     <view class="home-header">
       <view class="home-header__top">
         <view class="brand">中科兴皖 · 移动工作台</view>
@@ -86,6 +93,7 @@
 </template>
 
 <script>
+  import { ENV_BANNER } from '../../utils/config.js'
   import MenuGrid from '../../components/MenuGrid.vue'
   import VanEmpty from '../../components/van-empty/van-empty.vue'
   import {
@@ -125,6 +133,7 @@
     components: { MenuGrid, VanEmpty },
     data() {
       return {
+        envBanner: ENV_BANNER,
         userName: '',
         postName: '',
         deptName: '',
@@ -280,4 +289,30 @@
       transform: translateY(-10rpx);
     }
   }
+
+  .env-banner {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    padding: 12rpx 24rpx;
+    box-sizing: border-box;
+  }
+
+  .env-banner__text {
+    font-size: 22rpx;
+    font-weight: 700;
+    letter-spacing: 0.04em;
+    line-height: 1.3;
+  }
+
+  .env-banner--local {
+    background: #f59e0b;
+    color: #451a03;
+  }
+
+  .env-banner--test {
+    background: #3b82f6;
+    color: #eff6ff;
+  }
 </style>