diff --git a/backend/public/js/app.js b/backend/public/js/app.js index 931610b3..f5e540a2 100644 --- a/backend/public/js/app.js +++ b/backend/public/js/app.js @@ -32692,15 +32692,15 @@ var ChildAuth = /*#__PURE__*/function (_Component) { key: "render", value: function render() { return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_10__.jsx)("main", { - "class": "l-single-main", + className: "l-single-main", children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_10__.jsx)("div", { - "class": "l-centeringbox", + className: "l-centeringbox", children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_10__.jsx)("div", { - "class": "l-centeringbox-wrap", + className: "l-centeringbox-wrap", children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_10__.jsx)("div", { - "class": "l-single-container", + className: "l-single-container", children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_10__.jsx)("div", { - "class": "l-single-inner", + className: "l-single-inner", children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_10__.jsx)(react_router_dom__WEBPACK_IMPORTED_MODULE_11__.BrowserRouter, { children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_10__.jsxs)(react_router_dom__WEBPACK_IMPORTED_MODULE_12__.Switch, { children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_10__.jsx)(react_router_dom__WEBPACK_IMPORTED_MODULE_12__.Route, { @@ -33075,12 +33075,13 @@ __webpack_require__.r(__webpack_exports__); /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); -/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "./node_modules/react-dom/index.js"); -/* harmony import */ var _material_ui_lab__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @material-ui/lab */ "./node_modules/@material-ui/lab/LoadingButton/LoadingButton.js"); -/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! axios */ "./node_modules/axios/index.js"); -/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_2__); +/* harmony import */ var react_router__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-router */ "./node_modules/react-router/esm/react-router.js"); +/* harmony import */ var _material_ui_lab__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @material-ui/lab */ "./node_modules/@material-ui/lab/LoadingButton/LoadingButton.js"); +/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! axios */ "./node_modules/axios/index.js"); +/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var _material_ui_core_IconButton__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @material-ui/core/IconButton */ "./node_modules/@material-ui/core/IconButton/IconButton.js"); -/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js"); +/* harmony import */ var _mui_icons_material_PhotoCameraOutlined__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @mui/icons-material/PhotoCameraOutlined */ "./node_modules/@mui/icons-material/PhotoCameraOutlined.js"); +/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js"); function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } @@ -33102,43 +33103,51 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } + var SignUp = function SignUp() { - var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), + var history = (0,react_router__WEBPACK_IMPORTED_MODULE_3__.useHistory)(); + + var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false), _useState2 = _slicedToArray(_useState, 2), - first_name = _useState2[0], - setFirstName = _useState2[1]; + submit = _useState2[0], + setSubmit = _useState2[1]; var _useState3 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), _useState4 = _slicedToArray(_useState3, 2), - last_name = _useState4[0], - setLastName = _useState4[1]; + first_name = _useState4[0], + setFirstName = _useState4[1]; var _useState5 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), _useState6 = _slicedToArray(_useState5, 2), - identify = _useState6[0], - setIdentify = _useState6[1]; + last_name = _useState6[0], + setLastName = _useState6[1]; var _useState7 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), _useState8 = _slicedToArray(_useState7, 2), - email = _useState8[0], - setEmail = _useState8[1]; + identify = _useState8[0], + setIdentify = _useState8[1]; var _useState9 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), _useState10 = _slicedToArray(_useState9, 2), - password = _useState10[0], - setPassword = _useState10[1]; + email = _useState10[0], + setEmail = _useState10[1]; var _useState11 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), _useState12 = _slicedToArray(_useState11, 2), - company = _useState12[0], - setCompany = _useState12[1]; + password = _useState12[0], + setPassword = _useState12[1]; var _useState13 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), _useState14 = _slicedToArray(_useState13, 2), - image = _useState14[0], - setImage = _useState14[1]; + company = _useState14[0], + setCompany = _useState14[1]; - var _useState15 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({ + var _useState15 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), + _useState16 = _slicedToArray(_useState15, 2), + image = _useState16[0], + setImage = _useState16[1]; + + var _useState17 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({ first_name: '', last_name: '', identify: '', @@ -33146,26 +33155,23 @@ var SignUp = function SignUp() { password: '', image: '', company: '' - }), - _useState16 = _slicedToArray(_useState15, 2), - errors = _useState16[0], - setErrors = _useState16[1]; - - var _useState17 = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)({ - status: '', - msg: '' }), _useState18 = _slicedToArray(_useState17, 2), - err_msg = _useState18[0], - setErrMsg = _useState18[1]; + _422errors = _useState18[0], + set422Errors = _useState18[1]; var handleSubmit = function handleSubmit(e) { e.preventDefault(); - setErrMsg({ - status: '', - msg: '' + set422Errors({ + first_name: '', + last_name: '', + identify: '', + email: '', + password: '', + image: '', + company: '' }); - if (!validateForm()) return; + setSubmit(true); var formdata = new FormData(); formdata.append('first_name', first_name); formdata.append('last_name', last_name); @@ -33173,72 +33179,34 @@ var SignUp = function SignUp() { formdata.append('email', email); formdata.append('password', password); formdata.append('company', company); - formdata.append('image', image); // axios.post('/api/children/registerMain', formdata) - // .then(response => { - // if(response.data.status_code==200){ - // window.location.href = '/register/c-account/complete'; - // } - // else if(response.data.status_code==400){ - // window.location.href = '/register/c-account/error'; - // } - // else if(response.data.status_code==500){ - // window.location.href = '/unknown-error'; - // } - // }) - //.catch(err=>console.log(err)) - }; + formdata.append('image', image); + axios__WEBPACK_IMPORTED_MODULE_1___default().post('/api/children/registerMain', formdata).then(function (response) { + setSubmit(false); - var validateForm = function validateForm() { - var errors = {}; - var formIsValid = true; + switch (response.data.status_code) { + case 200: + history.push({ + pathname: '/register/c-account/complete', + state: {} + }); + break; - if (email.length == 0) { - formIsValid = false; - errors["email"] = 'Required'; - } else { - //regular expression for email validation - var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i); + case 422: + set422Errors(response.data.error_messages); + break; - if (!pattern.test(email)) { - formIsValid = false; - errors["email"] = 'Required'; - } else { - errors['email'] = ''; + case 400: + history.push({ + pathname: '/register/c-account/error', + state: {} + }); + break; } - } - if (!image) { - formIsValid = false; - errors['image'] = 'Required'; - } else errors['image'] = ''; - - if (first_name.length == 0) { - formIsValid = false; - errors['first_name'] = 'Required'; - } else errors['first_name'] = ''; - - if (last_name.length == 0) { - formIsValid = false; - errors['last_name'] = 'Required'; - } else errors['last_name'] = ''; - - if (identify.length == 0) { - formIsValid = false; - errors['identify'] = 'Required'; - } else errors['identify'] = ''; - - if (password.length < 8) { - formIsValid = false; - errors['password'] = 'Required'; - } else errors['password'] = ''; - - if (company.length == 0) { - formIsValid = false; - errors['company'] = 'Required'; - } else errors['company'] = ''; - - setErrors(errors); - return formIsValid; + ; + })["catch"](function (err) { + return console.log(err); + }); }; var handleImageChange = function handleImageChange(e) { @@ -33252,18 +33220,15 @@ var SignUp = function SignUp() { }; }; - return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("form", { + return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("form", { onSubmit: handleSubmit, noValidate: true, - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("p", { - className: "text-center font-weight-bold ft-20", + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("p", { + className: "text-center font-weight-bold ft-25", children: "\u672C\u767B\u9332" - }), err_msg.status.length != 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { - className: "l-alert__text--".concat(err_msg.status, " ft-16 ft-md-14"), - children: err_msg.msg - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", { className: "mt-25-px", - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", { + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("input", { type: "file", id: "avatar", name: "avatar", @@ -33272,23 +33237,25 @@ var SignUp = function SignUp() { onChange: function onChange(e) { return handleImageChange(e); } - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", { - className: "avatar-wrapper ".concat(errors['image'].length != 0 && "is-invalid c-input__target"), - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", { + className: "avatar-wrapper ".concat(_422errors.image && "is-invalid c-input__target"), + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("label", { htmlFor: "avatar", className: "avatar-label", - children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_material_ui_core_IconButton__WEBPACK_IMPORTED_MODULE_4__.default, { + children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_material_ui_core_IconButton__WEBPACK_IMPORTED_MODULE_4__.default, { color: "primary", "aria-label": "upload picture", component: "span", - className: "bg-yellow shadow-sm", - children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("img", { - src: "/assets/img/icon/camera.svg", - width: "16", - height: "16" + className: "bg-yellow shadow-sm w-40-px h-40-px", + children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_mui_icons_material_PhotoCameraOutlined__WEBPACK_IMPORTED_MODULE_5__.default, { + style: { + width: '25px', + height: '25px', + color: 'black' + } }) }) - }), image && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("img", { + }), image && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("img", { src: image, alt: "", width: "100%", @@ -33297,131 +33264,135 @@ var SignUp = function SignUp() { borderRadius: '50%' } })] - }), errors['image'].length != 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { + }), _422errors.image && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", { className: "l-alert__text--error ft-16 ft-md-14", - children: errors['image'] + children: _422errors.image })] - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", { className: "edit-set", - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", { + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("label", { htmlFor: "first_name", - className: "control-label ft-12", + className: "control-label", children: " \u59D3 " - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("input", { type: "text", name: "first_name", id: "first_name", - className: "input-default input-nameSei ".concat(errors['first_name'].length != 0 && "is-invalid c-input__target"), + className: "input-default input-nameSei input-h60 input-w480 ".concat(_422errors.first_name && "is-invalid c-input__target"), value: first_name, onChange: function onChange(e) { return setFirstName(e.target.value); } - }), errors['first_name'].length != 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { + }), _422errors.first_name && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", { className: "l-alert__text--error ft-16 ft-md-14", - children: errors['first_name'] + children: _422errors.first_name })] - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", { className: "edit-set", - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", { + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("label", { htmlFor: "last_name", - className: "control-label ft-12", + className: "control-label", children: " \u540D " - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("input", { type: "text", name: "last_name", id: "last_name", - className: "input-default input-nameSei ".concat(errors['last_name'].length != 0 && "is-invalid c-input__target"), + className: "input-default input-nameSei input-h60 input-w480 ".concat(_422errors.last_name && "is-invalid c-input__target"), value: last_name, onChange: function onChange(e) { return setLastName(e.target.value); } - }), errors['last_name'].length != 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { + }), _422errors.last_name && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", { className: "l-alert__text--error ft-16 ft-md-14", - children: errors['last_name'] + children: _422errors.last_name })] - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", { className: "edit-set", - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", { + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("label", { htmlFor: "identify", - className: "control-label ft-12", + className: "control-label", children: " ID " - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("input", { type: "text", name: "identify", id: "identify", - className: "input-default input-nameSei ".concat(errors['identify'].length != 0 && "is-invalid c-input__target"), + className: "input-default input-nameSei input-h60 input-w480 ".concat(_422errors.identify && "is-invalid c-input__target"), value: identify, onChange: function onChange(e) { return setIdentify(e.target.value); } - }), errors['identify'].length != 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { + }), _422errors.identify && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", { className: "l-alert__text--error ft-16 ft-md-14", - children: errors['identify'] + children: _422errors.identify })] - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", { className: "edit-set", - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", { + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("label", { htmlFor: "email", - className: "control-label ft-12", + className: "control-label", children: " \u30E1\u30FC\u30EB\u30A2\u30C9\u30EC\u30B9 " - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("input", { type: "email", name: "email", id: "email", - className: "input-default input-nameSei ".concat(errors['email'].length != 0 && "is-invalid c-input__target"), + className: "input-default input-nameSei input-h60 input-w480 ".concat(_422errors.email && "is-invalid c-input__target"), value: email, onChange: function onChange(e) { return setEmail(e.target.value); } - }), errors['email'].length != 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { + }), _422errors.email && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", { className: "l-alert__text--error ft-16 ft-md-14", - children: errors['email'] + children: _422errors.email })] - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", { className: "edit-set", - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", { + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("label", { htmlFor: "password", - className: "control-label ft-12", + className: "control-label", children: " \u30D1\u30B9\u30EF\u30FC\u30C9 " - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("input", { type: "password", name: "password", id: "password", - className: "input-default input-nameSei ".concat(errors['password'].length != 0 && "is-invalid c-input__target"), + className: "input-default input-nameSei input-h60 input-w480 ".concat(_422errors.password && "is-invalid c-input__target"), value: password, onChange: function onChange(e) { return setPassword(e.target.value); } - }), errors['password'].length != 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { + }), _422errors.password && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", { className: "l-alert__text--error ft-16 ft-md-14", - children: errors['password'] + children: _422errors.password })] - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div", { className: "edit-set", - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", { + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("label", { htmlFor: "company", - className: "control-label ft-12", + className: "control-label", children: " \u6240\u5C48\u3057\u3066\u3044\u308B\u4F1A\u793E\u540D\u3092\u8A18\u8F09 " - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("input", { type: "text", name: "company", id: "company", - className: "input-default input-nameSei input-h60 input-w480 ".concat(errors['company'].length != 0 && "is-invalid c-input__target"), + className: "input-default input-nameSei input-h60 input-w480 ".concat(_422errors.company && "is-invalid c-input__target"), value: company, onChange: function onChange(e) { return setCompany(e.target.value); } - }), errors['company'].length != 0 && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { + }), _422errors.company && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", { className: "l-alert__text--error ft-16 ft-md-14", - children: errors['company'] + children: _422errors.company })] - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("div", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div", { className: "mt-5", - children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_material_ui_lab__WEBPACK_IMPORTED_MODULE_5__.default, { + children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_material_ui_lab__WEBPACK_IMPORTED_MODULE_6__.default, { type: "submit", fullWidth: true, - className: "p-4 rounded-20 ft-15 font-weight-bold text-black bg-yellow", - children: "\u672C\u767B\u9332" + className: "p-4 rounded-15 bg-yellow", + loading: submit, + children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("span", { + className: "ft-15 font-weight-bold ".concat(!submit && 'text-black'), + children: "\u672C\u767B\u9332" + }) }) })] }); @@ -33443,13 +33414,11 @@ __webpack_require__.r(__webpack_exports__); /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__) /* harmony export */ }); /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js"); -/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ "./node_modules/react-dom/index.js"); -/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! axios */ "./node_modules/axios/index.js"); -/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_2__); -/* harmony import */ var _material_ui_lab__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @material-ui/lab */ "./node_modules/@material-ui/lab/LoadingButton/LoadingButton.js"); -/* harmony import */ var _material_ui_core__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @material-ui/core */ "./node_modules/@material-ui/core/CircularProgress/CircularProgress.js"); -/* harmony import */ var _component_alert__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../component/alert */ "./resources/js/component/alert.jsx"); -/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js"); +/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! axios */ "./node_modules/axios/index.js"); +/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_1__); +/* harmony import */ var _material_ui_lab__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! @material-ui/lab */ "./node_modules/@material-ui/lab/LoadingButton/LoadingButton.js"); +/* harmony import */ var _component_alert__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../component/alert */ "./resources/js/component/alert.jsx"); +/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js"); function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } @@ -33469,9 +33438,6 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } - - - var SignUpTemporary = function SignUpTemporary() { var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''), _useState2 = _slicedToArray(_useState, 2), @@ -33508,7 +33474,7 @@ var SignUpTemporary = function SignUpTemporary() { var formdata = new FormData(); formdata.append('tel', tel); setSubmit(true); - axios__WEBPACK_IMPORTED_MODULE_2___default().post('/api/children/registerTemporary', formdata).then(function (response) { + axios__WEBPACK_IMPORTED_MODULE_1___default().post('/api/children/registerTemporary', formdata).then(function (response) { setSubmit(false); switch (response.data.status_code) { @@ -33531,19 +33497,19 @@ var SignUpTemporary = function SignUpTemporary() { }); }; - return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("form", { + return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("form", { onSubmit: handleSubmit, noValidate: true, - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("p", { - className: "pb-40-px text-center font-weight-bold ft-20", + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("p", { + className: "pb-40-px text-center font-weight-bold ft-25", children: "\u4EEE\u767B\u9332\u624B\u7D9A\u304D" - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("div", { className: "edit-set", - children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("label", { + children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("label", { htmlFor: "tel", className: "control-label ft-14 ft-md-12", children: " \u96FB\u8A71\u756A\u53F7 " - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("input", { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("input", { type: "text", name: "tel", id: "tel", @@ -33553,32 +33519,25 @@ var SignUpTemporary = function SignUpTemporary() { return setTel(e.target.value); }, autoFocus: true - }), _422errors.tel && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", { + }), _422errors.tel && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { className: "l-alert__text--error ft-16 ft-md-14", children: _422errors.tel })] - }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_material_ui_lab__WEBPACK_IMPORTED_MODULE_5__.default, { + }), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_material_ui_lab__WEBPACK_IMPORTED_MODULE_4__.default, { type: "submit", fullWidth: true, className: "rounded-15 py-3 mt-5 bg-yellow", - children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", { - className: "font-weight-bold ft-18 text-black", - children: "\u9001\u4FE1" + children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { + className: "ft-18 font-weight-bold ".concat(!submit && 'text-black'), + children: "\u4EEE\u767B\u9332\u9001\u4FE1" }) - }), submit && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_material_ui_core__WEBPACK_IMPORTED_MODULE_6__.default, { - style: { - position: 'fixed', - left: 'calc( 50% - 20px)', - top: '45%', - color: 'green' - } - }), _400error && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_component_alert__WEBPACK_IMPORTED_MODULE_3__.default, { + }), _400error && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_component_alert__WEBPACK_IMPORTED_MODULE_2__.default, { type: "fail", hide: function hide() { return set400Error(''); }, children: _400error - }), _success && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)(_component_alert__WEBPACK_IMPORTED_MODULE_3__.default, { + }), _success && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_component_alert__WEBPACK_IMPORTED_MODULE_2__.default, { type: "success", hide: function hide() { return setSuccess(''); @@ -37366,7 +37325,6 @@ __webpack_require__.r(__webpack_exports__); /* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_1__); /* harmony import */ var react_router_dom__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-router-dom */ "./node_modules/react-router/esm/react-router.js"); /* harmony import */ var _material_ui_lab__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! @material-ui/lab */ "./node_modules/@material-ui/lab/LoadingButton/LoadingButton.js"); -/* harmony import */ var _material_ui_core__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! @material-ui/core */ "./node_modules/@material-ui/core/CircularProgress/CircularProgress.js"); /* harmony import */ var _component_alert__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../component/alert */ "./resources/js/component/alert.jsx"); /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js"); function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } @@ -37508,16 +37466,9 @@ var Contact = function Contact() { fullWidth: true, className: "rounded-15 py-3 mt-5 bg-yellow", children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("span", { - className: "font-weight-bold ft-18 text-black", + className: "ft-18 font-weight-bold ".concat(!submit && 'text-black'), children: "\u9001\u4FE1" }) - }), submit && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_material_ui_core__WEBPACK_IMPORTED_MODULE_6__.default, { - style: { - position: 'fixed', - left: 'calc( 50% - 20px)', - top: '45%', - color: 'green' - } }), _400error && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(_component_alert__WEBPACK_IMPORTED_MODULE_2__.default, { type: "fail", hide: function hide() { diff --git a/backend/resources/js/child/auth/index.js b/backend/resources/js/child/auth/index.js index b1673fc8..503c696d 100644 --- a/backend/resources/js/child/auth/index.js +++ b/backend/resources/js/child/auth/index.js @@ -16,11 +16,11 @@ import SignUpError from './register/error'; export default class ChildAuth extends Component { render() { return ( -
-
-
-
-
+
+
+
+
+
diff --git a/backend/resources/js/child/auth/register/index.jsx b/backend/resources/js/child/auth/register/index.jsx index 19221b6f..1aeae4c0 100644 --- a/backend/resources/js/child/auth/register/index.jsx +++ b/backend/resources/js/child/auth/register/index.jsx @@ -1,13 +1,17 @@ import React, { useEffect, useState } from 'react'; -import ReactDOM from 'react-dom'; -import { Button } from '@material-ui/core'; +import { useHistory } from 'react-router'; import { LoadingButton } from '@material-ui/lab'; +import { CircularProgress } from '@material-ui/core'; import axios from 'axios'; import IconButton from "@material-ui/core/IconButton"; - +import PhotoCameraOutlinedIcon from '@mui/icons-material/PhotoCameraOutlined'; const SignUp = () => { + + const history = useHistory(); + const [submit, setSubmit] = useState(false); + const [first_name, setFirstName] = useState(''); const [last_name, setLastName] = useState(''); const [identify, setIdentify] = useState(''); @@ -16,7 +20,7 @@ const SignUp = () => { const [company, setCompany] = useState(''); const [image, setImage] = useState(''); - const [errors, setErrors] = useState({ + const [_422errors, set422Errors] = useState({ first_name:'', last_name:'', identify:'', @@ -24,15 +28,21 @@ const SignUp = () => { password:'', image:'', company:'' - }) - const [err_msg, setErrMsg] = useState({status:'', msg:''}) + }); const handleSubmit = (e) => { - e.preventDefault(); - setErrMsg({status:'', msg:''}); - - if(!validateForm()) return; + e.preventDefault(); + set422Errors({ + first_name:'', + last_name:'', + identify:'', + email:'', + password:'', + image:'', + company:'' + }); + setSubmit(true); const formdata = new FormData(); formdata.append('first_name', first_name); formdata.append('last_name', last_name); @@ -41,59 +51,18 @@ const SignUp = () => { formdata.append('password', password); formdata.append('company', company); formdata.append('image', image); - // axios.post('/api/children/registerMain', formdata) - // .then(response => { - // if(response.data.status_code==200){ - // window.location.href = '/register/c-account/complete'; - // } - // else if(response.data.status_code==400){ - // window.location.href = '/register/c-account/error'; - // } - // else if(response.data.status_code==500){ - // window.location.href = '/unknown-error'; - // } - // }) - //.catch(err=>console.log(err)) + axios.post('/api/children/registerMain', formdata) + .then(response => { + setSubmit(false); + switch(response.data.status_code){ + case 200: history.push({pathname: '/register/c-account/complete', state: {}}); break; + case 422: set422Errors(response.data.error_messages); break; + case 400: history.push({pathname: '/register/c-account/error', state: {}}); break; + }; + }) + .catch(err=>console.log(err)) } - const validateForm = () => { - let errors = {}; - let formIsValid = true; - - if (email.length == 0) { formIsValid = false; errors["email"] = 'Required'; } - else { - //regular expression for email validation - var pattern = new RegExp(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i); - if (!pattern.test(email)) { - formIsValid = false; - errors["email"] = 'Required'; - } - else { - errors['email'] = ''; - } - } - - if(!image){ formIsValid = false; errors['image'] = 'Required'; } - else errors['image'] = ''; - - if(first_name.length == 0){ formIsValid = false; errors['first_name'] = 'Required'; } - else errors['first_name'] = ''; - - if(last_name.length == 0){ formIsValid = false; errors['last_name'] = 'Required'; } - else errors['last_name'] = ''; - - if(identify.length == 0){ formIsValid = false; errors['identify'] = 'Required'; } - else errors['identify'] = ''; - - if(password.length < 8){ formIsValid = false; errors['password'] = 'Required'; } - else errors['password'] = ''; - - if(company.length == 0){ formIsValid = false; errors['company'] = 'Required'; } - else errors['company'] = ''; - - setErrors(errors); - return formIsValid; - } const handleImageChange = (e) => { @@ -110,19 +79,14 @@ const SignUp = () => { return (
-

本登録

- { - err_msg.status.length != 0 && - - {err_msg.msg} - - } +

本登録

handleImageChange(e)}/> -
+
{ @@ -131,82 +95,84 @@ const SignUp = () => { }
{ - errors['image'].length != 0 && + _422errors.image && - { errors['image']} + { _422errors.image } }
- - setFirstName(e.target.value)}/> + + setFirstName(e.target.value)}/> { - errors['first_name'].length != 0 && + _422errors.first_name && - {errors['first_name']} + { _422errors.first_name } }
- - setLastName(e.target.value)}/> + + setLastName(e.target.value)}/> { - errors['last_name'].length != 0 && + _422errors.last_name && - {errors['last_name']} + { _422errors.last_name } }
- - setIdentify(e.target.value)}/> + + setIdentify(e.target.value)}/> { - errors['identify'].length != 0 && + _422errors.identify && - {errors['identify']} + { _422errors.identify } }
- - setEmail(e.target.value)}/> + + setEmail(e.target.value)}/> { - errors['email'].length != 0 && + _422errors.email && - {errors['email']} + { _422errors.email } }
- - setPassword(e.target.value)}/> + + setPassword(e.target.value)}/> { - errors['password'].length != 0 && + _422errors.password && - {errors['password']} + { _422errors.password } }
- - setCompany(e.target.value)}/> + + setCompany(e.target.value)}/> { - errors['company'].length != 0 && + _422errors.company && - {errors['company']} + { _422errors.company } }
- - 本登録 + + 本登録
diff --git a/backend/resources/js/child/auth/register/temporary.jsx b/backend/resources/js/child/auth/register/temporary.jsx index f33d5f80..1b0ee434 100644 --- a/backend/resources/js/child/auth/register/temporary.jsx +++ b/backend/resources/js/child/auth/register/temporary.jsx @@ -1,9 +1,6 @@ import React, { useEffect, useState } from 'react'; -import ReactDOM from 'react-dom'; import axios from 'axios'; -import { Button } from '@material-ui/core'; import { LoadingButton } from '@material-ui/lab'; -import { CircularProgress } from '@material-ui/core'; import Alert from '../../../component/alert'; const SignUpTemporary = () => { @@ -37,7 +34,7 @@ const SignUpTemporary = () => { return (
-

仮登録手続き

+

仮登録手続き

@@ -55,11 +52,8 @@ const SignUpTemporary = () => { - 送信 + 仮登録送信 - { - submit && - } { _400error && set400Error('')}>{_400error} } diff --git a/backend/resources/js/pages/contact/index.jsx b/backend/resources/js/pages/contact/index.jsx index 1e2d230e..697c8004 100644 --- a/backend/resources/js/pages/contact/index.jsx +++ b/backend/resources/js/pages/contact/index.jsx @@ -61,11 +61,8 @@ const Contact = () => { - 送信 + 送信 - { - submit && - } { _400error && set400Error('')}>{_400error} }