feat: setup crud scheduling data

pull/1/head
Firman Ramdhani 2025-07-07 11:46:27 +07:00
parent 1b9c656007
commit 9cd4d7f1a0
3 changed files with 22 additions and 17 deletions

View File

@ -3,6 +3,7 @@ import { Button, Card, Col, Flex, InputNumber, Modal, Row, Form } from 'antd';
import { Fragment, useEffect, useState } from 'react';
import axios from 'axios';
import { notificationError } from '@pos/base';
import { makeColorTextValue } from '../helpers';
export default function DefaultValue() {
const [loading, setLoading] = useState(false);
@ -124,7 +125,8 @@ export default function DefaultValue() {
<div style={{ fontSize: 12, fontWeight: 600, color: 'rgba(0,0,0,0.4)' }}>DEFAULT PERCENTAGE</div>
<Flex gap={12}>
<div
style={{ fontSize: 24, fontWeight: 600, color: 'rgba(0,0,0,0.6)' }}
style={{ fontSize: 24, fontWeight: 600 }}
className={`${makeColorTextValue(defaultPercentage)}`}
>{`${defaultPercentage >= 0 ? `${defaultPercentage} %` : '-'}`}</div>
<Button type="link" onClick={onOpenModal}>
Edit
@ -141,7 +143,8 @@ export default function DefaultValue() {
<Flex vertical gap={8} justify="space-between">
<div style={{ fontSize: 12, fontWeight: 600, color: 'rgba(0,0,0,0.4)' }}>CURRENT PERCENTAGE</div>
<div
style={{ fontSize: 24, fontWeight: 600, color: 'rgba(0,0,0,0.6)' }}
style={{ fontSize: 24, fontWeight: 600 }}
className={`${makeColorTextValue(currentPercentage)}`}
>{`${currentPercentage >= 0 ? `${currentPercentage} %` : '-'}`}</div>
<div style={{ fontSize: 11, fontWeight: 400, color: 'rgba(0,0,0,0.4)', fontStyle: 'italic' }}>
{`Value yang di terapkan hari ini ${dayjs().format('DD-MM-YYYY')}.`}

View File

@ -5,6 +5,7 @@ import { useEffect, useState } from 'react';
import { makeColorStatus, STATUS_DATA } from '@pos/base';
import { DeleteOutlined, EditOutlined, LockOutlined, UnlockOutlined } from '@ant-design/icons';
import { makeColorTextValue } from '../helpers';
export default function SchedulingData() {
const { modal } = App.useApp();
@ -73,16 +74,6 @@ export default function SchedulingData() {
});
};
function makeColorText(value: number) {
if (value <= 30) {
return 'text-red-500';
} else if (value > 30 && value <= 80) {
return 'text-yellow-500';
} else if (value > 80 && value <= 100) {
return 'text-green-500';
}
}
useEffect(() => {
handleGetData(1);
}, []);
@ -100,8 +91,8 @@ export default function SchedulingData() {
<List.Item key={item.id} style={{ borderBlockEnd: 'none', padding: 5 }}>
<Card style={{ width: '100%' }}>
<Flex justify="space-between" style={{ width: '100%' }}>
<Row className="w-full">
<Col span={12}>
<Row className="w-full" gutter={[4, 4]}>
<Col xs={18} sm={12} span={12}>
<Flex align="center" className="h-full" gap={4}>
<div>
<div className="text-[#00000066]">{item.name}</div>
@ -109,16 +100,16 @@ export default function SchedulingData() {
</div>
</Flex>
</Col>
<Col span={12}>
<Col xs={18} sm={12} span={12}>
<Flex align="center" className="h-full" gap={8}>
<div
className={`text-2xl font-bold ${makeColorText(item.indexing_key)}`}
className={`text-2xl font-bold ${makeColorTextValue(item.indexing_key)}`}
>{`${item.indexing_key} %`}</div>
<Tag color={makeColorStatus(item.status)}>{item.status}</Tag>
</Flex>
</Col>
</Row>
<Flex align="center" gap={12}>
<Flex align="center" gap={4}>
<Tooltip title="Edit" trigger={'hover'} placement="bottom">
<Button icon={<EditOutlined />} />
</Tooltip>

View File

@ -0,0 +1,11 @@
export function makeColorTextValue(value: number) {
if (value <= 30) {
return 'text-red-500';
} else if (value > 30 && value <= 80) {
return 'text-yellow-500';
} else if (value > 80 && value <= 100) {
return 'text-green-500';
} else {
return 'text-[#00000066]';
}
}