root/xl-mobile
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
多啦C梦
2025-04-21 15:19:28 +08:00
parent 90271467eb
commit ef99f9377c
14 changed files with 392 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
src/pages/incomeLog/index.vue
View File

@@ -1,11 +1,128 @@
<script setup>
import {reactive, ref} from 'vue';
import XNav from "../../components/XNav.vue";
import SETTING from "../../static/icons/setting.png";
import useTableQuery from "../../hooks/useTableQuery.js";
import Api from "../../api/index.js";
import dropDown from "../../static/icons/drop-down.svg";
import XDateTime from "../../components/XDateTime.vue";
import XTag from "../../components/XTag.vue";
import dayjs from "dayjs";
import XConfirmModal from "../../components/XConfirmModal.vue";
const showModal = ref(false);
const po = reactive({
type: 0,
datetime: dayjs().format("YYYY-MM"),
});
const vo = reactive({
page: '',
rows: [],
total: 0,
});
const {loading, pagination, initFetchData} = useTableQuery({
api: Api.system.getData,
parameter: po,
watchParameter: true,
callback: (data) => {
vo.page = data.page;
vo.total = data.total;
if (data.current === 1) {
vo.rows.length = 0;
}
vo.rows = [...vo.rows, ...data.rows];
}
});
</script>
<template>
<!--收益记录-->
<x-nav></x-nav>
<view class="!flex justify-around bg-[#fff] h-[100rpx]">
<view :class="['top-filter transition-[500ms] !flex items-center', po.type === 0 ? 'top-filter-cur' : '']"
@click="po.type=0">
个人收益
</view>
<view :class="['top-filter transition-[500ms] !flex items-center', po.type === 1 ? 'top-filter-cur' : '']"
@click="po.type=1">
团队收益
</view>
<view>
<view class="top-filter transition-[500ms] !flex items-center gap-[20rpx] h-full" @click="showModal=true">
<image class="!w-[22rpx] !h-[22rpx]" :src="SETTING"></image>
活动收益
</view>
<x-confirm-modal
width="500rpx"
title="拉新奖励"
info="邀请新用户并完成首个任务，可以获得拉新奖励"
:cancel="false"
confirmText="知道了"
v-model:show="showModal">
</x-confirm-modal>
</view>
</view>
<scroll-view
scroll-y
@refresherpulling="initFetchData()"
@scrolltolower="pagination.current++"
class="h-[calc(100vh-200rpx)]">
<view class="!flex flex-col gap-[20rpx] p-[20rpx]">
<view class="bg-[var(--primary-color)] p-[32rpx] rounded-[12rpx] !flex items-center">
<view class="!flex-grow text-[#fff]">
<view class="test-36r font-bold">246.23</view>
<view class="test-24r">该月收益</view>
</view>
<view class="!flex-grow text-[#fff]">
<view class="test-36r font-bold">246.23</view>
<view class="test-24r">累计收益</view>
</view>
<view class="flex-shrink-0">
<x-date-time v-model:model-value="po.datetime" fields="month">
<view
class="rounded-full bg-[#E8F3FF] text-[var(--primary-color)] px-[32rpx] py-[8rpx] !flex items-center gap-[14rpx]">
{{ po.datetime }}
<image class="!w-[18rpx]" mode="widthFix" :src="dropDown"></image>
</view>
</x-date-time>
</view>
</view>
<view v-for="item in vo.rows">
<view class="p-[20rpx] rounded-[12rpx] bg-[#fff] !flex justify-between items-center">
<view class="!flex flex-col gap-[24rpx]">
<view class="!flex items-center gap-[16rpx]">
<view>提现退回</view>
<x-tag type="success">收入</x-tag>
</view>
<view class="text-[#86909C] test-24r">{{ dayjs().format('YYYY-MM-DD HH:mm:ss') }}</view>
</view>
<view class="test-36r font-bold HarmonyOS">
+95.88
</view>
</view>
</view>
<tui-loadmore v-if="loading" text="加载中..."></tui-loadmore>
</view>
</scroll-view>
</template>
<style scoped>
<style lang="scss" scoped>
.top-filter-cur {
color: var(--primary-color);
position: relative;
&::after {
content: '';
display: block;
height: 4rpx;
background-color: var(--primary-color);
width: 100%;
position: absolute;
bottom: 0;
}
}
</style>

4
src/pages/user/index.vue
View File

@@ -87,11 +87,11 @@ const tabs = [
</view>
<view class="px-[34rpx] py-[20rpx] !flex justify-between">
<view class="!flex items-center gap-[12rpx]">
<view class="!flex items-center gap-[12rpx]" @click="toPage('/pages/withdrawalLog/index')">
<image class="!size-[40rpx]" mode="aspectFill" :src="ICON1"></image>
<view class="test-24r">提现记录</view>
</view>
<view class="!flex items-center gap-[12rpx]">
<view class="!flex items-center gap-[12rpx]" @click="toPage('/pages/changeLog/index')">
<image class="!size-[40rpx]" mode="aspectFill" :src="ICON2"></image>
<view class="test-24r">变动记录</view>
</view>

6
src/pages/wallet/index.vue
View File

@@ -68,21 +68,21 @@ const withdrawal = async () => {
</view>
<view class="w-full bg-[#fff] rounded-[16rpx] overflow-hidden">
<view class="!flex items-center h-[108rpx] px-[32rpx]" @click="toPage('/pages/changeLog/index')">
<view class="!flex items-center h-[108rpx] px-[32rpx]" @click="toPage('/pages/walletLog/index')">
<view class="title">变动记录</view>
<view class="!ml-auto whitespace-nowrap value"></view>
<image class="!w-[16rpx] !ml-[16rpx]" mode="widthFix" :src="Right"></image>
</view>
<view class="h-[2rpx] w-full bg-[rgb(229,230,235)] !ml-[32rpx]"></view>
<view class="!flex items-center h-[108rpx] px-[32rpx]">
<view class="!flex items-center h-[108rpx] px-[32rpx]" @click="toPage('/pages/withdrawalLog/index')">
<view class="title">提现记录</view>
<view class="!ml-auto whitespace-nowrap value"></view>
<image class="!w-[16rpx] !ml-[16rpx]" mode="widthFix" :src="Right"></image>
</view>
<view class="h-[2rpx] w-full bg-[rgb(229,230,235)] !ml-[32rpx]"></view>
<view class="!flex items-center h-[108rpx] px-[32rpx]">
<view class="!flex items-center h-[108rpx] px-[32rpx]" @click="toPage('/pages/incomeLog/index')">
<view class="title">收益记录</view>
<view class="!ml-auto whitespace-nowrap value"></view>
<image class="!w-[16rpx] !ml-[16rpx]" mode="widthFix" :src="Right"></image>

98
src/pages/walletLog/index.vue
View File

@@ -1,7 +1,103 @@
<script setup></script>
<script setup>
import XNav from "../../components/XNav.vue";
import filer from "../../static/icons/filer-balck.png";
import {reactive, ref} from "vue";
import XFilter from "../../components/XFilter.vue";
import XRadioGroup from "../../components/XRadioGroup.vue";
import XFilterItem from "../../components/XFilterItem.vue";
import XRadio from "../../components/XRadio.vue";
import XDateTime from "../../components/XDateTime.vue";
import dayjs from "dayjs";
import XTag from "../../components/XTag.vue";
import useTableQuery from "../../hooks/useTableQuery.js";
import Api from "../../api/index.js";
const showFilter = ref(false);
const sumPo = reactive({
type: 0,
datetime: dayjs().format('YYYY-MM'),
});
const vo = reactive({
page: '',
rows: [],
total: 0,
});
const {loading, pagination, initFetchData} = useTableQuery({
api: Api.system.getData,
parameter: sumPo,
watchParameter: true,
callback: (data) => {
vo.page = data.page;
vo.total = data.total;
if (data.current === 1) {
vo.rows.length = 0;
}
vo.rows = [...vo.rows, ...data.rows];
}
});
</script>
<template>
<!--变动记录-->
<x-nav></x-nav>
<x-filter
v-model:model="sumPo"
v-model:visible="showFilter">
<x-filter-item label="账单类型">
<x-radio-group v-model:model-value="sumPo.type">
<view class="!grid grid-cols-3 gap-[24rpx]">
<x-radio :value="0">全部</x-radio>
<x-radio :value="1">收入</x-radio>
<x-radio :value="2">支出</x-radio>
</view>
</x-radio-group>
</x-filter-item>
<x-filter-item label="时间选择">
<x-radio-group v-model:model-value="sumPo.type">
<view class="!grid grid-cols-3 gap-[24rpx]">
<x-date-time v-model:model-value="sumPo.datetime" fields="month"></x-date-time>
</view>
</x-radio-group>
</x-filter-item>
</x-filter>
<view class="py-[28rpx] !flex justify-evenly bg-[#fff] h-[100rpx]">
<view class="top-filter top-filter-cur text-[var(--primary-color)]">{{
['全部', '收入', '支出'][sumPo.type]
}}
</view>
<view class="w-[4rpx] bg-[#E5E6EB]"></view>
<view class="top-filter top-filter-cur text-[var(--primary-color)]">{{ sumPo.datetime }}</view>
<view class="w-[4rpx] bg-[#E5E6EB]"></view>
<view class="top-filter" @click="showFilter=true">
<image class="!w-[22rpx] !h-[22rpx]" :src="filer"></image>
筛选
</view>
</view>
<scroll-view
@refresherpulling="initFetchData()"
@scrolltolower="pagination.current++"
scroll-y
class="h-[calc(100vh-200rpx)]">
<view class="p-[20rpx]" v-for="item in vo.rows">
<view class="p-[20rpx] rounded-[12rpx] bg-[#fff] !flex justify-between items-center">
<view class="!flex flex-col gap-[24rpx]">
<view class="!flex items-center gap-[16rpx]">
<view>提现退回</view>
<x-tag type="success">收入</x-tag>
</view>
<view class="text-[#86909C] test-24r">{{ dayjs().format('YYYY-MM-DD HH:mm:ss') }}</view>
</view>
<view class="test-36r font-bold HarmonyOS">
+95.88
</view>
</view>
</view>
<tui-loadmore v-if="loading" text="加载中..."></tui-loadmore>
</scroll-view>
</template>
<style scoped>

91
src/pages/withdrawalLog/index.vue
View File

@@ -1,11 +1,98 @@
<script setup>
import ZFBICON from '../../static/icons/ZFBICON.png';
import dropDown from '../../static/icons/drop-down.svg';
import XNav from "../../components/XNav.vue";
import XTag from "../../components/XTag.vue";
import useTableQuery from "../../hooks/useTableQuery.js";
import Api from "../../api/index.js";
import {reactive} from "vue";
import XDateTime from "../../components/XDateTime.vue";
import dayjs from "dayjs";
const po = reactive({
datetime: dayjs().format('YYYY-MM'),
});
const vo = reactive({
page: '',
rows: [],
total: 0,
});
const {loading, pagination, initFetchData} = useTableQuery({
api: Api.system.getData,
watchParameter: true,
parameter: po,
callback: (data) => {
if (data.current === 1) {
vo.rows.length = 0;
}
vo.page = data.page;
vo.total = data.total;
vo.rows = [...vo.rows, ...data.rows];
}
});
</script>
<template>
<!--提现记录-->
<x-nav></x-nav>
<scroll-view
scroll-y
@refresherpulling="initFetchData()"
@scrolltolower="pagination.current++"
class="p-[20rpx] h-[calc(100vh-100rpx)]">
<view class="!flex flex-col gap-[20rpx]">
<view class="bg-[var(--primary-color)] p-[32rpx] rounded-[12rpx] !flex items-center">
<view class="!flex-grow text-[#fff]">
<view class="test-36r font-bold">246.23</view>
<view class="test-24r">该月提现收益</view>
</view>
<view class="!flex-grow text-[#fff]">
<view class="test-36r font-bold">246.23</view>
<view class="test-24r">该月提现收益</view>
</view>
<view class="flex-shrink-0">
<x-date-time v-model:model-value="po.datetime" fields="month">
<view
class="rounded-full bg-[#E8F3FF] text-[var(--primary-color)] px-[32rpx] py-[8rpx] !flex items-center gap-[14rpx]">
{{ po.datetime }}
<image class="!w-[18rpx]" mode="widthFix" :src="dropDown"></image>
</view>
</x-date-time>
</view>
</view>
<view class="p-[20rpx] bg-[#fff] rounded-[8rpx] card" v-for="v in vo.rows">
<view class="!flex">
<image class="!size-[80rpx]" mode="aspectFill" :src="ZFBICON"></image>
<view class="!ml-[60rpx] !flex gap-[60rpx]">
<view>
<view class="test-32r font-bold">100.00</view>
<view class="text-[#86909C] test-24r">提现金额</view>
</view>
<view>
<view class="test-32r font-bold">94.00</view>
<view class="text-[#86909C] test-24r">到账金额</view>
</view>
</view>
<view class="!ml-auto">
<x-tag>正在提现</x-tag>
</view>
</view>
<view
class="!mt-[20rpx] py-[10rpx] px-[20rpx] test-24r !flex justify-between items-center bg-[#F2F3F5] rounded-[8rpx]">
<view>提现时间：2024-08-06 12:22</view>
<view>手续费：6%</view>
</view>
</view>
<tui-loadmore v-if="loading" text="加载中..."></tui-loadmore>
</view>
</scroll-view>
</template>
<style scoped>
<style lang="scss" scoped>
.card {
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.1);
}
</style>