fix:小程序界面

web

2025-07-02 03bcdfbc9dd10e473686bbe27a8e615f5a22a283

fix:小程序界面

 App.vue

@@ -2,6 +2,11 @@
    export default {
        onLaunch: function() {
            console.log('App Launch')
            if(!uni.getStorageSync('openId') || !uni.getStorageSync('token')){
                uni.redirectTo({
                    url:'/pages/login/index'
                }) 
            }
        },
        onShow: function() {
            console.log('App Show')

 api/index.js

对比新文件
@@ -0,0 +1,16 @@
import { request } from "../utils/request.js";

//登录
export function wxLoginApi(data){
    return request('/user/wxLogin',data,'POST')
}

//微信支付
export function wxPayApi(data){
    return request('/pay/service/wxPay',data,'POST')
}

//水卡充值
export function rechargeApi(data){
    return request('/rechargeRecords/fees',data,'POST')
}

 components/navbar/navbar.vue

@@ -1,7 +1,7 @@
<template>
    <view class="navbar">
        <image src="../../static/images/other/navBack.svg" alt="" @click="navBackTo()"></image>
        <text>{{title}}</text>
        <image class="img" src="../../static/images/navBack.svg" alt="" @click="navBackTo()"></image>
        <text class="title">{{title}}</text>
    </view>
</template>

@@ -14,13 +14,6 @@
            default:''
        }
    })
	
    const pageTitle = ref(props.title)
	
    watch(props.title, (New, Old)=>{
            pageTitle.value = New
        },{immediate: true},
    )
    
    const navBackTo = () => {
        uni.navigateBack()
@@ -37,12 +30,12 @@
       box-sizing: border-box;
       position: relative;
       padding:0 32rpx 24rpx;
       image{
       .img{
           width:40rpx;
           height:40rpx;
           transform: rotate(180deg);
       }
       text{
       .title{
           font-weight: 400;
           font-size: 36rpx;
           color: #000000;

 config/index.js

@@ -1 +1 @@
export const BASE_URL = 'https://www.huiwuyuntong.com/water-drinking-beta'
export const BASE_URL = 'http://192.168.0.67:8041'

 manifest.json

@@ -50,11 +50,20 @@
    /* 快应用特有相关 */
    "mp-weixin" : {
        /* 小程序特有相关 */
        "appid" : "",
        "appid" : "wxd361a7f92bb0c73a",
        "setting" : {
            "urlCheck" : false
        },
        "usingComponents" : true
        "usingComponents" : true,
        "unipush" : {
            "enable" : false
        },
        "lazyCodeLoading" : "requiredComponents",
        "permission" : {
            "scope.userLocation" : {
                "desc" : "你的位置信息将用于计算设备与您的距离"
            }
        }
    },
    "vueVersion" : "3"
}

 pages.json

@@ -2,9 +2,16 @@
    "pages": [
        {"path": "pages/index/index"},
        {"path": "pages/login/index"},
        {"path": "pages/user/index"}
        {"path": "pages/user/index"},
        {"path": "pages/device/index"},
        {"path": "pages/recharge/index"},
        {"path": "pages/record/qushui"},
        {"path": "pages/record/shuiliang"},
        {"path": "pages/record/chongzhi"}
    ],
    "tabBar": {
        "color": "#dddddd",
        "selectedColor": "#6f6f6f",
        "list": [
            {
                "pagePath": "pages/index/index",

 pages/device/index.vue

对比新文件
@@ -0,0 +1,33 @@
<template>
    <view class="device">
        <Navbar title="设备列表"></Navbar>
    </view>
</template>

<script setup>
    import{ ref, onMounted } from 'vue'
    import Navbar from '../../components/navbar/navbar.vue'
	
    const userLocation = ref()
	
	
    // 根据经纬度计算距离,根据经纬度计算距离，参数分别为第一点的纬度，经度（用户）；第二点的纬度，经度(设备)
    const getDistances = (lat1, lon1, lat2, lon2) => {
        let EARTH_RADIUS = 6378.137;// 地球半径
        let radLat1 = lat1 * Math.PI / 180.0; //lat1 * Math.PI / 180.0=>弧度计算
        let radLat2 = lat2 * Math.PI / 180.0;
        let a = radLat1 - radLat2;
        let b = lon1 * Math.PI / 180.0 - lon2 * Math.PI / 180.0;
        let s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
        s = s * EARTH_RADIUS; 
        s = Math.round(s * 10000) / 10000;// 输出为公里
        return { m: s * 1000, km: Number(s.toFixed(2)) }
    }
	
    onMounted(() => {
        userLocation.value = JSON.parse(uni.getStorageSync('userLocation'))
    })
</script>

<style lang="scss" scoped>
</style>

 pages/index/index.vue

@@ -1,7 +1,48 @@
<template>
    <view class="container" :style="{paddingTop:topHeight + 'rpx'}">
        <view class="content">
            111
            <view class="user">
                <view class="userImg">
                    <image src="/static/images/login/wx.png" mode="widthFix"></image>
                </view>
                <view class="info">
                    <text class="name">张三</text>
                </view>
            </view>
            <view class="card">
                <view class="water">
                    <text>水量：</text>
                    <text>750m³</text>
                </view>
                <view class="btn">
                    <button type="primary" @click="handleNav('/pages/recharge/index')">充值</button>
                </view>
            </view>
            <view class="near" @click="handleNav('/pages/device/index')">
                <image src="/static/images/address.png" mode="widthFix"></image>
                <text>附近设备</text>
            </view>
            <view class="domain">
                <view class="t">功能列表</view>
                <view class="c">
                    <view class="item" @click="handleNav('/pages/record/qushui')">
                        <image src="/static/images/qushui.png"></image>
                        <view>取水记录</view>
                    </view>
                    <view class="item" @click="handleNav('/pages/record/shuiliang')">
                        <image src="/static/images/shuiliang.png"></image>
                        <view>水量记录</view>
                    </view>
                    <view class="item" @click="handleNav('/pages/record/chongzhi')">
                        <image src="/static/images/chongzhi.png"></image>
                        <view>充值记录</view>
                    </view>
                    <view class="item" @click="handleNav()">
                        <image src="/static/images/kefu.png"></image>
                        <view>联系客服</view>
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>
@@ -11,23 +52,189 @@
    import { BASE_URL } from '../../config/index.js';
    
    const topHeight = ref(0)
    let userLocation = {
        lat:'',
        lon:'',
    }
    
    // 获取状态栏高度
    function getTopHeight(){
    const getTopHeight = () => {
        if(uni.getMenuButtonBoundingClientRect){
            topHeight.value = uni.getMenuButtonBoundingClientRect().bottom * 2
        }
    }
    
    const handleNav = (url) => {
        if(!url){
            uni.showToast({
                title: '功能待开发...',
                icon: 'none'
            })
            return
        }
        uni.navigateTo({
            url: url
        })
    }
	
    //获取用户位置并存储
    const storageLocation = () => {
        uni.getLocation({
            type:'gcj02',
            isHighAccuracy:true,
            success:(res) =>{
                userLocation.lat = res.latitude
                userLocation.lon = res.longitude
                uni.setStorageSync('userLocation',JSON.stringify(userLocation))
            },
            fail:(err) =>{
                locationToast()
            }
        })
    }
    //用户拒绝授权
    const locationToast = () => {
        uni.showModal({
            title: "请求授权当前位置",
            content: "请求获取您的位置，加载附近饮水设备信息！",
            confirmText: "前往设置",
            success: (res) => {
                if (res.confirm) {
                    uni.openSetting({
                         success:(res1) =>{ //打开设置成功
                            if (res1.authSetting['scope.userLocation']){
                                setTimeout(() =>{
                                    storageLocation()
                                },1000)
                            }
                        },
                    })
                }else{
                    uni.showToast({
                        title: '请先授权！',
                        duration: 2000,
                        icon:'none'
                    });
                }
            },
        });
    }
    const getUserLocation = () => {
        // 请求用户授权，第一次进入首页会有位置授权的提示
        uni.authorize({
          scope: 'scope.userLocation',
          success() {
            storageLocation()
          },
          fail() {
            locationToast()
          }
        })
    }
    onMounted(() => {
        getTopHeight()
        // if(!uni.getStorageSync('openId') || !uni.getStorageSync('token')){
        //     uni.redirectTo({
        //         url:'/pages/login/index'
        //     })
        // }
        getUserLocation()
    })
</script>

<style lang="scss" scoped>
    .container{
        height: 100vh;
        background: linear-gradient( 180deg, #5EA1FA 0%, #D2F2FE 20%, #f5f5f5 30%);
        border-radius: 0px 0px 0px 0px;
        box-sizing: border-box;
    }
    .content{
        padding: 0 32rpx;
        .user{
            height: 100rpx;
            display: flex;
            align-items: center;
            .userImg{
                width: 80rpx;
                height: 80rpx;
                image{
                    width: 100%;
                    border-radius: 50%;
                }
            }
            .info{
                margin-left: 30rpx;
                .name{
                    vertical-align: text-bottom;
                }
            }
        }
        .card{
            width: 100%;
            height: 260rpx;
            background: url('/static/images/card.png') no-repeat;
            background-size: 100% 100%;
            margin-top: 40rpx;
            color: #fff;
            font-size: 60rpx;
            padding: 0 30rpx;
            box-sizing: border-box;
            position: relative;
            .water{
                width: 100%;
                padding: 20rpx 0;
                word-break: break-all;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2;
                overflow: hidden;
            }
            .btn{
                position: absolute;
                right: 30rpx;
                bottom: 50rpx;
                button{
                    width: 200rpx;
                    height: 80rpx;
                    line-height: 80rpx;
                    border-radius: 40rpx;
                    background: linear-gradient(90deg, #65B5FD 0%, #338AFD 100%, #65A7FD 100%);
                }
            }
        }
        .near{
            height: 120rpx;
            line-height: 120rpx;
            margin-top: 40rpx;
            box-shadow: 0px 0px 6px 0px rgba(13,118,255,0.0608);
            border-radius: 10px 10px 10px 10px;
            background-color: #fff;
            text-align: center;
            font-size: 40rpx;
            image{
                width: 83rpx;
                height: 80rpx;
                vertical-align: middle;
                margin-right: 80rpx;
            }
        }
        .domain{
            margin-top: 40rpx;
            .c{
                margin-top: 20rpx;
                height: 180rpx;
                background: #FFFFFF;
                box-shadow: 0 0 12rpx 0 rgba(13,118,255,0.0608);
                border: 2rpx solid #D6ECFF;
                border-radius: 20rpx;
                padding: 20rpx 40rpx;
                display: flex;
                align-items: center;
                justify-content: space-between;
                .item{
                    text-align: center;
                    image{
                        width: 100rpx;
                        height: 100rpx;
                    }
                }
            }
        }
    }
</style>

 pages/login/index.vue

@@ -2,7 +2,7 @@
    <view class="container">
        <view class="content">
            <view class="top">
                <image class="top-bg" :src="BASE_URL + '/upload' + '/qingYuan/images/20241126/2f56a2a7ecfd2544dec5978d2687383e.png'" mode="widthFix"></image>
                <image class="top-bg" src="../../static/images/login/top_bg.png" mode="widthFix"></image>
                <view class="top--title">
                    <image class="logo" src="../../static/images/login/logo.png "></image>
                    <view class="text">慧物通直饮水</view>
@@ -38,11 +38,11 @@
                    </view>
                </view>
            </view>
            <view class="switch-btn" @click="changeLoginType">
<!--             <view class="switch-btn" @click="changeLoginType">
                <text v-if="loginType == 0">切换微信登录</text>
                <text v-if="loginType == 1">切换管理员登录</text>
                <image class="switch-to" src="../../static/images/login/switchto.svg"></image>
            </view>
            </view> -->
        </view>
    </view>
</template>
@@ -50,6 +50,7 @@
<script setup>
    import {ref, onMounted} from 'vue'
    import { BASE_URL } from '../../config/index.js';
    import { wxLoginApi } from '../../api/index.js'
    
    const loginType = ref(1)
    const form = ref({userName:'',password:''})
@@ -69,7 +70,7 @@
            if(res.code == 200){
                uni.setStorageSync('maintainId',JSON.stringify(res.data.id))
                uni.setStorageSync('token',res.data.token)
                uni.redirectTo({
                uni.switchTab({
                    url:'/pages/index/index'
                })
            }
@@ -77,23 +78,22 @@
    }
    
    //用户点击微信登录默认授权
    function wxLogin(){
    const wxLogin = () => {
        wx.login({
            success:async (res1)=>{
            success:(res1)=>{
                //存储微信登录的code,调用后端接口传递code参数，返回openid(也就是userId)存储到本地，通过判断本地是否存在openId，存在表示已登录
                uni.setStorageSync('code',res1.code)
                await wxLoginApi({code:res1.code}).then((res2) =>{
                wxLoginApi({code:res1.code}).then((res2) =>{
                    if(res2.code == 200){
                        uni.redirectTo({
                            url:'/pages/index/index'
                        })
                        uni.setStorageSync('openId',res2.data.userId)
                        uni.setStorageSync('token',res2.data.token)
                        uni.switchTab({
                            url:'/pages/index/index'
                        })
                    }else{
                        uni.showToast({
                            title:'登录失败',
                            icon:'none',
							
                        })
                    }
              })
@@ -110,7 +110,7 @@
    
    onMounted(() => {
        if(uni.getStorageSync('openId') && uni.getStorageSync('token')){
            uni.redirectTo({
            uni.switchTab({
                url:'/pages/index/index'
            })
        }

 pages/recharge/index.vue

对比新文件
@@ -0,0 +1,307 @@
<template>
    <view class="container">
        <Navbar title="账户充值"></Navbar>
        <view class="content">
            <view class="main">
                <view class="money">
                    <view class="money-title">
                        <view class="title-icon"></view>
                        <view class="title-text">充值金额</view>
                    </view>
                    <view class="money-list">
                        <block v-for="(item,index) in moneyList" :key="index">
                            <view class="money-box" :style="item.active ? activeStyle : ''" @click="chooseMoney(index)">￥{{item.value}}</view>
                        </block>
                    </view>
                </view>
                <view class="other-money">
                    <view class="money-title">
                        <view class="title-icon"></view>
                        <view class="title-text">其他金额</view>
                    </view>
                    <view class="money-input">
                        <input :disabled = 'disabled' :focus = '!disabled'  placeholder="请输入其他金额" v-model="otherMoney"/>
                    </view>
                </view>
                <view class="pay-methods">
                    <view class="methods-list">
                        <block v-for="(item,index) in payList" :key="index">
                            <view class="pay-item">
                                <view class="pay-item-right">
                                    <image :src="item.img" alt=""></image>
                                    <view>{{item.text}}</view>
                                </view>
                                <radio :value="item.value" :checked="item.checked"/>
                            </view>
                        </block>
                    </view>
                </view>
            </view>
            <button :style="{opacity:payStatus ? 1 : 0.7}" class="submit-btn" @click="submit()">立即充值</button>
        </view>
    </view>
</template>

<script setup>
    import{ ref, onUnmounted} from 'vue'
    import Navbar from '../../components/navbar/navbar.vue'
    import { wxPayApi,rechargeApi } from '../../api/index.js'
	
    const choosedMoney = ref(50)
    const disabled = ref(true)
    const userInfo = JSON.parse(uni.getStorageSync('userInfo'))
    //选择金额
    const moneyList = ref([
        {value:50,active:true},
        {value:100,active:false},
        {value:200,active:false},
        {value:500,active:false},
        {value:1000,active:false},
        {value:'其他金额',active:false},
    ])
    const activeStyle = ref({
        backgroundColor:'#5EADFF',
        color:'#fff'
    })
    //输入金额
    const otherMoney = ref()
    //支付方式
    const payMethod = ref()
    const payList = ref([
        {text:"微信支付",value:2,checked:true,img:'../../static/images/recharge/wx.png'},
    ])
    let timerId 
    let payStatus = ref(true)
	
    const chooseMoney = (index1) => {
        moneyList.value.forEach((item,index) =>{
            if(item.active == true){
                item.active = false
            }
        })
        moneyList.value[index1].active = true
        if(index1 == 5){
            disabled.value = false
            choosedMoney.value = ''
        }else{
            choosedMoney.value = moneyList.value[index1].value
            otherMoney.value = ''
            disabled.value = true
        }
    }

    const submit = () => {
        if(payStatus.value){
            payStatus.value = false
            timerId = setTimeout(()=>{
                payStatus.value = true
            },20000)
            let money = ''
            if(disabled.value){
                money = choosedMoney.value
            }else{
                money = Number(otherMoney.value)
            }
            let data = {
                    cardNumber:userInfo.waterCardNumber,
                    paymentMethod:1,
                    rechargeAmount:money
                }
            //生成订单
            rechargeApi(data).then(async(res) =>{
                if(res.code == 200){
                    let data = {
                        businessType:1,
                        businessNo:res.data
                        }
                    //发起支付
                    await wxPay(data)
                    otherMoney.value = ''
                }
            })
        }else{
            uni.showToast({
                title:'充值间隔20秒，请稍后!',
                icon:'none'
            })
        }
    }
	
    //微信支付
    const wxPay = (data) => {
        wxPayApi(data).then((res) =>{
            if(res.code == 200){
                //调用微信官方支付接口弹出付款界面,输入密码扣款
                wx.requestPayment({
                  //预支付订单信息
                  // appId: res.data.appId,
                  timeStamp: res.data.timeStamp,     //时间戳 
                  nonceStr: res.data.nonceStr,      //随机串     
                  package: res.data.package,        //prepay_id
                  signType: res.data.signType,        //签名算法MD5		
                  paySign: res.data.paySign ,//微信签名 
                 success (res) {
                   if (res.errMsg == "requestPayment:ok"){
                      console.log('支付成功', res)
                      uni.showToast({
                        title: '支付成功',
                        duration: 2000,
                      });
                      uni.navigateBack()
                   }else{
                      uni.showToast({
                        title: '支付失败',
                        duration: 2000,
                        icon:'none'
                      });
                   }
				   
                 },
                 fail (res) { 
                   uni.showToast({
                        title: '微信支付失败',
                        duration: 2000,
                        icon:'none'
                   });
                 }
                })
            }
        })
    }
    onUnmounted(() =>{
        clearTimeout(timerId)
    })
</script>

<style lang="scss" scoped>
    .container{
        width: 100%;
        height: 100vh;
        .content{
            width: 100%;
            height:calc(100vh - 176rpx);
            background:linear-gradient(to top,#FFFFFF,#E8EFFF);
            overflow-y: scroll;
            .main{
                width: 686rpx;
                height:1262rpx;
                background: #FFFFFF;
                border-top-right-radius: 24rpx;
                border-top-left-radius: 24rpx;
                margin: 20rpx auto 0;
                padding:0 25rpx;
                box-sizing: border-box;
                .money{
                    width: 100%;
                    height:378rpx;
                    padding-top: 58rpx;
                    // background: #65ffb2;
                    box-sizing: border-box;
                    .money-list{
                        margin-top:40rpx;
                        width:100%;
                        height: 240rpx;
                        padding: 0 20rpx;
                        box-sizing: border-box;
                        display: flex;
                        justify-content: space-between;
                        align-items: center;
                        flex-wrap: wrap;
                        .money-box{
                            width:160rpx;
                            height: 100rpx;
                            border:2rpx solid #75C8EB;
                            border-radius: 8rpx;
                            font-weight: 300;
                            font-size: 28rpx;
                            color: #4EB6E3;
                            text-align: center;
                            line-height: 100rpx;
                        }
                    }
                }
                .other-money{
                    width: 100%;
                    height:164rpx;
                    margin-top:58rpx;
                    .money-input{
                        margin:40rpx auto 0;
                        width:calc(100% - 40rpx);
                        height: 80rpx;
                        box-sizing: border-box;
                        border-radius:8rpx;
                        border: 2rpx solid #75C8EB;
                        input{
                            width:94%;
                            height: 80rpx;
                            margin-left:6%;
                        }
                    }
                }
                .pay-methods{
                    width: 100%;
                    margin-top:58rpx;
                    .methods-list{
                        margin-top:40rpx;
                        width: 100%;
                        padding: 0 20rpx;
                        box-sizing: border-box;
                        // background: #49B4E3;
                        height:130rpx;
                        display: flex;
                        flex-direction: column;
                        justify-content: space-between;
                        align-items: flex-start;
                        .pay-item{
                            width:100%;
                            display: flex;
                            justify-content:space-between;
                            align-items: center;
                            .pay-item-right{
                                display: flex;
                                image{
                                    width: 42rpx;
                                    height: 42rpx;
                                    margin-right:34rpx;
                                }
                                view{
                                    font-weight: 300;
                                    font-size: 28rpx;
                                    color: #111111;
                                }
                            }
                        }
                    }
                }
            }
        }
        .submit-btn{
            width: 686rpx;
            height: 98rpx;
            background:#5EA1FA;
            border-radius:50rpx;
            text-align: center;
            line-height: 98rpx;
            letter-spacing:3rpx;
            margin:0 auto;
            font-weight: 300;
            font-size: 36rpx;
            color: #FFFFFF;
        }
    }
    .money-title{
        display: flex;
        align-items: center;
        .title-icon{
            width:8rpx;
            height:36rpx;
            background:#49B4E3;
            margin-right:12rpx;
        }
        .title-text{
            font-weight: 300;
            font-size: 28rpx;
            color: #000000;
        }
    }
</style>

 pages/record/chongzhi.vue

对比新文件
@@ -0,0 +1,12 @@
<template>
    <view class="device">
        <Navbar title="充值记录"></Navbar>
    </view>
</template>

<script setup>
    import Navbar from '../../components/navbar/navbar.vue'
</script>

<style lang="scss" scoped>
</style>

 pages/record/qushui.vue

对比新文件
@@ -0,0 +1,12 @@
<template>
    <view class="device">
        <Navbar title="取水记录"></Navbar>
    </view>
</template>

<script setup>
    import Navbar from '../../components/navbar/navbar.vue'
</script>

<style lang="scss" scoped>
</style>

 pages/record/shuiliang.vue

对比新文件
@@ -0,0 +1,12 @@
<template>
    <view class="device">
        <Navbar title="水量记录"></Navbar>
    </view>
</template>

<script setup>
    import Navbar from '../../components/navbar/navbar.vue'
</script>

<style lang="scss" scoped>
</style>

 pages/user/index.vue

@@ -1,23 +1,22 @@
<template>
    <view class="user" :style="{paddingTop:topHeight + 'rpx'}">
        <view class="content">
            <view class="userInfo">
            <view class="user">
                <view class="userImg">
                    <image src="/static/images/login/wx.png" mode="widthFix"></image>
                </view>
                <view class="info">
                    <view class="name">张三</view>
                    <view class="balance">余额：233.5</view>
                    <text class="name">张三</text>
                </view>
            </view>
            <view class="typeList">
                <view class="typeItem">
                    <view class="name">充值记录</view>
                    <uni-icons type="right" size="20"></uni-icons>
                    <view class="name">剩余水量</view>
                    <view class="val">750m³</view>
                </view>
            </view>
            <view class="loginOut">
                <button type="primary" plain>退出登录</button>
                <button class="btn" type="primary" plain @click="loginOut">退出登录</button>
            </view>
        </view>
    </view>
@@ -29,10 +28,27 @@
    const topHeight = ref(0)
    
    // 获取状态栏高度
    function getTopHeight(){
    const getTopHeight = () => {
        if(uni.getMenuButtonBoundingClientRect){
            topHeight.value = uni.getMenuButtonBoundingClientRect().bottom * 2
        }
    }
	
    // 退出登录
    const loginOut = () => {
        uni.showModal({
            title: '温馨提示',
            content: '确认退出登录？',
            success: (res) => {
                if(res.confirm){
                    uni.removeStorageSync('openId')
                    uni.removeStorageSync('token')
                    uni.navigateTo({
                        url: '/pages/login/index'
                    })
                }
            }
        })
    }
    
    onMounted(() => {
@@ -42,28 +58,23 @@

<style lang="scss" scoped>
    .content{
        padding: 20rpx;
        .userInfo{
        padding: 0 32rpx;
        .user{
            height: 100rpx;
            display: flex;
            align-items: center;
            padding: 40rpx;
            background: linear-gradient(90deg, #CCCCCC, #CCFFFF);
            border-radius: 20rpx;
            .userImg{
                flex-shrink: 0;
                width: 100rpx;
                height: 100rpx;
                margin-right: 40rpx;
                width: 80rpx;
                height: 80rpx;
                image{
                    width: 100%;
                    border-radius: 10rpx;
                    border-radius: 50%;
                }
            }
            .info{
                flex-grow: 1;
                font-size: 36rpx;
                .balance{
                    font-weight: bold;
                margin-left: 30rpx;
                .name{
                    vertical-align: text-bottom;
                }
            }
        }
@@ -78,11 +89,11 @@
            }
        }
        .loginOut{
            margin-top: 400rpx;
            // button{
            //     color: $uni-base-color;
            //     border-color: $uni-base-color;
            // }
            margin-top: 200rpx;
            .btn{
                color: $uni-base-color;
                border-color: $uni-base-color;
            }
        }
    }
</style>

 static/images/address.png

 static/images/card.png

 static/images/chongzhi.png

 static/images/kefu.png

 static/images/login/top_bg.png

 static/images/navBack.svg

对比新文件
@@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1731634152427" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2590" width="20" height="20" xmlns:xlink="http://www.w3.org/1999/xlink"><path d="M252.940598 117.391658c0 13.287924 5.279175 26.025933 14.667709 35.414466l345.795969 345.795969c8.418685 8.418685 8.418685 22.066552 0 30.485237L267.608307 874.893298a50.101172 50.101172 0 0 0-14.667709 35.414466c0 44.623028 53.95157 66.969536 85.496641 35.414467l416.634901-416.634901c8.418685-8.418685 8.418685-22.066552 0-30.485237l-416.634901-416.6349c-31.55507-31.545071-85.496641-9.198563-85.496641 35.424465z" fill="#436DF0" p-id="2591"></path><path d="M0.00012 0h1023.840025M0.00012 63.960006h1023.840025M0.00012 127.930011h1023.840025M0.00012 191.890017h1023.840025M0.00012 255.850023h1023.840025M0.00012 319.820028h1023.840025M0.00012 383.780034h1023.840025M0.00012 447.740041h1023.840025M0.00012 511.710045h1023.840025M0.00012 575.670052h1023.840025M0.00012 639.630058h1023.840025M0.00012 703.600062h1023.840025M0.00012 767.560069h1023.840025M0.00012 831.520075h1023.840025M0.00012 895.480081h1023.840025M0.00012 959.450086h1023.840025M0.00012 1023.410092h1023.840025M62.330381 0l0.879863 1023.840025M126.370375 0l0.879862 1023.840025M190.410369 0l0.879862 1023.840025M254.460361 0l0.879862 1023.840025M318.500355 0l0.879862 1023.840025M382.540348 0l0.879863 1023.840025M446.580342 0l0.879863 1023.840025M510.630334 0l0.879863 1023.840025M574.670328 0l0.879863 1023.840025M638.710322 0l0.879862 1023.840025M702.760314 0l0.869864 1023.840025M766.800308 0l0.879862 1023.840025M830.840302 0l0.879862 1023.840025M894.880295 0l0.879863 1023.840025M958.930287 0l0.879863 1023.840025M1022.970281 0l0.879863 1023.840025" fill="#FFFFFF" opacity=".19" p-id="2592"></path></svg>

 static/images/qushui.png

 static/images/recharge/wx.png

 static/images/shuiliang.png

 utils/request.js

@@ -1,4 +1,4 @@
import { BASE_URL } from "../config/baseUrl";
import { BASE_URL } from "../config/index.js";

export const request = (url, data, method) => {
    return new Promise((resolve, reject) => {