This commit is contained in:
zadit
2025-01-25 00:17:06 +07:00
parent 469d786d49
commit a1b7d0b844
13 changed files with 542 additions and 226 deletions

View File

@@ -52,16 +52,18 @@ const PeriodCharts = ({ type, aggregatedCurrentReports, aggregatedPreviousReport
onClick={() =>
selectedIndex === -1 ? setSelectedIndex(0) : setSelectedIndex(-1)
}
style={{border: '1px solid rgb(179, 177, 177)', color: colors[0]}}
>
style={{ color: 'black',position: 'relative' }}
>
<div style={{ position: 'absolute', bottom: 0, left: '10%', right: '10%', borderBottom: `1px solid ${colors[0]}` }}></div>
<div>{type == 'monthly' ? 'bulan lalu' : 'tahun lalu'}</div>
</div>
<div
className={`${styles.dateSelector} ${styles.dateSelectorInactive
}`}
onClick={() =>
selectedIndex === 0 ? setSelectedIndex(-1) : setSelectedIndex(1)
}>
onClick={() =>
selectedIndex === 0 ? setSelectedIndex(-1) : setSelectedIndex(1)
}>
<div>{type == 'monthly' ? 'bulan ini' : 'tahun ini'}</div>
</div>
</div>
@@ -70,7 +72,7 @@ const PeriodCharts = ({ type, aggregatedCurrentReports, aggregatedPreviousReport
options={{
tooltip: { enabled: false },
chart: { type: "area", zoom: { enabled: false }, toolbar: { show: false } },
xaxis: {
xaxis: {
categories: cat,
axisBorder: {
show: false, // Removes the x-axis line
@@ -78,7 +80,7 @@ const PeriodCharts = ({ type, aggregatedCurrentReports, aggregatedPreviousReport
axisTicks: {
show: false, // Removes the ticks on the x-axis
},
},
},
yaxis: { max: globalMax, min: 0, labels: { style: { colors: "transparent" } } },
grid: { show: false },
fill: { opacity: 0.5 },
@@ -105,17 +107,19 @@ const PeriodCharts = ({ type, aggregatedCurrentReports, aggregatedPreviousReport
<div
className={`${styles.dateSelector} ${styles.dateSelectorInactive
}`}
onClick={() =>
selectedIndex === 1 ? setSelectedIndex(-1) : setSelectedIndex(0)
}>
onClick={() =>
selectedIndex === 1 ? setSelectedIndex(-1) : setSelectedIndex(0)
}>
<div>{type == 'monthly' ? 'bulan lalu' : 'tahun lalu'}</div>
</div>
<div className={styles.dateSelector}
onClick={() =>
selectedIndex === -1 ? setSelectedIndex(1) : setSelectedIndex(-1)
}
style={{border: '1px solid rgb(179, 177, 177)', color: colors[1]}}>
style={{ color: 'black',position: 'relative' }}
>
<div style={{ position: 'absolute', bottom: 0, left: '10%', right: '10%', borderBottom: `1px solid ${colors[1]}` }}></div>
<div>{type == 'monthly' ? 'bulan ini' : 'tahun ini'}</div>
</div>
</div>
@@ -125,13 +129,14 @@ const PeriodCharts = ({ type, aggregatedCurrentReports, aggregatedPreviousReport
tooltip: { enabled: false },
chart: { type: "area", zoom: { enabled: false }, toolbar: { show: false } },
xaxis: {
categories: cat,
categories: cat,
axisBorder: {
show: false, // Removes the x-axis line
},
axisTicks: {
show: false, // Removes the ticks on the x-axis
}, },
},
},
yaxis: { max: globalMax, min: 0, labels: { style: { colors: "transparent" } } },
grid: { show: false },
fill: { opacity: 0.5 },