391 lines
10 KiB
Vue
391 lines
10 KiB
Vue
<template>
|
||
<view class="earnings p30">
|
||
<view class="mine_header" style="margin-bottom: 30rpx">
|
||
<!-- <image :src="info.avatar" class="mine_header_img" mode="aspectFill"></image> -->
|
||
<view class="mine_header_user">
|
||
<view>{{ getInfo.userName }}</view>
|
||
<view>{{ getInfo.phone }}</view>
|
||
</view>
|
||
<view class="wallet_pall_button" style="background-color: #5082ff; color: #fff" @click="outLogin">退出登录</view>
|
||
<!-- <image class="mine_header_sett" @click="toEarnings" src="/static/icon/sett.png"></image> -->
|
||
</view>
|
||
|
||
<view class="wallet_pall">
|
||
<view class="wallet_pall_view">
|
||
<view>{{ getInfo.balance || '0.00' }}</view>
|
||
<view>当前收益</view>
|
||
</view>
|
||
<view class="wallet_pall_button" @click="navTo('/pages/mine/withdraw')">提现</view>
|
||
</view>
|
||
|
||
<!-- 余额，提现，收支明细，订单列表，充电桩列表，充电站列表，统计(今日，上周，本周，30天) -->
|
||
|
||
<view style="margin: 30rpx 0">
|
||
<up-grid :border="false" col="4">
|
||
<up-grid-item bgColor="#fff" @click="navTo(`/pages/mine/incomeList`, true)">
|
||
<view style="height: 25rpx"></view>
|
||
<image src="/static/icon/mx.png" style="width: 56rpx; height: 56rpx" mode="widthFix"></image>
|
||
<text style="font-size: 28rpx; color: #333; margin-top: 10rpx">收支明细</text>
|
||
<view style="height: 15rpx"></view>
|
||
</up-grid-item>
|
||
<up-grid-item bgColor="#fff" @click="navTo(`/pages/order/order`, true)">
|
||
<view style="height: 25rpx"></view>
|
||
<image src="/static/icon/order.png" style="width: 56rpx; height: 56rpx" mode="widthFix"></image>
|
||
<text style="font-size: 28rpx; color: #333; margin-top: 10rpx">订单列表</text>
|
||
<view style="height: 15rpx"></view>
|
||
</up-grid-item>
|
||
<up-grid-item bgColor="#fff" @click="navTo(`/pages/mine/piles`, true)">
|
||
<view style="height: 25rpx"></view>
|
||
<image src="/static/icon/cdz.png" style="width: 56rpx; height: 56rpx" mode="widthFix"></image>
|
||
<text style="font-size: 28rpx; color: #333; margin-top: 10rpx">充电桩列表</text>
|
||
<view style="height: 15rpx"></view>
|
||
</up-grid-item>
|
||
<up-grid-item bgColor="#fff" @click="navTo(`/pages/mine/z`, true)">
|
||
<view style="height: 25rpx"></view>
|
||
<image src="/static/icon/tx.png" style="width: 56rpx; height: 56rpx" mode="widthFix"></image>
|
||
<text style="font-size: 28rpx; color: #333; margin-top: 10rpx">提现记录</text>
|
||
<view style="height: 15rpx"></view>
|
||
</up-grid-item>
|
||
<!-- <up-grid-item bgColor="#fff" @click="navTo(`/pages/wallet/withdrawList`, true)">
|
||
<view style="height: 25rpx"></view>
|
||
<image src="/static/icon/grxx.png" style="width: 56rpx; height: 56rpx" mode="widthFix"></image>
|
||
<text style="font-size: 28rpx; color: #333; margin-top: 10rpx">个人信息</text>
|
||
<view style="height: 15rpx"></view>
|
||
</up-grid-item>
|
||
<up-grid-item bgColor="#fff" @click="navTo(`/pages/wallet/withdrawList`, true)">
|
||
<view style="height: 25rpx"></view>
|
||
<image src="/static/icon/tc.png" style="width: 56rpx; height: 56rpx" mode="widthFix"></image>
|
||
<text style="font-size: 28rpx; color: #333; margin-top: 10rpx">退出登录</text>
|
||
<view style="height: 15rpx"></view>
|
||
</up-grid-item> -->
|
||
</up-grid>
|
||
</view>
|
||
|
||
<view style="margin: 30rpx 0; background-color: #fff" v-if="getInfo.point2Give && getInfo.point2Give == 1">
|
||
<up-grid :border="false" col="4">
|
||
<up-grid-item bgColor="#fff" @click="navTo(`/pages/mine/toUser2`, true)">
|
||
<view style="height: 25rpx"></view>
|
||
<image src="/static/icon/zhuan.png" style="width: 56rpx; height: 56rpx" mode="widthFix"></image>
|
||
<text style="font-size: 28rpx; color: #333; margin-top: 10rpx">转赠增值积分</text>
|
||
<view style="height: 15rpx"></view>
|
||
</up-grid-item>
|
||
</up-grid>
|
||
</view>
|
||
<view class="mine_block">
|
||
<view class="mine_block_tit">
|
||
<view class="mine_block_tit_left">充电桩</view>
|
||
</view>
|
||
|
||
<view class="mine_block_view">
|
||
<!-- <image mode="widthFix" src="/static/home/zu1.png"></image> -->
|
||
<view class="u-flex-y-center u-flex-between u-flex-fill">
|
||
<view style="width: 100%">
|
||
<view style="color: #3770ae; font-size: 30rpx">{{ devices || 0 }}</view>
|
||
<view style="color: #999">我的充电桩数</view>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="u-flex-y-center u-flex-between u-flex-fill">
|
||
<view style="width: 100%">
|
||
<view style="color: #3770ae; font-size: 30rpx">{{ teamDevices || 0 }}</view>
|
||
<view style="color: #999">运营充电桩数</view>
|
||
</view>
|
||
</view> -->
|
||
</view>
|
||
</view>
|
||
<view class="mine_block" v-for="(item, index) in money_list" :key="index">
|
||
<view class="mine_block_tit">
|
||
<view class="mine_block_tit_left">{{ item.name }}</view>
|
||
</view>
|
||
<view class="mine_block_view u-flex-between">
|
||
<!-- <image mode="widthFix" src="/static/home/zu2.png"></image> -->
|
||
<view class="u-flex-fill">
|
||
<view class="u-flex-y-center u-flex-between u-flex-fill" style="margin-bottom: 20rpx">
|
||
<view style="width: 50%">
|
||
<view style="font-size: 30rpx">
|
||
<text style="color: #4874e5">{{ item.data.day_money || 0 }}</text>
|
||
</view>
|
||
<view style="color: #999">今日{{ item.type }}</view>
|
||
</view>
|
||
|
||
<view style="width: 50%">
|
||
<view style="font-size: 30rpx">
|
||
<text style="color: #4874e5">{{ item.data.week_money1 || 0 }}</text>
|
||
</view>
|
||
<view style="color: #999">上周{{ item.type }}</view>
|
||
</view>
|
||
</view>
|
||
<view class="u-flex-y-center u-flex-between u-flex-fill">
|
||
<view style="width: 50%">
|
||
<view style="font-size: 30rpx">
|
||
<text style="color: #4874e5">{{ item.data.week_money0 || 0 }}</text>
|
||
</view>
|
||
<view style="color: #999">本周{{ item.type }}</view>
|
||
</view>
|
||
<view style="width: 50%">
|
||
<view style="font-size: 30rpx">
|
||
<text style="color: #4874e5">{{ item.data.total_money || 0 }}</text>
|
||
</view>
|
||
<view style="color: #999">30天{{ item.type }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view style="height: 100rpx"></view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { reactive, ref } from 'vue';
|
||
import { onPullDownRefresh, onPageScroll, onReachBottom } from '@dcloudio/uni-app';
|
||
import { timeFormat } from '@/uni_modules/uview-plus';
|
||
import { operatorInfo, operatorStats } from '@/api/api.js';
|
||
import { onLoad, onShow } from '@dcloudio/uni-app';
|
||
import { useNav } from '@/hooks/useNav.js';
|
||
import moneyJson from '@/common/money.json';
|
||
|
||
const { nav, navTo } = useNav();
|
||
let getInfo = ref({});
|
||
let device = ref({});
|
||
let devices = ref(0);
|
||
let teamDevices = ref(0);
|
||
let wallet = ref(0);
|
||
let income = ref(0);
|
||
|
||
let money_list = ref([
|
||
{
|
||
name: '收益统计',
|
||
type: '收益',
|
||
data: {}
|
||
}
|
||
]);
|
||
|
||
let num = ref(1);
|
||
onShow(async () => {
|
||
let _res = await operatorInfo();
|
||
getInfo.value = _res;
|
||
userStatCou();
|
||
});
|
||
|
||
let userStatCou = async () => {
|
||
let _res = await operatorStats();
|
||
devices.value = _res.deviceCount;
|
||
money_list.value.map((item, index) => {
|
||
if (item.type == '收益') {
|
||
item.data = {
|
||
day_money: _res.balanceToday,
|
||
week_money1: _res.balanceLastWeek,
|
||
week_money0: _res.balanceThisWeek,
|
||
total_money: _res.balance30Days
|
||
};
|
||
}
|
||
});
|
||
};
|
||
|
||
let outLogin = ()=>{
|
||
uni.showModal({
|
||
title: '提示',
|
||
content: '是否确认退出登录？',
|
||
success: function (res) {
|
||
if (res.confirm) {
|
||
uni.clearStorageSync();
|
||
store.commit('setToken', '');
|
||
uni.reLaunch({
|
||
url: '/pages/login/login'
|
||
});
|
||
} else if (res.cancel) {
|
||
console.log('用户点击取消');
|
||
}
|
||
}
|
||
});
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.wallet_pall {
|
||
height: 200rpx;
|
||
border-radius: 16rpx;
|
||
padding: 40rpx;
|
||
background: linear-gradient(179deg, #5082ff 0%, #4278ff 100%);
|
||
@include flex($space: space-between);
|
||
border-bottom: 1rpx solid rgba(153, 153, 153, 0.6);
|
||
|
||
&_button {
|
||
padding: 10rpx 30rpx;
|
||
font-size: 28rpx;
|
||
color: #333;
|
||
background-color: #fff;
|
||
border-radius: 30rpx;
|
||
}
|
||
|
||
&_header {
|
||
font-weight: bold;
|
||
font-size: 26rpx;
|
||
color: #002ea4;
|
||
}
|
||
&_ye {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
height: 70%;
|
||
view:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 68rpx;
|
||
color: #fff;
|
||
}
|
||
view:nth-child(2) {
|
||
width: 128rpx;
|
||
height: 58rpx;
|
||
background: rgba(0, 46, 164, 0.07);
|
||
border-radius: 32rpx 32rpx 32rpx 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 26rpx;
|
||
color: #fff;
|
||
}
|
||
}
|
||
|
||
&_view {
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
view:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 45rpx;
|
||
color: #fff;
|
||
margin-bottom: 30rpx;
|
||
}
|
||
view:nth-child(2) {
|
||
font-size: 28rpx;
|
||
color: #fff;
|
||
}
|
||
}
|
||
}
|
||
|
||
.wallet_list {
|
||
width: 690rpx;
|
||
height: 120rpx;
|
||
background: #ffffff;
|
||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||
padding: 15rpx 30rpx;
|
||
@include flex($space: space-between);
|
||
&_left {
|
||
view:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #232323;
|
||
margin-bottom: 10rpx;
|
||
}
|
||
view:nth-child(2) {
|
||
font-size: 24rpx;
|
||
color: #232323;
|
||
}
|
||
}
|
||
&_right {
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #ff2727;
|
||
}
|
||
}
|
||
|
||
.mine_block {
|
||
padding: 24rpx;
|
||
background-color: #fff;
|
||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||
margin-bottom: 20rpx;
|
||
|
||
&_tit {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
&_left {
|
||
font-weight: bold;
|
||
font-size: 28rpx;
|
||
color: #232323;
|
||
}
|
||
|
||
&_right {
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 24rpx;
|
||
color: #cbd73b;
|
||
|
||
image {
|
||
width: 13rpx;
|
||
height: 22rpx;
|
||
margin-left: 15rpx;
|
||
margin-top: 6rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
&_view {
|
||
width: 100%;
|
||
min-height: 120rpx;
|
||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||
border: 2rpx solid rgba(55, 112, 174, 0.1);
|
||
margin-top: 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 28rpx;
|
||
color: #232323;
|
||
padding: 20rpx 30rpx;
|
||
text-align: center;
|
||
|
||
image {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-right: 25rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.u-flex-y-center {
|
||
@include flex;
|
||
align-items: center;
|
||
}
|
||
|
||
// 主轴等比间距
|
||
.u-flex-between {
|
||
justify-content: space-between;
|
||
}
|
||
|
||
// 自动伸缩
|
||
.u-flex-fill {
|
||
flex: 1 1 auto;
|
||
}
|
||
|
||
.mine {
|
||
&_header {
|
||
@include flex($space: space-between);
|
||
&_img {
|
||
width: 150rpx;
|
||
height: 150rpx;
|
||
// border-radius: 50%;
|
||
margin-right: 15rpx;
|
||
}
|
||
&_user {
|
||
flex: 1;
|
||
view:nth-child(1) {
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #232323;
|
||
margin-bottom: 15rpx;
|
||
}
|
||
view:nth-child(2) {
|
||
font-weight: bold;
|
||
font-size: 44rpx;
|
||
color: #232323;
|
||
}
|
||
}
|
||
&_sett {
|
||
width: 42rpx;
|
||
height: 42rpx;
|
||
}
|
||
}
|
||
}
|
||
</style>
|