upd: skeleton
Deskripsi: - divisi - detail divisi - informasi divisi - calender list - calender detail - history - diskusi list - detail diskusi - list task divisi NO Issuese
This commit is contained in:
@@ -4,6 +4,8 @@ import InputSearch from "@/components/inputSearch";
|
||||
import LabelStatus from "@/components/labelStatus";
|
||||
import PaperGridContent from "@/components/paperGridContent";
|
||||
import ProgressBar from "@/components/progressBar";
|
||||
import Skeleton from "@/components/skeleton";
|
||||
import SkeletonTwoItem from "@/components/skeletonTwoItem";
|
||||
import { ColorsStatus } from "@/constants/ColorsStatus";
|
||||
import Styles from "@/constants/Styles";
|
||||
import { apiGetTask } from "@/lib/api";
|
||||
@@ -34,9 +36,12 @@ export default function ListTask() {
|
||||
const [data, setData] = useState<Props[]>([]);
|
||||
const [search, setSearch] = useState("");
|
||||
const update = useSelector((state: any) => state.taskUpdate)
|
||||
const [loading, setLoading] = useState(true)
|
||||
const arrSkeleton = Array.from({ length: 3 })
|
||||
|
||||
async function handleLoad() {
|
||||
async function handleLoad(loading: boolean) {
|
||||
try {
|
||||
setLoading(loading)
|
||||
const hasil = await decryptToken(String(token?.current));
|
||||
const response = await apiGetTask({
|
||||
user: hasil,
|
||||
@@ -47,12 +52,18 @@ export default function ListTask() {
|
||||
setData(response.data);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
handleLoad();
|
||||
}, [status, search, update.data]);
|
||||
handleLoad(false)
|
||||
}, [update.data])
|
||||
|
||||
useEffect(() => {
|
||||
handleLoad(true);
|
||||
}, [status, search]);
|
||||
|
||||
return (
|
||||
<SafeAreaView>
|
||||
@@ -138,74 +149,87 @@ export default function ListTask() {
|
||||
/>
|
||||
</Pressable>
|
||||
</View>
|
||||
{data.length > 0 ? (
|
||||
<></>
|
||||
) : (
|
||||
<Text
|
||||
style={[
|
||||
Styles.textDefault,
|
||||
Styles.cGray,
|
||||
{ textAlign: "center" },
|
||||
]}
|
||||
>
|
||||
Tidak ada data
|
||||
</Text>
|
||||
)}
|
||||
{isList ? (
|
||||
<View>
|
||||
{data.map((item, index) => (
|
||||
<BorderBottomItem
|
||||
key={index}
|
||||
onPress={() => {
|
||||
router.push(`./task/${item.id}`);
|
||||
}}
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
|
||||
<AntDesign name="areachart" size={25} color={"#384288"} />
|
||||
</View>
|
||||
}
|
||||
title={item.title}
|
||||
/>
|
||||
))}
|
||||
</View>
|
||||
) : (
|
||||
<View>
|
||||
{data.map((item, index) => (
|
||||
<PaperGridContent
|
||||
key={index}
|
||||
onPress={() => {
|
||||
router.push(`./task/${item.id}`);
|
||||
}}
|
||||
content="page"
|
||||
title={item.title}
|
||||
headerColor="primary"
|
||||
>
|
||||
<ProgressBar category="page" value={item.progress} />
|
||||
<View style={[Styles.rowSpaceBetween]}>
|
||||
<Text></Text>
|
||||
<LabelStatus
|
||||
size="default"
|
||||
category={
|
||||
item.status === 0 ? 'primary' :
|
||||
item.status === 1 ? 'warning' :
|
||||
item.status === 2 ? 'success' :
|
||||
item.status === 3 ? 'error' :
|
||||
'primary'
|
||||
}
|
||||
text={
|
||||
item.status === 0 ? 'SEGERA' :
|
||||
item.status === 1 ? 'DIKERJAKAN' :
|
||||
item.status === 2 ? 'SELESAI' :
|
||||
item.status === 3 ? 'DIBATALKAN' :
|
||||
'SEGERA'
|
||||
}
|
||||
/>
|
||||
{
|
||||
|
||||
loading ?
|
||||
isList ?
|
||||
arrSkeleton.map((item, index) => (
|
||||
<SkeletonTwoItem key={index} />
|
||||
))
|
||||
:
|
||||
arrSkeleton.map((item, index) => (
|
||||
<Skeleton key={index} width={100} height={180} widthType="percent" borderRadius={10} />
|
||||
))
|
||||
:
|
||||
data.length > 0 ? (
|
||||
isList ? (
|
||||
<View>
|
||||
{data.map((item, index) => (
|
||||
<BorderBottomItem
|
||||
key={index}
|
||||
onPress={() => {
|
||||
router.push(`./task/${item.id}`);
|
||||
}}
|
||||
borderType="bottom"
|
||||
icon={
|
||||
<View style={[Styles.iconContent, ColorsStatus.lightGreen]}>
|
||||
<AntDesign name="areachart" size={25} color={"#384288"} />
|
||||
</View>
|
||||
}
|
||||
title={item.title}
|
||||
/>
|
||||
))}
|
||||
</View>
|
||||
</PaperGridContent>
|
||||
))}
|
||||
</View>
|
||||
)}
|
||||
) : (
|
||||
<View>
|
||||
{data.map((item, index) => (
|
||||
<PaperGridContent
|
||||
key={index}
|
||||
onPress={() => {
|
||||
router.push(`./task/${item.id}`);
|
||||
}}
|
||||
content="page"
|
||||
title={item.title}
|
||||
headerColor="primary"
|
||||
>
|
||||
<ProgressBar category="page" value={item.progress} />
|
||||
<View style={[Styles.rowSpaceBetween]}>
|
||||
<Text></Text>
|
||||
<LabelStatus
|
||||
size="default"
|
||||
category={
|
||||
item.status === 0 ? 'primary' :
|
||||
item.status === 1 ? 'warning' :
|
||||
item.status === 2 ? 'success' :
|
||||
item.status === 3 ? 'error' :
|
||||
'primary'
|
||||
}
|
||||
text={
|
||||
item.status === 0 ? 'SEGERA' :
|
||||
item.status === 1 ? 'DIKERJAKAN' :
|
||||
item.status === 2 ? 'SELESAI' :
|
||||
item.status === 3 ? 'DIBATALKAN' :
|
||||
'SEGERA'
|
||||
}
|
||||
/>
|
||||
</View>
|
||||
</PaperGridContent>
|
||||
))}
|
||||
</View>
|
||||
)
|
||||
) : (
|
||||
<Text
|
||||
style={[
|
||||
Styles.textDefault,
|
||||
Styles.cGray,
|
||||
{ textAlign: "center" },
|
||||
]}
|
||||
>
|
||||
Tidak ada data
|
||||
</Text>
|
||||
)
|
||||
|
||||
}
|
||||
</View>
|
||||
</ScrollView>
|
||||
</SafeAreaView>
|
||||
|
||||
Reference in New Issue
Block a user