finish update

components/htz-image-upload/htz-image-upload.vue

@@ -18,7 +18,7 @@
 				<!-- #endif -->
 			</view>
 
-			<image v-else :src="getFileUrl(item)" @click="imgPreview(getFileUrl(item))"></image>
+			<image v-else :src="getFileUrl(item)" @click="chooseFile"></image>
 
 			<view class="htz-image-upload-Item-del" v-if="remove" @click="imgDel(index)">×</view>
 		</view>
@@ -267,6 +267,18 @@
 				if (this.disabled) {
 					return false;
 				}
+				
+				// 如果已有图片，先清空再选择新图片
+				if (this.uploadLists.length > 0) {
+					this.uploadLists = [];
+					// #ifndef VUE3
+					this.$emit("input", this.uploadLists);
+					// #endif
+					// #ifdef VUE3
+					this.$emit("update:modelValue", this.uploadLists);
+					// #endif
+				}
+				
 				switch (this.mediaTypeData.indexOf(this.mediaType)) {
 					case 1: //视频
 						this.videoAdd();
@@ -758,6 +770,12 @@
 		width: 100%;
 		height: 100%;
 		border-radius: 10rpx;
+		cursor: pointer;
+		transition: opacity 0.3s ease;
+	}
+	
+	.htz-image-upload-Item image:hover {
+		opacity: 0.8;
 	}
 
 	.htz-image-upload-Item-video {

node_modules/.package-lock.json

@@ -1,8 +1,14 @@
 {
-  "name": "wx-dangyuanjiaoyujidi",
+  "name": "szgb-book-wx",
-  "lockfileVersion": 2,
+  "lockfileVersion": 3,
   "requires": true,
   "packages": {
+    "node_modules/jweixin-module": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmmirror.com/jweixin-module/-/jweixin-module-1.6.0.tgz",
+      "integrity": "sha512-dGk9cf+ipipHmtzYmKZs5B2toX+p4hLyllGLF6xuC8t+B05oYxd8fYoaRz0T30U2n3RUv8a4iwvjhA+OcYz52w==",
+      "license": "ISC"
+    },
     "node_modules/moment": {
       "version": "2.29.3",
       "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.3.tgz",

node_modules/jweixin-module/README.md

@@ -0,0 +1,30 @@
+# jweixin-module
+
+微信JS-SDK
+
+## 安装
+
+### NPM
+
+```shell
+npm install jweixin-module --save
+```
+
+### UMD
+
+```http
+https://unpkg.com/jweixin-module/out/index.js
+```
+
+## 使用
+
+```js
+var jweixin = require('jweixin-module')
+jweixin.ready(function(){
+    // TODO
+});
+```
+
+## 完整API
+
+>[微信JS-SDK说明文档](https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115)

node_modules/jweixin-module/package.json

@@ -0,0 +1,26 @@
+{
+    "name": "jweixin-module",
+    "version": "1.6.0",
+    "description": "微信JS-SDK",
+    "main": "lib/index.js",
+    "scripts": {},
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/zhetengbiji/jweixin-module.git"
+    },
+    "keywords": [
+        "wxjssdk",
+        "weixin",
+        "jweixin",
+        "wechat",
+        "jssdk",
+        "wx"
+    ],
+    "author": "Shengqiang Guo",
+    "license": "ISC",
+    "bugs": {
+        "url": "https://github.com/zhetengbiji/jweixin-module/issues"
+    },
+    "homepage": "https://github.com/zhetengbiji/jweixin-module#readme",
+    "devDependencies": {}
+}

package-lock.json

@@ -1,16 +1,36 @@
 {
+  "name": "szgb-book-wx",
+  "lockfileVersion": 3,
   "requires": true,
-  "lockfileVersion": 1,
+  "packages": {
+    "": {
       "dependencies": {
-    "moment": {
+        "jweixin-module": "^1.6.0",
+        "moment": "^2.29.3",
+        "uview-ui": "^2.0.31"
+      }
+    },
+    "node_modules/jweixin-module": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmmirror.com/jweixin-module/-/jweixin-module-1.6.0.tgz",
+      "integrity": "sha512-dGk9cf+ipipHmtzYmKZs5B2toX+p4hLyllGLF6xuC8t+B05oYxd8fYoaRz0T30U2n3RUv8a4iwvjhA+OcYz52w==",
+      "license": "ISC"
+    },
+    "node_modules/moment": {
       "version": "2.29.3",
       "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.3.tgz",
-      "integrity": "sha512-c6YRvhEo//6T2Jz/vVtYzqBzwvPT95JBQ+smCytzf7c50oMZRsR/a4w88aD34I+/QVSfnoAnSBFPJHItlOMJVw=="
+      "integrity": "sha512-c6YRvhEo//6T2Jz/vVtYzqBzwvPT95JBQ+smCytzf7c50oMZRsR/a4w88aD34I+/QVSfnoAnSBFPJHItlOMJVw==",
+      "engines": {
+        "node": "*"
+      }
     },
-    "uview-ui": {
+    "node_modules/uview-ui": {
       "version": "2.0.31",
       "resolved": "https://registry.npmjs.org/uview-ui/-/uview-ui-2.0.31.tgz",
-      "integrity": "sha512-I/0fGuvtiKHH/mBb864SGYk+SJ7WaF32tsBgYgeBOsxlUp+Th+Ac2tgz2cTvsQJl6eZYWsKZ3ixiSXCAcxZ8Sw=="
+      "integrity": "sha512-I/0fGuvtiKHH/mBb864SGYk+SJ7WaF32tsBgYgeBOsxlUp+Th+Ac2tgz2cTvsQJl6eZYWsKZ3ixiSXCAcxZ8Sw==",
+      "engines": {
+        "HBuilderX": "^3.1.0"
+      }
     }
   }
 }

package.json

@@ -1,5 +1,6 @@
 {
   "dependencies": {
+    "jweixin-module": "^1.6.0",
     "moment": "^2.29.3",
     "uview-ui": "^2.0.31"
   }

packages/map/map.vue

@@ -1,11 +1,39 @@
 <template>
 	<view>
-		<map style="width: 100%; height: 100vh;position: relative;" @markertap="markertap" :latitude="info.latitude"
+		
+		<!-- H5环境：嵌入iframe地图 -->
+		<view v-if="isH5" class="h5-map-container">
+			<iframe 
+				:src="getMapUrl()"
+				width="100%" 
+				height="100vh" 
+				frameborder="0"
+				class="h5-map-iframe">
+			</iframe>
+			
+			<!-- H5环境：底部工具栏 -->
+			<view class="h5-map-toolbar">
+				<view class="toolbar-content">
+					<view class="location-info">
+						<view class="location-name">{{info.name || '苏州革命博物馆'}}</view>
+						<view class="location-address">{{info.address || '苏州市姑苏区'}}</view>
+					</view>
+					<view class="navigation-btn" @click="openlocation">
+						<text class="nav-text">导航</text>
+					</view>
+				</view>
+			</view>
+		</view>
+		
+		<!-- 小程序环境：使用uni-app地图组件 -->
+		<map v-else style="width: 100%; height: 100vh;position: relative;" @markertap="markertap" :latitude="info.latitude"
 			:longitude="info.longitude" :markers="covers"></map>
 	</view>
 </template>
 
 <script>
+	const jweixin = require('jweixin-module');
+	
 	export default {
 		data() {
 			return {
@@ -18,10 +46,25 @@
 					iconPath: '/static/img/location.png',
 					id: 1
 				}],
+				isH5: false
 			}
 		},
 		onLoad() {
-			this.openlocation();
+			// 检测运行环境
+			this.isH5 = typeof window !== 'undefined' && window.location
+			
+			// H5环境下隐藏标题栏
+			if (this.isH5) {
+				// H5环境：通过CSS隐藏导航栏
+				document.body.style.paddingTop = '0';
+				// 隐藏可能的导航栏元素
+				const navBar = document.querySelector('.uni-page-head');
+				if (navBar) {
+					navBar.style.display = 'none';
+				}
+			}
+			
+			this.loadInfo();
 		},
 		onShareAppMessage() {
 			return this.util.shareInfo
@@ -31,21 +74,112 @@
 			return this.util.shareInfo
 		},
 		methods: {
+			
+			// H5环境：生成地图URL
+			getMapUrl() {
+				if (this.info.latitude && this.info.longitude) {
+					// 使用真实坐标
+					const url = `https://apis.map.qq.com/uri/v1/marker?marker=coord:${this.info.latitude},${this.info.longitude};title:${encodeURIComponent(this.info.name || '苏州革命博物馆')};addr:${encodeURIComponent(this.info.address || '')}&referer=myapp`;
+					return url;
+				}
+				// 如果没有坐标数据，使用默认坐标
+				return 'https://apis.map.qq.com/uri/v1/marker?marker=coord:31.297241,120.580792;title:苏州革命博物馆;addr:苏州市姑苏区&referer=myapp';
+			},
+			
 			markertap() {
 				this.openlocation();
 			},
 			openlocation() {
-				this.loadInfo(function(res) {
+				if (this.isH5) {
-					console.log("123")
+					// H5环境：使用微信JS-SDK
+					this.initWxJSSDK();
+				} else {
+					// 小程序环境：使用uni.openLocation
 					uni.openLocation({
-						latitude: res.latitude,
+						latitude: this.info.latitude,
-						longitude: res.longitude,
+						longitude: this.info.longitude,
-						name: res.name,
+						name: this.info.name,
-						address: res.address
+						address: this.info.address
+					});
+				}
+			},
+			
+			// 初始化微信JS-SDK
+			initWxJSSDK() {
+				// 确保jweixin模块已加载
+				if (typeof jweixin === 'undefined') {
+					console.error('jweixin模块未加载');
+					uni.showToast({ title: '请在微信中打开', icon: 'none' });
+					return;
+				}
+				
+				const currentUrl = window.location.href.split('#')[0];
+				console.log('当前页面URL:', currentUrl);
+				
+				// 调用后端鉴权接口
+				this.util.request({
+					api: `/api/mobile/user/wx-jssdk?url=${encodeURIComponent(currentUrl)}`,
+					method: 'GET',
+					utilSuccess: (res) => {
+						console.log('JS-SDK鉴权成功:', res);
+						this.configWxJSSDK(res);
+					},
+					utilFail: (err) => {
+						console.error('JS-SDK鉴权失败:', err);
+						// 降级方案：使用腾讯地图
+						this.fallbackToTencentMap();
+					}
+				});
+			},
+			
+			// 配置微信JS-SDK
+			configWxJSSDK(config) {
+				if (typeof jweixin === 'undefined') {
+					console.error('jweixin模块未加载');
+					this.fallbackToTencentMap();
+					return;
+				}
+				
+				jweixin.config({
+					debug: config.debug || false,
+					beta: config.beta || false,
+					appId: config.appId,
+					timestamp: config.timestamp,
+					nonceStr: config.nonceStr,
+					signature: config.signature,
+					jsApiList: config.jsApiList || ['openLocation'],
+					openTagList: config.openTagList || []
+				});
+				
+				jweixin.ready(() => {
+					console.log('微信JS-SDK配置成功');
+					this.openWxLocation();
+				});
+				
+				jweixin.error((res) => {
+					console.error('微信JS-SDK配置失败:', res);
+					this.fallbackToTencentMap();
 				});
-				})
 			},
-			loadInfo(cb) {
+			
+			// 调用微信openLocation
+			openWxLocation() {
+				jweixin.openLocation({
+					latitude: this.info.latitude,
+					longitude: this.info.longitude,
+					name: this.info.name || '苏州革命博物馆',
+					address: this.info.address || '苏州市姑苏区',
+					scale: 14,
+					infoUrl: ''
+				});
+			},
+			
+			// 降级方案：使用腾讯地图
+			fallbackToTencentMap() {
+				// const mapUrl = `https://apis.map.qq.com/uri/v1/marker?marker=coord:${this.info.latitude},${this.info.longitude};title:${encodeURIComponent(this.info.name || '苏州革命博物馆')};addr:${encodeURIComponent(this.info.address || '苏州市姑苏区')}&referer=myapp`;
+				// window.open(mapUrl, '_blank');
+			},
+			loadInfo() {
 				var that = this;
 				this.util.request({
 					api: '/api/mobile/visit/introduce',
@@ -61,18 +195,96 @@
 							height: 30,
 							iconPath: '/static/img/location.png'
 						});
-						cb(res);
 					},
 					utilFail: function(res) {
 
 					}
 				})
-
 			},
 		}
 	}
 </script>
 
 <style>
+	/* H5地图iframe容器样式 */
+	.h5-map-container {
+		width: 100%;
+		height: 100vh;
+		position: relative;
+		background: #f5f5f5;
+	}
+	
+	.h5-map-iframe {
+		width: 100%;
+		height: 100vh;
+		border: none;
+		display: block;
+	}
+	
+	/* H5底部工具栏样式 */
+	.h5-map-toolbar {
+		position: absolute;
+		bottom: 0;
+		left: 0;
+		width: 100%;
+		height: 230rpx;
+		background: #fff;
+		box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
+		z-index: 999;
+	}
+	
+	.toolbar-content {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 20rpx 30rpx;
+		height: 100%;
+		box-sizing: border-box;
+	}
+	
+	.location-info {
+		flex: 1;
+		margin-right: 20rpx;
+	}
+	
+	.location-name {
+		font-size: 32rpx;
+		font-weight: bold;
+		color: #333;
+		margin-bottom: 8rpx;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+	
+	.location-address {
+		font-size: 26rpx;
+		color: #666;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+	}
+	
+	.navigation-btn {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		width: 100rpx;
+		height: 80rpx;
+		background: #007AFF;
+		border-radius: 12rpx;
+		box-shadow: 0 4rpx 12rpx rgba(0, 122, 255, 0.3);
+		transition: all 0.3s ease;
+	}
+	
+	.navigation-btn:active {
+		transform: scale(0.95);
+		box-shadow: 0 2rpx 8rpx rgba(0, 122, 255, 0.4);
+	}
 	
+	.nav-text {
+		font-size: 28rpx;
+		color: #fff;
+		font-weight: bold;
+	}
 </style>

pages.json

@@ -122,6 +122,7 @@
 			"path": "map/map",
 			"style": {
 				"navigationBarTitleText": "展馆导航",
+				"navigationStyle": "custom",
 				"enablePullDownRefresh": false
 			}
 

pages/mine/index.vue

@@ -5,7 +5,7 @@
 		</view>
 		<view class="mine-box">
 			<view class="mine-box-user">
-				<view class="user_avator">
+				<view class="user_avator" @click="editProfile">
 					<u-avatar :src="info.headimgurl?info.headimgurl:headReplace" size="61"></u-avatar>
 				</view>
 				<view class="user_info">
@@ -78,7 +78,7 @@
 							<u-form-item label="头像" prop="avatar" labelWidth="60px">
 								<htz-image-upload :max="1" v-model="avatarList" mediaType="image" :chooseNum="1"
 									:sourceType="['album','camera']" :compress="false" :quality="80" :formData="otherData"
-									:remove="true" :dataType="1" @uploadSuccess="uploadSuccess" @imgDelete="imgDelete"
+									:remove="false" :dataType="1" @uploadSuccess="uploadSuccess" @imgDelete="imgDelete"
 									@uploadFail="uploadFail" :action="action"></htz-image-upload>
 							</u-form-item>
 						</u-form>
@@ -104,7 +104,7 @@
 						<u-form-item label="头像" prop="avatar" labelWidth="60px">
 							<htz-image-upload :max="1" v-model="avatarList" mediaType="image" :chooseNum="1"
 								:sourceType="['album','camera']" :compress="false" :quality="80" :formData="otherData"
-								:remove="true" :dataType="1" @uploadSuccess="uploadSuccess" @imgDelete="imgDelete"
+								:remove="false" :dataType="1" @uploadSuccess="uploadSuccess" @imgDelete="imgDelete"
 								@uploadFail="uploadFail" :action="action"></htz-image-upload>
 						</u-form-item>
 					</u-form>
@@ -168,6 +168,24 @@
 			});
 		},
 		methods: {
+			// 点击头像编辑个人信息
+			editProfile() {
+				// 填充当前用户信息到表单
+				this.form.name = this.info.nickname || '';
+				this.form.avatar = this.info.headimgurl || '';
+				
+				// 设置头像列表
+				this.avatarList = [];
+				if (this.info.headimgurl) {
+					this.avatarList.push({
+						type: 0,
+						url: this.info.headimgurl
+					});
+				}
+				
+				// 显示编辑弹窗
+				this.showAuthorization = true;
+			},
 			closeInfo() {
 				this.showAuthorization = false;
 			},
@@ -307,6 +325,11 @@
 		padding-left: 63rpx;
 	}
 
+	.user_avator {
+		cursor: pointer;
+		position: relative;
+	}
+
 	.user_info {
 		margin-left: 33rpx;
 	}

utils/util.js

@@ -87,13 +87,15 @@ const getOpenidInfo = (cb, refresh) => {
 	// }
 	let user_info = uni.getStorageSync(user_info_key)
 	if (!isNull(user_info)) {
+		uni.showToast({ title: '已经有用户信息,故不进行登录', icon: 'success' })
 		cb(user_info)
 		return
 	}
 	// 判断运行环境：H5还是小程序
 	const isH5 = typeof window !== 'undefined' && window.location
 	const isWeixinBrowser = isH5 && /MicroMessenger/i.test(navigator.userAgent)
-
+	// uni.showToast({ title: 'isH5:'+isH5, icon: 'success' })
+	// uni.showToast({ title: 'isWeixinBrowser:'+isWeixinBrowser, icon: 'success' })
 	if (isH5 && isWeixinBrowser) {
 		// H5环境下的微信授权登录
 		wxH5AuthLogin(cb)
@@ -126,14 +128,14 @@ const wxH5AuthLogin = (cb) => {
 		let temp = decodeURIComponent((new RegExp('[?|&]' + 'code' + '=' + '([^&;]+?)(&|#|;|$)').exec(
 			link) || [, ''])[1].replace(/\+/g, '%20')) || null;
 		console.log("code", temp)
-
+		// uni.showToast({ title: '授权码:'+temp, icon: 'success' })
 		// 上传 code 到服务器获取 token
 		request({
 			api: `/api/mobile/user/wx-login?code=${temp}`,
 			method: 'GET',
 			utilSuccess: (res) => {
 				if (res.token && res.token.trim() !== '') {
-					console.log('获取 token 成功:', res.token)
+					uni.showToast({ title: '登录成功', icon: 'success' })
 					// 保持与小程序登录一致的存储方式
 					const userInfo = {
 						token: res.token,
@@ -319,6 +321,8 @@ const request = options => {
 						options.utilFail('TODO: 特殊处理非200错误(' + res.statusCode + ')');
 					}
 				}
+				// 清除所有缓存,如果发生错误.
+				uni.clearStorageSync();
 			} else {
 
 				if (res.data.hasOwnProperty("errcode")) {
@@ -327,6 +331,9 @@ const request = options => {
 					} else {
 						options.utilFail(res.data.errmsg);
 					}
+
+					// 清除所有缓存,如果发生错误.
+					uni.clearStorageSync();
 				} else {
 					if (options.utilSuccess != undefined) {
 						options.utilSuccess(res.data);