all pages finished
This commit is contained in:
parent
dbdd113800
commit
1cdad2bd3f
|
|
@ -1,9 +1,10 @@
|
|||
{
|
||||
"files": {
|
||||
"main.css": "/static/css/main.d7c251b5.css",
|
||||
"main.js": "/static/js/main.570d89c5.js",
|
||||
"main.css": "/static/css/main.ecef0c3a.css",
|
||||
"main.js": "/static/js/main.2b8b0c04.js",
|
||||
"static/media/logo-bg.jpg": "/static/media/logo-bg.1d55df78b7376108f96c.jpg",
|
||||
"static/media/logo.jpg": "/static/media/logo.4132ef3815cdd5e7314e.jpg",
|
||||
"static/media/calendar.svg": "/static/media/calendar.e2692a10a4c5fdc8759f.svg",
|
||||
"static/media/credit.svg": "/static/media/credit.287a7c0a67e2efc5004a44819ab0b1d2.svg",
|
||||
"static/media/credit-black.svg": "/static/media/credit-black.4419b888afb601aaa0e831c7fc78346c.svg",
|
||||
"static/media/eye.svg": "/static/media/eye.f9346869c016b70e664073d0d63a236f.svg",
|
||||
|
|
@ -17,6 +18,7 @@
|
|||
"static/media/clipboard.svg": "/static/media/clipboard.4c980440ec680158cc4369c248835d93.svg",
|
||||
"static/media/clipboard-white.svg": "/static/media/clipboard-white.6b04fc7a38461b507ebc6814b0e95321.svg",
|
||||
"static/media/user.svg": "/static/media/user.1edbaf08b8a73a42744cfa2a9a55d0ff.svg",
|
||||
"static/media/user-black.svg": "/static/media/user-black.9978588a52a2ea5173ff37b11e3a764a.svg",
|
||||
"static/media/mail.svg": "/static/media/mail.df1df1c997cf97d4c516a00a8bb96f27.svg",
|
||||
"static/media/change.svg": "/static/media/change.5d9361e55ef16545f582144ba4e2893c.svg",
|
||||
"static/media/mail-black.svg": "/static/media/mail-black.dc94c1494611bb6132d841be14fba8f4.svg",
|
||||
|
|
@ -31,11 +33,11 @@
|
|||
"static/media/arrow-back.svg": "/static/media/arrow-back.7106eb7539d85d1dc7288726f85efeba.svg",
|
||||
"static/media/arrow-gray.svg": "/static/media/arrow-gray.c688e9bf277186332d33431cd6f52c8e.svg",
|
||||
"static/media/arrow-down.svg": "/static/media/arrow-down.2ec2ec0ddf677f60c1aa23e6d1abdc8d.svg",
|
||||
"main.d7c251b5.css.map": "/static/css/main.d7c251b5.css.map",
|
||||
"main.570d89c5.js.map": "/static/js/main.570d89c5.js.map"
|
||||
"main.ecef0c3a.css.map": "/static/css/main.ecef0c3a.css.map",
|
||||
"main.2b8b0c04.js.map": "/static/js/main.2b8b0c04.js.map"
|
||||
},
|
||||
"entrypoints": [
|
||||
"static/css/main.d7c251b5.css",
|
||||
"static/js/main.570d89c5.js"
|
||||
"static/css/main.ecef0c3a.css",
|
||||
"static/js/main.2b8b0c04.js"
|
||||
]
|
||||
}
|
||||
|
|
@ -1 +1 @@
|
|||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>HalkBank</title><script defer="defer" src="/static/js/main.570d89c5.js"></script><link href="/static/css/main.d7c251b5.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
|
||||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>HalkBank</title><script defer="defer" src="/static/js/main.2b8b0c04.js"></script><link href="/static/css/main.ecef0c3a.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,12 @@
|
|||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4.71792 3.34884C4.38151 3.34884 4.10254 3.09581 4.10254 2.7907V0.55814C4.10254 0.253023 4.38151 0 4.71792 0C5.05433 0 5.33331 0.253023 5.33331 0.55814V2.7907C5.33331 3.09581 5.05433 3.34884 4.71792 3.34884Z" fill="#3A3A3A"/>
|
||||
<path d="M11.2824 3.34884C10.946 3.34884 10.667 3.09581 10.667 2.7907V0.55814C10.667 0.253023 10.946 0 11.2824 0C11.6188 0 11.8978 0.253023 11.8978 0.55814V2.7907C11.8978 3.09581 11.6188 3.34884 11.2824 3.34884Z" fill="#3A3A3A"/>
|
||||
<path d="M5.12813 9.86046C5.02146 9.86046 4.9148 9.83815 4.81633 9.80094C4.70967 9.76373 4.62762 9.71162 4.54557 9.64464C4.39787 9.50325 4.30762 9.31721 4.30762 9.11628C4.30762 9.01953 4.33223 8.92279 4.37326 8.83348C4.41429 8.74418 4.47172 8.66233 4.54557 8.58791C4.62762 8.52094 4.70967 8.46883 4.81633 8.43162C5.11172 8.31999 5.48095 8.37954 5.71069 8.58791C5.85839 8.72931 5.94864 8.92279 5.94864 9.11628C5.94864 9.16093 5.94044 9.21303 5.93223 9.26512C5.92403 9.30978 5.90762 9.35442 5.883 9.39907C5.86659 9.44372 5.84198 9.48837 5.80916 9.53302C5.78454 9.57023 5.74351 9.60743 5.71069 9.64464C5.5548 9.7786 5.34146 9.86046 5.12813 9.86046Z" fill="#3A3A3A"/>
|
||||
<path d="M8.0002 9.86048C7.89353 9.86048 7.78687 9.83816 7.6884 9.80095C7.58174 9.76374 7.49969 9.71163 7.41764 9.64466C7.26994 9.50326 7.17969 9.31722 7.17969 9.11629C7.17969 9.01955 7.2043 8.9228 7.24533 8.8335C7.28636 8.74419 7.34379 8.66234 7.41764 8.58792C7.49969 8.52095 7.58174 8.46884 7.6884 8.43163C7.98379 8.31256 8.35302 8.37955 8.58276 8.58792C8.73046 8.72932 8.82071 8.9228 8.82071 9.11629C8.82071 9.16094 8.81251 9.21304 8.8043 9.26514C8.7961 9.30979 8.77969 9.35443 8.75507 9.39908C8.73866 9.44374 8.71405 9.48838 8.68123 9.53303C8.65661 9.57024 8.61558 9.60745 8.58276 9.64466C8.42687 9.77861 8.21353 9.86048 8.0002 9.86048Z" fill="#3A3A3A"/>
|
||||
<path d="M10.8713 9.86048C10.7646 9.86048 10.658 9.83816 10.5595 9.80095C10.4528 9.76374 10.3708 9.71163 10.2887 9.64466C10.2559 9.60745 10.2231 9.57024 10.1903 9.53303C10.1574 9.48838 10.1328 9.44374 10.1164 9.39908C10.0918 9.35443 10.0754 9.30979 10.0672 9.26514C10.059 9.21304 10.0508 9.16094 10.0508 9.11629C10.0508 8.9228 10.141 8.72932 10.2887 8.58792C10.3708 8.52095 10.4528 8.46884 10.5595 8.43163C10.8631 8.31256 11.2241 8.37955 11.4539 8.58792C11.6015 8.72932 11.6918 8.9228 11.6918 9.11629C11.6918 9.16094 11.6836 9.21304 11.6754 9.26514C11.6672 9.30979 11.6508 9.35443 11.6262 9.39908C11.6098 9.44374 11.5851 9.48838 11.5523 9.53303C11.5277 9.57024 11.4867 9.60745 11.4539 9.64466C11.298 9.77861 11.0846 9.86048 10.8713 9.86048Z" fill="#3A3A3A"/>
|
||||
<path d="M5.12813 12.4651C5.02146 12.4651 4.9148 12.4428 4.81633 12.4056C4.71787 12.3684 4.62762 12.3163 4.54557 12.2493C4.39787 12.1079 4.30762 11.9144 4.30762 11.7209C4.30762 11.6242 4.33223 11.5274 4.37326 11.4381C4.41429 11.3414 4.47172 11.2595 4.54557 11.1926C4.84916 10.9172 5.4071 10.9172 5.71069 11.1926C5.85839 11.334 5.94864 11.5274 5.94864 11.7209C5.94864 11.9144 5.85839 12.1079 5.71069 12.2493C5.5548 12.3833 5.34146 12.4651 5.12813 12.4651Z" fill="#3A3A3A"/>
|
||||
<path d="M8.0002 12.4651C7.78687 12.4651 7.57353 12.3833 7.41764 12.2493C7.26994 12.1079 7.17969 11.9144 7.17969 11.7209C7.17969 11.6242 7.2043 11.5274 7.24533 11.4381C7.28636 11.3414 7.34379 11.2595 7.41764 11.1926C7.72123 10.9172 8.27917 10.9172 8.58276 11.1926C8.65661 11.2595 8.71405 11.3414 8.75507 11.4381C8.7961 11.5274 8.82071 11.6242 8.82071 11.7209C8.82071 11.9144 8.73046 12.1079 8.58276 12.2493C8.42687 12.3833 8.21353 12.4651 8.0002 12.4651Z" fill="#3A3A3A"/>
|
||||
<path d="M10.8713 12.4651C10.658 12.4651 10.4446 12.3833 10.2887 12.2493C10.2149 12.1823 10.1574 12.1005 10.1164 12.0037C10.0754 11.9144 10.0508 11.8177 10.0508 11.721C10.0508 11.6242 10.0754 11.5275 10.1164 11.4382C10.1574 11.3414 10.2149 11.2596 10.2887 11.1926C10.4774 11.0214 10.7646 10.9395 11.0272 10.9916C11.0846 10.9991 11.1339 11.014 11.1831 11.0363C11.2323 11.0512 11.2816 11.0735 11.3308 11.1033C11.3718 11.1256 11.4128 11.1628 11.4539 11.1926C11.6015 11.334 11.6918 11.5275 11.6918 11.721C11.6918 11.9144 11.6015 12.1079 11.4539 12.2493C11.298 12.3833 11.0846 12.4651 10.8713 12.4651Z" fill="#3A3A3A"/>
|
||||
<path d="M14.9743 6.39252H1.02554C0.689131 6.39252 0.410156 6.1395 0.410156 5.83438C0.410156 5.52927 0.689131 5.27625 1.02554 5.27625H14.9743C15.3107 5.27625 15.5896 5.52927 15.5896 5.83438C15.5896 6.1395 15.3107 6.39252 14.9743 6.39252Z" fill="#3A3A3A"/>
|
||||
<path d="M11.2821 16H4.71795C1.72308 16 0 14.4372 0 11.7209V5.39534C0 2.67906 1.72308 1.11627 4.71795 1.11627H11.2821C14.2769 1.11627 16 2.67906 16 5.39534V11.7209C16 14.4372 14.2769 16 11.2821 16ZM4.71795 2.23255C2.37128 2.23255 1.23077 3.26697 1.23077 5.39534V11.7209C1.23077 13.8493 2.37128 14.8837 4.71795 14.8837H11.2821C13.6287 14.8837 14.7692 13.8493 14.7692 11.7209V5.39534C14.7692 3.26697 13.6287 2.23255 11.2821 2.23255H4.71795Z" fill="#3A3A3A"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.8 KiB |
|
|
@ -0,0 +1,5 @@
|
|||
<svg width="18" height="17" viewBox="0 0 18 17" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M11.4003 17H6.60031C5.54431 17 4.66431 16.8998 3.92031 16.6839C3.64831 16.6068 3.47231 16.3523 3.48831 16.0824C3.68831 13.7769 6.11231 11.9648 9.00031 11.9648C11.8883 11.9648 14.3043 13.7691 14.5123 16.0824C14.5363 16.36 14.3603 16.6068 14.0803 16.6839C13.3363 16.8998 12.4563 17 11.4003 17ZM4.77631 15.6969C5.30431 15.7971 5.90431 15.8434 6.60031 15.8434H11.4003C12.0963 15.8434 12.6963 15.7971 13.2243 15.6969C12.8003 14.2164 11.0483 13.1214 9.00031 13.1214C6.95231 13.1214 5.20031 14.2164 4.77631 15.6969Z" fill="#3A3A3A"/>
|
||||
<path d="M11.4 1H6.6C2.6 1 1 2.54217 1 6.39759V11.0241C1 13.9388 1.912 15.5349 4.088 16.1287C4.264 14.1239 6.4 12.5431 9 12.5431C11.6 12.5431 13.736 14.1239 13.912 16.1287C16.088 15.5349 17 13.9388 17 11.0241V6.39759C17 2.54217 15.4 1 11.4 1ZM9 10.3841C7.416 10.3841 6.136 9.14266 6.136 7.61592C6.136 6.08917 7.416 4.85542 9 4.85542C10.584 4.85542 11.864 6.08917 11.864 7.61592C11.864 9.14266 10.584 10.3841 9 10.3841Z" stroke="#3A3A3A" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M9.00013 10.9624C7.08813 10.9624 5.53613 9.4588 5.53613 7.61591C5.53613 5.77302 7.08813 4.2771 9.00013 4.2771C10.9121 4.2771 12.4641 5.77302 12.4641 7.61591C12.4641 9.4588 10.9121 10.9624 9.00013 10.9624ZM9.00013 5.43373C7.75213 5.43373 6.73613 6.41302 6.73613 7.61591C6.73613 8.82651 7.75213 9.80576 9.00013 9.80576C10.2481 9.80576 11.2641 8.82651 11.2641 7.61591C11.2641 6.41302 10.2481 5.43373 9.00013 5.43373Z" fill="#3A3A3A"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
|
|
@ -116,7 +116,7 @@ const Side = ({ sideOpen }) => {
|
|||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<Link to="" className="side-footer">
|
||||
<Link to="/" className="side-footer">
|
||||
<div className="footer-img">
|
||||
<img src={arrow} alt="arrow" />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,12 @@
|
|||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M4.71792 3.34884C4.38151 3.34884 4.10254 3.09581 4.10254 2.7907V0.55814C4.10254 0.253023 4.38151 0 4.71792 0C5.05433 0 5.33331 0.253023 5.33331 0.55814V2.7907C5.33331 3.09581 5.05433 3.34884 4.71792 3.34884Z" fill="#3A3A3A"/>
|
||||
<path d="M11.2824 3.34884C10.946 3.34884 10.667 3.09581 10.667 2.7907V0.55814C10.667 0.253023 10.946 0 11.2824 0C11.6188 0 11.8978 0.253023 11.8978 0.55814V2.7907C11.8978 3.09581 11.6188 3.34884 11.2824 3.34884Z" fill="#3A3A3A"/>
|
||||
<path d="M5.12813 9.86046C5.02146 9.86046 4.9148 9.83815 4.81633 9.80094C4.70967 9.76373 4.62762 9.71162 4.54557 9.64464C4.39787 9.50325 4.30762 9.31721 4.30762 9.11628C4.30762 9.01953 4.33223 8.92279 4.37326 8.83348C4.41429 8.74418 4.47172 8.66233 4.54557 8.58791C4.62762 8.52094 4.70967 8.46883 4.81633 8.43162C5.11172 8.31999 5.48095 8.37954 5.71069 8.58791C5.85839 8.72931 5.94864 8.92279 5.94864 9.11628C5.94864 9.16093 5.94044 9.21303 5.93223 9.26512C5.92403 9.30978 5.90762 9.35442 5.883 9.39907C5.86659 9.44372 5.84198 9.48837 5.80916 9.53302C5.78454 9.57023 5.74351 9.60743 5.71069 9.64464C5.5548 9.7786 5.34146 9.86046 5.12813 9.86046Z" fill="#3A3A3A"/>
|
||||
<path d="M8.0002 9.86048C7.89353 9.86048 7.78687 9.83816 7.6884 9.80095C7.58174 9.76374 7.49969 9.71163 7.41764 9.64466C7.26994 9.50326 7.17969 9.31722 7.17969 9.11629C7.17969 9.01955 7.2043 8.9228 7.24533 8.8335C7.28636 8.74419 7.34379 8.66234 7.41764 8.58792C7.49969 8.52095 7.58174 8.46884 7.6884 8.43163C7.98379 8.31256 8.35302 8.37955 8.58276 8.58792C8.73046 8.72932 8.82071 8.9228 8.82071 9.11629C8.82071 9.16094 8.81251 9.21304 8.8043 9.26514C8.7961 9.30979 8.77969 9.35443 8.75507 9.39908C8.73866 9.44374 8.71405 9.48838 8.68123 9.53303C8.65661 9.57024 8.61558 9.60745 8.58276 9.64466C8.42687 9.77861 8.21353 9.86048 8.0002 9.86048Z" fill="#3A3A3A"/>
|
||||
<path d="M10.8713 9.86048C10.7646 9.86048 10.658 9.83816 10.5595 9.80095C10.4528 9.76374 10.3708 9.71163 10.2887 9.64466C10.2559 9.60745 10.2231 9.57024 10.1903 9.53303C10.1574 9.48838 10.1328 9.44374 10.1164 9.39908C10.0918 9.35443 10.0754 9.30979 10.0672 9.26514C10.059 9.21304 10.0508 9.16094 10.0508 9.11629C10.0508 8.9228 10.141 8.72932 10.2887 8.58792C10.3708 8.52095 10.4528 8.46884 10.5595 8.43163C10.8631 8.31256 11.2241 8.37955 11.4539 8.58792C11.6015 8.72932 11.6918 8.9228 11.6918 9.11629C11.6918 9.16094 11.6836 9.21304 11.6754 9.26514C11.6672 9.30979 11.6508 9.35443 11.6262 9.39908C11.6098 9.44374 11.5851 9.48838 11.5523 9.53303C11.5277 9.57024 11.4867 9.60745 11.4539 9.64466C11.298 9.77861 11.0846 9.86048 10.8713 9.86048Z" fill="#3A3A3A"/>
|
||||
<path d="M5.12813 12.4651C5.02146 12.4651 4.9148 12.4428 4.81633 12.4056C4.71787 12.3684 4.62762 12.3163 4.54557 12.2493C4.39787 12.1079 4.30762 11.9144 4.30762 11.7209C4.30762 11.6242 4.33223 11.5274 4.37326 11.4381C4.41429 11.3414 4.47172 11.2595 4.54557 11.1926C4.84916 10.9172 5.4071 10.9172 5.71069 11.1926C5.85839 11.334 5.94864 11.5274 5.94864 11.7209C5.94864 11.9144 5.85839 12.1079 5.71069 12.2493C5.5548 12.3833 5.34146 12.4651 5.12813 12.4651Z" fill="#3A3A3A"/>
|
||||
<path d="M8.0002 12.4651C7.78687 12.4651 7.57353 12.3833 7.41764 12.2493C7.26994 12.1079 7.17969 11.9144 7.17969 11.7209C7.17969 11.6242 7.2043 11.5274 7.24533 11.4381C7.28636 11.3414 7.34379 11.2595 7.41764 11.1926C7.72123 10.9172 8.27917 10.9172 8.58276 11.1926C8.65661 11.2595 8.71405 11.3414 8.75507 11.4381C8.7961 11.5274 8.82071 11.6242 8.82071 11.7209C8.82071 11.9144 8.73046 12.1079 8.58276 12.2493C8.42687 12.3833 8.21353 12.4651 8.0002 12.4651Z" fill="#3A3A3A"/>
|
||||
<path d="M10.8713 12.4651C10.658 12.4651 10.4446 12.3833 10.2887 12.2493C10.2149 12.1823 10.1574 12.1005 10.1164 12.0037C10.0754 11.9144 10.0508 11.8177 10.0508 11.721C10.0508 11.6242 10.0754 11.5275 10.1164 11.4382C10.1574 11.3414 10.2149 11.2596 10.2887 11.1926C10.4774 11.0214 10.7646 10.9395 11.0272 10.9916C11.0846 10.9991 11.1339 11.014 11.1831 11.0363C11.2323 11.0512 11.2816 11.0735 11.3308 11.1033C11.3718 11.1256 11.4128 11.1628 11.4539 11.1926C11.6015 11.334 11.6918 11.5275 11.6918 11.721C11.6918 11.9144 11.6015 12.1079 11.4539 12.2493C11.298 12.3833 11.0846 12.4651 10.8713 12.4651Z" fill="#3A3A3A"/>
|
||||
<path d="M14.9743 6.39252H1.02554C0.689131 6.39252 0.410156 6.1395 0.410156 5.83438C0.410156 5.52927 0.689131 5.27625 1.02554 5.27625H14.9743C15.3107 5.27625 15.5896 5.52927 15.5896 5.83438C15.5896 6.1395 15.3107 6.39252 14.9743 6.39252Z" fill="#3A3A3A"/>
|
||||
<path d="M11.2821 16H4.71795C1.72308 16 0 14.4372 0 11.7209V5.39534C0 2.67906 1.72308 1.11627 4.71795 1.11627H11.2821C14.2769 1.11627 16 2.67906 16 5.39534V11.7209C16 14.4372 14.2769 16 11.2821 16ZM4.71795 2.23255C2.37128 2.23255 1.23077 3.26697 1.23077 5.39534V11.7209C1.23077 13.8493 2.37128 14.8837 4.71795 14.8837H11.2821C13.6287 14.8837 14.7692 13.8493 14.7692 11.7209V5.39534C14.7692 3.26697 13.6287 2.23255 11.2821 2.23255H4.71795Z" fill="#3A3A3A"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.8 KiB |
|
|
@ -1,13 +1,51 @@
|
|||
// IMPORT MODULES
|
||||
import React from "react";
|
||||
import React, { useState, useEffect } from "react";
|
||||
|
||||
// IMPORT COMPONENTS
|
||||
import Breadcrumb from "../components/global/Breadcrumb";
|
||||
|
||||
// IMPORT VALIDATORS
|
||||
import { ValidateEmail } from "../validators/ValidateEmail";
|
||||
import { ValidatePhoneNumber } from "../validators/ValidatePhoneNumber";
|
||||
|
||||
// IMPORT IMAGES
|
||||
import user from "../icons/user-black.svg";
|
||||
import change from "../icons/change.svg";
|
||||
|
||||
const Profile = () => {
|
||||
const [inputValid, setInputValid] = useState({
|
||||
surname: true,
|
||||
name: true,
|
||||
fathers: true,
|
||||
date: true,
|
||||
passport: true,
|
||||
p_address: true,
|
||||
address: true,
|
||||
mail: true,
|
||||
mobile: true,
|
||||
home: true,
|
||||
});
|
||||
const [btnEnabled, setBtnEnabled] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (
|
||||
inputValid.surname &&
|
||||
inputValid.name &&
|
||||
inputValid.fathers &&
|
||||
inputValid.date &&
|
||||
inputValid.passport &&
|
||||
inputValid.p_address &&
|
||||
inputValid.address &&
|
||||
inputValid.mail &&
|
||||
inputValid.mobile &&
|
||||
inputValid.home
|
||||
) {
|
||||
setBtnEnabled(true);
|
||||
} else {
|
||||
setBtnEnabled(false);
|
||||
}
|
||||
}, [inputValid]);
|
||||
|
||||
return (
|
||||
<section className="profile">
|
||||
<Breadcrumb
|
||||
|
|
@ -17,59 +55,175 @@ const Profile = () => {
|
|||
/>
|
||||
<div className="container">
|
||||
<div className="profile-inner">
|
||||
<h2 className="profile-title">Данные профиля</h2>
|
||||
<form>
|
||||
<div className="input-block">
|
||||
<label htmlFor="surname">Фамилия</label>
|
||||
<input type="text" id="surname" defaultValue={"Amanow"} />
|
||||
<div className="form-top">
|
||||
<div className="cu-bottom profile-title">
|
||||
<h2 className="profile-title">Данные профиля</h2>
|
||||
<button
|
||||
type="button"
|
||||
disabled={!btnEnabled}
|
||||
className="sign-btn cu-btn"
|
||||
>
|
||||
<div>
|
||||
<div className="btn-img">
|
||||
<img src={change} alt="logout" />
|
||||
</div>
|
||||
<h3>Сохранить изменения</h3>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="name">Имя</label>
|
||||
<input type="text" id="name" defaultValue={"Aman"} />
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="fathers">Отчество</label>
|
||||
<input type="text" id="fathers" defaultValue={"Amanowic"} />
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="date">Дата рождения</label>
|
||||
<input type="date" id="date" defaultValue={"1990-02-20"} />
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="passport">Паспортные данные</label>
|
||||
<input type="text" id="passport" defaultValue={"I-AŞ 212121"} />
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="p-address">Место выдачи паспорта</label>
|
||||
<input
|
||||
type="text"
|
||||
id="p-address"
|
||||
defaultValue={"Kopetdag etrapyň häkimliki"}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="address">Адрес проживания</label>
|
||||
<input
|
||||
type="text"
|
||||
id="address"
|
||||
defaultValue={"Parahat 3/1, j.16, k.5"}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="mail">Электронная почта</label>
|
||||
<input
|
||||
type="email"
|
||||
id="mail"
|
||||
defaultValue={"amanamanow@gmail.com"}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="mobile">Мобильный телефон</label>
|
||||
<input type="text" id="mobile" defaultValue={"+99365656565 "} />
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="homeTel">Домашний телефон</label>
|
||||
<input type="text" id="homeTel" defaultValue={"+99312121212 "} />
|
||||
<div className="form-bottom">
|
||||
<div className="input-block">
|
||||
<label htmlFor="surname">Фамилия</label>
|
||||
<input
|
||||
type="text"
|
||||
id="surname"
|
||||
defaultValue={"Amanow"}
|
||||
onChange={(e) => {
|
||||
if (e.target.value !== "") {
|
||||
setInputValid({ ...inputValid, surname: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, surname: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="name">Имя</label>
|
||||
<input
|
||||
type="text"
|
||||
id="name"
|
||||
defaultValue={"Aman"}
|
||||
onChange={(e) => {
|
||||
if (e.target.value !== "") {
|
||||
setInputValid({ ...inputValid, name: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, name: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="fathers">Отчество</label>
|
||||
<input
|
||||
type="text"
|
||||
id="fathers"
|
||||
defaultValue={"Amanowic"}
|
||||
onChange={(e) => {
|
||||
if (e.target.value !== "") {
|
||||
setInputValid({ ...inputValid, fathers: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, fathers: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="date">Дата рождения</label>
|
||||
<input
|
||||
type="date"
|
||||
id="date"
|
||||
defaultValue={"1990-02-20"}
|
||||
onChange={(e) => {
|
||||
if (e.target.value !== "") {
|
||||
setInputValid({ ...inputValid, date: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, date: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="passport">Паспортные данные</label>
|
||||
<input
|
||||
type="text"
|
||||
id="passport"
|
||||
defaultValue={"I-AŞ 212121"}
|
||||
onChange={(e) => {
|
||||
if (e.target.value !== "") {
|
||||
setInputValid({ ...inputValid, passport: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, passport: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="p-address">Место выдачи паспорта</label>
|
||||
<input
|
||||
type="text"
|
||||
id="p-address"
|
||||
defaultValue={"Kopetdag etrapyň häkimliki"}
|
||||
onChange={(e) => {
|
||||
if (e.target.value !== "") {
|
||||
setInputValid({ ...inputValid, p_address: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, p_address: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="address">Адрес проживания</label>
|
||||
<input
|
||||
type="text"
|
||||
id="address"
|
||||
defaultValue={"Parahat 3/1, j.16, k.5"}
|
||||
onChange={(e) => {
|
||||
if (e.target.value !== "") {
|
||||
setInputValid({ ...inputValid, address: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, address: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="mail">Электронная почта</label>
|
||||
<input
|
||||
type="email"
|
||||
id="mail"
|
||||
defaultValue={"amanamanow@gmail.com"}
|
||||
onChange={(e) => {
|
||||
if (ValidateEmail(e.target.value)) {
|
||||
setInputValid({ ...inputValid, mail: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, mail: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="mobile">Мобильный телефон</label>
|
||||
<input
|
||||
type="text"
|
||||
id="mobile"
|
||||
defaultValue={"+99365656565"}
|
||||
onChange={(e) => {
|
||||
if (ValidatePhoneNumber(e.target.value)) {
|
||||
setInputValid({ ...inputValid, mobile: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, mobile: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div className="input-block">
|
||||
<label htmlFor="homeTel">Домашний телефон</label>
|
||||
<input
|
||||
type="text"
|
||||
id="homeTel"
|
||||
defaultValue={"+99312121212"}
|
||||
onChange={(e) => {
|
||||
if (ValidatePhoneNumber(e.target.value)) {
|
||||
setInputValid({ ...inputValid, home: true });
|
||||
} else {
|
||||
setInputValid({ ...inputValid, home: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -41,3 +41,11 @@ button:disabled {
|
|||
pointer-events: none;
|
||||
transition: 0.4s all ease;
|
||||
}
|
||||
|
||||
input[type="date"]::-webkit-calendar-picker-indicator {
|
||||
color: rgba(0, 0, 0, 0);
|
||||
opacity: 1;
|
||||
display: block;
|
||||
background: url("../icons/calendar.svg") no-repeat;
|
||||
border-width: thin;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,9 +13,16 @@
|
|||
background: #f2f2f2;
|
||||
}
|
||||
|
||||
form {
|
||||
.form-bottom {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.profile-title {
|
||||
button {
|
||||
padding: 1.8rem 3rem;
|
||||
max-width: 26.2rem;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue