| | |
| | | userName:'微信用户', |
| | | headImg:'', |
| | | userPhone:'', |
| | | integral:'', |
| | | |
| | | waterCardNumber:'', |
| | | balance:'', |
| | |
| | | async function getVipInfo(){ |
| | | await getVipInfoApi().then((res) =>{ |
| | | if(res.code == 200 && res.data.id){ |
| | | console.log('获取会员卡返回响应-首页',res) |
| | | cardInfo.value.waterCardNumber = res.data.cardNumber |
| | | cardInfo.value.cardType = res.data.cardType |
| | | //用户信息处理存储 |
| | |
| | | if(res.code == 200){ |
| | | cardInfo.value.userName = res.data.userInfo.userName ? res.data.userInfo.userName : cardInfo.value.userName |
| | | cardInfo.value.headImg = res.data.userInfo.headImg |
| | | cardInfo.value.integral = res.data.userInfo.integral |
| | | // showHeadImg.value = BASE_URL + '/upload' + cardInfo.value.headImg |
| | | cardInfo.value.userPhone = res.data.userInfo.userPhone |
| | | cardInfo.value.id = res.data.userInfo.id |
| | |
| | | icon:'none', |
| | | }); |
| | | } |
| | | //申请获取用户位置权限---------------------------------------------------- |
| | | let userLocation = { |
| | | lat:'', |
| | | lon:'', |
| | | } |
| | | function getUserLocation(){ |
| | | // 请求用户授权,第一次进入首页会有位置授权的提示 |
| | | uni.authorize({ |
| | | scope: 'scope.userLocation', |
| | | success() { |
| | | console.log("成功授权位置信息1") |
| | | storageLocation() |
| | | }, |
| | | fail() { |
| | | console.log("用户拒绝授权位置信息,再次提示用户授权") |
| | | showToast() |
| | | } |
| | | }) |
| | | //获取用户位置并存储 |
| | | function storageLocation(){ |
| | | uni.getLocation({ |
| | | type:'gcj02', |
| | | isHighAccuracy:true, |
| | | success:(res) =>{ |
| | | userLocation.lat = res.latitude |
| | | userLocation.lon = res.longitude |
| | | uni.setStorageSync('userLocation',JSON.stringify(userLocation)) |
| | | }, |
| | | fail:() =>{ |
| | | showToast() |
| | | } |
| | | }) |
| | | } |
| | | //用户拒绝授权 |
| | | function showToast(){ |
| | | uni.showModal({ |
| | | title: "请求授权当前位置", |
| | | content: "请求获取您的位置,加载附近饮水设备信息!", |
| | | confirmText: "前往设置", |
| | | success: (res) => { |
| | | if (res.confirm) { |
| | | uni.openSetting({ |
| | | success:(res1) =>{ //打开设置成功 |
| | | if (res1.authSetting['scope.userLocation']){ |
| | | console.log('用户二次授权成功') |
| | | setTimeout(() =>{ |
| | | storageLocation() |
| | | },1000) |
| | | }else{ |
| | | showToast() |
| | | console.log('用户拒绝授权') |
| | | } |
| | | }, |
| | | }) |
| | | }else{ |
| | | uni.showToast({ |
| | | title: '请先授权!', |
| | | duration: 2000, |
| | | icon:'none' |
| | | }); |
| | | showToast() |
| | | } |
| | | }, |
| | | }); |
| | | } |
| | | } |
| | | onMounted( async() =>{ |
| | | getTopHeight() |
| | | await getInfo() |
| | | await getUserLocation() |
| | | console.log('进入首页了') |
| | | }) |
| | | onShow(async() =>{ |
| | | getTopHeight() |
| | |
| | | console.error('分享菜单显示失败', err); |
| | | } |
| | | }); |
| | | |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | |
| | | </view> |
| | | </view> |
| | | <!-- 积分商城 --> |
| | | <view class="advertisement-box" @click="navTo('/pages/pointsMall/index')"> |
| | | <!-- <view class="advertisement-box" @click="upGrade"> --> |
| | | <image src="../../static/images/index/banner2.png" alt=""></image> |
| | | <image src="../../static/images/index/banner1.png" alt=""></image> |
| | | <view class="advertisement-box" @click="navTo('/pagesPoints/pointsMall/index')"> |
| | | <view class="point-advert"> |
| | | <view class="advert-image"> |
| | | <image class="image-icon3" src="../../static/images/index/advert-icon3.svg"></image> |
| | | <image class="image-icon1" src="../../static/images/index/advert-icon1.svg"></image> |
| | | <image class="image-icon2" src="../../static/images/index/advert-icon2.svg"></image> |
| | | <image class="image-icon4" src="../../static/images/index/advert-icon4.svg"></image> |
| | | </view> |
| | | <view class="advert-title"> |
| | | <view class="advert-title1">积分商城</view> |
| | | <view class="advert-title2"><text>点击进入</text></view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="service-box"> |
| | | <view class="service-title"><text>服务指南</text></view> |
| | |
| | | box-sizing: border-box; |
| | | display: flex; |
| | | justify-content: space-around; |
| | | image{ |
| | | width:320rpx; |
| | | .point-advert{ |
| | | width:640rpx; |
| | | height:136rpx; |
| | | border-radius:10rpx; |
| | | background:linear-gradient(140deg,#5c9dff 0%,#b5dcff 30%,#52aafc 70%,#b5dcff 90%,#5daffc 100%); |
| | | display: flex; |
| | | justify-content: space-around; |
| | | align-items: center; |
| | | box-shadow: 0 0 4rpx 2rpx #4978de; |
| | | .advert-title{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: center; |
| | | color: #fff; |
| | | font-size:46rpx; |
| | | font-weight:800; |
| | | text-shadow:4rpx 2rpx #5EA1FA; |
| | | .advert-title2{ |
| | | margin-top:10rpx; |
| | | font-size:28rpx; |
| | | font-weight:500; |
| | | width:180rpx; |
| | | height:40rpx; |
| | | background: #5c9dff; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | border-radius:30rpx; |
| | | letter-spacing:2rpx; |
| | | } |
| | | } |
| | | .advert-image{ |
| | | width:200rpx; |
| | | height:100%; |
| | | // background: #76bfa1; |
| | | position: relative; |
| | | .image-icon1{ |
| | | position:absolute; |
| | | left: calc(50% - 65rpx); |
| | | top: calc(50% - 65rpx); |
| | | width:130rpx; |
| | | height:130rpx; |
| | | transform: rotate(20deg); |
| | | } |
| | | .image-icon2{ |
| | | position:absolute; |
| | | left:60%; |
| | | top: calc(50% - 30rpx); |
| | | width:90rpx; |
| | | height:90rpx; |
| | | transform: rotate(-10deg); |
| | | } |
| | | .image-icon3{ |
| | | position:absolute; |
| | | left: calc(50% - 100rpx); |
| | | top: 30%; |
| | | width:80rpx; |
| | | height:80rpx; |
| | | transform: rotate(-10deg); |
| | | } |
| | | .image-icon4{ |
| | | position:absolute; |
| | | left:140%; |
| | | top: 60%; |
| | | width:50rpx; |
| | | height:50rpx; |
| | | transform: rotate(5deg); |
| | | } |
| | | } |
| | | } |
| | | // image{ |
| | | // width:320rpx; |
| | | // height:136rpx; |
| | | // border-radius:10rpx; |
| | | // } |
| | | } |
| | | .service-box{ |
| | | width: 100%; |