style(index): 调整离线状态下的页面背景样式

将离线状态的背景样式从默认状态中分离，通过动态类名控制

 <!--
  * @Date: 2023-06-21 10:23:09
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2026-01-13 15:47:00
+ * @LastEditTime: 2026-01-13 15:51:31
  * @FilePath: /xyxBooking-weapp/src/pages/index/index.vue
  * @Description: 预约页首页
 -->
 <template>
-  <view class="index-page">
+  <view class="index-page" :class="{ 'is-offline': is_offline }">
     <view v-if="is_offline" class="offline-banner mx-6 mt-4 rounded-xl px-4 py-3">
       <view class="flex items-center">
         <IconFont name="tips" size="18" />
@@ -110,14 +110,18 @@ useShareAppMessage(() => {
 .index-page {
   position: relative;
   min-height: 100vh;
-  background-color: #F3EEE3;
-  background-image:
-    linear-gradient(180deg, rgba(166, 121, 57, 0.10) 0%, rgba(255, 255, 255, 0.90) 60%, rgba(243, 238, 227, 1) 100%),
-    url('https://cdn.ipadbiz.cn/xys/booking/bg.jpg?imageMogr2/thumbnail/200x/strip/quality/50');
+  background-image: url('https://cdn.ipadbiz.cn/xys/booking/bg.jpg?imageMogr2/thumbnail/200x/strip/quality/50');
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover; /* 确保背景覆盖 */
 
+  &.is-offline {
+    background-color: #F3EEE3;
+    background-image:
+      linear-gradient(180deg, rgba(166, 121, 57, 0.10) 0%, rgba(255, 255, 255, 0.90) 60%, rgba(243, 238, 227, 1) 100%),
+      url('https://cdn.ipadbiz.cn/xys/booking/bg.jpg?imageMogr2/thumbnail/200x/strip/quality/50');
+  }
+
   .offline-banner {
     position: absolute;
     top: 24rpx;