Browse Source

2021-3-24

hwq 4 years ago
commit
c881e1598f

+ 4 - 0
.gitignore

@@ -0,0 +1,4 @@
+.DS_Store
+/dist
+unpackage
+.hbuilderx

+ 18 - 0
App.vue

@@ -0,0 +1,18 @@
+<script>
+/**
+ * vuex管理登陆状态,具体可以参考官方登陆模板示例
+ */
+export default {
+	data() {},
+	methods: {},
+	computed: {},
+	onLaunch: function() {},
+	onShow: function() {},
+};
+</script>
+
+<style lang="scss">
+*{
+	box-sizing: border-box;
+}
+</style>

+ 265 - 0
components/uni-popup/uni-popup.vue

@@ -0,0 +1,265 @@
+<template>
+	<view v-if="showPopup" class="uni-popup" @touchmove.stop.prevent="clear" @click="onTap">
+		<uni-transition :mode-class="['fade']" :styles="maskClass" :duration="duration"  :show="showTrans" @click="onTap" />
+		<uni-transition :mode-class="ani" :styles="transClass" :duration="duration" :show="showTrans" @click="onTap">
+			<view class="uni-popup__wrapper-box" @click.stop="clear">
+				<slot />
+			</view>
+		</uni-transition>
+	</view>
+</template>
+
+<script>
+	import uniTransition from '../uni-transition/uni-transition.vue'
+
+	/**
+	 * PopUp 弹出层
+	 * @description 弹出层组件,为了解决遮罩弹层的问题
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} type = [top|center|bottom] 弹出方式
+	 * 	@value top 顶部弹出
+	 * 	@value center 中间弹出
+	 * 	@value bottom 底部弹出
+	 * @property {Boolean} animation = [ture|false] 是否开启动画
+	 * @property {Boolean} maskClick = [ture|false] 蒙版点击是否关闭弹窗
+	 * @event {Function} change 打开关闭弹窗触发,e={show: false}
+	 */
+
+	export default {
+		name: 'UniPopup',
+		components: {
+			uniTransition
+		},
+		props: {
+			// 开启动画
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			// 弹出层类型,可选值,top: 顶部弹出层;bottom:底部弹出层;center:全屏弹出层
+			type: {
+				type: String,
+				default: 'center'
+			},
+			// maskClick
+			maskClick: {
+				type: Boolean,
+				default: true
+			}
+		},
+		data() {
+			return {
+				duration: 300,
+				ani: [],
+				showPopup: false,
+				showTrans: false,
+				maskClass: {
+					'position': 'fixed',
+					'bottom': 0,
+					'top': 0,
+					'left': 0,
+					'right': 0,
+					'backgroundColor': 'rgba(0, 0, 0, 0.4)'
+				},
+				transClass: {
+					'position': 'fixed',
+					'left': 0,
+					'right': 0,
+				}
+			}
+		},
+		watch: {
+			type: {
+				handler: function(newVal) {
+					switch (this.type) {
+						case 'top':
+							this.ani = ['slide-top']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+							}
+							break
+						case 'bottom':
+							this.ani = ['slide-bottom']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+								'bottom': 0
+							}
+							break
+						case 'center':
+							this.ani = ['zoom-out', 'fade']
+							this.transClass = {
+								'position': 'fixed',
+								/* #ifndef APP-NVUE */
+								'display': 'flex',
+								'flexDirection': 'column',
+								/* #endif */
+								'bottom': 0,
+								'left': 0,
+								'right': 0,
+								'top': 0,
+								'justifyContent': 'center',
+								'alignItems': 'center'
+							}
+
+							break
+					}
+				},
+				immediate: true
+			}
+		},
+		created() {
+			if (this.animation) {
+				this.duration = 300
+			} else {
+				this.duration = 0
+			}
+		},
+		methods: {
+			clear(e) {
+				// TODO nvue 取消冒泡
+				e.stopPropagation()
+			},
+			open() {
+				let obj = this;
+				obj.showPopup = true
+				obj.$nextTick(() => {
+					clearTimeout(obj.timer)
+					obj.timer = setTimeout(() => {
+						obj.showTrans = true
+					}, 50);
+				})
+				obj.$emit('change', {
+					show: true
+				})
+			},
+			close(type) {
+				this.showTrans = false
+				this.$nextTick(() => {
+					clearTimeout(this.timer)
+					this.timer = setTimeout(() => {
+						this.$emit('change', {
+							show: false
+						})
+						this.showPopup = false
+					}, 300)
+				})
+			},
+			onTap() {
+				if (!this.maskClick) return
+				this.close()
+			}
+		}
+	}
+</script>
+<style scoped>
+	.uni-popup {
+		position: fixed;
+		/* #ifdef H5 */
+		top: var(--window-top);
+		/* #endif */
+		/* #ifndef H5 */
+		top: 0;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		z-index: 99;
+		/* #endif */
+	}
+
+	.uni-popup__mask {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		background-color: rgba(0, 0, 0, 0.4);
+		opacity: 0;
+	}
+
+	.mask-ani {
+		transition-property: opacity;
+		transition-duration: 0.2s;
+	}
+
+	.uni-top-mask {
+		opacity: 1;
+	}
+
+	.uni-bottom-mask {
+		opacity: 1;
+	}
+
+	.uni-center-mask {
+		opacity: 1;
+	}
+
+	.uni-popup__wrapper {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: absolute;
+	}
+
+	.top {
+		top: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(-500px);
+	}
+
+	.bottom {
+		bottom: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(500px);
+	}
+
+	.center {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		flex-direction: column;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		top: 0;
+		justify-content: center;
+		align-items: center;
+		transform: scale(1.2);
+		opacity: 0;
+	}
+
+	.uni-popup__wrapper-box {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: relative;
+	}
+
+	.content-ani {
+		/* transition: transform 0.3s;
+ */
+		transition-property: transform, opacity;
+		transition-duration: 0.2s;
+	}
+
+
+	.uni-top-content {
+		transform: translateY(0);
+	}
+
+	.uni-bottom-content {
+		transform: translateY(0);
+	}
+
+	.uni-center-content {
+		transform: scale(1);
+		opacity: 1;
+	}
+</style>

+ 313 - 0
components/uni-popup/uni-popup_moments.vue

@@ -0,0 +1,313 @@
+<template>
+	<view v-if="showPopup" class="uni-popup" @touchmove.stop.prevent="clear">
+		<uni-transition :mode-class="['fade']" :styles="maskClass" :show="showTrans" @click="onTap" />
+		<uni-transition :mode-class="ani" :styles="transClass" :show="showTrans" @click="onTap">
+			<view class="uni-popup__wrapper-box" @click.stop="clear">
+				<view class="uni-popup_mask">
+					<view class="popup_text" @click="onTap">
+					    <image src="/static/img/img31.jpg"></image>
+						<view class="text">{{illustrate}}</view>
+					</view>
+				</view>
+			</view>
+		</uni-transition>
+	</view>
+</template>
+<script>
+	import uniTransition from '../uni-transition/uni-transition.vue'
+	export default {
+		name: 'Popup',
+		components: {
+			uniTransition
+		},
+		props: {
+			// 开启动画
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			// 弹出层类型,可选值,top: 顶部弹出层;bottom:底部弹出层;center:全屏弹出层
+			type: {
+				type: String,
+				default: 'center'
+			},
+			// maskClick
+			maskClick: {
+				type: Boolean,
+				default: true
+			},
+		},
+		data() {
+			return {
+				ani: [],
+				showPopup: false,
+				illustrate:'',
+				showTrans: false,
+				maskClass: {
+					'position': 'fixed',
+					'bottom': 0,
+					'top': 0,
+					'left': 0,
+					'right': 0,
+					'backgroundColor': 'rgba(0, 0, 0, 0.4)'
+				},
+				transClass: {
+					'position': 'fixed',
+					'left': 0,
+					'right': 0,
+				}
+			}
+		},
+		watch: {
+			type: {
+				handler: function(newVal) {
+					switch (this.type) {
+						case 'top':
+							this.ani = ['slide-top']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+							}
+							break
+						case 'bottom':
+							this.ani = ['slide-bottom']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+								'bottom': 0
+							}
+							break
+						case 'center':
+							this.ani = ['zoom-out', 'fade']
+							this.transClass = {
+								'position': 'fixed',
+								/* #ifndef APP-NVUE */
+								'display': 'flex',
+								'flexDirection': 'column',
+								/* #endif */
+								'bottom': 0,
+								'left': 0,
+								'right': 0,
+								'top': 0,
+								'justifyContent': 'center',
+								'alignItems': 'center'
+							}
+
+							break
+					}
+				},
+				immediate: true
+			}
+		},
+		created() {},
+		methods: {
+			
+			clear(e) {
+				// TODO nvue 取消冒泡
+				// console.log("取消冒泡")
+				e.stopPropagation()
+			},
+			open(item) {
+				console.log(item,55)
+				this.illustrate = item;
+				this.showPopup = true
+				this.$nextTick(() => {
+					setTimeout(() => {
+						this.showTrans = true
+					}, 50);
+				})
+				this.$emit('change', {
+					show: true
+				})
+			},
+			close(type) {
+				// console.log("取消冒泡111")
+				this.showTrans = false
+				this.$nextTick(() => {
+					clearTimeout(this.timer)
+					this.timer = setTimeout(() => {
+						this.$emit('change', {
+							show: false
+						})
+						this.showPopup = false
+					}, 300)
+				})
+			},
+			onTap() {
+				if (!this.maskClick) return
+				this.close()
+			}
+		}
+	}
+</script>
+<style lang="scss" scoped>
+	.uni-popup {
+		position: fixed;
+		/* #ifdef H5 */
+		top: var(--window-top);
+		/* #endif */
+		/* #ifndef H5 */
+		top: 0;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		z-index: 99;
+		/* #endif */
+	}
+
+	.uni-popup__mask {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		background-color: $uni-bg-color-mask;
+		opacity: 0;
+	}
+
+	.mask-ani {
+		transition-property: opacity;
+		transition-duration: 0.2s;
+	}
+
+	.uni-top-mask {
+		opacity: 1;
+	}
+
+	.uni-bottom-mask {
+		opacity: 1;
+	}
+
+	.uni-center-mask {
+		opacity: 1;
+	}
+
+	.uni-popup__wrapper {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: absolute;
+	}
+
+	.top {
+		top: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(-500px);
+	}
+
+	.bottom {
+		bottom: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(500px);
+	}
+
+	.center {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		flex-direction: column;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		top: 0;
+		justify-content: center;
+		align-items: center;
+		transform: scale(1.2);
+		opacity: 0;
+	}
+
+	.uni-popup__wrapper-box {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: relative;
+	}
+
+	.content-ani {
+		// transition: transform 0.3s;
+		transition-property: transform, opacity;
+		transition-duration: 0.2s;
+	}
+
+
+	.uni-top-content {
+		transform: translateY(0);
+	}
+
+	.uni-bottom-content {
+		transform: translateY(0);
+	}
+
+	.uni-center-content {
+		transform: scale(1);
+		opacity: 1;
+	}
+	.uni-popup_mask{
+		padding: 55rpx 35rpx;
+		// background: #FFFFFF;
+		width: 100%;
+		// border-radius: 15rpx;
+		.popup_list{
+			font-size: 45rpx;
+			text-align: center;
+			color: #2D2D2D;
+			padding-bottom: 55rpx;
+			// font-weight: 800;
+		}
+		.popup_text{
+			font-size: 45rpx !important;
+			color: #FFFFFF;
+			background: #FFFFFF;
+			padding-bottom: 25rpx;
+			text-align: left;
+			border-radius: 15rpx;
+			width: 600rpx;
+			.text{
+				padding: 0rpx 45rpx;
+				font-size: 28rpx;
+				overflow: auto;
+				color: #333;
+				margin-top: .58rem;
+				line-height: 1.5;
+				height: 500rpx;
+				
+			}
+			image{
+				width: 100%;
+				height: 300rpx;
+				border-radius: 15rpx;
+			}
+			.popup_image{
+				width: 40rpx;
+				height: 40rpx;
+				margin-right: 25rpx;
+				image{
+					width: 100%;
+					height: 100%;
+				}
+			}
+		}
+		.popup_button{
+			margin-top: 35rpx;
+			.button_action{
+				color: #BC253A;
+				border: 2rpx solid #BC253A;
+				width: 250rpx;
+				text-align: center;
+				margin-right: 25rpx;
+				padding: 15rpx 0rpx;
+				border-radius: 15rpx;
+			}
+			.submit{
+				background: #BC253A !important;
+				color: #FFFFFF !important;
+			}
+		}
+	}
+</style>

+ 261 - 0
components/uni-transition/uni-transition.vue

@@ -0,0 +1,261 @@
+<template>
+	<view v-if="isShow" ref="ani" class="uni-transition" :class="[ani.in]" :style="'transform:' +transform+';'+stylesObject"
+	 @click="change">
+		<slot></slot>
+	</view>
+</template>
+
+<script>
+	// #ifdef APP-NVUE
+	const animation = uni.requireNativePlugin('animation');
+	// #endif
+	export default {
+		name: 'uniTransition',
+		props: {
+			show: {
+				type: Boolean,
+				default: false
+			},
+			modeClass: {
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			duration: {
+				type: Number,
+				default: 300
+			},
+			styles: {
+				type: Object,
+				default () {
+					return {}
+				}
+			}
+		},
+		data() {
+			return {
+				isShow: false,
+				transform: '',
+				ani: { in: '',
+					active: ''
+				}
+			};
+		},
+		watch: {
+			show: {
+				handler(newVal) {
+					if (newVal) {
+						this.open()
+					} else {
+						this.close()
+					}
+				},
+				immediate: true
+			}
+		},
+		computed: {
+			stylesObject() {
+				let styles = {
+					...this.styles,
+					'transition-duration': this.duration / 1000 + 's'
+				}
+				let transfrom = ''
+				for (let i in styles) {
+					let line = this.toLine(i)
+					transfrom += line + ':' + styles[i] + ';'
+				}
+				return transfrom
+			}
+		},
+		created() {
+			// this.timer = null
+			// this.nextTick = (time = 50) => new Promise(resolve => {
+			// 	clearTimeout(this.timer)
+			// 	this.timer = setTimeout(resolve, time)
+			// 	return this.timer
+			// });
+		},
+		methods: {
+			change() {
+				this.$emit('click', {
+					detail: this.isShow
+				})
+			},
+			open() {
+				this.isShow = true
+				this.transform = ''
+				this.ani.in = ''
+				for (let i in this.getTranfrom(false)) {
+					if (i === 'opacity') {
+						this.ani.in = 'fade-in'
+					} else {
+						this.transform += `${this.getTranfrom(false)[i]} `
+					}
+				}
+				this.$nextTick(() => {
+					setTimeout(() => {
+						this._animation(true)
+					}, 50)
+				})
+
+			},
+			close(type) {
+				this._animation(false)
+			},
+			_animation(type) {
+				let styles = this.getTranfrom(type)
+				// #ifdef APP-NVUE
+				if(!this.$refs['ani']) return
+				animation.transition(this.$refs['ani'].ref, {
+					styles,
+					duration: this.duration, //ms
+					timingFunction: 'ease',
+					needLayout: false,
+					delay: 0 //ms
+				}, () => {
+					if (!type) {
+						this.isShow = false
+					}
+					this.$emit('change', {
+						detail: this.isShow
+					})
+				})
+				// #endif
+				// #ifndef APP-NVUE
+				this.transform = ''
+				for (let i in styles) {
+					if (i === 'opacity') {
+						this.ani.in = `fade-${type?'out':'in'}`
+					} else {
+						this.transform += `${styles[i]} `
+					}
+				}
+				clearTimeout(this.timer)
+				this.timer = setTimeout(() => {
+					if (!type) {
+						this.isShow = false
+					}
+					this.$emit('change', {
+						detail: this.isShow
+					})
+
+				}, this.duration)
+				// #endif
+
+			},
+			getTranfrom(type) {
+				let styles = {
+					transform: ''
+				}
+				this.modeClass.forEach((mode) => {
+					switch (mode) {
+						case 'fade':
+							styles.opacity = type ? 1 : 0
+							break;
+						case 'slide-top':
+							styles.transform += `translateY(${type?'0':'-100%'}) `
+							break;
+						case 'slide-right':
+							styles.transform += `translateX(${type?'0':'100%'}) `
+							break;
+						case 'slide-bottom':
+							styles.transform += `translateY(${type?'0':'100%'}) `
+							break;
+						case 'slide-left':
+							styles.transform += `translateX(${type?'0':'-100%'}) `
+							break;
+						case 'zoom-in':
+							styles.transform += `scale(${type?1:0.8}) `
+							break;
+						case 'zoom-out':
+							styles.transform += `scale(${type?1:1.2}) `
+							break;
+					}
+				})
+				return styles
+			},
+			_modeClassArr(type) {
+				let mode = this.modeClass
+				if (typeof(mode) !== "string") {
+					let modestr = ''
+					mode.forEach((item) => {
+						modestr += (item + '-' + type + ',')
+					})
+					return modestr.substr(0, modestr.length - 1)
+				} else {
+					return mode + '-' + type
+				}
+			},
+			// getEl(el) {
+			// 	console.log(el || el.ref || null);
+			// 	return el || el.ref || null
+			// },
+			toLine(name) {
+				return name.replace(/([A-Z])/g, "-$1").toLowerCase();
+			}
+		}
+	}
+</script>
+<style>
+	.uni-transition {
+		transition-timing-function: ease;
+		transition-duration: 0.3s;
+		transition-property: transform, opacity;
+	}
+
+	.fade-in {
+		opacity: 0;
+	}
+
+	.fade-active {
+		opacity: 1;
+	}
+
+	.slide-top-in {
+		/* transition-property: transform, opacity; */
+		transform: translateY(-100%);
+	}
+
+	.slide-top-active {
+		transform: translateY(0);
+		/* opacity: 1; */
+	}
+
+	.slide-right-in {
+		transform: translateX(100%);
+	}
+
+	.slide-right-active {
+		transform: translateX(0);
+	}
+
+	.slide-bottom-in {
+		transform: translateY(100%);
+	}
+
+	.slide-bottom-active {
+		transform: translateY(0);
+	}
+
+	.slide-left-in {
+		transform: translateX(-100%);
+	}
+
+	.slide-left-active {
+		transform: translateX(0);
+		opacity: 1;
+	}
+
+	.zoom-in-in {
+		transform: scale(0.8);
+	}
+
+	.zoom-out-active {
+		transform: scale(1);
+	}
+
+	.zoom-out-in {
+		transform: scale(1.2);
+	}
+</style>

+ 8 - 0
main.js

@@ -0,0 +1,8 @@
+import Vue from 'vue'
+import App from './App'
+Vue.config.productionTip = false
+App.mpType = 'app'
+const app = new Vue({
+    ...App
+})
+app.$mount()

+ 121 - 0
manifest.json

@@ -0,0 +1,121 @@
+{
+    "name" : "导航",
+    "appid" : "__UNI__B30FE18",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    "app-plus" : {
+        /* 5+App特有相关 */
+        "usingComponents" : true,
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        "modules" : {},
+        /* 模块配置 */
+        "distribute" : {
+            /* 应用发布信息 */
+            "android" : {
+                /* android打包配置 */
+                "permissions" : [
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>",
+                    "<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>"
+                ]
+            },
+            "ios" : {},
+            /* ios打包配置 */
+            "sdkConfigs" : {
+                "maps" : {}
+            }
+        },
+        "uniStatistics" : {
+            "enable" : false
+        }
+    },
+    /* SDK配置 */
+    "quickapp" : {},
+    /* 快应用特有相关 */
+    "mp-weixin" : {
+        /* 小程序特有相关 */
+        "usingComponents" : true,
+        "appid" : "wx8f5ca89868d2faa3",
+        "setting" : {
+            "urlCheck" : true
+        },
+        "permission" : {
+            "scope.userLocation" : {
+                "desc" : "获取位置信息"
+            }
+        },
+        "uniStatistics" : {
+            "enable" : false
+        }
+    },
+    "h5" : {
+        "title" : "电子名片",
+        "domain" : "",
+        "router" : {
+            "base" : "/shareCard/",
+            "mode" : "hash"
+        },
+        "devServer" : {
+            "port" : 8080, //端口号
+            "disableHostCheck" : true,
+            "proxy" : {
+                "/ws/" : {
+                    "target" : "http://apis.map.qq.com/ws/", //目标接口域名
+                    "changeOrigin" : true, //是否跨域
+                    "secure" : false // 设置支持https协议的代理
+                }
+            },
+            "https" : false
+        },
+        "sdkConfigs" : {
+            "maps" : {
+                "qqmap" : {
+                    "key" : "VYZBZ-P2TRG-RMIQ3-ITAIN-2DKBK-CKFQQ"
+                }
+            }
+        },
+        "uniStatistics" : {
+            "enable" : false
+        }
+    },
+    "uniStatistics" : {
+        "enable" : false
+    },
+    "mp-alipay" : {
+        "uniStatistics" : {
+            "enable" : false
+        }
+    },
+    "mp-baidu" : {
+        "uniStatistics" : {
+            "enable" : false
+        }
+    },
+    "mp-qq" : {
+        "uniStatistics" : {
+            "enable" : false
+        }
+    },
+    "mp-toutiao" : {
+        "uniStatistics" : {
+            "enable" : false
+        }
+    }
+}

+ 551 - 0
package-lock.json

@@ -0,0 +1,551 @@
+{
+  "requires": true,
+  "lockfileVersion": 1,
+  "dependencies": {
+    "aes-decrypter": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npm.taobao.org/aes-decrypter/download/aes-decrypter-1.0.3.tgz",
+      "integrity": "sha1-nAa4pUNaWtCduTP4oBSvzxhMw04=",
+      "requires": {
+        "pkcs7": "^0.2.3"
+      }
+    },
+    "ansi-regex": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
+      "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg=="
+    },
+    "ansi-styles": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+      "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+      "requires": {
+        "color-convert": "^1.9.0"
+      }
+    },
+    "babel-runtime": {
+      "version": "6.26.0",
+      "resolved": "https://registry.npm.taobao.org/babel-runtime/download/babel-runtime-6.26.0.tgz",
+      "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
+      "requires": {
+        "core-js": "^2.4.0",
+        "regenerator-runtime": "^0.11.0"
+      }
+    },
+    "base64-arraybuffer": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-0.2.0.tgz",
+      "integrity": "sha512-7emyCsu1/xiBXgQZrscw/8KPRT44I4Yq9Pe6EGs3aPRTsWuggML1/1DTuZUuIaJPIm1FTDUVXl4x/yW8s0kQDQ=="
+    },
+    "base64-js": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.3.1.tgz",
+      "integrity": "sha512-mLQ4i2QO1ytvGWFWmcngKO//JXAQueZvwEKtjgQFM4jIK0kU+ytMfplL8j+n5mspOfjHwoAg+9yhb7BwAHm36g=="
+    },
+    "buffer": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.6.0.tgz",
+      "integrity": "sha512-/gDYp/UtU0eA1ys8bOs9J6a+E/KWIY+DZ+Q2WESNUA0jFRsJOc0SNUO6xJ5SGA1xueg3NL65W6s+NY5l9cunuw==",
+      "requires": {
+        "base64-js": "^1.0.2",
+        "ieee754": "^1.1.4"
+      }
+    },
+    "buffer-alloc": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/buffer-alloc/-/buffer-alloc-1.2.0.tgz",
+      "integrity": "sha512-CFsHQgjtW1UChdXgbyJGtnm+O/uLQeZdtbDo8mfUgYXCHSM1wgrVxXm6bSyrUuErEb+4sYVGCzASBRot7zyrow==",
+      "requires": {
+        "buffer-alloc-unsafe": "^1.1.0",
+        "buffer-fill": "^1.0.0"
+      }
+    },
+    "buffer-alloc-unsafe": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/buffer-alloc-unsafe/-/buffer-alloc-unsafe-1.1.0.tgz",
+      "integrity": "sha512-TEM2iMIEQdJ2yjPJoSIsldnleVaAk1oW3DBVUykyOLsEsFmEc9kn+SFFPz+gl54KQNxlDnAwCXosOS9Okx2xAg=="
+    },
+    "buffer-fill": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/buffer-fill/-/buffer-fill-1.0.0.tgz",
+      "integrity": "sha1-+PeLdniYiO858gXNY39o5wISKyw="
+    },
+    "buffer-from": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.1.tgz",
+      "integrity": "sha512-MQcXEUbCKtEo7bhqEs6560Hyd4XaovZlO/k9V3hjVUF/zwW7KBVdSK4gIt/bzwS9MbR5qob+F5jusZsb0YQK2A=="
+    },
+    "camelcase": {
+      "version": "5.3.1",
+      "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
+      "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg=="
+    },
+    "cliui": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
+      "integrity": "sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==",
+      "requires": {
+        "string-width": "^3.1.0",
+        "strip-ansi": "^5.2.0",
+        "wrap-ansi": "^5.1.0"
+      }
+    },
+    "color-convert": {
+      "version": "1.9.3",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+      "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+      "requires": {
+        "color-name": "1.1.3"
+      }
+    },
+    "color-name": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
+    },
+    "core-js": {
+      "version": "2.6.11",
+      "resolved": "https://registry.npm.taobao.org/core-js/download/core-js-2.6.11.tgz?cache=0&sync_timestamp=1592843203000&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcore-js%2Fdownload%2Fcore-js-2.6.11.tgz",
+      "integrity": "sha1-OIMUafmSK97Y7iHJ3EaYXgOZMIw="
+    },
+    "css-line-break": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/css-line-break/-/css-line-break-1.1.1.tgz",
+      "integrity": "sha512-1feNVaM4Fyzdj4mKPIQNL2n70MmuYzAXZ1aytlROFX1JsOo070OsugwGjj7nl6jnDJWHDM8zRZswkmeYVWZJQA==",
+      "requires": {
+        "base64-arraybuffer": "^0.2.0"
+      }
+    },
+    "decamelize": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
+      "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
+    },
+    "dijkstrajs": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.1.tgz",
+      "integrity": "sha1-082BIh4+pAdCz83lVtTpnpjdxxs="
+    },
+    "dom-walk": {
+      "version": "0.1.2",
+      "resolved": "https://registry.npm.taobao.org/dom-walk/download/dom-walk-0.1.2.tgz",
+      "integrity": "sha1-DFSL7wSPTR8qlySQAiNgYNqj/YQ="
+    },
+    "emoji-regex": {
+      "version": "7.0.3",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-7.0.3.tgz",
+      "integrity": "sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA=="
+    },
+    "es5-shim": {
+      "version": "4.5.14",
+      "resolved": "https://registry.npm.taobao.org/es5-shim/download/es5-shim-4.5.14.tgz",
+      "integrity": "sha1-kACeEBnQ6jJ0R8tSPer/j+RWl+8="
+    },
+    "find-up": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz",
+      "integrity": "sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==",
+      "requires": {
+        "locate-path": "^3.0.0"
+      }
+    },
+    "get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg=="
+    },
+    "global": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npm.taobao.org/global/download/global-4.3.2.tgz",
+      "integrity": "sha1-52mJJopsdMOJCLEwWxD8DjlOnQ8=",
+      "requires": {
+        "min-document": "^2.19.0",
+        "process": "~0.5.1"
+      }
+    },
+    "html2canvas": {
+      "version": "1.0.0-rc.5",
+      "resolved": "https://registry.npmjs.org/html2canvas/-/html2canvas-1.0.0-rc.5.tgz",
+      "integrity": "sha512-DtNqPxJNXPoTajs+lVQzGS1SULRI4GQaROeU5R41xH8acffHukxRh/NBVcTBsfCkJSkLq91rih5TpbEwUP9yWA==",
+      "requires": {
+        "css-line-break": "1.1.1"
+      }
+    },
+    "ieee754": {
+      "version": "1.1.13",
+      "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.1.13.tgz",
+      "integrity": "sha512-4vf7I2LYV/HaWerSo3XmlMkp5eZ83i+/CDluXi/IGTs/O1sejBNhTtnxzmRZfvOUqj7lZjqHkeTvpgSFDlWZTg=="
+    },
+    "individual": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npm.taobao.org/individual/download/individual-2.0.0.tgz",
+      "integrity": "sha1-gzsJfa0jKU52EXqY+zjg2a1hu5c="
+    },
+    "is-fullwidth-code-point": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+      "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+    },
+    "is-function": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npm.taobao.org/is-function/download/is-function-1.0.2.tgz",
+      "integrity": "sha1-Twl/MKv2762smDOxfKXcA/gUTgg="
+    },
+    "isarray": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
+      "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw=="
+    },
+    "jweixin-module": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/jweixin-module/-/jweixin-module-1.6.0.tgz",
+      "integrity": "sha512-dGk9cf+ipipHmtzYmKZs5B2toX+p4hLyllGLF6xuC8t+B05oYxd8fYoaRz0T30U2n3RUv8a4iwvjhA+OcYz52w=="
+    },
+    "locate-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
+      "integrity": "sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==",
+      "requires": {
+        "p-locate": "^3.0.0",
+        "path-exists": "^3.0.0"
+      }
+    },
+    "m3u8-parser": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npm.taobao.org/m3u8-parser/download/m3u8-parser-2.1.0.tgz",
+      "integrity": "sha1-yBcDKewc1RXQ1Yu4t2LamJbLA2g="
+    },
+    "min-document": {
+      "version": "2.19.0",
+      "resolved": "https://registry.npm.taobao.org/min-document/download/min-document-2.19.0.tgz",
+      "integrity": "sha1-e9KC4/WELtKVu3SM3Z8f+iyCRoU=",
+      "requires": {
+        "dom-walk": "^0.1.0"
+      }
+    },
+    "mux.js": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npm.taobao.org/mux.js/download/mux.js-4.3.2.tgz",
+      "integrity": "sha1-V21TffA33F7DXsExa5SNgV01whA="
+    },
+    "object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npm.taobao.org/object-assign/download/object-assign-4.1.1.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fobject-assign%2Fdownload%2Fobject-assign-4.1.1.tgz",
+      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
+    },
+    "p-limit": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz",
+      "integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
+      "requires": {
+        "p-try": "^2.0.0"
+      }
+    },
+    "p-locate": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-3.0.0.tgz",
+      "integrity": "sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==",
+      "requires": {
+        "p-limit": "^2.0.0"
+      }
+    },
+    "p-try": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+      "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ=="
+    },
+    "parse-headers": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npm.taobao.org/parse-headers/download/parse-headers-2.0.3.tgz",
+      "integrity": "sha1-Xo51Ejg9FAugLwx6qfSbQ5nJJRU="
+    },
+    "path-exists": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
+      "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU="
+    },
+    "pkcs7": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npm.taobao.org/pkcs7/download/pkcs7-0.2.3.tgz",
+      "integrity": "sha1-ItYGZtAQZcXyRDkJjkpIMEUic74="
+    },
+    "pngjs": {
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-3.4.0.tgz",
+      "integrity": "sha512-NCrCHhWmnQklfH4MtJMRjZ2a8c80qXeMlQMv2uVp9ISJMTt562SbGd6n2oq0PaPgKm7Z6pL9E2UlLIhC+SHL3w=="
+    },
+    "process": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npm.taobao.org/process/download/process-0.5.2.tgz",
+      "integrity": "sha1-FjjYqONML0QKkduVq5rrZ3/Bhc8="
+    },
+    "qrcode": {
+      "version": "1.4.4",
+      "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.4.4.tgz",
+      "integrity": "sha512-oLzEC5+NKFou9P0bMj5+v6Z40evexeE29Z9cummZXZ9QXyMr3lphkURzxjXgPJC5azpxcshoDWV1xE46z+/c3Q==",
+      "requires": {
+        "buffer": "^5.4.3",
+        "buffer-alloc": "^1.2.0",
+        "buffer-from": "^1.1.1",
+        "dijkstrajs": "^1.0.1",
+        "isarray": "^2.0.1",
+        "pngjs": "^3.3.0",
+        "yargs": "^13.2.4"
+      }
+    },
+    "regenerator-runtime": {
+      "version": "0.11.1",
+      "resolved": "https://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.11.1.tgz",
+      "integrity": "sha1-vgWtf5v30i4Fb5cmzuUBf78Z4uk="
+    },
+    "require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
+    },
+    "require-main-filename": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
+      "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
+    },
+    "rust-result": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npm.taobao.org/rust-result/download/rust-result-1.0.0.tgz",
+      "integrity": "sha1-NMdbLm3Dn+WHXlveyFteD5FTb3I=",
+      "requires": {
+        "individual": "^2.0.0"
+      }
+    },
+    "safe-json-parse": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npm.taobao.org/safe-json-parse/download/safe-json-parse-4.0.0.tgz",
+      "integrity": "sha1-fA9XjPzNEtM6ccDgVBPi7KFx6qw=",
+      "requires": {
+        "rust-result": "^1.0.0"
+      }
+    },
+    "set-blocking": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
+      "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
+    },
+    "string-width": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
+      "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
+      "requires": {
+        "emoji-regex": "^7.0.1",
+        "is-fullwidth-code-point": "^2.0.0",
+        "strip-ansi": "^5.1.0"
+      }
+    },
+    "strip-ansi": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+      "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+      "requires": {
+        "ansi-regex": "^4.1.0"
+      }
+    },
+    "tsml": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npm.taobao.org/tsml/download/tsml-1.0.1.tgz",
+      "integrity": "sha1-ifghi52eJX9H1/a1bQHFpNLGj8M="
+    },
+    "url-toolkit": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npm.taobao.org/url-toolkit/download/url-toolkit-2.2.0.tgz",
+      "integrity": "sha1-mle4nzFdS33DQOFQvPpUjd9fXOk="
+    },
+    "video.js": {
+      "version": "6.13.0",
+      "resolved": "https://registry.npm.taobao.org/video.js/download/video.js-6.13.0.tgz",
+      "integrity": "sha1-+Uh9RjJzQPpI7NUTcqKYHbts3kw=",
+      "requires": {
+        "babel-runtime": "^6.9.2",
+        "global": "4.3.2",
+        "safe-json-parse": "4.0.0",
+        "tsml": "1.0.1",
+        "videojs-font": "2.1.0",
+        "videojs-ie8": "1.1.2",
+        "videojs-vtt.js": "0.12.6",
+        "xhr": "2.4.0"
+      }
+    },
+    "videojs-contrib-hls": {
+      "version": "5.15.0",
+      "resolved": "https://registry.npm.taobao.org/videojs-contrib-hls/download/videojs-contrib-hls-5.15.0.tgz",
+      "integrity": "sha1-/klXNn5daLfSP3jtMuN6ndiSoKg=",
+      "requires": {
+        "aes-decrypter": "1.0.3",
+        "global": "^4.3.0",
+        "m3u8-parser": "2.1.0",
+        "mux.js": "4.3.2",
+        "url-toolkit": "^2.1.3",
+        "video.js": "^5.19.1 || ^6.2.0",
+        "videojs-contrib-media-sources": "4.7.2",
+        "webwackify": "0.1.6"
+      }
+    },
+    "videojs-contrib-media-sources": {
+      "version": "4.7.2",
+      "resolved": "https://registry.npm.taobao.org/videojs-contrib-media-sources/download/videojs-contrib-media-sources-4.7.2.tgz",
+      "integrity": "sha1-Ct+SkQfVt0zyyKuygkyCF35DhY4=",
+      "requires": {
+        "global": "^4.3.0",
+        "mux.js": "4.3.2",
+        "video.js": "^5.17.0 || ^6.2.0",
+        "webwackify": "0.1.6"
+      }
+    },
+    "videojs-flash": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npm.taobao.org/videojs-flash/download/videojs-flash-2.2.1.tgz",
+      "integrity": "sha1-GiJduxztIArpu/FeAf5KYQhtkPE=",
+      "requires": {
+        "global": "^4.4.0",
+        "video.js": "^6 || ^7",
+        "videojs-swf": "5.4.2"
+      },
+      "dependencies": {
+        "global": {
+          "version": "4.4.0",
+          "resolved": "https://registry.npm.taobao.org/global/download/global-4.4.0.tgz",
+          "integrity": "sha1-PnsQUXkAajI+1xqvyj6cV6XMZAY=",
+          "requires": {
+            "min-document": "^2.19.0",
+            "process": "^0.11.10"
+          }
+        },
+        "process": {
+          "version": "0.11.10",
+          "resolved": "https://registry.npm.taobao.org/process/download/process-0.11.10.tgz",
+          "integrity": "sha1-czIwDoQBYb2j5podHZGn1LwW8YI="
+        }
+      }
+    },
+    "videojs-font": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npm.taobao.org/videojs-font/download/videojs-font-2.1.0.tgz",
+      "integrity": "sha1-olkwpn9snPvyu4jay4xrRR8JM3k="
+    },
+    "videojs-hotkeys": {
+      "version": "0.2.27",
+      "resolved": "https://registry.npm.taobao.org/videojs-hotkeys/download/videojs-hotkeys-0.2.27.tgz?cache=0&sync_timestamp=1596424673437&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvideojs-hotkeys%2Fdownload%2Fvideojs-hotkeys-0.2.27.tgz",
+      "integrity": "sha1-Dfl5Urnf8ObMHPikOf7X6snHPwE="
+    },
+    "videojs-ie8": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npm.taobao.org/videojs-ie8/download/videojs-ie8-1.1.2.tgz",
+      "integrity": "sha1-oj09hgitcZK2nGB3/E64SJmNNdk=",
+      "requires": {
+        "es5-shim": "^4.5.1"
+      }
+    },
+    "videojs-swf": {
+      "version": "5.4.2",
+      "resolved": "https://registry.npm.taobao.org/videojs-swf/download/videojs-swf-5.4.2.tgz",
+      "integrity": "sha1-aWSpv/kDtzLz5GUxSuR4oCoX6Ks="
+    },
+    "videojs-vtt.js": {
+      "version": "0.12.6",
+      "resolved": "https://registry.npm.taobao.org/videojs-vtt.js/download/videojs-vtt.js-0.12.6.tgz",
+      "integrity": "sha1-4HhgC9qJnqpvnDMHE0zQyBGUe44=",
+      "requires": {
+        "global": "^4.3.1"
+      }
+    },
+    "vue-aliplayer": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/vue-aliplayer/-/vue-aliplayer-1.0.0.tgz",
+      "integrity": "sha512-z29s38hlNJDckGSPtuTsYwMdjj70SsvJ5VzbEoBoV2BTrg3ucvodM2CW7BWstrG9WaQqz4F8nVGLSON05RrmJw==",
+      "requires": {
+        "vue-github-badge": "^1.0.0"
+      }
+    },
+    "vue-github-badge": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/vue-github-badge/-/vue-github-badge-1.0.1.tgz",
+      "integrity": "sha1-3/fOBzIOZKIY7fEGsVpDF27AYQY="
+    },
+    "vue-video-player": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npm.taobao.org/vue-video-player/download/vue-video-player-5.0.2.tgz",
+      "integrity": "sha1-NKQiOf8wTvx2mNogpBZQUddmweY=",
+      "requires": {
+        "object-assign": "^4.1.1",
+        "video.js": "^6.6.0",
+        "videojs-contrib-hls": "^5.12.2",
+        "videojs-flash": "^2.1.0",
+        "videojs-hotkeys": "^0.2.20"
+      }
+    },
+    "webwackify": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npm.taobao.org/webwackify/download/webwackify-0.1.6.tgz",
+      "integrity": "sha1-HUKhKsYYI9fjRaveCE6qpipKles="
+    },
+    "which-module": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
+      "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
+    },
+    "wrap-ansi": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-5.1.0.tgz",
+      "integrity": "sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==",
+      "requires": {
+        "ansi-styles": "^3.2.0",
+        "string-width": "^3.0.0",
+        "strip-ansi": "^5.0.0"
+      }
+    },
+    "xhr": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npm.taobao.org/xhr/download/xhr-2.4.0.tgz",
+      "integrity": "sha1-4W5mpF+GmGHu76tBbV7/ci3ECZM=",
+      "requires": {
+        "global": "~4.3.0",
+        "is-function": "^1.0.1",
+        "parse-headers": "^2.0.0",
+        "xtend": "^4.0.0"
+      }
+    },
+    "xtend": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npm.taobao.org/xtend/download/xtend-4.0.2.tgz",
+      "integrity": "sha1-u3J3n1+kZRhrH0OPZ0+jR/2121Q="
+    },
+    "y18n": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
+      "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w=="
+    },
+    "yargs": {
+      "version": "13.3.2",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz",
+      "integrity": "sha512-AX3Zw5iPruN5ie6xGRIDgqkT+ZhnRlZMLMHAs8tg7nRruy2Nb+i5o9bwghAogtM08q1dpr2LVoS8KSTMYpWXUw==",
+      "requires": {
+        "cliui": "^5.0.0",
+        "find-up": "^3.0.0",
+        "get-caller-file": "^2.0.1",
+        "require-directory": "^2.1.1",
+        "require-main-filename": "^2.0.0",
+        "set-blocking": "^2.0.0",
+        "string-width": "^3.0.0",
+        "which-module": "^2.0.0",
+        "y18n": "^4.0.0",
+        "yargs-parser": "^13.1.2"
+      }
+    },
+    "yargs-parser": {
+      "version": "13.1.2",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-13.1.2.tgz",
+      "integrity": "sha512-3lbsNRf/j+A4QuSZfDRA7HRSfWrzO0YjqTJd5kjAq37Zep1CEgaYmrH9Q3GwPiB9cHyd1Y1UwggGhJGoxipbzg==",
+      "requires": {
+        "camelcase": "^5.0.0",
+        "decamelize": "^1.2.0"
+      }
+    }
+  }
+}

+ 53 - 0
pages.json

@@ -0,0 +1,53 @@
+{
+	"pages": [
+	    {
+            "path" : "pages/index/test",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "电子名片",
+                "app-plus":{
+                    "titleNView":false  //去掉app+h5顶部导航
+                }
+            }
+            
+        }
+    ],
+	"globalStyle": {
+		"navigationBarTextStyle": "black",
+		"navigationBarTitleText": "uni-app",
+		"navigationBarBackgroundColor": "#FFFFFF",
+		"backgroundColor": "#f8f8f8"
+	},
+	"tabBar": {
+		"color": "#B4B7BB",
+		"selectedColor": "#6786FB",
+		"iconWidth":"18px",
+		"borderStyle": "black",
+		"backgroundColor": "#ffffff"
+		// "list": [{
+		// 		"pagePath": "pages/index/index",
+		// 		"iconPath": "static/tabBar/tab-home.png",
+		// 		"selectedIconPath": "static/tabBar/tab-home-current.png",
+		// 		"text": "首页"
+		// 	},
+		// 	// {
+		// 	// 	"pagePath": "pages/patient/patient",
+		// 	// 	"iconPath": "static/tabBar/tab-cate.png",
+		// 	// 	"selectedIconPath": "static/tabBar/tab-cate-current.png",
+		// 	// 	"text": "咨询记录"
+		// 	// },
+		// 	// {
+		// 	// 	"pagePath": "pages/index/index",
+		// 	// 	"iconPath": "static/tabBar/tab-study.png",
+		// 	// 	"selectedIconPath": "static/tabBar/tab-study-current.png",
+		// 	// 	"text": "科普学习"
+		// 	// },
+		// 	{
+		// 		"pagePath": "pages/user/user",
+		// 		"iconPath": "static/tabBar/tab-my.png",
+		// 		"selectedIconPath": "static/tabBar/tab-my-current.png",
+		// 		"text": "我的"
+		// 	}
+		// ]
+	}
+}

+ 593 - 0
pages/index/index.vue

@@ -0,0 +1,593 @@
+<template>
+	<view class="container">
+		<view class="swiper">
+			<view class="swiper-box">
+				<swiper circular="true" autoplay="true" @change="swiperChange">
+					<swiper-item v-for="swiper in banner" :key="swiper.id" @click="ToBanner(swiper)"><image :src="swiper.pic"></image></swiper-item>
+				</swiper>
+				<view class="indicator"><view class="dots" v-for="(swiper, index) in banner" :class="[swiperCurrent >= index ? 'on' : '']" :key="index"></view></view>
+			</view> 
+		</view>
+		<view class="item-box flex">
+			<view class="item-tpl" @click="navTo('/pages/donation/index')">
+				<image src="/static/img/img01.png"></image>            
+				<view class="tip-text">走进红十字</view>
+			</view>
+			<view class="item-tpl" @click="navTo('/pages/contribution/index')">
+				<image src="/static/img/img02.png"></image>
+				<view class="tip-text">爱心捐赠</view>
+			</view>
+			<view class="item-tpl" @click="navTo('/pages/train/index')">
+				<image src="/static/img/img03.png"></image>
+				<view class="tip-text">救护培训报名</view>
+			</view>
+			<view class="item-tpl" @click="navTo('/pages/volunteer/index')">
+				<image src="/static/img/img04.png"></image>
+				<view class="tip-text">红十字志愿者</view>
+			</view>
+		</view>
+		<view class="item-box flex">
+			<view class="item-tpl" @click="navTo('/pages/hematopoiesis/index')">
+				<image src="/static/img/img05.png"></image>
+				<view class="tip-text">造血干细胞入库</view>
+			</view>
+			<view class="item-tpl" @click="organ">
+				<image src="/static/img/img06.png"></image>
+				<view class="tip-text">器官捐献登记</view>
+			</view>
+			<view class="item-tpl">
+				<image src=""></image>
+				<view class="tip-text"></view>
+			</view>
+			<view class="item-tpl">
+				<image src=""></image>
+				<view class="tip-text"></view>
+			</view>
+		</view>
+		<view class="list-box">
+			<view class="top-title flex">
+				<view class="">AED导航</view>
+				<!-- <image @click="ToShow" v-if="showbox == true" src="../../static/img/img08.png"></image>
+				<image @click="ToShow" v-if="showbox == false" src="../../static/img/img07.png"></image> -->
+			</view>
+			<view id="container">
+				<map class="map-box" id="map" 
+					show-location 
+					:markers="marker" 
+					:scale='scale' 
+					:latitude="latitude" 
+					:longitude="longitude" ref="map">
+				</map>
+			</view>
+			<view class="">
+				<view class="list-tpl flex" v-for="(item,index) in AEDlist" @click="openAddress(item.log,item.lat,item.address)">
+					<view class="">{{ index + 1 }}</view>
+					<view class="info">
+						<view class="title">AED设备</view>
+						<view class="addr">地址:{{item.add}}</view>
+					</view>
+					<view class="image">
+						<image src="/static/img/img10.png"></image>
+						<view class="tip">导航</view>
+					</view>
+				</view>
+				<!-- <view class="list-tpl flex" @click="openAddress('2')">
+					<view class="">2</view>
+					<view class="info">
+					经度longitude,纬度 latitude
+						<view class="title">AED设备</view>
+						<view class="addr">地址:桐乡市汽车站候车室</view>
+					</view>
+					<view class="image">
+						<image src="/static/img/img10.png"></image>
+						<view class="tip">导航</view>
+					</view>
+				</view> -->
+				<!-- <view class="list-tpl flex" @click="openAddress('3')">
+					<view class="">3</view>
+					<view class="info">
+						<view class="title">AED设备</view>
+						<view class="addr">地址:桐乡市公共服务中心1号楼1楼大厅</view>
+					</view>
+					<view class="image">
+						<image src="/static/img/img10.png"></image>
+						<view class="tip">导航</view>
+					</view>
+				</view> -->
+				<!-- <view class="list-tpl flex" @click="openAddress('4')">
+					<view class="">4</view>
+					<view class="info">
+						<view class="title">AED设备</view>
+						<view class="addr">地址:桐乡市凤凰湖志愿驿站内</view>
+					</view>
+					<view class="image">
+						<image src="/static/img/img10.png"></image>
+						<view class="tip">导航</view>
+					</view>
+				</view> -->
+			</view>
+		</view>
+		<view class="list-box">
+			<view class="top-title flex">
+				<view class="">应急救援队导航</view>
+			</view>
+			<view v-for="item in emergencyList" :key="item.id">
+				<view id="container" >
+					<map class="map-box" id="map" 
+						show-location 
+						:markers="item.volunteer" 
+						:scale='item.scale1' 
+						:latitude="item.lat" 
+						:longitude="item.long" ref="map">
+					</map>
+				</view>
+				<!-- {{item.long}}{{item.lat}}{{item.addr}} -->
+				<view class="">
+					<view class="list-tpl flex" @click="openAddress(item.long,item.lat,item.addr)">
+						<view class="">1</view>
+						<view class="info">
+							<view class="title">{{ item.title}}</view>
+							<view class="addr">地址:{{item.addr}}</view>
+							<view class="">电话:{{ item.phone}}</view>
+						</view>
+						<view class="image">
+							<image src="/static/img/img10.png"></image>
+							<view class="tip">导航</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<!-- <view>
+				<view id="container">
+					<map class="map-box" id="map" 
+						show-location 
+						:markers="volunteer1" 
+						:scale='scale1' 
+						:latitude="latitude1" 
+						:longitude="longitude1" ref="map">
+					</map>
+				</view>
+				<view class="">
+					<view class="list-tpl flex" @click="openAddress()">
+						<view class="">2</view>
+						<view class="info">
+							<view class="title">桐乡市红十字雄鹰应急救援队</view>
+							<view class="addr">地址:浙江省嘉兴市桐乡市崇南路</view>
+							<view class="">电话:周海 13067691111</view>
+						</view>
+						<view class="image">
+							<image src="/static/img/img10.png"></image>
+							<view class="tip">导航</view>
+						</view>
+					</view>
+				</view>
+			</view> -->
+		</view>
+		<uni-popup ref="popup" type="bottom" @click="close">
+			<view class="popup_row">
+				<view class="rows">
+					<view class="rows-item" @click="toGaodeMap(longitude6,latitude6,address6)">
+						高德地图
+					</view>
+					<view class="rows-item" @click="tobaiDuMap(longitude6,latitude6,address6)">
+						百度地图
+					</view>
+					<view class="rows-item" @click="totengxunMap(longitude6,latitude6,address6)">
+						腾讯地图
+					</view>
+			
+				</view>
+			</view>
+		</uni-popup>
+	</view>
+</template>
+<script>
+import { loadIndexs } from '@/api/index.js';
+import { openMap } from '@/utils/rocessor.js';
+import uniPopup from '@/components/uni-popup/uni-popup.vue';
+export default {
+	components: {
+		uniPopup
+	},
+	data() {
+		return {
+			// 经度longitude,纬度 latitude
+			longitude4: '',  // 当前经纬度
+			latitude4: '',
+			longitude6:'',
+			latitude6:'',
+			address6:'',
+			AEDlist:[
+				{ id:0, add:'桐乡市高铁候车室', log: '120.567191', lat:'30.537043',address:'浙江省嘉兴市桐乡市高桥镇高桥大道51号'},
+				{ id:1, add:'桐乡市汽车站候车室',log: '120.575595', lat:'30.611975',address:"浙江省嘉兴市桐乡市世纪大道1号"},
+				{ id:2, add:'桐乡市公共服务中心1号楼1楼大厅',log: '120.581151', lat:'30.635102',address:"浙江省嘉兴市桐乡市康民东路58号"},
+				{ id:3, add:'桐乡市凤凰湖志愿驿站内',log: '120.583390', lat:'30.640531',address:"浙江省嘉兴市桐乡市凤凰湖翰墨竞芳广场"}
+			],
+			swiperCurrent: 0, //轮播图
+			banner:[],//轮播图
+			marker: [
+				{
+				latitude:"30.537043",
+				longitude:'120.567191',
+				iconPath:'/static/img/img014.png',
+				width:'35',
+				height:'35',
+			},
+			{
+				latitude:'30.611975',
+				longitude:"120.575595",
+				iconPath:'/static/img/img014.png',
+				width:'35',
+				height:'35',
+			},
+			{
+				latitude:'30.635102',
+				longitude:"120.581151",
+				iconPath:'/static/img/img014.png',
+				width:'35',
+				height:'35',	
+			},
+			{
+				latitude:'30.640531',
+				longitude:"120.583390",
+				iconPath:'/static/img/img014.png',
+				height:'35',
+			}],
+			volunteer: [{
+				longitude:'120.558686',
+				latitude:"30.633273",
+				iconPath:'/static/img/img014.png',
+				width:'35',
+				height:'35',
+			}],
+			volunteer1: [{
+				longitude:'120.553638',
+				latitude:"30.547011",
+				iconPath:'../../static/img/img014.png',
+				width:'35',
+				height:'35',
+			}],
+			emergencyList:[
+				{
+					id:0,
+					long:"120.558686",
+					lat:"30.633273",
+					scale1:'15',
+					addr:'桐乡市梧桐街道杨家门迎风一期 23幢',
+					phone:'张剑 13819058997',
+					title:'桐乡市红十字应急救援志愿服务队',
+					volunteer: [{
+						longitude:'120.558686',
+						latitude:"30.633273",
+						iconPath:'/static/img/img014.png',
+						width:'35',
+						height:'35',
+					}],
+				},
+				{
+					id:1,
+					long:"120.553638",
+					lat:"30.547011",
+					scale1:'15',
+					addr:'浙江省嘉兴市桐乡市崇南路',
+					phone:'周海 13067691111',
+					title:'桐乡市红十字雄鹰应急救援队',
+					volunteer: [{
+						longitude:'120.553638',
+						latitude:"30.547011",
+						iconPath:'/static/img/img014.png',
+						width:'35',
+						height:'35',
+					}],
+				}
+			],
+			longitude:'120.558686',
+			latitude:"30.633273",
+			longitude1:'120.553638',
+			latitude1:"30.547011",
+			scale:'12',//地图缩放程度
+			scale1:'15',
+			showbox:false,
+			showTEXT:false
+		};
+	},
+	onLoad() {
+		let obj = this;
+		obj.loadDate();
+		uni.getLocation({
+		    type: 'wgs84',
+		    success: function (res) {
+		        console.log('当前位置的经度:' + res.longitude);
+		        console.log('当前位置的纬度:' + res.latitude);
+				obj.longitude4 = res.longitude
+				obj.latitude4 = res.latitude
+				obj.loadDate();
+		    },
+			fail(e) {
+				console.log('获取当前位置失败', e);
+			}
+		});
+		// let locationAddress
+		// // #ifdef H5
+		// let wxOjb = require('jweixin-module');
+		// locationAddress = wxOjb.getLocation;
+		// // #endif
+		// // #ifdef MP
+		// locationAddress = uni.getLocation;
+		// // #endif
+		// console.log(locationAddress,'获取对象数据')
+		// // #ifdef H5
+		// wxOjb.ready(() => {
+		// 	console.log('加载完毕注册事件');
+		// 	locationAddress({
+		// 		type: 'wgs84',
+		// 		success: function(res) {
+		// 			console.log('获取经纬度', res);
+		// 			obj.longitude4 = res.longitude
+		// 			obj.latitude4 = res.latitude
+		// 			obj.loadDate();
+		// 		},
+		// 		fail(e) {
+		// 			console.log('失败', e);
+		// 		}
+		// 	});
+		// })
+		// // #endif
+		// // #ifdef MP
+		// locationAddress({
+		// 	type: 'wgs84',
+		// 	success: function(res) {
+		// 		console.log('获取经纬度', res);
+		// 		obj.longitude4 = res.longitude
+		// 		obj.latitude4 = res.latitude
+		// 		obj.loadDate();
+		// 	},
+		// 	fail(e) {
+		// 		console.log('失败', e);
+		// 	}
+		// });
+		// // #endif
+	},
+	methods: {
+		//获取轮播图数据
+		loadDate(){
+			let obj = this;
+			loadIndexs({}).then(function(e) {
+				obj.banner = e.data.banner
+			});
+		},
+		navTo(url) {
+			uni.navigateTo({
+				url
+			});
+		},
+		//轮播图跳转
+		ToBanner(e){
+			console.log(e.url)
+			uni.navigateTo({
+				url: e.url
+			});
+		},
+		//AED导航
+		ToShow(){
+			this.showbox = !this.showbox;
+		},
+		//应急救援队导航
+		ToShowTEXT(){
+			this.showTEXT = !this.showTEXT;
+		},
+		// 调用高德
+		toGaodeMap(longitude6,latitude6,address6) {
+			console.log('longitude6,latitude6,address6',longitude6,latitude6,address6)
+			let latitude = latitude6
+			let longitude = longitude6
+			let address = address6
+			console.log('选择高德', latitude, longitude, address)
+			window.location.href = `https://uri.amap.com/marker?position=${longitude},${latitude}&name=${address}`
+		},
+		// 调用腾讯
+		totengxunMap(longitude6,latitude6,address6) {
+			let latitude = latitude6
+			let longitude = longitude6
+			let address = address6
+			console.log('选择腾讯', latitude, longitude,address)
+			window.location.href = `http://apis.map.qq.com/uri/v1/marker?marker=coord:${latitude},${longitude};addr:${address}`;
+		},
+		// 调用百度
+		tobaiDuMap(longitude6,latitude6,address6) {
+			let latitude = this.latitude4
+			let longitude = this.longitude4
+			let latitude2 = latitude6
+			let longitude2 = longitude6
+			let address = address6
+			console.log('选择百度', latitude2, longitude2,address)
+			console.log('获取当前经纬度', latitude, longitude)
+			window.location.href =
+				`http://api.map.baidu.com/direction?origin=latlng:${latitude},${longitude}|name:我的位置&destination=${latitude2},${longitude2}&mode=driving&region=${ address }&output=html&src=webapp.baidu.openAPIdemo`
+		},
+		
+		openAddress(log,lat,address){
+			this.longitude6 = log,
+			this.latitude6 = lat,
+			this.address6 = address
+			console.log('log',log)
+			console.log('lat',lat)
+			console.log('address6',this.address6)
+			this.$refs.popup.open();
+		// 	if(type == '1'){
+		// 		window.location.href =  'http://apis.map.qq.com/uri/v1/marker?marker=coord:30.537043,120.567191;addr:浙江省嘉兴市桐乡市高桥镇高桥大道51号'
+		// 	}
+		// 	if(type == '2'){
+		// 		window.location.href =  'http://apis.map.qq.com/uri/v1/marker?marker=coord:30.611975,120.575595;addr:浙江省嘉兴市桐乡市世纪大道1号 '
+		// 	}
+		// 	if(type == '3'){
+		// 		window.location.href =  'http://apis.map.qq.com/uri/v1/marker?marker=coord:30.635102,120.581151;addr:浙江省嘉兴市桐乡市康民东路58号'
+		// 	}
+		// 	if(type == '4'){
+		// 		window.location.href =  'http://apis.map.qq.com/uri/v1/marker?marker=coord:30.640531,120.583390;addr:浙江省嘉兴市桐乡市凤凰湖翰墨竞芳广场'
+		// 	}
+		// 	if(type == 'volunteer'){
+		// 		window.location.href =  'http://apis.map.qq.com/uri/v1/marker?marker=coord:30.633273,120.558686;addr:浙江省嘉兴市桐乡市梧桐街道杨家门迎风一期 23幢'
+		// 	}
+		// 	if(type == 'volunteer1'){
+		// 		window.location.href =  'http://apis.map.qq.com/uri/v1/marker?marker=coord:30.547011,120.553638;addr:浙江省嘉兴市桐乡市崇南路'
+		// 	}
+		},
+		//轮播图
+		swiperChange(e) {
+			const index = e.detail.current;
+			this.swiperCurrent = index;
+		},
+		//造血干细胞入库
+		organ(){
+			 window.location.href = "https://register.codac.org.cn/wx/notice.aspx"
+		}
+	}
+};
+</script>
+
+<style lang="scss">
+page {
+	background:linear-gradient(180deg,rgba(255,255,255,1) 0%,rgba(242,242,242,1) 100%);
+}
+.top_header{
+	color: #FFFFFF;
+	width: 100%;
+	text-align: center;
+	padding: 15rpx 0rpx;
+	padding: 25rpx !important;
+}
+//轮播图
+.swiper {
+	width: 100%;
+	display: flex;
+	justify-content: center;
+	.swiper-box {
+		width: 100%;
+		height: 360rpx;
+		overflow: hidden;
+		position: relative;
+		z-index: 1;
+		swiper {
+			width: 100%;
+			height: 100%;
+			swiper-item {
+				image {
+					width: 100%;
+					height: 100%;
+				}
+			}
+		}
+		.indicator {
+			position: absolute;
+			bottom: 20upx;
+			left: 20upx;
+			background-color: rgba(255, 255, 255, 0.4);
+			width: 150upx;
+			height: 5upx;
+			border-radius: 3upx;
+			overflow: hidden;
+			display: flex;
+			.dots {
+				width: 0upx;
+				background-color: rgba(255, 255, 255, 1);
+				transition: all 0.3s ease-out;
+				&.on {
+					width: (100%/3);
+				}
+			}
+		}
+	}
+}
+.item-box{
+	width: 100%;
+	font-size: 24rpx;
+	padding: 25rpx 25rpx 0rpx 25rpx;
+	color: #222222;
+	.item-tpl{
+		text-align: center;
+		padding-bottom: 35rpx;
+		font-size: 21rpx;
+		color: #222222;
+		width: 25%;
+		image{
+			width: 68rpx;
+			height: 64rpx;
+		}
+		.tip-text{
+			
+		}
+	}
+}
+.list-box{
+	padding: 25rpx 25rpx;
+	.top-title{
+		color: #222222;
+		font-size: 34rpx;
+		margin-bottom: 25rpx;
+		image{
+			width: 36rpx;
+			height: 36rpx;
+		}
+	}
+}
+.map-box{
+	width: 100%;
+	height: 366rpx;
+	border: 2prx solid #F2F2F2;
+	box-shadow: 5px 15px 15px 5px #F2F2F2;
+}
+.list-tpl{
+	background-color: #FFFFFF;
+	margin: 25rpx 0rpx;
+	padding: 25rpx 25rpx;
+	font-size: 28rpx;
+	border-radius: 15rpx;
+	.info{
+		width:75%;
+		.title{
+			font-size: 32rpx;
+			color: #222222;
+			font-weight:500;
+		}
+		.addr{
+			padding: 10rpx 0rpx;
+		}
+	}
+	.image{
+		width: 10%;
+		text-align: center;
+		image{
+			width: 50rpx;
+			height: 50rpx;
+		}
+		.tip{
+			color: #7F7F7F;
+			font-size: 21rpx;
+		}
+	}
+}
+	.popup_row {
+		width: 100%;
+		height: 500rpx;
+		background-color: #ffffff;
+		border-radius: 20rpx 20rpx 0 0;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+
+		.rows {
+			width: 100%;
+			padding: 0 24rpx;
+
+			.rows-item {
+				height: 80rpx;
+				line-height: 80rpx;
+				text-align: center;
+				width: 100%;
+				font-size: 32rpx;
+				color: #303133;
+			}
+		}
+	}
+</style>

+ 264 - 0
pages/index/test.vue

@@ -0,0 +1,264 @@
+<template>
+	<view class="center">
+		<view class="bg"><image  class="imgBox" src="../../static/img/test_bg.png" mode="scaleToFill"></image></view>
+		<view class="top flex">
+			<image src="../../static/img/top_bg.png" mode="aspectFill"></image>
+			<view class="china-font">荆州市红十字会</view>
+			<view class="english-font">RED CROSS SOCIETY OF CHINA JINGZHOU BRANCH</view>
+			<view class="fgx"></view>
+		</view>
+		<view class="buttom flex">
+			<view class="item flex">
+				<image class="home_img" src="../../static/img/test_home.png" mode="aspectFill"></image>
+				<view class="text"><text>湖北省荆州市荆州区荆州东路18号</text></view>
+			</view>
+			<view class="item flex">
+				<image class="home_img" src="../../static/img/test_phone.png" mode="aspectFill"></image>
+				<view class="text"><text>0716-4163898</text></view>
+			</view>
+			<view class="item flex">
+				<image class="home_img" src="../../static/img/test_mail.png" mode="aspectFill"></image>
+				<view class="text"><text>jz_hszh@sina.com</text></view>
+			</view>
+			<view class="map">
+				<image class="map-box" src="../../static/img/map.jpg"></image>
+				<view class="map-font flex">
+					<view class="font-left">荆州市红十字会</view>
+					<view @click="navigation()" class="font-right"><image src="../../static/img/btn.png" mode="aspectFill"></image></view>
+				</view>
+			</view>
+		</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>
+		</uni-popup>
+	</view>
+</template>
+
+<script>
+import uniPopup from '@/components/uni-popup/uni-popup.vue'
+export default {
+	components: {
+		uniPopup
+	},
+	data() {
+		return {
+			longitude: '112.212434', //荆州市经度
+			latitude: '30.351271', //荆州市纬度
+			longitudeNew: '', //当前经度
+			latitudeNew: '', //当前纬度
+			addr: '荆州市红十字会'
+		};
+	},
+	onLoad() {
+		let obj = this;
+		uni.getLocation({
+			type: 'wgs84',
+			success: res => {
+				console.log('当前位置的经度:' + res.longitude);
+				console.log('当前位置的纬度:' + res.latitude);
+				obj.longitudeNew = res.longitude;
+				obj.latitudeNew = res.latitude;
+			},
+			fail(e) {
+				console.log('获取位置失败', e);
+			}
+		});
+	},
+	methods: {
+		navigation() {
+			this.$refs.popup.open();
+			// uni.openLocation({
+			// 	latitude:+latitude,
+			// 	longitude:+longitude,
+			// 	address:address,
+			// 	fail(e){
+			// 		console.log(e);
+			// 	}
+			// })
+			
+		},
+		toGaodeMap() {
+			let latitude = this.latitude
+			let longitude = this.longitude
+			let address = this.addr
+			console.log(latitude,longitude,address);
+			window.location.href = `https://uri.amap.com/marker?position=${longitude},${latitude}&name=${address}`
+		},
+		toTengxunMap() {
+			let latitude = this.latitude
+			let longitude = this.longitude
+			let address = this.addr
+			window.location.href = `http://apis.map.qq.com/uri/v1/marker?marker=coord:${latitude},${longitude};addr:${address}`;
+		},
+		toBaiduMap() {
+			
+			window.location.href=
+			`http://api.map.baidu.com/marker?location=30.357764,112.218665&title=荆州市红十字会&content=荆州市红十字会&output=html&src=webapp.baidu.openAPIdemo `
+		},
+	}
+};
+</script>
+
+<style lang="scss">
+.center {
+	border: 20rpx solid #e01a1c;
+	height: 100vh;
+	min-height: 600px;
+}
+.flex {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+}
+page {
+	width: 100%;
+	height: 100%;
+	margin: 0;
+	padding: 0;
+}
+.bg {
+	width: 100%;
+	height: 100%;
+	position: absolute;
+	left: 0;
+	top: 0;
+	padding: 20rpx;
+	.imgBox {
+		width: 100%;
+	}
+}
+.top {
+	flex-direction: column;
+	width: 100%;
+	image {
+		width: 312rpx;
+		height: 312rpx;
+		border-color: linear-gradient(0deg, #e01a1c, #e01a1c);
+		border-radius: 50%;
+		margin-top: 85rpx;
+	}
+
+	.china-font {
+		z-index: 0;
+		width: 100%;
+		font-size: 62rpx;
+		padding-left: 20rpx;
+		letter-spacing: 20rpx;
+		font-family: Swei Fist Leg CJK SC;
+		font-weight: bold;
+		color: #e01a1c;
+		line-height: 1;
+		margin-top: 19rpx;
+		text-align: center;
+	}
+	.english-font {
+		margin-top: 14rpx;
+		z-index: 0;
+		letter-spacing: -1.9rpx;
+		width: 100%;
+		font-size: 20rpx;
+		font-weight: bold;
+		color: #e01a1c;
+		text-align: center;
+	}
+	.fgx {
+		margin-top: 25rpx;
+		z-index: 0;
+		width: 625rpx;
+		border-bottom: 1rpx dashed #e01a1c;
+	}
+}
+.buttom {
+	flex-direction: column;
+	.item {
+		z-index: 0;
+		margin: 0 auto;
+		margin-top: 20rpx;
+		width: 532rpx;
+		border: 1rpx solid #e01a1c;
+		border-radius: 38rpx;
+		justify-content: flex-start;
+
+		.home_img {
+			height: 58rpx;
+			width: 58rpx;
+			margin: 8rpx 13rpx;
+		}
+
+		.text {
+			letter-spacing: 1.2rpx;
+			font-size: 25rpx;
+			font-weight: bold;
+		}
+	}
+	.map {
+		margin-top: 25rpx;
+		background-color: #ffffff;
+		z-index: 0;
+		width: 517rpx;
+		border: 2rpx solid #ea3638;
+		line-height: 0;
+		.map-box {
+			width: 513rpx;
+			height: 286rpx;
+			background: #ffffff;
+		}
+		.map-font {
+			height: 90rpx;
+			padding: 0 20rpx;
+			justify-content: space-between;
+			.font-left {
+				font-family: PingFang SC;
+				font-weight: bold;
+				font-size: 29rpx;
+				color: #333333;
+				line-height: 1;
+			}
+			.font-right {
+				border-radius: 10rpx;
+				overflow: hidden;
+				background-color: #1593ff;
+				image {
+					width: 120rpx;
+					height: 45rpx;
+				}
+			}
+		}
+	}
+}
+.popup_row {
+	width: 100%;
+	height: 500rpx;
+	background-color: #FFFFFF;
+	border-radius: 20rpx 20rpx 0 0;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	
+	.rows {
+		width: 100%;
+		padding: 0 24rpx;
+		
+		.rows-item {
+			height: 80rpx;
+			line-height: 80rpx;
+			text-align: center;
+			width: 100%;
+			font-size: 32rpx;
+			color: #303133;
+		}
+	}
+}
+</style>

BIN
static/img/btn.png


BIN
static/img/map.jpg


BIN
static/img/test_bg.png


BIN
static/img/test_home.png


BIN
static/img/test_mail.png


BIN
static/img/test_phone.png


BIN
static/img/top_bg.png


+ 68 - 0
uni.scss

@@ -0,0 +1,68 @@
+/* 页面左右间距 */
+$page-row-spacing: 30rpx;
+//页面基础颜色
+$page-color-base: #f8f8f8;//页面背景颜色
+$page-color-light: #f8f6fc;
+// 主题颜色
+$base-color: #6786FB;//项目颜色
+$box-shadow-color:#6786FB;//阴影颜色
+$font-color:#6786FB;//字体颜色
+$font-color-spec: #6786FB;//可操作文字颜色
+$background-color:#6786FB;//按钮背景颜色
+// 小图标大小
+$uni-img-size-base:36rpx;
+/* 文字尺寸 */
+$font-sm: 24rpx;
+$font-base: 28rpx;
+$font-lg: 32rpx;
+/*文字颜色*/
+$font-color-dark: #303133;//黑
+$font-color-base: #606266;//基础
+$font-color-light: #909399;//灰色
+$font-color-disabled: #c0c4cc;//禁用
+/* 边框颜色 */
+$border-color-dark: #dcdfe6;//黑
+$border-color-base: #e4e7ed;//基础灰
+$border-color-light: #ebeef5;//亮灰
+// uni自带边框颜色
+$uni-border-color:#ebeef5;
+/*颜色*/
+$color-yellow: #fd5b23;
+$color-gray: #999999;
+$color-green: #5dbc7c;
+$color-red: #dd524d;
+$color-red1: #FC4141;
+/* 图片加载中颜色 */
+$image-bg-color: #eee;
+/* 行为相关颜色 */
+$uni-color-primary: #dd524d;
+$uni-color-success: #4cd964;
+$uni-color-warning: #f0ad4e;
+$uni-color-error: #dd524d;
+// 提交框阴影
+$box-shadow: 0rpx 0rpx 10rpx 10rpx #f3f3f3;
+// 圆角
+$border-radius-sm: 15rpx;
+// 渐变背景颜色
+$bg-green-gradual: linear-gradient(#6786FB, #6786FB);
+/* 功能栏字体大小 */
+%font-title {
+	font-size: $font-lg + 2rpx;
+	color: $font-color-dark;
+	line-height: 1;
+	font-weight: bold;
+}
+// 功能栏字体包裹框
+%font-title-box {
+	flex: 1;
+	display: flex;
+	flex-direction: column;
+}
+/*功能栏左侧小图标*/
+%f-left-icon {
+	height: $font-lg + 2rpx;
+	width: 8rpx;
+	background-image: $bg-green-gradual;
+	margin-right: 10rpx;
+	border-radius: 10rpx;
+}