添加共享列表，修改共享功能相关代码

Liuyi

2024-10-19 42e5ea86f7edc9361227edd979a8ae1952713161

 pages/index/index.vue

@@ -1,7 +1,7 @@
<script setup>
    import { onMounted, ref } from "vue";
   import { getVipInfoApi,getUserInfo,reportLossApi,removeCardApi } from '../../api/index.js'
   import { onShow } from '@dcloudio/uni-app'
   import { onShow,getCurrentPages } from '@dcloudio/uni-app'
   //状态栏高度
   const topHeight = ref(0)
   function getTopHeight(){
@@ -13,7 +13,6 @@
   /**
    * 会员卡相关
    */
   const isLoss = ref(false)
   const cardInfo = ref({
      id:'',
      userName:'微信用户',
@@ -23,42 +22,42 @@
      waterCardNumber:'',
      balance:'',
      count:'',
      state:'',
      state:'',//state:true：挂失，false：正常
      userCardType:'',//userCardType：true：共享卡，false：正常卡
   })
   const isLoss = ref(false)
   const isVip = ref(false)
   const isShareCard = ref(false)
   //获取会员卡信息
    function getVipInfo(){
      return new Promise((resolve,reject) =>{
          getVipInfoApi().then((res) =>{
            if(res.code == 200){
               cardInfo.value.waterCardNumber = res.data.cardNumber
               cardInfo.value.state = res.data.state
               isLoss.value = cardInfo.value.state == 2 ? true : false
               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
    async function getVipInfo(){
      await getVipInfoApi().then((res) =>{
         if(res.code == 200 && res.data.id){
            cardInfo.value.waterCardNumber = res.data.cardNumber
            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 
            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)
         }
      })
   }
   //获取用户信息
   function getInfo(){
       getUserInfo().then((res) =>{
   async function getInfo(){
       await getUserInfo().then(async(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.userPhone = res.data.userInfo.userPhone
            cardInfo.value.id = res.data.userInfo.id
				
            if(res.data.userInfo.waterCardNumber){
               getVipInfo()
               console.log('00000')
            }else{
               isVip.value = false
            }
            await getVipInfo()
            console.log('00000',cardInfo.value)
            uni.setStorageSync('userInfo',JSON.stringify(cardInfo.value))
         }
      })
@@ -67,7 +66,7 @@
    * 扫码取水相关
    */
   function toScan(){
      // 调用二维码扫描接口
      //调用二维码扫描接口
      uni.scanCode({
         scanType: ['qrCode'],
         success: function (res) {
@@ -82,14 +81,14 @@
    * 功能列表相关
    */
   const functionList = ref([
      {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:'',isUrl:1},
      {text:'故障上报',icon:'../../static/images/index/icon35.png',url:'/pages/infoBreakdown/index',isUrl:1},
      {text:'电子发票',icon:'../../static/images/index/icon36.png',url:'',isUrl:1},
      {text:'会员卡挂失',icon:'../../static/images/index/icon37.png',url:'',isUrl:2},
      {text:'会员卡注销',icon:'../../static/images/index/icon38.png',url:'',isUrl:3},
      {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},
   ])
   function navTo(itemUrl){
      if(itemUrl){
@@ -103,63 +102,88 @@
      if(isUrl == 1){
         navTo(url)
      }else if(isUrl == 2){
         uni.showModal({
               title: '会员卡挂失',
               content: '确认挂失会员卡？',
               success: async function(res) {
               if (res.confirm) {
                  await reportLossApi(cardInfo.value.waterCardNumber).then(async(res) =>{
                     if(res.code == 200){
                        uni.showToast({
                           title: '已挂失',
                           duration: 2000,
                        });
                        await getVipInfoApi().then((res) =>{
                           if(res.code == 200){
                              if(res.data.state == 2){
                                 isLoss.value = true
         if(cardInfo.value.waterCardNumber){
            uni.showModal({
                  title: '会员卡挂失',
                  content: '确认挂失会员卡？',
                  success: async function(res) {
                  if (res.confirm) {
                     await reportLossApi(cardInfo.value.waterCardNumber).then(async(res) =>{
                        if(res.code == 200){
                           uni.showToast({
                              title: '已挂失',
                              duration: 2000,
                           });
                           await getVipInfoApi().then((res) =>{
                              if(res.code == 200){
                                 if(res.data.state == 2){
                                    isLoss.value = true
                                 }
                              }
                           }
                        })
                     }
                  })
               }else{
                  console.log('点击了取消7')
                           })
                        }
                     })
                  }
               }
            }
         })
            })
         }else{
            uni.showToast({
               title:'未绑定会员卡！',
               icon:'none'
            })
         }
      }else if(isUrl == 3){
         uni.showModal({
               title: '会员卡注销',
               content: '确认注销会员卡？',
               success: async function(res) {
               if (res.confirm) {
                  await removeCardApi(cardInfo.value.waterCardNumber).then(async(res) =>{
                     if(res.code == 200){
                        uni.showToast({
                           title: '已注销',
                           duration: 2000,
                           icon:'none',
                        });
                        await getVipInfoApi().then((res) =>{
                           if(res.code == 200){
                              if(!res.data.id){
                                 isVip.value = false
                                 cardInfo.value.balance = ''
                                 cardInfo.value.count = ''
                                 cardInfo.value.waterCardNumber = ''
                                 uni.setStorageSync('userInfo',JSON.stringify(cardInfo.value))
         if(cardInfo.value.waterCardNumber){
            uni.showModal({
                  title: '会员卡注销',
                  content: '确认注销会员卡？',
                  success: async function(res) {
                  if (res.confirm) {
                     await removeCardApi(cardInfo.value.waterCardNumber).then(async(res) =>{
                        if(res.code == 200){
                           uni.showToast({
                              title: '已注销',
                              duration: 2000,
                              icon:'none',
                           });
                           await getVipInfoApi().then((res) =>{
                              if(res.code == 200){
                                 if(!res.data.id){
                                    isVip.value = false
                                    cardInfo.value.balance = ''
                                    cardInfo.value.count = ''
                                    cardInfo.value.waterCardNumber = ''
                                    uni.setStorageSync('userInfo',JSON.stringify(cardInfo.value))
                                 }
                              }
                           }
                        })
                     }
                  })
               }else{
                  console.log('点击了取消8')
                           })
                        }
                     })
                  }else{
                     console.log('点击了取消8')
                  }
               }
            }
         })
            })
         }else{
               uni.showToast({
                  title:'未绑定会员卡！',
                  icon:'none'
               })
         }
      }else{
         uni.showToast({
            title: '该功能正在升级中！',
            duration: 2000,
            icon:'none',
         });
      }
   }
   function upGrade(){
      uni.showToast({
         title: '该功能正在升级中！',
         duration: 2000,
         icon:'none',
      });
   }
   onMounted( async() =>{
      getTopHeight()
@@ -167,6 +191,18 @@
   onShow(async() =>{
      await getInfo()
   })
   uni.showShareMenu({
     withShareTicket: true,
     menus: ['shareAppMessage', 'shareTimeline'],
     success: function () {
       console.log('分享菜单显示成功');
     },
     fail: function (err) {
       console.error('分享菜单显示失败', err);
     }
   });
	

</script>

<template>
@@ -184,11 +220,12 @@
            </view>
            <view class="card">
               <image class="card-bg" src="../../static/images/index/card11.png" alt=""></image>
               <view class="card-content">
               <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>
                           <image v-if="isVip"  src="../../static/images/index/code1.png" alt=""></image>
                           <text>会员卡&nbsp;</text>
                           <text class="lossed" v-if="isLoss && isVip">&nbsp;[已挂失]</text>
                        </view>
@@ -212,7 +249,7 @@
            </view>
         </view>
         <view class="function-box1">
            <view class="box1-bg box1-one" @click="navTo('/pages/sendWater/index')">
            <view class="box1-bg box1-one" @click="upGrade()">
               <image src="../../static/images/index/home21.png" alt=""></image>
               <view>送水到家</view>
            </view>
@@ -238,13 +275,13 @@
            <view class="box2-content">
               <block v-for="(item,index) in functionList" :key="index">
                  <view class="box2-item"  @click="setEvent(item.isUrl,item.url)">
                     <image :src= "item.icon" alt=""></image>
                     <view class="box2-item-img" :style="{background:item.bgColor}"><image :src= "item.icon" alt=""></image></view>
                     <view class="box2-item-text">{{item.text}}</view>
                  </view>
               </block>
            </view>
         </view>
         <view class="advertisement-box"><image src="../../static/images/index/bg4.png" alt=""></image></view>
         <view class="advertisement-box" @click="upGrade"><image src="../../static/images/index/bg4.png" alt=""></image></view>
         <view class="service-box">
            <view class="service-title"><text>服务指南</text></view>
            <view class="service-content">
@@ -259,7 +296,7 @@
                     <image src="../../static/images/index/more-info5.png" alt=""></image>
                  </view>
               </view>
               <view class="service-bg">
               <view class="service-bg" @click="upGrade">
                     <view>
                        <image src="../../static/images/index/notice5.png" alt=""></image>
                        <text>公示公告</text>
@@ -343,6 +380,15 @@
                  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{
                  width: 100%;
                  height: 100%;
@@ -368,8 +414,8 @@
                           display: flex;
                           align-items: center;
                           image{
                              width:70rpx;
                              height:70rpx;
                              width:48rpx;
                              height:48rpx;
                           }
                           text{
                              font-weight:400;
@@ -377,7 +423,7 @@
                              color: #FFFFFF;
                           }
                           .lossed{
                              color:#344ede;
                              color:#fff;
                           }
                        }
                        view:last-child{
@@ -546,9 +592,18 @@
                  flex-direction:column;
                  justify-content:space-between;
                  align-items: center;
                  image{
                  .box2-item-img{
                     width: 90rpx;
                     height:90rpx;
                     display: flex;
                     justify-content: center;
                     align-items: center;
                     // background: #65A7FD;
                     border-radius:50%;
                     image{
                        width: 48rpx;
                        height:48rpx;
                     }
                  }
                  .box2-item-text{
                     width:100%;