wibu/mobile-darmasaba
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #15 from bipproduction/amalia/18-mar-25

Browse Source 
Amalia/18 mar 25
This commit is contained in:
Amalia
2025-03-18 15:31:31 +08:00
committed by GitHub
parent 8ebe22c35b a8b701a292
commit 35b47b3223
9 changed files with 78 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
app/(application)/division/[id]/(fitur-division)/calendar/index.tsx
View File

@@ -1,19 +1,29 @@
import ButtonBackHeader from "@/components/buttonBackHeader"
import HeaderRightCalendarList from "@/components/calendar/headerCalendarList"
import ItemDateCalendar from "@/components/calendar/itemDateCalendar"
import EventItem from "@/components/eventItem"
import Styles from "@/constants/Styles"
import { router, Stack } from "expo-router"
import moment from 'moment'
import { useState } from "react"
import { SafeAreaView, ScrollView, Text, View } from "react-native"
import DateTimePicker, { CalendarComponents, CalendarDay, DateType, getDefaultStyles } from "react-native-ui-datepicker"
export default function CalendarDivision() {
const defaultStyles = getDefaultStyles()
const [selected, setSelected] = useState<DateType>()
const [selected, setSelected] = useState<DateType>(new Date());
const listDate = ['2025-03-19', '2025-03-22']
const components: CalendarComponents = {
Day: (day: CalendarDay) => <Text>amalia</Text>,
// Month: (month: CalendarMonth) => <YourCustomMonth month={month} />
// etc
Day: (day: CalendarDay) => {
const now = String(day.date)
const today = moment(now).format('YYYY-MM-DD');
const sign = listDate.includes(today)
return (
<ItemDateCalendar text={day.text} isSelected={day.isSelected} isSign={sign} />
)
},
};
return (
@@ -30,18 +40,20 @@ export default function CalendarDivision() {
<View style={[Styles.p15]}>
<View style={[Styles.wrapPaper, Styles.p10]}>
<DateTimePicker
// components={components}
components={components}
mode="single"
date={selected}
onChange={({ date }) => setSelected(date)}
styles={defaultStyles}
styles={{
selected: Styles.selectedDate,
}}
/>
</View>
<View style={[Styles.mb15, Styles.mt15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mb05]}>Acara</Text>
<View style={[Styles.wrapPaper]}>
<EventItem category="purple" title="Meeting Pertama" user="Amalia" jamAwal="10.00" jamAkhir="11.00" onPress={()=>{router.push('./calendar/321')}}/>
<EventItem category="orange" title="Meeting Pertama" user="Amalia" jamAwal="10.00" jamAkhir="11.00" onPress={()=>{router.push('./calendar/321')}}/>
<EventItem category="purple" title="Meeting Pertama" user="Amalia" jamAwal="10.00" jamAkhir="11.00" onPress={() => { router.push('./calendar/321') }} />
<EventItem category="orange" title="Meeting Pertama" user="Amalia" jamAwal="10.00" jamAkhir="11.00" onPress={() => { router.push('./calendar/321') }} />
</View>
</View>
</View>

7
app/(application)/division/[id]/(fitur-division)/task/[detail]/add-task.tsx
View File

@@ -40,7 +40,12 @@ export default function TaskDivisionAddTask() {
startDate={range.startDate}
endDate={range.endDate}
onChange={(param) => setRange(param)}
styles={defaultStyles}
// styles={defaultStyles}
styles={{
selected: Styles.selectedDate,
selected_label:Styles.cWhite,
range_fill: Styles.selectRangeDate,
}}
/>
</View>
<View style={[Styles.rowSpaceBetween, Styles.mv10]}>

7
app/(application)/division/[id]/(fitur-division)/task/update/[id].tsx
View File

@@ -40,7 +40,12 @@ export default function UpdateProjectTaskDivision() {
startDate={range.startDate}
endDate={range.endDate}
onChange={(param) => setRange(param)}
styles={defaultStyles}
// styles={defaultStyles}
styles={{
selected: Styles.selectedDate,
selected_label: Styles.cWhite,
range_fill: Styles.selectRangeDate,
}}
/>
</View>
<View style={[Styles.rowSpaceBetween, Styles.mv10]}>

7
app/(application)/project/[id]/add-task.tsx
View File

@@ -40,7 +40,12 @@ export default function ProjectAddTask() {
startDate={range.startDate}
endDate={range.endDate}
onChange={(param) => setRange(param)}
styles={defaultStyles}
// styles={defaultStyles}
styles={{
selected: Styles.selectedDate,
selected_label: Styles.cWhite,
range_fill: Styles.selectRangeDate,
}}
/>
</View>
<View style={[Styles.rowSpaceBetween, Styles.mv10]}>

7
app/(application)/project/update/[detail].tsx
View File

@@ -40,7 +40,12 @@ export default function UpdateProjectTask() {
startDate={range.startDate}
endDate={range.endDate}
onChange={(param) => setRange(param)}
styles={defaultStyles}
// styles={defaultStyles}
styles={{
selected: Styles.selectedDate,
selected_label: Styles.cWhite,
range_fill: Styles.selectRangeDate,
}}
/>
</View>
<View style={[Styles.rowSpaceBetween, Styles.mv10]}>

BIN
bun.lockb
View File

Binary file not shown.

20
components/calendar/itemDateCalendar.tsx Normal file
View File

@@ -0,0 +1,20 @@
import Styles from "@/constants/Styles";
import { Text, View } from "react-native";
type Props = {
text: string;
isSelected: boolean;
isSign: boolean;
}
export default function ItemDateCalendar({ text, isSelected, isSign }: Props) {
return (
<>
<View style={{ alignItems: 'center' }}>
<Text style={[isSelected ? Styles.cWhite : Styles.cBlack]}>{text}</Text>
<View style={[Styles.signDate, { backgroundColor: isSign ? 'red' : 'transparent' }]}></View>
</View>
</>
)
}

13
constants/Styles.ts
View File

@@ -419,6 +419,19 @@ const Styles = StyleSheet.create({
justifyContent: 'space-between',
borderColor: '#d6d8f6',
borderBottomWidth: 1
},
signDate: {
width: 20,
height: 2,
borderRadius: 3,
marginTop: 3
},
selectedDate: {
backgroundColor: '#238be6',
borderRadius: 5
},
selectRangeDate:{
backgroundColor: '#228be61f',
}
})

1
package.json
View File

@@ -35,6 +35,7 @@
"expo-symbols": "~0.2.2",
"expo-system-ui": "~4.0.8",
"expo-web-browser": "~14.0.2",
"moment": "^2.30.1",
"react": "18.3.1",
"react-dom": "18.3.1",
"react-native": "0.76.7",