zzak/x-forend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 前端重构

Browse Source
This commit is contained in:
anonymous
2025-01-07 18:04:40 +08:00
parent dbb57f07c3
commit 21d8f75f6a
43 changed files with 705 additions and 359 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages-sub/asset/index.vue
+56 -24
View File
@@ -1,7 +1,7 @@
<route lang="json5">
{
style: {
navigationBarTitleText: '我的资产',
navigationBarTitleText: '资金明细',
navigationBarBackgroundColor: '#fff',
},
}
@@ -13,6 +13,14 @@ import { useUserStore } from '@/store'
const userStore = useUserStore()
const tabList = [
{ label: '我的余额', value: 0 },
{ label: '救济金余额', value: 1 },
{ label: '养老金余额', value: 2 },
{ label: '佣金余额', value: 3 },
]
const tabIndex = ref(0)
const detailInfo = ref({
point: 1,
score: 1000,
@@ -25,11 +33,49 @@ const { list: assetList } = useListPageRequest((params) =>
return res.data
}),
)
onLoad((options) => {
tabIndex.value = Number(options.tabIndex ?? 0)
})
</script>
<template>
<view class="min-h-screen py-15">
<view class="mx-15 text-16 font-bold text-#333">我的资产</view>
<view class="asset-page pt-15 relative">
<view class="absolute top-130 -left-55 btn-gradient text-white rounded-full w-172 h-172"></view>
<view class="flex justify-around">
<view
v-for="tabItem in tabList"
@click="tabIndex = tabItem.value"
:key="tabItem.value"
class="flex items-center bg-#DEEBFF text-#3B81F3 rounded-full justify-center py-4 px-10"
:class="{ 'btn-gradient text-white': tabIndex === tabItem.value }"
>
<view class="text-14">{{ tabItem.label }}</view>
</view>
</view>
<view class="p-15">
<view class="text-17">{{ tabList[tabIndex].label }}</view>
<view class="text-30">￥{{ detailInfo.suminvest }}</view>
</view>
<view class="relative z-1 main-content pt-40 pb-30 rounded-t-15">
<view class="mb-15 px-25">【{{ tabList[tabIndex].label }}】明细</view>
<view
class="flex px-25 py-12 border-b items-center border-#3333331A border-b-solid"
v-for="item in assetList"
:key="item.id"
>
<image src="/static/images/page-sub/invite-icon.png" class="w-48 h-48" />
<view class="flex flex-col flex-1 ml-15">
<view class="text-14 text-#333">{{ item.memo }}</view>
<view class="text-12 mt-4 text-#333">{{ item.createtime }}</view>
</view>
<view class="flex flex-col items-end">
<view class="text-17 font-bold text-gradient">{{ item.money }}</view>
</view>
</view>
</view>
<!-- <view class="mx-15 text-16 font-bold text-#333">我的资产</view>
<view
class="mt-15 mx-15 rounded-20 text-#476FFF main-content p-15 rounded-10 shadow-[0_5px_30px_rgba(149,195,255,0.4)]"
>
@@ -37,31 +83,17 @@ const { list: assetList } = useListPageRequest((params) =>
<view class="text-35 mt-10 font-bold">{{ detailInfo.suminvest }}</view>
</view>
<view class="text-16 mx-15 mb-15 font-bold text-#333 mt-30">资产记录</view>
<view
class="flex px-15 py-8 border-b items-center border-#E5E5E5 border-b-solid"
v-for="item in assetList"
:key="item.id"
>
<image src="/static/images/page-sub/invite-icon.png" class="w-32 h-32 self-center" />
<view class="flex flex-col flex-1 ml-15">
<view class="text-14 text-#333">{{ item.memo }}</view>
<!-- <view class="text-12 mt-10 text-#999">奖励</view> -->
<view class="text-12 mt-10 text-#999">{{ item.createtime }}</view>
</view>
<view class="flex flex-col items-end">
<view class="text-14 font-bold text-#FF5F5F">{{ item.money }}</view>
<!-- <view class="text-14 mt-10 py-4 px-10 bg-#71C78A1A text-#71C78A">已到账</view> -->
</view>
</view>
-->
</view>
</template>
<style>
.main-content {
background-image: url('@/static/images/page-sub/team/main-bg.png');
<style scoped>
.asset-page {
background-repeat: no-repeat;
background-position: center;
background-size: 100% 100%;
background-size: 172px 172px;
}
.main-content {
backdrop-filter: blur(60px);
}
</style>
src/pages-sub/convert/index.vue
+25 -10
View File
@@ -8,7 +8,7 @@
</route>
<template>
<view class="min-h-screen pb-100">
<NavBar>
<NavBar :title="title" title-color="#333">
<template #right>
<image
@click="onWithdrawalDetail"
@@ -17,26 +17,32 @@
/>
</template>
</NavBar>
<view class="p-15">
<view
class="m-15 text-white flex rounded-tl-10 rounded-br-10 justify-between items-center p-15 bg-[linear-gradient(90deg,rgba(59,129,243,0.5),#3B81F3)]"
>
<view class="text-14">{{ type === 0 ? '养老金' : '团队佣金' }}余额</view>
<view class="text-17 font-bold">{{ userStore.userInfo.money }}</view>
</view>
<view class="p-15 bg-white shadow-[0_-2px_3px_rgba(10,68,245,0.1)] rounded-10">
<view class="mt-15">
<view class="flex items-center justify-between">
<view class="text-14 text-#333">我的股数</view>
<view class="text-12 text-#999">可转换股数：{{ userStore.userInfo.score }}</view>
</view>
<view
class="flex items-center text-14 mt-15 text-#333 p-16 shadow-[0_0_10px_rgba(10,68,245,0.1)] rounded-10"
>
<input
v-model="convertNum"
type="number"
placeholder="请输入股数"
placeholder="转出金额"
class="text-14 text-#333 flex-1"
/>
<view class="text-12 text-gradient" @click="convertNum = userStore.userInfo.score">
全部
</view>
</view>
<view class="text-12 text-#889BC6 mt-15">马尔代夫股权每股价值500元</view>
<view class="text-14 text-#889BC6 mt-30">提现说明（TIPS）</view>
<view class="text-12 text-#889BC6 mt-15">
<view>1、如遇到系统结算繁忙，转换将会延迟到账</view>
<view class="mt-4">2、提现将会提现至您的工商银行卡;</view>
</view>
</view>
</view>
<view
@@ -47,7 +53,7 @@
class="btn-gradient flex-1 text-center text-white rounded-full text-14 px-30 py-10"
@click="onSubmit"
>
确认转换至余额
确认转换至{{ type === 0 ? '余额' : '养老金' }}
</view>
</view>
</view>
@@ -66,7 +72,7 @@ const convertNum = ref('')
const onWithdrawalDetail = () => {
uni.navigateTo({
url: '/pages-sub/asset/index',
url: `/pages-sub/asset/index?tabIndex=${type.value ? 3 : 2}`,
})
}
@@ -79,6 +85,15 @@ const onSubmit = mergeStep(async () => {
userStore.loadUserInfo()
onWithdrawalDetail()
})
const type = ref(0)
onLoad((options) => {
type.value = Number(options.type ?? 0)
})
const title = computed(() => {
return type.value === 0 ? '养老金转余额' : '团队佣金转养老金'
})
</script>
<style scoped></style>
src/pages-sub/hot-news/index.vue
+45
View File
@@ -0,0 +1,45 @@
<route lang="json5" type="page">
{
style: {
navigationBarTitleText: '热点新闻',
},
}
</route>
<template>
<view class="hot-news-page p-15">
<view class="bg-#fff rounded-10 px-15 py-15" v-if="newsList.length > 0">
<view
class="flex mb-15"
v-for="item in newsList"
:key="item.id"
@click="handleNewsDetail(item.id)"
>
<image class="w-85 h-85 rounded-10" :src="item.image" mode="aspectFill" />
<view class="ml-15 flex-1 flex flex-col justify-between">
<view text-14>{{ item.name }}</view>
<view class="text-12 text-#999">{{ item.source }}</view>
</view>
</view>
</view>
<wd-status-tip v-else image="content" tip="暂无内容" />
</view>
</template>
<script setup lang="ts">
import { getIntroductionAPI } from '@/service'
const { list: newsList } = useListPageRequest((params) =>
getIntroductionAPI({ type: 1, ...params }),
)
const handleNewsDetail = (id: number) => {
uni.navigateTo({
url: `/pages-sub/news-detail/index?id=${id}`,
})
}
</script>
<style scoped>
.hot-news-page {
background: #f7f7f7;
}
</style>
src/pages-sub/lottery/index.vue
+1 -1
View File
@@ -118,7 +118,7 @@ const onEnd = () => {
</view>
</view>
</template>
<style>
<style scoped>
.lottery-item {
&.mask {
&::after {
src/pages-sub/news/index.vue
+49
View File
@@ -0,0 +1,49 @@
<route lang="json5" type="page">
{
style: {
navigationBarTitleText: '最新时讯',
navigationStyle: 'custom',
},
}
</route>
<template>
<view class="news-page">
<NavBar />
<view class="py-15" v-if="newsList.length > 0">
<view
class="bg-white rounded-10 overflow-hidden p-15 mx-15 mb-15"
v-for="item in newsList"
:key="item.id"
@click="handleNewsDetail(item.id)"
>
<image class="rounded-10 w-full h-160" :src="item.image" mode="aspectFill" />
<view class="mt-10 flex-1 flex flex-col justify-between">
<view class="text-14">{{ item.name }}</view>
<view class="text-12 text-#999 mt-10">{{ item.source }}</view>
</view>
</view>
</view>
<wd-status-tip v-else image="content" tip="暂无内容" />
</view>
</template>
<script setup lang="ts">
import NavBar from '@/components/NavBar.vue'
import { getIntroductionAPI } from '@/service'
const { list: newsList } = useListPageRequest((params) =>
getIntroductionAPI({ type: 1, ...params }),
)
const handleNewsDetail = (id: number) => {
uni.navigateTo({
url: `/pages-sub/news-detail/index?id=${id}`,
})
}
</script>
<style scoped>
.news-page {
background: linear-gradient(180deg, #3a90f2 0%, #f7f7f7 100%);
}
</style>
src/pages-sub/official-community/index.vue
+1 -1
View File
@@ -35,7 +35,7 @@ import VueQrcode from '@chenfengyuan/vue-qrcode'
</view>
</template>
<style>
<style scoped>
.official-community-page {
min-height: 100vh;
padding-bottom: 100rpx;
src/pages-sub/realname/index.vue
+14 -3
View File
@@ -54,8 +54,11 @@
mode="aspectFit"
/>
<view class="text-center mt-15 text-14 text-#999">您的实名认证正在审核中，请耐心等待</view>
<button class="btn-gradient px-30 text-white rounded-full m-15 text-16" @click="onBack">
返回
<button
class="btn-gradient px-30 text-white rounded-full m-15 text-16"
@click="userStore.logout"
>
退出登录
</button>
</template>
<template v-else-if="Number(realnameInfo.status) === 2">
@@ -65,7 +68,7 @@
mode="aspectFit"
/>
<view class="text-center mt-15 text-14 text-#999">恭喜您，实名认证成功</view>
<button class="btn-gradient px-30 text-white rounded-full m-15 text-16" @click="onBack">
<button class="btn-gradient px-30 text-white rounded-full m-15 text-16" @click="onGoHome">
返回
</button>
</template>
@@ -93,6 +96,8 @@ import { useUserStore } from '@/store'
import { showModal } from '@/utils'
import { ref } from 'vue'
const userStore = useUserStore()
const form = ref({
realname: '',
cardnum: '',
@@ -114,6 +119,12 @@ const onSubmit = async () => {
})
}
const onGoHome = () => {
uni.reLaunch({
url: '/',
})
}
const realnameInfo = ref(null)
onLoad(async () => {
realnameInfo.value = await getRealNameAuthAPI().then((res) => {
src/pages-sub/withdrawal/index.vue
+14 -30
View File
@@ -8,7 +8,7 @@
</route>
<template>
<view class="min-h-screen pb-100">
<NavBar>
<NavBar title-color="#333">
<template #right>
<image
@click="onWithdrawalDetail"
@@ -17,7 +17,13 @@
/>
</template>
</NavBar>
<view class="p-15">
<view
class="m-15 text-white flex rounded-tl-10 rounded-br-10 justify-between items-center p-15 bg-[linear-gradient(90deg,rgba(59,129,243,0.5),#3B81F3)]"
>
<view class="text-14">钱包余额</view>
<view class="text-17 font-bold">{{ userStore.userInfo.money }}</view>
</view>
<view class="p-15 bg-white shadow-[0_-2px_3px_rgba(10,68,245,0.1)] rounded-10">
<view class="mt-15">
<view class="text-14 text-#333">提现金额</view>
<view
@@ -33,44 +39,22 @@
全部
</view>
</view>
<view class="text-12 text-#889BC6 mt-15">当前余额：{{ userStore.userInfo.money }}</view>
</view>
<view class="mt-50">
<view class="text-14 text-#333">收款方式</view>
<view
class="flex items-center text-14 mt-15 text-#333 p-16 shadow-[0_0_10px_rgba(10,68,245,0.1)] rounded-10"
@click="onSelectPayType"
>
<view class="flex-1">
{{ typeName ? `${typeName}：${currentBank?.banknum}` : '请选择收款方式' }}
</view>
<wd-icon name="arrow-right" size="16px"></wd-icon>
</view>
</view>
<view class="mt-50">
<view class="text-14 text-#333">交易密码</view>
<view class="text-14 mt-15 text-#333 p-16 shadow-[0_0_10px_rgba(10,68,245,0.1)] rounded-10">
<input
v-model="form.tpassword"
type="password"
placeholder="请输入交易密码"
class="text-14 text-#333"
/>
<view class="text-14 text-#889BC6 mt-30">提现说明（TIPS）</view>
<view class="text-12 text-#889BC6 mt-15">
<view>1、如遇到系统结算繁忙，结算将会延迟到账</view>
<view class="mt-4">2、提现将会提现至您的工商银行卡;</view>
</view>
</view>
</view>
<view
class="bg-white fixed bottom-0 left-0 right-0 px-15 py-10 shadow-[0_0_10px_rgba(10,68,245,0.1)]"
>
<view class="flex items-center pb-safe">
<view class="text-gradient flex-1 text-14">到账CNY:{{ form.money ?? '0' }}</view>
<view class="pb-safe">
<view
class="btn-gradient text-center text-white rounded-full text-14 px-30 py-10"
@click="onSubmit"
>
申请提现
提现
</view>
</view>
</view>