Skip to content

Commit

Permalink
refactor: move ai call into file
Browse files Browse the repository at this point in the history
  • Loading branch information
LeleDallas committed May 11, 2023
1 parent f11bacc commit c4777aa
Show file tree
Hide file tree
Showing 2 changed files with 182 additions and 101 deletions.
132 changes: 34 additions & 98 deletions src/Vendor/Dashboard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,9 @@ import CarouselKpi from "./DashboardCards/CarouselKpi";
import ConsumeCard from "./DashboardCards/ConsumeCard";
import CustomerModal from "./CustomerModal";
import { useAppSelector } from "../hooks";
import { CarouselWrapper, renderCarouselCard } from "./utils";
import { CarouselWrapper, getBillsAggregated, getBillsByOrganizationIdAggregated, renderCarouselCard } from "./utils";
import { UserProps } from "../types";
import IconFont from "../Iconfont";


const Dashboard = () => {
Expand Down Expand Up @@ -35,116 +36,50 @@ const Dashboard = () => {
const [users, setUsers] = useState<Array<UserProps>>([])

const getKpi = async (id: any) => {
let kWh = 0
let gas = 0
let water = 0
const tmpCost: any = {}

try {
await api.bills.getBillsAggregated(id).then(res => {
if (organization?.type?.includes("Electric")) {
organization.details.electric.forEach((el: any) => {
if (el.name === "Electricity Cost at kWh")
kWh += res.totalElectric * 0.0833333 / 1000 * el.price
if (el.name === "Electricity Supplier Cost" || el.name === "Electricity Delivery Cost") {
kWh += el.price
tmpCost[el.name] = el.price
}
if (el.name === "Electricity Tax Percentage")
kWh += (res.totalElectric * el.price / 100)
});
setkWh((old) => old + res.totalElectric)
setkWhCost((old) => old + Number(kWh))
}
if (organization?.type?.includes("Gas")) {
organization.details.gas.forEach((el: any) => {
if (el.name === "Gas Cost at m³")
gas += res.totalGas * 0.0454249414 / 1000 * el.price
if (el.name === "Supplier Gas Cost" || el.name === "Gas Delivery Cost") {
gas += el.price
tmpCost[el.name] = el.price
}
if (el.name === "Gas Tax Percentage")
gas += (res.totalGas * el.price / 100)
});
setGas((old) => old + res.totalGas)
setGasCost((old) => old + Number(gas))
}
if (organization?.type?.includes("Water")) {
organization.details.water.forEach((el: any) => {
if (el.name === "Water Cost at m³")
water += res.totalWater * 0.0001666667 * el.price
if (el.name === "Water Supplier Cost" || el.name === "Water Delivery Cost") {
water += el.price
tmpCost[el.name] = el.price
}
if (el.name === "Water Tax Percentage")
water += (res.totalWater * el.price / 100)
});
setWater((old) => old + res.totalWater)
setWaterCost((old) => old + Number(water))
}
setCost(tmpCost)
})

getBillsAggregated(id, organization, setkWh, setkWhCost, setGas, setGasCost, setWater, setWaterCost, setCost, setSold)

await api.renewable.fetchResourcesByOrganizationId(organization._id).then(res => {
let sum = 0
res.map((el: any) => sum += el.buildings.length)
setSold(sum)
})

await api.bills.getBillsByOrganizationIdAggregated(organization._id).then(res => {
let solar = 0
let geo = 0
let wind = 0
let hydro = 0
setLoadingRenew(true)
res.result.map((el: any) => {
const filter = buildings.find((build: any) => build._id === el.buildingId)
filter?.resources?.map((element: any) => {
el.bills.map((bill: any) => {
bill.resources.map((resource: any) => {
if (Object.keys(resource)[0].includes("Solar") && Object.keys(element)[0].includes("Solar")) {
solar += Number(Object.values(resource))
}
if (Object.keys(resource)[0].includes("Wind") && Object.keys(element)[0].includes("Wind")) {
wind += Number(Object.values(resource))
}
if (Object.keys(resource)[0].includes("Hydro") && Object.keys(element)[0].includes("Hydro")) {
hydro += Number(Object.values(resource))
}
if (Object.keys(resource)[0].includes("Geo") && Object.keys(element)[0].includes("Geo")) {
geo += Number(Object.values(resource))
}
})
})
setTotalGeo(geo / 1000)
setTotalHydro(hydro / 1000)
setTotalWind(wind / 1000)
setTotalSolar(solar / 1000)
setTotalRenew((geo + hydro + solar + wind) / 1000)
})
})
setTimeout(() => {
setLoadingRenew(false)
}, 1000);
getBillsByOrganizationIdAggregated(organization._id, buildings).then((data: any) => {
setTotalGeo(data.geo)
setTotalHydro(data.hydro)
setTotalWind(data.wind)
setTotalSolar(data.geo.solar)
setTotalRenew(data.geo + data.hydro + data.solar + data.wind)
})
} catch (error) {
console.log("Error")
console.log(error)
} finally {
setTimeout(() => {
setLoadingRenew(false)
setLoading(false)
}, 1000);
}
}

useEffect(() => {
setLoadingRenew(true)
setLoading(true)
const tmp = users
if (organization === null || organization === undefined)
return
organization.customers?.forEach(async (element: any) => {
const res = allUser.find((el) => el._id === element.user)
organization.customers?.forEach(async (customer) => {
const res = allUser.find((el) => el._id === customer.user)
if (res != undefined && !tmp.includes(res)) {
tmp.push(res)
await getKpi(element.user).then(() => setLoading(false)).catch(() => setLoading(false))
getKpi(customer.user)
}
});
setUsers(tmp)
}, [organization, buildings])
}, [organization, buildings, allUser])


return (
<Layout
Expand All @@ -160,7 +95,8 @@ const Dashboard = () => {
<Row gutter={[32, 32]}>
<Col span={24}>
<Card style={{ borderRadius: 20 }}>
<CarouselKpi loading={loading}
<CarouselKpi
loading={loading}
waterCost={waterCost}
gasCost={gasCost}
kWhCost={kWhCost}
Expand All @@ -183,7 +119,7 @@ const Dashboard = () => {
<Card style={{ borderRadius: 20, boxShadow: "0 2px 4px rgba(0,0,0,0.2)", }}>
<Row justify="space-between" align="middle" style={{ marginBottom: 32 }}>
<p style={{ fontSize: 18, fontWeight: 500, margin: 0 }}>Organization Overview </p>
<span className="anticon iconfont" style={{ color: "#1196db" }}>&#xe7a7;</span>
<IconFont type="i-speed" style={{ color: "#1196db", fontSize: 30 }} />
</Row>
<ConsumeCard />
</Card>
Expand All @@ -192,7 +128,7 @@ const Dashboard = () => {
<Card style={{ borderRadius: 20, boxShadow: "0 2px 4px rgba(0,0,0,0.2)", }}>
<Row justify="space-between" align="middle" style={{ marginBottom: 32 }}>
<p style={{ fontSize: 18, fontWeight: 500, margin: 0 }}>Organization Total Cost</p>
<span className="anticon iconfont" style={{ color: "#1196db" }}>&#xe71b;</span>
<IconFont type="i-money-euro-circle-line" style={{ color: "#1196db", fontSize: 30 }} />
</Row>
<Row>
{Object.keys(cost).map((el: any) =>
Expand All @@ -205,13 +141,13 @@ const Dashboard = () => {
<Card style={{ borderRadius: 20, boxShadow: "0 2px 4px rgba(0,0,0,0.2)", marginTop: 32 }}>
<Row justify="space-between" align="middle">
<p style={{ fontSize: 18, fontWeight: 500, margin: 0 }}>Organization Total Production</p>
<span className="anticon iconfont" style={{ color: "#1196db", }}>&#xe64f;</span>
<IconFont type="i-green-energy" style={{ color: "#1196db", fontSize: 30 }} />
</Row>
<CarouselWrapper style={{ justifyContent: "center" }} autoplay={!loadingRenew}>
{renderCarouselCard(loadingRenew, { icon: "", title: "Total Solar Production", value: totalSolar })}
{renderCarouselCard(loadingRenew, { icon: "", title: "Total Hydro Production", value: totalHydro })}
{renderCarouselCard(loadingRenew, { icon: "", title: "Total Windy Production", value: totalWind })}
{renderCarouselCard(loadingRenew, { icon: "", title: "Total Geothermic Production", value: totalGeo })}
{renderCarouselCard(loadingRenew, { icon: "i-solar-panels", title: "Total Solar Production", value: totalSolar })}
{renderCarouselCard(loadingRenew, { icon: "i-hydro-power", title: "Total Hydro Production", value: totalHydro })}
{renderCarouselCard(loadingRenew, { icon: "i-turbine", title: "Total Windy Production", value: totalWind })}
{renderCarouselCard(loadingRenew, { icon: "i-ecology", title: "Total Geothermic Production", value: totalGeo })}
</CarouselWrapper>
</Card>

Expand Down
151 changes: 148 additions & 3 deletions src/Vendor/utils.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import { NavigateFunction, Route, Routes } from "react-router-dom";
import { Bills, Organization, UserProps } from "../types";
import { Bills, Building, Organization, UserProps } from "../types";
import Dashboard from "./Dashboard";
import Electric from "./Pages/Electric";
import Gas from "./Pages/Gas";
Expand All @@ -12,6 +12,7 @@ import CompleteOrganization from "./CompleteOrganization";
import { Carousel, Col, Row, Statistic } from "antd";
import styled from "styled-components";
import IconFont from "../Iconfont";
import api from "../api";

export const defaultProps = (organization: Organization, edited: number | undefined) => ({
route: {
Expand Down Expand Up @@ -140,7 +141,7 @@ export const renderCarouselCard = (
<Row justify="space-between" align="middle">
<Col span={24} style={{ height: "200px", textAlign: "center", marginTop: 12 }}>
<p style={{ fontWeight: "300", fontSize: 17, color: "#1196db" }}>{props.title}</p>
<span className="anticon iconfontMedium3" style={{ color: "#1196db" }}>{props.icon}</span>
<IconFont type={props.icon} style={{ color: "#1196db", fontSize: 80, margin: 5 }} />
<Statistic loading={loading} value={props.value} suffix="kW" precision={2} />
</Col>
</Row>
Expand All @@ -159,4 +160,148 @@ export const CarouselWrapper = styled(Carousel)`
border-radius: 100%;
background: #1196db;
}
`;
`;


export const getBillsByOrganizationIdAggregated = async (
organizationId: string,
buildings: Array<Building>,
) =>
await api.bills.getBillsByOrganizationIdAggregated(organizationId).then(res => {
let solar = 0
let geo = 0
let wind = 0
let hydro = 0
res.result.map((el: any) => {
const filter = buildings.find((build) => build._id === el.buildingId)
filter?.resources?.map((element: any) => {
el.bills.map((bill: any) => {
bill.resources.map((resource: any) => {
if (Object.keys(resource)[0].includes("Solar") && Object.keys(element)[0].includes("Solar")) {
solar += Number(Object.values(resource))
}
if (Object.keys(resource)[0].includes("Wind") && Object.keys(element)[0].includes("Wind")) {
wind += Number(Object.values(resource))
}
if (Object.keys(resource)[0].includes("Hydro") && Object.keys(element)[0].includes("Hydro")) {
hydro += Number(Object.values(resource))
}
if (Object.keys(resource)[0].includes("Geo") && Object.keys(element)[0].includes("Geo")) {
geo += Number(Object.values(resource))
}
})
})
return {
geo: geo / 1000,
hydro: hydro / 1000,
wind: wind / 1000,
solar: solar / 1000,
}
})
})
}).catch(() => ({
geo: 0,
hydro: 0,
wind: 0,
solar: 0,
}))


export const getBillsAggregated = async (
id: string,
organization: Organization,
setkWh: (arg: number) => void,
setkWhCost: (arg: number) => void,
setGas: (arg: number) => void,
setGasCost: (arg: number) => void,
setWater: (arg: number) => void,
setWaterCost: (arg: number) => void,
setCost: (arg: number) => void,
setSold: (arg: number) => void,
) => {
await api.bills.getBillsAggregated(id).then(res => {
const tmpCost: Record<string, number> = {};

if (organization?.type?.includes("Electric")) {
const electricDetails = organization.details.electric;
const electricityCostAtKwh = electricDetails.find((el: any) => el.name === "Electricity Cost at kWh");
const electricitySupplierCost = electricDetails.find((el: any) => el.name === "Electricity Supplier Cost");
const electricityDeliveryCost = electricDetails.find((el: any) => el.name === "Electricity Delivery Cost");
const electricityTaxPercentage = electricDetails.find((el: any) => el.name === "Electricity Tax Percentage");

let kWh = res.totalElectric * 0.0833333 / 1000 * electricityCostAtKwh?.price;
if (electricitySupplierCost) {
kWh += electricitySupplierCost.price;
tmpCost[electricitySupplierCost.name] = electricitySupplierCost.price;
}
if (electricityDeliveryCost) {
kWh += electricityDeliveryCost.price;
tmpCost[electricityDeliveryCost.name] = electricityDeliveryCost.price;
}
if (electricityTaxPercentage) {
kWh += (res.totalElectric * electricityTaxPercentage.price / 100);
tmpCost[electricityTaxPercentage.name] = electricityTaxPercentage.price;
}

setkWh(old => old + res.totalElectric);
setkWhCost(old => old + Number(kWh));
}

if (organization?.type?.includes("Gas")) {
const gasDetails = organization.details.gas;
const gasCostAtM3 = gasDetails.find((el: any) => el.name === "Gas Cost at m³");
const supplierGasCost = gasDetails.find((el: any) => el.name === "Supplier Gas Cost");
const gasDeliveryCost = gasDetails.find((el: any) => el.name === "Gas Delivery Cost");
const gasTaxPercentage = gasDetails.find((el: any) => el.name === "Gas Tax Percentage");

let gas = res.totalGas * 0.0454249414 / 1000 * gasCostAtM3?.price;
if (supplierGasCost) {
gas += supplierGasCost.price;
tmpCost[supplierGasCost.name] = supplierGasCost.price;
}
if (gasDeliveryCost) {
gas += gasDeliveryCost.price;
tmpCost[gasDeliveryCost.name] = gasDeliveryCost.price;
}
if (gasTaxPercentage) {
gas += (res.totalGas * gasTaxPercentage.price / 100);
tmpCost[gasTaxPercentage.name] = gasTaxPercentage.price;
}

setGas(old => old + res.totalGas);
setGasCost(old => old + Number(gas));
}

if (organization?.type?.includes("Water")) {
const waterDetails = organization.details.water;
const waterCostAtM3 = waterDetails.find((el: any) => el.name === "Water Cost at m³");
const waterSupplierCost = waterDetails.find((el: any) => el.name === "Water Supplier Cost");
const waterDeliveryCost = waterDetails.find((el: any) => el.name === "Water Delivery Cost");
const waterTaxPercentage = waterDetails.find((el: any) => el.name === "Water Tax Percentage");

let water = res.totalWater * 0.0001666667 * waterCostAtM3?.price;
if (waterSupplierCost) {
water += waterSupplierCost.price;
tmpCost[waterSupplierCost.name] = waterSupplierCost.price;
}
if (waterDeliveryCost) {
water += waterDeliveryCost.price;
tmpCost[waterDeliveryCost.name] = waterDeliveryCost.price;
}
if (waterTaxPercentage) {
water += (res.totalWater * waterTaxPercentage.price / 100);
tmpCost[waterTaxPercentage.name] = waterTaxPercentage.price;
}

setWater(old => old + res.totalWater);
setWaterCost(old => old + Number(water));
}

setCost(tmpCost);
});
await api.renewable.fetchResourcesByOrganizationId(organization._id).then(res => {
let sum = 0
res.map((el: any) => sum += el.buildings.length)
setSold(sum)
})
}

0 comments on commit c4777aa

Please sign in to comment.