191 lines
4.2 KiB
Vue
191 lines
4.2 KiB
Vue
<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>
|