upd: skeleton task divisi

Deskripsi:
- detail task divisi

No Issues
This commit is contained in:
amel
2025-06-09 10:47:28 +08:00
parent 68c6a745ef
commit 81e55ef74a
5 changed files with 125 additions and 69 deletions

View File

@@ -169,6 +169,7 @@ export default function SectionFile({ status, member }: { status: number | undef
title={item.name + '.' + item.extension}
titleWeight="normal"
onPress={() => { setIdSelect(item.id); setModal(true) }}
width={65}
/>
)
})

View File

@@ -11,6 +11,7 @@ import AlertKonfirmasi from "../alertKonfirmasi";
import BorderBottomItem from "../borderBottomItem";
import DrawerBottom from "../drawerBottom";
import MenuItemRow from "../menuItemRow";
import Skeleton from "../skeleton";
type Props = {
id: string
@@ -27,21 +28,30 @@ export default function SectionFileTask() {
const [idSelect, setIdSelect] = useState('')
const update = useSelector((state: any) => state.taskUpdate)
const dispatch = useDispatch()
const [loading, setLoading] = useState(true)
const arrSkeleton = Array.from({ length: 5 })
async function handleLoad() {
async function handleLoad(loading: boolean) {
try {
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetTaskOne({ id: detail, user: hasil, cat: 'file' })
setData(response.data)
} catch (error) {
console.error(error)
} finally {
setLoading(false)
}
}
useEffect(() => {
handleLoad()
handleLoad(false)
}, [update.file])
useEffect(() => {
handleLoad(true)
}, [])
async function handleDelete() {
try {
const hasil = await decryptToken(String(token?.current));
@@ -66,21 +76,29 @@ export default function SectionFileTask() {
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>File</Text>
<View style={[Styles.wrapPaper]}>
{
data.length > 0 ?
data.map((item, index) => {
loading ?
arrSkeleton.map((item, index) => {
return (
<BorderBottomItem
key={index}
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
title={item.name + '.' + item.extension}
titleWeight="normal"
onPress={() => { setIdSelect(item.id); setModal(true) }}
/>
<Skeleton key={index} width={100} height={40} widthType="percent" borderRadius={10} />
)
})
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada file</Text>
data.length > 0 ?
data.map((item, index) => {
return (
<BorderBottomItem
key={index}
borderType="all"
icon={<MaterialCommunityIcons name="file-outline" size={25} color="black" />}
title={item.name + '.' + item.extension}
titleWeight="normal"
onPress={() => { setIdSelect(item.id); setModal(true) }}
width={65}
/>
)
})
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada file</Text>
}
</View>
</View>

View File

@@ -12,6 +12,7 @@ import BorderBottomItem from "../borderBottomItem";
import DrawerBottom from "../drawerBottom";
import ImageUser from "../imageNew";
import MenuItemRow from "../menuItemRow";
import SkeletonTwoItem from "../skeletonTwoItem";
type Props = {
id: string;
@@ -29,13 +30,16 @@ export default function SectionMemberTask() {
const [data, setData] = useState<Props[]>([]);
const dispatch = useDispatch();
const update = useSelector((state: any) => state.taskUpdate);
const [loading, setLoading] = useState(true)
const arrSkeleton = Array.from({ length: 3 })
const [memberChoose, setMemberChoose] = useState({
id: "",
name: "",
});
async function handleLoad() {
async function handleLoad(loading: boolean) {
try {
setLoading(loading)
const hasil = await decryptToken(String(token?.current));
const response = await apiGetTaskOne({
id: detail,
@@ -45,13 +49,19 @@ export default function SectionMemberTask() {
setData(response.data);
} catch (error) {
console.error(error);
} finally {
setLoading(false)
}
}
useEffect(() => {
handleLoad();
handleLoad(false);
}, [update.member]);
useEffect(() => {
handleLoad(true);
}, [])
async function handleDeleteMember() {
try {
@@ -83,39 +93,48 @@ export default function SectionMemberTask() {
</View>
<View style={[Styles.wrapPaper]}>
{data.length > 0 ? (
data.map((item, index) => {
return (
<BorderBottomItem
key={index}
borderType="bottom"
icon={
<ImageUser
src={`https://wibu-storage.wibudev.com/api/files/${item.img}`}
{
loading ?
arrSkeleton.map((item, index) => {
return (
<SkeletonTwoItem key={index} />
)
})
:
data.length > 0 ? (
data.map((item, index) => {
return (
<BorderBottomItem
key={index}
borderType="bottom"
icon={
<ImageUser
src={`https://wibu-storage.wibudev.com/api/files/${item.img}`}
/>
}
title={item.name}
onPress={() => {
setMemberChoose({
id: item.idUser,
name: item.name,
});
setModal(true);
}}
/>
}
title={item.name}
onPress={() => {
setMemberChoose({
id: item.idUser,
name: item.name,
});
setModal(true);
}}
/>
);
})
) : (
<Text
style={[
Styles.textDefault,
Styles.cGray,
{ textAlign: "center" },
]}
>
Tidak ada anggota
</Text>
)}
);
})
) : (
<Text
style={[
Styles.textDefault,
Styles.cGray,
{ textAlign: "center" },
]}
>
Tidak ada anggota
</Text>
)
}
</View>
</View>

View File

@@ -12,6 +12,7 @@ import DrawerBottom from "../drawerBottom";
import ItemSectionTanggalTugas from "../itemSectionTanggalTugas";
import MenuItemRow from "../menuItemRow";
import ModalSelect from "../modalSelect";
import SkeletonTask from "../skeletonTask";
type Props = {
@@ -28,6 +29,8 @@ export default function SectionTanggalTugasTask() {
const [isModal, setModal] = useState(false)
const [isSelect, setSelect] = useState(false)
const { token, decryptToken } = useAuthSession()
const [loading, setLoading] = useState(true)
const arrSkeleton = Array.from({ length: 5 })
const { id, detail } = useLocalSearchParams<{ id: string, detail: string }>();
const [data, setData] = useState<Props[]>([])
const [tugas, setTugas] = useState({
@@ -35,13 +38,16 @@ export default function SectionTanggalTugasTask() {
status: 0,
})
async function handleLoad() {
async function handleLoad(loading: boolean) {
try {
setLoading(loading)
const hasil = await decryptToken(String(token?.current))
const response = await apiGetTaskOne({ id: detail, user: hasil, cat: 'task' })
setData(response.data)
} catch (error) {
console.error(error)
} finally {
setLoading(false)
}
}
@@ -68,10 +74,15 @@ export default function SectionTanggalTugasTask() {
}
useEffect(() => {
handleLoad()
handleLoad(false)
}, [update.task])
useEffect(() => {
handleLoad(true)
}, [])
async function handleDelete() {
try {
const hasil = await decryptToken(String(token?.current));
@@ -100,28 +111,35 @@ export default function SectionTanggalTugasTask() {
<Text style={[Styles.textDefaultSemiBold, Styles.mv05]}>Tanggal & Tugas</Text>
<View style={[Styles.wrapPaper]}>
{
data.length > 0
?
data.map((item, index) => {
loading ?
arrSkeleton.map((item, index) => {
return (
<ItemSectionTanggalTugas
key={index}
done={item.status === 1}
title={item.title}
dateStart={item.dateStart}
dateEnd={item.dateEnd}
onPress={() => {
setTugas({
id: item.id,
status: item.status
})
setModal(true)
}}
/>
);
<SkeletonTask key={index} />
)
})
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada tugas</Text>
data.length > 0
?
data.map((item, index) => {
return (
<ItemSectionTanggalTugas
key={index}
done={item.status === 1}
title={item.title}
dateStart={item.dateStart}
dateEnd={item.dateEnd}
onPress={() => {
setTugas({
id: item.id,
status: item.status
})
setModal(true)
}}
/>
);
})
:
<Text style={[Styles.textDefault, Styles.cGray, { textAlign: 'center' }]}>Tidak ada tugas</Text>
}
</View>
</View>