upd: calendar divisi

Deskripsi:
- ui list acara
- ui tambah acara
- ui history acara
- ui detail acara
- ui edit acara

No Issues
This commit is contained in:
amel
2025-03-12 12:33:38 +08:00
parent 514b1bce7d
commit 75901bceb3
11 changed files with 473 additions and 4 deletions

View File

@@ -0,0 +1,58 @@
import Styles from "@/constants/Styles"
import { Ionicons, MaterialCommunityIcons, MaterialIcons } from "@expo/vector-icons"
import { router } from "expo-router"
import { useState } from "react"
import { ToastAndroid, View } from "react-native"
import AlertKonfirmasi from "../alertKonfirmasi"
import ButtonMenuHeader from "../buttonMenuHeader"
import DrawerBottom from "../drawerBottom"
import MenuItemRow from "../menuItemRow"
type Props = {
id: string | string[]
}
export default function HeaderRightCalendarDetail({ id }: Props) {
const [isVisible, setVisible] = useState(false)
return (
<>
<ButtonMenuHeader onPress={() => { setVisible(true) }} />
<DrawerBottom animation="slide" isVisible={isVisible} setVisible={setVisible} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<MaterialIcons name="groups" color="black" size={25} />}
title="Tambah Anggota"
onPress={() => {
setVisible(false)
}}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="pencil-outline" color="black" size={25} />}
title="Edit"
onPress={() => {
setVisible(false)
router.push(`./${id}/edit`)
}}
/>
<MenuItemRow
icon={<Ionicons name="trash" color="black" size={25} />}
title="Hapus"
onPress={() => {
AlertKonfirmasi({
title: 'Konfirmasi',
desc: 'Apakah anda yakin ingin menghapus data?',
onPress: () => {
setVisible(false)
ToastAndroid.show('Berhasil menghapus data', ToastAndroid.SHORT)
router.back()
}
})
}}
/>
</View>
</DrawerBottom>
</>
)
}

View File

@@ -0,0 +1,39 @@
import Styles from "@/constants/Styles"
import { AntDesign, MaterialCommunityIcons } from "@expo/vector-icons"
import { router } from "expo-router"
import { useState } from "react"
import { View } from "react-native"
import ButtonMenuHeader from "../buttonMenuHeader"
import DrawerBottom from "../drawerBottom"
import MenuItemRow from "../menuItemRow"
export default function HeaderRightCalendarList() {
const [isVisible, setVisible] = useState(false)
return (
<>
<ButtonMenuHeader onPress={() => { setVisible(true) }} />
<DrawerBottom animation="slide" isVisible={isVisible} setVisible={setVisible} title="Menu">
<View style={Styles.rowItemsCenter}>
<MenuItemRow
icon={<AntDesign name="pluscircle" color="black" size={25} />}
title="Tambah Acara"
onPress={() => {
setVisible(false)
router.push('./calendar/create')
}}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="history" color="black" size={25} />}
title="Riwayat"
onPress={() => {
setVisible(false)
router.push('./calendar/history')
}}
/>
</View>
</DrawerBottom>
</>
)
}

View File

@@ -0,0 +1,74 @@
import { ColorsStatus } from "@/constants/ColorsStatus";
import Styles from "@/constants/Styles";
import { Text, View } from "react-native";
export default function ItemHistoryEvent() {
return (
<>
<View style={[{ flexDirection: 'row' }, Styles.mv05, ColorsStatus.lightGreen, Styles.p10, Styles.round10]}>
<View style={[Styles.mr10, Styles.ph05]}>
<Text style={[Styles.textSubtitle]}>22 Jan</Text>
<Text style={[Styles.textDefault, { textAlign: 'center' }]}>Kamis</Text>
</View>
<View>
<View style={[Styles.mb05]}>
<Text style={[Styles.textDefaultSemiBold]}>Acara 1</Text>
<Text style={[Styles.textDefault]}>07:00 | 08:00</Text>
</View>
<View style={[Styles.mb05]}>
<Text style={[Styles.textDefaultSemiBold]}>Acara 2</Text>
<Text style={[Styles.textDefault]}>10:30 | 12:00</Text>
</View>
</View>
</View>
<View style={[{ flexDirection: 'row' }, Styles.mv05, ColorsStatus.lightGreen, Styles.p10, Styles.round10]}>
<View style={[Styles.mr10, Styles.ph05]}>
<Text style={[Styles.textSubtitle]}>15 Feb</Text>
<Text style={[Styles.textDefault, { textAlign: 'center' }]}>Senin</Text>
</View>
<View>
<View style={[Styles.mb05]}>
<Text style={[Styles.textDefaultSemiBold]}>Acara 1</Text>
<Text style={[Styles.textDefault]}>07:00 | 08:00</Text>
</View>
</View>
</View>
<View style={[{ flexDirection: 'row' }, Styles.mv05, ColorsStatus.lightGreen, Styles.p10, Styles.round10]}>
<View style={[Styles.mr10, Styles.ph05]}>
<Text style={[Styles.textSubtitle]}>15 Feb</Text>
<Text style={[Styles.textDefault, { textAlign: 'center' }]}>Senin</Text>
</View>
<View>
<View style={[Styles.mb05]}>
<Text style={[Styles.textDefaultSemiBold]}>Acara 1</Text>
<Text style={[Styles.textDefault]}>07:00 | 08:00</Text>
</View>
</View>
</View>
<View style={[{ flexDirection: 'row' }, Styles.mv05, ColorsStatus.lightGreen, Styles.p10, Styles.round10]}>
<View style={[Styles.mr10, Styles.ph05]}>
<Text style={[Styles.textSubtitle]}>15 Feb</Text>
<Text style={[Styles.textDefault, { textAlign: 'center' }]}>Senin</Text>
</View>
<View>
<View style={[Styles.mb05]}>
<Text style={[Styles.textDefaultSemiBold]}>Acara 1</Text>
<Text style={[Styles.textDefault]}>07:00 | 08:00</Text>
</View>
</View>
</View>
<View style={[{ flexDirection: 'row' }, Styles.mv05, ColorsStatus.lightGreen, Styles.p10, Styles.round10]}>
<View style={[Styles.mr10, Styles.ph05]}>
<Text style={[Styles.textSubtitle]}>15 Feb</Text>
<Text style={[Styles.textDefault, { textAlign: 'center' }]}>Senin</Text>
</View>
<View>
<View style={[Styles.mb05]}>
<Text style={[Styles.textDefaultSemiBold]}>Acara 1</Text>
<Text style={[Styles.textDefault]}>07:00 | 08:00</Text>
</View>
</View>
</View>
</>
)
}