|  | @@ -10,7 +10,9 @@
 | 
	
		
			
				|  |  |        <view class="text-[rgb(0,0,0,0.3)] mt20rpx"
 | 
	
		
			
				|  |  |          >用户购买商品后,增加待结算,退款后,减少待结算。</view
 | 
	
		
			
				|  |  |        >
 | 
	
		
			
				|  |  | -      <view class="mt20rpx text-48rpx font-semibold">32,124.19</view>
 | 
	
		
			
				|  |  | +      <view class="mt20rpx text-48rpx font-semibold">{{
 | 
	
		
			
				|  |  | +        statisticsInfo?.toBeSettled
 | 
	
		
			
				|  |  | +      }}</view>
 | 
	
		
			
				|  |  |      </view>
 | 
	
		
			
				|  |  |      <view class="px24rpx py28rpx bg-#F6F6F6 rounded-32rpx mt20rpx">
 | 
	
		
			
				|  |  |        <view class="flex items-center">
 | 
	
	
		
			
				|  | @@ -19,7 +21,9 @@
 | 
	
		
			
				|  |  |        <view class="text-[rgb(0,0,0,0.3)] mt20rpx"
 | 
	
		
			
				|  |  |          >商品进行分账成功后,增加可用余额。</view
 | 
	
		
			
				|  |  |        >
 | 
	
		
			
				|  |  | -      <view class="mt20rpx text-48rpx font-semibold">32,124.19</view>
 | 
	
		
			
				|  |  | +      <view class="mt20rpx text-48rpx font-semibold">{{
 | 
	
		
			
				|  |  | +        statisticsInfo?.available
 | 
	
		
			
				|  |  | +      }}</view>
 | 
	
		
			
				|  |  |      </view>
 | 
	
		
			
				|  |  |      <view class="px24rpx py28rpx bg-#F6F6F6 rounded-32rpx mt20rpx">
 | 
	
		
			
				|  |  |        <view class="flex items-center">
 | 
	
	
		
			
				|  | @@ -28,12 +32,125 @@
 | 
	
		
			
				|  |  |        <view class="text-[rgb(0,0,0,0.3)] mt20rpx"
 | 
	
		
			
				|  |  |          >分账成功后,T+1到账后,增加已到账。</view
 | 
	
		
			
				|  |  |        >
 | 
	
		
			
				|  |  | -      <view class="mt20rpx text-48rpx font-semibold">32,124.19</view>
 | 
	
		
			
				|  |  | +      <view class="mt20rpx text-48rpx font-semibold">{{
 | 
	
		
			
				|  |  | +        statisticsInfo?.received
 | 
	
		
			
				|  |  | +      }}</view>
 | 
	
		
			
				|  |  |      </view>
 | 
	
		
			
				|  |  | +    <template v-for="item in listData" :key="item.date">
 | 
	
		
			
				|  |  | +      <view
 | 
	
		
			
				|  |  | +        class="px24rpx py28rpx bg-#F6F6F6 rounded-32rpx mt20rpx flex items-center justify-between"
 | 
	
		
			
				|  |  | +      >
 | 
	
		
			
				|  |  | +        <view>
 | 
	
		
			
				|  |  | +          {{ dayjs(item.date).format("MM-DD") }}
 | 
	
		
			
				|  |  | +        </view>
 | 
	
		
			
				|  |  | +        <view class="flex items-center">
 | 
	
		
			
				|  |  | +          <view class="mr40rpx flex items-center">
 | 
	
		
			
				|  |  | +            <image :src="chu" class="w-40rpx h40rpx" />
 | 
	
		
			
				|  |  | +            <view class="ml16rpx">
 | 
	
		
			
				|  |  | +              {{ handleChu(item.child, "支出").toFixed(2) }}
 | 
	
		
			
				|  |  | +            </view>
 | 
	
		
			
				|  |  | +          </view>
 | 
	
		
			
				|  |  | +          <view class="flex items-center">
 | 
	
		
			
				|  |  | +            <image :src="ru" class="w-40rpx h40rpx" />
 | 
	
		
			
				|  |  | +            <view class="ml16rpx">
 | 
	
		
			
				|  |  | +              {{ handleChu(item.child, "收入").toFixed(2) }}
 | 
	
		
			
				|  |  | +            </view>
 | 
	
		
			
				|  |  | +          </view>
 | 
	
		
			
				|  |  | +        </view>
 | 
	
		
			
				|  |  | +      </view>
 | 
	
		
			
				|  |  | +      <view
 | 
	
		
			
				|  |  | +        class="flex items-center mt32rpx"
 | 
	
		
			
				|  |  | +        v-for="its in item.child"
 | 
	
		
			
				|  |  | +        :key="its.id"
 | 
	
		
			
				|  |  | +      >
 | 
	
		
			
				|  |  | +        <view class="w80rpx h80rpx min-w-80rpx">
 | 
	
		
			
				|  |  | +          <image
 | 
	
		
			
				|  |  | +            :src="its.income_expense_type == '支出' ? chu : ru"
 | 
	
		
			
				|  |  | +            class="w-full h-full"
 | 
	
		
			
				|  |  | +          />
 | 
	
		
			
				|  |  | +        </view>
 | 
	
		
			
				|  |  | +        <view class="ml28rpx flex items-center justify-between flex-1">
 | 
	
		
			
				|  |  | +          <view>
 | 
	
		
			
				|  |  | +            <view class="font-semibold text-32rpx">
 | 
	
		
			
				|  |  | +              {{ its.amount_type }}
 | 
	
		
			
				|  |  | +            </view>
 | 
	
		
			
				|  |  | +            <view class="flex items-center text-24rpx text-gray">
 | 
	
		
			
				|  |  | +              <view class="">
 | 
	
		
			
				|  |  | +                {{ dayjs(its.create_time).format("HH:mm") }}
 | 
	
		
			
				|  |  | +              </view>
 | 
	
		
			
				|  |  | +              <view class="mx-10rpx">|</view>
 | 
	
		
			
				|  |  | +              <view>{{ its.change_reason }} </view>
 | 
	
		
			
				|  |  | +            </view>
 | 
	
		
			
				|  |  | +          </view>
 | 
	
		
			
				|  |  | +          <view class="text-32rpx">
 | 
	
		
			
				|  |  | +            {{ its.income_expense_type == "支出" ? "-" : "+" }}¥{{
 | 
	
		
			
				|  |  | +              its.change_amount.toFixed(2)
 | 
	
		
			
				|  |  | +            }}
 | 
	
		
			
				|  |  | +          </view>
 | 
	
		
			
				|  |  | +        </view>
 | 
	
		
			
				|  |  | +      </view>
 | 
	
		
			
				|  |  | +    </template>
 | 
	
		
			
				|  |  |    </view>
 | 
	
		
			
				|  |  |  </template>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -<script setup lang="ts"></script>
 | 
	
		
			
				|  |  | +<script setup lang="ts">
 | 
	
		
			
				|  |  | +import type { money, moneyList } from "@/api/globals";
 | 
	
		
			
				|  |  | +import chu from "@/subPack/static/chu.png";
 | 
	
		
			
				|  |  | +import ru from "@/subPack/static/ru.png";
 | 
	
		
			
				|  |  | +import dayjs from "dayjs";
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +const statisticsInfo = ref<money>();
 | 
	
		
			
				|  |  | +async function getData() {
 | 
	
		
			
				|  |  | +  const res = await Apis.sys.statisticsInfo({});
 | 
	
		
			
				|  |  | +  statisticsInfo.value = res[0];
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +const {
 | 
	
		
			
				|  |  | +  data: list,
 | 
	
		
			
				|  |  | +  page,
 | 
	
		
			
				|  |  | +  isLastPage,
 | 
	
		
			
				|  |  | +} = usePagination(
 | 
	
		
			
				|  |  | +  (pageNo, pageSize) =>
 | 
	
		
			
				|  |  | +    Apis.sys.selectFundChanges({ data: { pageNo, pageSize } }),
 | 
	
		
			
				|  |  | +  { append: true },
 | 
	
		
			
				|  |  | +);
 | 
	
		
			
				|  |  | +getData();
 | 
	
		
			
				|  |  | +const listData = computed(() => {
 | 
	
		
			
				|  |  | +  return groupDataByDate(list.value as moneyList[]);
 | 
	
		
			
				|  |  | +});
 | 
	
		
			
				|  |  | +function groupDataByDate(
 | 
	
		
			
				|  |  | +  dataArray: moneyList[],
 | 
	
		
			
				|  |  | +): { date: string; child: moneyList[] }[] {
 | 
	
		
			
				|  |  | +  const grouped: Record<string, { date: string; child: moneyList[] }> = {};
 | 
	
		
			
				|  |  | +  dataArray.forEach((item) => {
 | 
	
		
			
				|  |  | +    const dateKey = dayjs(item.create_time).format("YYYY-MM-DD");
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    // 如果该日期还不存在,初始化分组
 | 
	
		
			
				|  |  | +    if (!grouped[dateKey]) {
 | 
	
		
			
				|  |  | +      grouped[dateKey] = {
 | 
	
		
			
				|  |  | +        date: dateKey,
 | 
	
		
			
				|  |  | +        child: [],
 | 
	
		
			
				|  |  | +      };
 | 
	
		
			
				|  |  | +    }
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +    grouped[dateKey].child.push(item);
 | 
	
		
			
				|  |  | +  });
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +  return Object.values(grouped).sort(
 | 
	
		
			
				|  |  | +    (a: any, b: any) => dayjs(b.date).valueOf() - dayjs(a.date).valueOf(),
 | 
	
		
			
				|  |  | +  );
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +function handleChu(item: moneyList[], type: string) {
 | 
	
		
			
				|  |  | +  return item
 | 
	
		
			
				|  |  | +    .filter((it) => it.income_expense_type == type)
 | 
	
		
			
				|  |  | +    .reduce((sum, it) => sum + (it.change_amount || 0), 0);
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +onReachBottom(() => {
 | 
	
		
			
				|  |  | +  if (!isLastPage.value) {
 | 
	
		
			
				|  |  | +    page.value++;
 | 
	
		
			
				|  |  | +  }
 | 
	
		
			
				|  |  | +});
 | 
	
		
			
				|  |  | +</script>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  <style lang="scss">
 | 
	
		
			
				|  |  |  .page-wraper {
 |