mirror of
https://github.com/CommunityOx/ox_lib.git
synced 2026-08-18 23:46:03 +01:00
feat(nui): Allow changing position of circle progressbar
This commit is contained in:
@@ -11,6 +11,7 @@ import { fetchNui } from "../utils/fetchNui";
|
|||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
duration: number;
|
duration: number;
|
||||||
|
position?: "middle" | "bottom";
|
||||||
}
|
}
|
||||||
|
|
||||||
// debugData([
|
// debugData([
|
||||||
@@ -25,6 +26,7 @@ interface Props {
|
|||||||
const CircleProgressbar: React.FC = () => {
|
const CircleProgressbar: React.FC = () => {
|
||||||
const [visible, setVisible] = React.useState(false);
|
const [visible, setVisible] = React.useState(false);
|
||||||
const [progressDuration, setProgressDuration] = React.useState(0);
|
const [progressDuration, setProgressDuration] = React.useState(0);
|
||||||
|
const [position, setPosition] = React.useState<"middle" | "bottom">("middle");
|
||||||
const [value, setValue] = React.useState(0);
|
const [value, setValue] = React.useState(0);
|
||||||
const [cancelled, setCancelled] = React.useState(false);
|
const [cancelled, setCancelled] = React.useState(false);
|
||||||
|
|
||||||
@@ -49,6 +51,7 @@ const CircleProgressbar: React.FC = () => {
|
|||||||
setVisible(true);
|
setVisible(true);
|
||||||
setValue(0);
|
setValue(0);
|
||||||
setProgressDuration(data.duration);
|
setProgressDuration(data.duration);
|
||||||
|
setPosition(data.position || "middle");
|
||||||
const onePercent = data.duration * 0.01;
|
const onePercent = data.duration * 0.01;
|
||||||
const updateProgress = setInterval(() => {
|
const updateProgress = setInterval(() => {
|
||||||
setValue((previousValue) => {
|
setValue((previousValue) => {
|
||||||
@@ -61,7 +64,7 @@ const CircleProgressbar: React.FC = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<Flex
|
<Flex
|
||||||
h="20%"
|
h={position === "middle" ? "100%" : "20%"}
|
||||||
w="100%"
|
w="100%"
|
||||||
position="absolute"
|
position="absolute"
|
||||||
bottom="0"
|
bottom="0"
|
||||||
|
|||||||
Reference in New Issue
Block a user