@@ -74,62 +74,66 @@ function Header(props) { | |||
isGLDLoggedIn() ? | |||
<div id="adminContent"> | |||
<li> | |||
<Link className="dashboard" to='/dashboard'><Typography variant={"headerTitle1"} sx={{ml:1}} >Dashboard</Typography></Link> | |||
<Link className="dashboard" to='/dashboard'><Typography variant={"headerTitle1"} sx={{ ml: 1 }} >Dashboard</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="application" to='/application/search'><Typography variant={"headerTitle1"} sx={{ml:1}}>Application</Typography></Link> | |||
<Link className="application" to='/application/search'><Typography variant={"headerTitle1"} sx={{ ml: 1 }}>Application</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="proof" to='/proof/search'><Typography variant={"headerTitle1"} sx={{ml:2}}>Proof</Typography></Link> | |||
<Link className="proof" to='/proof/search'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>Proof</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="payment" to='/dashboard'><Typography variant={"headerTitle1"} sx={{ml:2}}>Payment</Typography></Link> | |||
<Link className="payment" to='/dashboard'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>Payment</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="client" ><Typography variant={"headerTitle1"} sx={{ml:2}}>Client</Typography><KeyboardArrowDownIcon /></Link> | |||
<Link className="client" ><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>Client</Typography><KeyboardArrowDownIcon /></Link> | |||
<ul className='dropdown'> | |||
<li> | |||
<Link className="userSearchview" to='/userSearchview'><Typography variant={"headerTitle1"} sx={{ml:2}}>Users (GLD)</Typography></Link> | |||
<Link className="userSearchview" to='/userSearchview'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>Users (GLD)</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="indUser" to='/indUser'><Typography variant={"headerTitle1"} sx={{ml:2}}>Users (Individual)</Typography></Link> | |||
<Link className="indUser" to='/indUser'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>Users (Individual)</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="orgUser" to='/orgUser'><Typography variant={"headerTitle1"} sx={{ml:2}}>Users (Organization)</Typography></Link> | |||
<Link className="orgUser" to='/orgUser'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>Users (Organization)</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="org" to='/org'><Typography variant={"headerTitle1"} sx={{ml:2}}>Organization</Typography></Link> | |||
<Link className="org" to='/org'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>Organization</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="usergroupSearchview" to='/usergroupSearchview'><Typography variant={"headerTitle1"} sx={{ml:2}}>User Group</Typography></Link> | |||
<Link className="usergroupSearchview" to='/usergroupSearchview'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>User Group</Typography></Link> | |||
</li> | |||
</ul> | |||
</li> | |||
<li> | |||
<Link className="logout" onClick={handleLogout}><Typography variant={"headerTitle1"} sx={{ml:2}}>Logout</Typography></Link> | |||
<Link className="emailTemplate" to='/emailTemplate'><Typography variant={"headerTitle1"} sx={{ ml: 0 }}>Email Template</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="logout" onClick={handleLogout}><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>Logout</Typography></Link> | |||
</li> | |||
</div> | |||
: | |||
<div id="individualUserContent"> | |||
<li> | |||
<Link className="dashboard" to='/dashboard'><Typography variant={"headerTitle1"} sx={{ml:2}}>主頁</Typography></Link> | |||
<Link className="dashboard" to='/dashboard'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>主頁</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="myDocumet" to='/publicNotice'><Typography variant={"headerTitle1"} sx={{ml:0.5}}>我的公共啟事</Typography></Link> | |||
<Link className="myDocumet" to='/publicNotice'><Typography variant={"headerTitle1"} sx={{ ml: 0.5 }}>我的公共啟事</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="documentRecord" to='/proof/search'><Typography variant={"headerTitle1"} sx={{ml:1.5}}>校對記錄</Typography></Link> | |||
<Link className="documentRecord" to='/proof/search'><Typography variant={"headerTitle1"} sx={{ ml: 1.5 }}>校對記錄</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="paymentRecord" to='/paymentPage/search'><Typography variant={"headerTitle1"} sx={{ml:1.5}}>付款記錄</Typography></Link> | |||
<Link className="paymentRecord" to='/paymentPage/search'><Typography variant={"headerTitle1"} sx={{ ml: 1.5 }}>付款記錄</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="userSetting" to='/dashboard'><Typography variant={"headerTitle1"} sx={{ml:2}}>設定</Typography><KeyboardArrowDownIcon /></Link> | |||
<Link className="userSetting" to='/dashboard'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>設定</Typography><KeyboardArrowDownIcon /></Link> | |||
{isPrimaryLoggedIn() ? | |||
<ul className='dropdown'> | |||
<li> | |||
<Link className="manageOrgUser" to='setting/manageUser'><Typography variant={"headerTitle1"} sx={{ml:2}}>公司/機構用戶記錄</Typography></Link> | |||
<Link className="manageOrgUser" to='setting/manageUser'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>公司/機構用戶記錄</Typography></Link> | |||
</li> | |||
</ul> | |||
: | |||
@@ -137,7 +141,7 @@ function Header(props) { | |||
} | |||
</li> | |||
<li> | |||
<Link className="logout" onClick={handleLogout}><Typography variant={"headerTitle1"} sx={{ml:2}}>登出</Typography></Link> | |||
<Link className="logout" onClick={handleLogout}><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>登出</Typography></Link> | |||
</li> | |||
</div> | |||
); | |||
@@ -145,10 +149,10 @@ function Header(props) { | |||
const logoutContent = ( | |||
<div> | |||
<li> | |||
<Link className="login" to='/login'><Typography variant={"headerTitle1"} sx={{ml:2}}>登入</Typography></Link> | |||
<Link className="login" to='/login'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>登入</Typography></Link> | |||
</li> | |||
<li> | |||
<Link className="register" to='/register'><Typography variant={"headerTitle1"} sx={{ml:2}}>申請</Typography></Link> | |||
<Link className="register" to='/register'><Typography variant={"headerTitle1"} sx={{ ml: 2 }}>申請</Typography></Link> | |||
</li> | |||
</div> | |||
); | |||
@@ -0,0 +1,311 @@ | |||
// material-ui | |||
import { | |||
FormControl, | |||
Grid, | |||
Typography, | |||
FormLabel, | |||
OutlinedInput, | |||
Button, | |||
// TextField, | |||
// Autocomplete, | |||
} from '@mui/material'; | |||
// import { useFormik } from 'formik'; | |||
import * as React from "react"; | |||
import Loadable from 'components/Loadable'; | |||
const MainCard = Loadable(React.lazy(() => import('components/MainCard'))); | |||
import { useForm } from 'react-hook-form'; | |||
// ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
const ApplicationDetailCard = ({ | |||
formData, | |||
_onSubmit, | |||
handleDelete | |||
}) => { | |||
// const [data, setData] = React.useState({}); | |||
// React.useEffect(() => { | |||
// if (formData) { | |||
// setData(formData); | |||
// } | |||
// }, [formData]); | |||
// const formik = useFormik({ | |||
// enableReinitialize: true, | |||
// initialValues: data, | |||
// }); | |||
const DisplayField = ({ name, width, value, rows = 1, disabled = false }) => { | |||
return <OutlinedInput | |||
fullWidth | |||
multiline | |||
disabled={disabled} | |||
size="small" | |||
// onChange={formik.handleChange} | |||
{...register(name, | |||
{ | |||
value: value, | |||
})} | |||
id={name} | |||
name={name} | |||
variant="outlined" | |||
maxRows={6} | |||
rows={rows} | |||
sx={ | |||
{ | |||
"& .Mui-disabled": { | |||
WebkitTextFillColor: "#000000", | |||
background: "#f8f8f8", | |||
}, | |||
// "& .MuiInputBase-input.Mui-disabled": { | |||
// WebkitTextFillColor: "#000000", | |||
// background: "#f8f8f8", | |||
// }, | |||
width: width ? width : '100%' | |||
} | |||
} | |||
/>; | |||
} | |||
const { register, handleSubmit } = useForm() | |||
// const DisplaySelection = ({ name = "test", value = "", onChange }) => { | |||
// return <Autocomplete | |||
// {...register(name)} | |||
// disablePortal | |||
// id={name} | |||
// options={formData} | |||
// vale={value} | |||
// onChange={onChange} | |||
// renderInput={(params) => ( | |||
// <TextField {...params} | |||
// InputLabelProps={{ | |||
// shrink: true | |||
// }} | |||
// /> | |||
// )} | |||
// /> | |||
// } | |||
return ( | |||
<MainCard | |||
id={"emailTemplateMainCard"} | |||
border={false} | |||
content={false} | |||
> | |||
<Typography variant="h4" sx={{ textAlign: "left", mb: 2, borderBottom: "1px solid black" }}> | |||
Maintain Email Template | |||
</Typography> | |||
<form onSubmit={handleSubmit(_onSubmit)}> | |||
<Grid container direction="column"> | |||
<Grid item xs={12} md={12} lg={12}> | |||
<Grid container direction="row" justifyContent="space-between" | |||
alignItems="center"> | |||
{/* <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' }}> | |||
<FormLabel>Email Key:</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={9} lg={9}> | |||
<DisplaySelection | |||
/> | |||
</Grid> | |||
</Grid> | |||
</Grid> */} | |||
<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' }}> | |||
<FormLabel required>Key:</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={9} lg={9}> | |||
<DisplayField | |||
name={"tempKey"} | |||
value={formData?.tempKey} | |||
/> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
<Grid item xs={12} md={5} lg={5} sx={{ mb: 1 }}> | |||
<Grid container alignItems={"center"}> | |||
<Grid item xs={12} md={3} lg={3} | |||
sx={{ display: 'flex', alignItems: 'center' }}> | |||
<FormLabel>Description:</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={9} lg={9}> | |||
<FormControl variant="outlined" fullWidth disabled > | |||
<DisplayField | |||
name="description" | |||
value={formData?.description} | |||
/> | |||
</FormControl> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
<Grid container direction="row" justifyContent="space-between" | |||
alignItems="center"> | |||
<Grid item xs={12} md={12} lg={12} sx={{ mb: 1 }}> | |||
<Grid container alignItems={"center"}> | |||
<Grid item xs={12} md={1.5} lg={1.5} | |||
sx={{ display: 'flex', alignItems: 'center' }}> | |||
<FormLabel>Params:</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={10.5} lg={10.5}> | |||
<DisplayField | |||
name="params" | |||
value={formData?.params} | |||
/> | |||
</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 container alignItems={"center"}> | |||
<Grid item xs={12} md={3} lg={3} | |||
sx={{ display: 'flex', alignItems: 'center' }}> | |||
<FormLabel>Subject (Cht):</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={9} lg={9}> | |||
<DisplayField | |||
name="subjectCht" | |||
value={formData?.subjectCht} | |||
rows={2} | |||
/> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
<Grid container direction="row" justifyContent="space-between" | |||
alignItems="center" sx={{ mb: 1 }}> | |||
<Grid item xs={12} md={1.5} lg={1.5} | |||
sx={{ display: 'flex', alignItems: 'center' }}> | |||
<FormLabel>Content (Cht):</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={10.5} lg={10.5}> | |||
<DisplayField | |||
name="contentCht" | |||
value={formData?.contentCht} | |||
rows={4} | |||
/> | |||
</Grid> | |||
</Grid> | |||
<Grid container direction="row" justifyContent="space-between" | |||
alignItems="center"> | |||
<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' }}> | |||
<FormLabel>Subject (Chs):</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={9} lg={9}> | |||
<DisplayField | |||
name="subjectChs" | |||
value={formData?.subjectChs} | |||
rows={2} | |||
/> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
<Grid container direction="row" justifyContent="space-between" | |||
alignItems="center" sx={{ mb: 1 }}> | |||
<Grid item xs={12} md={1.5} lg={1.5} | |||
sx={{ display: 'flex', alignItems: 'center' }}> | |||
<FormLabel>Content (Chs):</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={10.5} lg={10.5}> | |||
<DisplayField | |||
name="contentChs" | |||
value={formData?.contentChs} | |||
rows={4} | |||
/> | |||
</Grid> | |||
</Grid> | |||
<Grid container direction="row" justifyContent="space-between" | |||
alignItems="center"> | |||
<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' }}> | |||
<FormLabel>Subject (Eng):</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={9} lg={9}> | |||
<DisplayField | |||
name="subjectEng" | |||
value={formData?.subjectEng} | |||
rows={2} | |||
/> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
<Grid container direction="row" justifyContent="space-between" | |||
alignItems="center" sx={{ mb: 1 }}> | |||
<Grid item xs={12} md={1.5} lg={1.5} | |||
sx={{ display: 'flex', alignItems: 'center' }}> | |||
<FormLabel>Content (Eng):</FormLabel> | |||
</Grid> | |||
<Grid item xs={12} md={10.5} lg={10.5}> | |||
<DisplayField | |||
name="contentEng" | |||
value={formData?.contentEng} | |||
rows={4} | |||
/> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
{/*bottom button*/} | |||
<Grid item s={12} md={12} lg={12} sx={{ mb: 3 }} alignItems={"end"} justifyContent="center"> | |||
<Grid container maxWidth justifyContent="flex-end"> | |||
<Grid item sx={{ ml: 3, mr: 3 }}> | |||
<Button | |||
size="large" | |||
color="error" | |||
variant="contained" | |||
onClick={handleDelete} | |||
sx={{ | |||
textTransform: 'capitalize', | |||
alignItems: 'end' | |||
}} | |||
> | |||
<Typography variant="h5">Delete</Typography> | |||
</Button> | |||
</Grid> | |||
<Grid item sx={{ ml: 3, mr: 3 }}> | |||
<Button | |||
size="large" | |||
variant="contained" | |||
type="submit" | |||
sx={{ | |||
textTransform: 'capitalize', | |||
alignItems: 'end' | |||
}} | |||
> | |||
<Typography variant="h5">Save</Typography> | |||
</Button> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
</Grid> | |||
</form> | |||
</MainCard> | |||
); | |||
}; | |||
export default ApplicationDetailCard; |
@@ -0,0 +1,155 @@ | |||
// material-ui | |||
import { | |||
Grid, | |||
Typography, | |||
Stack, | |||
Box, | |||
Button | |||
} from '@mui/material'; | |||
import * as UrlUtils from "utils/ApiPathConst"; | |||
import * as React from "react"; | |||
import ForwardIcon from '@mui/icons-material/Forward'; | |||
import Loadable from 'components/Loadable'; | |||
const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent'))); | |||
const EmailTemplate = Loadable(React.lazy(() => import('pages/EmailTemplate/Detail_GLD/EmailTemplateDetails'))) | |||
import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png' | |||
import { useParams } from 'react-router-dom'; | |||
import { useNavigate } from 'react-router-dom'; | |||
import axios from 'axios'; | |||
import { notifyDeleteSuccess, notifySaveSuccess } from 'utils/CommonFunction'; | |||
const BackgroundHead = { | |||
backgroundImage: `url(${titleBackgroundImg})`, | |||
width: '100%', | |||
height: '100%', | |||
backgroundSize: 'contain', | |||
backgroundRepeat: 'no-repeat', | |||
backgroundColor: '#0C489E', | |||
backgroundPosition: 'right' | |||
} | |||
// ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
const Index = () => { | |||
const [record, setRecord] = React.useState(null); | |||
const [onReady, setOnReady] = React.useState(false); | |||
const params = useParams() | |||
const navigate = useNavigate() | |||
React.useLayoutEffect(() => { | |||
loadForm(); | |||
}, []); | |||
React.useLayoutEffect(() => { | |||
if(record !== null || params.id <= 0) setOnReady(true); | |||
}, [record]); | |||
const loadForm = () => { | |||
if (params.id > 0) { | |||
axios.get(`${UrlUtils.GET_EMAIL}/${params.id}`) | |||
.then((response) => { | |||
if (response.status === 200) { | |||
console.log(response) | |||
setRecord(response.data.data) | |||
} | |||
}) | |||
.catch(error => { | |||
console.log(error); | |||
return false; | |||
}); | |||
} | |||
// HttpUtils.get({ | |||
// url: UrlUtils.GET_EMAIL, | |||
// params: { | |||
// id: params.id | |||
// }, | |||
// onSuccess: (responseData) => { | |||
// setRecord(responseData); | |||
// } | |||
// }); | |||
} | |||
const onSubmit = (data) => { | |||
axios.post(`${UrlUtils.POST_EMAIL_SAVE}`, | |||
{ | |||
id: params.id > 0 ? params.id : null, | |||
contentChs: data?.contentChs, | |||
contentCht: data?.contentCht, | |||
contentEng: data?.contentEng, | |||
description: data?.description, | |||
tempKey: data?.tempKey, | |||
params: data?.params, | |||
subjectChs: data?.subjectChs, | |||
subjectCht: data?.subjectCht, | |||
subjectEng: data?.subjectEng | |||
} | |||
).then((response) => { | |||
if (response.status === 200) { | |||
// location.reload(); | |||
navigate('/emailTemplate') | |||
notifySaveSuccess() | |||
} | |||
}) | |||
.catch(error => { | |||
console.log(error); | |||
return false; | |||
}); | |||
console.log(data) | |||
} | |||
const handleDelete = () => { | |||
axios.delete(`${UrlUtils.DELETE_EMAIL}/${params.id}`, | |||
) | |||
.then((response) => { | |||
console.log(response) | |||
if (response.status === 204) { | |||
// location.reload(); | |||
navigate('/emailTemplate'); | |||
notifyDeleteSuccess() | |||
} | |||
}) | |||
.catch(error => { | |||
console.log(error); | |||
return false; | |||
}); | |||
} | |||
return ( | |||
!onReady ? | |||
<LoadingComponent /> | |||
: | |||
( | |||
<Grid container sx={{ minHeight: '110vh', backgroundColor: 'backgroundColor.default' }} direction="column" justifyContent="flex-start" alignItems="center" > | |||
<Grid item xs={12} width="100%"> | |||
<div style={BackgroundHead} width="100%"> | |||
<Stack direction="row" height='70px'> | |||
<Typography ml={15} color='#FFF' variant="h4" sx={{ pt: 2 }}>Email Template</Typography> | |||
</Stack> | |||
</div> | |||
</Grid> | |||
<Grid item xs={12} width="100%"> | |||
<Button title="Back" sx={{ ml: 6, mt: 2.5 }} style={{ border: '2px solid' }} variant="outlined" onClick={() => { navigate("/emailTemplate") }}> | |||
<ForwardIcon style={{ height: 30, width: 50, transform: "rotate(180deg)" }} /> | |||
</Button> | |||
</Grid> | |||
{/*row 1*/} | |||
<Grid item xs={12} md={12} width="100%"> | |||
<Grid item xs={12} md={12} sx={{ pt: 2, ml: 6, mr: 6, mb: 6}}> | |||
<Box xs={12} md={12} sx={{ p: 4, borderRadius: '10px', backgroundColor: '#ffffff' }}> | |||
<EmailTemplate | |||
formData={record} | |||
_onSubmit={onSubmit} | |||
handleDelete={handleDelete} | |||
/> | |||
</Box> | |||
</Grid> | |||
</Grid> | |||
{/*row 2*/} | |||
</Grid > | |||
) | |||
); | |||
}; | |||
export default Index; |
@@ -0,0 +1,100 @@ | |||
// material-ui | |||
import * as React from 'react'; | |||
import { GridActionsCellItem, } from "@mui/x-data-grid"; | |||
import { FiDataGrid } from "components/FiDataGrid"; | |||
import EditIcon from '@mui/icons-material/Edit'; | |||
import { useEffect } from "react"; | |||
import { useNavigate } from "react-router-dom"; | |||
// ==============================|| EVENT TABLE ||============================== // | |||
export default function EmailTemplateTable({ recordList }) { | |||
const [rows, setRows] = React.useState(recordList); | |||
const navigate = useNavigate() | |||
useEffect(() => { | |||
setRows(recordList); | |||
}, [recordList]); | |||
const handleEditClick = (id) => () => { | |||
navigate('/emailTemplate/' + id); | |||
}; | |||
const columns = [ | |||
{ | |||
field: 'actions', | |||
type: 'actions', | |||
headerName: 'Actions', | |||
width: 100, | |||
cellClassName: 'actions', | |||
getActions: ({ id }) => { | |||
return [ | |||
<GridActionsCellItem | |||
key="OutSave" | |||
icon={<EditIcon />} | |||
label="Edit" | |||
className="textPrimary" | |||
onClick={handleEditClick(id)} | |||
color="primary" | |||
/>] | |||
}, | |||
}, | |||
{ | |||
id: 'tempKey', | |||
field: 'tempKey', | |||
headerName: 'Key', | |||
flex: 1, | |||
}, | |||
{ | |||
id: 'description', | |||
field: 'description', | |||
headerName: 'Description', | |||
flex: 1, | |||
}, | |||
{ | |||
id: 'params', | |||
field: 'params', | |||
headerName: 'Params', | |||
flex: 1, | |||
}, | |||
{ | |||
id: 'subjectCht', | |||
field: 'subjectCht', | |||
headerName: 'SubjectCht', | |||
flex: 1, | |||
}, | |||
{ | |||
id: 'subjectChs', | |||
field: 'subjectChs', | |||
headerName: 'SubjectChs', | |||
flex: 1, | |||
}, | |||
{ | |||
id: 'subjectEng', | |||
field: 'subjectEng', | |||
headerName: 'SubjectEng', | |||
flex: 1, | |||
}, | |||
]; | |||
function handleRowDoubleClick(params) { | |||
navigate('/emailTemplate/' + params.id); | |||
} | |||
return ( | |||
<div style={{ height: "fit-content", width: '100%' }}> | |||
<FiDataGrid | |||
rows={rows} | |||
columns={columns} | |||
initialState={{ | |||
pagination: { | |||
paginationModel: { page: 0, pageSize: 5 }, | |||
}, | |||
}} | |||
onRowDoubleClick={handleRowDoubleClick} | |||
getRowHeight={() => 'auto'} | |||
/> | |||
</div> | |||
); | |||
} |
@@ -0,0 +1,100 @@ | |||
// material-ui | |||
import { | |||
Grid, | |||
Typography, | |||
Stack, | |||
Button, | |||
} from '@mui/material'; | |||
import * as UrlUtils from "utils/ApiPathConst"; | |||
import * as React from "react"; | |||
import * as HttpUtils from "utils/HttpUtils"; | |||
import Loadable from 'components/Loadable'; | |||
const LoadingComponent = Loadable(React.lazy(() => import('pages/extra-pages/LoadingComponent'))); | |||
const EmailTemplateTable = Loadable(React.lazy(() => import('pages/EmailTemplate/Search_GLD/DataGrid'))) | |||
import titleBackgroundImg from 'assets/images/dashboard/gazette-bar.png' | |||
import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline'; | |||
import MainCard from 'components/MainCard'; | |||
const BackgroundHead = { | |||
backgroundImage: `url(${titleBackgroundImg})`, | |||
width: '100%', | |||
height: '100%', | |||
backgroundSize: 'contain', | |||
backgroundRepeat: 'no-repeat', | |||
backgroundColor: '#0C489E', | |||
backgroundPosition: 'right' | |||
} | |||
import { useNavigate } from "react-router"; | |||
// ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
const Index = () => { | |||
const [record, setRecord] = React.useState([]); | |||
const [onReady, setOnReady] = React.useState(false); | |||
const navigate = useNavigate() | |||
React.useLayoutEffect(() => { | |||
loadForm(); | |||
}, []); | |||
React.useLayoutEffect(() => { | |||
setOnReady(true); | |||
}, [record]); | |||
const loadForm = () => { | |||
HttpUtils.get({ | |||
url: UrlUtils.GET_EMAIL_LIST, | |||
onSuccess: (responseData) => { | |||
setRecord(responseData); | |||
} | |||
}); | |||
} | |||
return ( | |||
!onReady ? | |||
<LoadingComponent /> | |||
: | |||
( | |||
<Grid container sx={{ minHeight: '110vh', backgroundColor: 'backgroundColor.default' }} direction="column" justifyContent="flex-start" alignItems="center" > | |||
<Grid item xs={12} width="100%"> | |||
<div style={BackgroundHead} width="100%"> | |||
<Stack direction="row" height='70px'> | |||
<Typography ml={15} color='#FFF' variant="h4" sx={{ pt: 2 }}>Email Template</Typography> | |||
</Stack> | |||
</div> | |||
</Grid> | |||
{/*row 1*/} | |||
<Grid item xs={12} md={12} lg={12} width="100%"> | |||
<MainCard elevation={0} | |||
border={false} | |||
content={false} | |||
> | |||
<EmailTemplateTable | |||
recordList={record} | |||
/> | |||
</MainCard> | |||
</Grid> | |||
<Grid container direction="row" | |||
justifyContent="space-between" | |||
alignItems="center"> | |||
<Grid item xs={3} md={3} sx={{ ml: 3, mr: 1, mb: 3, mt: 3 }}> | |||
<Button | |||
size="large" | |||
variant="contained" | |||
onClick={()=>{navigate('/emailTemplate/-1')}} | |||
sx={{ | |||
textTransform: 'capitalize', | |||
alignItems: 'end' | |||
}}> | |||
<AddCircleOutlineIcon sx={{ mb: 0.5 }} /> | |||
<Typography sx={{ ml: 1 }} variant="h5">New Email Template</Typography> | |||
</Button> | |||
</Grid> | |||
</Grid> | |||
</Grid > | |||
) | |||
); | |||
}; | |||
export default Index; |
@@ -17,6 +17,8 @@ import Checkbox from "@mui/material/Checkbox"; | |||
import * as React from "react"; | |||
import AddCircleOutlineIcon from '@mui/icons-material/AddCircleOutline'; | |||
import { useNavigate } from "react-router"; | |||
import axios from "axios"; | |||
import { GET_EMAIL_LIST } from 'utils/ApiPathConst'; | |||
// ==============================|| DASHBOARD - DEFAULT ||============================== // | |||
@@ -53,6 +55,13 @@ const UserSearchForm = ({ applySearch }) => { | |||
setType([]); | |||
setLocked(false); | |||
reset(); | |||
axios.get(`${GET_EMAIL_LIST}`) | |||
.then(r => { | |||
console.log(r) | |||
}) | |||
.catch(err => { | |||
console.log(err) | |||
}) | |||
} | |||
const handleNewUserClick = () => { | |||
@@ -4,8 +4,8 @@ import axios from 'axios'; | |||
import { apiPath } from 'auth/utils'; | |||
const TestMailPage = () => { | |||
const [host, setHost] = useState(apiPath+'/test'); | |||
const [mail, setMail] = useState(''); | |||
const [host, setHost] = useState(apiPath+'/email/test'); | |||
const [mail, setMail] = useState('register'); | |||
const hostChange = (event) => { | |||
setHost(event.target.value); | |||
@@ -16,8 +16,8 @@ const TestMailPage = () => { | |||
}; | |||
const doMailTest = () => { | |||
axios.post(host, { | |||
email: mail | |||
axios.get(host, { | |||
tempKey: mail | |||
}) | |||
.then((response) => { | |||
console.log(response.data); | |||
@@ -20,6 +20,8 @@ const UserGroupDetailPage = Loadable(lazy(() => import('pages/pnspsUserGroupDeta | |||
const OrganizationSearchPage = Loadable(lazy(() => import('pages/OrganizationSearchPage'))); | |||
const OrganizationDetailPage = Loadable(lazy(() => import('pages/OrganizationDetailPage'))); | |||
const OrganizationDetailPage_fromUser = Loadable(lazy(() => import('pages/OrganizationDetailPage_FromUser'))); | |||
const EmailTemplatePage = Loadable(lazy(() => import('pages/EmailTemplate/Search_GLD'))); | |||
const EmailTemplateDetailPage = Loadable(lazy(() => import('pages/EmailTemplate/Detail_GLD'))); | |||
// ==============================|| AUTH ROUTING ||============================== // | |||
@@ -80,6 +82,14 @@ const SettingRoutes = { | |||
path: 'passwordpolicy', | |||
element: <PasswordPolicyPage /> | |||
}, | |||
{ | |||
path: 'emailTemplate', | |||
element: <EmailTemplatePage/> | |||
}, | |||
{ | |||
path: '/emailTemplate/:id', | |||
element: <EmailTemplateDetailPage/> | |||
}, | |||
] | |||
}; | |||
@@ -91,4 +91,11 @@ export const PAYMENT_APP_LIST = apiPath+'/payment/applist';//POST | |||
//User Group | |||
export const POST_AND_UPDATE_USER_GROUP = apiPath+'/group/save'; | |||
export const POST_AND_UPDATE_USER_GROUP = apiPath+'/group/save'; | |||
export const GET_EMAIL_LIST = apiPath+'/email/list'; | |||
export const GET_EMAIL_COMBO = apiPath+'/email/combo'; | |||
export const GET_EMAIL = apiPath+'/email/load'; | |||
export const POST_EMAIL_SAVE = apiPath+'/email/save'; | |||
export const DELETE_EMAIL = apiPath+'/email/delete'; |