alex
/
PNSPS-frontend-MaterialUI
1
0
Fork 0
Code Issues 0 Pull-Requests 0 Releases 0 Wiki Aktivität
Quellcode durchsuchen

shoow remark and hidden Pay btn when status != confirmed

master
Anna Ho vor 2 Jahren
Ursprung
503574d98c
Commit
84b574664e
1 geänderte Dateien mit 172 neuen und 94 gelöschten Zeilen
Geteilte Ansicht
Diff-Optionen
Statistiken anzeigen Patch-Datei herunterladen Vergleichs-Datei herunterladen
  1. +172
    -94
      src/pages/PublicNoticeDetail/ApplicationDetailCard.js

+ 172
- 94
src/pages/PublicNoticeDetail/ApplicationDetailCard.js Datei anzeigen

@@ -1,8 +1,8 @@
// material-ui
import {
FormControl,
FormControl,
Button,
Grid,
Grid,
// InputAdornment,
Typography, FormLabel,
OutlinedInput,
@@ -10,11 +10,11 @@ import {
} from '@mui/material';
// import MainCard from "../../components/MainCard";
const MainCard = Loadable(lazy(() => import('components/MainCard')));
import {useForm} from "react-hook-form";
import { useForm } from "react-hook-form";
import {
useEffect,
useState
} from "react";
} from "react";
// import Checkbox from "@mui/material/Checkbox";
import Loadable from 'components/Loadable';

@@ -32,34 +32,34 @@ import EditNoteIcon from '@mui/icons-material/EditNote';
import DownloadIcon from '@mui/icons-material/Download';
// ==============================|| DASHBOARD - DEFAULT ||============================== //
const ApplicationDetailCard = (
{ applicationDetailData,
{ applicationDetailData,
setStatus,
// updateUserObject,
// isNewRecord
}
) => {
) => {
// const params = useParams();
const [currentApplicationDetailData, setCurrentApplicationDetailData] = useState({});
const [companyName, setCompanyName] = useState({});
const [fileDetail, setfileDetail] = useState({});
const [onReady,setOnReady] = useState(false);
const [issueNum,setIssueNum] = useState("");
const [issueDate,setIssueDate] = useState("");
const {register,
const [onReady, setOnReady] = useState(false);
const [issueNum, setIssueNum] = useState("");
const [issueDate, setIssueDate] = useState("");
const { register,
// getValues
} = useForm()

useEffect(() => {
//if user data from parent are not null
// console.log(applicationDetailData)
if (Object.keys(applicationDetailData).length > 0 &&applicationDetailData.data!==null) {
if (Object.keys(applicationDetailData).length > 0 && applicationDetailData.data !== null) {
setCurrentApplicationDetailData(applicationDetailData.data);
setCompanyName(applicationDetailData.companyName);
setfileDetail(applicationDetailData.fileDetail);
setIssueNum(applicationDetailData.gazetteIssueDetail.volume+"/"+applicationDetailData.gazetteIssueDetail.year
+" No. "+applicationDetailData.gazetteIssueDetail.issueNo);
setIssueNum(applicationDetailData.gazetteIssueDetail.volume + "/" + applicationDetailData.gazetteIssueDetail.year
+ " No. " + applicationDetailData.gazetteIssueDetail.issueNo);
setIssueDate(DateUtils.dateFormat(applicationDetailData.gazetteIssueDetail.issueDate, "D MMM YYYY (ddd)"));
}
}, [applicationDetailData]);

@@ -73,78 +73,85 @@ const ApplicationDetailCard = (

const onDownloadClick = () => () => {
HttpUtils.fileDownload({
fileId:fileDetail.id,
skey:fileDetail.skey,
filename:fileDetail.filename,
fileId: fileDetail.id,
skey: fileDetail.skey,
filename: fileDetail.filename,
});
};

const cancelledClick = () => () =>{
const cancelledClick = () => () => {
setStatus("cancel")
};

return (
!onReady ?
<LoadingComponent/>
<LoadingComponent />
:
<MainCard elevation={0}
border={false}
content={false}
border={false}
content={false}
>
<Grid container spacing={1} direction="row">
<Grid item xs={12}>
<Stack
<Stack
direction="row"
justifyContent="space-between"
alignItems="center"
spacing={2}
mb={2}
>
{
currentApplicationDetailData.status == "confirmed"?
<Button
// size="large"
variant="contained"
// onClick={handleNewUserClick}
disabled= {currentApplicationDetailData.status =="rejected"||currentApplicationDetailData.status =="cancelled"||currentApplicationDetailData.status =="paid"}
disabled={currentApplicationDetailData.status == "rejected" || currentApplicationDetailData.status == "cancelled" || currentApplicationDetailData.status == "paid"}
sx={{
textTransform: 'capitalize',
alignItems: 'end'
}}>
<EditNoteIcon/>
<EditNoteIcon />
<Typography ml={1}> 支付</Typography>
</Button>
:<div></div>
}


<Button
// size="large"
variant="contained"
onClick={cancelledClick()}
disabled= {currentApplicationDetailData.status !=="submitted"}
sx={{
textTransform: 'capitalize',
alignItems: 'end',
backgroundColor:'#ffa733'
}}>
<CloseIcon/>
<Typography ml={1}> 取消</Typography>
</Button>
// size="large"
variant="contained"
onClick={cancelledClick()}
disabled={currentApplicationDetailData.status !== "submitted"}
sx={{
textTransform: 'capitalize',
alignItems: 'end',
backgroundColor: '#ffa733'
}}>
<CloseIcon />
<Typography ml={1}> 取消</Typography>
</Button>
</Stack>
</Grid>
</Grid>
<Typography variant="h5" sx={{mb: 2, borderBottom: "1px solid black"}}>
公共啟事申請資料
<Typography variant="h5" sx={{ mb: 2, borderBottom: "1px solid black" }}>
公共啟事申請資料
</Typography>
<form>
<Grid container direction="column">
<Grid item xs={12} md={12}>
<Grid container direction="row" justifyContent="space-between"
alignItems="center">
<Grid item xs={12} md={6} lg={6} sx={{mb: 1}}>
<Grid item xs={12} md={6} lg={6} sx={{ mb: 1 }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3}
sx={{display: 'flex', alignItems: 'center'}}>
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>申請編號:</FormLabel>
</Grid>

<Grid item xs={12} md={9} lg={9}>
<FormControl variant="outlined" fullWidth disabled>
<FormControl variant="outlined" fullWidth disabled>
<OutlinedInput
fullWidth
size="small"
@@ -153,15 +160,21 @@ const ApplicationDetailCard = (
value: currentApplicationDetailData.appNo,
})}
id='appNo'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
</FormControl>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} md={5} lg={5} sx={{mb: 1, ml:1}}>
<Grid item xs={12} md={5} lg={5} sx={{ mb: 1, ml: 1 }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3}
sx={{display: 'flex', alignItems: 'center'}}>
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>申請狀態:</FormLabel>
</Grid>

@@ -175,43 +188,55 @@ const ApplicationDetailCard = (
</Grid>
<Grid container direction="row" justifyContent="space-between"
alignItems="center">
<Grid item xs={12} md={6} lg={6} sx={{mb: 1}}>
<Grid item xs={12} md={6} lg={6} sx={{ mb: 1 }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3}
sx={{display: 'flex', alignItems: 'center'}}>
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>申請人:</FormLabel>
</Grid>

<Grid item xs={12} md={9} lg={9}>
<FormControl variant="outlined" fullWidth disabled >
{ currentApplicationDetailData.orgId===null?
<OutlinedInput
fullWidth
size="small"
{...register("contactPerson",
{
value: currentApplicationDetailData.contactPerson,
})}
id='contactPerson'
/>:
<OutlinedInput
fullWidth
size="small"
{...register("companyName",
{
value: companyName.enCompanyName,
})}
id='companyName'
/>
{currentApplicationDetailData.orgId === null ?
<OutlinedInput
fullWidth
size="small"
{...register("contactPerson",
{
value: currentApplicationDetailData.contactPerson,
})}
id='contactPerson'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/> :
<OutlinedInput
fullWidth
size="small"
{...register("companyName",
{
value: companyName.enCompanyName,
})}
id='companyName'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
}
</FormControl>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} md={5} lg={5} sx={{mb: 1, ml:1}}>
<Grid item xs={12} md={5} lg={5} sx={{ mb: 1, ml: 1 }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3}
sx={{display: 'flex', alignItems: 'center'}}>
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>憲報期數:</FormLabel>
</Grid>

@@ -225,24 +250,30 @@ const ApplicationDetailCard = (
value: issueNum,
})}
id='issueNum'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
</FormControl>
</Stack>
</Grid>
</Grid>
</Grid>
</Grid>
</Grid>
<Grid container direction="row" justifyContent="space-between"
alignItems="center">
<Grid item xs={12} md={6} lg={6} sx={{mb: 1}}>
<Grid item xs={12} md={6} lg={6} sx={{ mb: 1 }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3}
sx={{display: 'flex', alignItems: 'center'}}>
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>聯絡人:</FormLabel>
</Grid>

<Grid item xs={12} md={9} lg={9}>
<FormControl variant="outlined" fullWidth disabled>
<FormControl variant="outlined" fullWidth disabled>
<OutlinedInput
fullWidth
size="small"
@@ -251,15 +282,21 @@ const ApplicationDetailCard = (
value: currentApplicationDetailData.contactPerson,
})}
id='contactPerson'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
</FormControl>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} md={5} lg={5} sx={{mb: 1, ml:1}}>
<Grid item xs={12} md={5} lg={5} sx={{ mb: 1, ml: 1 }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3}
sx={{display: 'flex', alignItems: 'center'}}>
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>發布日期:</FormLabel>
</Grid>

@@ -273,6 +310,12 @@ const ApplicationDetailCard = (
value: issueDate,
})}
id='issueDate'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
</FormControl>
</Stack>
@@ -280,16 +323,16 @@ const ApplicationDetailCard = (
</Grid>
</Grid>
</Grid>
<Grid item xs={12} md={6} lg={6} sx={{mb: 1,}}>
<Grid item xs={12} md={6} lg={6} sx={{ mb: 1, }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3}
sx={{display: 'flex', alignItems: 'center'}}>
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>聯絡電話:</FormLabel>
</Grid>

<Grid item xs={12} md={9} lg={9}>
<Stack direction="row">
<FormControl variant="outlined" sx={{width:'25%'}} disabled>
<FormControl variant="outlined" sx={{ width: '25%' }} disabled>
<OutlinedInput
size="small"
{...register("countryCode",
@@ -297,9 +340,15 @@ const ApplicationDetailCard = (
value: currentApplicationDetailData.contactTelNo.countryCode,
})}
id='countryCode'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
</FormControl>
<FormControl variant="outlined" sx={{width:'100%'}} disabled>
<FormControl variant="outlined" sx={{ width: '100%' }} disabled>
<OutlinedInput
size="small"
{...register("phoneNumber",
@@ -307,22 +356,28 @@ const ApplicationDetailCard = (
value: currentApplicationDetailData.contactTelNo.phoneNumber,
})}
id='phoneNumber'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
</FormControl>
</Stack>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} md={6} lg={6} sx={{mb: 1,}}>
<Grid item xs={12} md={6} lg={6} sx={{ mb: 1, }}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3}
sx={{display: 'flex', alignItems: 'center'}}>
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>傳真號碼:</FormLabel>
</Grid>

<Grid item xs={12} md={9} lg={9}>
<Stack direction="row">
<FormControl variant="outlined" sx={{width:'25%'}} disabled>
<FormControl variant="outlined" sx={{ width: '25%' }} disabled>
<OutlinedInput
size="small"
{...register("countryCode",
@@ -330,9 +385,15 @@ const ApplicationDetailCard = (
value: currentApplicationDetailData.contactFaxNo.countryCode,
})}
id='countryCode'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
</FormControl>
<FormControl variant="outlined" sx={{width:'100%'}} disabled>
<FormControl variant="outlined" sx={{ width: '100%' }} disabled>
<OutlinedInput
size="small"
{...register("faxNumber",
@@ -340,6 +401,12 @@ const ApplicationDetailCard = (
value: currentApplicationDetailData.contactFaxNo.faxNumber,
})}
id='faxNumber'
sx={{
"& .MuiInputBase-input.Mui-disabled": {
WebkitTextFillColor: "#000000",
background: "#f8f8f8",
},
}}
/>
</FormControl>
</Stack>
@@ -353,31 +420,31 @@ const ApplicationDetailCard = (
<Grid item xs={12} md={6} lg={6}>
<Grid container direction="row">
<Grid item xs={12} md={3} lg={3}
sx={{display: 'flex', alignItems: 'center'}}>
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>犒件檔案:</FormLabel>
</Grid>
<Grid item xs={12} md={9} lg={9} sx={{display: 'flex', alignItems: 'center'}}>
<Grid item xs={12} md={9} lg={9} sx={{ display: 'flex', alignItems: 'center' }}>
<Grid container direction="row" justifyContent="flex-start">
<Grid item xs={12} md={5} lg={5} sx={{display: 'flex', alignItems: 'center'}}>
<Grid item xs={12} md={5} lg={5} sx={{ display: 'flex', alignItems: 'center' }}>
<FormControl variant="outlined" fullWidth >
<Typography
fullWidth
id='fileName'
>
{fileDetail.filename}
{fileDetail.filename}
</Typography>
</FormControl>
</Grid>
<Grid item md={2} lg={2}>
<Grid item md={2} lg={2}>
<Button
size="small"
variant="contained"
onClick={onDownloadClick()}
sx={{
textTransform: 'capitalize',
alignItems: 'end',
}}>
<DownloadIcon/>
size="small"
variant="contained"
onClick={onDownloadClick()}
sx={{
textTransform: 'capitalize',
alignItems: 'end',
}}>
<DownloadIcon />
</Button>
</Grid>
</Grid>
@@ -386,7 +453,18 @@ const ApplicationDetailCard = (
</Grid>
</Grid>
</Grid>
</Grid>
</Grid>
<Grid item xs={12} md={6} lg={6} sx={{ mb: 1, paddingTop: 2}}>
<Grid container alignItems={"center"}>
<Grid item xs={12} md={3} lg={3}
sx={{ display: 'flex', alignItems: 'center' }}>
<FormLabel>備註:</FormLabel>
</Grid>
<Grid item xs={12} md={9} lg={9}>
<FormLabel>{currentApplicationDetailData.remarks}</FormLabel>
</Grid>
</Grid>
</Grid>
</Grid>
</Grid>
</form>


Verfassen Vorschau
Laden…
Abbrechen
Speichern