克拉玛依H5更新

src/components/TabBar.vue

@@ -1,7 +1,15 @@
 <template>
   <div class="tab-bar">
-    <div v-for="(item, index) in tabItems" :key="index" class="tab-item" :class="{ active: currentPath === item.path }"
-      @click="switchTab(item.path)">
+    <div
+      v-for="(item, index) in tabItems"
+      :key="index"
+      class="tab-item"
+      :class="{
+        active: currentPath === item.path,
+        disabled: item.path === '/user',
+      }"
+      @click="switchTab(item.path)"
+    >
       <img :src="getIconSrc(item)" alt="icon" class="tab-icon" />
       <span class="tab-text">{{ item.text }}</span>
     </div>
@@ -34,26 +42,26 @@ const tabItems = [
     text: '首页',
     path: '/indexPage',
     iconNormal: homeNormal,
-    iconActive: homeActive
+    iconActive: homeActive,
   },
   {
     text: '展览',
     path: '/exhibition',
     iconNormal: exhibitionNormal,
-    iconActive: exhibitionActive
+    iconActive: exhibitionActive,
   },
   {
     text: '典藏',
     path: '/collection',
     iconNormal: cultureNormal,
-    iconActive: cultureActive
+    iconActive: cultureActive,
   },
   {
     text: '我的',
     path: '/user',
     iconNormal: userNormal,
-    iconActive: userActive
-  }
+    iconActive: userActive,
+  },
 ]
 
 // 获取图标源
@@ -75,7 +83,7 @@ const switchTab = (path) => {
   if (isPreviewMode) {
     router.push({
       path: path,
-      query: { preview: '1' }
+      query: { preview: '1' },
     })
   } else {
     router.push(path)
@@ -108,7 +116,20 @@ const switchTab = (path) => {
 
   &.active {
     .tab-text {
-      color: #B1967B; // 高亮文字颜色
+      color: #b1967b; // 高亮文字颜色
+    }
+  }
+
+  &.disabled {
+    cursor: not-allowed;
+    opacity: 0.5;
+
+    .tab-icon {
+      filter: grayscale(100%);
+    }
+
+    .tab-text {
+      color: #999;
     }
   }
 }
@@ -121,7 +142,7 @@ const switchTab = (path) => {
 
 .tab-text {
   font-size: 14px;
-  color: #412A12;
+  color: #412a12;
 }
 
 @media (min-width: 1024px) {
@@ -130,4 +151,4 @@ const switchTab = (path) => {
     place-items: center;
   }
 }
-</style>
+</style>

src/views/collection/collectDetail.vue

@@ -49,7 +49,7 @@
         </div>
         <!-- 放大镜图标 -->
         <div v-if="getFieldValue(artifactData, 'modelFile')" class="zoom-icon" @click="toggleZoom">
-          <el-icon style="color: #EFDBAC" :size="24">
+          <el-icon style="color: #efdbac" :size="24">
             <ZoomIn v-if="!isZoomed" />
             <ZoomOut v-else />
           </el-icon>
@@ -110,20 +110,25 @@
     <!-- 底部固定信息卡片 -->
     <div class="artifact-info-card" :class="{ hidden: isZoomed }">
       <div class="card-content">
-        <div class="artifact-title">{{ getFieldValue(artifactData, 'title') || '文物名称' }}</div>
+        <div class="artifact-title">{{ getFieldValue(artifactData, 'title') }}</div>
         <div class="artifact-meta">
-          <span class="year">{{ getFieldValue(artifactData, 'era') }}</span>
-          <span class="source">{{ getFieldValue(artifactData, 'texture') }}</span>
-          <span class="level">{{ getFieldValue(artifactData, 'level') || '等级不详' }}</span>
+          <span class="year" v-if="getFieldValue(artifactData, 'era')">{{
+            getFieldValue(artifactData, 'era')
+          }}</span>
+          <span class="source" v-if="getFieldValue(artifactData, 'texture')">{{
+            getFieldValue(artifactData, 'texture')
+          }}</span>
+          <span class="level" v-if="getFieldValue(artifactData, 'level')">{{
+            getFieldValue(artifactData, 'level')
+          }}</span>
         </div>
-        <div class="artifact-size">
-          {{
-            getFieldValue(artifactData, 'size') ||
-            getFieldValue(artifactData, 'dimensions') ||
-            '尺寸不详'
-          }}
+        <div class="artifact-size" v-if="getFieldValue(artifactData, 'size')">
+          {{ getFieldValue(artifactData, 'size') || getFieldValue(artifactData, 'dimensions') }}
+        </div>
+        <div class="divider">
+          <span class="divider-line1"></span>
+          <span class="divider-line2"></span>
         </div>
-        <div class="divider"></div>
         <div class="artifact-description">
           {{ getFieldValue(artifactData, 'remark') }}
         </div>
@@ -435,7 +440,8 @@ onMounted(() => {
 
 .content-display {
   height: 55%;
-  background: linear-gradient(180deg, #372918 0%, #776655 100%);
+  //background: linear-gradient(180deg, #372918 0%, #776655 100%);
+  background-color: #615446;
   padding: 20px 0;
   transition: height 0.3s ease;
 
@@ -564,7 +570,7 @@ onMounted(() => {
   }
 
   .artifact-title {
-    font-size: 20px;
+    font-size: 36px;
     font-weight: bold;
     color: #584735;
     margin-bottom: 10px;
@@ -573,42 +579,53 @@ onMounted(() => {
   .artifact-meta {
     display: flex;
     gap: 15px;
-    margin-bottom: 8px;
+    // margin-bottom: 8px;
     font-size: 14px;
-    color: #666;
+    color: #584735;
 
     .year {
-      color: #8b5d3b;
-      font-weight: 500;
+      color: #584735;
     }
 
     .source {
-      color: #666;
+      color: #584735;
     }
 
     .level {
-      color: #8b5d3b;
-      font-weight: 500;
+      color: #584735;
     }
   }
 
   .artifact-size {
     font-size: 14px;
-    color: #666;
+    color: #584735;
     margin-bottom: 15px;
   }
 
   .divider {
     width: 100%;
-    height: 2px;
-    background: linear-gradient(to right, #8b5d3b, transparent);
+    height: 4px;
     margin-bottom: 15px;
+    display: flex;
+    flex-direction: column;
+    .divider-line1 {
+      display: inline-block;
+      width: 20%;
+      height: 4px;
+      background: #b1967b;
+    }
+    .divider-line2 {
+      display: inline-block;
+      width: 100%;
+      height: 2px;
+      background: #b1967b;
+    }
   }
 
   .artifact-description {
     font-size: 13px;
     line-height: 1.6;
-    color: #444;
+    color: #584735;
     text-align: justify;
   }
 }

src/views/indexPage/activePreview.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="active-preview-container">
-    <div class="back-button" @click="router.replace('/indexPage')">
-      <img src="@/assets/indexPage/icon_back.png" alt="">
+    <div class="back-button" @click="goBackToIndex">
+      <img src="@/assets/indexPage/icon_back.png" alt="" />
     </div>
 
     <div class="preview-content">
@@ -49,20 +49,52 @@
 
         <h3 class="reservation-title">预约参观</h3>
         <div class="reservation-rules">
-          <p class="rule-content">①所有观众(包括享受优待政策的观众及其陪同人员)<span class="notic">均须实名预约</span>。放票时间为<span
-              class="notic">每日18:00，可提前7日(不包括当日)通过官方微信小程序预约</span>，预约时段分为上午(9:00-13:00)和下午(12:00-16:00)，当天不再放票;</p>
-          <p class="rule-content">②参观当日须按照预约时段入馆参观，错过预约时段将谢绝入馆。<span
-              class="notic">同一证件号</span>当天可进出馆2次，预约上午票的观众首次入馆时间必须在13：00前；</p>
+          <p class="rule-content">
+            ①所有观众(包括享受优待政策的观众及其陪同人员)<span class="notic">均须实名预约</span
+            >。放票时间为<span class="notic"
+              >每日18:00，可提前7日(不包括当日)通过官方微信小程序预约</span
+            >，预约时段分为上午(9:00-13:00)和下午(12:00-16:00)，当天不再放票;
+          </p>
+          <p class="rule-content">
+            ②参观当日须按照预约时段入馆参观，错过预约时段将谢绝入馆。<span class="notic"
+              >同一证件号</span
+            >当天可进出馆2次，预约上午票的观众首次入馆时间必须在13：00前；
+          </p>
         </div>
       </div>
     </div>
   </div>
 </template>
 
+<script>
+export default {
+  name: 'ActivePreview',
+}
+</script>
+
 <script setup>
-import { useRouter } from 'vue-router'
+import { computed } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
 
 const router = useRouter()
+const route = useRoute()
+
+// 检查是否为预览模式
+const isPreviewMode = computed(() => {
+  return route.query.preview === '1'
+})
+
+// 返回首页函数
+const goBackToIndex = () => {
+  if (isPreviewMode.value) {
+    router.replace({
+      path: '/indexPage',
+      query: { preview: '1' },
+    })
+  } else {
+    router.replace('/indexPage')
+  }
+}
 
 const goBack = () => {
   router.go(-1)
@@ -83,7 +115,7 @@ const goToActivePage = () => {
   background-size: cover;
   box-sizing: border-box;
   position: relative;
-  color: #412A12;
+  color: #412a12;
   overflow-y: auto;
 }
 
@@ -161,7 +193,7 @@ const goToActivePage = () => {
   background: transparent;
   height: 36px;
   border-radius: 30px 30px 30px 30px;
-  border: 1px solid #FFFFFF;
+  border: 1px solid #ffffff;
   margin-top: 10px;
   color: #fff;
 }
@@ -171,7 +203,7 @@ const goToActivePage = () => {
   height: 64px;
   background: rgba(255, 255, 255, 0.5);
   color: #584735;
-  border: 1px solid #B1967B;
+  border: 1px solid #b1967b;
   padding: 12px;
   border-radius: 8px;
   font-size: 16px;
@@ -179,7 +211,6 @@ const goToActivePage = () => {
   cursor: pointer;
 }
 
-
 .reservation-info {
   border-radius: 10px;
 
@@ -198,13 +229,13 @@ const goToActivePage = () => {
 
   .time-title {
     font-size: 14px;
-    color: #B1967B;
+    color: #b1967b;
   }
 
   .time-value {
     font-size: 40px;
     font-weight: bold;
-    color: #94765A;
+    color: #94765a;
   }
 
   .line {
@@ -225,18 +256,18 @@ const goToActivePage = () => {
 
   .stop-time {
     font-size: 14px;
-    color: #B1967B;
+    color: #b1967b;
   }
 
   .stop-desc {
     font-size: 14px;
-    color: #B1967B;
+    color: #b1967b;
   }
 
   .time-note {
     width: 227px;
     font-size: 14px;
-    color: #B1967B;
+    color: #b1967b;
     margin-bottom: 20px;
   }
 
@@ -250,14 +281,14 @@ const goToActivePage = () => {
   .reservation-rules {
     font-size: 14px;
     line-height: 1.5;
-    color: #B1967B;
+    color: #b1967b;
     margin-bottom: 20px;
 
     .rule-content {
-      color: #B1967B;
+      color: #b1967b;
 
       .notic {
-        color: #94765A;
+        color: #94765a;
         font-weight: bold;
       }
     }
@@ -267,4 +298,4 @@ const goToActivePage = () => {
     margin-bottom: 10px;
   }
 }
-</style>
+</style>

src/views/indexPage/activity.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="activity-container">
     <!-- 返回按钮 -->
-    <div class="back-button" @click="router.replace('/indexPage')">
-      <img src="@/assets/indexPage/icon_back.png" alt="">
+    <div class="back-button" @click="goBackToIndex">
+      <img src="@/assets/indexPage/icon_back.png" alt="" />
     </div>
 
     <!-- 标题 -->
@@ -14,19 +14,26 @@
     </div>
     <div v-else class="content-section">
       <div class="collection-list">
-        <div class="collection-item" v-for="(item, index) in activeList" :key="item.id || item.activityId || index">
+        <div
+          class="collection-item"
+          v-for="(item, index) in activeList"
+          :key="item.id || item.activityId || index"
+        >
           <div class="item-image-container" @click="viewActivity(item)">
-            <img :src="getFieldValue(item, 'infoImg')" :alt="getFieldValue(item, 'title') || '活动图片'"
-              class="item-image" />
+            <img
+              :src="getFieldValue(item, 'infoImg')"
+              :alt="getFieldValue(item, 'title') || '活动图片'"
+              class="item-image"
+            />
             <div class="view-button">
-              <span>查看</span><el-icon>
+              <span>查看</span
+              ><el-icon>
                 <Right />
               </el-icon>
             </div>
             <div class="item-info">
               <div class="item-title">{{ getFieldValue(item, 'title') || '暂无标题' }}</div>
-              <div class="item-description">{{ getFieldValue(item, 'remark') ||
-                '暂无描述' }}</div>
+              <div class="item-description">{{ getFieldValue(item, 'remark') || '暂无描述' }}</div>
             </div>
           </div>
         </div>
@@ -39,8 +46,14 @@
   </div>
 </template>
 
+<script>
+export default {
+  name: 'ActivityPage',
+}
+</script>
+
 <script setup>
-import { ref, onMounted, computed } from 'vue'
+import { onMounted, computed } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
 import { useIndexPageApi } from '@/setup/useIndexPageApi'
 
@@ -77,6 +90,18 @@ onMounted(async () => {
   }
 })
 
+// 返回首页函数
+const goBackToIndex = () => {
+  if (isPreviewMode.value) {
+    router.replace({
+      path: '/indexPage',
+      query: { preview: '1' },
+    })
+  } else {
+    router.replace('/indexPage')
+  }
+}
+
 // 查看活动详情
 const viewActivity = (item) => {
   console.log('查看活动详情:', item)
@@ -86,8 +111,8 @@ const viewActivity = (item) => {
     query: {
       id: item.id || item.activityId,
       type: 'activity', // 标识这是活动详情
-      isFromPage: 'indexPage/activity'
-    }
+      isFromPage: 'indexPage/activity',
+    },
   })
 }
 </script>
@@ -135,7 +160,8 @@ const viewActivity = (item) => {
   }
 }
 
-.content-section {}
+.content-section {
+}
 
 .collection-list {
   display: flex;
@@ -238,4 +264,4 @@ const viewActivity = (item) => {
     opacity: 0.6;
   }
 }
-</style>
+</style>

src/views/indexPage/components/activePeople.vue

@@ -2,7 +2,7 @@
   <div class="visit-people-container">
     <!-- 预约日期信息 -->
     <div class="date-info" v-if="!showExistingPage">
-      <img class="bg-img" src="@/assets/indexPage/img.png" alt="">
+      <img class="bg-img" src="@/assets/indexPage/img.png" alt="" />
       <div class="date-content">
         <div class="date-label"><span class="title">预约日期：</span>{{ selectedDate }}</div>
         <div class="time-label"><span class="title">入馆时间：</span>{{ selectedTime }}</div>
@@ -22,17 +22,21 @@
         <div v-for="(visitor, index) in visitors" :key="index" class="visitor-card">
           <div class="visitor-header">
             <span class="visitor-title">参观人信息{{ index + 1 }}</span>
-            <button class="delete-btn" @click="removeVisitor(index)"><el-icon :size="20">
-                <Delete style="margin-right: 4px;" />
-              </el-icon>删除</button>
+            <button class="delete-btn" @click="removeVisitor(index)">
+              <el-icon :size="20"> <Delete style="margin-right: 4px" /> </el-icon>删除
+            </button>
           </div>
 
           <el-form :model="visitor" class="visitor-form">
             <div class="form-item">
               <div class="form-label">姓名</div>
               <div class="form-input">
-                <el-input v-model="visitor.name" placeholder="请输入您的姓名" @blur="validateName(index)"
-                  :class="['bottom-line-input', visitor.nameError ? 'error-line' : '']" />
+                <el-input
+                  v-model="visitor.name"
+                  placeholder="请输入您的姓名"
+                  @blur="validateName(index)"
+                  :class="['bottom-line-input', visitor.nameError ? 'error-line' : '']"
+                />
                 <div v-if="visitor.nameError" class="error-msg">{{ visitor.nameError }}</div>
               </div>
             </div>
@@ -40,8 +44,12 @@
             <div class="form-item">
               <div class="form-label">电话号码</div>
               <div class="form-input">
-                <el-input v-model="visitor.phone" placeholder="请输入11位数字" @blur="validatePhone(index)"
-                  :class="['bottom-line-input', visitor.phoneError ? 'error-line' : '']" />
+                <el-input
+                  v-model="visitor.phone"
+                  placeholder="请输入11位数字"
+                  @blur="validatePhone(index)"
+                  :class="['bottom-line-input', visitor.phoneError ? 'error-line' : '']"
+                />
                 <div v-if="visitor.phoneError" class="error-msg">{{ visitor.phoneError }}</div>
               </div>
             </div>
@@ -49,7 +57,11 @@
             <div class="form-item">
               <div class="form-label">证件类型</div>
               <div class="form-input">
-                <el-select v-model="visitor.idType" placeholder="请选择证件类型" :class="['bottom-line-select']">
+                <el-select
+                  v-model="visitor.idType"
+                  placeholder="请选择证件类型"
+                  :class="['bottom-line-select']"
+                >
                   <el-option label="身份证" value="身份证" />
                 </el-select>
               </div>
@@ -58,9 +70,15 @@
             <div class="form-item">
               <div class="form-label">证件号码</div>
               <div class="form-input">
-                <el-input v-model="visitor.idNumber" placeholder="请输入18位证件编码" @blur="validateIdNumber(index)"
-                  :class="['bottom-line-input', visitor.idNumberError ? 'error-line' : '']" />
-                <div v-if="visitor.idNumberError" class="error-msg">{{ visitor.idNumberError }}</div>
+                <el-input
+                  v-model="visitor.idNumber"
+                  placeholder="请输入18位证件编码"
+                  @blur="validateIdNumber(index)"
+                  :class="['bottom-line-input', visitor.idNumberError ? 'error-line' : '']"
+                />
+                <div v-if="visitor.idNumberError" class="error-msg">
+                  {{ visitor.idNumberError }}
+                </div>
               </div>
             </div>
           </el-form>
@@ -76,8 +94,12 @@
     <!-- 选择已有参观人页面 -->
     <div v-if="showExistingPage" class="existing-page">
       <div class="existing-visitors-list">
-        <div v-for="(existingVisitor, index) in existingVisitors" :key="index" class="existing-visitor-item"
-          @click="toggleExistingVisitor(index)">
+        <div
+          v-for="(existingVisitor, index) in existingVisitors"
+          :key="index"
+          class="existing-visitor-item"
+          @click="toggleExistingVisitor(index)"
+        >
           <div class="visitor-info">
             <div class="visitor-name">姓名：{{ existingVisitor.name }}</div>
             <div class="visitor-id">证件号：{{ existingVisitor.idNumber }}</div>
@@ -127,26 +149,27 @@ const existingVisitors = ref([
     name: '周明明',
     idNumber: '210112196705041430',
     phone: '18416573665',
-    selected: false
+    selected: false,
   },
   {
     name: '李明',
     idNumber: '621124199504251508',
     phone: '13902376115',
-    selected: false
-  }
+    selected: false,
+  },
 ])
 
 // 计算属性
 const isFormValid = computed(() => {
   if (visitors.value.length === 0) return false
-  return visitors.value.every(visitor =>
-    visitor.name &&
-    visitor.phone &&
-    visitor.idNumber &&
-    !visitor.nameError &&
-    !visitor.phoneError &&
-    !visitor.idNumberError
+  return visitors.value.every(
+    (visitor) =>
+      visitor.name &&
+      visitor.phone &&
+      visitor.idNumber &&
+      !visitor.nameError &&
+      !visitor.phoneError &&
+      !visitor.idNumberError,
   )
 })
 
@@ -163,7 +186,7 @@ const addNewVisitor = () => {
     idNumber: '',
     nameError: '',
     phoneError: '',
-    idNumberError: ''
+    idNumberError: '',
   })
 }
 
@@ -196,7 +219,8 @@ const validatePhone = (index) => {
 
 const validateIdNumber = (index) => {
   const visitor = visitors.value[index]
-  const idRegex = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
+  const idRegex =
+    /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
   if (!visitor.idNumber) {
     visitor.idNumberError = '请输入证件号码'
   } else if (!idRegex.test(visitor.idNumber)) {
@@ -215,9 +239,9 @@ const toggleExistingVisitor = (index) => {
 }
 
 const confirmExistingVisitors = () => {
-  const selectedVisitors = existingVisitors.value.filter(visitor => visitor.selected)
+  const selectedVisitors = existingVisitors.value.filter((visitor) => visitor.selected)
 
-  selectedVisitors.forEach(existingVisitor => {
+  selectedVisitors.forEach((existingVisitor) => {
     // if (visitors.value.length < 5) {
     visitors.value.unshift({
       name: existingVisitor.name,
@@ -226,13 +250,13 @@ const confirmExistingVisitors = () => {
       idNumber: existingVisitor.idNumber,
       nameError: '',
       phoneError: '',
-      idNumberError: ''
+      idNumberError: '',
     })
     // }
   })
 
   // 重置选择状态
-  existingVisitors.value.forEach(visitor => {
+  existingVisitors.value.forEach((visitor) => {
     visitor.selected = false
   })
 
@@ -248,7 +272,7 @@ const submitReservation = async () => {
 
   try {
     // 模拟API调用
-    await new Promise(resolve => setTimeout(resolve, 1000))
+    await new Promise((resolve) => setTimeout(resolve, 1000))
 
     // 显示成功弹窗
     showSuccessModal.value = true
@@ -259,8 +283,16 @@ const submitReservation = async () => {
 
 const closeSuccessModal = () => {
   showSuccessModal.value = false
-  // 可以跳转到其他页面或重置表单
-  router.push('/indexPage')
+  // 检查是否为预览模式并保留参数
+  const isPreviewMode = route.query.preview === '1'
+  if (isPreviewMode) {
+    router.push({
+      path: '/indexPage',
+      query: { preview: '1' },
+    })
+  } else {
+    router.push('/indexPage')
+  }
 }
 
 // 初始化时添加一个空的参观人
@@ -303,7 +335,7 @@ onMounted(() => {
   margin: 5px 0;
 
   .title {
-    color: #B1967B;
+    color: #b1967b;
   }
 }
 
@@ -325,14 +357,14 @@ onMounted(() => {
 }
 
 .add-new-btn {
-  background-color: #B1967B;
+  background-color: #b1967b;
   color: #fff;
 }
 
 .select-existing-btn {
   background-color: transparent;
-  color: #A78A6D;
-  border: 1px solid #B1967B;
+  color: #a78a6d;
+  border: 1px solid #b1967b;
 }
 
 .visitor-list {
@@ -361,7 +393,7 @@ onMounted(() => {
 .visitor-title {
   font-size: 16px;
   font-weight: bold;
-  color: #B1967B;
+  color: #b1967b;
 }
 
 .delete-btn {
@@ -370,7 +402,7 @@ onMounted(() => {
   justify-content: center;
   background: none;
   border: none;
-  color: #F45151;
+  color: #f45151;
   cursor: pointer;
   font-size: 14px;
 }
@@ -423,7 +455,7 @@ onMounted(() => {
 }
 
 .error-line :deep(.el-input__wrapper) {
-  border-bottom-color: #F45151;
+  border-bottom-color: #f45151;
   box-shadow: none;
 }
 
@@ -446,14 +478,14 @@ onMounted(() => {
 }
 
 .error-line :deep(.el-select__wrapper) {
-  border-bottom-color: #F45151;
+  border-bottom-color: #f45151;
   box-shadow: none;
 }
 
 .error-msg {
   position: absolute;
   bottom: -20px;
-  color: #F45151;
+  color: #f45151;
   font-size: 12px;
   margin-top: 5px;
 }
@@ -507,8 +539,8 @@ onMounted(() => {
 }
 
 .checkbox.checked {
-  background-color: #B1967B;
-  border-color: #B1967B;
+  background-color: #b1967b;
+  border-color: #b1967b;
 }
 
 .existing-actions {
@@ -525,7 +557,7 @@ onMounted(() => {
   align-items: center;
   width: 100%;
   padding: 15px;
-  background-color: #B1967B;
+  background-color: #b1967b;
   color: white;
   border: none;
   border-radius: 8px;
@@ -548,7 +580,7 @@ onMounted(() => {
   align-items: center;
   width: 100%;
   padding: 15px;
-  background-color: #B1967B;
+  background-color: #b1967b;
   color: white;
   border: none;
   border-radius: 8px;
@@ -586,7 +618,7 @@ onMounted(() => {
   width: 60px;
   height: 60px;
   margin: 0 auto 20px;
-  background-color: #7DBE2B;
+  background-color: #7dbe2b;
   border-radius: 50%;
   display: flex;
   justify-content: center;
@@ -608,11 +640,11 @@ onMounted(() => {
 .success-btn {
   width: 100%;
   padding: 12px;
-  background-color: #B1967B;
+  background-color: #b1967b;
   color: white;
   border: none;
   border-radius: 6px;
   font-size: 16px;
   cursor: pointer;
 }
-</style>
+</style>

src/views/indexPage/components/visitPeople.vue

@@ -2,7 +2,7 @@
   <div class="visit-people-container">
     <!-- 预约日期信息 -->
     <div class="date-info" v-if="!showExistingPage">
-      <img class="bg-img" src="@/assets/indexPage/img.png" alt="">
+      <img class="bg-img" src="@/assets/indexPage/img.png" alt="" />
       <div class="date-content">
         <div class="date-label"><span class="title">预约日期：</span>{{ selectedDate }}</div>
         <div class="time-label"><span class="title">入馆时间：</span>{{ selectedTime }}</div>
@@ -22,17 +22,21 @@
         <div v-for="(visitor, index) in visitors" :key="index" class="visitor-card">
           <div class="visitor-header">
             <span class="visitor-title">参观人信息{{ index + 1 }}</span>
-            <button class="delete-btn" @click="removeVisitor(index)"><el-icon :size="20">
-                <Delete style="margin-right: 4px;" />
-              </el-icon>删除</button>
+            <button class="delete-btn" @click="removeVisitor(index)">
+              <el-icon :size="20"> <Delete style="margin-right: 4px" /> </el-icon>删除
+            </button>
           </div>
 
           <el-form :model="visitor" class="visitor-form">
             <div class="form-item">
               <div class="form-label">姓名</div>
               <div class="form-input">
-                <el-input v-model="visitor.name" placeholder="请输入您的姓名" @blur="validateName(index)"
-                  :class="['bottom-line-input', visitor.nameError ? 'error-line' : '']" />
+                <el-input
+                  v-model="visitor.name"
+                  placeholder="请输入您的姓名"
+                  @blur="validateName(index)"
+                  :class="['bottom-line-input', visitor.nameError ? 'error-line' : '']"
+                />
                 <div v-if="visitor.nameError" class="error-msg">{{ visitor.nameError }}</div>
               </div>
             </div>
@@ -40,8 +44,12 @@
             <div class="form-item">
               <div class="form-label">电话号码</div>
               <div class="form-input">
-                <el-input v-model="visitor.phone" placeholder="请输入11位数字" @blur="validatePhone(index)"
-                  :class="['bottom-line-input', visitor.phoneError ? 'error-line' : '']" />
+                <el-input
+                  v-model="visitor.phone"
+                  placeholder="请输入11位数字"
+                  @blur="validatePhone(index)"
+                  :class="['bottom-line-input', visitor.phoneError ? 'error-line' : '']"
+                />
                 <div v-if="visitor.phoneError" class="error-msg">{{ visitor.phoneError }}</div>
               </div>
             </div>
@@ -49,7 +57,11 @@
             <div class="form-item">
               <div class="form-label">证件类型</div>
               <div class="form-input">
-                <el-select v-model="visitor.idType" placeholder="请选择证件类型" :class="['bottom-line-select']">
+                <el-select
+                  v-model="visitor.idType"
+                  placeholder="请选择证件类型"
+                  :class="['bottom-line-select']"
+                >
                   <el-option label="身份证" value="身份证" />
                 </el-select>
               </div>
@@ -58,9 +70,15 @@
             <div class="form-item">
               <div class="form-label">证件号码</div>
               <div class="form-input">
-                <el-input v-model="visitor.idNumber" placeholder="请输入18位证件编码" @blur="validateIdNumber(index)"
-                  :class="['bottom-line-input', visitor.idNumberError ? 'error-line' : '']" />
-                <div v-if="visitor.idNumberError" class="error-msg">{{ visitor.idNumberError }}</div>
+                <el-input
+                  v-model="visitor.idNumber"
+                  placeholder="请输入18位证件编码"
+                  @blur="validateIdNumber(index)"
+                  :class="['bottom-line-input', visitor.idNumberError ? 'error-line' : '']"
+                />
+                <div v-if="visitor.idNumberError" class="error-msg">
+                  {{ visitor.idNumberError }}
+                </div>
               </div>
             </div>
           </el-form>
@@ -76,8 +94,12 @@
     <!-- 选择已有参观人页面 -->
     <div v-if="showExistingPage" class="existing-page">
       <div class="existing-visitors-list">
-        <div v-for="(existingVisitor, index) in existingVisitors" :key="index" class="existing-visitor-item"
-          @click="toggleExistingVisitor(index)">
+        <div
+          v-for="(existingVisitor, index) in existingVisitors"
+          :key="index"
+          class="existing-visitor-item"
+          @click="toggleExistingVisitor(index)"
+        >
           <div class="visitor-info">
             <div class="visitor-name">姓名：{{ existingVisitor.name }}</div>
             <div class="visitor-id">证件号：{{ existingVisitor.idNumber }}</div>
@@ -127,26 +149,27 @@ const existingVisitors = ref([
     name: '周明明',
     idNumber: '210112196705041430',
     phone: '18416573665',
-    selected: false
+    selected: false,
   },
   {
     name: '李明',
     idNumber: '621124199504251508',
     phone: '13902376115',
-    selected: false
-  }
+    selected: false,
+  },
 ])
 
 // 计算属性
 const isFormValid = computed(() => {
   if (visitors.value.length === 0) return false
-  return visitors.value.every(visitor =>
-    visitor.name &&
-    visitor.phone &&
-    visitor.idNumber &&
-    !visitor.nameError &&
-    !visitor.phoneError &&
-    !visitor.idNumberError
+  return visitors.value.every(
+    (visitor) =>
+      visitor.name &&
+      visitor.phone &&
+      visitor.idNumber &&
+      !visitor.nameError &&
+      !visitor.phoneError &&
+      !visitor.idNumberError,
   )
 })
 
@@ -163,7 +186,7 @@ const addNewVisitor = () => {
     idNumber: '',
     nameError: '',
     phoneError: '',
-    idNumberError: ''
+    idNumberError: '',
   })
 }
 
@@ -196,7 +219,8 @@ const validatePhone = (index) => {
 
 const validateIdNumber = (index) => {
   const visitor = visitors.value[index]
-  const idRegex = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
+  const idRegex =
+    /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/
   if (!visitor.idNumber) {
     visitor.idNumberError = '请输入证件号码'
   } else if (!idRegex.test(visitor.idNumber)) {
@@ -215,9 +239,9 @@ const toggleExistingVisitor = (index) => {
 }
 
 const confirmExistingVisitors = () => {
-  const selectedVisitors = existingVisitors.value.filter(visitor => visitor.selected)
+  const selectedVisitors = existingVisitors.value.filter((visitor) => visitor.selected)
 
-  selectedVisitors.forEach(existingVisitor => {
+  selectedVisitors.forEach((existingVisitor) => {
     if (visitors.value.length < 5) {
       visitors.value.push({
         name: existingVisitor.name,
@@ -226,13 +250,13 @@ const confirmExistingVisitors = () => {
         idNumber: existingVisitor.idNumber,
         nameError: '',
         phoneError: '',
-        idNumberError: ''
+        idNumberError: '',
       })
     }
   })
 
   // 重置选择状态
-  existingVisitors.value.forEach(visitor => {
+  existingVisitors.value.forEach((visitor) => {
     visitor.selected = false
   })
 
@@ -248,7 +272,7 @@ const submitReservation = async () => {
 
   try {
     // 模拟API调用
-    await new Promise(resolve => setTimeout(resolve, 1000))
+    await new Promise((resolve) => setTimeout(resolve, 1000))
 
     // 显示成功弹窗
     showSuccessModal.value = true
@@ -259,8 +283,16 @@ const submitReservation = async () => {
 
 const closeSuccessModal = () => {
   showSuccessModal.value = false
-  // 可以跳转到其他页面或重置表单
-  router.push('/indexPage')
+  // 检查是否为预览模式并保留参数
+  const isPreviewMode = route.query.preview === '1'
+  if (isPreviewMode) {
+    router.push({
+      path: '/indexPage',
+      query: { preview: '1' },
+    })
+  } else {
+    router.push('/indexPage')
+  }
 }
 
 // 初始化时添加一个空的参观人
@@ -304,7 +336,7 @@ onMounted(() => {
   margin: 5px 0;
 
   .title {
-    color: #B1967B;
+    color: #b1967b;
   }
 }
 
@@ -326,14 +358,14 @@ onMounted(() => {
 }
 
 .add-new-btn {
-  background-color: #B1967B;
+  background-color: #b1967b;
   color: #fff;
 }
 
 .select-existing-btn {
   background-color: transparent;
-  color: #A78A6D;
-  border: 1px solid #B1967B;
+  color: #a78a6d;
+  border: 1px solid #b1967b;
 }
 
 .visitor-list {
@@ -362,7 +394,7 @@ onMounted(() => {
 .visitor-title {
   font-size: 16px;
   font-weight: bold;
-  color: #B1967B;
+  color: #b1967b;
 }
 
 .delete-btn {
@@ -371,7 +403,7 @@ onMounted(() => {
   justify-content: center;
   background: none;
   border: none;
-  color: #F45151;
+  color: #f45151;
   cursor: pointer;
   font-size: 14px;
 }
@@ -424,7 +456,7 @@ onMounted(() => {
 }
 
 .error-line :deep(.el-input__wrapper) {
-  border-bottom-color: #F45151;
+  border-bottom-color: #f45151;
   box-shadow: none;
 }
 
@@ -447,14 +479,14 @@ onMounted(() => {
 }
 
 .error-line :deep(.el-select__wrapper) {
-  border-bottom-color: #F45151;
+  border-bottom-color: #f45151;
   box-shadow: none;
 }
 
 .error-msg {
   position: absolute;
   bottom: -20px;
-  color: #F45151;
+  color: #f45151;
   font-size: 12px;
   margin-top: 5px;
 }
@@ -508,8 +540,8 @@ onMounted(() => {
 }
 
 .checkbox.checked {
-  background-color: #B1967B;
-  border-color: #B1967B;
+  background-color: #b1967b;
+  border-color: #b1967b;
 }
 
 .existing-actions {
@@ -526,7 +558,7 @@ onMounted(() => {
   align-items: center;
   width: 100%;
   padding: 15px;
-  background-color: #B1967B;
+  background-color: #b1967b;
   color: white;
   border: none;
   border-radius: 8px;
@@ -549,7 +581,7 @@ onMounted(() => {
   align-items: center;
   width: 100%;
   padding: 15px;
-  background-color: #B1967B;
+  background-color: #b1967b;
   color: white;
   border: none;
   border-radius: 8px;
@@ -587,7 +619,7 @@ onMounted(() => {
   width: 60px;
   height: 60px;
   margin: 0 auto 20px;
-  background-color: #7DBE2B;
+  background-color: #7dbe2b;
   border-radius: 50%;
   display: flex;
   justify-content: center;
@@ -609,11 +641,11 @@ onMounted(() => {
 .success-btn {
   width: 100%;
   padding: 12px;
-  background-color: #B1967B;
+  background-color: #b1967b;
   color: white;
   border: none;
   border-radius: 6px;
   font-size: 16px;
   cursor: pointer;
 }
-</style>
+</style>

src/views/indexPage/index.vue

@@ -5,27 +5,35 @@
     <div class="carousel-section">
       <el-carousel height="180px" indicator-position="bottom" :interval="4000">
         <el-carousel-item v-for="item in bannerData" :key="item.carouselId">
-          <img :src="getImg(item)" :alt="getTitle(item) || '轮播图'" class="carousel-img">
+          <img :src="getImg(item)" :alt="getTitle(item) || '轮播图'" class="carousel-img" />
         </el-carousel-item>
       </el-carousel>
     </div>
 
     <!-- 功能区域 -->
     <div class="function-section">
-      <div class="function-item" :class="{ 'disabled': isPreviewMode }" @click="handleFunctionClick('visit')">
-        <img src="@/assets/indexPage/visit.png" alt="预约参观" class="function-icon">
+      <div
+        class="function-item"
+        :class="{ disabled: isPreviewMode }"
+        @click="handleFunctionClick('visit')"
+      >
+        <img src="@/assets/indexPage/visit.png" alt="预约参观" class="function-icon" />
         <span class="function-text">预约参观</span>
       </div>
-      <div class="function-item" :class="{ 'disabled': isPreviewMode }" @click="handleFunctionClick('activity')">
-        <img src="@/assets/indexPage/activity.png" alt="活动预约" class="function-icon">
+      <div
+        class="function-item"
+        :class="{ disabled: isPreviewMode }"
+        @click="handleFunctionClick('activity')"
+      >
+        <img src="@/assets/indexPage/activity.png" alt="活动预约" class="function-icon" />
         <span class="function-text">活动预约</span>
       </div>
       <div class="function-item" @click="handleFunctionClick('map')">
-        <img src="@/assets/indexPage/map.png" alt="展馆地图" class="function-icon">
+        <img src="@/assets/indexPage/map.png" alt="展馆地图" class="function-icon" />
         <span class="function-text">展馆地图</span>
       </div>
       <div class="function-item" @click="handleFunctionClick('introduce')">
-        <img src="@/assets/indexPage/introduce.png" alt="展馆介绍" class="function-icon">
+        <img src="@/assets/indexPage/introduce.png" alt="展馆介绍" class="function-icon" />
         <span class="function-text">展馆介绍</span>
       </div>
     </div>
@@ -36,13 +44,18 @@
         <h3 class="section-title">展览资讯</h3>
         <span class="view-more" @click="viewMore('recommended')">查看更多 +</span>
       </div>
-      <div class="news-item" v-for="item in newsList" :key="item.informationId" @click="viewNews(item)">
-        <img :src="getInfoImg(item)" alt="展览资讯" class="news-img">
+      <div
+        class="news-item"
+        v-for="item in newsList"
+        :key="item.informationId"
+        @click="viewNews(item)"
+      >
+        <img :src="getInfoImg(item)" alt="展览资讯" class="news-img" />
         <div class="news-content">
           <h4 class="news-title">{{ getTitle(item) }}</h4>
-          <span class="news-desc"><el-icon>
-              <SortUp />
-            </el-icon></span>
+          <span class="news-desc"
+            ><el-icon> <SortUp /> </el-icon
+          ></span>
         </div>
       </div>
     </div>
@@ -55,9 +68,13 @@
       </div>
       <div class="scroll-container">
         <div class="scroll-wrapper">
-          <div class="exhibition-item" v-for="exhibition in exhibitionList" :key="exhibition.exhibitId"
-            @click="viewExhibition(exhibition)">
-            <img :src="getImg(exhibition)" alt="展览" class="exhibition-img">
+          <div
+            class="exhibition-item"
+            v-for="exhibition in exhibitionList"
+            :key="exhibition.exhibitId"
+            @click="viewExhibition(exhibition)"
+          >
+            <img :src="getImg(exhibition)" alt="展览" class="exhibition-img" />
             <div class="exhibition-info">
               <h4 class="exhibition-title">{{ getTitle(exhibition) }}</h4>
             </div>
@@ -74,13 +91,17 @@
       </div>
       <div class="scroll-container">
         <div class="scroll-wrapper">
-          <div class="activity-item" v-for="active in activeList" :key="active.activityId"
-            @click="viewActivity(active)">
+          <div
+            class="activity-item"
+            v-for="active in activeList"
+            :key="active.activityId"
+            @click="viewActivity(active)"
+          >
             <div class="active-top">
-              <img :src="getIndexImg(active)" alt="活动" class="activity-img">
-              <span class="active-go"><el-icon>
-                  <ArrowRight />
-                </el-icon></span>
+              <img :src="getIndexImg(active)" alt="活动" class="activity-img" />
+              <span class="active-go"
+                ><el-icon> <ArrowRight /> </el-icon
+              ></span>
             </div>
             <div class="activity-info">
               <h4 class="activity-title">{{ getTitle(active) }}</h4>
@@ -102,13 +123,7 @@ const router = useRouter()
 const route = useRoute()
 const store = useStore()
 // 使用首页API组合式函数
-const {
-  bannerData,
-  newsList,
-  exhibitionList,
-  activeList,
-  initAllData
-} = useIndexPageApi()
+const { bannerData, newsList, exhibitionList, activeList, initAllData } = useIndexPageApi()
 // 从vuex获取isFromParam
 const isFromParam = computed(() => store.getters.getIsFrom)
 
@@ -156,7 +171,7 @@ const handleFunctionClick = (type) => {
   if (isPreviewMode.value && !['map', 'introduce'].includes(type)) {
     return
   }
-
+  const preview = isPreviewMode.value ? '1' : ''
   console.log(`点击了${type}功能`)
   // 根据不同功能跳转到不同页面或显示不同内容
   switch (type) {
@@ -177,8 +192,9 @@ const handleFunctionClick = (type) => {
         path: '/allDetailsShow',
         query: {
           id: '1',
-          type: 'museum'
-        }
+          type: 'museum',
+          preview,
+        },
       })
       break
   }
@@ -210,14 +226,14 @@ const viewExhibition = (exhibition) => {
   const query = {
     id: exhibition.exhibitId,
     type: 'exhibition',
-    isFromPage: 'indexPage'
+    isFromPage: 'indexPage',
   }
   if (isPreviewMode.value) {
     query.preview = '1'
   }
   router.push({
     path: '/allDetailsShow',
-    query
+    query,
   })
 }
 
@@ -228,14 +244,14 @@ const viewActivity = (active) => {
   const query = {
     id: active.activityId,
     type: 'activity',
-    isFromPage: 'indexPage'
+    isFromPage: 'indexPage',
   }
   if (isPreviewMode.value) {
     query.preview = '1'
   }
   router.push({
     path: '/allDetailsShow',
-    query
+    query,
   })
 }
 
@@ -246,14 +262,14 @@ const viewNews = (news) => {
   const query = {
     id: news.informationId,
     type: 'information',
-    isFromPage: 'indexPage'
+    isFromPage: 'indexPage',
   }
   if (isPreviewMode.value) {
     query.preview = '1'
   }
   router.push({
     path: '/allDetailsShow',
-    query
+    query,
   })
 }
 
@@ -267,7 +283,10 @@ const handleMapClick = async () => {
     // 跳转到地图页面，并传递数据
     router.push({
       name: 'map',
-      state: { mapData }
+      query: {
+        preview: isPreviewMode.value ? '1' : '',
+      },
+      state: { mapData },
     })
   } catch (error) {
     console.error('获取地图数据失败:', error)
@@ -276,7 +295,6 @@ const handleMapClick = async () => {
   }
 }
 
-
 onMounted(() => {
   // 只有在首页路径时才初始化数据，避免路由跳转时重复触发
   if (route.path === '/indexPage') {
@@ -288,7 +306,7 @@ onMounted(() => {
       bannerParams: { pageNum: 1, pageSize: 5, status: statusValue },
       newsParams: { pageNum: 1, pageSize: 3, status: statusValue },
       exhibitionParams: { pageNum: 1, pageSize: 5, status: statusValue, recommend: 1 },
-      activeParams: { pageNum: 1, pageSize: 5, status: statusValue }
+      activeParams: { pageNum: 1, pageSize: 5, status: statusValue },
     })
   }
 })
@@ -364,7 +382,7 @@ onMounted(() => {
 
     .function-text {
       font-size: 16px;
-      color: #B1967B;
+      color: #b1967b;
     }
 
     &.disabled {
@@ -394,12 +412,11 @@ onMounted(() => {
       margin: 0;
       position: relative;
       padding-left: 10px;
-
     }
 
     .view-more {
       font-size: 14px;
-      color: #79ACF9;
+      color: #79acf9;
       cursor: pointer;
     }
   }
@@ -424,7 +441,7 @@ onMounted(() => {
     top: 0;
     width: 100%;
     height: 106px;
-    background: linear-gradient(90deg, rgba(177, 150, 123, 0) 0%, #B1967B 100%);
+    background: linear-gradient(90deg, rgba(177, 150, 123, 0) 0%, #b1967b 100%);
 
     .news-title {
       width: 150px;
@@ -433,7 +450,7 @@ onMounted(() => {
       font-weight: 800;
       margin: 16px;
       float: right;
-      color: #FFFFFF;
+      color: #ffffff;
       display: -webkit-box;
       -webkit-line-clamp: 2;
       -webkit-box-orient: vertical;
@@ -476,7 +493,7 @@ onMounted(() => {
   /* 桌面端显示并美化滚动条 */
   @media (min-width: 769px) {
     scrollbar-width: thin;
-    scrollbar-color: #B1967B #f1f1f1;
+    scrollbar-color: #b1967b #f1f1f1;
 
     &::-webkit-scrollbar {
       height: 8px;
@@ -488,7 +505,7 @@ onMounted(() => {
     }
 
     &::-webkit-scrollbar-thumb {
-      background: #B1967B;
+      background: #b1967b;
       border-radius: 4px;
     }
 
@@ -527,7 +544,7 @@ onMounted(() => {
     opacity: 0.8;
     position: absolute;
     bottom: 0;
-    background: #B1967B;
+    background: #b1967b;
 
     .exhibition-title {
       font-size: 16px;
@@ -569,9 +586,9 @@ onMounted(() => {
       position: absolute;
       bottom: 4px;
       right: 8px;
-      border: 1px solid #FCE39E;
+      border: 1px solid #fce39e;
       border-radius: 50%;
-      color: #FCE39E;
+      color: #fce39e;
       font-size: 12px;
     }
 
@@ -595,4 +612,4 @@ onMounted(() => {
     }
   }
 }
-</style>
+</style>

src/views/indexPage/news.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="news-container">
     <!-- 返回按钮 -->
-    <div class="back-button" @click="router.replace('/indexPage')">
-      <img src="@/assets/indexPage/icon_back.png" alt="">
+    <div class="back-button" @click="goBackToIndex">
+      <img src="@/assets/indexPage/icon_back.png" alt="" />
     </div>
 
     <!-- 标题 -->
@@ -16,9 +16,12 @@
       <div class="scroll-wrapper">
         <div class="all-item" v-for="item in newsList" :key="item.informationId">
           <div class="exhibition-item" @click="viewExhibition(item)">
-            <img :src="getFieldValue(item, 'infoImg')" :alt="getFieldValue(item, 'title') || '资讯图片'"
-              class="exhibition-img">
-            <img src="@/assets/indexPage/Frame.png" alt="kuang" class="bg-img">
+            <img
+              :src="getFieldValue(item, 'infoImg')"
+              :alt="getFieldValue(item, 'title') || '资讯图片'"
+              class="exhibition-img"
+            />
+            <img src="@/assets/indexPage/Frame.png" alt="kuang" class="bg-img" />
             <div class="exhibition-info">
               <h4 class="exhibition-title">{{ getFieldValue(item, 'title') || '暂无标题' }}</h4>
             </div>
@@ -40,6 +43,12 @@
   </div>
 </template>
 
+<script>
+export default {
+  name: 'NewsPage',
+}
+</script>
+
 <script setup>
 import { ref, onMounted, computed } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
@@ -78,6 +87,18 @@ onMounted(async () => {
   }
 })
 
+// 返回首页函数
+const goBackToIndex = () => {
+  if (isPreviewMode.value) {
+    router.replace({
+      path: '/indexPage',
+      query: { preview: '1' },
+    })
+  } else {
+    router.replace('/indexPage')
+  }
+}
+
 // 查看资讯详情
 const viewExhibition = (item) => {
   console.log('查看资讯详情:', item)
@@ -87,8 +108,8 @@ const viewExhibition = (item) => {
     query: {
       id: item.informationId,
       type: 'information', // 标识这是资讯详情
-      isFromPage: 'indexPage/news'
-    }
+      isFromPage: 'indexPage/news',
+    },
   })
 }
 </script>
@@ -138,7 +159,7 @@ const viewExhibition = (item) => {
     left: 0;
     width: 100%;
     height: 2px;
-    background: linear-gradient(90deg, rgba(91, 71, 46, 0.5) 0%, rgba(91, 71, 46, 0) 100%)
+    background: linear-gradient(90deg, rgba(91, 71, 46, 0.5) 0%, rgba(91, 71, 46, 0) 100%);
   }
 }
 
@@ -191,7 +212,7 @@ const viewExhibition = (item) => {
   /* 桌面端显示并美化滚动条 */
   @media (min-width: 769px) {
     scrollbar-width: thin;
-    scrollbar-color: #B1967B #f1f1f1;
+    scrollbar-color: #b1967b #f1f1f1;
 
     &::-webkit-scrollbar {
       height: 8px;
@@ -203,7 +224,7 @@ const viewExhibition = (item) => {
     }
 
     &::-webkit-scrollbar-thumb {
-      background: #B1967B;
+      background: #b1967b;
       border-radius: 4px;
     }
 
@@ -278,7 +299,7 @@ const viewExhibition = (item) => {
     display: flex;
     justify-content: center;
     align-items: center;
-    background: linear-gradient(90deg, #B1967B 0%, #9F6F3F 100%);
+    background: linear-gradient(90deg, #b1967b 0%, #9f6f3f 100%);
     border-radius: 50px 50px 50px 50px;
     font-size: 20px;
     cursor: pointer;
@@ -288,4 +309,4 @@ const viewExhibition = (item) => {
     }
   }
 }
-</style>
+</style>

src/views/indexPage/visitPreview.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="visit-preview-container">
-    <div class="back-button" @click="router.replace('/indexPage')">
-      <img src="@/assets/indexPage/icon_back.png" alt="">
+    <div class="back-button" @click="goBackToIndex">
+      <img src="@/assets/indexPage/icon_back.png" alt="" />
     </div>
 
     <div class="header-image">
@@ -31,10 +31,17 @@
 
       <h3 class="reservation-title">预约参观</h3>
       <div class="reservation-rules">
-        <p class="rule-content">①所有观众(包括享受优待政策的观众及其陪同人员)<span class="notic">均须实名预约</span>。放票时间为<span
-            class="notic">每日18:00，可提前7日(不包括当日)通过官方微信小程序预约</span>，预约时段分为上午(9:00-13:00)和下午(12:00-16:00)，当天不再放票;</p>
-        <p class="rule-content">②参观当日须按照预约时段入馆参观，错过预约时段将谢绝入馆。<span
-            class="notic">同一证件号</span>当天可进出馆2次，预约上午票的观众首次入馆时间必须在13：00前；</p>
+        <p class="rule-content">
+          ①所有观众(包括享受优待政策的观众及其陪同人员)<span class="notic">均须实名预约</span
+          >。放票时间为<span class="notic"
+            >每日18:00，可提前7日(不包括当日)通过官方微信小程序预约</span
+          >，预约时段分为上午(9:00-13:00)和下午(12:00-16:00)，当天不再放票;
+        </p>
+        <p class="rule-content">
+          ②参观当日须按照预约时段入馆参观，错过预约时段将谢绝入馆。<span class="notic"
+            >同一证件号</span
+          >当天可进出馆2次，预约上午票的观众首次入馆时间必须在13：00前；
+        </p>
       </div>
 
       <div class="reservation-button">
@@ -45,10 +52,36 @@
   </div>
 </template>
 
+<script>
+export default {
+  name: 'VisitPreview',
+}
+</script>
+
 <script setup>
-import { useRouter } from 'vue-router'
+import { computed } from 'vue'
+import { useRouter, useRoute } from 'vue-router'
 
 const router = useRouter()
+const route = useRoute()
+
+// 检查是否为预览模式
+const isPreviewMode = computed(() => {
+  return route.query.preview === '1'
+})
+
+// 返回首页函数
+const goBackToIndex = () => {
+  if (isPreviewMode.value) {
+    router.replace({
+      path: '/indexPage',
+      query: { preview: '1' },
+    })
+  } else {
+    router.replace('/indexPage')
+  }
+}
+
 const startPreview = () => {
   router.push({ name: 'startPreview' })
 }
@@ -61,7 +94,7 @@ const startPreview = () => {
   padding-bottom: 78px;
   background: #fff;
   position: relative;
-  color: #412A12;
+  color: #412a12;
   overflow-y: auto;
 }
 
@@ -93,7 +126,7 @@ const startPreview = () => {
   width: 100%;
   top: 200px;
   height: calc(100vh - 200px);
-  background: #E0D2B4;
+  background: #e0d2b4;
   border-top-left-radius: 30px;
   border-top-right-radius: 30px;
   padding: 30px;
@@ -114,13 +147,13 @@ const startPreview = () => {
 
   .time-title {
     font-size: 14px;
-    color: #B1967B;
+    color: #b1967b;
   }
 
   .time-value {
     font-size: 40px;
     font-weight: bold;
-    color: #94765A;
+    color: #94765a;
   }
 
   .line {
@@ -141,18 +174,18 @@ const startPreview = () => {
 
   .stop-time {
     font-size: 14px;
-    color: #B1967B;
+    color: #b1967b;
   }
 
   .stop-desc {
     font-size: 14px;
-    color: #B1967B;
+    color: #b1967b;
   }
 
   .time-note {
     width: 227px;
     font-size: 14px;
-    color: #B1967B;
+    color: #b1967b;
     margin-bottom: 20px;
   }
 
@@ -166,14 +199,14 @@ const startPreview = () => {
   .reservation-rules {
     font-size: 14px;
     line-height: 1.5;
-    color: #B1967B;
+    color: #b1967b;
     margin-bottom: 20px;
 
     .rule-content {
-      color: #B1967B;
+      color: #b1967b;
 
       .notic {
-        color: #94765A;
+        color: #94765a;
         font-weight: bold;
       }
     }
@@ -210,11 +243,11 @@ const startPreview = () => {
   height: 64px;
   background: rgba(255, 255, 255, 0.5);
   border-radius: 5px 5px 5px 5px;
-  border: 1px solid #94765A;
+  border: 1px solid #94765a;
   margin-top: 10px;
 }
 
 .btn-reserve:hover {
-  background-color: #9A7F65;
+  background-color: #9a7f65;
 }
-</style>
+</style>

src/views/user/index.vue

@@ -1,20 +1,210 @@
 <template>
-  <div class="user-container">
-    <h1>我的页面</h1>
+  <div class="scrollarea">
+    <div class="user-container">
+      <!-- 用户信息区域 -->
+      <div class="userinfo">
+        <div class="userinfo-avatar">
+          <el-icon :size="40"><Avatar /></el-icon>
+        </div>
+        <div class="login-in">请登录</div>
+      </div>
+
+      <!-- 我的预约标题 -->
+      <div class="user-title">我的预约</div>
+
+      <!-- 占位图片 -->
+      <div class="user-zhanwei">
+        <img
+          class="zhanwei-img"
+          src="https://sit-kelamayi.4dage.com/mini/wxImg/img_03.png"
+          alt="占位图"
+        />
+      </div>
+
+      <!-- 功能按钮区域 -->
+      <div class="function-section">
+        <div class="main-buttons">
+          <div class="btn-reserve btn-disabled">我的预约</div>
+          <div class="btn-people btn-disabled">我的参观人</div>
+        </div>
+
+        <div class="secondary-buttons">
+          <div class="btn-feed btn-disabled">意见反馈</div>
+          <div class="btn-out">退出登录</div>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
-<script setup>
-import { ref, onMounted } from 'vue'
+<script>
+export default {
+  name: 'UserIndex',
+}
+</script>
 
-onMounted(() => {
-  // 初始化逻辑
-})
+<script setup>
+// 这里不需要任何逻辑，因为用户要求去掉所有跳转和登录逻辑
 </script>
 
 <style lang="scss" scoped>
 .user-container {
+  height: 100vh;
+  background: url('https://sit-kelamayi.4dage.com/mini/wxImg/user-bg.png') no-repeat;
+  background-size: cover;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: space-between;
   padding: 20px;
-  padding-bottom: 70px; // 为底部导航栏留出空间
+  box-sizing: border-box;
+  padding-bottom: 90px; // 为底部导航栏留出空间
+}
+
+.scrollarea {
+  flex: 1;
+  overflow-y: hidden;
+}
+
+.userinfo {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: #aaa;
+  width: 80%;
+  .userinfo-avatar {
+    width: 100px;
+    height: 100px;
+    border-radius: 50%;
+    background-color: #fff;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+}
+
+.login-in {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  margin-top: 20px;
+  margin-bottom: 20px;
+  font-size: 16px;
+  color: #666;
+}
+
+.user-title {
+  width: 100%;
+  font-weight: bold;
+  color: #584735;
+  text-align: left;
+  font-size: 20px;
+  margin: 10px 0;
+}
+
+.user-zhanwei {
+  width: 100%;
+  height: 14px;
+  margin-bottom: 10px;
+}
+
+.zhanwei-img {
+  width: 100%;
+  height: 14px;
+}
+
+/* 功能按钮区域 */
+.function-section {
+  width: 100%;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+}
+
+.main-buttons {
+  margin-bottom: 10px;
+}
+
+.btn-reserve {
+  background: url('https://sit-kelamayi.4dage.com/mini/wxImg/preview-btn.png');
+  width: 100%;
+  height: 65px;
+  border-radius: 5px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-size: 100% auto;
+  color: #fff;
+  font-size: 16px;
+  font-weight: bold;
+}
+
+.btn-people {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 65px;
+  background: url('https://sit-kelamayi.4dage.com/mini/wxImg/btn_02.png');
+  background-size: 100% auto;
+  border-radius: 5px;
+  border: 1px solid #94765a;
+  margin-top: 10px;
+  color: #fff;
+  font-size: 16px;
+}
+
+.btn-feed {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 65px;
+  background: #fff;
+  border-radius: 5px;
+  border: 1px solid #ffffff;
+  color: #c8583d;
+  margin-bottom: 10px;
+  font-size: 16px;
+}
+
+.btn-out {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 65px;
+  border-radius: 5px;
+  border: 1px solid #d9d9d9;
+  color: #584735;
+  font-size: 16px;
+}
+
+/* 按钮置灰样式 */
+.btn-disabled {
+  opacity: 0.5;
+  filter: grayscale(50%);
+  cursor: not-allowed;
+}
+
+// 响应式适配
+@media (max-width: 768px) {
+  .user-container {
+    padding: 15px;
+    padding-bottom: 90px;
+  }
+
+  .user-title {
+    font-size: 18px;
+  }
+
+  .btn-reserve,
+  .btn-people,
+  .btn-feed,
+  .btn-out {
+    height: 55px;
+    font-size: 14px;
+  }
 }
-</style>
+</style>