<template>
  <JHeaderTitle bgColor="#7737fe" color="#fff" pdB="70rpx" :back="false" />
  <view class="page-wrapper" @click="toLogin">
    <!-- 自定义导航栏 -->
    <!-- 钱包卡片 -->
    <view class="wallet-wrapper">
      <view class="wallet-top">
        <view class="wallet-money">钱包余额（元）</view>
        <view class="wallet-number">******</view>
        <view class="wallet-eyes bdR10">
          <image src="/static/iconImg/home-eye-close.svg" mode="scaleToFill"/>
        </view>
      </view>
      <view class="wallet-bottom">
        <view>
          <view class="wallet-money">提现中金额（元）</view>
          <view class="wallet-b-number">0.00</view>
        </view>
        <view>
          <view class="wallet-money">在途利润（元）</view>
          <view class="wallet-b-number">0.00</view>
        </view>
        <view>
          <view class="wallet-money">冻结金额（元）
            <uni-icons type="help-filled" size="20" color="#c6c6c6"/>
          </view>
          <view>0.00
          </view>
        </view>
      </view>
    </view>
   
   <view style="padding: 30rpx;">
   	<button style="padding:10rpx 50rpx 10rpx 50rpx; background: #fff; color:#7737fe ;">提现</button>
   </view>
    <!-- <Button pd="0 50rpx 50rpx 50rpx" bgColor="#fff" color="#7737fe" pdTop="0">提现</JButton> -->
    <JCardContent>
      <!-- nav 导航部分 -->
      <view class="nav-list">
        <view class="nav-item bgF2 bdR16" v-for="(v, i) in list" :key="i" :class="[v.url === 'null' ? 'nav-station' : '']">
          <image :src="v.imgUrl" mode="scaleToFill" v-if="v.imgUrl" />
          <text class="nav-text">{{ v.title }}</text>
        </view>
      </view>
      <!-- 广告展示部分 -->
    
      <blcok v-for="v in vdata.adList" :key="v.adverId">
        <JeepayBanner :list="v.appContent" :interval='v.changeTime' v-if="v.appPlaceType == 2" mg='40rpx 0' />
        <JeepayAdCard :list='v.appContent' v-if="v.appPlaceType == 1" mg='40rpx 0' mgs="40rpx 0"/>
      </blcok>
    </JCardContent>

  </view>

    <!-- #ifdef APP-PLUS -->
   <view style="height: 120rpx;"></view>
	  <!-- #endif -->
</template>

<script setup>
import { ref, reactive, onBeforeUnmount } from "vue"	
import list from "./navList/navList"
const noticeList = ref([])
const vdata = reactive({
	adList:[]
})
const toLogin=()=>{
	uni.reLaunch({
		url:'/pages/login/login'
	})
}
</script>
<style lang="scss" scoped>
.page-wrapper {
  background-color: $primaryColor;
  padding-top: 100rpx;

  .wallet-wrapper {
    padding: 20rpx 50rpx 50rpx 50rpx;
    color: #fff;
  }

  .wallet-money {
    font-size: 25rpx;
    color: rgba($color: #fff, $alpha: 0.7);
  }

  .wallet-top {
    position: relative;

    .wallet-number {
      margin: 10rpx 0;
      font-size: 63rpx;
    }

    .wallet-eyes {
      display: flex;
      position: absolute;
      top: 0;
      right: 0;
      padding: 14rpx;
      background-color: rgba($color: #000000, $alpha: 0.2);

      image {
        width: 40rpx;
        height: 40rpx;
      }
    }
  }

  .wallet-bottom {
    display: flex;
    justify-content: space-between;
    margin-top: 60rpx;
    padding-right: 20rpx;

    .wallet-b-number {
      margin-top: 10rpx;
    }
  }
}

// 导航栏 和 公告时间部分 共用一个样式
.nav-text,
.notice-time {
  margin-top: 21rpx;
  font-size: 28rpx;
}

// 导航
.nav-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 30rpx;
  background: #fff;
  border-radius: 30rpx 30rpx 0 0 ;
  padding: 30rpx 45rpx;
  .nav-item {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 200rpx;
    height: 200rpx;
    margin-top: 25rpx;

    image {
      width: 60rpx;
      height: 60rpx;
    }
  }

  .nav-station {
    background-color: #fff;
  }
}

.notice-wrapper {
  margin-top: 20rpx;
  padding: 30rpx;
  background-color: #f7f7f7;

  .notice-content {
    white-space: nowrap;
  }

  .notice-time {
    color: #8c8c8c;
  }
}

.tips-wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 50rpx;
  .tips-title {
    margin-bottom: 30rpx;
    font-size: 30rpx;
  }
  .tips-info {
    font-size: 26rpx;
    color: #808080;
  }
}



</style>
