Liuyi
2024-11-21 9857f8cdadf9bbda695a689f42e0e8cecfefab3f
pages/pointsMall/index.vue
@@ -10,13 +10,6 @@
   
   const typeList = ref([
      // {value:'1',name:'全部分类',active:1},
      // {value:'2',name:'零食',active:0},
      // {value:'3',name:'电子设备',active:0},
      // {value:'4',name:'洗护用品',active:0},
      // {value:'5',name:'其他',active:0},
      // {value:'5',name:'其他',active:0},
      // {value:'5',name:'其他',active:0},
      // {value:'5',name:'其他',active:0},
   ])
   const goodsList = ref([
      // {id:'1',imageUrl:'',name:'商品名称',price:'50.00',useIntegral:'1000',stock:102},
@@ -40,24 +33,39 @@
   async function changeType(typeId,active,e){
      typeList.value.forEach((item,index) =>{
         if(index == e){
            item.active = 1
            item.active = true
         }else{
            item.active = 0
            item.active = false
         }
      })
      await getGoodsList(typeId)
   }
   //积分兑换
   async function integralConvert(goodsId,goodsIntegral){
      if(goodsIntegral <= Number(userInfo.value.integral)){
         await integralConvertApi({userId:userInfo.value.id,goodsId:goodsId}).then((res) =>{
   async function confirm(){
      await integralConvertApi({userId:userInfo.value.id,goodsId:checkedGoodsId.value}).then(async(res) =>{
            if(res.code == 200){
               uni.showToast({
                  title:'兑换成功!',
                  icon:'none'
               duration:1000
               })
            await updateUserInfo()
            await getGoodsList('')
            setGoodsType()
            setTimeout(() =>{
               uni.navigateTo({
                  url:'/pages/pointsMall/pointsExchangeRecord/index'
               })
            },1000)
            }
         })
   }
   //打开确认弹窗
   const alertDialog = ref()
   const checkedGoodsId = ref()
   async function integralConvert(goodsId,goodsIntegral){
      if(goodsIntegral <= Number(userInfo.value.integral)){
         checkedGoodsId.value = goodsId
         alertDialog.value.open()
      }else{
         uni.showToast({
            title:'积分余额不足!',
@@ -86,13 +94,8 @@
         }
      })
   }
   onMounted(async() =>{
      await getGoodsTypeList()
      await getGoodsList('')
      console.log('onMounted')
   })
   onShow(async() =>{
      await getGoodsList('')
   //设置选中商品为全部
   function setGoodsType(){
      typeList.value.forEach((item,index) =>{
         if(index == 0){
            item.active = 1
@@ -100,6 +103,15 @@
            item.active = 0
         }
      })
   }
   onMounted(async() =>{
      await getGoodsTypeList()
      await getGoodsList('')
      console.log('onMounted')
   })
   onShow(async() =>{
      await getGoodsList('')
      setGoodsType()
      await updateUserInfo()
      console.log('onShow')
   })
@@ -157,7 +169,7 @@
               <image src="../../static/images/pointMall/nav1.svg"></image>
            </view>
            <view class="nav-item" @click="navTo('/pages/pointsMall/pointsExchangeRecord/index')">
               <text>兑换记录</text>
               <text>兑换订单</text>
               <image src="../../static/images/pointMall/nav2.svg"></image>
            </view>
         </view>
@@ -172,7 +184,7 @@
         </view>
         <view class="goods-box">
            <view v-for="(item,index) in goodsList" :key="index" class="goods-item">
               <image @click="navTo(`/pages/pointsMall/pointsGoodsDetail/index?goodsId=${item.id}`)" class="goods-item-img" :src="baseUrl + '/upload' + item.imageUrl" mode="widthFix"></image>
               <image @click="navTo(`/pages/pointsMall/pointsGoodsDetail/index?goodsId=${item.id}`)" class="goods-item-img" :src="baseUrl + '/upload' + item.imageUrl" mode="aspectFit"></image>
               
               <view class="goods-item-name" @click="navTo(`/pages/pointsMall/pointsGoodsDetail/index?goodsId=${item.id}`)">
                  <text>{{item.name}}</text>
@@ -199,6 +211,10 @@
            </view>
         </view>
      </view>
      <!-- 提示窗 -->
      <uni-popup ref="alertDialog" type="dialog">
         <uni-popup-dialog type="info" title="提示" :showClose = 'true' content="确认兑换该商品!" @confirm="confirm"></uni-popup-dialog>
      </uni-popup>
   </view>
</template>
@@ -499,7 +515,7 @@
            .goods-item{
               display: inline-block;
               width:48%;
               max-height:800rpx;
               height:600rpx;
               background: #fff;
               overflow:hidden;
               margin-bottom:20rpx;
@@ -512,6 +528,7 @@
               background:linear-gradient(#fff,#e8e8e8);
               .goods-item-img{
                  width:80%;
                  min-height:280rpx;
                  margin: 0 auto;
                  margin-bottom:50rpx;
               }