lunhan/water/water-drinking-uniapp.git

			@@ -1,5 +1,6 @@
			<script setup>
			import { onMounted, ref } from "vue";
			import { BASE_URL } from '../../config/baseUrl';
			import { getVipInfoApi,getUserInfo,reportLossApi,removeCardApi,buyWaterApi } from '../../api/index.js'
			import { onShow,getCurrentPages } from '@dcloudio/uni-app'
			//状态栏高度
			@@ -18,13 +19,16 @@
			userName:'微信用户',
			headImg:'',
			userPhone:'',
			integral:'',

			waterCardNumber:'',
			balance:'',
			count:'',
			state:'',//state:true：挂失，false：正常
			cardType:'',//卡类型01卡消费 02计次消费 03游客消费 04电子卡
			userCardType:'',//userCardType：true：共享卡，false：正常卡
			})
			// const showHeadImg = ref(BASE_URL + '/upload' + cardInfo.value.headImg)
			const isLoss = ref(false)
			const isVip = ref(false)
			const isShareCard = ref(false)
			@@ -32,6 +36,7 @@
			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
			//用户信息处理存储
			@@ -56,6 +61,8 @@
			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
			await getVipInfo()
			@@ -73,23 +80,9 @@
			scanType: ['qrCode'],
			success: async function (res) {
			console.log('条码内容：' + res.result);
			let data = {
			cardType:cardInfo.value.cardType,
			card:cardInfo.value.waterCardNumber,
			sn:res.result
			}
			await buyWaterApi(data).then((res) =>{
			if(res.code == 200){
			uni.navigateTo({
			url:'/pages/scanWater/index'
			uni.navigateTo({
			url:`/pages/scanWater/index?facilityCode=${res.result}`
			})
			}else{
			uni.showToast({
			title:'扫码失败！',
			icon:'none'
			})
			}
			})
			}
			});
			}
			@@ -104,7 +97,7 @@
			{text:'故障上报',icon:'../../static/images/index/icon35.png',bgColor:'#a88ff1',url:'/pages/infoBreakdown/index',isUrl:1},
			{text:'优惠卷',icon:'../../static/images/index/icon36.png',bgColor:'#18bfc4',url:'',isUrl:4},
			{text:'会员卡挂失',icon:'../../static/images/index/icon37.png',bgColor:'#4875f0',url:'',isUrl:2},
			{text:'会员卡注销',icon:'../../static/images/index/icon38.png',bgColor:'#f45088',url:'',isUrl:3},
			{text:'会员卡解绑',icon:'../../static/images/index/icon38.png',bgColor:'#f45088',url:'',isUrl:3},
			])
			function navTo(itemUrl){
			if(itemUrl){
			@@ -211,13 +204,81 @@
			function upGrade(){
			uni.showToast({
			title: '该功能正在升级中！',
			duration: 2000,
			duration: 1000,
			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()
			@@ -233,8 +294,6 @@
			console.error('分享菜单显示失败', err);
			}
			});


			</script>

			<template>
			@@ -242,14 +301,14 @@
			<view class="content">
			<view class="card-box" :style="{paddingTop:topHeight + 'rpx'}">
			<view class="user-info" >
			<image v-if="cardInfo.headImg" class="user-img" :src='cardInfo.headImg' alt=''></image>
			<image v-if="cardInfo.headImg" class="user-img" :src= "BASE_URL + '/upload' + cardInfo.headImg" alt=''></image>
			<image v-else class="user-img" src='../../static/images/index/head.png' alt=''></image>
			<text @click="navTo('/pages/userInfo/index')">{{cardInfo.userName}}</text>
			<image @click="navTo('/pages/userInfo/index')" class="user-more"src="../../static/images/index/back.png"></image>
			<view class="user-add-card" @click="navTo('/pages/addCard/index')">
			<!-- <view class="user-add-card" @click="navTo('/pages/addCard/index')">
			<image src='../../static/images/index/vip-add.png' alt=''></image>
			<text>添加会员卡</text>
			</view>
			</view> -->
			</view>
			<view class="card">
			<image class="card-bg" src="../../static/images/index/card11.png" alt=""></image>
			@@ -259,22 +318,21 @@
			<view class="left-top">
			<view>
			<image v-if="isVip" src="../../static/images/index/code1.png" alt=""></image>
			<text>会员卡 </text>
			<text v-if="isVip">会员卡 </text>
			<text v-if="!isVip">未绑定 </text>
			<text class="lossed" v-if="isLoss && isVip"> [已挂失]</text>
			</view>
			<view v-if="isVip">ID:{{cardInfo.waterCardNumber}}</view>
			</view>
			<!-- <view v-if="cardInfo.userPhone" class="left-bottom">电话：{{cardInfo.userPhone}}</view> -->
			</view>
			<view class="card-right">
			<view class="card-right-top">
			<!-- <view @click="navTo('/pages/addCard/index')">
			<text v-if="isVip">金额卡</text>
			<text v-if="isVip">{{cardInfo.balance}}元</text>
			<view v-if="!isVip" class="user-add-card" @click="navTo('/pages/addCard/index')">
			<image src='../../static/images/index/vip-add.png' alt=''></image>
			<text>添加会员卡</text>
			</view> -->
			<text v-if="isVip">金额卡</text>
			<text v-if="!isVip">未绑定会员卡</text>
			<text v-if="isVip">{{cardInfo.balance}}元</text>
			</view>
			</view>
			<view v-if="isVip" class="card-right-bottom" @click="navTo('/pages/recharge/index')">充值</view>
			</view>
			@@ -282,21 +340,13 @@
			</view>
			</view>
			<view class="function-box1">
			<view class="box1-bg box1-one" @click="upGrade()">
			<view class="box1-bg box1-one" @click="upGrade">
			<image src="../../static/images/index/home21.png" alt=""></image>
			<view>送水到家</view>
			</view>
			<view @click="navTo('/pages/facilityList/index')" class="box1-bg box1-two">
			<image src="../../static/images/index/icon22.png" alt=""></image>
			<view>附近设备</view>
			<!-- <view>账户余额（元)</view>
			<view class="recharge">
			<text>￥</text>
			<text>120.00</text>
			</view>
			<view @click="navTo('/pages/recharge/index')">
			充值
			</view> -->
			</view>
			<view class="box1-bg box1-three" @click="toScan()">
			<image src="../../static/images/index/icon23.png" alt=""></image>
			@@ -314,7 +364,21 @@
			</block>
			</view>
			</view>
			<view class="advertisement-box" @click="upGrade"><image src="../../static/images/index/bg4.png" alt=""></image></view>
			<!-- 积分商城 -->
			<view class="advertisement-box" @click="navTo('/pages/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>
			<view class="service-content">
			@@ -330,6 +394,7 @@
			</view>
			</view>
			<view class="service-bg" @click="upGrade">
			<!-- <view class="service-bg" @click="navTo('/pages/counterRecharge/index')"> -->
			<view>
			<image src="../../static/images/index/notice5.png" alt=""></image>
			<text>公示公告</text>
			@@ -363,14 +428,11 @@
			.user-info{
			width:100%;
			height:100rpx;
			// background: #06BF5E;
			display: flex;
			align-items: center;
			padding-left:15rpx;
			box-sizing: border-box;
			margin-bottom: 14rpx;
			display:flex;
			position:relative;
			.user-img{
			width:90rpx;
			height:90rpx;
			@@ -384,23 +446,6 @@
			.user-more{
			width: 12rpx;
			height: 28rpx;
			}
			.user-add-card{
			display:flex;
			align-items:center;
			height:40rpx;
			font-size:22rpx;
			background:linear-gradient(to right,#B1D9FD,#65A7FD);
			border-radius:50rpx;
			padding: 0 8rpx;
			position: absolute;
			bottom:0;
			right:0;
			image{
			width:28rpx;
			height:28rpx;
			margin-right:10rpx;
			}
			}
			}
			.card{
			@@ -480,6 +525,24 @@
			justify-content: space-between;
			flex-direction: column;
			font-size:34rpx;
			.user-add-card{
			display:flex;
			align-items:center;
			height:52rpx;
			font-size:28rpx;
			background:linear-gradient(to right,#B1D9FD 0%,#65A7FD 70%,#65A7FD 100%);
			border-radius:50rpx;
			padding: 0 20rpx;
			image{
			width:36rpx;
			height:36rpx;
			margin-right:6rpx;
			opacity:0.8;
			}
			text{
			color:#FFF;
			}
			}
			text:last-child{
			font-weight:500;
			}
			@@ -652,13 +715,86 @@
			}
			.advertisement-box{
			width:100%;
			height: 188rpx;
			height: 160rpx;
			padding:0 32rpx 10rpx;
			box-sizing: border-box;
			image{
			width:100%;
			height: 178rpx;
			display: flex;
			justify-content: space-around;
			.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%;