Przeglądaj źródła

register form - upload file and tabindex fix

web-access-fix-2
Jason Chuang 15 godzin temu
rodzic
commit
1376d65ad4
10 zmienionych plików z 70 dodań i 29 usunięć
  1. +24
    -22
      src/pages/Proof/Create_FromApp/UploadFileTable.js
  2. +14
    -2
      src/pages/authentication/auth-forms/BusCustomFormWizard.js
  3. +16
    -2
      src/pages/authentication/auth-forms/CustomFormWizard.js
  4. +4
    -1
      src/pages/authentication/auth-forms/UploadFileTable.js
  5. +1
    -1
      src/routes/GLDUserRoutes.js
  6. +1
    -1
      src/routes/PublicUserRoutes.js
  7. +1
    -0
      src/translations/en.json
  8. +1
    -0
      src/translations/zh-CN.json
  9. +1
    -0
      src/translations/zh-HK.json
  10. +7
    -0
      src/utils/CommonFunction.js

+ 24
- 22
src/pages/Proof/Create_FromApp/UploadFileTable.js Wyświetl plik

@@ -7,6 +7,7 @@ import {
} from "@mui/x-data-grid";
import RemoveCircleOutlineIcon from '@mui/icons-material/RemoveCircleOutline';
import { useEffect } from "react";
import { useIntl } from 'react-intl';
// import {useNavigate} from "react-router-dom";
// import { useTheme } from '@mui/material/styles';
import {
@@ -17,6 +18,8 @@ import {
// ==============================|| EVENT TABLE ||============================== //

export default function UploadFileTable({ recordList, setRecordList, showPageColumn, _checkCode, _expectedCode }) {
const intl = useIntl();
const deleteFileLabel = intl.formatMessage({ id: 'ariaDeleteFile' });

const [rows, setRows] = React.useState(recordList);
const [rowModesModel, setRowModesModel] = React.useState({});
@@ -67,6 +70,25 @@ export default function UploadFileTable({ recordList, setRecordList, showPageCol
setRows(rows.filter((row) => row.id !== id));
}

const renderDeleteAction = (id) => (
<GridActionsCellItem
key="delete"
icon={<RemoveCircleOutlineIcon />}
label={deleteFileLabel}
title={deleteFileLabel}
className="textPrimary"
onClick={handleCancelClick(id)}
onKeyDown={(event) => {
if (event.key === 'Enter' || event.key === ' ') {
event.preventDefault();
event.stopPropagation();
handleCancelClick(id)(event);
}
}}
color="error"
/>
);

const handlePreviewClick = (param) => () => {
var reader = new FileReader();
reader.onload = function () {
@@ -94,17 +116,7 @@ export default function UploadFileTable({ recordList, setRecordList, showPageCol
width: 30,
cellClassName: 'actions',
// hide:true,
getActions: ({ id }) => {
return [
<GridActionsCellItem
key="OutSave"
icon={<RemoveCircleOutlineIcon />}
label="delete"
className="textPrimary"
onClick={handleCancelClick(id)}
color="error"
/>]
},
getActions: ({ id }) => [renderDeleteAction(id)],
},
{
field: 'name',
@@ -139,17 +151,7 @@ export default function UploadFileTable({ recordList, setRecordList, showPageCol
width: 30,
cellClassName: 'actions',
// hide:true,
getActions: ({ id }) => {
return [
<GridActionsCellItem
key="OutSave"
icon={<RemoveCircleOutlineIcon />}
label="delete"
className="textPrimary"
onClick={handleCancelClick(id)}
color="error"
/>]
},
getActions: ({ id }) => [renderDeleteAction(id)],
},
{
field: 'name',


+ 14
- 2
src/pages/authentication/auth-forms/BusCustomFormWizard.js Wyświetl plik

@@ -55,7 +55,7 @@ import {PNSPS_LONG_BUTTON_THEME} from "../../../themes/buttonConst";
import {ThemeProvider} from "@emotion/react";
import {FormattedMessage, useIntl} from "react-intl";
//import { Invaild } from 'utils/IconUtils';
import { notifyActionError } from 'utils/CommonFunction';
import { handleActionKeyDown, notifyActionError } from 'utils/CommonFunction';

// ============================|| FIREBASE - REGISTER ||============================ //

@@ -822,10 +822,12 @@ const BusCustomFormWizard = (props) => {
<InputAdornment position="end">
<IconButton
role="button"
tabIndex={0}
aria-label={intl.formatMessage({
id: showPassword ? "ariaHidePassword" : "ariaShowPassword"
})}
onClick={handleClickShowPassword}
onKeyDown={(event) => handleActionKeyDown(event, handleClickShowPassword)}
onMouseDown={handleMouseDownPassword}
edge="end"
size="large"
@@ -899,10 +901,12 @@ const BusCustomFormWizard = (props) => {
<InputAdornment position="end">
<IconButton
role="button"
tabIndex={0}
aria-label={intl.formatMessage({
id: showConfirmPassword ? "ariaHidePassword" : "ariaShowPassword"
})}
onClick={handleClickShowConfirmPassword}
onKeyDown={(event) => handleActionKeyDown(event, handleClickShowConfirmPassword)}
onMouseDown={handleMouseDownPassword}
edge="end"
size="large"
@@ -1546,6 +1550,7 @@ const BusCustomFormWizard = (props) => {
variant="contained"
sx={{ height: '40px' }}
type="button"
tabIndex={0}
onClick={() => {
if (fileInputRef.current) {
fileInputRef.current.click();
@@ -1659,7 +1664,14 @@ const BusCustomFormWizard = (props) => {
<img src={captchaImg} alt="" />
</Grid>
<Grid item xs={1} lg={1} style={{ "border": "0px solid black" }}>
<IconButton role="button" aria-label={intl.formatMessage({ id: 'ariaRefreshCaptcha' })} size="large" onClick={() => { onCaptchaChange() }}>
<IconButton
role="button"
tabIndex={0}
aria-label={intl.formatMessage({ id: 'ariaRefreshCaptcha' })}
size="large"
onClick={() => { onCaptchaChange() }}
onKeyDown={(event) => handleActionKeyDown(event, () => onCaptchaChange())}
>
<LoopIcon fontSize="inherit" />
</IconButton>
</Grid>


+ 16
- 2
src/pages/authentication/auth-forms/CustomFormWizard.js Wyświetl plik

@@ -47,7 +47,7 @@ import { FormattedMessage, useIntl } from "react-intl";
import { Link } from 'react-router-dom';
import { PNSPS_LONG_BUTTON_THEME } from "../../../themes/buttonConst";
import * as HttpUtils from "../../../utils/HttpUtils";
import { notifyActionError } from 'utils/CommonFunction';
import { handleActionKeyDown, notifyActionError } from 'utils/CommonFunction';
// ============================|| FIREBASE - REGISTER ||============================ //

const CustomFormWizard = (props) => {
@@ -1040,10 +1040,12 @@ const CustomFormWizard = (props) => {
<InputAdornment position="end">
<IconButton
role="button"
tabIndex={0}
aria-label={intl.formatMessage({
id: showPassword ? "ariaHidePassword" : "ariaShowPassword"
})}
onClick={handleClickShowPassword}
onKeyDown={(event) => handleActionKeyDown(event, handleClickShowPassword)}
onMouseDown={handleMouseDownPassword}
edge="end"
size="large"
@@ -1117,10 +1119,12 @@ const CustomFormWizard = (props) => {
<InputAdornment position="end">
<IconButton
role="button"
tabIndex={0}
aria-label={intl.formatMessage({
id: showConfirmPassword ? "ariaHidePassword" : "ariaShowPassword"
})}
onClick={handleClickShowConfirmPassword}
onKeyDown={(event) => handleActionKeyDown(event, handleClickShowConfirmPassword)}
onMouseDown={handleMouseDownPassword}
edge="end"
size="large"
@@ -1874,6 +1878,7 @@ const CustomFormWizard = (props) => {
variant="contained"
sx={{ height: '40px' }}
type="button"
tabIndex={0}
onClick={() => {
if (fileInputRef.current) {
fileInputRef.current.click();
@@ -1987,7 +1992,14 @@ const CustomFormWizard = (props) => {
<img src={captchaImg} alt="" />
</Grid>
<Grid item xs={1} lg={1} style={{ "border": "0px solid black" }}>
<IconButton role="button" aria-label={intl.formatMessage({ id: 'ariaRefreshCaptcha' })} size="large" onClick={() => { onCaptchaChange() }}>
<IconButton
role="button"
tabIndex={0}
aria-label={intl.formatMessage({ id: 'ariaRefreshCaptcha' })}
size="large"
onClick={() => { onCaptchaChange() }}
onKeyDown={(event) => handleActionKeyDown(event, () => onCaptchaChange())}
>
<LoopIcon fontSize="inherit" />
</IconButton>
</Grid>
@@ -2116,8 +2128,10 @@ const CustomFormWizard = (props) => {
<IconButton
role="button"
tabIndex={0}
aria-label={intl.formatMessage({ id: 'ariaToggleIdVisibility' })}
onClick={handleClickShowId}
onKeyDown={(event) => handleActionKeyDown(event, handleClickShowId)}
onMouseDown={handleMouseDownId}
edge="end"
size="medium"


+ 4
- 1
src/pages/authentication/auth-forms/UploadFileTable.js Wyświetl plik

@@ -14,6 +14,7 @@ import {
Typography
} from '@mui/material';
import { FormattedMessage, useIntl } from "react-intl";
import { handleActionKeyDown } from 'utils/CommonFunction';
// ==============================|| EVENT TABLE ||============================== //

export default function UploadFileTable({ recordList, setUpdateRows, }) {
@@ -74,8 +75,10 @@ export default function UploadFileTable({ recordList, setUpdateRows, }) {
size="small"
color="error"
role="button"
aria-label={intl.formatMessage({ id: 'delete' })}
tabIndex={0}
aria-label={intl.formatMessage({ id: 'ariaDeleteFile' })}
onClick={() => handleCancelClick(row.id)}
onKeyDown={(event) => handleActionKeyDown(event, () => handleCancelClick(row.id))}
>
<RemoveCircleOutlineIcon fontSize="small" />
</IconButton>


+ 1
- 1
src/routes/GLDUserRoutes.js Wyświetl plik

@@ -7,7 +7,7 @@ const MainLayout = Loadable(lazy(() => import('layout/MainLayout')));
import {isGranted, isGrantedAny} from "auth/utils";
// import { isPasswordExpiry } from "utils/Utils";
// render - dashboard
const DashboardDefault = Loadable(lazy(() => import('pages/Dashboard/GLD')));
const DashboardDefault = Loadable(lazy(() => import('pages/dashboard/GLD')));
const ApplicationDetail = Loadable(lazy(() => import('pages/PublicNotice/Details_GLD')));
const ApplicationSearch = Loadable(lazy(() => import('pages/PublicNotice/Search_GLD')));
const ApplicationMarkAsPaidSearch = Loadable(lazy(() => import('pages/PublicNotice/Search_Mark_As_Paid_GLD')));


+ 1
- 1
src/routes/PublicUserRoutes.js Wyświetl plik

@@ -7,7 +7,7 @@ const MainLayout = Loadable(lazy(() => import('layout/MainLayout')));
// import { isPasswordExpiry } from "utils/Utils";

// render - dashboard
const DashboardDefault = Loadable(lazy(() => import('pages/Dashboard/Public')));
const DashboardDefault = Loadable(lazy(() => import('pages/dashboard/Public')));
const ManageOrgUser = Loadable(lazy(() => import('pages/User/ManagePage_OrgPublic')));
const PublicNotice = Loadable(lazy(() => import('pages/PublicNotice/ListPanel')));
const PublicNoticeApplyForm = Loadable(lazy(() => import('pages/PublicNotice/ApplyForm')));


+ 1
- 0
src/translations/en.json Wyświetl plik

@@ -652,6 +652,7 @@
"ariaApplicationGroup": "Application Group",
"ariaProfileTabs": "Profile tabs",
"ariaUploadPdfFile": "Upload PDF file",
"ariaDeleteFile": "Delete file",
"ariaExportHolidayTemplate": "Export holiday template",
"ariaUploadExcelFile": "Upload Excel file (.xlsx)",
"ariaBackToHome": "Back to home",


+ 1
- 0
src/translations/zh-CN.json Wyświetl plik

@@ -648,6 +648,7 @@
"ariaApplicationGroup": "申请组别",
"ariaProfileTabs": "个人资料选项卡",
"ariaUploadPdfFile": "上传 PDF 文件",
"ariaDeleteFile": "删除文件",
"ariaExportHolidayTemplate": "导出假期模板",
"ariaUploadExcelFile": "上传 Excel 文件 (.xlsx)",
"ariaBackToHome": "返回主页",


+ 1
- 0
src/translations/zh-HK.json Wyświetl plik

@@ -649,6 +649,7 @@
"ariaApplicationGroup": "申請組別",
"ariaProfileTabs": "個人檔案分頁",
"ariaUploadPdfFile": "上載 PDF 檔案",
"ariaDeleteFile": "刪除檔案",
"ariaExportHolidayTemplate": "匯出假期範本",
"ariaUploadExcelFile": "上載 Excel 檔案 (.xlsx)",
"ariaBackToHome": "返回主頁",


+ 7
- 0
src/utils/CommonFunction.js Wyświetl plik

@@ -11,6 +11,13 @@ export const clickableLink=(link, label)=> {
return <a href={link}>{label}</a>;
}

export const handleActionKeyDown = (event, action) => {
if (event.key === 'Enter' || event.key === ' ') {
event.preventDefault();
action(event);
}
};

export function getDeletedRecordWithRefList(referenceList, updatedList) {
return referenceList.filter(x => !updatedList.includes(x));
}


Ładowanie…
Anuluj
Zapisz