36 lines
1.7 KiB
Vue
36 lines
1.7 KiB
Vue
<script setup>
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div className="stats w-full h-[48%] p-2 mb-4 bg-slate-900 rounded-lg border border-cyan-200/20 shadow-md shadow-cyan-500/20">
|
|
<!-- 電壓資訊 -->
|
|
<div className="stat place-items-start">
|
|
<div className="stat-title text-gray-200 3xl:text-[2rem]">今年電費總計 (元)</div>
|
|
<div className="stat-value text-success text-5xl 3xl:text-[6rem]">516,519</div>
|
|
<div className="stat-desc text-gray-400 3xl:text-[2rem]">2024-01-01 ~ 2024-08-08</div>
|
|
</div>
|
|
<div className="stat place-items-start">
|
|
<div className="stat-title text-gray-200 3xl:text-[2rem]">區間電費總計 (元)</div>
|
|
<div className="stat-value text-success text-5xl 3xl:text-[6rem]">22,432</div>
|
|
<div className="stat-desc text-gray-400 3xl:text-[2rem]">2024-07-01 ~ 2024-07-31</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="stats w-full h-[48%] p-2 mb-4 bg-slate-900 rounded-lg border border-cyan-200/20 shadow-md shadow-cyan-500/20">
|
|
<!-- 電流資訊 -->
|
|
<div className="stat place-items-start">
|
|
<div className="stat-title text-gray-200 3xl:text-[2rem]">今年用電度數 (kWh)</div>
|
|
<div className="stat-value text-success text-5xl 3xl:text-[6rem]">172,173</div>
|
|
<div className="stat-desc text-gray-400 3xl:text-[2rem]">2024-01-01 ~ 2024-08-08</div>
|
|
</div>
|
|
<div className="stat place-items-start">
|
|
<div className="stat-title text-gray-200 3xl:text-[2rem]">區間用電度數 (kWh)</div>
|
|
<div className="stat-value text-success text-5xl 3xl:text-[6rem]">7,477</div>
|
|
<div className="stat-desc text-gray-400 3xl:text-[2rem]">2024-07-01 ~ 2024-07-31</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style lang="scss" scoped></style>
|