测试修复小程序问题，添加水控机设备

Liuyi

2024-12-20 d470e67ac1997882502b75cbfdaf359626cfaaa8

 pages/index/index.vue

@@ -1,7 +1,7 @@
<script setup>
    import { onMounted, ref } from "vue";
   import { BASE_URL } from '../../config/baseUrl';
   import { getVipInfoApi,getUserInfo,reportLossApi,removeCardApi,buyWaterApi } from '../../api/index.js'
   import { getVipInfoApi,getUserInfo,reportLossApi,removeBindingApi,buyWaterApi } from '../../api/index.js'
   import { onShow,getCurrentPages } from '@dcloudio/uni-app'
   //状态栏高度
   const topHeight = ref(0)
@@ -15,6 +15,7 @@
    * 会员卡相关
    */
   const cardInfo = ref({
      //用户档案信息
      id:'',
      userName:'微信用户',
      headImg:'',
@@ -35,38 +36,41 @@
   //获取会员卡信息
    async function getVipInfo(){
      await getVipInfoApi().then((res) =>{
         console.log('会员卡信息响应',res)
         if(res.code == 200 && res.data.id){
            console.log('获取会员卡返回响应-首页',res)
            //用户信息处理存储
            cardInfo.value.waterCardNumber = res.data.cardNumber
            cardInfo.value.cardType = res.data.cardType
            //用户信息处理存储
            cardInfo.value.state = res.data.state == 2 ? true : false//state:2：挂失，1：正常 是否挂失
            cardInfo.value.state = res.data.state == 2 ? true : false//state：2：挂失，1：正常 
            cardInfo.value.userCardType = res.data.userCardType == 2 ? true : false //userCardType：2：共享卡，1：正常卡
            
            //数据使用
            isLoss.value = cardInfo.value.state 
            isShareCard.value = cardInfo.value.userCardType 
            isShareCard.value = cardInfo.value.userCardType
				
             //判断费用卡还是计次卡
            if(res.data.cardType == 1){
               cardInfo.value.balance = res.data.balance
            }else if(res.data.cardType == 2){
               cardInfo.value.count = res.data.count
            }
            isVip.value = true
            console.log('cardInfo',cardInfo.value,'isShareCard.value',isShareCard.value)
            console.log('会员卡及用户信息',cardInfo.value)
         }
      })
   }
   //获取用户信息
   async function getInfo(){
       await getUserInfo().then(async(res) =>{
          console.log('用户信息响应',res)
         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()
            console.log('00000',cardInfo.value)
            console.log('用户信息',cardInfo.value)
            uni.setStorageSync('userInfo',JSON.stringify(cardInfo.value))
         }
      })
@@ -79,9 +83,10 @@
      uni.scanCode({
         scanType: ['qrCode'],
         success: async function (res) {
            console.log('条码内容：' + res.result);
            let code = res.result.split('=')[1]
            console.log('条码内容：' + res.result,'code',code);
            uni.navigateTo({
                     url:`/pages/scanWater/index?facilityCode=${res.result}`
                     url:`/pages/scanWater/index?facilityCode=${code}`
                  })
         }
      });
@@ -90,14 +95,15 @@
    * 功能列表相关
    */
   const functionList = ref([
      {text:'余额记录',icon:'../../static/images/index/icon31.png',bgColor:'#16b387',url:'/pages/functionList/balanceRecord/index',isUrl:1},
      {text:'消费记录',icon:'../../static/images/index/icon32.png',bgColor:'#329ae8',url:'/pages/functionList/paymentRecord/index',isUrl:1},
      {text:'充值记录',icon:'../../static/images/index/icon33.png',bgColor:'#f0a50e',url:'/pages/functionList/rechargeRecord/index',isUrl:1},
      {text:'水卡共享',icon:'../../static/images/index/icon34.png',bgColor:'#55ca8c',url:'/pages/functionList/share/cardShare/index',isUrl:1},
      {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},
      //isUrl:1:页面跳转，2：弹窗功能，3：弹窗功能，4：未开发
      {text:'余额记录',icon:'../../static/images/index/icon31.png',url:'/pages/functionList/balanceRecord/index',isUrl:1},
      {text:'消费记录',icon:'../../static/images/index/icon32.png',url:'/pages/functionList/paymentRecord/index',isUrl:1},
      {text:'充值记录',icon:'../../static/images/index/icon33.png',url:'/pages/functionList/rechargeRecord/index',isUrl:1},
      {text:'水卡共享',icon:'../../static/images/index/icon34.png',url:'/pages/functionList/share/cardShare/index',isUrl:1},
      {text:'故障上报',icon:'../../static/images/index/icon35.png',url:'/pages/infoBreakdown/index',isUrl:1},
      {text:'优惠卷',icon:'../../static/images/index/icon36.png',url:'',isUrl:4},
      {text:'卡挂失',icon:'../../static/images/index/icon37.png',url:'',isUrl:2},
      {text:'卡解绑',icon:'../../static/images/index/icon38.png',url:'',isUrl:3},
   ])
   function navTo(itemUrl){
      if(itemUrl){
@@ -156,13 +162,14 @@
         }
      }else if(isUrl == 3){
         if(cardInfo.value.waterCardNumber){
            //判断是否是分享卡：分享卡不许注销
            if(!isShareCard.value){
               uni.showModal({
                     title: '会员卡注销',
                     content: '确认注销会员卡？',
                     success: async function(res) {
                     success: async function(res){
                     if (res.confirm) {
                        await removeCardApi(cardInfo.value.waterCardNumber).then(async(res) =>{
                        await removeBindingApi(cardInfo.value.waterCardNumber).then(async(res) =>{
                           if(res.code == 200){
                              uni.showToast({
                                 title: '已注销',
@@ -275,23 +282,26 @@
      }
   }
   onMounted( async() =>{
      console.log('空用户信息',cardInfo.value)
      uni.setStorageSync('userInfo',JSON.stringify(cardInfo.value))
      getTopHeight()
      await getInfo()
      await getUserLocation()
      console.log('进入首页了')
      console.log('onMounted','用户存储本地数据',JSON.parse(uni.getStorageSync('userInfo')))
   })
   onShow(async() =>{
      getTopHeight()
      await getInfo()
      console.log('onShow','用户存储本地数据',JSON.parse(uni.getStorageSync('userInfo')))
   })
   uni.showShareMenu({
     withShareTicket: true,
     menus: ['shareAppMessage', 'shareTimeline'],
     success: function () {
       console.log('分享菜单显示成功');
       // console.log('分享菜单显示成功');
     },
     fail: function (err) {
       console.error('分享菜单显示失败', err);
       // console.error('分享菜单显示失败', err);
     }
   });
</script>
@@ -305,51 +315,55 @@
               <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')">
                  <image src='../../static/images/index/vip-add.png' alt=''></image>
                  <text>添加会员卡</text>
               </view> -->
            </view>
            <view class="card">
               <image class="card-bg" src="../../static/images/index/card11.png" alt=""></image>
               <view v-if="isShareCard" class="share-card">共享卡号：{{cardInfo.waterCardNumber}}</view>
               <view v-if="!isShareCard" class="card-content">
                  <view class="card-left">
                     <view class="left-top">
                        <view>
                           <image v-if="isVip"  src="../../static/images/index/code1.png" alt=""></image>
                           <text v-if="isVip">会员卡&nbsp;</text>
                           <text v-if="!isVip">未绑定&nbsp;</text>
                           <text class="lossed" v-if="isLoss && isVip">&nbsp;[已挂失]</text>
               <view v-if="isVip" class="card-detail">
                  <view class="card-top">
                     <view class="vip">VIP</view>
                     <view class="top-right">
                        <view v-if="isShareCard" class="card-name">
                           <text>共享卡</text>
                           <text v-if="isLoss">[已挂失]</text>
                        </view>
                        <view v-if="isVip">ID:{{cardInfo.waterCardNumber}}</view>
                     </view>
                  </view>
                  <view class="card-right">
                     <view class="card-right-top">
                        <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 v-if="!isShareCard" class="card-name">
                           <text>会员卡</text>
                           <text v-if="isLoss" class="card-loss">[已挂失]</text>
                        </view>
                        <view class="card-num">
                           卡号：{{cardInfo.waterCardNumber}}
                        </view>
                     </view>
                     <view v-if="isVip" class="card-right-bottom" @click="navTo('/pages/recharge/index')">充值</view>
                  </view>
                  <view class="card-bottom">
                     <view class="bottom-left">
                        <text class="bottom-left-text">余额：</text>
                        <text class="bottom-left-money">{{cardInfo.balance}}</text>
                     </view>
                     <view v-if="!isShareCard" @click="navTo('/pages/recharge/index')" class="card-btn">充值</view>
                  </view>
               </view>
               <view v-if="!isVip" class="card-none">
                  <view class="card-none-top"><text>未绑定会员卡</text></view>
                  <view class="card-none-bottom"><view @click="navTo('/pages/addCard/index')" class="card-btn">去绑定</view></view>
               </view>
            </view>
         </view>
         <!-- 功能区 -->
         <view class="function-box1">
            <view class="box1-bg box1-one" @click="navTo('/pages/preSendWater/index')">
               <image src="../../static/images/index/home21.png" alt=""></image>
            <view class="box1-bg box1-one" @click="upGrade">
               <image class="box-one-image1" src="../../static/images/index/home21.svg" 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>
               <image class="box-one-image2" src="../../static/images/index/icon22.svg" alt=""></image>
               <view>附近设备</view>
            </view>
            <view class="box1-bg box1-three" @click="toScan()">
               <image src="../../static/images/index/icon23.png" alt=""></image>
         </view>
         <!-- 扫码取水 -->
         <view class="scan-box">
            <view class="scan" @click="toScan()">
               <image class="scan-img" src="../../static/images/index/scan.png"></image>
               <view>扫码取水</view>
            </view>
         </view>
@@ -358,7 +372,7 @@
            <view class="box2-content">
               <block v-for="(item,index) in functionList" :key="index">
                  <view class="box2-item"  @click="setEvent(item.isUrl,item.url)">
                     <view class="box2-item-img" :style="{background:item.bgColor}"><image :src= "item.icon" alt=""></image></view>
                     <view class="box2-item-img"><image class="box2-image" :src= "item.icon" alt=""></image></view>
                     <view class="box2-item-text">{{item.text}}</view>
                  </view>
               </block>
@@ -366,25 +380,14 @@
         </view>
         <!-- 积分商城 -->
         <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>
            <image class="banner-img" src="../../static/images/index/point-banner.png"></image>
         </view>
         <view class="service-box">
            <view class="service-title"><text>服务指南</text></view>
            <view class="service-content">
               <view class="service-bg" @click="navTo('/pages/station/index')">
                  <view>
                     <image src="../../static/images/index/icon51.png" alt=""></image>
                     <image src="../../static/images/index/icon51.svg" alt=""></image>
                     <text>附近站点</text>
                  </view>
                  <view class="service-info">服务中心正在营业中……</view>
@@ -396,7 +399,7 @@
               <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>
                        <image src="../../static/images/index/notice5.svg" alt=""></image>
                        <text>公示公告</text>
                     </view>
                     <view class="service-info">停水公告的部分摘要的内容展示……</view>
@@ -413,12 +416,13 @@
<style lang="scss" scoped>
   .container{
      width:100%;
      height:100vh;
      overflow:scroll;
      // height:100vh;
      // overflow-y:scroll;
      .content{
         width:100%;
         height:100vh;
         // height:100vh;
         background:#F6F6F6;
         overflow:scroll;
         .card-box{
            width: 100%;
            height: auto;
@@ -450,157 +454,258 @@
            }
            .card{
               width: 100%;
               height: 290rpx;
               height: 256rpx;
               position:relative;
               .card-bg{
                  height:290rpx;
                  height:256rpx;
                  width:100%;
                  top:0;
                  position: absolute;
                  z-index:1;
               }
               .share-card{
                  position:absolute;
                  top:16rpx;
                  left:28rpx;
                  z-index:100;
                  font-weight:400;
                  font-size: 36rpx;
                  color: #FFFFFF;
               }
               .card-content{
               .card-none{
                  width: 100%;
                  height: 100%;
                  height:100%;
                  padding:38rpx;
                  box-sizing: border-box;
                  padding:20rpx 15rpx;
                  display: flex;
                  justify-content:space-between;
                  font-weight: 300;
                  font-size: 30rpx;
                  color: #FFFFFF;
                  z-index:100;
                  .card-left{
                     height:100%;
                     display: flex;
                     justify-content:space-between;
                     flex-direction:column;
                     align-items:flex-start;
                     z-index:100;
                     .left-top{
                        display: flex;
                        flex-direction: column;
                        view:first-child{
                           display: flex;
                           align-items: center;
                           image{
                              width:48rpx;
                              height:48rpx;
                           }
                           text{
                              font-weight:400;
                              font-size: 36rpx;
                              color: #FFFFFF;
                           }
                           .lossed{
                              color:#fff;
                           }
                        }
                        view:last-child{
                           margin-left:10rpx;
                           font-size: 26rpx;
                           font-weight:500;
                        }
                     }
                  flex-direction: column;
                  justify-content:space-around;
                  color:#fff;
                  z-index:2;
                  .card-none-top{
                     font-size:40rpx;
                     font-weight:600;
                     z-index:2;
                     letter-spacing:2rpx;
                  }
                  .card-right{
                  .card-none-bottom{
                     display: flex;
                     justify-content: space-between;
                     align-items:flex-end;
                     flex-direction: column;
                     height:100%;
                     z-index:100;
                     .card-right-top{
                        align-items:flex-end;
                        display: flex;
                        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;
                        }
                     }
                     .card-right-bottom{
                        width:137rpx;
                        height:56rpx;
                        background:linear-gradient(to right,#65A7FD ,#B1D9FD);
                        border-radius:50rpx;
                     justify-content: flex-end;
                     z-index:2;
                     .card-btn{
                        width: 196rpx;
                        height: 80rpx;
                        background: linear-gradient( to right,#338AFD 0%, #65A7FD 100%);
                        border-radius: 40rpx;
                        text-align: center;
                        line-height: 56rpx;
                        color:#212DDE;
                        font-weight: 400;
                        line-height: 80rpx;
                        font-size:44rpx;
                        letter-spacing:3rpx;
                        font-weight:500;
                     }
                  }
               }
               .card-detail{
                  width: 100%;
                  height:100%;
                  padding:38rpx;
                  box-sizing: border-box;
                  display: flex;
                  flex-direction: column;
                  justify-content: center;
                  color:#fff;
                  z-index:2;
                  .card-top{
                     width:100%;
                     display: flex;
                     align-items: center;
                     z-index:2;
                     .vip{
                        font-size:114rpx;
                        font-weight: 600;
                     }
                     .top-right{
                        display: flex;
                        flex-direction: column;
                        justify-content: center;
                        margin-left:20rpx;
                        .card-name{
                           font-size:40rpx;
                           font-weight:400;
                           .card-loss{
                              font-size:34rpx;
                              font-weight:600;
                              margin-left:10rpx;
                              letter-spacing:2rpx;
                              color: #333434;
                           }
                        }
                        .card-num{
                           font-size:34rpx;
                           font-weight:400;
                        }
                     }
                  }
                  .card-bottom{
                     width:100%;
                     display: flex;
                     align-items: center;
                     justify-content: space-between;
                     z-index: 2;
                     .bottom-left{
                        display: flex;
                        align-items:center;
                        .bottom-left-text{
                           font-size:40rpx;
                           font-weight:400;
                           letter-spacing:2rpx;
                        }
                        .bottom-left-money{
                           font-size:60rpx;
                           font-weight:600;
                        }
                     }
                     .card-btn{
                        width: 196rpx;
                        height: 80rpx;
                        background: linear-gradient( 270deg, #65B5FD 0%, #338AFD 100%, #65A7FD 100%);
                        border-radius: 40rpx;
                        text-align: center;
                        line-height: 80rpx;
                        font-size:48rpx;
                        letter-spacing:6rpx;
                     }
                  }
               }
               // .share-card{
               //    position:absolute;
               //    top:16rpx;
               //    left:28rpx;
               //    z-index:100;
               //    font-weight:400;
               //    font-size: 36rpx;
               //    color: #FFFFFF;
               // }
               // .card-content{
               //    width: 100%;
               //    height: 100%;
               //    box-sizing: border-box;
               //    padding:20rpx 15rpx;
               //    display: flex;
               //    justify-content:space-between;
               //    font-weight: 300;
               //    font-size: 30rpx;
               //    color: #FFFFFF;
               //    z-index:100;
               //    .card-left{
               //       height:100%;
               //       display: flex;
               //       justify-content:space-between;
               //       flex-direction:column;
               //       align-items:flex-start;
               //       z-index:100;
               //       .left-top{
               //          display: flex;
               //          flex-direction: column;
               //          view:first-child{
               //             display: flex;
               //             align-items: center;
               //             image{
               //                width:48rpx;
               //                height:48rpx;
               //             }
               //             text{
               //                font-weight:400;
               //                font-size: 36rpx;
               //                color: #FFFFFF;
               //             }
               //             .lossed{
               //                color:#fff;
               //             }
               //          }
               //          view:last-child{
               //             margin-left:10rpx;
               //             font-size: 26rpx;
               //             font-weight:500;
               //          }
               //       }
               //    }
               //    .card-right{
               //       display: flex;
               //       justify-content: space-between;
               //       align-items:flex-end;
               //       flex-direction: column;
               //       height:100%;
               //       z-index:100;
               //       .card-right-top{
               //          align-items:flex-end;
               //          display: flex;
               //          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;
               //          }
               //       }
               //       .card-right-bottom{
               //          width:137rpx;
               //          height:56rpx;
               //          background:linear-gradient(to right,#65A7FD ,#B1D9FD);
               //          border-radius:50rpx;
               //          text-align: center;
               //          line-height: 56rpx;
               //          color:#212DDE;
               //          font-weight: 400;
               //       }
               //    }
               // }
            }
         }
         .function-box1{
            width:100%;
            box-sizing:border-box;
            height: 215rpx;
            padding: 20rpx 32rpx 15rpx;
            height: 172rpx;
            padding: 20rpx 32rpx 22rpx;
            // background: rgba(85, 170, 0, 0.1);
            display:flex;
            justify-content: space-between;
            align-items:center;
            font-size:36rpx;
            font-weight:500;
            color: #4d4d4d;
            letter-spacing:2rpx;
            .box1-bg{
               width:212rpx;
               height:180rpx;
               width:326rpx;
               height:130rpx;
               border-radius:24rpx;
               background: #fff;
               box-shadow:0 0 12rpx 2rpx rgba(13,118,255,0.16);
               box-shadow:0 0 12rpx 3rpx rgba(13,118,255,0.16);
            }
            .box1-one{
               font-weight: 300;
               font-size: 32rpx;
               color: #000000;
               text-align: center;
               display: flex;
               flex-direction:column;
               align-items: center;
               justify-content: center;
               image{
               justify-content:space-evenly;
               .box-one-image1{
                  width: 86rpx;
                  height: 78rpx;
                  margin-bottom:20rpx;
                  height: 86rpx;
               }
            }
            .box1-two{
               font-weight: 300;
               font-size: 32rpx;
               color: #000000;
               display: flex;
               flex-direction:column;
               align-items:center;
               justify-content:space-evenly;
               image{
               .box-one-image2{
                  width:96rpx;
                  height: 96rpx;
                  // margin-bottom:20rpx;
@@ -655,11 +760,35 @@
               }
            }
         }
         .scan-box{
            width:100%;
            height:116rpx;
            padding:0 42rpx 16rpx;
            box-sizing: border-box;
            .scan{
               width:100%;
               height:100rpx;
               background: #1678FF;	
               border-radius:178rpx;
               display: flex;
               justify-content: center;
               align-items: center;
               color: #fff;
               font-size:44rpx;
               font-weight:500;
               letter-spacing:1rpx;
               .scan-img{
                  width:44rpx;
                  height:44rpx;
                  margin-right:20rpx;
               }
            }
         }
         .function-box2{
            width:100%;
            box-sizing:border-box;
            height: 429rpx;//374 + 44 + 距离 + 底部padding32
            padding:0 32rpx 15rpx;
            height: 420rpx;//374 + 44 + 距离 + 底部padding32
            padding:0 32rpx 0;
            // background: rgba(46, 121, 170, 0.5);
            .box2-title{
               width: 100%;
@@ -690,14 +819,15 @@
                  justify-content:space-between;
                  align-items: center;
                  .box2-item-img{
                     width: 90rpx;
                     height:90rpx;
                     width: 100rpx;
                     height:100rpx;
                     display: flex;
                     justify-content: center;
                     align-items: center;
                     // background: #65A7FD;
                     // background:linear-gradient(to right,#18acff,#639fff);
                     background: #5EA1FA;
                     border-radius:50%;
                     image{
                     .box2-image{
                        width: 48rpx;
                        height:48rpx;
                     }
@@ -706,90 +836,95 @@
                     width:100%;
                     height: 40rpx;
                     font-weight: 300;
                     font-size: 28rpx;
                     color: #000000;
                     font-size:30rpx;
                     color: #3e3e3e;
                     text-align: center;
                     font-weight:600;
                  }
               }
            }
         }
         .advertisement-box{
            width:100%;
            height: 160rpx;
            height:188rpx;
            padding:0 32rpx 10rpx; 
            box-sizing: border-box;
            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);
                  }
               }
            justify-content:center;
            .banner-img{
               width:686rpx;
               height:178rpx;
            }
            // .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;