alex
/
PNSPS-frontend-MaterialUI
1
0
派生 0
代码 工单 0 合并请求 0 版本发布 0 百科 动态
浏览代码

Merge branch 'master' into paymentApi

master
Alex Cheung 1年前
父节点
b322cb87cc ea81f22606
当前提交
b2b7542f17
共有 2 个文件被更改，包括 177 次插入 和 125 次删除
分列视图
Diff 选项
显示统计 下载 Patch 文件 下载 Diff 文件
  1. +83
    -85
      src/pages/Organization/DetailPage/OrganizationCard.js
  2. +94
    -40
      src/pages/Organization/DetailPage_FromUser/OrganizationCard_loadFromUser.js

+ 83
- 85
src/pages/Organization/DetailPage/OrganizationCard.js 查看文件

@@ -23,27 +23,13 @@ import { notifySaveSuccess } from 'utils/CommonFunction';
import { useIntl } from "react-intl";
import { PNSPS_BUTTON_THEME } from "themes/buttonConst";
import { ThemeProvider } from "@emotion/react";
import { makeStyles } from '@mui/styles';

import {DatePicker} from "@mui/x-date-pickers/DatePicker";
import dayjs from "dayjs";
import {DemoItem} from "@mui/x-date-pickers/internals/demo";
import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider";
import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs";
// ==============================|| DASHBOARD - DEFAULT ||============================== //
const useStyles = makeStyles(() => ({
root: {
position: "relative"
},
display: {
position: "absolute",
top: 2,
left: 12,
bottom: 2,
background: "white",
pointerEvents: "none",
right: 50,
display: "flex",
alignItems: "center",
width:"70%"
},
}));

const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
const intl = useIntl();
const [creditorConfirmPopUp, setCreditorConfirmPopUp] = React.useState(false);
@@ -54,9 +40,9 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
const [createMode, setCreateMode] = useState(false);
const [onReady, setOnReady] = useState(false);
const [errorMsg, setErrorMsg] = useState("");
const [minDate] = React.useState(new Date());
const [fromDate, setFromDate] = React.useState("dd / mm / yyyy");
const [fromDateValue, setFromDateValue] = React.useState("dd / mm / yyyy");
const [minDate] = React.useState(new Date().setDate(new Date().getDate() + 1));
const [fromDate, setFromDate] = React.useState(null);
const [fromDateValue, setFromDateValue] = React.useState(null);
const {register, handleSubmit, reset} = useForm()

React.useEffect(() => {
@@ -67,33 +53,15 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
//if state data are ready and assign to different field
// console.log(currentApplicationDetailData)
if (Object.keys(currentUserData).length > 0) {
setFromDate(currentUserData.brExpiryDate)
if(DateUtils.dateValue(currentUserData.brExpiryDate)>DateUtils.dateValue(minDate)){
setFromDate(currentUserData.brExpiryDate);
}else{
setErrorMsg("Please select a date after today.")
}
setOnReady(true);
}
}, [currentUserData]);

function FormDateInputComponent({ inputRef, ...props }) {
const classes = useStyles();
return (
<>
<div className={classes.display}>
{DateUtils.dateStr(fromDateValue) == "Invalid Date" ?
fromDateValue
:
DateUtils.dateStr(fromDateValue)}
</div>
<input
// className={classes.input}
ref={inputRef}
{...props}
// onChange={handleChange}
value={fromDateValue}
min={minDate}
/>
</>
);
}

function displayErrorMsg(errorMsg) {
return <Typography variant="errorMessage1">{errorMsg}</Typography>
}
@@ -141,47 +109,49 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
setErrorMsg(intl.formatMessage({ id: 'pleaseFillInDistrict' }))
} else {
let sentDateFrom = "";
if (fromDateValue != "dd / mm / yyyy") {
if (fromDateValue == null) {
setErrorMsg(intl.formatMessage({ id: 'pleaseFillInBusinessRegCertValidityDate' }))
}else{
sentDateFrom = DateUtils.dateValue(fromDateValue)
HttpUtils.post({
url: UrlUtils.POST_ORG_SAVE_PATH,
params: {
id: id > 0 ? id : null,
enCompanyName: values.enCompanyName,
chCompanyName: values.chCompanyName,
orgShortName: values.creditor?values.orgShortName:"",
brNo: values.brNo,
// brExpiryDate: values.brExpiryDate,
brExpiryDate: sentDateFrom,
enCompanyNameTemp: values.enCompanyNameTemp,
chCompanyNameTemp: values.chCompanyNameTemp,
brExpiryDateTemp: values.brExpiryDateTemp,
contactPerson: values.contactPerson,
contactTel: {
countryCode: values.tel_countryCode,
phoneNumber: values.phoneNumber
},
faxNo: {
countryCode: values.fax_countryCode,
faxNumber: values.faxNumber
},
addressTemp: {
country: values.country.type,
district: values.district?.type,
addressLine1: values.addressLine1,
addressLine2: values.addressLine2,
addressLine3: values.addressLine3,
},
creditor: values.creditor,
},
onSuccess: function () {
notifySaveSuccess()
loadDataFun();
setEditMode(false);
}
});
}

HttpUtils.post({
url: UrlUtils.POST_ORG_SAVE_PATH,
params: {
id: id > 0 ? id : null,
enCompanyName: values.enCompanyName,
chCompanyName: values.chCompanyName,
orgShortName: values.creditor?values.orgShortName:"",
brNo: values.brNo,
// brExpiryDate: values.brExpiryDate,
brExpiryDate: sentDateFrom,
enCompanyNameTemp: values.enCompanyNameTemp,
chCompanyNameTemp: values.chCompanyNameTemp,
brExpiryDateTemp: values.brExpiryDateTemp,
contactPerson: values.contactPerson,
contactTel: {
countryCode: values.tel_countryCode,
phoneNumber: values.phoneNumber
},
faxNo: {
countryCode: values.fax_countryCode,
faxNumber: values.faxNumber
},
addressTemp: {
country: values.country.type,
district: values.district?.type,
addressLine1: values.addressLine1,
addressLine2: values.addressLine2,
addressLine3: values.addressLine3,
},
creditor: values.creditor,
},
onSuccess: function () {
notifySaveSuccess()
loadDataFun();
setEditMode(false);
}
});
}
}
}
@@ -418,7 +388,35 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
<Typography variant="pnspsFormParagraphBold">{FieldUtils.notNullFieldLabel("Expiry Date:")}</Typography>
</Grid>
<Grid item xs={12} md={6} lg={6}>
<TextField
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DemoItem components={['DatePicker']}>
<DatePicker
id="brExpiryDate"
name="brExpiryDate"
// onError={Boolean(formik.errors["brExpiryDate"])}
slotProps={{
field: { readOnly: true, },
textField: {
helperText:fromDate == null ? intl.formatMessage({ id: 'pleaseFillInBusinessRegCertValidityDate' }):""
},
}}
format="DD/MM/YYYY"
// label={"Submit Date (From)"}
value={fromDate == null ? null : dayjs(fromDate)}
minDate={minDate == null ? null : dayjs(minDate)}
disabled={(!editMode && !createMode)}
onChange={(newValue) => {
setErrorMsg("")
if(DateUtils.dateValue(newValue)>DateUtils.dateValue(new Date())){
setFromDate(newValue);
}else{
setErrorMsg("Please select a date after today.")
}
}}
/>
</DemoItem >
</LocalizationProvider>
{/* <TextField
fullWidth
id="brExpiryDate"
type="date"
@@ -441,7 +439,7 @@ const OrganizationCard = ({ userData, loadDataFun, id, setEditModeFun }) => {
}}
disabled={(!editMode && !createMode)}
sx={{ "& .MuiInputBase-input": {display:"block", textIndent: "-9999px"} }}
/>
/> */}
</Grid>
</Grid>


+ 94
- 40
src/pages/Organization/DetailPage_FromUser/OrganizationCard_loadFromUser.js 查看文件

@@ -2,7 +2,8 @@
import {
Grid, Button, Typography,
Dialog, DialogTitle, DialogContent, DialogActions,
FormHelperText, TextField
FormHelperText,
// TextField
} from '@mui/material';
import MainCard from "components/MainCard";
import * as React from "react";
@@ -21,6 +22,11 @@ import { lazy } from 'react';
import { notifyCreateSuccess } from 'utils/CommonFunction';
import { useIntl } from "react-intl";

import {DatePicker} from "@mui/x-date-pickers/DatePicker";
import dayjs from "dayjs";
import {DemoItem} from "@mui/x-date-pickers/internals/demo";
import {LocalizationProvider} from "@mui/x-date-pickers/LocalizationProvider";
import {AdapterDayjs} from "@mui/x-date-pickers/AdapterDayjs";
// ==============================|| DASHBOARD - DEFAULT ||============================== //


@@ -32,15 +38,28 @@ const OrganizationCard_loadFromUser = ({ userData, userId }) => {
const [isFailPopUp, setIsFailPopUp] = useState(false);
const [failText, setFailText] = useState("");
const [errorMsg, setErrorMsg] = useState("");
const [minDate] = React.useState(new Date().setDate(new Date().getDate() + 1));
const [fromDate, setFromDate] = React.useState(null);
const [fromDateValue, setFromDateValue] = React.useState(null);

useEffect(() => {
//if state data are ready and assign to different field
// console.log(currentApplicationDetailData)
if (Object.keys(currentUserData).length > 0) {
if(DateUtils.dateValue(currentUserData.brExpiryDate)>DateUtils.dateValue(minDate)){
setFromDate(currentUserData.brExpiryDate);
}else{
setErrorMsg("Please select a date after today.")
}
// setFromDate(currentUserData.brExpiryDate)
setOnReady(true);
}
}, [currentUserData]);

React.useEffect(() => {
setFromDateValue(fromDate);
}, [fromDate]);

function displayErrorMsg(errorMsg) {
return <Typography variant="errorMessage1">{errorMsg}</Typography>
}
@@ -78,45 +97,52 @@ const OrganizationCard_loadFromUser = ({ userData, userId }) => {
if (values.country.type == "hongKong" && values.district == null) {
setErrorMsg(intl.formatMessage({ id: 'pleaseFillInDistrict' }))
} else {
HttpUtils.post({
url: UrlUtils.POST_ORG_SAVE_PATH,
params: {
id: null,
primaryUserId: userId,
enCompanyName: values.enCompanyName,
chCompanyName: values.chCompanyName,
brNo: values.brNo,
brExpiryDate: values.brExpiryDate,
enCompanyNameTemp: values.enCompanyNameTemp,
chCompanyNameTemp: values.chCompanyNameTemp,
brExpiryDateTemp: values.brExpiryDateTemp,
contactPerson: values.contactPerson,
contactTel: {
countryCode: values.tel_countryCode,
phoneNumber: values.phoneNumber
let sentDateFrom = "";
if (fromDateValue == null) {
setErrorMsg(intl.formatMessage({ id: 'pleaseFillInBusinessRegCertValidityDate' }))
}else{
sentDateFrom = DateUtils.dateValue(fromDateValue)
HttpUtils.post({
url: UrlUtils.POST_ORG_SAVE_PATH,
params: {
id: null,
primaryUserId: userId,
enCompanyName: values.enCompanyName,
chCompanyName: values.chCompanyName,
brNo: values.brNo,
brExpiryDate: sentDateFrom,
enCompanyNameTemp: values.enCompanyNameTemp,
chCompanyNameTemp: values.chCompanyNameTemp,
brExpiryDateTemp: values.brExpiryDateTemp,
contactPerson: values.contactPerson,
contactTel: {
countryCode: values.tel_countryCode,
phoneNumber: values.phoneNumber
},
faxNo: {
countryCode: values.fax_countryCode,
faxNumber: values.faxNumber
},
addressTemp: {
country: values.country.type,
district: values.district?.type,
addressLine1: values.addressLine1,
addressLine2: values.addressLine2,
addressLine3: values.addressLine3,
}
},
faxNo: {
countryCode: values.fax_countryCode,
faxNumber: values.faxNumber
},
addressTemp: {
country: values.country.type,
district: values.district?.type,
addressLine1: values.addressLine1,
addressLine2: values.addressLine2,
addressLine3: values.addressLine3,
}
},
onSuccess: function (responseData) {
if (responseData.msg) {
setFailText(responseData.msg);
setIsFailPopUp(true);
return;
onSuccess: function (responseData) {
if (responseData.msg) {
setFailText(responseData.msg);
setIsFailPopUp(true);
return;
}
navigate('/org/' + responseData.id);
notifyCreateSuccess()
}
navigate('/org/' + responseData.id);
notifyCreateSuccess()
}
});
});
}

}
}
}
@@ -207,7 +233,35 @@ const OrganizationCard_loadFromUser = ({ userData, userId }) => {
<Typography variant="pnspsFormParagraphBold">{FieldUtils.notNullFieldLabel("Expiry Date:")}</Typography>
</Grid>
<Grid item xs={12} md={6} lg={6}>
<TextField
<LocalizationProvider dateAdapter={AdapterDayjs}>
<DemoItem components={['DatePicker']}>
<DatePicker
id="brExpiryDate"
name="brExpiryDate"
// onError={Boolean(formik.errors["brExpiryDate"])}
slotProps={{
field: { readOnly: true, },
// textField: {
// helperText:formik.errors["brExpiryDate"] ? formik.errors["brExpiryDate"] : ''
// },
}}
format="DD/MM/YYYY"
// label={"Submit Date (From)"}
value={fromDate == null ? null : dayjs(fromDate)}
minDate={minDate == null ? null : dayjs(minDate)}
// disabled={(!editMode && !createMode)}
onChange={(newValue) => {
setErrorMsg("")
if(DateUtils.dateValue(newValue)>DateUtils.dateValue(new Date())){
setFromDate(newValue);
}else{
setErrorMsg("Please select a date after today.")
}
}}
/>
</DemoItem >
</LocalizationProvider>
{/* <TextField
fullWidth
id="brExpiryDate"
name="brExpiryDate"
@@ -220,7 +274,7 @@ const OrganizationCard_loadFromUser = ({ userData, userId }) => {
sx={{
width: '100%'
}}
/>
/> */}
</Grid>
</Grid>



撰写 预览
正在加载...
取消
保存