From af6cdbe890edf4013e7482d938596ca0e44a79a5 Mon Sep 17 00:00:00 2001 From: Nicolas Drolet Date: Wed, 3 Dec 2025 14:41:02 -0500 Subject: [PATCH] refactor(profile): finalize appearance and functionality --- src/assets/en-CA.png | Bin 0 -> 5857 bytes src/assets/fr-FR.png | Bin 0 -> 880 bytes src/i18n/en-ca/index.ts | 1 + src/i18n/fr-ca/index.ts | 1 + .../components/employee-list-table.vue | 5 +- .../components/employee/add-modify-dialog.vue | 118 ++++++++++-------- .../models/employee-profile.models.ts | 16 +-- .../components/employee/menu-employee.vue | 109 ++++++++-------- .../employee/menu-panel-employee.vue | 86 ++----------- .../employee/menu-panel-personal.vue | 108 +++++----------- .../profile/components/shared/menu-header.vue | 3 +- .../shared/menu-panel-input-field.vue | 40 +++--- .../shared/menu-panel-preferences.vue | 110 ++++++++-------- .../shared/menu-panel-select-field.vue | 43 ------- .../components/shared/menu-template.vue | 62 ++++----- .../profile/models/preferences.models.ts | 12 ++ .../shared/components/language-switch.vue | 7 +- src/pages/profile-page.vue | 8 +- src/stores/ui-store.ts | 4 +- 19 files changed, 304 insertions(+), 429 deletions(-) create mode 100644 src/assets/en-CA.png create mode 100644 src/assets/fr-FR.png delete mode 100644 src/modules/profile/components/shared/menu-panel-select-field.vue diff --git a/src/assets/en-CA.png b/src/assets/en-CA.png new file mode 100644 index 0000000000000000000000000000000000000000..cd42ab826459f47b5a00cfdb54a5ab3671055cf2 GIT binary patch literal 5857 zcmaJ_Wmr^Q*B-jNTSQ=lArxWgP9=tJ1eI`F%Tbgg4 z=l$Nl?~i@x`+MK@Nv;kl(f|lx+8E? zHTDDmuxkEk7~I`tRp^flP$eU%uB#2y$I8PR;N#=NZ|~yh`PRzKn%~vKHuFG|5dffd zQB#!D^Ud1N_A{g2zUz}g2uZYpz#gwHN+0C|@uPtbly8%^DxWpPC~t%qzIj8XoBTq< z#Ir4FWlYaea^pvOVT@XGaeY~1baZrnG$yMmKF^~^X`nq}iMzK(OIEh2o;aI+4}FrS zl9GtiJ)fMbppKh605)cb>?3mg|J|(}L?($h1-(~>sJ?Fe8~8qp?dZf~XJfrmhliRP z2T(GW!T@%Xo-;Bn**M(OTfiNf`1yfPtJ##z^J<;mL&k#2#ta5&U=}_8RhEDSKMbkQysZ=9=#E%cl5h5q%7jy zFa88RP%u%Ql_C&29_~*#Bfn{*Zf7-etvB5KYZds5g&^?Ny-I2pT@Pi*e6M#x!LN9` zD+UN$Qd|aA%`H~Owl$Uz(waGVEx0*&Qa;}PK%jG92aYzZ)uO($I-lFI^ip?v8T-Ry zq6(+Rb8{5_sda+C)z?8U@{{r9o7{b#*3V>%oe+TnO4Ymf2kDz!PNnZx-M)1m>Vm6&kYVmZmtHhZJ zn7_l2%?@Ub6cg&?jBk(#32(AgRJyi0ZE)I?G5Xn)rc%>)myBz*ML@L6_RAfgsIKmA#B&mD2=a(`7AHt&6M0X1L%`*nHyJ2AWX&oL zHa2b(P7%!mVAXIq(m4t*BE?!o)eDaBgi8lg^lk@Z>3UGgs<{vW00sG2H9;dBmp7xH zmwhrsov$jT<@@r0t4O>qLECAdXc>chW&_2bfKTXLF3*y2QKmOL?sK((A=Vvboe`-lr?F`ZKe{qty$TT*55ZDRZk>x7OTcI?vLDIT)W6U>?nQ z83XxR=gQ)^@X?!G?@@A(jy*%z7bIGTEPcb$Yd^CcQBpw)2GjZ;O6PAl2rHbkjc>p0 zU74|F2Dm-@F|I@$c@meMG)AU$k0aWCArh}8gRxPd3y6^S?$Z7gbh*n-wsyFZh59Q) z+v&tL4d;MRN8qv1M~jUmh9~RB*}m7{o8^;`wY7eAu_??*pPPw0c}MlG@9()M!&uWM&3RG{w?XBGWG|Z>^oV zs?DlgPa~*cA1%RcZBH;1a0B9)d|8J-5d$0FKfQ4n>QN+G@z=U)oZiXcx;zUZz?q3NWX~)Ws-Ucb=vmvTNU*z*|sCgFj$?@Qd~V> zNr?FRHLf(F#R6lh+zWCrk2Ppl_h%@e2~}gq8b6tfnf3GA1BX-r_F-FEY*&{9CzkBo ztX=m!iE)2_TPQll(4hu$V$R9N<@bIvOJbVWWWdGR(=B(kp#|64CY*lc1lyB&M~_o1 zEk<2ifLVJzscy!TvRriGeSLo3InhHvPd&X}6}Qp3CkD9K4F-s}JFCQo+Aq@6+e#5F z_ZWNM?(A>{wj5)B$Zc{E>z=qnu?F;=7#jOwc^|eCXB3lD9FWB3cLw|ovDbMnI|&z{ z#k4sFqb~|xat3L69){T^IgH{EQgwU;*$7d?f*T0+^Oi!Rg`1f804U(m&kYKr?@pk= zHsO2`r2+j?X$!0^OGe9er|XmN(t;pU;z@Muq}JQxVPk!_ea(J4M=X)J|7kQ*v;&;q1E zH2vrqJGSFAOJ8#v;hbjx)>>G5EmRFtK6I&@go||WVK3w)^AIC>pn*dP34Q&XSf~Wc z!O!!x#WGBIH<9D-p4Wi)C!Ct%Z{-v>7jz-TPs7RV8*mQ}1T~oPmZxx_NF^B6SJjsl zILWCPJN`Js3MgyCCxE7wa<`T4``;Ty$hkJcbanI7krq=BEY@0ZqY-sHvF_{J6z2+G zf5WcFR*C8PVzPG~6DB5#e?61d^};WyvS-teHQ>U$H-L==S?_ql9R;Dei%6PK+MI5bv74>%x0$JkdRi=PJb>&`~!8jUp*0!kVhfi zSXCj6i0}lL4 zD&@2q06hAqjX~Oyi`}0jfF}a7cSvryR!-{KTINlJ{KGZxYHuQrory=_2ceA{Hlm}o z2NoqiKZVS#cQcqqZ=ZiTULv~^^(#NS(EOZl*%FM|lx|m(`=0c=`)Ov-SuLp4a}0S| z`Mv~O2}74Fik)AibW`&@$5Id4xeo^Mnh-6+tQUR-^4=FUD7YFqe*;Yaoc>euU`cW2 zPxUzJ8dgjLOJ-c0^-T}MlG~<%J*QWE4=kX7dXrK|D21-bZak6ro}5fMuyOtPMK_D> zXe!FGX6b6apu`xEpd6DTR+}y%fy+O-E=7@@jWrdO3mfJAn4{25{@W0Q1@KvZN6u3g{9dK@f#cz}yax?1h+4!PU&%p89*RfyGk$1C`S z8wXDZ9_ThOsgOYPm6IKfGP~exS@ZUAszSW=_2D|B1i zArl?697(#c>V<_-u(pQy68v#`)K%6iUtTwwad+JiZz^+NV)pA3c+aj&C_V{=&iR$Jh2Rnx15zPJ zXI4YPKedAG`5V79!^G{=ns?YMjQi?;@WVzZF_cLDpewruK%3jM;Hoa$@qInLHUAf( z9$OWz=Oyrw6`!xnYx-0^3h&F8SB?^&%wv5FiXZ>YdfQ$=T8qAUKX;CheSg+RC=^ha zm#9_c1VC#L5p@LL^H@LD;d{ODW>vz#n#dG_h7S=gwvGMLHoBG`_^2a4E*pj|oeS)5ta2>Vbv!*qpld5NT0 zZ37wLM>tBZJG839kzPlP#zYz`aMQ1ijrf7TB;heaZ@b-&E36HT0qx7-n?t>ife_|q zU9%?asi=z1cR4Af%i*{R57$Fo()}NlBmxWR53ALcEP||Cx8@m2W5`^-Zx96NkW!+d zel}r2E_Wzx4~6FLqb_1Mg4+H2;Jucy&cfoxibQ*PO5(V!c^S2@Q75fzdABpcMN3Vo zt0O{MbM42%^(`)*zDv*02H4MO>`A#XOxxSJx#NPRDcU*&sITZ`>t`jk#ii2U8bhdQ zhz{Oy`}ughY8k|g?j05*I>)P!%@yZZ3U;GE;|;>&e~PS5{5NB$lnn10T1w{JJd%Pj zC)wLk<4j)GuI4|s7P9!W$6QLpPss4~FXw{SXK~E(TJ8QU7e2fWn(b6Ye}l%(I%3G8 zJ-`7A)ApGy!y9$9&wXyJ%3fB;>g@o*rp=|i+7)o&0xRo@eI(&2_ z%wv}n;&r~7EiAIXRf8cooQbnMW19chnUw8m?}fl9yzGY^)uWb4h)LB&j@G=-EbA(( z?6NY2Kh8UhGmn1E-W z-cm<1{N2${bD{Kft|(SHY^(z%{^{bgn*CBPj}cpm!h5rbT~ z1;&3z51%otp#QEGYR67=Z9-DaC}NEoL8c4DhucJ`wrwlc*%b@~wSur+-tB^+yuQFw zJs$d!2gc%GwIUtnHJU_+F6p>cdFKe`XtQ$=g}I(Ef_Ke4%gRWS4C?)%2I$z$X_V*e zv>eD<`@>k3b%qR`1WT<)u`iuW3U&sagB<7eggu+@%D;TLv`@#89%oxDJcieq0ApjF z=gS6}Agtn;<8_cz_#7j&fzib92cHZ{azzejeq6cDGJ)^5O?E^RJ(5vxi98oRGqeMO z`UuxaIAAO;>G|4gOXdXgGcqRJYV6ugsiVXD>vyr;n%t=1`%Q*$vSVD7>S4BDuuNWm z@*GIdz%?XmG&DH_*;Jc{PY6YaIL_I%ge}QII?l(69BU2RavPI!TYY_Dt1Sdai~ltM z#`f?Y!(Ju$6F<2XG9N)cS&4u+sMuPqG5?4Z_A`^|jwftuBvkbEFFhWNBe>ib(uP$0 znlY`=7ee8^G8p-}t8ux0*ldL0Cprh8lL}Di8kV4tD4BwmVgj`Cgr^{IS$-N@8Z)}r z%Ar$KJijX%J1395%uoeBSgC3XadugTA5Tf8X{_S0WKDo8`!`LCWPVEPJacg(1d^n+ zY8i~C$z1~(4IMDpU6Yk)UckP=nvOWHd(IoLHjic5g1Zv?IQP-s^)K(Hz+1006)kecZnbY+mHk%!$c184J(}zQ+I&gs zjLEki*%2&EfN_6v?l*5Hd}^o*FmRF*H<7B~CQw#2P)LT65nzJZ3G~cas5{JR?G002 z<9Px}ERE%IYyIHWM&H9f(0{jgA$(HvN|`lOa{d6o+7L?$(WX~e-f_%wptj1jL~j;Lp> zW42CLAB;^gK#MH;5bMz}fY~3*WHK33{-r90X_;3w*5jom#jyxyLWskL2*lcX()f2Y zu*96m67AO)s(2MP4f=~UQfGQZmI*1q66(;=E>S;?-Vi8+H{Qtk@ceP|S3 zeh4;AG!WX#Q-GTu6E+#S9~E<~NA9n=pmW84wl=Pv9WkvarbG+p`(v!<%raYrR>wIh zIi<=RrhSbC=(WWET?nkPnxy zA>EJTYHILaf?2akqM_lQqwr|g&6WH^)TX?fecuc`!vs6cVHa*vPiv-Lx2kzT{nMmP zGW%$@V2!XiUni4Ry8C7z6^pmpg33FauITM~TVmr!e6cs_8Vhr6yO+Bypp;ZEjqdWs zHx!%0QUNRi{ILpph3bV3RM85FGZsm!<8 zG5}?XBwL}9FxO9Ehd_7KvL>3Y+m0_n3_STj;zVdYQe)~3E2j&_DC(@Fz-rQKwrnRP)Y? zSy>6MKW8W*CXD|%=3aw<9NS2peTnDjIxd3Ob-7jGei#6w3b;ESbUkrByIV5_&oSSs zu!SDaBrYiK*O_pLxDNH+hbcAO;hSqJ716pr{2@QceE~SN>Fb;`wsBqEBD|ZxfhSXT zy4*9B?qrxcdxfFS>qGW{@Ti79owFex07mC*DR<~1OA|~Ix&i$RPK}=DTaV&23;SDWO|QiJ)I|Q*0IRYILDe*{MVU2_1;*;LgkIcz z%So)>(xTGlS2TbV;ASKAb&8QhUw^)Q@a6t;`OBV6#I~f~^1RXiuH^oIv3Jd7BY14W Wm(aOEo*7-92B;}%Dpt!|hW;NU#}E?$ literal 0 HcmV?d00001 diff --git a/src/assets/fr-FR.png b/src/assets/fr-FR.png new file mode 100644 index 0000000000000000000000000000000000000000..cb902f7221d87f64fe75ae157d467496200b5471 GIT binary patch literal 880 zcmeAS@N?(olHy`uVBq!ia0vp^4Is?H1|$#LC7uRSoCO|{#S9G08$g&*{RsbBprB-l zYeY$Kep*R+Vo@qXd3m{BW?pu2a$-TMUVc&f>~}U&3=B+vJzX3_D(1YsVe2t9Q0Dl@ z`~PF&l~-&r$kJW4?Z$r|{Ji(n1LzPG@Gp1Ug@@~6!^5XICDw=J zm|kY{36+{kN277dhSfzm}PyQ=l1N0SE84z_Ig$6c7HcX-1}|A^V{#I zKdZf>bNbNag{A7=7teWZ%sXf$q$#o{?9!?$)?!OT;+E}Cel6uWTQqn6s#3dcV&_+8 zUQRu|>C>B5gWrpH{yg>Rxby4ZB5R|AV!O6R1byw=wc@#cRr1CiHQx+8jQ`hM4Y|8% z#kP{)6DIHdwQyd9j@XiTMw{Ag|3u{PPrWM@yj-RA*|ycI7r!id7tHT=Slzdes*`TY6kNmz%#^^|ik(=gysr*Ur}W*nf|4 zla6-yu~p8?ZcHx|FS@XLLv|SIj8*@Zm<^Tjk%WR*El^H&sSx$){MYYn;by zR#BVtZ9~$#-kfD!-qqjk>@bU)m0{kkD|S`F7npcH$JvCh6gjS1>$@}YBG<$ACHkJ` zGnR>%Y8{ - {{ getCompanyName(scope.value) }} - {{ scope.value }} + {{ scope.value }} diff --git a/src/modules/employee-list/components/employee/add-modify-dialog.vue b/src/modules/employee-list/components/employee/add-modify-dialog.vue index f9c2adf..2e78a00 100644 --- a/src/modules/employee-list/components/employee/add-modify-dialog.vue +++ b/src/modules/employee-list/components/employee/add-modify-dialog.vue @@ -26,22 +26,24 @@ full-width @beforeShow="current_step = 'form'" > - - -
+
+
{{ $t('employee_management.' + employee_store.management_mode) }}
+
{{ `${employee_store.employee.first_name} ${employee_store.employee.last_name}` }}
+
{{ $t('employee_management.module_access.usage_description') }}
- - - -
-
- -
- -
- - - -
+
- -
- - - - - +
+ +
-
-
- + class="rounded-5 q-pb-sm bg-dark shadow-10" + > + +
+ + +
+ + + +
+ + + + + +
+
+ + + + - + \ No newline at end of file diff --git a/src/modules/employee-list/models/employee-profile.models.ts b/src/modules/employee-list/models/employee-profile.models.ts index ed8f7e2..01ca854 100644 --- a/src/modules/employee-list/models/employee-profile.models.ts +++ b/src/modules/employee-list/models/employee-profile.models.ts @@ -1,13 +1,14 @@ import type { QSelectOption, QTableColumn } from "quasar"; export type ModuleAccessName = 'dashboard' | 'employee_list' | 'employee_management' | 'personal_profile' | 'timesheets' | 'timesheets_approval'; -export type ModuleAccessPreset = 'admin' | 'employee' | 'none'; +export type ModuleAccessPreset = 'admin' | 'supervisor' | 'employee' | 'none'; +export type CompanyNames = 'Targo' | 'Solucom'; export class EmployeeProfile { first_name: string; last_name: string; supervisor_full_name: string; - company_name: number; + company_name: CompanyNames; job_title: string; email: string; phone_number: string; @@ -22,7 +23,7 @@ export class EmployeeProfile { this.first_name = ''; this.last_name = ''; this.supervisor_full_name = ''; - this.company_name = 271583; + this.company_name = 'Targo'; this.job_title = ''; this.email = ''; this.phone_number = ''; @@ -85,14 +86,7 @@ export const employee_access_options: QSelectOption[] = [ export const employee_access_presets: Record = { 'admin' : ['dashboard', 'employee_list', 'employee_management', 'personal_profile', 'timesheets', 'timesheets_approval'], + 'supervisor' : ['dashboard', 'employee_list', 'personal_profile', 'timesheets', 'timesheets_approval'], 'employee' : ['dashboard', 'timesheets', 'personal_profile', 'employee_list'], 'none' : [], -} - -export const getCompanyName = (company_code: number) => { - switch (company_code) { - case 271583: return 'Targo'; - case 271585: return 'Solucom'; - default: return 'N / A'; - } } \ No newline at end of file diff --git a/src/modules/profile/components/employee/menu-employee.vue b/src/modules/profile/components/employee/menu-employee.vue index 0d3ef78..1637ee1 100644 --- a/src/modules/profile/components/employee/menu-employee.vue +++ b/src/modules/profile/components/employee/menu-employee.vue @@ -5,7 +5,6 @@ import MenuPanelPersonal from 'src/modules/profile/components/employee/menu-panel-personal.vue'; import MenuPanelEmployee from 'src/modules/profile/components/employee/menu-panel-employee.vue'; import MenuPanelPreferences from 'src/modules/profile/components/shared/menu-panel-preferences.vue'; - import MenuPanelSchedulePresets from 'src/modules/profile/components/shared/menu-panel-schedule-presets.vue'; import MenuTemplate from 'src/modules/profile/components/shared/menu-template.vue'; import { EmployeeProfile } from 'src/modules/employee-list/models/employee-profile.models'; import { useAuthStore } from 'src/stores/auth-store'; @@ -16,7 +15,6 @@ PERSONAL_INFO: 'personal_info', EMPLOYEE_INFO: 'employee_info', PREFERENCES: 'references', - SCHEDULE_PRESETS: 'schedule_presets', }; const employee_profile = defineModel({ default: new EmployeeProfile }); @@ -24,66 +22,57 @@ \ No newline at end of file diff --git a/src/modules/profile/components/employee/menu-panel-employee.vue b/src/modules/profile/components/employee/menu-panel-employee.vue index 99dee07..cf6649a 100644 --- a/src/modules/profile/components/employee/menu-panel-employee.vue +++ b/src/modules/profile/components/employee/menu-panel-employee.vue @@ -3,102 +3,42 @@ lang="ts" > import MenuPanelInputField from 'src/modules/profile/components/shared/menu-panel-input-field.vue'; - import MenuPanelSelectField from 'src/modules/profile/components/shared/menu-panel-select-field.vue'; - import { ref } from 'vue'; - import { deepEqual } from 'src/utils/deep-equal'; - import { unwrapAndClone } from 'src/utils/unwrap-and-clone'; - import { useAuthStore } from 'src/stores/auth-store'; import { useEmployeeStore } from 'src/stores/employee-store'; - import { CAN_APPROVE_PAY_PERIODS } from 'src/modules/shared/models/user.models'; - import type { EmployeeProfile } from 'src/modules/employee-list/models/employee-profile.models'; - const COMPANY_OPTIONS = [ - { label: 'Targo', value: 271583 }, - { label: 'Solucom', value: 271585 } - ]; - const SUPERVISOR_OPTIONS = [{ label: 'AAA', value: '1' }, { label: 'BBB', value: '2' }, { label: 'CCC', value: '3' }, { label: 'DDD', value: '4' }]; - - const auth_store = useAuthStore(); const employee_store = useEmployeeStore(); - - const is_editing = ref(false); - const current_company_option = ref(COMPANY_OPTIONS.find(option => option.value === employee_store.employee.company_name) ?? { label: '', value: 0 }) - let initial_info: EmployeeProfile = unwrapAndClone(employee_store.employee); - - - const onSubmit = () => { - if (!is_editing.value) { - is_editing.value = true; - return; - } - - is_editing.value = false; - initial_info = unwrapAndClone(employee_store.employee); // update initial value for future possible resets - employee_store.employee.company_name = current_company_option.value.value; - - if (!deepEqual(employee_store.employee, initial_info)) { - // save the new data here - return; - } - }; - - const onReset = () => { - employee_store.employee = unwrapAndClone(initial_info); - is_editing.value = false; - } \ No newline at end of file diff --git a/src/modules/profile/components/employee/menu-panel-personal.vue b/src/modules/profile/components/employee/menu-panel-personal.vue index 516f2e9..4264348 100644 --- a/src/modules/profile/components/employee/menu-panel-personal.vue +++ b/src/modules/profile/components/employee/menu-panel-personal.vue @@ -4,90 +4,44 @@ > import MenuPanelInputField from 'src/modules/profile/components/shared/menu-panel-input-field.vue'; - import { ref } from 'vue'; - import { deepEqual } from 'src/utils/deep-equal'; - import { unwrapAndClone } from 'src/utils/unwrap-and-clone'; import { useEmployeeStore } from 'src/stores/employee-store'; - import type { EmployeeProfile } from 'src/modules/employee-list/models/employee-profile.models'; const employee_store = useEmployeeStore(); - const is_editing = ref(false); - const initial_info = ref(unwrapAndClone(employee_store.employee)); - - const onSubmit = () => { - if (!is_editing.value) { - is_editing.value = true; - initial_info.value = unwrapAndClone(employee_store.employee); - return; - } - - is_editing.value = false; - initial_info.value = unwrapAndClone(employee_store.employee); // update initial value for future possible resets - - if (!deepEqual(employee_store.employee, initial_info)) { - // save the new data here - return; - } - }; - - const onReset = () => { - employee_store.employee = unwrapAndClone(initial_info.value); - is_editing.value = false; - } \ No newline at end of file diff --git a/src/modules/profile/components/shared/menu-header.vue b/src/modules/profile/components/shared/menu-header.vue index b98ec9d..39ae2fa 100644 --- a/src/modules/profile/components/shared/menu-header.vue +++ b/src/modules/profile/components/shared/menu-header.vue @@ -12,8 +12,7 @@
- import type { ValidationRule } from 'quasar'; - const model = defineModel({ required: true }); - const { readonly = false, hint = '' } = defineProps<{ + defineProps<{ labelString: string; - isEditing: boolean; - readonly?: boolean; - type?: "number" | "textarea" | "time" | "text" | "tel" | "password" | "email" | "search" | "file" | "url" | "date" | "datetime-local" | undefined; - hint?: string; - mask?: string; - rules?: ValidationRule[]; }>(); \ No newline at end of file + + + \ No newline at end of file diff --git a/src/modules/profile/components/shared/menu-panel-preferences.vue b/src/modules/profile/components/shared/menu-panel-preferences.vue index 743575f..e6c9614 100644 --- a/src/modules/profile/components/shared/menu-panel-preferences.vue +++ b/src/modules/profile/components/shared/menu-panel-preferences.vue @@ -2,66 +2,72 @@ setup lang="ts" > + import { dark_mode_options } from 'src/modules/profile/models/preferences.models'; import LanguageSwitch from 'src/modules/shared/components/language-switch.vue'; - import { ref } from 'vue'; - import { Dark } from 'quasar'; + import { useUiStore } from 'src/stores/ui-store'; + const ui_store = useUiStore(); - const initial_dark_mode_value = Dark.isActive; - const is_dark_mode = ref(initial_dark_mode_value); - - const toggle_dark_mode = (value: boolean) => { - if (ui_store.user_preferences) ui_store.user_preferences.is_dark_mode = value; - Dark.set(value); - } - \ No newline at end of file diff --git a/src/modules/profile/components/shared/menu-panel-select-field.vue b/src/modules/profile/components/shared/menu-panel-select-field.vue deleted file mode 100644 index 39d7640..0000000 --- a/src/modules/profile/components/shared/menu-panel-select-field.vue +++ /dev/null @@ -1,43 +0,0 @@ - - - \ No newline at end of file diff --git a/src/modules/profile/components/shared/menu-template.vue b/src/modules/profile/components/shared/menu-template.vue index b795f50..ef6ad45 100644 --- a/src/modules/profile/components/shared/menu-template.vue +++ b/src/modules/profile/components/shared/menu-template.vue @@ -16,44 +16,46 @@ \ No newline at end of file diff --git a/src/modules/profile/models/preferences.models.ts b/src/modules/profile/models/preferences.models.ts index 5fc25bf..c9e0a82 100644 --- a/src/modules/profile/models/preferences.models.ts +++ b/src/modules/profile/models/preferences.models.ts @@ -1,5 +1,17 @@ import type { MessageLanguages } from "src/boot/i18n"; +export interface DarkModeOption { + label: string; + value: boolean | null; + quasar_value: boolean | "auto"; + icon: string; +} +export const dark_mode_options: DarkModeOption[] = [ + { label: 'profile.preferences.dark_mode', value: true, quasar_value: true, icon: 'dark_mode'}, + { label: 'profile.preferences.light_mode', value: false, quasar_value: false, icon: 'light_mode'}, + { label: 'profile.preferences.auto_mode', value: null, quasar_value: "auto", icon: 'brightness_auto'}, +] + export class Preferences { id: number; notifications: boolean; diff --git a/src/modules/shared/components/language-switch.vue b/src/modules/shared/components/language-switch.vue index 00c8c23..b284038 100644 --- a/src/modules/shared/components/language-switch.vue +++ b/src/modules/shared/components/language-switch.vue @@ -26,13 +26,18 @@ clickable dense v-ripple - class="col rounded-5 q-ma-sm shadow-1 " + class="col rounded-5 q-ma-sm shadow-4" :class="locale === $i18n.locale ? 'bg-accent text-white text-weight-bolder' : ''" @click="setDisplayLanguage(locale as MessageLanguages)" > + + + + {{ $t(`profile.preferences.${locale}`) }} + \ No newline at end of file diff --git a/src/stores/ui-store.ts b/src/stores/ui-store.ts index f991db7..1285099 100644 --- a/src/stores/ui-store.ts +++ b/src/stores/ui-store.ts @@ -64,9 +64,11 @@ export const useUiStore = defineStore('ui', () => { const setPreferences = () => { if (user_preferences.value !== undefined) { - Dark.set(user_preferences.value.is_dark_mode ?? 'auto'); + // if user_preferences.value.is_dark_mode === null + Dark.set(user_preferences.value.is_dark_mode ?? "auto"); locale.value = user_preferences.value.display_language; } + console.log('quasar dark mode: ', q.dark.mode, 'preferences: ', user_preferences.value.is_dark_mode); } return {