DPS_Manage/Component/CustomProgressBar.qml

import QtQuick 2.15
import QtQuick.Controls 2.15
import HuskarUI.Basic 1.0

Item {
    id: progressBarWrapper
    width: 120
    height: 12

    property int minimumValue: 0
    property int maximumValue: 100
    property int currentValue: 0

    Rectangle {
        id: backgroundRect
        width: progressBarWrapper.width
        height: progressBarWrapper.height
        color: "lightgray"
        radius: 14

        Rectangle {
            id: progressRect
            width: (progressBarWrapper.currentValue - progressBarWrapper.minimumValue) / (progressBarWrapper.maximumValue - progressBarWrapper.minimumValue) * backgroundRect.width
            height: backgroundRect.height
            color: "#66a333"
            radius: 14
        }
    }

    Text {
        id: progressText
        text: currentValue + "%"
        anchors.centerIn: parent
        font {
            pixelSize: 12
            family: HusTheme.Primary.fontPrimaryFamily
            bold: true
        }
        color: HusTheme.Primary.colorTextBase
    }
}