Icon:
Add: - IconArchive Voting Add: - detail voting - BoxDetailHasilVotingSection - BoxDetailPublishSection - BoxDetailSection - ButtonStatusSection Fix: - BoxPublishSection - ReportListSection: Hapus import useless # No Issue
This commit is contained in:
30
screens/Voting/BoxDetailHasilVotingSection.tsx
Normal file
30
screens/Voting/BoxDetailHasilVotingSection.tsx
Normal file
@@ -0,0 +1,30 @@
|
||||
import {
|
||||
BaseBox,
|
||||
StackCustom,
|
||||
TextCustom,
|
||||
Grid,
|
||||
CircleContainer,
|
||||
} from "@/components";
|
||||
|
||||
export default function Voting_BoxDetailHasilVotingSection() {
|
||||
return (
|
||||
<>
|
||||
<BaseBox>
|
||||
<StackCustom>
|
||||
<TextCustom bold align="center">
|
||||
Hasil Voting
|
||||
</TextCustom>
|
||||
|
||||
<Grid>
|
||||
{Array.from({ length: 4 }).map((_, i) => (
|
||||
<Grid.Col span={3} style={{ alignItems: "center" }} key={i}>
|
||||
<CircleContainer value={9 % (i + 4)} />
|
||||
<TextCustom size="small">Pilihan {i + 1}</TextCustom>
|
||||
</Grid.Col>
|
||||
))}
|
||||
</Grid>
|
||||
</StackCustom>
|
||||
</BaseBox>
|
||||
</>
|
||||
);
|
||||
}
|
||||
71
screens/Voting/BoxDetailPublishSection.tsx
Normal file
71
screens/Voting/BoxDetailPublishSection.tsx
Normal file
@@ -0,0 +1,71 @@
|
||||
import {
|
||||
BadgeCustom,
|
||||
BoxWithHeaderSection,
|
||||
ButtonCustom,
|
||||
Spacing,
|
||||
StackCustom,
|
||||
TextCustom,
|
||||
} from "@/components";
|
||||
import { RadioCustom, RadioGroup } from "@/components/Radio/RadioCustom";
|
||||
import { GStyles } from "@/styles/global-styles";
|
||||
import dayjs from "dayjs";
|
||||
import { useState } from "react";
|
||||
import { View } from "react-native";
|
||||
|
||||
export function Voting_BoxDetailPublishSection({
|
||||
headerAvatar,
|
||||
}: {
|
||||
headerAvatar?: React.ReactNode;
|
||||
}) {
|
||||
const [value, setValue] = useState<any | number>("");
|
||||
return (
|
||||
<>
|
||||
<BoxWithHeaderSection>
|
||||
{headerAvatar ? headerAvatar : <Spacing />}
|
||||
<StackCustom gap={"lg"}>
|
||||
<TextCustom align="center" bold size="large">
|
||||
Title of Voting Here
|
||||
</TextCustom>
|
||||
<TextCustom>
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||
Perspiciatis corporis blanditiis est provident corrupti facilis iste
|
||||
cum voluptate. Natus eum aut quos consequatur doloribus fugiat sit
|
||||
ullam minima non enim?
|
||||
</TextCustom>
|
||||
<View>
|
||||
<TextCustom bold size="small" align="center">
|
||||
Batas Voting
|
||||
</TextCustom>
|
||||
<BadgeCustom
|
||||
style={[GStyles.alignSelfCenter, { width: "70%" }]}
|
||||
variant="light"
|
||||
>
|
||||
{dayjs().format("DD/MM/YYYY")} -{" "}
|
||||
{dayjs().add(1, "day").format("DD/MM/YYYY")}
|
||||
</BadgeCustom>
|
||||
</View>
|
||||
|
||||
<View>
|
||||
<TextCustom bold size="small">
|
||||
Pilihan :
|
||||
</TextCustom>
|
||||
<RadioGroup value={value} onChange={setValue}>
|
||||
{Array.from({ length: 4 }).map((_, i) => (
|
||||
<View key={i}>
|
||||
<RadioCustom
|
||||
label={`Pilihan ${i + 1}`}
|
||||
value={`Pilihan ${i + 1}`}
|
||||
/>
|
||||
</View>
|
||||
))}
|
||||
</RadioGroup>
|
||||
</View>
|
||||
|
||||
<ButtonCustom onPress={() => console.log("vote")}>
|
||||
Vote
|
||||
</ButtonCustom>
|
||||
</StackCustom>
|
||||
</BoxWithHeaderSection>
|
||||
</>
|
||||
);
|
||||
}
|
||||
59
screens/Voting/BoxDetailSection.tsx
Normal file
59
screens/Voting/BoxDetailSection.tsx
Normal file
@@ -0,0 +1,59 @@
|
||||
import {
|
||||
BadgeCustom,
|
||||
BoxWithHeaderSection,
|
||||
Spacing,
|
||||
StackCustom,
|
||||
TextCustom,
|
||||
} from "@/components";
|
||||
import { GStyles } from "@/styles/global-styles";
|
||||
import dayjs from "dayjs";
|
||||
import { View } from "react-native";
|
||||
|
||||
export function Voting_BoxDetailSection({
|
||||
headerAvatar,
|
||||
}: {
|
||||
headerAvatar?: React.ReactNode;
|
||||
}) {
|
||||
return (
|
||||
<>
|
||||
<BoxWithHeaderSection>
|
||||
{headerAvatar ? headerAvatar : <Spacing />}
|
||||
<StackCustom>
|
||||
<TextCustom align="center" bold size="large">
|
||||
Title of Voting Here
|
||||
</TextCustom>
|
||||
<TextCustom>
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
||||
Perspiciatis corporis blanditiis est provident corrupti facilis iste
|
||||
cum voluptate. Natus eum aut quos consequatur doloribus fugiat sit
|
||||
ullam minima non enim?
|
||||
</TextCustom>
|
||||
<View>
|
||||
<TextCustom bold size="small" align="center">
|
||||
Batas Voting
|
||||
</TextCustom>
|
||||
<BadgeCustom
|
||||
style={[GStyles.alignSelfCenter, { width: "70%" }]}
|
||||
variant="light"
|
||||
>
|
||||
{dayjs().format("DD/MM/YYYY")} -{" "}
|
||||
{dayjs().add(1, "day").format("DD/MM/YYYY")}
|
||||
</BadgeCustom>
|
||||
</View>
|
||||
|
||||
<View>
|
||||
<TextCustom bold size="small">
|
||||
Pilihan :
|
||||
</TextCustom>
|
||||
{Array.from({ length: 3 }).map((_, i) => (
|
||||
<View key={i}>
|
||||
<TextCustom>Nama Pilihan {i + 1}</TextCustom>
|
||||
<Spacing />
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
</StackCustom>
|
||||
</BoxWithHeaderSection>
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -39,18 +39,12 @@ export default function Voting_BoxPublishSection({
|
||||
</BadgeCustom>
|
||||
|
||||
<Grid>
|
||||
<Grid.Col span={3} style={{ alignItems: "center" }}>
|
||||
<CircleContainer value={"10"} />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={3} style={{ alignItems: "center" }}>
|
||||
<CircleContainer value={"9"} />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={3} style={{ alignItems: "center" }}>
|
||||
<CircleContainer value={"10"} />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={3} style={{ alignItems: "center" }}>
|
||||
<CircleContainer value={"9"} />
|
||||
</Grid.Col>
|
||||
{Array.from({ length: 4 }).map((_, i) => (
|
||||
<Grid.Col span={3} style={{ alignItems: "center" }} key={i}>
|
||||
<CircleContainer value={9 % (i + 4)} />
|
||||
<TextCustom size="small">Pilihan {i + 1}</TextCustom>
|
||||
</Grid.Col>
|
||||
))}
|
||||
</Grid>
|
||||
{bottomComponent}
|
||||
</StackCustom>
|
||||
|
||||
124
screens/Voting/ButtonStatusSection.tsx
Normal file
124
screens/Voting/ButtonStatusSection.tsx
Normal file
@@ -0,0 +1,124 @@
|
||||
import { AlertDefaultSystem, ButtonCustom, Grid } from "@/components";
|
||||
import { router } from "expo-router";
|
||||
import { View } from "react-native";
|
||||
|
||||
export default function Voting_ButtonStatusSection({
|
||||
status,
|
||||
}: {
|
||||
status: string;
|
||||
}) {
|
||||
const handleBatalkanReview = () => {
|
||||
AlertDefaultSystem({
|
||||
title: "Batalkan Review",
|
||||
message: "Apakah Anda yakin ingin batalkan review ini?",
|
||||
textLeft: "Batal",
|
||||
textRight: "Ya",
|
||||
onPressRight: () => {
|
||||
console.log("Hapus");
|
||||
router.back();
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleAjukanReview = () => {
|
||||
AlertDefaultSystem({
|
||||
title: "Ajukan Review",
|
||||
message: "Apakah Anda yakin ingin ajukan review ini?",
|
||||
textLeft: "Batal",
|
||||
textRight: "Ya",
|
||||
onPressRight: () => {
|
||||
console.log("Hapus");
|
||||
router.back();
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleEditKembali = () => {
|
||||
AlertDefaultSystem({
|
||||
title: "Edit Kembali",
|
||||
message: "Apakah Anda yakin ingin edit kembali ini?",
|
||||
textLeft: "Batal",
|
||||
textRight: "Ya",
|
||||
onPressRight: () => {
|
||||
console.log("Hapus");
|
||||
router.back();
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleOpenDeleteAlert = () => {
|
||||
AlertDefaultSystem({
|
||||
title: "Hapus",
|
||||
message: "Apakah Anda yakin ingin menghapus data ini?",
|
||||
textLeft: "Batal",
|
||||
textRight: "Hapus",
|
||||
onPressRight: () => {
|
||||
console.log("Hapus");
|
||||
router.back();
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const DeleteButton = () => {
|
||||
return (
|
||||
<>
|
||||
<ButtonCustom
|
||||
backgroundColor="red"
|
||||
textColor="white"
|
||||
onPress={handleOpenDeleteAlert}
|
||||
>
|
||||
Hapus
|
||||
</ButtonCustom>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
switch (status) {
|
||||
case "publish":
|
||||
return <></>;
|
||||
|
||||
case "review":
|
||||
return (
|
||||
<ButtonCustom onPress={handleBatalkanReview}>
|
||||
Batalkan Review
|
||||
</ButtonCustom>
|
||||
);
|
||||
|
||||
case "draft":
|
||||
return (
|
||||
<>
|
||||
<Grid>
|
||||
<Grid.Col span={5}>
|
||||
<ButtonCustom onPress={handleAjukanReview}>
|
||||
Ajukan Review
|
||||
</ButtonCustom>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={2}>
|
||||
<View />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={5}>{DeleteButton()}</Grid.Col>
|
||||
</Grid>
|
||||
</>
|
||||
);
|
||||
|
||||
case "reject":
|
||||
return (
|
||||
<>
|
||||
<Grid>
|
||||
<Grid.Col span={5}>
|
||||
<ButtonCustom onPress={handleEditKembali}>
|
||||
Edit Kembali
|
||||
</ButtonCustom>
|
||||
</Grid.Col>
|
||||
<Grid.Col span={2}>
|
||||
<View />
|
||||
</Grid.Col>
|
||||
<Grid.Col span={5}>{DeleteButton()}</Grid.Col>
|
||||
</Grid>
|
||||
</>
|
||||
);
|
||||
|
||||
default:
|
||||
return <ButtonCustom disabled>Status Undifined</ButtonCustom>;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user