Commit 0bfd47ed by tungnq

TODO: Đã xong giao diện màn hình home tiến hành chạy thử nghiệm ios

parent c0a56b2c
{
"commentTranslate.targetLanguage": "vi"
}
\ No newline at end of file
......@@ -2,12 +2,14 @@ import images from './images';
import colors from './colors';
import fonts from './fonts';
import fontsize from './fontsize';
import sizes from './sizes';
const R = {
images,
colors,
fonts,
fontsize,
sizes
};
export default R;
......@@ -2,9 +2,13 @@ const colors = {
white: '#FFFFFF',
black: '#000000',
blackShadow: 'rgba(0, 0, 0, 0.25)',
blackBackgroundInputTextHeader:'rgba(0, 0, 0, 0.25)',
gray: 'rgba(217, 217, 217, 1)',
gray1: 'rgba(204, 204, 204, 1)',
grayBorderInputTextHeader:'rgba(204, 204, 204, 0.36)',
grayButton:'rgba(217, 217, 217, 0.56)',
blue: 'rgba(47, 107, 255, 1)',
blue1: 'rgba(47, 107, 255, 0.1)',
......
const fontsize = {
fontSizeLabel: 14,
fontSizeContent: 14,
fontSizeInputText: 16,
fontsSizeTitle:16,
fontSizeSubTitle: 14,
fontSizeLabel: 12,
fontSizeContent: 12,
fontSizeInputText: 12,
fontSizeBtn:14,
fontSizeMenu:12,
};
export default fontsize;
<svg width="46" height="35" viewBox="0 0 46 35" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.7337 15.0747C10.1849 15.0747 8.11139 13.0011 8.11139 10.4524C8.11139 7.90361 10.185 5.83008 12.7337 5.83008C15.2824 5.83008 17.356 7.90373 17.356 10.4524C17.356 13.0011 15.2824 15.0747 12.7337 15.0747ZM12.7337 7.67572C11.2027 7.67572 9.95715 8.92124 9.95715 10.4522C9.95715 11.9832 11.2027 13.2288 12.7337 13.2288C14.2647 13.2288 15.5102 11.9832 15.5102 10.4522C15.5102 8.92124 14.2647 7.67572 12.7337 7.67572Z" fill="#2F6BFF"/>
<path d="M44.5771 27.9975H43.3707V1.53909C43.3707 1.02929 42.9575 0.616211 42.4478 0.616211H3.55203C3.04236 0.616211 2.62915 1.02929 2.62915 1.53909V27.9975H1.42288C0.913082 27.9975 0.5 28.4107 0.5 28.9204V31.5539C0.5 32.0637 0.913082 32.4768 1.42288 32.4768H6.01552V33.4607C6.01552 33.9705 6.4286 34.3836 6.9384 34.3836H18.2351C18.7449 34.3836 19.158 33.9705 19.158 33.4607V32.4768H44.5771C45.0869 32.4768 45.5 32.0637 45.5 31.5539V28.9204C45.5 28.4106 45.0869 27.9975 44.5771 27.9975ZM6.01552 30.6311H2.34577V29.8433H6.01552V30.6311ZM6.01552 18.2284V27.9975H4.47492V2.46198H41.5251V27.9975H19.158V23.257L22.7258 26.4082C23.0351 26.6499 23.3032 26.6411 23.355 26.6393C23.6054 26.6349 23.8433 26.5289 24.0138 26.3456L31.3841 18.4258C31.806 17.977 32.0232 17.393 31.9959 16.7813C31.9735 16.2807 31.7863 15.813 31.4663 15.4317L36.8758 9.62662C37.2232 9.25378 37.2027 8.66978 36.8298 8.32216C36.457 7.97478 35.873 7.99558 35.5254 8.36818L30.1217 14.167C29.739 13.8849 29.2742 13.7331 28.7868 13.7439C28.1763 13.7539 27.5855 14.0158 27.1682 14.4602L23.1107 18.8083C23.1107 18.8083 20.0059 15.9022 19.9706 15.8776C19.4462 15.4658 18.7937 15.2397 18.1253 15.2397H9.00381C7.35616 15.2398 6.01552 16.5805 6.01552 18.2284ZM29.9835 16.5457C29.9897 16.5514 29.9959 16.5571 30.0021 16.5628C30.1195 16.6672 30.1484 16.784 30.152 16.8636C30.1569 16.9733 30.1169 17.079 30.0346 17.1664L29.315 17.9434L27.7777 16.5023L28.5116 15.7261C28.621 15.6097 28.7501 15.5904 28.8171 15.5894C28.873 15.5897 28.9821 15.5995 29.0665 15.6838C29.0731 15.6902 29.0796 15.6966 29.0863 15.7028L29.9835 16.5457ZM18.846 20.5187C18.5741 20.2783 18.1865 20.2201 17.8557 20.3691C17.525 20.5184 17.3122 20.8475 17.3122 21.2104V32.5379H7.86128V18.2284C7.86128 17.5982 8.37379 17.0856 9.00381 17.0856H18.1255C18.4646 17.0856 18.7075 17.2272 18.8516 17.346C18.852 17.3463 18.8523 17.3466 18.8527 17.347L22.5256 20.7898C22.7048 20.9579 22.9435 21.0488 23.1893 21.0387C23.4347 21.0302 23.6667 20.9239 23.8335 20.7439L26.5162 17.8498L28.0589 19.2958L23.2751 24.4308L18.846 20.5187ZM43.6542 30.6311H19.158V29.8433H43.6542V30.6311Z" fill="#2F6BFF"/>
</svg>
<svg width="38" height="39" viewBox="0 0 38 39" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10.25 4.69231V2" stroke="#2F6BFF" stroke-width="2.5" stroke-linecap="round"/>
<path d="M27.75 4.69231V2" stroke="#2F6BFF" stroke-width="2.5" stroke-linecap="round"/>
<path d="M13.75 23.538L16.375 20.8457V28.0252" stroke="#2F6BFF" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M20.75 26.2303V22.6406C20.75 21.6493 21.5335 20.8457 22.5 20.8457C23.4665 20.8457 24.25 21.6493 24.25 22.6406V26.2303C24.25 27.2216 23.4665 28.0252 22.5 28.0252C21.5335 28.0252 20.75 27.2216 20.75 26.2303Z" stroke="#2F6BFF" stroke-width="2.5" stroke-linecap="round"/>
<path d="M35.625 13.667H27.0938H16.8125M1.5 13.667H8.28125" stroke="#2F6BFF" stroke-width="2.5" stroke-linecap="round"/>
<path d="M22.5 37.0001H15.5C8.90033 37.0001 5.60051 37.0001 3.55025 34.8972C1.5 32.7945 1.5 29.4099 1.5 22.6411V19.0514C1.5 12.2825 1.5 8.89804 3.55025 6.7952C5.60051 4.69238 8.90033 4.69238 15.5 4.69238H22.5C29.0996 4.69238 32.3996 4.69238 34.4497 6.7952C36.5 8.89804 36.5 12.2825 36.5 19.0514V22.6411C36.5 29.4099 36.5 32.7945 34.4497 34.8972C33.3066 36.0696 31.7752 36.5883 29.5 36.8179" stroke="#2F6BFF" stroke-width="2.5" stroke-linecap="round"/>
</svg>
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M27.1245 8.53627L25.2746 6.03962C25.1556 5.88115 25.0006 5.75323 24.8225 5.6664C24.6443 5.57958 24.4479 5.53635 24.2497 5.54029H12.0005C11.8199 5.54027 11.6415 5.57932 11.4775 5.65474C11.3135 5.73017 11.1679 5.84017 11.0505 5.97719L8.90064 8.47386C8.71602 8.70347 8.61862 8.99087 8.62566 9.28528V18.3856C8.62896 20.5597 9.49522 22.6439 11.0345 24.1813C12.5739 25.7187 14.6607 26.5838 16.8377 26.5872H19.1625C21.3394 26.5838 23.4262 25.7187 24.9656 24.1813C26.5049 22.6439 27.3711 20.5597 27.3745 18.3856V9.28528C27.3745 9.01516 27.2867 8.75235 27.1245 8.53627Z" fill="white"/>
<path d="M35.2239 33.478L30.2243 27.2364C30.0793 27.0518 29.885 26.9116 29.664 26.8322C29.4429 26.7527 29.204 26.7371 28.9743 26.787L18.0001 29.2587L7.02576 26.762C6.79619 26.7121 6.55714 26.7277 6.33607 26.8072C6.115 26.8866 5.92082 27.0268 5.77585 27.2114L0.776172 33.4531C0.631094 33.6358 0.54015 33.8554 0.513639 34.0871C0.487128 34.3187 0.526113 34.5532 0.626182 34.7638C0.723875 34.9809 0.881678 35.1657 1.08098 35.2961C1.28029 35.4266 1.5128 35.4975 1.75111 35.5003H34.249C34.4846 35.4997 34.7152 35.4326 34.9142 35.3066C35.1132 35.1808 35.2726 35.0013 35.3739 34.7888C35.4739 34.5782 35.5129 34.3436 35.4864 34.1121C35.4599 33.8804 35.3691 33.6608 35.2239 33.478Z" fill="#2F6BFF"/>
<path d="M34.6114 5.54014L18.3625 0.546822C18.1249 0.484393 17.8751 0.484393 17.6375 0.546822L1.38858 5.54014C1.12287 5.62028 0.89144 5.78647 0.73075 6.01249C0.570073 6.23851 0.489291 6.51152 0.50114 6.78848C0.490766 7.06865 0.575135 7.34417 0.740662 7.57063C0.906176 7.79708 1.14322 7.96129 1.41358 8.03681L17.6625 12.5308C17.8825 12.5974 18.1175 12.5974 18.3375 12.5308L34.5864 8.03681C34.8568 7.96129 35.0938 7.79708 35.2594 7.57063C35.4249 7.34417 35.5092 7.06865 35.4989 6.78848C35.5107 6.51152 35.4299 6.23851 35.2692 6.01249C35.1085 5.78647 34.8771 5.62028 34.6114 5.54014Z" fill="#2F6BFF"/>
<path d="M12.0254 5.54004C11.845 5.54003 11.6665 5.57907 11.5025 5.6545C11.3385 5.72992 11.1929 5.83993 11.0755 5.97695L8.92565 8.47362C8.73203 8.69974 8.62565 8.9875 8.62567 9.28503V18.3854C8.62897 20.5596 9.49523 22.6437 11.0345 24.1811C12.5739 25.7184 14.6607 26.5837 16.8376 26.5869H18.0001V5.54004H12.0254Z" fill="#2F6BFF"/>
<path d="M7.02576 26.762C6.79619 26.7121 6.55715 26.7277 6.33607 26.8072C6.115 26.8866 5.92082 27.0268 5.77585 27.2114L0.776172 33.4531C0.631094 33.6358 0.54015 33.8554 0.513639 34.0871C0.487128 34.3187 0.526113 34.5532 0.626182 34.7638C0.723875 34.9809 0.881678 35.1657 1.08098 35.2961C1.28029 35.4266 1.5128 35.4975 1.75111 35.5003H18.0001V29.2587L7.02576 26.762Z" fill="#2F6BFF"/>
<path d="M17.6375 0.546579L1.38858 5.5399C1.12287 5.62004 0.89144 5.78622 0.73075 6.01225C0.570073 6.23828 0.489291 6.51129 0.50114 6.78823C0.490766 7.06842 0.575135 7.34394 0.740662 7.57039C0.906176 7.79685 1.14322 7.96106 1.41358 8.03656L17.6625 12.5305C17.7743 12.5488 17.8883 12.5488 18 12.5305V0.546579C17.8799 0.527442 17.7576 0.527442 17.6375 0.546579Z" fill="#2F6BFF"/>
<path d="M1.41358 8.03681L8.62561 9.9842V18.3854C8.62891 20.5597 9.49517 22.6439 11.0345 24.1812C12.5739 25.7185 14.6606 26.5837 16.8376 26.587H19.1624C21.3394 26.5837 23.4261 25.7185 24.9655 24.1812C26.5048 22.6439 27.3711 20.5597 27.3744 18.3854V9.9842L34.5864 8.03681C34.8568 7.9613 35.0938 7.79708 35.2594 7.57063C35.4249 7.34417 35.5092 7.06865 35.4989 6.78848C35.5107 6.51152 35.4299 6.23851 35.2692 6.01249C35.1085 5.78647 34.8771 5.62028 34.6114 5.54015L18.3625 0.546822C18.1249 0.484393 17.8751 0.484393 17.6375 0.546822L1.38858 5.54015C1.12287 5.62028 0.89144 5.78647 0.73075 6.01249C0.570073 6.23851 0.489291 6.51152 0.50114 6.78848C0.490766 7.06865 0.575135 7.34417 0.740662 7.57063C0.906176 7.79708 1.14322 7.9613 1.41358 8.03681ZM24.8745 18.3854C24.8713 19.8975 24.2683 21.3466 23.1979 22.4158C22.1274 23.485 20.6763 24.0871 19.1624 24.0903H16.8376C15.3237 24.0871 13.8726 23.485 12.8021 22.4158C11.7317 21.3466 11.1287 19.8975 11.1254 18.3854V10.6707L17.6625 12.4808C17.8825 12.5475 18.1175 12.5475 18.3375 12.4808L24.8745 10.6707V18.3854ZM18 3.1059L29.7992 6.78848L18 9.9842L6.20077 6.78848L18 3.1059Z" fill="#2F6BFF"/>
<path d="M30.2243 27.2364C30.0793 27.0518 29.885 26.9116 29.664 26.8322C29.4429 26.7527 29.204 26.7371 28.9743 26.787L18.0001 29.2587L7.02576 26.762C6.79619 26.7121 6.55714 26.7277 6.33607 26.8072C6.115 26.8866 5.92082 27.0268 5.77585 27.2114L0.776172 33.4531C0.631094 33.6358 0.54015 33.8554 0.513639 34.0871C0.487128 34.3187 0.526113 34.5532 0.626182 34.7638C0.723875 34.9809 0.881678 35.1657 1.08098 35.2961C1.28029 35.4266 1.5128 35.4975 1.75111 35.5003H34.249C34.4846 35.4997 34.7152 35.4326 34.9142 35.3066C35.1132 35.1808 35.2726 35.0013 35.3739 34.7888C35.4739 34.5782 35.5129 34.3436 35.4864 34.1121C35.4599 33.8804 35.3691 33.6608 35.2239 33.478L30.2243 27.2364ZM4.35094 33.0037L7.23825 29.396L17.7251 31.7553C17.9064 31.7927 18.0936 31.7927 18.275 31.7553L28.7619 29.421L31.6492 33.0037H4.35094Z" fill="#2F6BFF"/>
</svg>
<svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22.7402 15.9131H33.2402" stroke="#2F6BFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10.76 15.9121L12.26 17.4121L16.76 12.9121" stroke="#2F6BFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M22.7402 29.916H33.2402" stroke="#2F6BFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10.76 29.915L12.26 31.415L16.76 26.915" stroke="#2F6BFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M16 42.1543H28C38 42.1543 42 38.1543 42 28.1543V16.1543C42 6.1543 38 2.1543 28 2.1543H16C6 2.1543 2 6.1543 2 16.1543V28.1543C2 38.1543 6 42.1543 16 42.1543Z" stroke="#2F6BFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg width="38" height="35" viewBox="0 0 38 35" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.8049 28.7642H7.58225C5.45327 28.7642 4.38877 28.7642 3.57561 28.3498C2.86032 27.9854 2.27878 27.4038 1.91433 26.6886C1.5 25.8755 1.5 24.8109 1.5 22.6819V8.23655C1.5 6.10757 1.5 5.04306 1.91433 4.2299C2.27878 3.51461 2.86032 2.93307 3.57561 2.56863C4.38877 2.1543 5.45327 2.1543 7.58225 2.1543H29.6304C31.7594 2.1543 32.824 2.1543 33.6371 2.56863C34.3523 2.93307 34.934 3.51461 35.2983 4.2299C35.7127 5.04306 35.7127 6.10757 35.7127 8.23655V11.6578M34.9651 8.35495L25.3537 14.7626C22.915 16.3883 21.6957 17.2012 20.3778 17.5171C19.213 17.7961 17.9989 17.7961 16.8343 17.5171C15.5164 17.2012 14.297 16.3883 11.8584 14.7626L1.78028 8.04388M22.4077 32.5656L26.2567 31.7958C26.5921 31.7287 26.76 31.695 26.9164 31.6337C27.0554 31.5793 27.1875 31.5086 27.3097 31.4232C27.4477 31.3271 27.5685 31.2062 27.8107 30.964L35.7127 23.062C36.7624 22.0123 36.7624 20.3104 35.7127 19.2606C34.6629 18.2109 32.961 18.2109 31.9113 19.2606L24.0093 27.1626C23.7671 27.4048 23.6462 27.5257 23.5501 27.6637C23.4647 27.7859 23.394 27.918 23.3397 28.0569C23.2783 28.2133 23.2446 28.3812 23.1775 28.7166L22.4077 32.5656Z" stroke="#2F6BFF" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg width="36" height="40" viewBox="0 0 36 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M34.0417 19.9996C33.655 19.9996 33.284 20.1401 33.0105 20.3901C32.737 20.6402 32.5834 20.9793 32.5834 21.3329V25.3329C32.5834 25.6866 32.737 26.0257 33.0105 26.2758C33.284 26.5258 33.655 26.6663 34.0417 26.6663C34.4285 26.6663 34.7994 26.5258 35.0729 26.2758C35.3464 26.0257 35.5001 25.6866 35.5001 25.3329V21.3329C35.5001 20.9793 35.3464 20.6402 35.0729 20.3901C34.7994 20.1401 34.4285 19.9996 34.0417 19.9996ZM34.8584 14.8929C34.7773 14.8422 34.689 14.8018 34.5959 14.7729C34.5089 14.7328 34.4153 14.7058 34.3188 14.6929C34.0845 14.6501 33.8423 14.6604 33.6134 14.7232C33.3846 14.786 33.1761 14.8992 33.0063 15.0529C32.8712 15.1775 32.7642 15.3253 32.6916 15.4877C32.6191 15.6502 32.5823 15.8241 32.5834 15.9996C32.5834 16.3532 32.737 16.6924 33.0105 16.9424C33.284 17.1925 33.655 17.3329 34.0417 17.3329C34.4285 17.3329 34.7994 17.1925 35.0729 16.9424C35.3464 16.6924 35.5001 16.3532 35.5001 15.9996C35.4947 15.6466 35.3436 15.3085 35.0771 15.0529L34.8584 14.8929Z" fill="#2F6BFF"/>
<path d="M31.125 4H29.6667C29.6667 2.93913 29.2057 1.92172 28.3853 1.17157C27.5648 0.421427 26.452 0 25.2917 0H10.7083C9.54801 0 8.43521 0.421427 7.61474 1.17157C6.79427 1.92172 6.33333 2.93913 6.33333 4H4.875C3.73461 3.99963 2.63913 4.40638 1.82194 5.13361C1.00474 5.86084 0.53041 6.85106 0.5 7.89333V36.1067C0.53041 37.1489 1.00474 38.1392 1.82194 38.8664C2.63913 39.5936 3.73461 40.0004 4.875 40H31.125C32.2654 40.0004 33.3609 39.5936 34.1781 38.8664C34.9953 38.1392 35.4696 37.1489 35.5 36.1067V29.3333C35.5 28.9797 35.3464 28.6406 35.0729 28.3905C34.7994 28.1405 34.4284 28 34.0417 28C33.6549 28 33.284 28.1405 33.0105 28.3905C32.737 28.6406 32.5833 28.9797 32.5833 29.3333V36.1067C32.5539 36.4415 32.3874 36.7538 32.117 36.9812C31.8467 37.2087 31.4924 37.3344 31.125 37.3333H4.875C4.50762 37.3344 4.15332 37.2087 3.88295 36.9812C3.61258 36.7538 3.44606 36.4415 3.41667 36.1067V7.89333C3.44606 7.55851 3.61258 7.24617 3.88295 7.01875C4.15332 6.79133 4.50762 6.66559 4.875 6.66667H6.33333C6.33333 7.72753 6.79427 8.74495 7.61474 9.49509C8.43521 10.2452 9.54801 10.6667 10.7083 10.6667H25.2917C26.452 10.6667 27.5648 10.2452 28.3853 9.49509C29.2057 8.74495 29.6667 7.72753 29.6667 6.66667H31.125C31.4924 6.66559 31.8467 6.79133 32.117 7.01875C32.3874 7.24617 32.5539 7.55851 32.5833 7.89333V10.6667C32.5833 11.0203 32.737 11.3594 33.0105 11.6095C33.284 11.8595 33.6549 12 34.0417 12C34.4284 12 34.7994 11.8595 35.0729 11.6095C35.3464 11.3594 35.5 11.0203 35.5 10.6667V7.89333C35.4696 6.85106 34.9953 5.86084 34.1781 5.13361C33.3609 4.40638 32.2654 3.99963 31.125 4ZM26.75 6.66667C26.75 7.02029 26.5964 7.35943 26.3229 7.60948C26.0494 7.85952 25.6784 8 25.2917 8H10.7083C10.3216 8 9.95063 7.85952 9.67714 7.60948C9.40365 7.35943 9.25 7.02029 9.25 6.66667V4C9.25 3.64638 9.40365 3.30724 9.67714 3.05719C9.95063 2.80714 10.3216 2.66667 10.7083 2.66667H25.2917C25.6784 2.66667 26.0494 2.80714 26.3229 3.05719C26.5964 3.30724 26.75 3.64638 26.75 4V6.66667Z" fill="#2F6BFF"/>
<path d="M27.1292 16.4397L15.0833 28.733L8.82708 23.053C8.5481 22.8346 8.18924 22.7204 7.82221 22.7334C7.45519 22.7464 7.10702 22.8855 6.8473 23.1229C6.58758 23.3604 6.43543 23.6787 6.42125 24.0143C6.40708 24.3498 6.53192 24.678 6.77083 24.933L14.0625 31.5997C14.3318 31.8509 14.6987 31.9947 15.0833 31.9997C15.2819 31.9956 15.4775 31.9544 15.658 31.8788C15.8386 31.8031 16.0003 31.6945 16.1333 31.5597L29.2583 18.2264C29.5175 17.9629 29.6515 17.6161 29.631 17.2623C29.6105 16.9085 29.4371 16.5766 29.149 16.3397C28.8608 16.1028 28.4815 15.9802 28.0945 15.9989C27.7075 16.0177 27.3446 16.1762 27.0854 16.4397H27.1292Z" fill="#2F6BFF"/>
</svg>
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.2944 29.664C17.8379 29.6666 20.3386 29.0095 22.5523 27.7569L28.6918 33.8964C29.4397 34.6443 30.4541 35.0645 31.5118 35.0645C32.5696 35.0645 33.584 34.6443 34.3319 33.8964C35.0798 33.1485 35.5 32.1341 35.5 31.0763C35.5 30.0186 35.0798 29.0042 34.3319 28.2563L28.1869 22.1113C29.7755 19.2788 30.3875 16.0021 29.9285 12.7871C29.4695 9.57217 27.965 6.59769 25.6472 4.3229C23.3294 2.04812 20.3273 0.599533 17.1043 0.200785C13.8813 -0.197964 10.6166 0.4753 7.81434 2.11663C5.01206 3.75797 2.82799 6.2761 1.59929 9.28227C0.370599 12.2884 0.165618 15.6155 1.016 18.7497C1.86637 21.884 3.72482 24.6512 6.30442 26.6241C8.88403 28.597 12.0413 29.6659 15.2889 29.6659L15.2944 29.664ZM7.43402 6.99853C9.2529 5.18049 11.6459 4.04933 14.2052 3.79777C16.7646 3.54621 19.332 4.18981 21.47 5.61893C23.608 7.04804 25.1844 9.17425 25.9306 11.6353C26.6768 14.0964 26.5466 16.74 25.5622 19.1158C24.5778 21.4916 22.8001 23.4527 20.532 24.6648C18.2638 25.8769 15.6456 26.2651 13.1234 25.7632C10.6011 25.2614 8.33089 23.9006 6.69948 21.9126C5.06806 19.9246 4.17638 17.4325 4.17636 14.8608C4.17179 13.3999 4.45741 11.9526 5.01663 10.6029C5.57585 9.25327 6.39754 8.0281 7.43402 6.99853ZM6.14422 14.8608C6.14272 14.3686 6.33531 13.8956 6.68024 13.5445C7.02518 13.1933 7.49463 12.9923 7.9868 12.985C8.22714 12.9814 8.46582 13.0255 8.68898 13.1148C8.91213 13.2042 9.11532 13.337 9.28674 13.5055C9.45816 13.674 9.5944 13.8749 9.68755 14.0964C9.7807 14.318 9.82891 14.5559 9.82937 14.7963V14.8608C9.83083 16.3099 10.4074 17.6992 11.4324 18.7236C12.4575 19.7479 13.8472 20.3235 15.2963 20.324C15.785 20.324 16.2536 20.5181 16.5992 20.8637C16.9447 21.2092 17.1389 21.6779 17.1389 22.1666C17.1389 22.6553 16.9447 23.1239 16.5992 23.4695C16.2536 23.815 15.785 24.0092 15.2963 24.0092C12.8707 24.0062 10.5453 23.0415 8.82998 21.3265C7.11467 19.6116 6.14764 17.2864 6.14422 14.8608Z" fill="#2F6BFF"/>
</svg>
<svg width="36" height="38" viewBox="0 0 36 38" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M15.0687 22.6156C15.7268 22.6156 16.2653 23.154 16.2653 23.8122V24.1412C16.2653 24.7993 15.7268 25.3378 15.0687 25.3378C14.4106 25.3378 13.8721 24.7993 13.8721 24.1412V23.8122C13.8721 23.154 14.4106 22.6156 15.0687 22.6156ZM9.53448 13.1028C9.53448 13.1028 9.62423 13.9105 10.5516 13.9105C11.4789 13.9105 11.5388 13.1028 11.5388 13.1028C11.449 10.4703 12.6755 9.18396 15.2182 9.33353C16.8935 9.51302 17.761 10.4703 17.8208 12.1754C17.7012 12.9233 17.0729 13.9105 15.9362 15.107C14.4405 16.6327 13.6627 17.9788 13.6627 19.1754V20.4019C13.6627 20.4019 13.7823 21.1498 14.62 21.1498C15.4576 21.1498 15.5772 20.4019 15.5772 20.4019V19.5344C15.5772 18.5173 16.2952 17.3207 17.7311 15.9147C19.2567 14.5387 20.0046 13.2523 20.0046 12.1156C19.8849 8.94464 18.2396 7.29935 15.0388 7.17969C11.3593 7.17969 9.53448 9.12413 9.53448 13.1028Z" fill="#2F6BFF"/>
<path d="M19.047 32.5171H2.50427C1.42735 32.5171 0.5 31.5897 0.5 30.5128V2.00427C0.5 0.92735 1.42735 0 2.50427 0H27.0342C28.1111 0 29.0385 0.92735 29.0385 2.00427V2.90171H29.0085V17.7991L19.047 32.5171ZM2.50427 1.79487C2.41453 1.79487 2.29487 1.91453 2.29487 2.00427V30.5128C2.29487 30.6026 2.41453 30.7222 2.50427 30.7222H18.0897L27.2137 17.2607V1.91453C27.1838 1.8547 27.094 1.79487 27.0342 1.79487H2.50427ZM21.8291 30.9316L21.6795 31.141V31.4103L21.6197 35.8376V37.1538L22.8462 36.6752L26.9744 35L27.2137 34.9103L27.3632 34.7009L35.0214 23.5128L35.5 22.7949L34.7821 22.3162L30.7137 19.5342L29.9957 19.0556L29.5171 19.7735L21.8291 30.9316ZM29.7265 20.9402L33.7949 23.7222L33.5556 22.5256L25.8974 33.7137L26.2863 33.3846L22.1581 35.0598L23.3547 35.8675L23.4145 31.4402L23.265 31.9188L30.9231 20.7308L29.7265 20.9402Z" fill="#2F6BFF"/>
<path d="M26.2534 34.0518L22.9203 31.7714L23.9339 30.29L27.2669 32.5707L26.2534 34.0518Z" fill="#2F6BFF"/>
</svg>
<svg width="38" height="37" viewBox="0 0 38 37" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.5 12.6667H36.5M9.27778 1V4.88889M28.7222 1V4.88889M7.33333 18.5H11.2222M17.0556 18.5H20.9444M26.7778 18.5H30.6667M7.33333 24.3333H11.2222M17.0556 24.3333H20.9444M26.7778 24.3333H30.6667M7.33333 30.1667H11.2222M17.0556 30.1667H20.9444M26.7778 30.1667H30.6667M7.72222 36H30.2778C32.4557 36 33.5448 36 34.3767 35.5761C35.1084 35.2034 35.7034 34.6084 36.0761 33.8767C36.5 33.0448 36.5 31.9557 36.5 29.7778V11.1111C36.5 8.93312 36.5 7.84413 36.0761 7.01226C35.7034 6.28051 35.1084 5.68559 34.3767 5.31276C33.5448 4.88889 32.4557 4.88889 30.2778 4.88889H7.72222C5.54425 4.88889 4.45524 4.88889 3.62337 5.31276C2.89162 5.68559 2.2967 6.28051 1.92387 7.01226C1.5 7.84413 1.5 8.93312 1.5 11.1111V29.7778C1.5 31.9557 1.5 33.0448 1.92387 33.8767C2.2967 34.6084 2.89162 35.2034 3.62337 35.5761C4.45524 36 5.54423 36 7.72222 36Z" stroke="#2F6BFF" stroke-width="2" stroke-linecap="round"/>
</svg>
<svg width="48" height="39" viewBox="0 0 48 39" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1.5 37.5742H46.5" stroke="#2F6BFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M8.25027 37.5771V11.0291C8.25027 10.9097 8.29768 10.7953 8.38208 10.7109C8.46647 10.6265 8.58093 10.5791 8.70027 10.5791H14.5503C14.6696 10.5791 14.7841 10.6265 14.8685 10.7109C14.9529 10.7953 15.0003 10.9097 15.0003 11.0291V37.5771" stroke="#2F6BFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M21.7495 37.5745V2.17711C21.7495 1.84576 21.9509 1.57715 22.1995 1.57715H28.0495C28.298 1.57715 28.4995 1.84576 28.4995 2.17711V37.5745" stroke="#2F6BFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M35.25 37.5717V17.6607C35.25 17.4743 35.4515 17.3232 35.7 17.3232H41.55C41.7985 17.3232 42 17.4743 42 17.6607V37.5717" stroke="#2F6BFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<svg width="36" height="44" viewBox="0 0 36 44" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M12.7362 0.835133C13.1008 0.470492 13.5954 0.265625 14.1111 0.265625H29.6667C32.8884 0.265625 35.5 2.87731 35.5 6.09896V37.2101C35.5 40.4318 32.8884 43.0434 29.6667 43.0434H6.33333C3.11168 43.0434 0.5 40.4318 0.5 37.2101V13.8767C0.5 13.361 0.704867 12.8665 1.06951 12.5018L12.7362 0.835133ZM29.6667 4.15451H16.0556V13.8767C16.0556 14.9506 15.185 15.8212 14.1111 15.8212H4.38889V37.2101C4.38889 38.284 5.25946 39.1545 6.33333 39.1545H29.6667C30.7406 39.1545 31.6111 38.284 31.6111 37.2101V6.09896C31.6111 5.02508 30.7406 4.15451 29.6667 4.15451ZM7.13874 11.9323H12.1667V6.90437L7.13874 11.9323ZM8.27778 23.599C8.27778 22.525 9.14834 21.6545 10.2222 21.6545H25.7778C26.8517 21.6545 27.7222 22.525 27.7222 23.599C27.7222 24.6729 26.8517 25.5434 25.7778 25.5434H10.2222C9.14834 25.5434 8.27778 24.6729 8.27778 23.599ZM8.27778 31.3767C8.27778 30.3028 9.14834 29.4323 10.2222 29.4323H25.7778C26.8517 29.4323 27.7222 30.3028 27.7222 31.3767C27.7222 32.4507 26.8517 33.3212 25.7778 33.3212H10.2222C9.14834 33.3212 8.27778 32.4507 8.27778 31.3767Z" fill="#2F6BFF"/>
</svg>
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M33.1437 29.5402C33.1437 29.5264 33.2401 26.4467 34.7214 24.9723C34.9833 24.7105 34.9901 24.2833 34.8317 23.9457C34.6663 23.6081 34.3287 23.3945 33.9567 23.3945H7.17617C3.81397 23.3945 1.07184 26.1298 1.07184 29.4989C1.07184 32.8611 3.80708 35.6032 7.17617 35.6032H33.9567C34.3287 35.6032 34.6663 35.3896 34.8317 35.052C34.997 34.7144 34.9488 34.3217 34.7214 34.0254C33.6742 32.7095 33.1507 31.1248 33.1437 29.5402ZM7.44487 30.4703H31.249C31.3661 31.5658 31.6762 32.6475 32.186 33.6534H7.17617C4.88188 33.6534 3.01475 31.7863 3.01475 29.492C3.01475 27.1977 4.88188 25.3306 7.17617 25.3306H32.186C31.6762 26.3433 31.3661 27.4182 31.249 28.5136H7.44487C6.90747 28.5136 6.47341 28.9477 6.47341 29.4851C6.47341 30.0363 6.90747 30.4703 7.44487 30.4703Z" fill="#2F6BFF"/>
<path d="M34.7972 5.14623L18.2687 0.433632C18.0965 0.385404 17.9104 0.385404 17.7382 0.433632L1.20276 5.14623C0.78937 5.27025 0.5 5.64918 0.5 6.08324C0.5 6.51729 0.78937 6.89623 1.20276 7.02025L7.31398 8.76336V20.2348C7.31398 20.5862 7.50689 20.91 7.81004 21.0823C8.12008 21.2545 8.49213 21.2476 8.79528 21.0616C11.8612 19.1807 14.9547 18.2299 18 18.2299C21.0453 18.2299 24.1319 19.1807 27.2047 21.0616C27.3632 21.158 27.8317 21.2821 28.19 21.0823C28.5 20.91 28.686 20.5862 28.686 20.2348V8.76336L31.9035 7.84702V13.2348C31.9035 13.7722 32.3376 14.2063 32.875 14.2063C33.4124 14.2063 33.8465 13.7722 33.8465 13.2348V7.28895L34.7972 7.02025C35.2175 6.90312 35.5 6.51729 35.5 6.08324C35.5 5.64918 35.2106 5.27025 34.7972 5.14623ZM9.26378 18.5675V9.32143L17.7313 11.7397C17.9035 11.788 18.0896 11.788 18.2618 11.7397L26.7293 9.32143V18.564C23.831 17.0506 20.9052 16.287 18 16.287C15.0925 16.287 12.1575 17.0517 9.26378 18.5675ZM18 9.78993L5.01968 6.08324L18 2.38344L30.9803 6.08324L18 9.78993Z" fill="#2F6BFF"/>
</svg>
import icBB from './icon/bao_bu.svg';
import icBN from './icon/bao_nghi.svg';
import icCVHT from './icon/co_van_hoc_tap.svg';
import icCV from './icon/cong_viec.svg';
import icDCT from './icon/dia_chi_thu.svg';
import icDD from './icon/diem_danh.svg';
import icKQDG from './icon/ket_qua_danh_gia.svg';
import icKSSK from './icon/khao_sat_su_kien.svg';
import icLD from './icon/lich_day.svg';
import icTK from './icon/thong_ke.svg';
import icVB from './icon/van_ban_den.svg';
import icVBD from './icon/van_ban_den.svg';
import icXNDT from './icon/xac_nhan_day_thay.svg';
const images = {
iconWarn: require('./images/iconWarn.png'),
......@@ -23,20 +11,19 @@ const images = {
icGallery: require('./images/icGallery.png'),
//HomeScreen
icBaoBu: icBB,
icBaoNghi: icBN,
icCoVanHT: icCVHT,
icCongViec: icCV,
icDD: icDD,
icDChiThu: icDCT,
icDiemDanh: icKQDG,
icKhaoSatSuKien: icKSSK,
icLichDay: icLD,
icThongKe: icTK,
icVanBanDi: icVB,
icVanBanDen: icVBD,
icXacNhanDayThay: icXNDT,
icLichDay:require('./icon/lich_day.png'),
icBaoBu: require('./icon/bao_bu.png'),
icBaoNghi: require('./icon/bao_nghi.png'),
icCoVanHT: require('./icon/co_van_hoc_tap.png'),
icXacNhanDayThay: require('./icon/xac_nhan_day_thay.png'),
icDiemDanh: require('./icon/diem_danh.png'),
icDChiThu: require('./icon/mail.png'),
icThongKe: require('./icon/thong_ke.png'),
icKhaoSatSuKien: require('./icon/khao_sat_su_kien.png'),
icKetQuaDanhGia:require('./icon/ket_qua_danh_gia.png'),
icVanBanDi: require('./icon/van_ban.png'),
icVanBanDen: require('./icon/van_ban.png'),
icCongViec: require('./icon/work.png'),
//TabNavigation
icHome: require('./icon/icon_png_tab_bar/home_tab_navigation.png'),
icHomeUnSel: require('./icon/icon_png_tab_bar/home_tab_navigation_unsel.png'),
......@@ -69,6 +56,8 @@ const images = {
icEdit: require('./icon/icon_png/icon_edit.png'),
icMenu: require('./icon/icon_png/menu.png'),
icDrop: require('./icon/icon_png/arrow_drop.png'),
icSearchHeader:require('./icon/icon_png/icon_search_header.png'),
icSearch: require('./icon/icon_png/icon_search.png'),
//Image Logo
igLogo: require('./images/logo.png'),
......
import React, {Fragment, useRef, useEffect, useState} from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import Home from '../screens/home';
import TabNavigator from './TabNavigation';
import Login from '../screens/login';
import * as ScreenName from './ScreenNames';
const Stack = createStackNavigator();
......@@ -14,8 +14,8 @@ function MyStack(props) {
headerStatusBarHeight: 0,
}}
headerMode={'none'}
initialRouteName={ScreenName.LOGINSCREEN}>
<Stack.Screen name={ScreenName.LOGINSCREEN} component={Login} />
initialRouteName={ScreenName.HOMESCREEN}>
<Stack.Screen name={ScreenName.HOMESCREEN} component={Home} />
<Stack.Screen name={ScreenName.TABNAVIGATOR} component={TabNavigator} />
</Stack.Navigator>
);
......
import { Image, StyleSheet, TextInput, View, Platform } from "react-native";
import React from "react";
import R from "../../assets/R";
import styles from "./style";
const HeaderHome = (props) => {
const {
value,
onChangeText,
} = props;
return (
<View style={styles.containerBoxHeader}>
<View style={styles.boxLogo}>
<Image
source={R.images.igLogo}
maxWidth={Platform.OS === 'ios' ? 65 : 75}
maxHeight={Platform.OS === 'ios' ? 26 : 36}
resizeMode="contain"
/>
</View>
<View style={{flex:1}}></View>
<View style={styles.searchBox}>
<View style={styles.boxIconSearch}>
<Image
source={R.images.icSearchHeader}
maxWidth={Platform.OS === 'ios' ? 16: 20}
maxHeight={Platform.OS === 'ios' ? 16 : 20}
/>
</View>
<TextInput
value={value}
onChangeText={onChangeText}
placeholder={"Tìm kiếm"}
placeholderTextColor={R.colors.white}
style={styles.input}
/>
</View>
</View>
);
};
export default HeaderHome;
import React, {Component} from 'react';
import {View, Text} from 'react-native';
import React, { Component, useState } from "react";
import { View, Text, Linking } from "react-native";
import * as SCREENNAME from '../../routers/ScreenNames'
import Homeview from "./view";
import R from "../../assets/R";
import { useNavigation } from '@react-navigation/native';
const Home = (props) => {
const navigation = useNavigation();
const [selectedMenuItem, setSelectedMenuItem] = useState("");
const [searchText, setSearchText] = useState("");
const [userProfile, setUserProfile] = useState({
name: "NGUYỄN MINH ĐỨC",
phone: "0895457",
avatar: null,
});
const menuTeachingActivities = [
{ id: 1, title: "Lịch dạy, coi thi", icon: R.images.icLichDay, screenName: SCREENNAME.DRAWERNAVIGATION,action: 'NAVIGATE',},
{ id: 2, title: "Báo nghỉ", icon: R.images.icBaoNghi, screenName: SCREENNAME.LISTRESTREPORT,action: 'NAVIGATE'},
{ id: 3, title: "Báo bù", icon: R.images.icBaoBu , screenName: SCREENNAME.LISTMAKEUPCLASSES,action: 'NAVIGATE',},
{ id: 4, title: "Xác nhận dạy thay", icon: R.images.icXacNhanDayThay,screenName: SCREENNAME.SUBTEACHER,action: 'NAVIGATE', },
{ id: 5, title: "Điểm danh", icon: R.images.icDiemDanh , screenName: SCREENNAME.LISTROLLCALL,action: 'NAVIGATE',},
{ id: 6, title: "Cố vấn học tập", icon: R.images.icCoVanHT,screenName: SCREENNAME.LISTACADEMICADVISOR,action: 'NAVIGATE', }
];
const menuStatistics = [
{
id: 7,
title: "Thống kê giảng dạy",
icon: R.images.icThongKe,
screenName: SCREENNAME.STATISTICS,
action: 'NAVIGATE',
},
{ id: 8, title: "Khảo sát sự kiện", icon: R.images.icKhaoSatSuKien ,screenName: SCREENNAME.HOMESCREEN,action: 'NAVIGATE',},
{ id: 9, title: "Kết quả đánh giá", icon: R.images.icKetQuaDanhGia,screenName: SCREENNAME.LISTFEEDBACK,action: 'NAVIGATE', },
];
const menuNotification = [
{ id: 10, title: "Văn bản đến", icon: R.images.icVanBanDen,screenName: SCREENNAME.INCOMINGDOCUMENT,action: 'NAVIGATE', },
{ id: 11, title: "Văn bản đi", icon: R.images.icVanBanDi,screenName: SCREENNAME.LISTSENDDOCUMENT,action: 'NAVIGATE', },
{ id: 12, title: "Công việc", icon: R.images.icCongViec ,screenName: SCREENNAME.LISTWORK, action: 'NAVIGATE' },
{ id: 13, title: "Mail", icon: R.images.icDChiThu,screenName: SCREENNAME.EMAIL, aciton: 'NAVIGATE'},
];
import Homeview from './view';
const actionHandlers = {
NAVIGATE: (item) => {
navigation.navigate(item.screenName, {
...item.params,
itemData: item,
title: item.title,
});
},
const Home = props => {
return <Homeview />;
OPEN_URL: (item) => {
Linking.openURL(item.url).catch((err) => {
console.error("Failed to open URL:", err);
});
},
SHOW_MODAL: (item) => {
console.log("Show modal for:", item.title);
},
CALL_API: (item) => {
console.log("Calling API for:", item.title);
},
};
const handleMenuItemPress = (item) => {
const handler = actionHandlers[item.action];
if (handler) {
handler(item);
} else {
console.warn(`No handler found for action: ${item.action}`);
}
};
const handleSearchChange = (text) => {
setSearchText(text);
};
return (
<Homeview
menuActivity={menuTeachingActivities}
menuStatistics={menuStatistics}
menuNotification={menuNotification}
selectedMenuItem={selectedMenuItem}
searchText={searchText}
userProfile={userProfile}
onMenuItemPress={handleMenuItemPress}
onSearchChange={handleSearchChange}
/>
);
};
export default Home;
import React from "react";
import { View, Text, StyleSheet, Image, TouchableOpacity } from "react-native";
import styles from "./style";
const ItemGrid = ({ item ,onPress }) => {
return (
<TouchableOpacity
onPress={onPress}
style={styles.menu_item}
>
<View style={styles.icon_container}>
<Image
source={item.icon}
style={styles.icon}
/>
</View>
<Text style={styles.menu_text}>{item.title}</Text>
</TouchableOpacity>
);
};
export default ItemGrid;
import { StyleSheet } from "react-native";
import R from "../../assets/R";
const styles = StyleSheet.create({
//Header
containerBoxHeader: {
flexDirection: "row",
marginHorizontal: 15,
marginTop: 15,
maxHeight: 40,
},
boxLogo:{
flex: 2,
maxWidth: 75,
maxHeight:36,
},
boxIconSearch:{
padding:2,
},
searchBox: {
flex: 3,
flexDirection: "row",
backgroundColor: R.colors.blackBackgroundInputTextHeader,
alignItems: "center",
borderColor: R.colors.grayBorderInputTextHeader,
borderRadius: 100,
borderWidth: 1,
paddingHorizontal: 14,
},
input: {
fontSize: R.fontsize.fontsSize12,
color: R.colors.white,
minHeight: 40,
flex: 1,
fontFamily: R.fonts.InterRegular,
fontWeight: '400',
},
//Home
safeArea: {
flex: 1,
},
container_body: {
flex: 1,
backgroundColor: R.colors.white,
},
background_header: {
height: 295,
position: 'relative',
},
profileCard: {
position: 'absolute',
bottom: -30,
flexDirection: "row",
alignItems: "center",
backgroundColor: R.colors.white,
paddingVertical: 10,
paddingHorizontal: 15,
marginHorizontal: 15,
borderRadius: 15,
shadowColor: R.colors.black,
shadowOffset: { width: 0, height: 1 },
shadowOpacity: 0.5,
shadowRadius: 1,
elevation: 1,
},
profile_left: {
flexDirection: "row",
alignItems: "center",
flex: 3,
},
avatar: {
width: Platform.OS === 'ios' ? 37 : 47,
height: Platform.OS === 'ios' ? 37 : 47,
borderRadius: 100,
backgroundColor: R.colors.gray,
overflow: 'hidden',
},
avatar_image: {
width: '100%',
height: '100%',
},
avatar_placeholder: {
width: '100%',
height: '100%',
justifyContent: 'center',
alignItems: 'center',
backgroundColor: R.colors.blue,
},
avatar_text: {
fontSize: R.sizes.h6,
color: R.colors.white,
fontFamily: R.fonts.fontMedium,
},
information: {
flex: 2,
marginLeft: 10,
},
text_card_info: {
fontSize: R.sizes.md,
fontWeight: "400",
color: R.colors.black,
fontFamily: R.fonts.InterRegular,
},
profile_btn: {
paddingVertical: 5,
paddingHorizontal: 10,
backgroundColor: R.colors.grayButton,
borderRadius: 15,
flexDirection: "row",
justifyContent: 'center',
alignItems: 'center',
},
iconNext: {
marginLeft: 5,
},
btn_text: {
fontSize: R.sizes.sm,
fontWeight: "400",
color: R.colors.black,
fontFamily: R.fonts.fontRegular,
},
menu_container: {
marginHorizontal: 15,
},
menu_title: {
fontSize: R.fontsize.fontsSizeSubTitle,
fontWeight: "600",
color: R.colors.black,
fontFamily: R.fonts.InterMedium,
},
scroll: {
flex: 1,
marginTop: 35,
},
//Item
menu_item: {
alignItems: "center",
paddingVertical: 10,
paddingHorizontal: 5,
marginHorizontal: 5,
marginVertical: 5,
flex: 1,
maxWidth: "30%",
minHeight:"30%"
},
icon_container: {
width: 35,
height: 35,
backgroundColor:R.colors.white,
},
icon:{
width: 35,
height: 35,
resizeMode: "contain",
},
menu_text: {
fontSize: R.sizes.sm,
fontWeight: "600",
color: R.colors.black,
fontFamily: R.fonts.fontMedium,
textAlign: "center",
},
});
export default styles;
\ No newline at end of file
import React, {Component} from 'react';
import {View, Text, SafeAreaView, StyleSheet} from 'react-native';
import Header from '../../components/Header/Header';
import i18n from '../../helper/i18/i18n';
import R from '../../assets/R';
const HomeView = props => {
import React from "react";
import {
View,
Text,
ImageBackground,
TouchableOpacity,
FlatList,
ScrollView,
TouchableWithoutFeedback,
Keyboard,
SafeAreaView,
Image,
} from "react-native";
import HeaderCus from "../home/header";
import R from "../../assets/R";
import ItemGrid from "./item";
import styles from "./style";
import { useNavigation } from "@react-navigation/native";
import * as SCREENNAME from "../../routers/ScreenNames";
const HomeView = (props) => {
const {
menuActivity,
menuStatistics,
menuNotification,
selectedMenuItem,
searchText,
userProfile,
onMenuItemPress,
onSearchChange,
} = props;
const navigate = useNavigation();
const renderMenuItem = ({ item }) => {
return <ItemGrid item={item} onPress={() => onMenuItemPress(item)} />;
};
const cardItemInfo =()=>{
return <View style={styles.profileCard}>
<View style={styles.profile_left}>
{/* Avatar */}
<View style={styles.avatar}>
{userProfile?.avatar ? (
<Image
source={{ uri: userProfile.avatar }}
style={styles.avatar_image}
resizeMode="cover"
/>
) : (
<View style={styles.avatar_placeholder}>
<Text style={styles.avatar_text}>
{userProfile?.name?.charAt(0)}
</Text>
</View>
)}
</View>
{/* Information */}
<View style={styles.information}>
<Text
style={styles.text_card_info}
numberOfLines={1}
ellipsizeMode="tail"
>
{userProfile?.name?? "Không có dữ liệu"}
</Text>
<Text
style={styles.text_card_info}
numberOfLines={1}
ellipsizeMode="tail"
>
{userProfile?.phone??"Không có dữ liệu"}
</Text>
</View>
</View>
<TouchableOpacity style={styles.profile_btn} onPress={() => navigate.navigate(SCREENNAME.PROFILE)}>
<Text style={styles.btn_text}>H sơ cá nhân</Text>
<View style={styles.iconNext}>
<Image
source={R.images.icNext}
maxWidth={5}
maxHeight={10}
/>
</View>
</TouchableOpacity>
</View>
}
const renderMenuActivity =()=>{
return <View style={styles.menu_container}>
<Text style={styles.menu_title}>Ging dy</Text>
<FlatList
data={menuActivity}
renderItem={renderMenuItem}
numColumns={3}
keyExtractor={(item) => item.id.toString()}
scrollEnabled={false}
columnWrapperStyle={styles.row}
/>
</View>
}
const renderMenuStatistics =()=>{
return <View style={styles.menu_container}>
<Text style={styles.menu_title}>Thng kê</Text>
<FlatList
data={menuStatistics}
renderItem={renderMenuItem}
numColumns={3}
keyExtractor={(item) => item.id.toString()}
scrollEnabled={false}
columnWrapperStyle={styles.row}
/>
</View>
}
const renderMenuNotification =()=>{
return <View style={styles.menu_container}>
<Text style={styles.menu_title}>Văn bn và thông báo</Text>
<FlatList
data={menuNotification}
renderItem={renderMenuItem}
numColumns={3}
keyExtractor={(item) => item.id.toString()}
scrollEnabled={false}
columnWrapperStyle={styles.row}
/>
</View>
}
return (
<SafeAreaView style={styles.container}>
<View style={styles.container}>
<Header title={i18n.t('Home')} />
<Text>Home screen</Text>
<TouchableWithoutFeedback onPress={Keyboard.dismiss} accessible={false}>
<SafeAreaView style={styles.safeArea}>
<View style={styles.container_body}>
<ImageBackground
source={R.images.igBackground}
style={styles.background_header}
>
<HeaderCus
value={searchText}
onChangeText={onSearchChange}
/>
{cardItemInfo()}
</ImageBackground>
<ScrollView
showsVerticalScrollIndicator={false}
style={styles.scroll}>
{renderMenuActivity()}
{renderMenuStatistics()}
{renderMenuNotification()}
</ScrollView>
</View>
</SafeAreaView>
</TouchableWithoutFeedback>
);
};
export default HomeView;
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: R.colors.white,
},
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment