|
|
@@ -1,29 +1,32 @@
|
|
|
<template>
|
|
|
<view class="center">
|
|
|
- <view class="bg"><image class="imgBox" src="../../static/img/test_bg.png" mode="scaleToFill"></image></view>
|
|
|
+ <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 Xianning Branch</view>
|
|
|
+ <view class="english-font">Red Cross Society of China XianNing 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>咸宁市新堤街道<br />宏伟南路38号</text></view>
|
|
|
+ <view class="text"><text>湖北省咸宁市咸安区温泉街道办事处温泉马柏大道306号</text></view>
|
|
|
</view>
|
|
|
<view class="item flex">
|
|
|
<image class="home_img" src="../../static/img/test_phone.png" mode="aspectFill"></image>
|
|
|
<!-- #ifdef H5 -->
|
|
|
- <view class="text"><text class="text1">0716-2203655</text></view>
|
|
|
+ <view class="text"><text class="text1">0715-8111755 / 0715-8111765</text></view>
|
|
|
<!-- #endif -->
|
|
|
<!-- #ifndef H5 -->
|
|
|
- <view class="text" @click="uni.makePhoneCall({phoneNumber: '0716-2203655'})"><text>0716-2203655</text></view>
|
|
|
+ <view class="text" @click="uni.makePhoneCall({phoneNumber: '0716-5156511'})"><text>0715-8111755 /
|
|
|
+ 0715-8111765</text></view>
|
|
|
<!-- #endif -->
|
|
|
</view>
|
|
|
<view class="item flex">
|
|
|
<image class="home_img" src="../../static/img/test_mail.png" mode="aspectFill"></image>
|
|
|
- <view class="text"><text>hhshszh20210909@126.com</text></view>
|
|
|
+ <view class="text"><text>403092239@qq.com 270457931@qq.com</text></view>
|
|
|
</view>
|
|
|
<view class="map">
|
|
|
<!-- <image class="map-box" src="../../static/icon/erweima.jpg"></image> -->
|
|
|
@@ -31,12 +34,11 @@
|
|
|
:longitude="longitude" ref="map" :show-location="false"></map>
|
|
|
<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 @click="navigation()" class="font-right">
|
|
|
+ <image src="../../static/img/btn.png" mode="aspectFill"></image>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <!-- <view class="qrcode">
|
|
|
- <image src="../../static/images/qrcode.jpg" mode="aspectFill"></image>
|
|
|
- </view> -->
|
|
|
</view>
|
|
|
<uni-popup ref="popup2" type="bottom" @click="close">
|
|
|
<view class="popup_row">
|
|
|
@@ -51,95 +53,103 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import uniPopup from '@/components/uni-popup/uni-popup.vue'
|
|
|
-import {
|
|
|
+ import uniPopup from '@/components/uni-popup/uni-popup.vue'
|
|
|
+ import {
|
|
|
weixindata,
|
|
|
weixinlocation
|
|
|
} from '@/utils/wxAuthorized.js';
|
|
|
-export default {
|
|
|
- components: {
|
|
|
- uniPopup
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- scale: '12',
|
|
|
- longitude: '113.465', //神农架林区经度,
|
|
|
- latitude: '29.811251', //神农架林区纬度
|
|
|
- longitudeNew: '', //当前经度
|
|
|
- latitudeNew: '', //当前纬度
|
|
|
- addr: '咸宁市红十字会',
|
|
|
- markers: [{
|
|
|
- id: '226',
|
|
|
- title: '咸宁市红十字会',
|
|
|
- iconPath: '/static/img/img10.png',
|
|
|
- width: '28',
|
|
|
- height: '28',
|
|
|
- longitude: '113.465', //神农架林区经度,
|
|
|
- latitude: '29.811251', //神农架林区纬度
|
|
|
- }]
|
|
|
- };
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- let obj = this;
|
|
|
- this.IndexShare();
|
|
|
- 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.popup2.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}`
|
|
|
+ import {
|
|
|
+ mapState,
|
|
|
+ mapMutations
|
|
|
+ } from 'vuex';
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ uniPopup
|
|
|
},
|
|
|
- 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}`;
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ scale: '12',
|
|
|
+ longitude: '114.35567', //神农架林区经度,,
|
|
|
+ latitude: '29.816018', //神农架林区纬度
|
|
|
+ // longitudeNew: '', //当前经度
|
|
|
+ // latitudeNew: '', //当前纬度
|
|
|
+ addr: '咸宁市红十字会',
|
|
|
+ markers: [{
|
|
|
+ id: '226',
|
|
|
+ title: '咸宁市红十字会',
|
|
|
+ iconPath: '/static/img/img10.png',
|
|
|
+ width: '28',
|
|
|
+ height: '28',
|
|
|
+ longitude: '114.35567', //神农架林区经度,,
|
|
|
+ latitude: '29.816018', //神农架林区纬度
|
|
|
+ }]
|
|
|
+ };
|
|
|
},
|
|
|
- toBaiduMap() {
|
|
|
-
|
|
|
- window.location.href=
|
|
|
- `http://api.map.baidu.com/marker?location=30.357764,112.218665&title=咸宁市红十字会&content=咸宁市红十字会&output=html&src=webapp.baidu.openAPIdemo `
|
|
|
+ computed: {
|
|
|
+ ...mapState(['baseURL'])
|
|
|
},
|
|
|
- //分享
|
|
|
- IndexShare() {
|
|
|
+ onLoad() {
|
|
|
let obj = this;
|
|
|
- let item = {
|
|
|
- link: 'http://slj.igxys.com/index/#/pages/share/card',// 分享链接
|
|
|
- imgUrl: '/index/static/img/002.png',
|
|
|
- desc: '电子名片分享',
|
|
|
- title: '咸宁市红十字会',
|
|
|
- };
|
|
|
- console.log('分享加',item)
|
|
|
- weixindata(item);
|
|
|
+ this.IndexShare();
|
|
|
+ // 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.popup2.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 `
|
|
|
+ },
|
|
|
+ //分享
|
|
|
+ IndexShare() {
|
|
|
+ let obj = this;
|
|
|
+ let item = {
|
|
|
+ link: obj.baseURL + '/index/#/pages/share/card', // 分享链接
|
|
|
+ imgUrl: obj.baseURL + '/index/static/img/002.png',
|
|
|
+ desc: '电子名片分享',
|
|
|
+ title: '咸宁市红十字会',
|
|
|
+ };
|
|
|
+ console.log('分享加', item)
|
|
|
+ weixindata(item);
|
|
|
+ },
|
|
|
+ }
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
@@ -148,17 +158,20 @@ export default {
|
|
|
min-height: 100%;
|
|
|
// 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%;
|
|
|
@@ -166,13 +179,16 @@ export default {
|
|
|
left: 0;
|
|
|
top: 0;
|
|
|
padding: 20rpx;
|
|
|
+
|
|
|
.imgBox {
|
|
|
width: 100%;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.top {
|
|
|
flex-direction: column;
|
|
|
width: 100%;
|
|
|
+
|
|
|
image {
|
|
|
width: 312rpx;
|
|
|
height: 312rpx;
|
|
|
@@ -180,7 +196,7 @@ export default {
|
|
|
border-radius: 50%;
|
|
|
margin-top: 85rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.china-font {
|
|
|
z-index: 0;
|
|
|
width: 100%;
|
|
|
@@ -194,6 +210,7 @@ export default {
|
|
|
margin-top: 19rpx;
|
|
|
text-align: center;
|
|
|
}
|
|
|
+
|
|
|
.english-font {
|
|
|
margin-top: 14rpx;
|
|
|
z-index: 0;
|
|
|
@@ -204,6 +221,7 @@ export default {
|
|
|
color: #e01a1c;
|
|
|
text-align: center;
|
|
|
}
|
|
|
+
|
|
|
.fgx {
|
|
|
margin-top: 25rpx;
|
|
|
margin-bottom: 25rpx;
|
|
|
@@ -212,8 +230,10 @@ export default {
|
|
|
border-bottom: 1rpx dashed #e01a1c;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.buttom {
|
|
|
flex-direction: column;
|
|
|
+
|
|
|
.item {
|
|
|
z-index: 0;
|
|
|
margin: 0 auto;
|
|
|
@@ -222,13 +242,13 @@ export default {
|
|
|
border: 1rpx solid #e01a1c;
|
|
|
border-radius: 38rpx;
|
|
|
justify-content: flex-start;
|
|
|
-
|
|
|
+
|
|
|
.home_img {
|
|
|
height: 58rpx;
|
|
|
width: 58rpx;
|
|
|
margin: 8rpx 13rpx;
|
|
|
}
|
|
|
-
|
|
|
+
|
|
|
.text {
|
|
|
width: 405rpx;
|
|
|
// display: inline-block;
|
|
|
@@ -243,6 +263,7 @@ export default {
|
|
|
// }
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.map {
|
|
|
margin-top: 25rpx;
|
|
|
margin-bottom: 25rpx;
|
|
|
@@ -251,15 +272,18 @@ export default {
|
|
|
width: 517rpx;
|
|
|
border: 2rpx solid #ea3638;
|
|
|
line-height: 0;
|
|
|
+
|
|
|
.map-box {
|
|
|
width: 513rpx;
|
|
|
height: 513rpx;
|
|
|
background: #ffffff;
|
|
|
}
|
|
|
+
|
|
|
.map-font {
|
|
|
height: 90rpx;
|
|
|
padding: 0 20rpx;
|
|
|
justify-content: space-between;
|
|
|
+
|
|
|
.font-left {
|
|
|
font-family: PingFang SC;
|
|
|
font-weight: bold;
|
|
|
@@ -267,10 +291,12 @@ export default {
|
|
|
color: #333333;
|
|
|
line-height: 1;
|
|
|
}
|
|
|
+
|
|
|
.font-right {
|
|
|
border-radius: 10rpx;
|
|
|
overflow: hidden;
|
|
|
background-color: #1593ff;
|
|
|
+
|
|
|
image {
|
|
|
width: 120rpx;
|
|
|
height: 45rpx;
|
|
|
@@ -278,14 +304,17 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.qrcode {
|
|
|
width: 517rpx;
|
|
|
+
|
|
|
image {
|
|
|
width: 517rpx;
|
|
|
margin: 20rpx 0 36rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.popup_row {
|
|
|
width: 100%;
|
|
|
height: 500rpx;
|
|
|
@@ -294,11 +323,11 @@ export default {
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
-
|
|
|
+
|
|
|
.rows {
|
|
|
width: 100%;
|
|
|
padding: 0 24rpx;
|
|
|
-
|
|
|
+
|
|
|
.rows-item {
|
|
|
height: 80rpx;
|
|
|
line-height: 80rpx;
|
