137 lines
3.4 KiB
Vue
137 lines
3.4 KiB
Vue
<template>
|
||
<van-nav-bar title="用户信息" />
|
||
<div class="container">
|
||
<div class="userinfo">
|
||
<div class="title">用户昵称：<span>{{ userInfo.nikename }}</span></div>
|
||
<div class="title">Telegram ID：<span>{{ userInfo.telegram_id }}</span></div>
|
||
<div class="title">Telegram联系方式：<span>{{ userInfo.telegram_tel }}</span></div>
|
||
<div class="title">Email：<span>{{ userInfo.email }}</span></div>
|
||
<div class="edit" @click="editUserInfo()"><van-icon name="edit" /></div>
|
||
</div>
|
||
<div class="dashboard">
|
||
<div class="box">
|
||
<div class="account">{{ dashboard.taskCount }}</div>
|
||
<div class="title">总任务数</div>
|
||
</div>
|
||
<div class="shu"></div>
|
||
<div class="box">
|
||
<div class="account">{{ dashboard.orderMoney }}</div>
|
||
<div class="title">USDT付款总额</div>
|
||
</div>
|
||
<div class="shu"></div>
|
||
<div class="box">
|
||
<div class="account">{{ dashboard.taskUnpayCount }}</div>
|
||
<div class="title">待支付任务数</div>
|
||
</div>
|
||
</div>
|
||
<div class="tool">
|
||
<div class="tool-box" @click="goPage('/h5/mass_send')">
|
||
<div><van-icon name="notes-o" class="icon" /></div>
|
||
<div class="title">群发记录</div>
|
||
</div>
|
||
<div class="tool-box" @click="goPage('/h5/notice')">
|
||
<div><van-icon name="other-pay" class="icon" /></div>
|
||
<div class="title">通知历史</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</template>
|
||
<script setup>
|
||
import { ref, reactive, computed, watch, onMounted, onBeforeUnmount } from 'vue'
|
||
import { getUserinfo, getDashboard } from '@/axios/request'
|
||
import { useRouter } from 'vue-router'
|
||
const router = useRouter()
|
||
const userInfo = ref({})
|
||
const dashboard = ref({})
|
||
onMounted(async () => {
|
||
userInfo.value = await getUserinfo()
|
||
dashboard.value = await getDashboard()
|
||
console.log('userInfo', userInfo.value, dashboard.value)
|
||
})
|
||
|
||
const editUserInfo = () => {
|
||
router.push('/h5/detail')
|
||
}
|
||
const goPage = (url) => {
|
||
localStorage.setItem('current_task_id', '')
|
||
router.push(url)
|
||
}
|
||
</script>
|
||
<style scoped lang="scss">
|
||
.container {
|
||
background-color: #f5f8fa !important;
|
||
height: 100vh;
|
||
padding-top: 12px;
|
||
}
|
||
|
||
.userinfo {
|
||
margin: 12px;
|
||
border-radius: 12px;
|
||
background-color: #ffffff;
|
||
padding: 12px;
|
||
color: #666;
|
||
position: relative;
|
||
margin-top: 0;
|
||
|
||
span {
|
||
color: #999;
|
||
}
|
||
|
||
.edit {
|
||
position: absolute;
|
||
top: 45%;
|
||
right: 12px;
|
||
}
|
||
}
|
||
|
||
.dashboard {
|
||
display: flex;
|
||
justify-content: space-around;
|
||
align-items: center;
|
||
text-align: center;
|
||
margin: 12px;
|
||
padding: 12px;
|
||
background-color: #ffffff;
|
||
border-radius: 8px;
|
||
|
||
.shu {
|
||
width: 1px;
|
||
height: 40px;
|
||
background: #eee;
|
||
}
|
||
|
||
.account {
|
||
font-weight: 600;
|
||
color: #666;
|
||
}
|
||
|
||
.title {
|
||
color: #333;
|
||
}
|
||
}
|
||
|
||
.tool {
|
||
margin: 12px;
|
||
padding: 12px;
|
||
background-color: #ffffff;
|
||
border-radius: 8px;
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
text-align: center;
|
||
|
||
.tool-box {
|
||
width: 30%;
|
||
|
||
.icon {
|
||
font-size: 20px;
|
||
}
|
||
|
||
.title {
|
||
font-size: 12px;
|
||
color: #999;
|
||
}
|
||
}
|
||
}
|
||
</style> |