<script setup lang="ts">
import { useRequest } from "vue-request";
import { myRequest } from "@/requests/request.ts";
import { userinfo } from "@/store/store.ts";
import { useRoute } from "vue-router";
import BillComponent from "@/pages/account-bill/bill-component.vue";
import router from "@/router/router.ts";
import YlActionDiv from "@/components/yl-action-div.vue";

const route = useRoute();

const { data, loading } = useRequest<{ data?: accountBillData[] }>(
  () =>
    myRequest(
      `/api/yeb_log/detail?start=${(route.params.date as string).split("~")[0]}&end=${(route.params.date as string).split("~")[1]}`,
      userinfo.token,
    ),
  {
    refreshDeps: [() => userinfo.token],
    ready: () => Boolean(userinfo.token),
  },
);
</script>

<template>
  <yl-action-div>
    <el-button link @click="router.push('/bill')">返回月视图</el-button>
  </yl-action-div>
  <BillComponent :loading="loading" :data="data?.data" />
</template>

<style scoped></style>
