This commit is contained in:
lb
2024-01-02 14:33:21 +08:00
parent 4b043214ca
commit a32e6fb591
14 changed files with 261 additions and 86 deletions

View File

@@ -64,7 +64,22 @@ const EnergyCostChart = (props) => {
</div>
<div className="flex-1" style={{ marginTop: "8px" }}>
<ReactECharts option={options} style={{ height: "180px" }} />
{options && (
<ReactECharts option={options} style={{ height: "180px" }} />
)}
{!options && (
<p
style={{
color: "#cccf",
fontSize: "20px",
userSelect: "none",
textAlign: "center",
paddingTop: "32px",
}}
>
暂无数据
</p>
)}
</div>
</div>
);
@@ -73,6 +88,7 @@ const EnergyCostChart = (props) => {
export default EnergyCostChart;
function getOptions(period, source, trend) {
if (trend[period].length == 0) return null;
return {
color: ["#FFD160", "#12FFF5", "#2760FF"],
grid: { top: 32, right: 12, bottom: 56, left: 48 },

View File

@@ -13,32 +13,35 @@ function EnergyCost(props) {
<div className={`${cls.cost__info} flex`}>
<div
className={`${cls.info__item} flex flex-col justify-center items-center`}
style={{ width: "112px", padding: 0 }}
>
<span style={{ fontSize: "22px" }}> </span>
<span>{energyInfo?.elecQty1 || 0}kWh</span>
<span style={{ fontSize: "20px", letterSpacing: '2px', lineHeight: 1.5 }}>热发</span>
<span style={{ fontSize: "20px", color: "#3ce8ff", lineHeight: 1.5 }}>
{energyInfo?.elecQty1 || 0}kWh
</span>
</div>
<div className={cls.info__item_groups}>
<div className={cls.info__item}>
<i style={{ fontSize: "18px", fontStyle: "normal" }}>水耗量</i>:
<span style={{ fontSize: "12px" }}>
<i style={{ fontSize: "18px", fontStyle: "normal", paddingRight: '6px' }}>水耗量</i>
<span style={{ fontSize: "17px", color: "#3ce8ff" }}>
{energyInfo?.waterQty || 0}Km³
</span>
</div>
<div className={cls.info__item}>
<i style={{ fontSize: "18px", fontStyle: "normal" }}>天然气I</i>:
<span style={{ fontSize: "12px" }}>
<i style={{ fontSize: "18px", fontStyle: "normal", paddingRight: '6px' }}>天然气I</i>
<span style={{ fontSize: "17px", color: "#3ce8ff" }}>
{energyInfo?.ngQty1 || 0}
</span>
</div>
<div className={cls.info__item}>
<i style={{ fontSize: "18px", fontStyle: "normal" }}>电耗量</i>:
<span style={{ fontSize: "12px" }}>
<i style={{ fontSize: "18px", fontStyle: "normal", paddingRight: '6px' }}>电耗量</i>
<span style={{ fontSize: "17px", color: "#3ce8ff" }}>
{energyInfo?.elecQty2 || 0}kWh
</span>
</div>
<div className={cls.info__item}>
<i style={{ fontSize: "18px", fontStyle: "normal" }}>天然气II</i>:
<span style={{ fontSize: "12px" }}>
<i style={{ fontSize: "18px", fontStyle: "normal", paddingRight: '6px' }}>天然气II</i>
<span style={{ fontSize: "17px", color: "#3ce8ff" }}>
{energyInfo?.ngQty2 || 0}
</span>
</div>

View File

@@ -18,12 +18,13 @@
border-radius: 2px;
color: hsl(0, 0%, 100%, 0.9);
box-shadow: inset 0 0 17px 0px hsla(0, 0%, 100%, 0.15);
width: 190px;
// min-width: 190px;
// height: 43px;
font-size: 14px;
letter-spacing: 1.43px;
// letter-spacing: 1.43px;
line-height: 40px;
text-align: center;
padding-left: 12px;
// text-align: center;
user-select: none;
}