first commit
This commit is contained in:
cieanyau committed
commit
db5762abd4
687 files changed
+171307
No files matched your search
@@ -0,0 +1,295 @@
|
||||
<script>
|
||||
import "~/assets/styles/ChartBox.CYP_mhat.css";
|
||||
import "~/assets/styles/HomeConsumeTrend.DfrmEdD9.css";
|
||||
import { toDisplayString } from "vue";
|
||||
import { onMounted } from "vue";
|
||||
import { createBlock } from "vue";
|
||||
import { ref } from "vue";
|
||||
import { withCtx } from "vue";
|
||||
import { computed } from "vue";
|
||||
import { createElementBlock } from "vue";
|
||||
import { createElementVNode } from "vue";
|
||||
import { createTextVNode } from "vue";
|
||||
import { unref } from "vue";
|
||||
import { defineComponent } from "vue";
|
||||
import { createVNode } from "vue";
|
||||
import { openBlock } from "vue";
|
||||
import { NuxtLink } from "#components";
|
||||
import { useApi } from "~/lib/auth.js";
|
||||
import { useAuth } from "~/lib/auth.js";
|
||||
import { t as _plugin_vue_export_helper_t } from "~/lib/_plugin-vue_export-helper.js";
|
||||
import { t as useTheme_t } from "~/lib/useTheme.js";
|
||||
import ChartBox from "~/components/ChartBox.vue";
|
||||
import ListEmpty from "~/components/ListEmpty.vue";
|
||||
import skeleton from "primevue/skeleton";
|
||||
var x = {
|
||||
class: `home-card`,
|
||||
},
|
||||
S = {
|
||||
class: `home-card-head`,
|
||||
},
|
||||
C = {
|
||||
class: `home-mini-stats`,
|
||||
},
|
||||
w = {
|
||||
class: `home-mini-stat`,
|
||||
},
|
||||
T = {
|
||||
class: `home-mini-value`,
|
||||
},
|
||||
E = {
|
||||
class: `home-mini-stat`,
|
||||
},
|
||||
D = {
|
||||
class: `home-mini-value`,
|
||||
},
|
||||
O = {
|
||||
class: `home-mini-stat`,
|
||||
},
|
||||
k = {
|
||||
class: `home-mini-value`,
|
||||
},
|
||||
A = {
|
||||
class: `chart-wrap`,
|
||||
},
|
||||
j = {
|
||||
key: 0,
|
||||
},
|
||||
M = 6,
|
||||
N = Object.assign(
|
||||
_plugin_vue_export_helper_t(
|
||||
defineComponent({
|
||||
__name: `HomeConsumeTrend`,
|
||||
setup(u) {
|
||||
let g = useApi(),
|
||||
N = useAuth(),
|
||||
P = useTheme_t(),
|
||||
F = ref([]),
|
||||
I = ref(!0),
|
||||
L = ref(``);
|
||||
function R(e) {
|
||||
let t = new Date();
|
||||
return Array.from(
|
||||
{
|
||||
length: e,
|
||||
},
|
||||
(n, r) => {
|
||||
let i = new Date(
|
||||
t.getFullYear(),
|
||||
t.getMonth() - (e - 1 - r),
|
||||
1,
|
||||
);
|
||||
return {
|
||||
key: `${i.getFullYear()}-${i.getMonth() + 1}`,
|
||||
label: `${i.getMonth() + 1}月`,
|
||||
};
|
||||
},
|
||||
);
|
||||
}
|
||||
onMounted(async () => {
|
||||
try {
|
||||
let e = await g.get(`/transaction`, {
|
||||
page: 1,
|
||||
limit: 200,
|
||||
}),
|
||||
t = R(M),
|
||||
n = new Map(t.map((e) => [e.key, 0]));
|
||||
for (let t of e.list ?? []) {
|
||||
let e = new Date((t.create_time || 0) * 1e3),
|
||||
r = `${e.getFullYear()}-${e.getMonth() + 1}`;
|
||||
n.has(r) && n.set(r, (n.get(r) ?? 0) + Number(t.amount || 0));
|
||||
}
|
||||
F.value = t.map((e) => ({
|
||||
label: e.label,
|
||||
amount: Math.round((n.get(e.key) ?? 0) * 100) / 100,
|
||||
}));
|
||||
} catch (e) {
|
||||
L.value = e instanceof Error ? e.message : `消费记录加载失败`;
|
||||
} finally {
|
||||
I.value = !1;
|
||||
}
|
||||
});
|
||||
let z = computed(() => (P.isDark.value ? `#618dff` : `#0052d9`)),
|
||||
B = computed(() => ({
|
||||
grid: {
|
||||
left: 4,
|
||||
right: 8,
|
||||
top: 16,
|
||||
bottom: 0,
|
||||
outerBoundsMode: `same`,
|
||||
outerBoundsContain: `axisLabel`,
|
||||
},
|
||||
tooltip: {
|
||||
trigger: `axis`,
|
||||
valueFormatter: (e) => `¥${Number(e ?? 0).toFixed(2)}`,
|
||||
},
|
||||
xAxis: {
|
||||
type: `category`,
|
||||
boundaryGap: !1,
|
||||
data: F.value.map((e) => e.label),
|
||||
},
|
||||
yAxis: {
|
||||
type: `value`,
|
||||
axisLabel: {
|
||||
formatter: `¥{value}`,
|
||||
},
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: `line`,
|
||||
smooth: !0,
|
||||
symbol: `circle`,
|
||||
symbolSize: 6,
|
||||
data: F.value.map((e) => e.amount),
|
||||
itemStyle: {
|
||||
color: z.value,
|
||||
},
|
||||
lineStyle: {
|
||||
color: z.value,
|
||||
width: 2,
|
||||
},
|
||||
areaStyle: {
|
||||
color: z.value,
|
||||
opacity: 0.1,
|
||||
},
|
||||
},
|
||||
],
|
||||
}));
|
||||
return (t, r) => {
|
||||
let a = NuxtLink,
|
||||
u = skeleton,
|
||||
m = ListEmpty,
|
||||
h = ChartBox;
|
||||
return (
|
||||
openBlock(),
|
||||
createElementBlock(`div`, x, [
|
||||
createElementVNode(`div`, S, [
|
||||
(r[1] ||= createElementVNode(
|
||||
`div`,
|
||||
{
|
||||
class: `home-card-title`,
|
||||
},
|
||||
[
|
||||
createElementVNode(`i`, {
|
||||
class: `pi pi-chart-line`,
|
||||
}),
|
||||
createTextVNode(`消费趋势`),
|
||||
],
|
||||
-1,
|
||||
)),
|
||||
createVNode(
|
||||
a,
|
||||
{
|
||||
to: `/finance`,
|
||||
class: `home-card-more`,
|
||||
},
|
||||
{
|
||||
default: withCtx(() => [
|
||||
...(r[0] ||= [createTextVNode(`消费记录 ›`, -1)]),
|
||||
]),
|
||||
_: 1,
|
||||
},
|
||||
),
|
||||
]),
|
||||
createElementVNode(`div`, C, [
|
||||
createElementVNode(`div`, w, [
|
||||
(r[2] ||= createElementVNode(
|
||||
`span`,
|
||||
{
|
||||
class: `home-mini-label`,
|
||||
},
|
||||
`本月消费`,
|
||||
-1,
|
||||
)),
|
||||
createElementVNode(
|
||||
`span`,
|
||||
T,
|
||||
`¥` +
|
||||
toDisplayString(
|
||||
unref(N).overview?.this_month_consume ?? `--`,
|
||||
),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
createElementVNode(`div`, E, [
|
||||
(r[3] ||= createElementVNode(
|
||||
`span`,
|
||||
{
|
||||
class: `home-mini-label`,
|
||||
},
|
||||
`累计消费`,
|
||||
-1,
|
||||
)),
|
||||
createElementVNode(
|
||||
`span`,
|
||||
D,
|
||||
`¥` + toDisplayString(unref(N).overview?.consume ?? `--`),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
createElementVNode(`div`, O, [
|
||||
(r[4] ||= createElementVNode(
|
||||
`span`,
|
||||
{
|
||||
class: `home-mini-label`,
|
||||
},
|
||||
`未付订单`,
|
||||
-1,
|
||||
)),
|
||||
createElementVNode(
|
||||
`span`,
|
||||
k,
|
||||
toDisplayString(unref(N).overview?.unpaid_order ?? `--`),
|
||||
1,
|
||||
),
|
||||
]),
|
||||
]),
|
||||
createElementVNode(`div`, A, [
|
||||
unref(I)
|
||||
? (openBlock(),
|
||||
createElementBlock(`div`, j, [
|
||||
createVNode(u, {
|
||||
height: `150px`,
|
||||
}),
|
||||
]))
|
||||
: unref(L)
|
||||
? (openBlock(),
|
||||
createBlock(
|
||||
m,
|
||||
{
|
||||
key: 1,
|
||||
icon: `pi pi-exclamation-circle`,
|
||||
title: `消费趋势加载失败`,
|
||||
description: unref(L),
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`description`],
|
||||
))
|
||||
: (openBlock(),
|
||||
createBlock(
|
||||
h,
|
||||
{
|
||||
key: 2,
|
||||
option: unref(B),
|
||||
height: 150,
|
||||
},
|
||||
null,
|
||||
8,
|
||||
[`option`],
|
||||
)),
|
||||
]),
|
||||
])
|
||||
);
|
||||
};
|
||||
},
|
||||
}),
|
||||
[[`__scopeId`, `data-v-90c11ad2`]],
|
||||
),
|
||||
{
|
||||
__name: `HomeConsumeTrend`,
|
||||
},
|
||||
);
|
||||
export {};
|
||||
export default N;
|
||||
</script>
|
||||
Reference in new issue
Block a user