| @@ -100,7 +100,7 @@ export function FiDataGrid({ rows, columns, sx, autoHeight, | |||||
| function getDataList() { | function getDataList() { | ||||
| if(_doLoad.url == null) return; | |||||
| if(_doLoad?.url == null) return; | |||||
| if(_doLoad.params == null) _doLoad.params = {}; | if(_doLoad.params == null) _doLoad.params = {}; | ||||
| _doLoad.params.start = page*pageSize; | _doLoad.params.start = page*pageSize; | ||||
| _doLoad.params.limit = pageSize; | _doLoad.params.limit = pageSize; | ||||
| @@ -111,7 +111,7 @@ export function FiDataGrid({ rows, columns, sx, autoHeight, | |||||
| set_rows(responseData?.records); | set_rows(responseData?.records); | ||||
| setRowCount(responseData?.count); | setRowCount(responseData?.count); | ||||
| if(_doLoad.callback != null){ | if(_doLoad.callback != null){ | ||||
| _doLoad.callback(responseData?.records); | |||||
| _doLoad.callback(responseData); | |||||
| } | } | ||||
| } | } | ||||
| }); | }); | ||||
| @@ -1,5 +1,6 @@ | |||||
| // material-ui | // material-ui | ||||
| import * as React from 'react'; | import * as React from 'react'; | ||||
| import * as UrlUtils from "utils/ApiPathConst"; | |||||
| import * as DateUtils from "utils/DateUtils"; | import * as DateUtils from "utils/DateUtils"; | ||||
| import * as FormatUtils from "utils/FormatUtils"; | import * as FormatUtils from "utils/FormatUtils"; | ||||
| import * as PublicNoteStatusUtils from "utils/statusUtils/PublicNoteStatusUtils" | import * as PublicNoteStatusUtils from "utils/statusUtils/PublicNoteStatusUtils" | ||||
| @@ -7,8 +8,8 @@ import { FiDataGrid } from "components/FiDataGrid"; | |||||
| import { clickableLink } from 'utils/CommonFunction'; | import { clickableLink } from 'utils/CommonFunction'; | ||||
| // ==============================|| EVENT TABLE ||============================== // | // ==============================|| EVENT TABLE ||============================== // | ||||
| export default function SearchPublicNoticeTable({ recordList }) { | |||||
| const [rows, setRows] = React.useState(recordList); | |||||
| export default function SearchPublicNoticeTable({ searchCriteria, setPaymentCount, setPublishCount }) { | |||||
| const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria); | |||||
| const _sx = { | const _sx = { | ||||
| padding: "4 2 4 2", | padding: "4 2 4 2", | ||||
| @@ -27,8 +28,8 @@ export default function SearchPublicNoticeTable({ recordList }) { | |||||
| } | } | ||||
| React.useEffect(() => { | React.useEffect(() => { | ||||
| setRows(recordList); | |||||
| }, [recordList]); | |||||
| set_searchCriteria(searchCriteria); | |||||
| }, [searchCriteria]); | |||||
| const handleEditClick = (params) => () => { | const handleEditClick = (params) => () => { | ||||
| window.open('/application/' + params.row.id); | window.open('/application/' + params.row.id); | ||||
| @@ -54,15 +55,6 @@ export default function SearchPublicNoticeTable({ recordList }) { | |||||
| return PublicNoteStatusUtils.getStatusByTextEng(params.row.status, params.row.creditor); | return PublicNoteStatusUtils.getStatusByTextEng(params.row.status, params.row.creditor); | ||||
| } | } | ||||
| }, | }, | ||||
| // { | |||||
| // field: 'date', | |||||
| // headerName: 'Submit Date', | |||||
| // flex: 1, | |||||
| // minWidth: 200, | |||||
| // renderCell: (params) => { | |||||
| // return DateUtils.datetimeStr(params.row.created); | |||||
| // } | |||||
| // }, | |||||
| { | { | ||||
| id: 'contactPerson', | id: 'contactPerson', | ||||
| field: 'contactPerson', | field: 'contactPerson', | ||||
| @@ -70,10 +62,10 @@ export default function SearchPublicNoticeTable({ recordList }) { | |||||
| flex: 3, | flex: 3, | ||||
| minWidth: 300, | minWidth: 300, | ||||
| renderCell: (params) => { | renderCell: (params) => { | ||||
| let company = params.row.enCompanyName != null?params.row.enCompanyName: params.row.chCompanyName; | |||||
| let company = params.row.enCompanyName != null ? params.row.enCompanyName : params.row.chCompanyName; | |||||
| company = company != null ? company : ""; | company = company != null ? company : ""; | ||||
| return <div> | return <div> | ||||
| {params?.value}<br/>{company}<br/>Client Remark: {params.row.careOf} | |||||
| {params?.value}<br />{company}<br />Client Remark: {params.row.careOf} | |||||
| </div>; | </div>; | ||||
| } | } | ||||
| }, | }, | ||||
| @@ -88,7 +80,7 @@ export default function SearchPublicNoticeTable({ recordList }) { | |||||
| + " Vol. " + FormatUtils.zeroPad(params.row.issueVolume, 3) | + " Vol. " + FormatUtils.zeroPad(params.row.issueVolume, 3) | ||||
| + ", No. " + FormatUtils.zeroPad(params.row.issueNo, 2) | + ", No. " + FormatUtils.zeroPad(params.row.issueNo, 2) | ||||
| + ", " + DateUtils.dateFormat(params.row.issueDate, "D MMM YYYY (ddd)")} | + ", " + DateUtils.dateFormat(params.row.issueDate, "D MMM YYYY (ddd)")} | ||||
| <br/>{(params?.value)}</>; | |||||
| <br />{(params?.value)}</>; | |||||
| } | } | ||||
| }, | }, | ||||
| { | { | ||||
| @@ -108,11 +100,18 @@ export default function SearchPublicNoticeTable({ recordList }) { | |||||
| <FiDataGrid | <FiDataGrid | ||||
| sx={_sx} | sx={_sx} | ||||
| rowHeight={80} | |||||
| rows={rows} | |||||
| getRowHeight={() => 'auto'} | |||||
| columns={columns} | columns={columns} | ||||
| customPageSize={10} | customPageSize={10} | ||||
| onRowDoubleClick={handleEditClick} | onRowDoubleClick={handleEditClick} | ||||
| doLoad={{ | |||||
| url: UrlUtils.DEMAND_NOTE_PREVIEW + "/" + _searchCriteria.issueId, | |||||
| params: {}, | |||||
| callback: (responseData) => { | |||||
| setPaymentCount(responseData.paymentCount); | |||||
| setPublishCount(responseData.publishCount); | |||||
| } | |||||
| }} | |||||
| /> | /> | ||||
| </div> | </div> | ||||
| ); | ); | ||||
| @@ -20,7 +20,7 @@ const BackgroundHead = { | |||||
| backgroundImage: `url(${titleBackgroundImg})`, | backgroundImage: `url(${titleBackgroundImg})`, | ||||
| width: '100%', | width: '100%', | ||||
| height: '100%', | height: '100%', | ||||
| backgroundSize:'contain', | |||||
| backgroundSize: 'contain', | |||||
| backgroundRepeat: 'no-repeat', | backgroundRepeat: 'no-repeat', | ||||
| backgroundColor: '#0C489E', | backgroundColor: '#0C489E', | ||||
| backgroundPosition: 'right' | backgroundPosition: 'right' | ||||
| @@ -30,7 +30,6 @@ const BackgroundHead = { | |||||
| const Index = () => { | const Index = () => { | ||||
| const [record,setRecord] = React.useState([]); | |||||
| const [issueCombo, setIssueCombo] = React.useState([]); | const [issueCombo, setIssueCombo] = React.useState([]); | ||||
| const [searchCriteria, setSearchCriteria] = React.useState({}); | const [searchCriteria, setSearchCriteria] = React.useState({}); | ||||
| const [onReady, setOnReady] = React.useState(false); | const [onReady, setOnReady] = React.useState(false); | ||||
| @@ -38,29 +37,14 @@ const Index = () => { | |||||
| const [paymentCount, setPaymentCount] = React.useState(0); | const [paymentCount, setPaymentCount] = React.useState(0); | ||||
| const [publishCount, setPublishCount] = React.useState(0); | const [publishCount, setPublishCount] = React.useState(0); | ||||
| React.useEffect(()=>{ | |||||
| React.useEffect(() => { | |||||
| getIssueCombo(); | getIssueCombo(); | ||||
| },[]); | |||||
| }, []); | |||||
| React.useEffect(() => { | React.useEffect(() => { | ||||
| setOnReady(true); | setOnReady(true); | ||||
| }, [record]); | |||||
| React.useEffect(() => { | |||||
| loadGrid(); | |||||
| }, [searchCriteria]); | }, [searchCriteria]); | ||||
| function loadGrid(){ | |||||
| HttpUtils.get({ | |||||
| url: UrlUtils.DEMAND_NOTE_PREVIEW+"/"+searchCriteria.issueId, | |||||
| onSuccess: function(responseData){ | |||||
| setRecord(responseData.records); | |||||
| setPaymentCount(responseData.paymentCount); | |||||
| setPublishCount(responseData.publishCount); | |||||
| } | |||||
| }); | |||||
| } | |||||
| function getIssueCombo() { | function getIssueCombo() { | ||||
| HttpUtils.get({ | HttpUtils.get({ | ||||
| url: UrlUtils.GET_ISSUE_COMBO, | url: UrlUtils.GET_ISSUE_COMBO, | ||||
| @@ -78,9 +62,9 @@ const Index = () => { | |||||
| return ( | return ( | ||||
| !onReady ? | !onReady ? | ||||
| <LoadingComponent/> | |||||
| <LoadingComponent /> | |||||
| : | : | ||||
| <Grid container sx={{minHeight: '87vh', backgroundColor: 'backgroundColor.default'}} direction="column"> | |||||
| <Grid container sx={{ minHeight: '87vh', backgroundColor: 'backgroundColor.default' }} direction="column"> | |||||
| <Grid item xs={12}> | <Grid item xs={12}> | ||||
| <div style={BackgroundHead}> | <div style={BackgroundHead}> | ||||
| <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center"> | <Stack direction="row" height='70px' justifyContent="flex-start" alignItems="center"> | ||||
| @@ -91,22 +75,24 @@ const Index = () => { | |||||
| </div> | </div> | ||||
| </Grid> | </Grid> | ||||
| {/*row 1*/} | {/*row 1*/} | ||||
| <Grid item xs={12} md={12} lg={12} sx={{mb:-1}}> | |||||
| <SearchForm | |||||
| applySearch={applySearch} | |||||
| issueComboData={issueCombo} | |||||
| _paymentCount={paymentCount} | |||||
| _publishCount={publishCount} | |||||
| <Grid item xs={12} md={12} lg={12} sx={{ mb: -1 }}> | |||||
| <SearchForm | |||||
| applySearch={applySearch} | |||||
| issueComboData={issueCombo} | |||||
| _paymentCount={paymentCount} | |||||
| _publishCount={publishCount} | |||||
| /> | /> | ||||
| </Grid> | </Grid> | ||||
| {/*row 2*/} | {/*row 2*/} | ||||
| <Grid item xs={12} md={12} lg={12}> | <Grid item xs={12} md={12} lg={12}> | ||||
| <MainCard elevation={0} | <MainCard elevation={0} | ||||
| border={false} | |||||
| content={false} | |||||
| border={false} | |||||
| content={false} | |||||
| > | > | ||||
| <EventTable | <EventTable | ||||
| recordList={record} | |||||
| searchCriteria={searchCriteria} | |||||
| setPaymentCount={setPaymentCount} | |||||
| setPublishCount={setPublishCount} | |||||
| /> | /> | ||||
| </MainCard> | </MainCard> | ||||
| </Grid> | </Grid> | ||||
| @@ -21,7 +21,7 @@ import {PNSPS_BUTTON_THEME} from "../../../themes/buttonConst"; | |||||
| import {ThemeProvider} from "@emotion/react"; | import {ThemeProvider} from "@emotion/react"; | ||||
| // ==============================|| EVENT TABLE ||============================== // | // ==============================|| EVENT TABLE ||============================== // | ||||
| export default function SearchDemandNote({ recordList, reloadFun, applySearch }) { | |||||
| export default function SearchDemandNote({ searchCriteria, applySearch }) { | |||||
| const [isConfirmPopUp, setConfirmPopUp] = React.useState(false); | const [isConfirmPopUp, setConfirmPopUp] = React.useState(false); | ||||
| const [isSendPopUp, setSendPopUp] = React.useState(false); | const [isSendPopUp, setSendPopUp] = React.useState(false); | ||||
| @@ -29,13 +29,14 @@ export default function SearchDemandNote({ recordList, reloadFun, applySearch }) | |||||
| const [selectonWarning, setSelectonWarning] = React.useState(false); | const [selectonWarning, setSelectonWarning] = React.useState(false); | ||||
| const [wait, setWait] = React.useState(false); | const [wait, setWait] = React.useState(false); | ||||
| const [rows, setRows] = React.useState(recordList); | |||||
| const [rows, setRows] = React.useState([]); | |||||
| const [_searchCriteria, set_searchCriteria] = React.useState(searchCriteria); | |||||
| const [selectedRowItems, setSelectedRowItems] = React.useState([]); | const [selectedRowItems, setSelectedRowItems] = React.useState([]); | ||||
| const navigate = useNavigate() | const navigate = useNavigate() | ||||
| React.useEffect(() => { | React.useEffect(() => { | ||||
| setRows(recordList); | |||||
| }, [recordList]); | |||||
| set_searchCriteria(searchCriteria); | |||||
| }, [searchCriteria]); | |||||
| const handleDnClick = (params) => () => { | const handleDnClick = (params) => () => { | ||||
| navigate('/paymentPage/demandNote/details/' + params.id); | navigate('/paymentPage/demandNote/details/' + params.id); | ||||
| @@ -334,11 +335,17 @@ export default function SearchDemandNote({ recordList, reloadFun, applySearch }) | |||||
| onRowSelectionModelChange={(newSelection) => { | onRowSelectionModelChange={(newSelection) => { | ||||
| setSelectedRowItems(newSelection); | setSelectedRowItems(newSelection); | ||||
| }} | }} | ||||
| rows={rows} | |||||
| columns={columns} | columns={columns} | ||||
| customPageSize={100} | customPageSize={100} | ||||
| getRowHeight={() => 'auto'} | getRowHeight={() => 'auto'} | ||||
| onRowDoubleClick={handleRowDoubleClick} | onRowDoubleClick={handleRowDoubleClick} | ||||
| doLoad={{ | |||||
| url: UrlUtils.DEMAND_NOTE_LIST, | |||||
| params: _searchCriteria, | |||||
| callback: (responseData)=>{ | |||||
| setRows(responseData?.records); | |||||
| } | |||||
| }} | |||||
| /> | /> | ||||
| </Box> | </Box> | ||||
| <div> | <div> | ||||
| @@ -32,7 +32,6 @@ const BackgroundHead = { | |||||
| const UserSearchPage_Individual = () => { | const UserSearchPage_Individual = () => { | ||||
| const [record, setRecord] = React.useState([]); | |||||
| const [orgCombo, setOrgCombo] = React.useState([]); | const [orgCombo, setOrgCombo] = React.useState([]); | ||||
| const [issueCombo, setIssueCombo] = React.useState([]); | const [issueCombo, setIssueCombo] = React.useState([]); | ||||
| const [searchCriteria, setSearchCriteria] = React.useState({ | const [searchCriteria, setSearchCriteria] = React.useState({ | ||||
| @@ -44,28 +43,14 @@ const UserSearchPage_Individual = () => { | |||||
| const [onReady, setOnReady] = React.useState(false); | const [onReady, setOnReady] = React.useState(false); | ||||
| React.useEffect(() => { | React.useEffect(() => { | ||||
| getUserList(); | |||||
| getOrgCombo(); | getOrgCombo(); | ||||
| getIssueCombo(); | getIssueCombo(); | ||||
| }, []); | }, []); | ||||
| React.useEffect(() => { | React.useEffect(() => { | ||||
| setOnReady(true); | setOnReady(true); | ||||
| }, [record]); | |||||
| React.useEffect(() => { | |||||
| getUserList(); | |||||
| }, [searchCriteria]); | }, [searchCriteria]); | ||||
| function getUserList() { | |||||
| HttpUtils.get({ | |||||
| url: UrlUtils.DEMAND_NOTE_LIST, | |||||
| params: searchCriteria, | |||||
| onSuccess: function (responseData) { | |||||
| setRecord(responseData); | |||||
| } | |||||
| }); | |||||
| } | |||||
| function getOrgCombo() { | function getOrgCombo() { | ||||
| HttpUtils.get({ | HttpUtils.get({ | ||||
| @@ -128,9 +113,8 @@ const UserSearchPage_Individual = () => { | |||||
| sx={{ backgroundColor: '#fff' }} | sx={{ backgroundColor: '#fff' }} | ||||
| > | > | ||||
| <EventTable | <EventTable | ||||
| recordList={record} | |||||
| reloadFun={getUserList} | |||||
| applySearch={applySearch} | applySearch={applySearch} | ||||
| searchCriteria={searchCriteria} | |||||
| /> | /> | ||||
| </MainCard> | </MainCard> | ||||
| </Grid> | </Grid> | ||||
| @@ -182,8 +182,8 @@ export default function SearchPublicNoticeTable({ searchCriteria }) { | |||||
| doLoad={{ | doLoad={{ | ||||
| url:UrlUtils.GET_PUBLIC_NOTICE_LIST, | url:UrlUtils.GET_PUBLIC_NOTICE_LIST, | ||||
| params:_searchCriteria, | params:_searchCriteria, | ||||
| callback: function(dataList){ | |||||
| setRows(dataList); | |||||
| callback: function(responseData){ | |||||
| setRows(responseData?.records); | |||||
| } | } | ||||
| }} | }} | ||||
| /> | /> | ||||