@@ -9,8 +9,8 @@ import useJwt from 'auth/jwt/coreUseJwt'; | |||||
export const hostname = 'localhost'; | export const hostname = 'localhost'; | ||||
const hostPort = '8090'; | const hostPort = '8090'; | ||||
export const hostPath = `http://${hostname}:${hostPort}`; | export const hostPath = `http://${hostname}:${hostPort}`; | ||||
export const apiPath = `${hostPath}/api`; | |||||
//export const apiPath = `http://192.168.0.112:8090/api`; | //export const apiPath = `http://192.168.0.112:8090/api`; | ||||
export const apiPath = `${hostPath}/api`; | |||||
//export const apiPath = `/api`; | //export const apiPath = `/api`; | ||||
export const isUserLoggedIn = () => { | export const isUserLoggedIn = () => { | ||||
@@ -0,0 +1,79 @@ | |||||
// material-ui | |||||
import * as React from 'react'; | |||||
import { | |||||
DataGrid, | |||||
} from "@mui/x-data-grid"; | |||||
// ==============================|| EVENT TABLE ||============================== // | |||||
export function FiDataGrid({ rows, columns, sx, autoHeight, | |||||
hideFooterSelectedRowCount, rowModesModel, editMode, | |||||
pageSizeOptions, | |||||
...props }) { | |||||
const [_rows, set_rows] = React.useState([]); | |||||
const [_columns, set_columns] = React.useState([]); | |||||
const [_rowModesModel, set_rowModesModel] = React.useState({}); | |||||
const [_editMode, set_editMode] = React.useState("row"); | |||||
const [_pageSizeOptions, set_pageSizeOptions] = React.useState([5, 10, 25]); | |||||
const [_autoHeight, set_autoHeight] = React.useState(true); | |||||
const [myHideFooterSelectedRowCount, setMyHideFooterSelectedRowCount] = React.useState(true); | |||||
const [_sx, set_sx] = React.useState({ | |||||
padding: "4 2 4 2", | |||||
boxShadow: 1, | |||||
border: 1, | |||||
borderColor: '#DDD', | |||||
'& .MuiDataGrid-cell': { | |||||
borderTop: 1, | |||||
borderBottom: 1, | |||||
borderColor: "#EEE" | |||||
}, | |||||
'& .MuiDataGrid-footerContainer': { | |||||
border: 1, | |||||
borderColor: "#EEE" | |||||
} | |||||
}); | |||||
React.useEffect(() => { | |||||
if (sx) { | |||||
set_sx(sx); | |||||
} | |||||
if (hideFooterSelectedRowCount) { | |||||
setMyHideFooterSelectedRowCount(hideFooterSelectedRowCount); | |||||
} | |||||
if (rowModesModel) { | |||||
set_rowModesModel(rowModesModel) | |||||
} | |||||
if (rows) { | |||||
set_rows(rows) | |||||
} | |||||
if (columns) { | |||||
set_columns(columns) | |||||
} | |||||
if (pageSizeOptions) { | |||||
set_pageSizeOptions(pageSizeOptions) | |||||
} | |||||
if(autoHeight != undefined){ | |||||
set_autoHeight(autoHeight) | |||||
} | |||||
if(editMode){ | |||||
set_editMode(editMode); | |||||
} | |||||
}, []); | |||||
return ( | |||||
<DataGrid | |||||
{...props} | |||||
rows={_rows} | |||||
columns={_columns} | |||||
rowModesModel={_rowModesModel} | |||||
pageSizeOptions={_pageSizeOptions} | |||||
editMode={_editMode} | |||||
autoHeight={_autoHeight} | |||||
hideFooterSelectedRowCount={myHideFooterSelectedRowCount} | |||||
sx={_sx} | |||||
/> | |||||
); | |||||
} |
@@ -1,8 +1,6 @@ | |||||
// material-ui | // material-ui | ||||
import * as React from 'react'; | import * as React from 'react'; | ||||
import { | |||||
DataGrid, | |||||
} from "@mui/x-data-grid"; | |||||
import {FiDataGrid} from "components/FiDataGrid"; | |||||
import { | import { | ||||
Button | Button | ||||
} from '@mui/material'; | } from '@mui/material'; | ||||
@@ -13,7 +11,6 @@ import {useNavigate} from "react-router-dom"; | |||||
// ==============================|| EVENT TABLE ||============================== // | // ==============================|| EVENT TABLE ||============================== // | ||||
export default function BaseGrid({rows}) { | export default function BaseGrid({rows}) { | ||||
const [rowModesModel] = React.useState({}); | |||||
const navigate = useNavigate() | const navigate = useNavigate() | ||||
const handleDetailClick = (params) => () => { | const handleDetailClick = (params) => () => { | ||||
@@ -89,28 +86,14 @@ export default function BaseGrid({rows}) { | |||||
return ( | return ( | ||||
<div style={{height: 400, width: '100%', padding: 4}}> | <div style={{height: 400, width: '100%', padding: 4}}> | ||||
<DataGrid | |||||
hideFooterSelectedRowCount={true} | |||||
<FiDataGrid | |||||
rows={rows} | rows={rows} | ||||
columns={columns} | columns={columns} | ||||
editMode="row" | |||||
rowModesModel={rowModesModel} | |||||
initialState={{ | initialState={{ | ||||
pagination: { | pagination: { | ||||
paginationModel: {page: 0, pageSize: 5}, | paginationModel: {page: 0, pageSize: 5}, | ||||
}, | }, | ||||
}} | }} | ||||
pageSizeOptions={[5, 10]} | |||||
autoHeight = {true} | |||||
sx={{ | |||||
padding: "4 2 4 2", | |||||
boxShadow: 1, | |||||
border: 1, | |||||
borderColor: '#DDD', | |||||
'& .super-app-theme--header': { | |||||
backgroundColor: '#EEE', | |||||
}, | |||||
}} | |||||
/> | /> | ||||
</div> | </div> | ||||
); | ); | ||||
@@ -1,12 +1,10 @@ | |||||
// material-ui | // material-ui | ||||
import * as React from 'react'; | import * as React from 'react'; | ||||
import { | |||||
DataGrid, | |||||
} from "@mui/x-data-grid"; | |||||
import { | import { | ||||
Button | Button | ||||
} from '@mui/material'; | } from '@mui/material'; | ||||
import { useEffect } from "react"; | import { useEffect } from "react"; | ||||
import {FiDataGrid} from "components/FiDataGrid"; | |||||
import * as DateUtils from "utils/DateUtils"; | import * as DateUtils from "utils/DateUtils"; | ||||
import * as StatusUtils from "./PublicNoteStatusUtils"; | import * as StatusUtils from "./PublicNoteStatusUtils"; | ||||
import {useNavigate} from "react-router-dom"; | import {useNavigate} from "react-router-dom"; | ||||
@@ -14,7 +12,6 @@ import {useNavigate} from "react-router-dom"; | |||||
export default function SearchPublicNoticeTable({ recordList }) { | export default function SearchPublicNoticeTable({ recordList }) { | ||||
const [rows, setRows] = React.useState(recordList); | const [rows, setRows] = React.useState(recordList); | ||||
const [rowModesModel] = React.useState({}); | |||||
const navigate = useNavigate() | const navigate = useNavigate() | ||||
const handleDetailClick = (params) => () => { | const handleDetailClick = (params) => () => { | ||||
@@ -98,27 +95,14 @@ export default function SearchPublicNoticeTable({ recordList }) { | |||||
return ( | return ( | ||||
<div style={{ height: 400, width: '100%' }}> | <div style={{ height: 400, width: '100%' }}> | ||||
<DataGrid | |||||
hideFooterSelectedRowCount={true} | |||||
<FiDataGrid | |||||
rows={rows} | rows={rows} | ||||
columns={columns} | columns={columns} | ||||
editMode="row" | |||||
rowModesModel={rowModesModel} | |||||
initialState={{ | initialState={{ | ||||
pagination: { | pagination: { | ||||
paginationModel: { page: 0, pageSize: 5 }, | paginationModel: { page: 0, pageSize: 5 }, | ||||
}, | }, | ||||
}} | }} | ||||
pageSizeOptions={[5, 10]} | |||||
autoHeight | |||||
sx={{ | |||||
boxShadow: 1, | |||||
border: 1, | |||||
borderColor: '#DDD', | |||||
'& .super-app-theme--header': { | |||||
backgroundColor: '#EEE', | |||||
}, | |||||
}} | |||||
/> | /> | ||||
</div> | </div> | ||||
); | ); | ||||
@@ -7,7 +7,7 @@ import { | |||||
// import { | // import { | ||||
// Button | // Button | ||||
// } from '@mui/material'; | // } from '@mui/material'; | ||||
// import * as DateUtils from "utils/DateUtils" | |||||
import * as DateUtils from "utils/DateUtils" | |||||
import * as StatusUtils from "../../PublicNotice/ListPanel/PublicNoteStatusUtils"; | import * as StatusUtils from "../../PublicNotice/ListPanel/PublicNoteStatusUtils"; | ||||
// ==============================|| EVENT TABLE ||============================== // | // ==============================|| EVENT TABLE ||============================== // | ||||
@@ -20,12 +20,11 @@ export default function StatusHistoryTab({rows}) { | |||||
id: 'created', | id: 'created', | ||||
field: 'created', | field: 'created', | ||||
headerName: 'Date', | headerName: 'Date', | ||||
valueGetter: (params) => { | |||||
const value = params.value | |||||
return value[0]+"/"+value[1]+"/"+value[2]+" "+value[3]+":"+value[4]+":"+value[5] | |||||
}, | |||||
// valueFormatter: (params) => dayjs(params.value).format('DD/MM/YYYY'), | |||||
flex: 1, | flex: 1, | ||||
valueGetter: (params) => { | |||||
return DateUtils.datetimeStr(params?.value); | |||||
} | |||||
}, | }, | ||||
{ | { | ||||
id: 'createdBy', | id: 'createdBy', | ||||
@@ -1,6 +1,7 @@ | |||||
// material-ui | // material-ui | ||||
import { | import { | ||||
Grid, | Grid, | ||||
Dialog, DialogTitle, DialogContent, DialogActions, | |||||
Typography, | Typography, | ||||
Button, | Button, | ||||
Stack, | Stack, | ||||
@@ -20,9 +21,12 @@ import {apiPath} from "auth/utils"; | |||||
const Mail = () => { | const Mail = () => { | ||||
const [isResponsPopUp, setIsResponsPopUp] = React.useState(false); | |||||
const [responsText, setResponsText] = React.useState(""); | |||||
const formik = useFormik({ | const formik = useFormik({ | ||||
enableReinitialize:true, | enableReinitialize:true, | ||||
initialValues:{}, | |||||
initialValues:{email:""}, | |||||
validationSchema:yup.object().shape({ | validationSchema:yup.object().shape({ | ||||
email: yup.string().max(255).required('請輸入e-Mail') | email: yup.string().max(255).required('請輸入e-Mail') | ||||
}), | }), | ||||
@@ -34,7 +38,16 @@ const Mail = () => { | |||||
email: values.email, | email: values.email, | ||||
}, | }, | ||||
onSuccess: function(){ | onSuccess: function(){ | ||||
setResponsText("Success"); | |||||
setIsResponsPopUp(true); | |||||
}, | |||||
onFail:(response)=>{ | |||||
setResponsText("Fail: "+response); | |||||
setIsResponsPopUp(true); | |||||
}, | |||||
onError:(error)=>{ | |||||
setResponsText("Error: "+error); | |||||
setIsResponsPopUp(true); | |||||
} | } | ||||
}); | }); | ||||
} | } | ||||
@@ -62,6 +75,7 @@ const Mail = () => { | |||||
type="email" | type="email" | ||||
placeholder="email" | placeholder="email" | ||||
label="eMail" | label="eMail" | ||||
onChange={formik.handleChange} | |||||
/> | /> | ||||
</Stack> | </Stack> | ||||
</Grid> | </Grid> | ||||
@@ -77,6 +91,17 @@ const Mail = () => { | |||||
</Button> | </Button> | ||||
</form> | </form> | ||||
<div> | |||||
<Dialog open={isResponsPopUp} onClose={() => setIsResponsPopUp(false)} > | |||||
<DialogTitle>Respons</DialogTitle> | |||||
<DialogContent style={{ display: 'flex', }}> | |||||
<Typography variant="h3" style={{ padding: '16px' }}>{responsText}</Typography> | |||||
</DialogContent> | |||||
<DialogActions> | |||||
<Button onClick={() => setIsResponsPopUp(false)}>OK</Button> | |||||
</DialogActions> | |||||
</Dialog> | |||||
</div> | |||||
</Grid> | </Grid> | ||||
@@ -16,7 +16,12 @@ export const convertToDate = (date)=>{ | |||||
if(date.length==3){ | if(date.length==3){ | ||||
return new Date(date[0],date[1]-1,date[2],0,0,0); | return new Date(date[0],date[1]-1,date[2],0,0,0); | ||||
} | } | ||||
return new Date(date[0],date[1]-1,date[2],date[3],date[4],date[5]); | |||||
return new Date(date[0] | |||||
,date[1]-1 | |||||
,date[2] | |||||
,date[3]?date[3]:0 | |||||
,date[4]?date[4]:0 | |||||
,date[5]?date[5]:0); | |||||
} | } | ||||
return date; | return date; | ||||
@@ -9,6 +9,7 @@ export const notNullFieldLabel = (label) => { | |||||
return (<>{label}<span style={{ "color": "red" }}>*</span></>) | return (<>{label}<span style={{ "color": "red" }}>*</span></>) | ||||
} | } | ||||
export const getDateField = ({ label, valueName, form, disabled }) => { | export const getDateField = ({ label, valueName, form, disabled }) => { | ||||
return <Grid container alignItems={"center"}> | return <Grid container alignItems={"center"}> | ||||
<Grid item xs={12} md={3} lg={3} sx={{ display: 'flex', alignItems: 'center' }}> | <Grid item xs={12} md={3} lg={3} sx={{ display: 'flex', alignItems: 'center' }}> | ||||