add phuc yen

src/App.js

@@ -39,22 +39,18 @@ function App() {
       <div className="loading-side hide"></div>
       <Router path="/" history={history}>
         <Switch>
-          <Route>
+        <RouteRedirectToAdmin
-            <Switch>
+          path="/:orgLevel"
-              <RouteRedirectToAdmin
+          exact={true}
-                path="/namdinh"
+          component={RegisterPage}
-                exact={true}
+        />
-                component={RegisterPage}
+        <RouteRedirectToAdmin
-              />
+          path="/:orgLevel/authentication"
-              <RouteRedirectToAdmin
+          exact={true}
-                path="/namdinh/authentication"
+          component={AccountAuthentication}
-                exact={true}
+        />
-                component={AccountAuthentication}
+        <Redirect from="*" to="/namdinh" />
-              />
-            </Switch>
-          </Route>
         </Switch>
-        <Redirect to="/namdinh" />
       </Router>
     </div>
   );

src/_components/Header/HeaderCloud.js

@@ -5,7 +5,7 @@ import { useSelector } from "react-redux";
 function HeaderCloud() {
   const authentication = useSelector((state) => state.authentication);
   return (
-    <div className="logo">
+    <div className="logo-nam-dinh">
       <Link to={`/namdinh`}>
         <img src={"/assets/images/Logo_ND.png"} alt={"Logo"} />
       </Link>

src/_components/Header/HeaderLogoRegister/HeaderLogoRegister.js

@@ -3,19 +3,19 @@ import { Link } from "react-router-dom";
 import { useSelector } from "react-redux";
 import './headerTS.style.scss'
 
-function HeaderTS() {
+function HeaderLogoRegister({srcImg, name, color}) {
-  const authentication = useSelector((state) => state.authentication);
   return (
     <div className="logo header-ts">
       <Link to={`/`}>
         <img 
-          src={"/assets/images/logo_GV.png"} 
+          src={srcImg} 
           alt={"Logo"} 
         />
-        <span className="flex-1 d-flex align-items-center branch-text" >Cô Đặng Thu Hiền</span>
+        {name.split('\n').map((str, index) => <span key={index} className="flex-1 d-flex align-items-center branch-text" style={{color}}>{str}</span>)}
+         
       </Link>
     </div>
   );
 }
 
-export { HeaderTS };
+export { HeaderLogoRegister };

src/_components/Header/HeaderLogoRegister/headerTS.style.scss

@@ -25,12 +25,12 @@
   }
 
   img {
-    width: 90px;
+    width: 120px;
     height: auto;
     margin-top: 0 !important;
 
     @media screen and (max-width: 768px) {
-      width: 50px;
+      width: 74px;
     }
   }
 
@@ -38,7 +38,6 @@
     font-size: 16px;
     font-weight: 700;
     margin-top: 4px;
-    color: #14375F;
     font-family: 'Barlow-Bold';
 
     @media screen and (max-height: 800px) {

src/_components/Header/index.js

@@ -1,5 +1,5 @@
 export * from "./HeaderCloud";
 export * from "./HeaderCurve";
 export * from "./HeaderSquare";
-export * from "./HeaderTS/HeaderTS";
+export * from "./HeaderLogoRegister/HeaderLogoRegister";
 export { default as HeaderNews } from "./HeaderNews/HeaderNews";

src/_components/Modal/ModalConfirmOTP/ModalConfirmOTP.jsx

@@ -120,20 +120,20 @@ const ModalConfirmOTP = (props) => {
               XÁC NHẬN
             </div>
           </ButtonNews>
-          {/* <ButtonNews
+          <ButtonNews
           className={'otp-btn-responsive'}
           width="15rem"
           height="3.5rem"
-          onClick={handleGoBack}
+          onClick={() => window.location.replace('https://sundayenglish.com/login')}
           border={"1px solid #00cc83"}
           backgroundColor={"#fff"}
           maxWidth={"45%"}
           maxHeight={"7vw"}
         >
           <div className="fz-12 fz-09-mobile  color-primary-green font_news_bold">
-            QUAY LẠI ĐĂNG NHẬP
+            ĐĂNG NHẬP
           </div>
-        </ButtonNews> */}
+        </ButtonNews>
         </div>
       </div>
     </div>

src/_constants/register.js

@@ -0,0 +1,17 @@
+export const registerValue = {
+  namdinh: {
+    province_alias: 'nam_dinh_',
+    district_alias: '',
+    organization: '',
+    represent_code: 'ND1'
+  },
+  phucyen: {
+    province_alias: 'vinh_phuc',
+    district_alias: 'thanh_pho_phuc_yen',
+    organization: '',
+    represent_code: 'PY1',
+    logo: '/assets/images/logo_PY1.png',
+    name: 'Phòng Giáo dục thành phố\nPhúc Yên - Vĩnh Phúc',
+    color: '#3493B8'
+  }
+}

src/_containers/RegisterPage/RegisterPage.js

@@ -1,5 +1,5 @@
 import React, { useEffect, useState } from "react";
-import { HeaderCloud, HeaderTS } from "../../_components/Header";
+import { HeaderCloud, HeaderLogoRegister } from "../../_components/Header";
 import { stepAuthConstants } from "../../_constants/auth";
 import { apiCaller, history } from "../../_helpers";
 import AccountType from "./components/AccountType";
@@ -15,7 +15,12 @@ import { isEmpty } from "lodash";
 import AddClassName from "./components/AddClassName";
 import './register.scss'
 import AddressStudying from "./components/AddressStudying";
+import { useParams } from "react-router-dom";
+import { registerValue } from "../../_constants/register";
 function RegisterPage() {
+  const params = useParams();
+  const orgLevel = params?.orgLevel;
+  const [registerInfo, setRegisterInfo] = useState(registerValue?.[orgLevel] || undefined);
   const [step, setStep] = useState(stepAuthConstants.STEP_ADDRESS_STUDYING);
   const [dataAddressStudying, setDataAddressStudying] = useState({
     province: '',
@@ -86,7 +91,7 @@ function RegisterPage() {
     };
     data.birthday = moment(dataUpdateInfo.birthday).format("YYYY-MM-DD");
     setPopupMessageRegisterTeacher(false);
-    history.push(`/namdinh/authentication`, { data: data });
+    history.push(`/${orgLevel}/authentication`, { data: data });
   };
 
   const onRegister = async () => {
@@ -183,7 +188,15 @@ function RegisterPage() {
 
   return (
     <div className="bg-register rel">
-      <HeaderTS />
+      {!!registerInfo && 
+      (orgLevel === 'namdinh' ? 
+        <HeaderCloud /> 
+        : <HeaderLogoRegister 
+            srcImg={registerInfo?.logo} 
+            name={registerInfo?.name} 
+            color={registerInfo?.color}
+          />
+      )}
       {statusRegister.type !== "success" ? (
         <>
           <div
@@ -198,7 +211,8 @@ function RegisterPage() {
               setStep={setStep}
               data={dataAddressStudying}
               setData={setDataAddressStudying}
-              
+              registerInfo={registerInfo}
+              setRegisterInfo={setRegisterInfo}
             />
           </div>
           <div

src/_containers/RegisterPage/components/AccountAuthentication/AccountAuthentication.jsx

@@ -1,11 +1,13 @@
-import React from "react";
+import React, { useState } from "react";
 import { accountAuthenticationMethods } from "./AccountAuthentication.logic";
 import { HeaderCloud, HeaderTS } from "../../../../_components/Header";
 import ModalConfirmOTP from "../../../../_components/Modal/ModalConfirmOTP/ModalConfirmOTP";
 import "./AccountAuthentication.scss";
-import { Link } from "react-router-dom";
+import { Link, useParams } from "react-router-dom";
 import { PopUpYesNo } from "../../../../_components/Popup";
 import { history } from "../../../../_helpers";
+import { registerValue } from "../../../../_constants/register";
+import { HeaderLogoRegister } from "../../../../_components/Header/HeaderLogoRegister/HeaderLogoRegister";
 
 // export const SuccessAuthentication = () => {
 //   return (
@@ -57,10 +59,21 @@ const AccountAuthentication = () => {
     messageReSendCode,
     setPopupRegisterSuccess
   } = accountAuthenticationMethods();
+  const params = useParams();
+  const orgLevel = params?.orgLevel;
+  const [registerInfo, setRegisterInfo] = useState(registerValue?.[orgLevel] || undefined);
 
   return (
     <div className="bg-register rel">
-      <HeaderTS />
+      {!!registerInfo && 
+      (orgLevel === 'namdinh' ? 
+        <HeaderCloud /> 
+        : <HeaderLogoRegister 
+            srcImg={registerInfo?.logo} 
+            name={registerInfo?.name} 
+            color={registerInfo?.color}
+          />
+      )}
       {popupRegisterSuccess &&  <PopUpYesNo message={"Xác thực tài khoản thành công!"} hideButtonNo={true} onClickYes={() => setPopupRegisterSuccess(false)} labelYes={"Đồng ý"}/>}
       <div className="content_1 flex-center-column">
         <div className="flex-center-column container_modal_confirmOTP">

src/_containers/RegisterPage/components/AccountAuthentication/AccountAuthentication.logic.js

@@ -139,7 +139,7 @@ export const accountAuthenticationMethods = () => {
   };
 
   const handleGoBack = () => {
-    history.replace("/namdinh");
+    history.goBack();
   };
 
   return {

src/_containers/RegisterPage/components/AddClassName/index.js

@@ -156,7 +156,7 @@ export default function AddClassName(props) {
                 <p className="add-class-content-label-list">Dạy các lớp:</p>
                 <div className="add-class-content-list">
                   {listClass?.map((item, index) => (
-                    <div className="add-class-content-item">
+                    <div key={index} className="add-class-content-item">
                       <InputText
                       key={index}
                       value={item.name}

src/_containers/RegisterPage/components/AddressStudying/index.jsx

@@ -1,11 +1,15 @@
 import { useEffect, useState } from 'react';
 import './index.scss'
-import { apiCaller } from '../../../../_helpers';
+import { apiCaller, history } from '../../../../_helpers';
 import InputSelectSearch from '../../../../_components/Auth/InputSelectSearch';
 import { renderLocationIcon, renderSchoolIcon } from './renderIcon';
 import { stepAuthConstants } from '../../../../_constants/auth';
+import { useParams } from 'react-router-dom';
+import { registerValue } from '../../../../_constants/register';
 
 export default function AddressStudying(props) {
+  const params = useParams()
+  const orgLevel = params?.orgLevel
   const [school, setSchool] = useState({
     title: '',
     value: '',
@@ -14,13 +18,13 @@ export default function AddressStudying(props) {
   // address
   const [provinceList, setProvinceList] = useState([]);
   const [province, setProvince] = useState({
-    title: "Nam Định",
+    title: "",
-    value: "nam_Dinh_",
+    value: props?.registerInfo?.province_alias || "nam_dinh_",
   });
   const [districtList, setDistrictList] = useState([]);
   const [district, setDistrict] = useState({
     title: "",
-    value: "",
+    value: props?.registerInfo?.district_alias || "",
   });
   const [schoolList, setSchoolList] = useState([]);
   const [errProvince, setErrProvince] = useState("");
@@ -60,7 +64,7 @@ export default function AddressStudying(props) {
   };
 
   const getOrganizationList = (districtAlias) => {
-    apiCaller(`/api_organization/get_represent_code?district_alias=${districtAlias}&represent_code=nd1`).then(
+    apiCaller(`/api_organization/get_represent_code?district_alias=${districtAlias}&represent_code=${props?.registerInfo?.represent_code}`).then(
       (res) => {
         if(res?.status) {
           setOrganizationList(res.data)
@@ -129,9 +133,38 @@ export default function AddressStudying(props) {
   }
   
   useEffect(() => {
-    getDistrictList(province.value);
+    if(!props?.registerInfo) {
+      history.push('/namdinh')
+      return;
+    }
+    if(province.value) {
+      getDistrictList(province.value);
+    }
+    if (district.value) {
+      getOrganizationList(district.value);
+    }
   }, []);
 
+  useEffect(() => {
+    if(!!registerValue?.[orgLevel]?.represent_code) {
+      if(!!registerValue[orgLevel]?.province_alias) {
+        setProvince({
+          title: '',
+          value: registerValue[orgLevel].province_alias
+        })
+        getDistrictList(registerValue[orgLevel]?.province_alias);
+      }
+      if (!!registerValue[orgLevel]?.district_alias) {
+        setDistrict({
+          title: '',
+          value: registerValue[orgLevel].district_alias
+        })
+        getOrganizationList(registerValue[orgLevel]?.district_alias);
+      }
+      props.setRegisterInfo(registerValue[orgLevel])
+    }
+  }, [orgLevel])
+
   return (
     <div className="sunE-form-container login-form-container register_create_account register_step">
       <div className="sunE-custom-form login-form-container_content responsive_small_screen_margin_login">
@@ -162,7 +195,7 @@ export default function AddressStudying(props) {
               errorAbsolute={true}
               bottomErr={true}
             /> */}
-            <InputSelectSearch
+            {!!props?.registerInfo?.province_alias && !props?.registerInfo?.district_alias && <InputSelectSearch
               className="field_item field_district"
               value={district}
               setValue={changeDistrict}
@@ -183,7 +216,7 @@ export default function AddressStudying(props) {
               setErrorText={setErrDistrict}
               errorAbsolute={true}
               bottomErr={true}
-            />
+            />}
             <InputSelectSearch
               className="field_item field_school"
               value={organization}
@@ -194,8 +227,8 @@ export default function AddressStudying(props) {
                   title: item.name,
                 };
               })}
-              placeholder="Tổ chức"
+              placeholder="Trường"
-              titleHeader="Chọn Tổ chức"
+              titleHeader="Chọn Trường"
               renderLabelIcon={renderSchoolIcon}
               disabledClick={!district.value}
               onClickDisable={() => {

src/_containers/RegisterPage/components/UpdateInformation/index.js

@@ -113,7 +113,7 @@ const UpdateInformation = (props) => {
       <div className="sunE-custom-form register_update_info_content responsive_small_screen_margin_login">
         <h2 className="title_register title text-center">ĐĂNG KÝ TÀI KHOẢN</h2>
         <h3 className="step_register_name text-center">
-          {`3. Cập nhật thông tin`}
+          {`4. Cập nhật thông tin`}
         </h3>
 
         {props.popupMessageRegisterTeacher && (

src/_containers/RegisterPage/register.scss

@@ -5,16 +5,27 @@ $bg-gg: #be1e2d;
 $bg-apple: #000000;
 $loading-color: #f8f8f8;
 
-.bg-register .logo img {
+.bg-register .logo-nam-dinh {
-  width: 144px;
+  a {
-  margin-top: 32px;
+    margin-left: 32px;
 
-  @media screen and (max-height: 800px) {
+    @media screen and (max-width: 768px) {
-    width: 120px;
+      margin-left: 16px;
+    }
   }
 
-  @media screen and (max-width: 768px) {
+  img {
-    width: 96px;
+    width: 173px;
+    margin-top: 32px;
+
+    @media screen and (max-height: 800px) {
+      width: 163px;
+      margin-top: 16px;
+    }
+
+    @media screen and (max-width: 768px) {
+      width: 128px;
+    }
   }
 }