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

upd: project

Browse Source 
Deskripsi:
- ui detail project
- ui create project
- ui edit tambah tugas
- ui edit tambah file
- ui edit judul project
- ui cancel project

No Issues
This commit is contained in:
amel
2025-03-06 15:13:43 +08:00
parent 8806f33a8d
commit c07be165ec
15 changed files with 371 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
components/borderBottomItem.tsx
View File

@@ -14,16 +14,17 @@ type Props = {
borderType: 'all' | 'bottom' | 'none'
leftBottomInfo?: React.ReactNode | string
rightBottomInfo?: React.ReactNode | string
titleWeight?: 'normal' | 'bold'
}
export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, rightTopInfo, borderType, leftBottomInfo, rightBottomInfo }: Props) {
export default function BorderBottomItem({ title, subtitle, icon, desc, onPress, rightTopInfo, borderType, leftBottomInfo, rightBottomInfo, titleWeight }: Props) {
return (
<Pressable style={[borderType == 'bottom' ? Styles.wrapItemBorderBottom : borderType == 'all' ? Styles.wrapItemBorderAll : Styles.wrapItemBorderNone]} onPressOut={onPress}>
<View style={[Styles.rowItemsCenter]}>
{icon}
<View style={[Styles.rowSpaceBetween, { width: '85%' }]}>
<View style={[Styles.ml10]}>
<Text style={[Styles.textDefaultSemiBold]}>{title}</Text>
<Text style={[titleWeight == 'normal' ? Styles.textDefault : Styles.textDefaultSemiBold]}>{title}</Text>
{
subtitle &&
typeof subtitle == "string"
@@ -41,7 +42,7 @@ export default function BorderBottomItem({ title, subtitle, icon, desc, onPress,
</View>
{desc && <Text style={[Styles.textDefault, Styles.mt05, { textAlign: 'justify' }]}>{desc}</Text>}
{
(leftBottomInfo || rightBottomInfo )&&
(leftBottomInfo || rightBottomInfo) &&
(
<View style={[Styles.rowSpaceBetween, Styles.mt10]}>
{

7
components/inputForm.tsx
View File

@@ -14,10 +14,11 @@ type Props = {
type: 'default' | 'visible-password' | 'numeric'
round?: boolean
width?: number
bg?: 'white' | 'transparent'
};
export function InputForm({ label, placeholder, onChange, info, error, errorText, required, itemLeft, itemRight, type, round, width }: Props) {
export function InputForm({ label, placeholder, onChange, info, error, errorText, required, itemLeft, itemRight, type, round, width, bg }: Props) {
const lebar = Dimensions.get("window").width;
if (itemLeft != undefined || itemRight != undefined) {
@@ -37,7 +38,7 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
placeholder={placeholder}
keyboardType={type}
onChangeText={onChange}
style={{ width: width && lebar * width / 100 }}
style={{ width: width && lebar * width / 100, backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }}
/>
</View>
{error && (<Text style={[Styles.textInformation, Styles.cError]}>{errorText}</Text>)}
@@ -61,7 +62,7 @@ export function InputForm({ label, placeholder, onChange, info, error, errorText
<TextInput
placeholder={placeholder}
keyboardType={type}
style={[Styles.inputRoundForm, error && { borderColor: "red" }, round && Styles.round30]}
style={[Styles.inputRoundForm, error && { borderColor: "red" }, round && Styles.round30, { backgroundColor: bg && bg == 'white' ? 'white' : 'transparent' }]}
onChangeText={onChange}
/>
{error && (<Text style={[Styles.textInformation, Styles.cError]}>{errorText}</Text>)}

53
components/itemSectionTanggalTugas.tsx Normal file
View File

@@ -0,0 +1,53 @@
import Styles from "@/constants/Styles";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import { Text, View } from "react-native";
type Props = {
done: boolean
title: string
dateStart: string
dateEnd: string
}
export default function ItemSectionTanggalTugas({ done, title, dateStart, dateEnd }: Props) {
return (
<View style={[Styles.mb15, { borderBottomColor: '#d6d8f6', borderBottomWidth: 1 }]}>
<View style={[Styles.rowItemsCenter]}>
{
done ?
<>
<MaterialCommunityIcons name="checkbox-marked-circle-outline" size={22} color="gray" style={[Styles.mr10]} />
<Text style={[Styles.cGray]}>Selesai</Text>
</>
:
<>
<MaterialCommunityIcons name="checkbox-blank-circle-outline" size={22} color="gray" style={[Styles.mr10]} />
<Text style={[Styles.cGray]}>Belum Selesai</Text>
</>
}
</View>
<View style={[Styles.wrapPaper, Styles.mv10, Styles.p10]}>
<View style={[Styles.rowItemsCenter]}>
<MaterialCommunityIcons name="file-table-outline" size={25} color="black" style={[Styles.mr10]} />
<Text style={[Styles.textDefault]}>{title}</Text>
</View>
</View>
<View style={[Styles.rowSpaceBetween, Styles.mb15]}>
<View style={[{ width: '48%' }]}>
<Text style={[Styles.mb05]}>Tanggal Mulai</Text>
<View style={[Styles.wrapPaper, Styles.p10]}>
<Text style={{ textAlign: 'center' }}>{dateStart}</Text>
</View>
</View>
<View style={[{ width: '48%' }]}>
<Text style={[Styles.mb05]}>Tanggal Berakhir</Text>
<View style={[Styles.wrapPaper, Styles.p10]}>
<Text style={{ textAlign: 'center' }}>{dateEnd}</Text>
</View>
</View>
</View>
</View>
)
}

16
components/project/headerProjectDetail.tsx
View File

@@ -5,6 +5,7 @@ import { View } from "react-native"
import Styles from "@/constants/Styles"
import MenuItemRow from "../menuItemRow"
import { AntDesign, MaterialCommunityIcons, MaterialIcons } from "@expo/vector-icons"
import { router } from "expo-router"
type Props = {
id: string | string[]
@@ -22,14 +23,16 @@ export default function HeaderRightProjectDetail({ id }: Props) {
icon={<AntDesign name="pluscircle" color="black" size={25} />}
title="Tambah Tugas"
onPress={() => {
setVisible(false)
router.push(`/project/${id}/add-task`)
}}
/>
<MenuItemRow
icon={<MaterialCommunityIcons name="file-plus" color="black" size={25} />}
title="Tambah File"
onPress={() => {
setVisible(false)
router.push(`/project/${id}/add-file`)
}}
/>
@@ -37,8 +40,8 @@ export default function HeaderRightProjectDetail({ id }: Props) {
icon={<MaterialIcons name="groups" color="black" size={25} />}
title="Tambah Anggota"
onPress={() => {
setVisible(false)
// router.push(`/discussion/member/${id}`)
// setVisible(false)
}}
/>
@@ -49,14 +52,15 @@ export default function HeaderRightProjectDetail({ id }: Props) {
title="Edit"
onPress={() => {
setVisible(false)
// router.push(`/discussion/edit/${id}`)
router.push(`/project/${id}/edit`)
}}
/>
<MenuItemRow
icon={<MaterialIcons name="close" color="black" size={25} />}
title="Batal"
onPress={() => {
setVisible(false)
router.push(`/project/${id}/cancel`)
}}
/>
</View>

26
components/sectionFile.tsx Normal file
View File

@@ -0,0 +1,26 @@
import Styles from "@/constants/Styles";
import { MaterialCommunityIcons } from "@expo/vector-icons";
import { Text, View } from "react-native";
import BorderBottomItem from "./borderBottomItem";
export default function SectionFile() {
return (
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>File</Text>
<View style={[Styles.wrapPaper]}>
<BorderBottomItem
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
title="image_pertama.jpg"
titleWeight="normal"
/>
<BorderBottomItem
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
title="file_kedua.pdf"
titleWeight="normal"
/>
</View>
</View>
)
}

45
components/sectionMember.tsx Normal file
View File

@@ -0,0 +1,45 @@
import Styles from "@/constants/Styles";
import { Image, Text, View } from "react-native";
import BorderBottomItem from "./borderBottomItem";
export default function SectionMember() {
return (
<View style={[Styles.mb15]}>
<View style={[Styles.rowSpaceBetween, Styles.mv05]}>
<Text style={[Styles.textDefaultSemiBold]}>Anggota</Text>
<Text style={[Styles.textDefault]}>Total 5 Anggota</Text>
</View>
<View style={[Styles.wrapPaper]}>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
/>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
/>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
/>
<BorderBottomItem
borderType="bottom"
icon={<Image source={require("../assets/images/user.jpeg")} style={[Styles.userProfileSmall]} />}
title="Amalia Dwi"
subtitle="Dinas - Bendahara"
rightTopInfo="Anggota"
/>
</View>
</View>
)
}

8
components/sectionTanggalTugas.tsx
View File

@@ -1,12 +1,14 @@
import Styles from "@/constants/Styles";
import { Text, View } from "react-native";
import ItemSectionTanggalTugas from "./itemSectionTanggalTugas";
export default function SectionTanggalTugas() {
return (
<View style={[Styles.mb15]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv10]}>Tanggal Dan Tugas</Text>
<View style={[Styles.mb15, Styles.mt10]}>
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>Tanggal & Tugas</Text>
<View style={[Styles.wrapPaper]}>
<ItemSectionTanggalTugas done={false} title="Pertama" dateStart="12-03-2023" dateEnd="15-03-2023" />
<ItemSectionTanggalTugas done={true} title="Kedua" dateStart="15-03-2023" dateEnd="20-03-2023" />
</View>
</View>
)