wibu/sistem-desa-mandiri
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style : update style

Browse Source 
Deskripsi:
- update style home
- update validasi jabatan

No Issue
This commit is contained in:
lukman
2024-09-30 10:47:49 +08:00
parent 01c4c6df7f
commit c67b1b8a37
7 changed files with 65 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/module/_global/layout/layout_drawer.tsx
View File

@@ -8,7 +8,7 @@ export default function LayoutDrawer({ opened, onClose, title, children, size }:
const tema = useHookstate(TEMA)
return (
<Box>
<Drawer opened={opened} title={<Text c={tema.get().utama} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%'}
<Drawer opened={opened} title={<Text c={tema.get().utama} fw={'bold'}>{title}</Text>} onClose={onClose} position={"bottom"} size={(size == 'lg') ? '80%' : '40%' }
styles={{
content: {
backgroundColor: "white",

2
src/module/division_new/ui/list_task.tsx
View File

@@ -66,7 +66,7 @@ export default function ListTaskOnDetailDivision() {
: <></>
}
</Group>
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}>
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withControls={false}>
{data.map((v, i) =>
<Carousel.Slide key={v.id}>
<Box p={20} w={{

4
src/module/home/ui/list_divisi.tsx
View File

@@ -59,9 +59,9 @@ export default function ListDivisi() {
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada divisi</Text>
</Box>
:
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}>
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withControls={false}>
{isData.map((v) =>
<Carousel.Slide key={v.id}>
<Carousel.Slide key={v.id} pb={20}>
<Box w={{
base: isMobile ? 230 : 300,
md: 400

4
src/module/home/ui/list_project.tsx
View File

@@ -59,9 +59,9 @@ export default function ListProjects() {
<Text c="dimmed" ta={"center"} fs={"italic"}>Tidak ada kegiatan terbaru</Text>
</Box>
:
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withIndicators withControls={false}>
<Carousel dragFree slideGap={"xs"} align="start" slideSize={"xs"} withControls={false}>
{isData.map((v) =>
<Carousel.Slide key={v.id}>
<Carousel.Slide key={v.id} pb={20}>
<Box w={{
base: isMobile ? 230 : 300,
md: 400

30
src/module/position/ui/drawer_detail_position.tsx
View File

@@ -96,6 +96,23 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
getOneData()
}, [refresh.get()])
function onCheck() {
if (Object.values(touched).some((v) => v == true))
return false
onSubmit()
}
function onValidation(kategori: string, val: string) {
if (kategori == 'name') {
setData({...data, name: val})
if (val == "" || val.length < 3) {
setTouched({ ...touched, name: true })
} else {
setTouched({ ...touched, name: false })
}
}
}
async function nonActive(val: boolean) {
try {
if (val) {
@@ -156,7 +173,6 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
{loading ?
<Box>
<Skeleton height={40} mt={6} radius={10} />
<Skeleton height={40} mt={15} radius={10} />
</Box>
:
<Box>
@@ -172,16 +188,14 @@ export default function DrawerDetailPosition({ onUpdated, id, isActive }: {
required
size="md"
value={String(data.name)}
onChange={(e) => {
setData({ ...data, name: e.target.value })
setTouched({ ...touched, name: false })
}}
onChange={(e) => { onValidation('name', e.target.value) }}
onBlur={() => setTouched({ ...touched, name: true })}
error={
touched.name && (
data.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null
touched.name &&
(data.name == "" ? "Error! harus memasukkan Nama Jabatan" :
data.name.length < 3 ? "Masukkan Minimal 3 karakter" : ""
)
}
}
radius={10}
placeholder="Nama Jabatan"
/>

61
src/module/position/ui/drawer_list_position.tsx
View File

@@ -73,6 +73,30 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
}
}
function onCheck() {
if (Object.values(touched).some((v) => v == true))
return false
onSubmit()
}
function onValidation(kategori: string, val: string) {
if (kategori == 'name') {
setListData({...listData, name: val})
if (val == "" || val.length < 3) {
setTouched({ ...touched, name: true })
} else {
setTouched({ ...touched, name: false })
}
} else if (kategori == 'idGroup') {
setListData({ ...listData, idGroup: val })
if (val == "") {
setTouched({ ...touched, idGroup: true })
} else {
setTouched({ ...touched, idGroup: false })
}
}
}
return (
<Box>
<Stack pt={10}>
@@ -102,9 +126,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
</Stack>
<LayoutDrawer opened={openDrawerGroup} onClose={() => setOpenDrawerGroup(false)} title={'Tambah Jabatan'} size="lg">
<Box pt={10} pos={"relative"} h={{
base: "69vh",
sm: "69vh",
lg: "69vh",
base: "65vh",
sm: "67vh",
lg: "67vh",
xl: "70vh"
}}>
@@ -125,13 +149,9 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
radius={10}
mb={5}
withAsterisk
onChange={(val: any) => {
setListData({
...listData,
idGroup: val
})
setTouched({ ...touched, idGroup: false })
}}
onChange={(e: any) =>
{ onValidation('idGroup', e) }
}
styles={{
input: {
color: tema.get().utama,
@@ -144,8 +164,6 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
listData.idGroup == "" ? "Grup Tidak Boleh Kosong" : null
)
}
onFocus={() => setTouched({ ...touched, idGroup: true })}
onBlur={() => setTouched({ ...touched, idGroup: true })}
/>
}
<TextInput
@@ -159,22 +177,15 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
}}
my={15}
size="md"
onChange={(event: any) => {
setListData({
...listData,
name: event.target.value
})
setTouched({ ...touched, name: false })
}}
onChange={(e) => { onValidation('name', e.target.value) }}
radius={10}
placeholder="Nama Jabatan"
error={
touched.name && (
listData.name == "" ? "Nama Jabatan Tidak Boleh Kosong" : null
touched.name &&
(listData.name == "" ? "Error! harus memasukkan Nama Jabatan" :
listData.name.length < 3 ? "Masukkan Minimal 3 karakter" : ""
)
}
onFocus={() => setTouched({ ...touched, name: true })}
onBlur={() => setTouched({ ...touched, name: true })}
}
required
/>
<Box pos={"absolute"} bottom={10} left={0} right={0}>
@@ -184,7 +195,7 @@ export default function DrawerListPosition({ onCreated }: { onCreated: (val: boo
size="lg"
radius={30}
fullWidth
onClick={onSubmit}
onClick={() => { onCheck() }}
>
SIMPAN
</Button>