diff --git a/accounting-ng-nuttakit/angular.json b/accounting-ng-nuttakit/angular.json index bbd2c56..c46546a 100644 --- a/accounting-ng-nuttakit/angular.json +++ b/accounting-ng-nuttakit/angular.json @@ -37,12 +37,10 @@ } ], "styles": [ - "node_modules/bootstrap/dist/css/bootstrap.min.css", "node_modules/@fortawesome/fontawesome-free/css/all.min.css", "src/styles.css" ], "scripts": [ - "node_modules/bootstrap/dist/js/bootstrap.bundle.min.js" ] }, "configurations": { @@ -86,7 +84,7 @@ "builder": "@angular/build:dev-server", "options": { "host": "0.0.0.0", - "allowedHosts": ["accounting.nuttakit.work", "localhost"] + "allowedHosts": ["accounting.nuttakit.work", "localhost", "avon-reid-link-statistics.trycloudflare.com"] }, "configurations": { "production": { @@ -116,12 +114,10 @@ } ], "styles": [ - "node_modules/bootstrap/dist/css/bootstrap.min.css", "node_modules/@fortawesome/fontawesome-free/css/all.min.css", "src/styles.css" ], "scripts": [ - "node_modules/bootstrap/dist/js/bootstrap.bundle.min.js" ] } } diff --git a/accounting-ng-nuttakit/package.json b/accounting-ng-nuttakit/package.json index ac14d71..0b6b7cd 100644 --- a/accounting-ng-nuttakit/package.json +++ b/accounting-ng-nuttakit/package.json @@ -58,7 +58,6 @@ "@fortawesome/free-regular-svg-icons": "^7.1.0", "@fortawesome/free-solid-svg-icons": "^7.1.0", "@tailwindcss/postcss": "^4.1.16", - "bootstrap": "^5.3.8", "chart.js": "^4.5.1", "dotenv": "^17.2.3", "jwt-decode": "^4.0.0", diff --git a/accounting-ng-nuttakit/src/app/app.module.ts b/accounting-ng-nuttakit/src/app/app.module.ts index dcffdd5..12cd664 100644 --- a/accounting-ng-nuttakit/src/app/app.module.ts +++ b/accounting-ng-nuttakit/src/app/app.module.ts @@ -23,6 +23,7 @@ import { LicensePrivacyTermsComponent } from './component/license-privacy-terms/ import { provideCharts, withDefaultRegisterables } from 'ng2-charts'; +import { LoginRegisterComponent } from './component/login-register/login-register.component'; // import { AccDateFormatPipe } from './pipe/dtmtodatetime.pipe'; // import { DtmtodatetimePipe } from './dtmtodatetime.pipe'; @@ -33,6 +34,7 @@ import { provideCharts, withDefaultRegisterables } from 'ng2-charts'; SidebarContentComponent, SidebarComponent, LicensePrivacyTermsComponent, + // LoginRegisterComponent, // AccDateFormatPipe // DtmtodatetimePipe, // MainDashboardContentComponent, diff --git a/accounting-ng-nuttakit/src/app/component/login-forgot/login-forgot.component.css b/accounting-ng-nuttakit/src/app/component/login-forgot/login-forgot.component.css index cd46dbe..0ae38df 100644 --- a/accounting-ng-nuttakit/src/app/component/login-forgot/login-forgot.component.css +++ b/accounting-ng-nuttakit/src/app/component/login-forgot/login-forgot.component.css @@ -8,12 +8,11 @@ --radius: 8px; --shadow: 0 10px 30px rgba(11,26,43,0.08); --glass: rgba(255,255,255,0.6); + --success-color: #10b981; /* Green for success/confirm */ } -/* Page layout */ +/* Page layout (unchanged) */ .login-widget { - /* Fill the viewport and center the card. Do not let the page itself - scroll; the card gets an internal max-height instead. */ min-height: 100vh; height: 100vh; display: flex; @@ -24,8 +23,7 @@ color: var(--text); } - -/* Card */ +/* Card (unchanged) */ .login-widget .card{ width: 380px; max-width: calc(100% - 40px); @@ -37,16 +35,14 @@ display: flex; flex-direction: column; gap: 14px; - /* Constrain the card so it never forces the page to scroll. If content - grows, the card will scroll internally. */ max-height: calc(100vh - 56px); overflow: auto; } -/* Modal/backdrop styles */ +/* Modal/backdrop styles (unchanged) */ .login-backdrop{ position: fixed; - inset: 0; /* top:0; right:0; bottom:0; left:0; */ + inset: 0; background: rgba(0,0,0,0.38); display: flex; align-items: center; @@ -54,43 +50,19 @@ z-index: 1040; padding: 24px; } - .login-modal{ width: 480px; max-width: 480px; } .modal-card{ border-radius: 12px; - padding: 0; /* card children control internal padding */ + padding: 0; overflow: hidden; box-shadow: 0 20px 50px rgba(2,6,23,0.4); } -/* Slightly larger brand area inside modal */ -.modal-card .brand{ padding: 18px; } - -/* Make the primary button pill-shaped and slightly larger */ -button.primary{ - color: #000; - border-radius: 999px; - padding: 10px 18px; - font-size: 15px; -} - -/* Make biometric and other action buttons visually lighter */ -.biometric{ - border-radius: 999px; - padding: 8px 12px; -} - -/* On small screens reduce modal padding and width to avoid overflow */ -@media (max-width: 420px){ - .login-backdrop{ padding: 12px; } - .login-modal{ max-width: 100%; } - .modal-card .brand{ padding: 12px; } -} - -/* Brand area */ +/* Brand area (unchanged) */ .brand{ text-align: center; + padding: 18px; padding-bottom: 4px; border-bottom: 1px solid #eef2f5; } @@ -116,16 +88,13 @@ button.primary{ /* Form area */ .form{ - /* keep compact spacing inside the card */ - /* width: 410px; */ margin-top: 6px; display: flex; flex-direction: column; gap: 12px; - padding: 6px 0 2px; + padding: 6px 22px 22px 22px; } - -/* Field label wrapper */ +/* Field label wrapper (unchanged) */ .field{ display: flex; flex-direction: column; @@ -135,11 +104,11 @@ button.primary{ font-size: 13px; color: var(--muted); } - -/* Inputs */ +/* Inputs (class 'input-field' added to HTML) */ input[type="email"], input[type="password"], -input[type="text"]{ +input[type="text"], +.input-field { /* เพิ่ม class input-field เพื่อให้สไตล์ถูกใช้กับ input ที่กำหนด */ width: 100%; box-sizing: border-box; padding: 10px 12px; @@ -163,31 +132,30 @@ input:focus{ transform: translateZ(0); } -/* Checkbox / stay signed */ -.stay-signed{ - display: inline-flex; - gap: 8px; - align-items: center; - font-size: 13px; - color: var(--muted); -} -.stay-signed input[type="checkbox"]{ - width: 16px; - height: 16px; - accent-color: var(--primary); -} - /* Actions row */ .actions{ display: flex; align-items: center; - justify-content: space-between; gap: 12px; margin-top: 4px; + flex-direction: row-reverse; } + +/* Custom class for justify-end when using flex-row-reverse */ +.actions.justify-end-custom { + justify-content: flex-start; +} + +/* Custom class for lift hover effect (used for 'เปิด Modal' button) */ +.hover-lift:hover { + transform: translateY(-2.5px); + transition: transform .2s ease; +} + +/* PRIMARY BUTTON - แก้ไขสีข้อความให้เป็นสีดำ */ button.primary{ background: linear-gradient(180deg, var(--primary) 0%, var(--primary-600) 100%); - color: #000000; + color: #000000; /* ⬅️ แก้ไขเป็นสีดำตามคำขอ */ border: none; padding: 10px 14px; border-radius: 6px; @@ -197,6 +165,7 @@ button.primary{ box-shadow: 0 6px 18px rgba(0,120,212,0.12); transition: transform .06s ease, box-shadow .12s ease, opacity .12s ease; } + button.primary:hover:not(:disabled){ transform: translateY(-1px); box-shadow: 0 10px 24px rgba(0,120,212,0.14); @@ -207,45 +176,26 @@ button.primary:active{ button.primary:disabled{ opacity: 0.55; cursor: not-allowed; + color: #000000; /* ข้อความ disabled ก็เป็นสีดำ */ box-shadow: none; } -/* Alternative options */ -.alt-options{ - display: flex; - align-items: center; - gap: 12px; - margin-top: 6px; - flex-wrap: wrap; +/* Secondary Button Style (สำหรับปุ่ม 'เปิด Modal', 'ส่งอีกครั้ง') */ +.primary.secondary-button { + background: transparent; + color: var(--primary); + border: 1px solid var(--primary); + box-shadow: none; + transition: background-color .14s ease; } -.biometric{ - display: inline-flex; - align-items: center; - gap: 10px; - padding: 8px 10px; - background: transparent; - color: var(--primary); - border: 1px solid rgba(0,120,212,0.14); - border-radius: 6px; - cursor: pointer; - font-weight: 600; - font-size: 13px; -} -.biometric svg{ display: block; opacity: .95; } -.biometric:hover{ - background: rgba(0,120,212,0.04); +.primary.secondary-button:hover { + background: rgba(0, 120, 212, 0.05); + transform: none; + box-shadow: none; } -/* Help link */ -.help-link{ - margin-left: auto; - font-size: 13px; - color: var(--primary); - text-decoration: none; -} -.help-link:hover{ text-decoration: underline; } -/* Footer */ +/* Footer (unchanged) */ .footer{ display: flex; justify-content: center; @@ -262,13 +212,9 @@ button.primary:disabled{ text-decoration: none; font-weight: 600; } -.footer a:hover{ text-decoration: underline; } -.divider{ color: #d0d6db; } -/* Focus styles for keyboard users */ -:focus{ - outline: none; -} +/* Focus styles (unchanged) */ +:focus{ outline: none; } :focus-visible{ outline: 3px solid rgba(0,120,212,0.12); outline-offset: 2px; @@ -277,14 +223,13 @@ button.primary:disabled{ /* Small screens */ @media (max-width:420px){ + .login-backdrop{ padding: 12px; } + .login-modal{ max-width: 100%; } + .modal-card .brand{ padding: 12px; } .login-widget .card{ padding: 18px; width: 100%; } .brand h1{ font-size: 18px; } - .brand .subtitle{ - font-family: "Kanit"; - font-weight: 1000; - font-style: normal; } .biometric span, .primary{ font-size: 13px; } } diff --git a/accounting-ng-nuttakit/src/app/component/login-forgot/login-forgot.component.html b/accounting-ng-nuttakit/src/app/component/login-forgot/login-forgot.component.html index 660b8f7..ab9f676 100644 --- a/accounting-ng-nuttakit/src/app/component/login-forgot/login-forgot.component.html +++ b/accounting-ng-nuttakit/src/app/component/login-forgot/login-forgot.component.html @@ -1,105 +1,120 @@
-
+
-
+ +
+
+
+

สรุปสภาพคล่อง

+

อัปเดตล่าสุดเมื่อสักครู่

+
+
+ +
+
+ +

+ {{ ratio.label }} +

+ + + + {{ ratio.value | number:'1.2-2' }} + บาท + + + + {{ ratio.value }} + + + +
+
+
+ @else if(mode == "register"){ + + }
diff --git a/accounting-ng-nuttakit/src/app/content/login-content/login-content.component.ts b/accounting-ng-nuttakit/src/app/content/login-content/login-content.component.ts index 9bc734e..dbad907 100644 --- a/accounting-ng-nuttakit/src/app/content/login-content/login-content.component.ts +++ b/accounting-ng-nuttakit/src/app/content/login-content/login-content.component.ts @@ -14,7 +14,7 @@ import { finalize } from 'rxjs/operators'; export class LoginContentComponent implements OnInit { @ViewChild(LoginForgotComponent) loginForgotComponent!: LoginForgotComponent; @ViewChild(LoginPageComponent) loginPageComponent!: LoginPageComponent; - mode: 'forgot-password' | 'default' = 'default'; + mode: 'forgot-password' | 'register' | 'default' = 'default'; constructor( private generalService: GeneralService, @@ -27,6 +27,8 @@ export class LoginContentComponent implements OnInit { if (param === 'forgot-password') { this.mode = 'forgot-password'; + }else if(param === 'register'){ + this.mode = 'register'; } else { // this.router.navigate(['/login']); // This can cause navigation loops this.mode = 'default'; @@ -57,6 +59,7 @@ export class LoginContentComponent implements OnInit { if (result.code === '200' && result.data?.token) { this.generalService.trowApi(result); localStorage.setItem('access_token', result.data.token); + localStorage.setItem('username', result.data.usrthinam); this.router.navigate(['main/dashboard']); } else { const errorMessage = result.message_th || result.message || 'Sign-in failed.'; @@ -76,6 +79,28 @@ export class LoginContentComponent implements OnInit { }); } +onRegisterSubmit(value: any){ + const uri = '/api/login/register'; + const request = { + username: value.username, + password: value.password, + email: value.email + }; + + this.generalService.postRequest(uri, request).subscribe({ + next: (result: any) => { + if (result.code === '200') { } + else { + this.generalService.trowApi(result); + } + }, + error: (error: any) => { + this.generalService.trowApi(error); + } + }); + } + + onOtpSendSubmit(value: any){ let uri = '/api/login/otp/send'; diff --git a/accounting-ng-nuttakit/src/app/content/main-dashboard-content/main-dashboard-content.component.html b/accounting-ng-nuttakit/src/app/content/main-dashboard-content/main-dashboard-content.component.html index d680121..6ca7f2d 100644 --- a/accounting-ng-nuttakit/src/app/content/main-dashboard-content/main-dashboard-content.component.html +++ b/accounting-ng-nuttakit/src/app/content/main-dashboard-content/main-dashboard-content.component.html @@ -1 +1 @@ - + diff --git a/accounting-ng-nuttakit/src/app/content/main-dashboard-content/main-dashboard-content.component.ts b/accounting-ng-nuttakit/src/app/content/main-dashboard-content/main-dashboard-content.component.ts index 7ac22b0..6002e15 100644 --- a/accounting-ng-nuttakit/src/app/content/main-dashboard-content/main-dashboard-content.component.ts +++ b/accounting-ng-nuttakit/src/app/content/main-dashboard-content/main-dashboard-content.component.ts @@ -20,7 +20,7 @@ export class MainDashboardContentComponent implements OnInit { summary: { totalIncome: '', totalExpense: '', - netProfit: '', + netProfit: 0, profitRate: '', adjustedProfitRate: '', period: '' @@ -67,7 +67,27 @@ export class MainDashboardContentComponent implements OnInit { }); } - + OnSaveSubmit(value: any){ + const uri = '/api/web/accountingAdd'; + let request = value + this.generalService.postRequest(uri, request).subscribe({ + next: (result: any) => { + if (result.code === '200') { + this.generalService.trowApi(result); + // this.myActData = result.data; + // this.dashboardStateService.setStateAccountResult(this.myActData); + }else{ + this.generalService.trowApi(result); + } + }, + error: (error: any) => { + this.generalService.trowApi(error); + }, + complete: () => { + this.ngOnInit(); + } + }); + } OnSetupDashboard(value: any, setupFirst: boolean): void { const uri = '/api/web/accountingSetup'; diff --git a/accounting-ng-nuttakit/src/app/controls/login-control/login-control.module.ts b/accounting-ng-nuttakit/src/app/controls/login-control/login-control.module.ts index e4298fd..a6231d6 100644 --- a/accounting-ng-nuttakit/src/app/controls/login-control/login-control.module.ts +++ b/accounting-ng-nuttakit/src/app/controls/login-control/login-control.module.ts @@ -6,13 +6,15 @@ import { LoginPageComponent } from '../../component/login-page/login-page.compon import { ReactiveFormsModule } from '@angular/forms'; import { FontAwesomeModule } from '@fortawesome/angular-fontawesome'; import { LoginForgotComponent } from '../../component/login-forgot/login-forgot.component'; +import { LoginRegisterComponent } from '../../component/login-register/login-register.component'; // import { AppModule } from '../../app.module'; @NgModule({ declarations: [ LoginContentComponent, LoginPageComponent, - LoginForgotComponent + LoginForgotComponent, + LoginRegisterComponent ], imports: [ CommonModule, diff --git a/accounting-ng-nuttakit/src/app/interfaces/dashboard.interface.ts b/accounting-ng-nuttakit/src/app/interfaces/dashboard.interface.ts index 3d44aca..b778428 100644 --- a/accounting-ng-nuttakit/src/app/interfaces/dashboard.interface.ts +++ b/accounting-ng-nuttakit/src/app/interfaces/dashboard.interface.ts @@ -35,7 +35,7 @@ export interface IActSumData { export interface IActSummary { totalIncome: string; totalExpense: string; - netProfit: string; + netProfit: number; profitRate: string; adjustedProfitRate: string; period: string; @@ -53,6 +53,12 @@ export interface IActCategory { color: string; } + +export interface QuickRatio { + label: string; + value: string | number; + colorClass: string; // ตัวเก็บชื่อ class สี +} // ข้อมูลสินค้าหลัก // export interface IProduct { // id: string; diff --git a/accounting-ng-nuttakit/src/environments/environment.development.ts b/accounting-ng-nuttakit/src/environments/environment.development.ts index d0503a7..4237d6b 100644 --- a/accounting-ng-nuttakit/src/environments/environment.development.ts +++ b/accounting-ng-nuttakit/src/environments/environment.development.ts @@ -1,4 +1,4 @@ export const environment = { production: false, - apiBaseUrl: 'http://localhost:8000' + apiBaseUrl: 'https://magnitude-dawn-generic-refuse.trycloudflare.com' };