| @@ -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'; | |||