Browse Source

update

pull/2/head
Muhammad Sulaiman Yusuf 2 years ago
parent
commit
6956594de7
  1. 3
      src/const/ApiConst.js
  2. 134
      src/views/DashboardPMOV1/tableDashboardv1.js

3
src/const/ApiConst.js

@ -126,8 +126,7 @@ switch (APP_MODE) {
break;
case 'ADW':
// BASE_OSPRO = "https://ospro-api.ospro.id"
BASE_OSPRO = "https://api-staging-adw.ospro.id"
BASE_OSPRO = "https://adw-api.ospro.id"
BASE_SIMPRO_LUMEN = `${BASE_OSPRO}/api`;
BASE_SIMPRO_LUMEN_IMAGE = `${BASE_OSPRO}/assets/image`;

134
src/views/DashboardPMOV1/tableDashboardv1.js

@ -29,12 +29,13 @@ const TableDashboardV1 = () => {
}
const [MANPOWERS, SET_MANPOWERS] = useState(0)
const [MAXPLANNEDCOST, SET_MAXPLANNEDCOST] = useState(0)
const [MAXACTUALCOST, SET_MAXACTUALCOST] = useState(0)
const [MAXCOSTVARIANCE, SET_MAXCOSTVARIANCE] = useState(0)
const [dataTable, setDataTable] = useState([])
const [searchText, setSearchText] = useState('')
const [searchedColumn, setSearchedColumn] = useState('')
const searchInput = useRef(null)
const [maxSlider, setMaxSlider] = useState(MANPOWERS)
//const [sliderValue, setSliderValue] = useState([]);
const handleSearch = (selectedKeys, confirm, dataIndex) => {
confirm()
@ -46,12 +47,8 @@ const TableDashboardV1 = () => {
confirm({ closeDropdown: false });
};
const slider = (dataIndex) => ({
const slider = (dataIndex, maxSlider) => ({
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm, clearFilters }) => {
if(dataIndex == 'manpower'){
setMaxSlider(MANPOWERS)
}
return (
<div
className="custom-filter-dropdown ant-table-filter-dropdown"
@ -71,6 +68,7 @@ const TableDashboardV1 = () => {
range={true}
min={0}
max={maxSlider}
defaultValue={[0, maxSlider]}
onAfterChange={(value) => {
setSelectedKeys([value])
handleSlide(dataIndex, value, confirm)}
@ -82,40 +80,10 @@ const TableDashboardV1 = () => {
<div>
<strong>Max:</strong>
</div>
<div>{maxSlider}</div>
<div style={{ whitespace: "nowrap", overflow: "hidden" }} ellipsis={true}>{dataIndex == 'manpower' || dataIndex == 'progress' ? maxSlider : formatRibuanDecimal(maxSlider)}</div>
</div>
</Col>
</Row>
{/* <Row style={{ marginBottom: "10px" }}>
<Col span={24}>
<InputNumber
min={0}
max={maxSlider}
value={sliderValue[0]}
style={{ width: '100%' }}
placeholder={"Min"}
onChange={(value) => {
setSelectedKeys([value])
handleSlide(dataIndex, value, confirm)}
}
/>
</Col>
</Row> */}
{/* <Row>
<Col span={24}>
<InputNumber
min={0}
max={maxSlider}
style={{ width: '100%' }}
placeholder={"Max"}
onChange={(value) => {
console.log(value)
setSelectedKeys([value])
handleSlide(dataIndex, value, confirm)}
}
/>
</Col>
</Row> */}
</div>
)},
onFilter: (value, record) => {
@ -203,7 +171,7 @@ const TableDashboardV1 = () => {
setTimeout(() => searchInput.current?.select(), 100);
}
},
render: (text) =>
render: (text, record) =>
searchedColumn === dataIndex ? (
<Highlighter
highlightStyle={{
@ -215,10 +183,82 @@ const TableDashboardV1 = () => {
textToHighlight={text ? text.toString() : ''}
/>
) : (
text
<>
<Link to={`/dashboard-project/${record.id}/${record.lastGanttId}`}>
{record.kode_sortname} <br /> {text}
</Link>
</>
),
});
const filterDate = (dataIndex) => ({
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm, clearFilters }) => {
return (
<div
style={{
padding: 8,
}}
>
<InputNumber
ref={searchInput}
placeholder={`Year`}
value={selectedKeys[0]}
min={2020}
max={2050}
//onChange={(e) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
onChange={(e) => console.log(e)}
style={{
marginBottom: 8,
display: 'block',
}}
/>
<Space>
<Button
type="primary"
onClick={() => handleSearch(selectedKeys, confirm, dataIndex)}
icon={<SearchOutlined />}
size="small"
style={{
width: 90,
}}
>
Search
</Button>
<Button
onClick={() => clearFilters && handleReset(clearFilters)}
size="small"
style={{
width: 90,
}}
>
Reset
</Button>
<Button
type="link"
size="small"
onClick={() => {
confirm({
closeDropdown: false,
});
setSearchText(selectedKeys[0]);
setSearchedColumn(dataIndex);
}}
>
</Button>
</Space>
</div>
)},
onFilter: (value, record) => {
return record[dataIndex].toString().toLowerCase().includes(value.toLowerCase())
},
onFilterDropdownVisibleChange: (visible) => {
if (visible) {
setTimeout(() => searchInput.current?.select(), 100);
}
}
});
const getProjects = async () => {
const URL = `${BASE_OSPRO}/api/project/list`
const result = await axios.get(URL, HEADER).then(res => res).catch(err => err.response)
@ -226,6 +266,9 @@ const TableDashboardV1 = () => {
if (result.data.code == 200) {
setDataTable(result.data.data);
result.data.manpowers != undefined ? SET_MANPOWERS(result.data.manpowers) : SET_MANPOWERS(0)
SET_MAXPLANNEDCOST(Math.max(...result.data.data.map(o => o.plannedCost)))
SET_MAXACTUALCOST(Math.max(...result.data.data.map(o => o.actualCost)))
SET_MAXCOSTVARIANCE(Math.max(...result.data.data.map(o => o.costVariance)))
}
}
@ -251,6 +294,7 @@ const TableDashboardV1 = () => {
title: 'Planned Interval',
dataIndex: 'plannedInterval',
key: 'plannedInterval',
...filterDate('plannedInterval'),
},
{
title: 'Manpower',
@ -259,26 +303,29 @@ const TableDashboardV1 = () => {
render: (text) => {
return `${text}/${MANPOWERS}`
},
...slider('manpower')
...slider('manpower', MANPOWERS)
},
{
title: 'Budget Project',
dataIndex: 'plannedCost',
key: 'plannedCost',
render: (text) => <a>{formatRibuanDecimal(text)}</a>,
filterDropdown: slider
...slider('plannedCost', MAXPLANNEDCOST)
},
{
title: 'Actual Cost',
dataIndex: 'actualCost',
key: 'actualCost',
render: (text) => <a>{formatRibuanDecimal(text)}</a>,
...slider('actualCost', MAXACTUALCOST)
},
{
title: 'Cost Variance',
dataIndex: 'costVariance',
key: 'costVariance',
render: (text) => <a>{formatRibuanDecimal(text)}</a>,
...slider('costVariance', MAXCOSTVARIANCE)
},
{
title: 'Cost Health',
@ -302,7 +349,8 @@ const TableDashboardV1 = () => {
key: 'progress',
render: (text) => {
return <Badge color={parseInt(text) > 74 ? 'success' : text > 49 ? 'warning' : 'danger'}>{text}%</Badge>
}
},
...slider('progress', 100)
},
];

Loading…
Cancel
Save