This commit is contained in:
zadit
2024-12-30 07:26:58 +07:00
parent dbe119398d
commit e49cc3812a
6 changed files with 187 additions and 294 deletions

View File

@@ -10,7 +10,6 @@ import MultiSwitch from "react-multi-switch-toggle";
const RoundedRectangle = ({
onClick,
bgColor,
title,
value,
percentage,
@@ -33,7 +32,8 @@ const RoundedRectangle = ({
textAlign: "left",
fontFamily: "Arial, sans-serif",
boxSizing: "border-box",
backgroundColor: loading ? "rgb(127 127 127)" : bgColor,
backgroundColor: loading ? "rgb(127 127 127)" : 'white',
border: '1px solid #b3b1b1'
};
const titleStyle = {
@@ -100,7 +100,7 @@ const RoundedRectangle = ({
);
};
const App = ({ cafeId,
const App = ({ cafeId,
handleClose }) => {
const [analytics, setAnalytics] = useState({});
const [loading, setLoading] = useState(true);
@@ -202,23 +202,26 @@ const App = ({ cafeId,
width: '100vw',
top: 0,
right: 0,
backgroundColor: 'rgb(207, 207, 207)',
overflowY: 'auto'}}
>
backgroundColor: 'white',
overflowY: 'auto'
}}
>
<h2 className={styles["Transactions-title"]}>Laporan</h2>
<div style={{ textAlign: "center",
marginTop: '30px' }}>
<div style={{
textAlign: "center",
marginTop: '30px'
}}>
<MultiSwitch
texts={["kemarin", "minggu ini", "bulan ini", "tahun ini"]}
selectedSwitch={["daily", "weekly", "monthly", "yearly"].indexOf(
filter
)}
borderWidth={0}
bgColor={"rgb(229, 236, 246)"}
borderColor={'#b3b1b1'}
borderWidth={0.1}
onToggleCallback={onToggle}
fontColor={"rgba(88, 55, 50, 1)"}
selectedFontColor={"#1e311b"}
selectedSwitchColor={"rgb(227, 245, 255)"}
fontColor={"black"}
selectedFontColor={"black"}
selectedSwitchColor={"rgb(197, 197, 197)"}
eachSwitchWidth={70}
height={"25px"}
fontSize={"12px"}
@@ -232,7 +235,6 @@ const App = ({ cafeId,
}}
>
<RoundedRectangle
bgColor="#E3F5FF"
title="Pendapatan"
fontSize="12px"
value={!loading && "Rp" + formatIncome(analytics?.totalIncome)}
@@ -241,8 +243,7 @@ const App = ({ cafeId,
loading={loading}
/>
<RoundedRectangle
bgColor="#E5ECF6"
<RoundedRectangle
title="Pengeluaran"
fontSize="12px"
value={!loading && "Rp" + formatIncome(analytics?.currentOutcome)}
@@ -251,7 +252,6 @@ const App = ({ cafeId,
loading={loading}
/>
<RoundedRectangle
bgColor="#E5ECF6"
title="Transaksi"
value={analytics.totalTransactions}
percentage={roundToInteger(analytics.growthTransactions)}
@@ -261,16 +261,14 @@ const App = ({ cafeId,
{analytics?.items &&
analytics?.items.length > 0 && (
<RoundedRectangle
bgColor="#E3F5FF"
title={"Item favorit"}
value={analytics?.items[0]?.name}
loading={loading}
/>
)}
{(!analytics?.items ||
analytics?.items.length === 0) && (
{(!analytics?.items ||
analytics?.items.length === 0) && (
<RoundedRectangle
bgColor="#E5ECF6"
title={"Item favorit"}
value={"-"}
loading={loading}
@@ -281,7 +279,7 @@ const App = ({ cafeId,
>
<div style={{ marginRight: "5px", fontSize: "1.2em" }}></div>
<h6 style={{ margin: 0, textAlign: "left" }}>
Persentase pertumbuhan dihitung dengan membandingkan periode{" "}
Persentase pertumbuhan dihitung dengan membandingkan periode{" "}
{comparisonText} terakhir dengan {comparisonText} hari sebelumnya.
</h6>
</div>
@@ -323,7 +321,7 @@ const App = ({ cafeId,
</div>
</div>
<div class="ItemLister_PaymentOption__YZlDL"><div style={{marginTop:'20px'}} onClick={handleClose} class="ItemLister_Pay2Button__+MIxX">Kembali</div></div>
<div class="ItemLister_PaymentOption__YZlDL"><div style={{ marginTop: '20px' }} onClick={handleClose} class="ItemLister_Pay2Button__+MIxX">Kembali</div></div>
</div>
);
};