save

pages/exhibit/index.vue

@@ -27,7 +27,7 @@
 				<view :class="showBook?'relic_active':''" @click="changeBook('book')">党史书籍</view>
 			</view>
 			<view class="books" v-if="showBook">
-				<image class="books_img" src="../../static/book/book_bottom.png" mode=""></image>
+				<image class="books_img" :src="isH5 ? '/h5/static/book/book_bottom.png' : '../../static/book/book_bottom.png'" mode=""></image>
 				<u-swiper @click="toBook" :list="bookList" :displayMultipleItems="displayMultipleItems" :circular="true"
 					:indicator="true" indicatorStyle="bottom" indicatorMode="dot" bgColor="transparent"
 					indicatorActiveColor="#9f4946" indicatorInactiveColor="#9f4946" :autoplay="false"
@@ -55,7 +55,7 @@
 					</swiper>
 					<view class="myswiper-item-title">
 						<view class="">
-							{{relicList[relicIndex].name?relicList[relicIndex].name:''}}
+							{{relicList[relicIndex] && relicList[relicIndex].name ? relicList[relicIndex].name : ''}}
 						</view>
 						<!-- <view class="">
 							革命博物馆典藏
@@ -108,17 +108,31 @@
 				exhibitList: [],
 				bookList: [],
 				relicList: [],
-				bgimg: '../../static/book/relic_bg.png',
+				bgimg: '',
 				padTop: 0,
 				showBook: false,
 				relicIndex: 0,
 				displayMultipleItems: 0,
-				authToken: ''
+				authToken: '',
+				isH5: false
 			}
 		},
 		onLoad() {
+			// 检测运行环境：H5还是小程序
+			const isH5 = typeof window !== 'undefined' && window.location
+			this.isH5 = isH5
+			
+			if (isH5) {
+				// H5环境：使用固定的顶部间距和绝对路径
+				this.padTop = 80 // H5环境下的固定顶部间距
+				this.bgimg = '/h5/static/book/relic_bg.png' // H5环境使用绝对路径
+			} else {
+				// 小程序环境：使用getMenuButtonBoundingClientRect和相对路径
 				const MenuButton = uni.getMenuButtonBoundingClientRect()
 				this.padTop = MenuButton.top + MenuButton.height + 10
+				this.bgimg = '../../static/book/relic_bg.png' // 小程序环境使用相对路径
+			}
+			
 			this.authToken = uni.getStorageSync('userInfo_token').token
 			this.getExhibit()
 			this.getRelic()
@@ -148,10 +162,12 @@
 			changeBook(e) {
 				if (e === 'book') {
 					this.showBook = true
-					this.bgimg = '../../static/book/book_bg.png'
+					// 根据环境设置不同的路径
+					this.bgimg = this.isH5 ? '/h5/static/book/book_bg.png' : '../../static/book/book_bg.png'
 				} else {
 					this.showBook = false
-					this.bgimg = '../../static/book/relic_bg.png'
+					// 根据环境设置不同的路径
+					this.bgimg = this.isH5 ? '/h5/static/book/relic_bg.png' : '../../static/book/relic_bg.png'
 				}
 			},
 			toRelicDetail(id) {
@@ -199,7 +215,11 @@
 			},
 			changeRelic(e) {
 				console.log(e)
-				this.relicIndex = e.detail.current
+				const newIndex = e.detail.current
+				// 确保索引不超出数组范围
+				if (newIndex >= 0 && newIndex < this.relicList.length) {
+					this.relicIndex = newIndex
+				}
 			},
 			getRelic() {
 				var that = this;
@@ -215,6 +235,10 @@
 						that.relicList = res.data.filter(item => {
 							return item.show_list === 1
 						})
+						// 确保 relicIndex 不超出数组范围
+						if (that.relicList.length > 0 && that.relicIndex >= that.relicList.length) {
+							that.relicIndex = 0
+						}
 					},
 					utilFail: function(res) {
 
@@ -372,7 +396,7 @@
 	}
 
 	.relic .relic_active {
-		background: url(../../static/book/current.png) no-repeat left top;
+		background: url(/h5/static/book/current.png) no-repeat left top;
 		background-size: 100% 100%;
 		border: 1px solid transparent;
 		color: #fff;

utils/util.js

@@ -153,7 +153,7 @@ const wxH5AuthLogin = (cb) => {
 		})
 	} else {
 		// 未获取授权码，跳转到微信授权页面
-		const appId = 'wxbf4862e929ab85b0'
+		const appId = 'wx90acb6e2aa676977'
 		const currentUrl = window.location.href
 		const redirectUri = encodeURIComponent(currentUrl.replace(/#\//, ""));
 		const scope = 'snsapi_userinfo'