9-30-1

pages/applic/aed.vue

@@ -1,47 +1,89 @@
 <template>
 	<view class="content">
+		<view class="" style="height: 20rpx;"></view>
+		<!-- map  -->
 		<view class="map">
-			<map @updated='mapChange' ref='map_1' style="width:750rpx;" :style="{'height': height}" :latitude="latitude"
-				:longitude="longitude" :markers="marker" @markertap="lookmore" @regionchange="mapchange" show-location></map>
+			<map @updated='mapChange' ref='map_1' class="map-map" 
+				:latitude="baseLat" :longitude="baseLng" :markers="marker" @markertap="lookmore" ></map>
 		</view>
-		<view class="aedxq-wrap" v-if="isShow">
-			<view class="xq-top">
-				<view class="aed-name">
-					{{showAed.name}}
-				</view>
-				<view class="aed-dis">
-					距离：{{showAed.dis}}
+		<view class="" style="height: 20rpx;"></view>
+		<!-- 列表 -->
+		<scroll-view scroll-y="true" :style="{'height':height}" class="aed-list" @scrolltolower="loadData()">
+			<view class="aed-item flex" v-for="(item,mindex) in AEDList" @click="listlookmore(item,mindex)">
+				<view class="item-left">
+					<view class="clamp">
+						{{item.name}}
+					</view>
+					<view class="clamp aed-address">
+						地址：{{item.address}}
+					</view>
 				</view>
-				<view class="aed-address" style="padding-top: 10rpx;">
-					地址：{{showAed.address}}
+				<view class="item-right flex">
+					<image src="../../static/icon/dingwei.png" mode=""></image>
+					<view class="">
+						{{item.range}}KM
+					</view>
 				</view>
-				<view class="aed-address" style="padding-top: 10rpx;">
-					安装位置：{{showAed.addressxq}}
+			</view>
+			<uni-load-more :status="loadingType"></uni-load-more>
+		</scroll-view>
+		<!-- 导航选择层 -->
+		<uni-popup ref="popup" type="bottom" @click="close">
+			<view class="popup_row">
+				<view class="rows">
+					<view class="rows-item" @click="toGaodeMap">高德地图</view>
+					<view class="rows-item" @click="tobaiDuMap">百度地图</view>
+					<view class="rows-item" @click="totengxunMap">腾讯地图</view>
 				</view>
 			</view>
-			<view class="xq-img-wrap">
-				<scroll-view scroll-x="true" class="aed-img-scroll">
-					<view class="" style="display: flex;flex-wrap: nowrap;">
-						<image :src="baseURL + item" mode="heightFix" v-for="item in showAed.imgs"
-							class="aed-img" @click="openimg(item)" :key="item"></image>
+		</uni-popup>
+		<!-- aed详情 -->
+		<uni-popup ref="popupinfo" type="bottom" >
+			<view class="aedxq-wrap">
+				<view class="xq-top">
+					<view class="aed-name">
+						{{showAed.name}}
+					</view>
+					<view class="aed-dis">
+						距离：{{showAed.dis}}
 					</view>
-				</scroll-view>
-				<view class="aed-phone" @click="makecall(showAed.phone)">
-					电话
+					<view class="aed-address" style="padding-top: 10rpx;">
+						地址：{{showAed.address}}
+					</view>
+					<view class="aed-address" style="padding-top: 10rpx;">
+						安装位置：{{showAed.addressxq}}
+					</view>
+				</view>
+				<view class="xq-img-wrap">
+					<scroll-view scroll-x="true" class="aed-img-scroll">
+						<view class="" style="display: flex;flex-wrap: nowrap;">
+							<image :src="'https://red.liuniu946.com' + item" mode="heightFix" v-for="item in showAed.imgs"
+								class="aed-img" @click="openimg(item)" :key="item"></image>
+						</view>
+					</scroll-view>
+					<!-- <view class="aed-phone" @click="makecall(showAed.phone)">
+						电话
+					</view> -->
+				</view>
+				<view class="aed-dh" @click="opendh">
+					导航
 				</view>
 			</view>
-			<view class="aed-dh" @click="opendh">
-				导航
+		</uni-popup>
+		<!-- 导航选择层 -->
+		<uni-popup ref="popup" type="bottom" @click="close">
+			<view class="popup_row">
+				<view class="rows">
+					<view class="rows-item" @click="toGaodeMap">高德地图</view>
+					<view class="rows-item" @click="tobaiDuMap">百度地图</view>
+					<view class="rows-item" @click="totengxunMap">腾讯地图</view>
+				</view>
 			</view>
-		</view>
+		</uni-popup>
 	</view>
 </template>
 
 <script>
-	import {
-		saveUrl,
-		interceptor
-	} from '@/utils/loginUtils.js';
 	import {
 		mapState,
 		mapMutations
@@ -50,8 +92,7 @@
 	import uniPopup from '@/components/uni-popup/uni-popup.vue';
 	import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
 	import {
-		getAed,
-		MiniLink
+		getAed
 	} from '@/api/category.js'
 	export default {
 		components: {
@@ -62,16 +103,18 @@
 		//相关配置参数
 		data() {
 			return {
+				baseLng: '',//地图中心经度
+				baseLat: '',//地图中心纬度
 				aedmarker: [],
 				loaded: false,
 				loadingType: 'more',
 				page: 1,
-				limit: 1000,
+				limit: 100,
 				AEDList: [],
 				height: '',
 				list: [],
-				latitude: '', // 本地坐标
-				longitude: '', // 本地坐标
+				latitude: '',// 本地坐标
+				longitude: '',// 本地坐标
 				phone: '',
 				marker: [],
 				showAed: {
@@ -95,7 +138,7 @@
 			uni.getSystemInfo({
 				success: resu => {
 					const query = uni.createSelectorQuery();
-					query.select('.map').boundingClientRect();
+					query.select('.aed-list').boundingClientRect();
 					query.exec(function(res) {
 						console.log(res, 'ddddddddddddd');
 						_this.height = resu.windowHeight - res[0].top + 'px';
@@ -107,19 +150,8 @@
 		},
 		onLoad() {
 			let obj = this;
-			// this.getLocal()
-			
-		},
-		onShow() {
-			this.marker = []
-			this.list = []
-			this.page = 1
-			this.loadingType = 'more'
 			this.getLocal()
-			// if(this.page == 1) {
-			// 	this.getLocal()
-			// }
-		// this.getUrl()
+
 		},
 		computed: {
 			...mapState('user', ['hasLogin', 'userInfo']),
@@ -127,53 +159,20 @@
 		},
 		methods: {
 			...mapMutations('user', ['setUserInfo']),
-			getUrl() {
-					
-				MiniLink({
-					path: '/pages/applic/aed'
-				}).then(res => {
-					console.log(res)
-				})
-			},
-			// 
-			mapchange(e){
-				console.log('地图刷新完毕',e)
-				if(this.latitude) {
-					this.loadData()
-				}else {
-					
-				}
-				
-			},
 			// 导航
 			opendh() {
 				console.log('导航')
-				let obj = this
-				// #ifdef H5
-				this.$refs.aedxq.close()
 				this.$refs.popup.open();
-				// #endif
-
-				// #ifdef MP-WEIXIN
-				console.log(obj.showAed.lat, obj.showAed.lon)
-				wx.openLocation({
-					latitude: obj.showAed.lat * 1,
-					longitude: obj.showAed.lon * 1,
-					name: obj.showAed.name,
-					address: obj.showAed.address
-				})
-				// #endif
-
 			},
 			// 关闭图片弹窗
 			closePup() {
 				this.$refs.lookimg.close()
 			},
 			// 打开图片弹窗
-			openimg(src) {
+			openimg(src,srcList) {
 				let obj = this
 				this.chooseImg = this.baseURL + src
-
+				
 				console.log('chooseImg', this.chooseImg)
 				// this.$refs.lookimg.open()
 				let arr = obj.showAed.imgs.map(item => {
@@ -194,9 +193,32 @@
 			closeAedXq() {
 				this.$refs.aedxq.close()
 			},
+			listlookmore(e,index) {
+				let obj = this
+				obj.marker[obj.befoId].iconPath = '/static/icon/aed-na.png'
+				obj.befoId = index*1 +1
+				let aedobj = e
+				console.log(aedobj.name,'aedobj++++')
+				obj.showAed = {
+					name: aedobj.name,
+					address: aedobj.address,
+					addressxq: aedobj.install_address,
+					dis: aedobj.range*1 >= 1 ? (aedobj.range + 'km') : (aedobj.distance + 'm'),
+					lat: aedobj.latitude,
+					lon: aedobj.longitude,
+					imgs: aedobj.images.split(','),
+					phone: aedobj.phone
+				}
+				obj.baseLat = aedobj.latitude
+				obj.baseLng = aedobj.longitude
+				obj.marker[index*1 + 1].iconPath = '/static/icon/aed-a.png'
+				console.log(obj.showAed.name,'obj.showAed')
+				// obj.isShow = true
+				obj.$refs.popupinfo.open()
+			},
 			// 打开aed详情
-			lookmore(e) {
-				console.log(e)
+			lookmore(e,from) {
+				console.log(e.id,'lookmore++++++++++++')
 				let obj = this
 				if(obj.befoId != 0) {
 					obj.marker[obj.befoId].iconPath = '/static/icon/aed-na.png'
@@ -215,14 +237,15 @@
 					phone: aedobj.phone
 				}
 				obj.marker[e.detail.markerId].iconPath = '/static/icon/aed-a.png'
-				obj.isShow = true
+				// obj.isShow = true
+				obj.$refs.popupinfo.open()
 			},
 			// 获取本地坐标
 			getLocal() {
 				let obj = this;
 				console.log('ddddddddddddddddddddddddd')
 				let weichatBrowser = uni.getStorageSync('weichatBrowser')
-				if (weichatBrowser) {
+				if(weichatBrowser) {
 					let wxOjb = require('jweixin-module');
 					wxOjb.ready(() => {
 						console.log('加载完毕注册事件');
@@ -230,16 +253,16 @@
 							type: 'gcj02',
 							success(e) {
 								console.log(e)
-								obj.latitude = Math.abs(e.latitude)
-								obj.longitude = Math.abs(e.longitude)
+								obj.baseLat =  obj.latitude = Math.abs(e.latitude)
+								obj.baseLng =  obj.longitude = Math.abs(e.longitude)
 								console.log('本地坐标', obj.latitude, obj.longitude)
 								let item = {
 									id: 0,
 									latitude: obj.latitude,
 									longitude: obj.longitude,
-									iconPath: '/static/icon/gan.png',
-									width: '20',
-									height: '33',
+									iconPath: '/static/img/img19.png',
+									width: '35',
+									height: '35',
 								}
 								obj.marker.push(item)
 								obj.loadData()
@@ -249,22 +272,21 @@
 							}
 						})
 					})
-				} else {
-					console.log('xiaochjengx')
+				}else {
 					uni.getLocation({
 						type: 'gcj02',
 						success(e) {
 							console.log(e)
-							obj.latitude = Math.abs(e.latitude)
-							obj.longitude = Math.abs(e.longitude)
+							obj.baseLat =  obj.latitude = Math.abs(e.latitude)
+							obj.baseLng =  obj.longitude = Math.abs(e.longitude)
 							console.log('本地坐标', obj.latitude, obj.longitude)
 							let item = {
 								id: 0,
 								latitude: obj.latitude,
 								longitude: obj.longitude,
-								iconPath: '/static/icon/gan.png',
-								width: '20',
-								height: '33',
+								iconPath: '/static/img/img19.png',
+								width: '35',
+								height: '35',
 							}
 							obj.marker.push(item)
 							obj.loadData()
@@ -274,12 +296,12 @@
 						}
 					})
 				}
-
-
+				
+				
 			},
 			// 地图渲染完毕事件
 			mapChange(e) {
-				console.log(e,'地图渲染完毕事件');
+				console.log(e);
 			},
 			// 载入数据
 			async loadData() {
@@ -293,33 +315,29 @@
 					longitude: obj.longitude,
 					page: obj.page,
 					limit: obj.limit,
-					// all: 1
 				}).then(({
 					data
-				}) => {
+				}) => {		
 					console.log(data, 'aed++++++++++++++')
 					obj.AEDList = obj.AEDList.concat(data);
-					
-					
 					let arr = data.map(item => ({
 						latitude: item.latitude,
 						longitude: item.longitude,
 						iconPath: '/static/icon/aed-na.png',
-						width: '41',
-						height: '45',
+						width: '35',
+						height: '35',
 						id: obj.mapid++,
 						address: item.address
 					}));
 					obj.marker = obj.marker.concat(arr)
+					console.log(obj.page,'obj.page++++++')
 					if(obj.page == 1) {
-						if(obj.AEDList.length > 0) {
-							obj.lookmore({
-								detail: {
-									markerId: 1
-								}
-							})
-						}
-						
+						console.log('obj.lookmore+++++++++++++')
+						// obj.lookmore({
+						// 	detail: {
+						// 		markerId: 1
+						// 	}
+						// })
 					}
 					obj.page++
 					console.log('加入完成+++++++++++++')
@@ -328,8 +346,53 @@
 					} else {
 						obj.loadingType = 'noMore'
 					}
-
 				})
+			},
+			// 调用高德
+			toGaodeMap() {
+				let latitude = this.showAed.lat;
+				let longitude = this.showAed.lon;
+				let address = this.showAed.name;
+				console.log(address)
+				console.log('选择高德', latitude, longitude, address);
+				window.location.href = `https://uri.amap.com/marker?position=${longitude},${latitude}&name=${address}`;
+			},
+			// 调用腾讯
+			totengxunMap() {
+				let latitude = this.showAed.lat;
+				let longitude = this.showAed.lon;
+				let address = this.showAed.name;
+				console.log('选择腾讯', latitude, longitude);
+				window.location.href =
+					`http://apis.map.qq.com/uri/v1/marker?marker=coord:${latitude},${longitude};addr:${address}`;
+			},
+			// 调用百度
+			tobaiDuMap() {
+				let latlon = this.bd_encrypt(this.showAed.lon,this.showAed.lat)
+				let latlon1 = this.bd_encrypt( this.longitude,this.latitude)
+				let latitude = latlon.bd_lat;
+				let longitude = latlon.bd_lng;
+				let latitude6 = latlon1.bd_lat;
+				let longitude6 = latlon1.bd_lng;
+				let address = this.showAed.name;
+				console.log('选择百度', latitude, longitude);
+				console.log('获取当前经纬度', latitude6, longitude6);
+				window.location.href =
+					`http://api.map.baidu.com/direction?origin=latlng:${latitude6},${longitude6}|name:我的位置&destination=${latitude},${longitude}&mode=driving&region=${address}&output=html&src=webapp.baidu.openAPIdemo`;
+			},
+			// 高德坐标、腾讯坐标转百度坐标
+			bd_encrypt(gg_lng, gg_lat) {
+				var X_PI = Math.PI * 3000.0 / 180.0;
+				var x = gg_lng,
+					y = gg_lat;
+				var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * X_PI);
+				var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * X_PI);
+				var bd_lng = z * Math.cos(theta) + 0.0065;
+				var bd_lat = z * Math.sin(theta) + 0.006;
+				return {
+					bd_lat: bd_lat,
+					bd_lng: bd_lng
+				};
 			}
 		}
 	}
@@ -350,8 +413,16 @@
 	}
 
 	.map {
-		width: 100%;
-		height: 100%;
+		// width: 100%;
+		// height: 100%;
+		height: 780rpx;
+		border-radius: 20rpx;
+		.map-map {
+			width: 689rpx;
+			height: 780rpx;
+			border-radius: 20rpx;
+			margin: auto;
+		}
 	}
 
 	/* #ifdef H5 */
@@ -367,7 +438,14 @@
 
 		//搜索框
 		.Search-box {
+			// z-index: 999;
 			height: 80rpx;
+			// position: fixed;
+			// 		top: 0;
+			// 		left: 0;
+			// 		width: 100%;
+			// background: #FFFFFF;
+			// padding-top: 10rpx;
 			padding-right: 24rpx;
 			padding-left: 24rpx;
 
@@ -605,8 +683,8 @@
 	}
 
 	.aedxq-wrap {
-
-
+	
+	
 		position: fixed;
 		bottom: 0;
 		left: 0;
@@ -619,41 +697,41 @@
 		background-color: rgba($color: #000000, $alpha: 0.9);
 		color: #fff;
 		// position: relative;
-
+	
 		.xq-top {
 			padding-top: 25rpx;
 			width: 660rpx;
 			min-height: 210rpx;
 			border-bottom: 1px solid #fff;
-
+	
 			.aed-name {
 				font-size: 28rpx;
 				width: 479rpx;
 			}
-
+	
 			.aed-dis {
 				padding-top: 10rpx;
 				font-size: 22rpx;
 				width: 479rpx;
 			}
 		}
-
+	
 		.xq-img-wrap {
 			height: 165rpx;
 			width: 660rpx;
 			display: flex;
 			align-items: center;
 			justify-content: space-between;
-
+	
 			.aed-img-scroll {
 				height: 107rpx;
-				width: 508rpx;
+				width: 620rpx;
 				// background-color: #bfa;
 				// display: flex;
 				// // justify-content: ;
 				// // flex-direction: column;
 				// flex-wrap: nowrap;
-
+	
 				.aed-img {
 					// display: inline-block;
 					height: 107rpx;
@@ -661,10 +739,10 @@
 					margin-right: 15rpx;
 					// background-color: red;
 					flex-shrink: 0;
-
+	
 				}
 			}
-
+	
 			.aed-phone {
 				width: 112rpx;
 				height: 52rpx;
@@ -673,10 +751,10 @@
 				border: 1px solid #fff;
 				border-radius: 10rpx;
 			}
-
+	
 			// background-color: red;
 		}
-
+	
 		.aed-dh {
 			width: 147rpx;
 			height: 82rpx;
@@ -699,10 +777,10 @@
 	.popup-box {
 		width: 522rpx;
 		height: 800rpx;
-		// border-radius: 20rpx;
+		border-radius: 20rpx;
 		position: relative;
 		overflow: hidden;
-		// background-color: #fff;
+		background-color: #fff;
 
 		.popup-item {
 			width: 100%;
@@ -729,4 +807,44 @@
 		right: 0;
 		margin: 0 auto;
 	}
+	.aed-list {
+		
+		
+		.aed-item {
+			width: 690rpx;
+			margin: auto;
+			justify-content: space-between;
+			align-items: center;
+			height: 100rpx;
+			border-bottom: 1px solid #F1F1F1;
+			.item-left {
+				width: 550rpx;
+				font-size: 28rpx;
+				font-weight: 500;
+				color: #333333;
+				.aed-address {
+					padding-top: 10rpx;
+					font-size: 20rpx;
+					font-weight: 500;
+					color: #999999;
+				}
+			}
+			.item-right {
+				width: 100rpx;
+				
+				flex-shrink: 0;
+				flex-direction: column;
+				justify-content: center;
+				align-items: center;
+				font-size: 20rpx;
+				font-weight: 500;
+				color: #999999;
+				image {
+					width: 28rpx;
+					height: 32rpx;
+					margin-bottom: 10rpx;
+				}
+			}
+		}
+	}
 </style>

pages/applic/contribution.vue

@@ -59,10 +59,10 @@
 		<!-- <view class="infoOptional">
 			信息(选填)
 		</view> -->
-		<view class="box">
+		<view class="box" v-if="public">
 			<view class="box-item">
 				<view class="box-left">
-					<view v-if="is_show">
+					<view v-if="!is_show">
 						<text class="imp">*</text>姓名
 					</view>
 					<view v-else>
@@ -404,24 +404,27 @@
 				if (!obj.money) {
 					this.$api.msg('请输入捐款金额！');
 					return;
+				}
+				if(obj.public) {
+					if (this.is_show) {
+						if (!obj.donate_er) {
+							this.$api.msg('请填写您的姓名');
+							return;
+						}
+					} else {
+						if (!obj.donate_er) {
+							this.$api.msg('请填写您的单位');
+							return;
+						}
+					}
+					
+					const reg = /^(\+?0?86-?)?1[\d]\d{9}$/;
+					if (!reg.test(obj.mobile)) {
+						obj.$api.msg('请填写正确的手机号码');
+						return;
+					}
 				}
-				if (this.is_show) {
-					if (!obj.donate_er) {
-						this.$api.msg('请填写您的姓名');
-						return;
-					}
-				} else {
-					if (!obj.donate_er) {
-						this.$api.msg('请填写您的单位');
-						return;
-					}
-				}
-
-				const reg = /^(\+?0?86-?)?1[\d]\d{9}$/;
-				if (!reg.test(obj.mobile)) {
-					obj.$api.msg('请填写正确的手机号码');
-					return;
-				}
+				
 				if (this.is_receipts == '0') {
 					// obj.address = '用户未填写联系地址'
 					if (!obj.address) {

pages/applic/toknowledge.vue

@@ -44,7 +44,7 @@
 					<view class="name">怎样成为造血干细胞志愿捐献者？？</view>
 				</view>
 				<view class="list-tpl">
-					您可与咸宁市红十字会联系，或在余姚市爱心献血屋（阳明西路桐江桥街心公园内）报名。到指定地点抽取6-8毫升血液，经HLA分型检验，把相关资料录入到中华骨髓库的数据库中，这样您就成为造血干细胞志愿捐献者了。
+					您可与咸宁市红十字会联系报名。到指定地点抽取6-8毫升血液，经HLA分型检验，把相关资料录入到中华骨髓库的数据库中，这样您就成为造血干细胞志愿捐献者了。
 				</view>
 			</view>
 			<view class="list-item">

pages/form/donaSuccess.vue

@@ -104,7 +104,7 @@ export default {
 		// // 插入文字
 		context.setFontSize(28);
 		context.setFillStyle('#d5493b');
-		context.fillText('感谢信', ((750 - obj.size) * obj.ratio) / 2, 260 * obj.ratio)
+		context.fillText('捐赠证书', ((750 - obj.size) * obj.ratio) / 2, 260 * obj.ratio)
 		context.setFontSize(30 * obj.ratio);
 		context.fillText('尊敬的' + this.name + ':', 60 * obj.ratio, 350 * obj.ratio);
 		context.fillText('衷心感谢您对咸宁市红十字事业的信任与支', 120 * obj.ratio, 410 * obj.ratio);
@@ -120,9 +120,9 @@ export default {
 		context.fillText('诺绝不辜负大家的信任，遵照您的意愿，将捐款', 60 * obj.ratio, 520 * obj.ratio);
 		context.fillText('全部用于相关救助项目。您的善举将给受助人带', 60 * obj.ratio, 575 * obj.ratio);
 		context.fillText('去温暖！', 60 * obj.ratio, 630 * obj.ratio);
-		context.fillText('爱心无界，情义无价。谨以此信表达谢意，', 120 * obj.ratio, 680 * obj.ratio);
+		context.fillText('爱心无界，情义无价。授以此证书，我们因', 120 * obj.ratio, 680 * obj.ratio);
 
-		context.fillText('我们因您更有力量，因您倍感温暖！', 60 * obj.ratio, 735 * obj.ratio);
+		context.fillText('您更有力量，因您倍感温暖！', 60 * obj.ratio, 735 * obj.ratio);
 		// context.fillText('谨表谢意', (580 * obj.ratio), 680 * obj.ratio)
 		// context.setTextAlign('right')
 		context.fillText('咸宁市红十字会', 450 * obj.ratio, 850 * obj.ratio);
@@ -169,7 +169,7 @@ export default {
 	onLoad(option) {
 		console.log(333, option);
 		this.money = option.money;
-		this.name = decodeURI(option.name)
+		this.name = decodeURI(option.name) || '佚名'
 		this.add_time =decodeURI(option.time)
 		this.IndexShare();
 		this.ScanAudio(true);