Compare commits
10 Commits
5c0f742cf5
...
dcf55db57e
| Author | SHA1 | Date | |
|---|---|---|---|
| dcf55db57e | |||
| 2a401eec51 | |||
| 80b9172602 | |||
| 2cbac0027b | |||
| 5b9faf6cbf | |||
| fbf5b5d2e6 | |||
| 3cc3d72eb5 | |||
| 57b9371d2a | |||
| 288beac65d | |||
|
199b1975b4 |
35
package-lock.json
generated
35
package-lock.json
generated
@@ -21,6 +21,7 @@
|
|||||||
"@ng-select/ng-select": "^10.0.3",
|
"@ng-select/ng-select": "^10.0.3",
|
||||||
"bootstrap-icons": "^1.10.3",
|
"bootstrap-icons": "^1.10.3",
|
||||||
"date-fns": "^2.29.3",
|
"date-fns": "^2.29.3",
|
||||||
|
"f": "^1.4.0",
|
||||||
"rxjs": "~7.8.0",
|
"rxjs": "~7.8.0",
|
||||||
"sweetalert2": "^11.7.3",
|
"sweetalert2": "^11.7.3",
|
||||||
"tslib": "^2.3.0",
|
"tslib": "^2.3.0",
|
||||||
@@ -6451,6 +6452,11 @@
|
|||||||
"node": ">=4"
|
"node": ">=4"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"node_modules/f": {
|
||||||
|
"version": "1.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/f/-/f-1.4.0.tgz",
|
||||||
|
"integrity": "sha512-THMsoTpFuIFoQ538jpbW7x/9pVaE0jdKN2O+nd7xpeUT17lECGX8M+QOaZ186ipc3XSzSFOytaXFidItHix44Q=="
|
||||||
|
},
|
||||||
"node_modules/fast-deep-equal": {
|
"node_modules/fast-deep-equal": {
|
||||||
"version": "3.1.3",
|
"version": "3.1.3",
|
||||||
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
||||||
@@ -15357,8 +15363,7 @@
|
|||||||
"version": "15.2.2",
|
"version": "15.2.2",
|
||||||
"resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-15.2.2.tgz",
|
"resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-15.2.2.tgz",
|
||||||
"integrity": "sha512-xHd5CC0Wi0a/CKfKoOC4Bwb1FVjy0esj22eQAkVh0iDKeiAQH4UG/VRmsdSHvto1z0IzGbMSt4hRbv4h2aYIdw==",
|
"integrity": "sha512-xHd5CC0Wi0a/CKfKoOC4Bwb1FVjy0esj22eQAkVh0iDKeiAQH4UG/VRmsdSHvto1z0IzGbMSt4hRbv4h2aYIdw==",
|
||||||
"dev": true,
|
"dev": true
|
||||||
"requires": {}
|
|
||||||
},
|
},
|
||||||
"@nodelib/fs.scandir": {
|
"@nodelib/fs.scandir": {
|
||||||
"version": "2.1.5",
|
"version": "2.1.5",
|
||||||
@@ -15957,8 +15962,7 @@
|
|||||||
"version": "1.8.0",
|
"version": "1.8.0",
|
||||||
"resolved": "https://registry.npmjs.org/acorn-import-assertions/-/acorn-import-assertions-1.8.0.tgz",
|
"resolved": "https://registry.npmjs.org/acorn-import-assertions/-/acorn-import-assertions-1.8.0.tgz",
|
||||||
"integrity": "sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==",
|
"integrity": "sha512-m7VZ3jwz4eK6A4Vtt8Ew1/mNbP24u0FhdyfA7fSvnJR6LMdfOYnmuIrrJAgrYfYJ10F/otaHTtrtrtmHdMNzEw==",
|
||||||
"dev": true,
|
"dev": true
|
||||||
"requires": {}
|
|
||||||
},
|
},
|
||||||
"acorn-node": {
|
"acorn-node": {
|
||||||
"version": "1.8.2",
|
"version": "1.8.2",
|
||||||
@@ -17549,6 +17553,11 @@
|
|||||||
"tmp": "^0.0.33"
|
"tmp": "^0.0.33"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"f": {
|
||||||
|
"version": "1.4.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/f/-/f-1.4.0.tgz",
|
||||||
|
"integrity": "sha512-THMsoTpFuIFoQ538jpbW7x/9pVaE0jdKN2O+nd7xpeUT17lECGX8M+QOaZ186ipc3XSzSFOytaXFidItHix44Q=="
|
||||||
|
},
|
||||||
"fast-deep-equal": {
|
"fast-deep-equal": {
|
||||||
"version": "3.1.3",
|
"version": "3.1.3",
|
||||||
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
||||||
@@ -18086,8 +18095,7 @@
|
|||||||
"version": "5.1.0",
|
"version": "5.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz",
|
"resolved": "https://registry.npmjs.org/icss-utils/-/icss-utils-5.1.0.tgz",
|
||||||
"integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
|
"integrity": "sha512-soFhflCVWLfRNOPU3iv5Z9VUdT44xFRbzjLsEzSr5AQmgqPMTHdU3PMT1Cf1ssx8fLNJDA1juftYl+PUcv3MqA==",
|
||||||
"dev": true,
|
"dev": true
|
||||||
"requires": {}
|
|
||||||
},
|
},
|
||||||
"ieee754": {
|
"ieee754": {
|
||||||
"version": "1.2.1",
|
"version": "1.2.1",
|
||||||
@@ -18763,8 +18771,7 @@
|
|||||||
"version": "2.0.0",
|
"version": "2.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/karma-jasmine-html-reporter/-/karma-jasmine-html-reporter-2.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/karma-jasmine-html-reporter/-/karma-jasmine-html-reporter-2.0.0.tgz",
|
||||||
"integrity": "sha512-SB8HNNiazAHXM1vGEzf8/tSyEhkfxuDdhYdPBX2Mwgzt0OuF2gicApQ+uvXLID/gXyJQgvrM9+1/2SxZFUUDIA==",
|
"integrity": "sha512-SB8HNNiazAHXM1vGEzf8/tSyEhkfxuDdhYdPBX2Mwgzt0OuF2gicApQ+uvXLID/gXyJQgvrM9+1/2SxZFUUDIA==",
|
||||||
"dev": true,
|
"dev": true
|
||||||
"requires": {}
|
|
||||||
},
|
},
|
||||||
"karma-source-map-support": {
|
"karma-source-map-support": {
|
||||||
"version": "1.4.0",
|
"version": "1.4.0",
|
||||||
@@ -20260,8 +20267,7 @@
|
|||||||
"version": "3.0.0",
|
"version": "3.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz",
|
||||||
"integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==",
|
"integrity": "sha512-bdHleFnP3kZ4NYDhuGlVK+CMrQ/pqUm8bx/oGL93K6gVwiclvX5x0n76fYMKuIGKzlABOy13zsvqjb0f92TEXw==",
|
||||||
"dev": true,
|
"dev": true
|
||||||
"requires": {}
|
|
||||||
},
|
},
|
||||||
"postcss-modules-local-by-default": {
|
"postcss-modules-local-by-default": {
|
||||||
"version": "4.0.0",
|
"version": "4.0.0",
|
||||||
@@ -21515,8 +21521,7 @@
|
|||||||
"version": "3.5.2",
|
"version": "3.5.2",
|
||||||
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
|
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
|
||||||
"integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
|
"integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
|
||||||
"dev": true,
|
"dev": true
|
||||||
"requires": {}
|
|
||||||
},
|
},
|
||||||
"json-schema-traverse": {
|
"json-schema-traverse": {
|
||||||
"version": "0.4.1",
|
"version": "0.4.1",
|
||||||
@@ -21943,8 +21948,7 @@
|
|||||||
"version": "3.5.2",
|
"version": "3.5.2",
|
||||||
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
|
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
|
||||||
"integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
|
"integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
|
||||||
"dev": true,
|
"dev": true
|
||||||
"requires": {}
|
|
||||||
},
|
},
|
||||||
"json-schema-traverse": {
|
"json-schema-traverse": {
|
||||||
"version": "0.4.1",
|
"version": "0.4.1",
|
||||||
@@ -22143,8 +22147,7 @@
|
|||||||
"version": "8.11.0",
|
"version": "8.11.0",
|
||||||
"resolved": "https://registry.npmjs.org/ws/-/ws-8.11.0.tgz",
|
"resolved": "https://registry.npmjs.org/ws/-/ws-8.11.0.tgz",
|
||||||
"integrity": "sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==",
|
"integrity": "sha512-HPG3wQd9sNQoT9xHyNCXoDUa+Xw/VevmY9FoHyQ+g+rrMn4j6FB4np7Z0OhdTgjx6MgQLK7jwSy1YecU1+4Asg==",
|
||||||
"dev": true,
|
"dev": true
|
||||||
"requires": {}
|
|
||||||
},
|
},
|
||||||
"xtend": {
|
"xtend": {
|
||||||
"version": "4.0.2",
|
"version": "4.0.2",
|
||||||
|
|||||||
@@ -23,6 +23,7 @@
|
|||||||
"@ng-select/ng-select": "^10.0.3",
|
"@ng-select/ng-select": "^10.0.3",
|
||||||
"bootstrap-icons": "^1.10.3",
|
"bootstrap-icons": "^1.10.3",
|
||||||
"date-fns": "^2.29.3",
|
"date-fns": "^2.29.3",
|
||||||
|
"f": "^1.4.0",
|
||||||
"rxjs": "~7.8.0",
|
"rxjs": "~7.8.0",
|
||||||
"sweetalert2": "^11.7.3",
|
"sweetalert2": "^11.7.3",
|
||||||
"tslib": "^2.3.0",
|
"tslib": "^2.3.0",
|
||||||
|
|||||||
@@ -1,96 +1,106 @@
|
|||||||
|
|
||||||
export interface MENU {
|
export interface MENU {
|
||||||
link?: string;
|
link?: string;
|
||||||
type: | 'link' | 'heading' | 'collapsable';
|
type: | 'link' | 'heading' | 'collapsable';
|
||||||
icon?: string;
|
icon?: string;
|
||||||
name?: string;
|
name?: string;
|
||||||
params?: any[];
|
params?: any[];
|
||||||
badge?: string;
|
badge?: string;
|
||||||
roles?: any[];
|
roles?: any[];
|
||||||
children?: any[];
|
children?: any[];
|
||||||
permission?: string;
|
permission?: string;
|
||||||
collapsed?: boolean;
|
collapsed?: boolean;
|
||||||
notShowing?: boolean;
|
notShowing?: boolean;
|
||||||
isChecked?: boolean;
|
isChecked?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const ROLE_ADMIN = 'admin'
|
export const ROLE_ADMIN = 'admin'
|
||||||
export const NOT_ADMIN = 'not-admin'
|
export const NOT_ADMIN = 'not-admin'
|
||||||
export const MENU: MENU[] = [
|
export const MENU: MENU[] = [
|
||||||
{
|
{
|
||||||
name: 'Manage',
|
name: 'Manage',
|
||||||
link: 'manage',
|
link: 'manage',
|
||||||
permission: 'manage',
|
permission: 'manage',
|
||||||
icon: 'bi bi-card-checklist',
|
icon: 'bi bi-card-checklist',
|
||||||
|
params: [],
|
||||||
|
roles: [ROLE_ADMIN],
|
||||||
|
badge: '',
|
||||||
|
type: 'collapsable',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'KYC',
|
||||||
|
link: 'manage/kyc',
|
||||||
|
permission: 'manage-kyc',
|
||||||
|
type: 'link',
|
||||||
|
icon: '',
|
||||||
params: [],
|
params: [],
|
||||||
|
badge: '',
|
||||||
roles: [ROLE_ADMIN],
|
roles: [ROLE_ADMIN],
|
||||||
badge: '',
|
},
|
||||||
type: 'collapsable',
|
{
|
||||||
children: [
|
name: 'User',
|
||||||
{
|
link: 'manage/user',
|
||||||
name: 'KYC',
|
permission: 'user',
|
||||||
link: 'manage/kyc',
|
type: 'link',
|
||||||
permission: 'manage-kyc',
|
icon: '',
|
||||||
type: 'link',
|
|
||||||
icon: '',
|
|
||||||
params: [],
|
|
||||||
badge: '',
|
|
||||||
roles: [ROLE_ADMIN],
|
|
||||||
},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Report',
|
|
||||||
link: 'report',
|
|
||||||
permission: 'report',
|
|
||||||
icon: 'bi bi-file-bar-graph',
|
|
||||||
params: [],
|
params: [],
|
||||||
roles:[ROLE_ADMIN,NOT_ADMIN],
|
|
||||||
badge: '',
|
badge: '',
|
||||||
type: 'collapsable',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
name: 'Transactions',
|
|
||||||
link: 'report/transactions',
|
|
||||||
permission: 'transactions',
|
|
||||||
type: 'link',
|
|
||||||
icon: '',
|
|
||||||
params: [ROLE_ADMIN,NOT_ADMIN],
|
|
||||||
badge: '',
|
|
||||||
roles: [],
|
|
||||||
},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: 'Setting',
|
|
||||||
link: 'setting',
|
|
||||||
permission: 'setting',
|
|
||||||
icon: 'bi bi-gear-fill',
|
|
||||||
params: [],
|
|
||||||
roles: [ROLE_ADMIN],
|
roles: [ROLE_ADMIN],
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: 'Report',
|
||||||
|
link: 'report',
|
||||||
|
permission: 'report',
|
||||||
|
icon: 'bi bi-file-bar-graph',
|
||||||
|
params: [],
|
||||||
|
roles: [ROLE_ADMIN, NOT_ADMIN],
|
||||||
|
badge: '',
|
||||||
|
type: 'collapsable',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: 'Transactions',
|
||||||
|
link: 'report/transactions',
|
||||||
|
permission: 'transactions',
|
||||||
|
type: 'link',
|
||||||
|
icon: '',
|
||||||
|
params: [ROLE_ADMIN, NOT_ADMIN],
|
||||||
badge: '',
|
badge: '',
|
||||||
type: 'collapsable',
|
roles: [],
|
||||||
children: [
|
},
|
||||||
{
|
]
|
||||||
name: 'Banner',
|
},
|
||||||
link: 'setting/banner',
|
{
|
||||||
permission: 'banner',
|
name: 'Setting',
|
||||||
roles: [ROLE_ADMIN],
|
link: 'setting',
|
||||||
type: 'link',
|
permission: 'setting',
|
||||||
icon: '',
|
icon: 'bi bi-gear-fill',
|
||||||
params: [],
|
params: [],
|
||||||
badge: '',
|
roles: [ROLE_ADMIN],
|
||||||
},
|
badge: '',
|
||||||
{
|
type: 'collapsable',
|
||||||
name: 'Promotion',
|
children: [
|
||||||
link: 'setting/promotion',
|
{
|
||||||
roles: [ROLE_ADMIN],
|
name: 'Banner',
|
||||||
permission: 'promotion',
|
link: 'setting/banner',
|
||||||
type: 'link',
|
permission: 'banner',
|
||||||
icon: '',
|
roles: [ROLE_ADMIN],
|
||||||
params: [],
|
type: 'link',
|
||||||
badge: '',
|
icon: '',
|
||||||
},
|
params: [],
|
||||||
]
|
badge: '',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
name: 'Promotion',
|
||||||
|
link: 'setting/promotion',
|
||||||
|
roles: [ROLE_ADMIN],
|
||||||
|
permission: 'promotion',
|
||||||
|
type: 'link',
|
||||||
|
icon: '',
|
||||||
|
params: [],
|
||||||
|
badge: '',
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
];
|
];
|
||||||
|
|||||||
@@ -6,75 +6,79 @@ import { AppGuard } from "./app.guard";
|
|||||||
|
|
||||||
|
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
{
|
{
|
||||||
path: '',
|
path: '',
|
||||||
redirectTo: 'pages',
|
redirectTo: 'pages',
|
||||||
pathMatch: 'full'
|
pathMatch: 'full'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: 'auth',
|
path: 'auth',
|
||||||
loadChildren: () => import('./auth/auth.module').then(m => m.AuthModule)
|
loadChildren: () => import('./auth/auth.module').then(m => m.AuthModule)
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: 'pages',
|
path: 'pages',
|
||||||
component: PagesLayoutsComponent,
|
component: PagesLayoutsComponent,
|
||||||
canActivate: [AppGuard],
|
canActivate: [AppGuard],
|
||||||
canActivateChild: [AppGuard],
|
canActivateChild: [AppGuard],
|
||||||
|
children: [
|
||||||
|
{ path: '', redirectTo: 'dashboard', pathMatch: 'full' },
|
||||||
|
{
|
||||||
|
path: 'dashboard',
|
||||||
|
loadChildren: () => import('./pages/dashboard/dashboard.module').then(m => m.DashboardModule)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'manage',
|
||||||
children: [
|
children: [
|
||||||
{ path: '', redirectTo: 'dashboard', pathMatch: 'full' },
|
{
|
||||||
{
|
path: 'kyc',
|
||||||
path: 'dashboard',
|
loadChildren: () => import('./pages/manage/kyc/kyc.module').then(m => m.KycModule)
|
||||||
loadChildren: () => import('./pages/dashboard/dashboard.module').then(m => m.DashboardModule)
|
},
|
||||||
},
|
{
|
||||||
{
|
path: "user",
|
||||||
path: 'manage',
|
loadChildren: () => import('./pages/manage/users/users.module').then(m => m.UsersModule)
|
||||||
children: [
|
}
|
||||||
{
|
|
||||||
path: 'kyc',
|
|
||||||
loadChildren: () => import('./pages/manage/kyc/kyc.module').then(m => m.KycModule)
|
|
||||||
},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'report',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
path: 'transactions',
|
|
||||||
loadChildren: () => import('./pages/report/transactions/transactions.module').then(m => m.TransactionsModule)
|
|
||||||
},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'setting',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
path: 'banner',
|
|
||||||
loadChildren: () => import('./pages/setting/banner/banner.module').then(m => m.BannerModule)
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'promotion',
|
|
||||||
loadChildren: () => import('./pages/setting/promotion/promotion.module').then(m => m.PromotionModule)
|
|
||||||
},
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'not-found',
|
|
||||||
loadChildren: () => import('./pages/errors/errors.module').then(m => m.ErrorsModule)
|
|
||||||
},
|
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'report',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: 'transactions',
|
||||||
|
loadChildren: () => import('./pages/report/transactions/transactions.module').then(m => m.TransactionsModule)
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'setting',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: 'banner',
|
||||||
|
loadChildren: () => import('./pages/setting/banner/banner.module').then(m => m.BannerModule)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'promotion',
|
||||||
|
loadChildren: () => import('./pages/setting/promotion/promotion.module').then(m => m.PromotionModule)
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'not-found',
|
||||||
|
loadChildren: () => import('./pages/errors/errors.module').then(m => m.ErrorsModule)
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
|
||||||
{ path: '**', redirectTo: 'pages/not-found' }
|
{ path: '**', redirectTo: 'pages/not-found' }
|
||||||
];
|
];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [RouterModule.forRoot(routes, { useHash: true })],
|
imports: [RouterModule.forRoot(routes, { useHash: true })],
|
||||||
exports: [RouterModule]
|
exports: [RouterModule]
|
||||||
})
|
})
|
||||||
export class AppRoutingModule {
|
export class AppRoutingModule {
|
||||||
}
|
}
|
||||||
|
|
||||||
export const AppRoutingComponents = [
|
export const AppRoutingComponents = [
|
||||||
ComingsoonComponent,
|
ComingsoonComponent,
|
||||||
PagesLayoutsComponent
|
PagesLayoutsComponent
|
||||||
];
|
];
|
||||||
|
|||||||
@@ -1,3 +1,4 @@
|
|||||||
|
import { HttpClient } from '@angular/common/http';
|
||||||
import { Component } from '@angular/core';
|
import { Component } from '@angular/core';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
@@ -5,4 +6,6 @@ import { Component } from '@angular/core';
|
|||||||
templateUrl: './app.component.html',
|
templateUrl: './app.component.html',
|
||||||
styleUrls: []
|
styleUrls: []
|
||||||
})
|
})
|
||||||
export class AppComponent {}
|
export class AppComponent {
|
||||||
|
|
||||||
|
}
|
||||||
|
|||||||
@@ -1,15 +1,18 @@
|
|||||||
import {Injectable} from '@angular/core';
|
import { Injectable } from '@angular/core';
|
||||||
import {HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
|
import { HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest } from '@angular/common/http';
|
||||||
import {Router} from '@angular/router';
|
import { Router } from '@angular/router';
|
||||||
import {AppService} from './app.service';
|
import { AppService } from './app.service';
|
||||||
import {catchError, Observable, throwError} from 'rxjs';
|
import { catchError, Observable, throwError } from 'rxjs';
|
||||||
|
import { environment } from 'src/environments/environment';
|
||||||
|
import { SathonCathayPayService } from './sathon-cathay-pay.service';
|
||||||
|
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class AppRequestInterceptor implements HttpInterceptor {
|
export class AppRequestInterceptor implements HttpInterceptor {
|
||||||
constructor(
|
constructor(
|
||||||
private router: Router,
|
private router: Router,
|
||||||
private appService: AppService
|
private appService: AppService,
|
||||||
|
private sathonSV: SathonCathayPayService
|
||||||
) {
|
) {
|
||||||
|
|
||||||
}
|
}
|
||||||
@@ -18,7 +21,7 @@ export class AppRequestInterceptor implements HttpInterceptor {
|
|||||||
|
|
||||||
if (token) {
|
if (token) {
|
||||||
request = request.clone({
|
request = request.clone({
|
||||||
setHeaders: {Authorization: `Bearer ${token}`}
|
setHeaders: { Authorization: `Bearer ${this.generateToken(request.url)}` }
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -33,4 +36,10 @@ export class AppRequestInterceptor implements HttpInterceptor {
|
|||||||
})
|
})
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
generateToken(url: string) {
|
||||||
|
if (url.includes('71dev')) return this.appService.token()
|
||||||
|
if (url.includes('cathay-pay')) return this.appService.getsathonToken()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
import {Inject, Injectable} from '@angular/core';
|
import { Inject, Injectable } from '@angular/core';
|
||||||
import {HttpClient} from '@angular/common/http';
|
import { HttpClient } from '@angular/common/http';
|
||||||
import {DOCUMENT, Location} from '@angular/common';
|
import { DOCUMENT, Location } from '@angular/common';
|
||||||
import {from, Observable} from 'rxjs';
|
import { from, Observable } from 'rxjs';
|
||||||
import Swal, {SweetAlertResult} from 'sweetalert2'
|
import Swal, { SweetAlertResult } from 'sweetalert2'
|
||||||
import {EAction} from "./@config/app";
|
import { EAction } from "./@config/app";
|
||||||
|
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
@@ -25,6 +25,14 @@ export class AppService {
|
|||||||
localStorage.setItem('user', JSON.stringify(data));
|
localStorage.setItem('user', JSON.stringify(data));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
setSathonToken(data) {
|
||||||
|
localStorage.setItem('sathontoken', data);
|
||||||
|
}
|
||||||
|
|
||||||
|
getsathonToken() {
|
||||||
|
return localStorage.getItem('sathontoken');
|
||||||
|
}
|
||||||
|
|
||||||
token() {
|
token() {
|
||||||
const token = localStorage.getItem('token');
|
const token = localStorage.getItem('token');
|
||||||
if (!token) return null;
|
if (!token) return null;
|
||||||
@@ -42,6 +50,7 @@ export class AppService {
|
|||||||
async logout() {
|
async logout() {
|
||||||
localStorage.removeItem('token');
|
localStorage.removeItem('token');
|
||||||
localStorage.removeItem('user');
|
localStorage.removeItem('user');
|
||||||
|
localStorage.removeItem('sathontoken');
|
||||||
localStorage.clear();
|
localStorage.clear();
|
||||||
// await lastValueFrom( this.get(this.LOGOUT_API) )
|
// await lastValueFrom( this.get(this.LOGOUT_API) )
|
||||||
}
|
}
|
||||||
@@ -51,7 +60,7 @@ export class AppService {
|
|||||||
return this.httpClient.get<any>(url);
|
return this.httpClient.get<any>(url);
|
||||||
}
|
}
|
||||||
|
|
||||||
post(url: string, value: any, options? : any): Observable<any> {
|
post(url: string, value: any, options?: any): Observable<any> {
|
||||||
return this.httpClient.post<any>(url, value, options);
|
return this.httpClient.post<any>(url, value, options);
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -60,11 +69,11 @@ export class AppService {
|
|||||||
}
|
}
|
||||||
|
|
||||||
message(action: any = 'info', msg: string = 'กรุณาตรวจสอบข้อมูล') {
|
message(action: any = 'info', msg: string = 'กรุณาตรวจสอบข้อมูล') {
|
||||||
Swal.fire({icon: action, text: msg, heightAuto: false});
|
Swal.fire({ icon: action, text: msg, heightAuto: false });
|
||||||
}
|
}
|
||||||
|
|
||||||
html(action: any = 'info', msg: string = 'กรุณาตรวจสอบข้อมูล') {
|
html(action: any = 'info', msg: string = 'กรุณาตรวจสอบข้อมูล') {
|
||||||
Swal.fire({icon: action, html: msg, heightAuto: false});
|
Swal.fire({ icon: action, html: msg, heightAuto: false });
|
||||||
}
|
}
|
||||||
|
|
||||||
confirm(action: string = '', confirmButtonText: string = 'ตกลง', cancelButtonText: string = 'ยกเลิก'): Observable<SweetAlertResult<boolean>> {
|
confirm(action: string = '', confirmButtonText: string = 'ตกลง', cancelButtonText: string = 'ยกเลิก'): Observable<SweetAlertResult<boolean>> {
|
||||||
|
|||||||
@@ -7,68 +7,73 @@ import { lastValueFrom } from 'rxjs';
|
|||||||
import { EAction, EText } from 'src/app/@config/app';
|
import { EAction, EText } from 'src/app/@config/app';
|
||||||
import { CathayAuthService } from 'src/app/core/service/auth/cathay-auth.service';
|
import { CathayAuthService } from 'src/app/core/service/auth/cathay-auth.service';
|
||||||
import { ROLE_ADMIN } from 'src/app/@config/menus';
|
import { ROLE_ADMIN } from 'src/app/@config/menus';
|
||||||
|
import { SathonCathayPayService } from 'src/app/sathon-cathay-pay.service';
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-login',
|
selector: 'app-login',
|
||||||
templateUrl: './login.component.html',
|
templateUrl: './login.component.html',
|
||||||
styles: []
|
styles: []
|
||||||
})
|
})
|
||||||
export class LoginComponent implements OnInit {
|
export class LoginComponent implements OnInit {
|
||||||
dataForm: any = {};
|
dataForm: any = {};
|
||||||
cathayForm: any = {
|
cathayForm: any = {
|
||||||
mobileDeviceId : "1234",
|
mobileDeviceId: "1234",
|
||||||
userName: 'admin',
|
userName: 'admin',
|
||||||
password: 'P@ssword1'
|
password: 'P@ssword1'
|
||||||
};
|
};
|
||||||
isLoading = false;
|
isLoading = false;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private router: Router,
|
private router: Router,
|
||||||
private appService: AppService,
|
private appService: AppService,
|
||||||
private authService: AuthService,
|
private authService: AuthService,
|
||||||
private cathayAuthService: CathayAuthService
|
private cathayAuthService: CathayAuthService,
|
||||||
) {
|
private sathonSV: SathonCathayPayService
|
||||||
}
|
) {
|
||||||
|
}
|
||||||
ngOnInit() {
|
|
||||||
|
ngOnInit() {
|
||||||
// if (!environment.production) {
|
|
||||||
// this.dataForm = {
|
// if (!environment.production) {
|
||||||
// username: 'admin',
|
// this.dataForm = {
|
||||||
// password: 'admin',
|
// username: 'admin',
|
||||||
// }
|
// password: 'admin',
|
||||||
// }
|
// }
|
||||||
}
|
// }
|
||||||
|
}
|
||||||
async onSubmit(form: any) {
|
|
||||||
if (!form.valid) return false;
|
async onSubmit(form: any) {
|
||||||
try {
|
if (!form.valid) return false;
|
||||||
// const result = await lastValueFrom(this.authService.login(this.dataForm));
|
try {
|
||||||
let cathayResult: any = await lastValueFrom(this.cathayAuthService.login(this.cathayForm));
|
// const result = await lastValueFrom(this.authService.login(this.dataForm));
|
||||||
let isAdmin = cathayResult.token.userName == ROLE_ADMIN ? true : false
|
let cathayResult: any = await lastValueFrom(this.cathayAuthService.login(this.cathayForm));
|
||||||
cathayResult = {
|
let sathonToken: any = await lastValueFrom(this.cathayAuthService.genToken());
|
||||||
...cathayResult,
|
let isAdmin = cathayResult.userName == ROLE_ADMIN ? true : false
|
||||||
isAdmin: isAdmin
|
cathayResult = {
|
||||||
}
|
...cathayResult,
|
||||||
this.appService.setToken(cathayResult.token.token)
|
isAdmin: isAdmin
|
||||||
this.appService.setAuth(cathayResult);
|
}
|
||||||
|
|
||||||
if(isAdmin){
|
this.appService.setToken(cathayResult.token.token)
|
||||||
return this.router.navigate(['/pages']);
|
this.appService.setSathonToken(sathonToken.token)
|
||||||
}
|
this.appService.setAuth(cathayResult);
|
||||||
|
|
||||||
if(!isAdmin){
|
if (isAdmin) {
|
||||||
return this.router.navigate(['/pages/report/transactions']);
|
return this.router.navigate(['/pages']);
|
||||||
}
|
}
|
||||||
|
|
||||||
} catch (err) {
|
if (!isAdmin) {
|
||||||
return this.appService.message(EAction.ERROR, EText.NO_DATA);
|
return this.router.navigate(['/pages/report/transactions']);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
} catch (err) {
|
||||||
|
return this.appService.message(EAction.ERROR, EText.NO_DATA);
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
public isFieldValid(form: any, field: any) {
|
public isFieldValid(form: any, field: any) {
|
||||||
return field.errors && (field.dirty || field.touched || form.submitted);
|
return field.errors && (field.dirty || field.touched || form.submitted);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -6,16 +6,21 @@ import { environment } from 'src/environments/environment';
|
|||||||
@Injectable({
|
@Injectable({
|
||||||
providedIn: 'root'
|
providedIn: 'root'
|
||||||
})
|
})
|
||||||
export class CathayAuthService extends BaseService{
|
export class CathayAuthService extends BaseService {
|
||||||
API_URL = environment.CATHAYAPIURL
|
API_URL = environment.CATHAYAPIURL
|
||||||
constructor(
|
constructor(
|
||||||
public http: HttpClient
|
public http: HttpClient
|
||||||
) {
|
) {
|
||||||
super('', http)
|
super('', http)
|
||||||
super.fullUrl = `${this.API_URL}/v1/User`
|
super.fullUrl = `${this.API_URL}/v3/User`
|
||||||
}
|
}
|
||||||
|
|
||||||
login(payload : {'mobileDeviceId': string , 'userName': string , 'password' : string}){
|
login(payload: { 'mobileDeviceId': string, 'userName': string, 'password': string }) {
|
||||||
return this.http.post(`${this.fullUrl}/login`, payload)
|
return this.http.post(`${this.fullUrl}/login`, payload)
|
||||||
}
|
}
|
||||||
|
// https://sathorn.cathay-pay.com/api/v3/User/login
|
||||||
|
|
||||||
|
genToken() {
|
||||||
|
return this.http.get(`${environment.APIURL}/api/common/user_login/token`)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,135 +4,138 @@ import { AppService } from '../../app.service';
|
|||||||
import { MENU, NOT_ADMIN, ROLE_ADMIN } from "../../@config/menus";
|
import { MENU, NOT_ADMIN, ROLE_ADMIN } from "../../@config/menus";
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-pages-layouts',
|
selector: 'app-pages-layouts',
|
||||||
templateUrl: './layouts.component.html',
|
templateUrl: './layouts.component.html',
|
||||||
styles: [],
|
styles: [],
|
||||||
})
|
})
|
||||||
export class PagesLayoutsComponent implements OnInit {
|
export class PagesLayoutsComponent implements OnInit {
|
||||||
|
|
||||||
menus = MENU;
|
menus = MENU;
|
||||||
isToggleSidebar = false;
|
isToggleSidebar = false;
|
||||||
innerWidth: any;
|
innerWidth: any;
|
||||||
auth: any = {};
|
auth: any = {};
|
||||||
isCollapsed: any = [];
|
isCollapsed: any = [];
|
||||||
breadcrumb: any = [];
|
breadcrumb: any = [];
|
||||||
permissionCheck = false;
|
permissionCheck = false;
|
||||||
permission: any = [];
|
permission: any = [];
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private app: AppService,
|
private app: AppService,
|
||||||
private router: Router,
|
private router: Router,
|
||||||
public changeDetectorRef: ChangeDetectorRef,
|
public changeDetectorRef: ChangeDetectorRef,
|
||||||
) {
|
) {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
async ngOnInit() {
|
async ngOnInit() {
|
||||||
this.onCollapsed();
|
this.onCollapsed();
|
||||||
this.getBreadcrumb();
|
this.getBreadcrumb();
|
||||||
await this.initAuth();
|
await this.initAuth();
|
||||||
this.changeDetectorRef.markForCheck()
|
this.changeDetectorRef.markForCheck()
|
||||||
}
|
}
|
||||||
async initAuth() {
|
async initAuth() {
|
||||||
this.auth = this.app.auth();
|
this.auth = this.app.auth();
|
||||||
console.log(this.auth.isAdmin)
|
// console.log(this.auth)
|
||||||
this.menus = this.menus.map(r => {
|
// console.log(this.auth.isAdmin)
|
||||||
if(this.auth.isAdmin){
|
this.menus = this.menus.map(r => {
|
||||||
if(r.roles.includes(ROLE_ADMIN)) return {
|
if (this.auth.isAdmin) {
|
||||||
...r,
|
if (r.roles.includes(ROLE_ADMIN)) return {
|
||||||
children: r.children.length ? r.children.filter(c => r.roles.includes(ROLE_ADMIN)) : []
|
...r,
|
||||||
}
|
children: r.children.length ? r.children.filter(c => r.roles.includes(ROLE_ADMIN)) : []
|
||||||
} else {
|
|
||||||
if(r.roles.includes(NOT_ADMIN)) return {
|
|
||||||
...r,
|
|
||||||
children: r.children.length ? r.children.filter(c => r.roles.includes(NOT_ADMIN)) : []
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
if (!this.permissionCheck) {
|
|
||||||
// const users = await lastValueFrom(this.app.get(`${API.users}/getById/${this.auth.id}`));
|
|
||||||
// this.permission = users.permission;
|
|
||||||
// this.permissionCheck = true;
|
|
||||||
}
|
}
|
||||||
|
} else {
|
||||||
}
|
if (r.roles.includes(NOT_ADMIN)) return {
|
||||||
|
...r,
|
||||||
roleCheck(perm: string){
|
children: r.children.length ? r.children.filter(c => r.roles.includes(NOT_ADMIN)) : []
|
||||||
// if(!environment.production) return true
|
|
||||||
// return this.permission.includes(perm)
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
|
|
||||||
getBreadcrumb() {
|
|
||||||
this.breadcrumb = [];
|
|
||||||
let router: any = this.router.url;
|
|
||||||
router = router.split('/');
|
|
||||||
this.mapBreadcrumb(router, this.menus)
|
|
||||||
this.changeDetectorRef.markForCheck()
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
mapBreadcrumb(router: any, items: any) {
|
|
||||||
items.map((item: any) => {
|
|
||||||
this.addItemBreadcrumb(router, item);
|
|
||||||
if (item.children) this.mapBreadcrumb(router, item.children);
|
|
||||||
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
addItemBreadcrumb(router: any, item: any) {
|
|
||||||
|
|
||||||
const data = {
|
|
||||||
name: item.name,
|
|
||||||
link: item.link,
|
|
||||||
}
|
}
|
||||||
if (router[2]) {
|
}
|
||||||
if (item.link === router[2]) this.breadcrumb.push(data);
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
if (!this.permissionCheck) {
|
||||||
|
// const users = await lastValueFrom(this.app.get(`${API.users}/getById/${this.auth.id}`));
|
||||||
|
// this.permission = users.permission;
|
||||||
|
// this.permissionCheck = true;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
roleCheck(perm: string) {
|
||||||
|
// if(!environment.production) return true
|
||||||
|
// return this.permission.includes(perm)
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
getBreadcrumb() {
|
||||||
|
this.breadcrumb = [];
|
||||||
|
let router: any = this.router.url;
|
||||||
|
router = router.split('/');
|
||||||
|
this.mapBreadcrumb(router, this.menus)
|
||||||
|
this.changeDetectorRef.markForCheck()
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
mapBreadcrumb(router: any, items: any) {
|
||||||
|
items.map((item: any) => {
|
||||||
|
this.addItemBreadcrumb(router, item);
|
||||||
|
if (item.children) this.mapBreadcrumb(router, item.children);
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
addItemBreadcrumb(router: any, item: any) {
|
||||||
|
|
||||||
|
const data = {
|
||||||
|
name: item.name,
|
||||||
|
link: item.link,
|
||||||
|
}
|
||||||
|
if (router[2]) {
|
||||||
|
if (item.link === router[2]) this.breadcrumb.push(data);
|
||||||
|
}
|
||||||
|
if (router[3]) {
|
||||||
|
if (item.link === `${router[2]}/${router[3]}`) this.breadcrumb.push(data);
|
||||||
|
}
|
||||||
|
if (router[4]) {
|
||||||
|
if (item.link === `${router[2]}/${router[3]}/${router[4]}`) this.breadcrumb.push(data);
|
||||||
|
}
|
||||||
|
if (router[5]) {
|
||||||
|
if (item.link === `${router[2]}/${router[3]}/${router[4]}/${router[5]}`) this.breadcrumb.push(data);
|
||||||
|
}
|
||||||
|
if (router[6]) {
|
||||||
|
if (item.link === `${router[2]}/${router[3]}/${router[4]}/${router[5]}/${router[6]}`) this.breadcrumb.push(data);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
onCollapsed() {
|
||||||
|
let router: any = this.router.url;
|
||||||
|
router = router.split('/');
|
||||||
|
this.menus.forEach((item: any, i: number) => {
|
||||||
|
// item.collapsed = false;
|
||||||
|
if (item.type === 'collapsable') {
|
||||||
|
if (router.includes(item.link)) {
|
||||||
|
item.collapsed = true;
|
||||||
}
|
}
|
||||||
if (router[3]) {
|
}
|
||||||
if (item.link === `${router[2]}/${router[3]}`) this.breadcrumb.push(data);
|
});
|
||||||
}
|
}
|
||||||
if (router[4]) {
|
|
||||||
if (item.link === `${router[2]}/${router[3]}/${router[4]}`) this.breadcrumb.push(data);
|
|
||||||
}
|
|
||||||
if (router[5]) {
|
|
||||||
if (item.link === `${router[2]}/${router[3]}/${router[4]}/${router[5]}`) this.breadcrumb.push(data);
|
|
||||||
}
|
|
||||||
if (router[6]) {
|
|
||||||
if (item.link === `${router[2]}/${router[3]}/${router[4]}/${router[5]}/${router[6]}`) this.breadcrumb.push(data);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
onCollapsed() {
|
logout() {
|
||||||
let router: any = this.router.url;
|
this.app.logout();
|
||||||
router = router.split('/');
|
return this.router.navigate(['/auth']);
|
||||||
this.menus.forEach((item: any, i: number) => {
|
}
|
||||||
// item.collapsed = false;
|
|
||||||
if (item.type === 'collapsable') {
|
|
||||||
if (router.includes(item.link)) {
|
|
||||||
item.collapsed = true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
logout() {
|
|
||||||
this.app.logout();
|
|
||||||
return this.router.navigate(['/auth']);
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
toggleSidebar() {
|
toggleSidebar() {
|
||||||
this.isToggleSidebar = !this.isToggleSidebar;
|
this.isToggleSidebar = !this.isToggleSidebar;
|
||||||
}
|
}
|
||||||
|
|
||||||
closeSidebar() {
|
closeSidebar() {
|
||||||
this.isToggleSidebar = false;
|
this.isToggleSidebar = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
onDeactivate() {
|
onDeactivate() {
|
||||||
this.ngOnInit();
|
this.ngOnInit();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,4 +1,2 @@
|
|||||||
<app-list
|
<app-list (edit)="edit($event)" (OnDelete)="onDelete($event)" [kycList]="kyc$ | async">
|
||||||
(edit)="edit($event)"
|
|
||||||
[kycList]="kyc$ | async">
|
|
||||||
</app-list>
|
</app-list>
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
import { ChangeDetectorRef, Component } from '@angular/core';
|
import { ChangeDetectorRef, Component } from '@angular/core';
|
||||||
import { Observable, catchError, switchMap, tap, throwError } from 'rxjs';
|
import { Observable, catchError, concatMap, filter, switchMap, tap, throwError } from 'rxjs';
|
||||||
import { IDialogConfig, CDialogConfig } from 'src/app/@common/interface/Dialog';
|
import { IDialogConfig, CDialogConfig } from 'src/app/@common/interface/Dialog';
|
||||||
import { EAction, EText } from 'src/app/@config/app';
|
import { EAction, EText } from 'src/app/@config/app';
|
||||||
import { KycService } from 'src/app/core/service/common/kyc.service';
|
import { KycService } from 'src/app/core/service/common/kyc.service';
|
||||||
@@ -7,40 +7,66 @@ import { DialogComponent } from '../../presenter/dialog/dialog.component';
|
|||||||
import { MatDialog } from '@angular/material/dialog';
|
import { MatDialog } from '@angular/material/dialog';
|
||||||
import { AppService } from 'src/app/app.service';
|
import { AppService } from 'src/app/app.service';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-kyc',
|
selector: 'app-kyc',
|
||||||
templateUrl: './kyc.container.html',
|
templateUrl: './kyc.container.html',
|
||||||
styleUrls: ['./kyc.container.scss']
|
styleUrls: ['./kyc.container.scss']
|
||||||
})
|
})
|
||||||
export class KycContainer {
|
export class KycContainer {
|
||||||
dialogConfig: IDialogConfig = CDialogConfig
|
dialogConfig: IDialogConfig = CDialogConfig
|
||||||
kyc$ = new Observable();
|
kyc$ = new Observable();
|
||||||
constructor(
|
constructor(
|
||||||
private kycService: KycService,
|
private kycService: KycService,
|
||||||
private dialog: MatDialog,
|
private dialog: MatDialog,
|
||||||
private appService: AppService,
|
private appService: AppService,
|
||||||
private cdr: ChangeDetectorRef
|
private cdr: ChangeDetectorRef
|
||||||
) {
|
) {
|
||||||
this.kyc$ = this.kycService.getAll();
|
this.kyc$ = this.kycService.getAll();
|
||||||
}
|
}
|
||||||
|
|
||||||
edit(uid){
|
edit(uid) {
|
||||||
this.dialogConfig.data.action = EAction.UPDATE;
|
this.dialogConfig.data.action = EAction.UPDATE;
|
||||||
this.dialogConfig.data.ids = uid
|
this.dialogConfig.data.ids = uid
|
||||||
const dialogRef = this.dialog.open(DialogComponent,this.dialogConfig);
|
const dialogRef = this.dialog.open(DialogComponent, this.dialogConfig);
|
||||||
const edit$ = dialogRef.afterClosed().pipe(
|
const edit$ = dialogRef.afterClosed().pipe(
|
||||||
switchMap((res) => {
|
switchMap((res) => {
|
||||||
if(res === 'success'){
|
if (res === 'success') {
|
||||||
return this.kyc$ = this.kycService.getAll().pipe(
|
return this.kyc$ = this.kycService.getAll().pipe(
|
||||||
catchError((err) => {
|
catchError((err) => {
|
||||||
this.appService.message(EAction.ERROR, EText.ERROR);
|
this.appService.message(EAction.ERROR, EText.ERROR);
|
||||||
return throwError(() => err)
|
return throwError(() => err)
|
||||||
}),
|
}),
|
||||||
tap(() => this.cdr.detectChanges())
|
tap(() => this.cdr.detectChanges())
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
);
|
);
|
||||||
return edit$.subscribe();
|
return edit$.subscribe();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
onDelete(uid) {
|
||||||
|
// console.log(uid)
|
||||||
|
this.appService.confirm(
|
||||||
|
EAction.DELETE
|
||||||
|
).pipe(
|
||||||
|
filter(event => event.isConfirmed),
|
||||||
|
switchMap(event => {
|
||||||
|
return this.kycService.deleteData(uid).pipe(
|
||||||
|
concatMap(() => {
|
||||||
|
return this.kyc$ = this.kycService.getAll().pipe(
|
||||||
|
catchError((err) => {
|
||||||
|
this.appService.message(EAction.ERROR, EText.ERROR);
|
||||||
|
return throwError(() => err)
|
||||||
|
}),
|
||||||
|
tap(() => this.cdr.detectChanges())
|
||||||
|
)
|
||||||
|
})
|
||||||
|
)
|
||||||
|
})
|
||||||
|
).subscribe()
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,103 +1,182 @@
|
|||||||
<form [formGroup]="form" class="dialog-main form-dialog" autocomplete="off">
|
<form [formGroup]="form" class="dialog-main form-dialog" autocomplete="off">
|
||||||
<div class="dialog-main">
|
<div class="dialog-main">
|
||||||
<div class="dialog-header flex justify-between">
|
<div class="dialog-header flex justify-between">
|
||||||
<h2>More Detail</h2>
|
<h2>More Detail</h2>
|
||||||
<mat-icon mat-dialog-close class="cursor-pointer">clear</mat-icon>
|
<mat-icon mat-dialog-close class="cursor-pointer">clear</mat-icon>
|
||||||
</div>
|
|
||||||
<div class="dialog-body">
|
|
||||||
|
|
||||||
<div class="grid gap-2 md:grid-cols-12">
|
|
||||||
<div class="sm:col-span-12">
|
|
||||||
<div class="flex justify-center ">
|
|
||||||
<div class="overflow-hidden px-8 ">
|
|
||||||
|
|
||||||
<div class=" overflow-hidden">
|
|
||||||
<img class="h-56 w-full object-contain" [src]="form.value.image_front_url ? form.value.image_front_url : '/assets/images/no_image.webp'" alt=""
|
|
||||||
style="border: solid 1px #2D9CDB ;"
|
|
||||||
(click)="viewImg1(form.value.image_front_url)">
|
|
||||||
</div>
|
|
||||||
<div class="flex justify-center">ข้างหน้า</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div class="overflow-hidden px-8 ml-2">
|
|
||||||
<div class=" overflow-hidden">
|
|
||||||
<img class="h-56 w-full object-contain" [src]="form.value.image_back_url ? form.value.image_back_url : '/assets/images/no_image.webp'" alt=""
|
|
||||||
style="border: solid 1px #2D9CDB ;"
|
|
||||||
(click)="viewImg2(form.value.image_back_url)">
|
|
||||||
</div>
|
|
||||||
<div class="flex justify-center">ข้างหลัง</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
<div class="grid grid-cols-12 gap-4 md:gap-2 ">
|
|
||||||
<div class="col-span-full">
|
|
||||||
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
|
||||||
<mat-label
|
|
||||||
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">เลขประจำตัวประชาชน</mat-label>
|
|
||||||
<mat-form-field class="col-span-7">
|
|
||||||
<input matInput formControlName="id_card" readonly type="text">
|
|
||||||
</mat-form-field>
|
|
||||||
<span class="col-span-1"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-span-full">
|
|
||||||
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
|
||||||
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">ชื่อ -
|
|
||||||
นามสกุล</mat-label>
|
|
||||||
<mat-form-field class="col-span-7">
|
|
||||||
<input matInput formControlName="first_name" readonly type="text">
|
|
||||||
</mat-form-field>
|
|
||||||
<span class="col-span-1"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-span-full">
|
|
||||||
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
|
||||||
<mat-label
|
|
||||||
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">เกิดวันที่</mat-label>
|
|
||||||
<mat-form-field class="col-span-7">
|
|
||||||
<input matInput formControlName="birth_date" [matDatepicker]="birthdate" readonly />
|
|
||||||
<mat-datepicker-toggle [for]="birthdate" disabled matSuffix></mat-datepicker-toggle>
|
|
||||||
<mat-datepicker #birthdate></mat-datepicker>
|
|
||||||
</mat-form-field>
|
|
||||||
<span class="col-span-1"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-span-full">
|
|
||||||
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
|
||||||
<mat-label
|
|
||||||
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">วันบัตรหมดอายุ</mat-label>
|
|
||||||
<mat-form-field class="col-span-7">
|
|
||||||
<input matInput formControlName="exp_date" [matDatepicker]="expdate" readonly />
|
|
||||||
<mat-datepicker-toggle [for]="expdate" disabled matSuffix></mat-datepicker-toggle>
|
|
||||||
<mat-datepicker #expdate></mat-datepicker>
|
|
||||||
</mat-form-field>
|
|
||||||
<span class="col-span-1"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="col-span-full">
|
|
||||||
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
|
||||||
<mat-label
|
|
||||||
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">เลขหลังบัตร</mat-label>
|
|
||||||
<mat-form-field class="col-span-7">
|
|
||||||
<input matInput formControlName="code_back_card" readonly type="text">
|
|
||||||
</mat-form-field>
|
|
||||||
<span class="col-span-1"></span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="dialog-footer">
|
|
||||||
<button type="submit" mat-raised-button class="btn btn-green cursor-pointer"
|
|
||||||
(click)="status(true)">Approve</button>
|
|
||||||
<button type="button" class="btn btn-red" (click)="status(false)">Reject</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="dialog-body">
|
||||||
|
|
||||||
|
<div class="grid gap-2 md:grid-cols-12">
|
||||||
|
<div class="sm:col-span-12">
|
||||||
|
<div class="flex justify-center ">
|
||||||
|
<div class="overflow-hidden px-8 ">
|
||||||
|
|
||||||
|
<div class=" overflow-hidden">
|
||||||
|
<img class="h-56 w-full object-contain"
|
||||||
|
[src]="form.value.image_front_url ? form.value.image_front_url : 'assets/images/no_image.webp'"
|
||||||
|
alt="" style="border: solid 1px #2D9CDB ;" (click)="viewImg1(form.value.image_front_url)">
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-center">ข้างหน้า</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="overflow-hidden px-8 ml-2">
|
||||||
|
<div class=" overflow-hidden">
|
||||||
|
<img class="h-56 w-full object-contain"
|
||||||
|
[src]="form.value.image_back_url ? form.value.image_back_url : 'assets/images/no_image.webp'" alt=""
|
||||||
|
style="border: solid 1px #2D9CDB ;" (click)="viewImg2(form.value.image_back_url)">
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-center">ข้างหลัง</div>
|
||||||
|
</div>
|
||||||
|
<div class="overflow-hidden px-8 ml-2">
|
||||||
|
<div class=" overflow-hidden">
|
||||||
|
<img class="h-56 w-full object-contain"
|
||||||
|
[src]="form.value.image_person_with_card_url ? form.value.image_person_with_card_url : 'assets/images/no_image.webp'"
|
||||||
|
alt="" style="border: solid 1px #2D9CDB ;" (click)="viewImg2(form.value.image_person_with_card_url)">
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-center">รูปถ่ายคู่กับบัตร</div>
|
||||||
|
</div>
|
||||||
|
<div class="overflow-hidden px-8 ml-2">
|
||||||
|
<div class=" overflow-hidden">
|
||||||
|
<img class="h-56 w-full object-contain"
|
||||||
|
[src]="form.value.signature_url ? form.value.signature_url : 'assets/images/no_image.webp'" alt=""
|
||||||
|
style="border: solid 1px #2D9CDB ;" (click)="viewImg2(form.value.signature_url)">
|
||||||
|
</div>
|
||||||
|
<div class="flex justify-center">ลายเซ็น</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<br>
|
||||||
|
<div class="grid grid-cols-12 gap-4 md:gap-2 ">
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label
|
||||||
|
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">เลขประจำตัวประชาชน</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="id_card" readonly type="text">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">ชื่อ -
|
||||||
|
นามสกุล</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="first_name" readonly type="text">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">สัญชาติ</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="nationality" readonly type="text">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">เกิดวันที่</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="birth_date" [matDatepicker]="birthdate" readonly />
|
||||||
|
<mat-datepicker-toggle [for]="birthdate" disabled matSuffix></mat-datepicker-toggle>
|
||||||
|
<mat-datepicker #birthdate></mat-datepicker>
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label
|
||||||
|
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">ที่อยู่ปัจจุบัน</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="current_address" readonly type="text">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">อาชีพ</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="occupation" readonly type="text">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label
|
||||||
|
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">ชื่อสถานที่ทำงาน</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="name_of_workplace" readonly type="text">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label
|
||||||
|
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">ที่อยู่ที่ทำงาน</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="work_address" readonly type="text">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label
|
||||||
|
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">ที่อยู่ตามบัตรประชาชน</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="address_according_id_card" readonly type="text">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label
|
||||||
|
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">วันบัตรหมดอายุ</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="exp_date" [matDatepicker]="expdate" readonly />
|
||||||
|
<mat-datepicker-toggle [for]="expdate" disabled matSuffix></mat-datepicker-toggle>
|
||||||
|
<mat-datepicker #expdate></mat-datepicker>
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">เลขหลังบัตร</mat-label>
|
||||||
|
<mat-form-field class="col-span-7">
|
||||||
|
<input matInput formControlName="code_back_card" readonly type="text">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="dialog-footer">
|
||||||
|
<button type="submit" mat-raised-button class="btn btn-green cursor-pointer"
|
||||||
|
(click)="status(true)">Approve</button>
|
||||||
|
<button type="button" class="btn btn-red" (click)="status(false)">Reject</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
|
||||||
<!-- <pre>{{form.getRawValue() | json}}</pre> -->
|
<!-- <pre>{{form.getRawValue() | json}}</pre> -->
|
||||||
@@ -17,81 +17,91 @@ import { KycService } from 'src/app/core/service/common/kyc.service';
|
|||||||
})
|
})
|
||||||
export class DialogComponent extends BaseForm implements OnInit {
|
export class DialogComponent extends BaseForm implements OnInit {
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
public dialogRef: MatDialogRef<DialogComponent>,
|
public dialogRef: MatDialogRef<DialogComponent>,
|
||||||
@Inject(MAT_DIALOG_DATA) public dialog: IDialogConfigData,
|
@Inject(MAT_DIALOG_DATA) public dialog: IDialogConfigData,
|
||||||
public router: Router,
|
public router: Router,
|
||||||
public activatedRoute: ActivatedRoute,
|
public activatedRoute: ActivatedRoute,
|
||||||
public fb: FormBuilder,
|
public fb: FormBuilder,
|
||||||
public location: Location,
|
public location: Location,
|
||||||
public kycService: KycService,
|
public kycService: KycService,
|
||||||
public appService: AppService,
|
public appService: AppService,
|
||||||
public cdr: ChangeDetectorRef
|
public cdr: ChangeDetectorRef
|
||||||
) {
|
) {
|
||||||
super(router, activatedRoute, fb, location)
|
super(router, activatedRoute, fb, location)
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
if (this.dialog.action === EAction.UPDATE){
|
if (this.dialog.action === EAction.UPDATE) {
|
||||||
this.state = 'edit';
|
this.state = 'edit';
|
||||||
this.getData();
|
this.getData();
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
createForm(): FormGroup<any> {
|
createForm(): FormGroup<any> {
|
||||||
return this.fb.group({
|
return this.fb.group({
|
||||||
kyc_uid: null,
|
kyc_uid: null,
|
||||||
id_card: null,
|
id_card: null,
|
||||||
code_back_card: null,
|
code_back_card: null,
|
||||||
exp_date: null,
|
current_address: null,
|
||||||
prefix_name: null,
|
exp_date: null,
|
||||||
first_name: null,
|
prefix_name: null,
|
||||||
last_name: null,
|
first_name: null,
|
||||||
birth_date: [null],
|
last_name: null,
|
||||||
phone: [null],
|
birth_date: [null],
|
||||||
email: null,
|
phone: [null],
|
||||||
image_front_url: [null],
|
email: null,
|
||||||
image_back_url: [null],
|
image_front_url: [null],
|
||||||
is_pass: null,
|
image_back_url: [null],
|
||||||
status_id: [null],
|
is_pass: null,
|
||||||
created_by: null,
|
status_id: [null],
|
||||||
created_datetime: null,
|
created_by: null,
|
||||||
updated_by: null,
|
created_datetime: null,
|
||||||
updated_datetime: null,
|
updated_by: null,
|
||||||
owner_agency_uid: null
|
updated_datetime: null,
|
||||||
})
|
owner_agency_uid: null,
|
||||||
}
|
occupation: null,
|
||||||
|
additional_occupation: null,
|
||||||
|
nationality: null,
|
||||||
|
max_card_no: null,
|
||||||
|
name_of_workplace: null,
|
||||||
|
work_address: null,
|
||||||
|
signature_url: null,
|
||||||
|
image_person_with_card_url: null,
|
||||||
|
address_according_id_card: null
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
getData() {
|
getData() {
|
||||||
if (!this.dialog.ids) this.appService.message(EAction.INFO, EText.NO_DATA);
|
if (!this.dialog.ids) this.appService.message(EAction.INFO, EText.NO_DATA);
|
||||||
return this.kycService.get(this.dialog.ids).pipe(
|
return this.kycService.get(this.dialog.ids).pipe(
|
||||||
tap((res) => this.form.patchValue(res)),
|
tap((res) => this.form.patchValue(res)),
|
||||||
tap(() => this.cdr.detectChanges()),
|
tap(() => this.cdr.detectChanges()),
|
||||||
catchError((err) => {
|
catchError((err) => {
|
||||||
this.appService.message(EAction.ERROR, EText.ERROR);
|
this.appService.message(EAction.ERROR, EText.ERROR);
|
||||||
return throwError(() => err)
|
return throwError(() => err)
|
||||||
})
|
})
|
||||||
).subscribe()
|
).subscribe()
|
||||||
}
|
}
|
||||||
|
|
||||||
status(isApprove: boolean){
|
status(isApprove: boolean) {
|
||||||
const form = this.form.getRawValue();
|
const form = this.form.getRawValue();
|
||||||
form.is_pass = isApprove;
|
form.is_pass = isApprove;
|
||||||
const save$ = this.kycService.update2(form)
|
const save$ = this.kycService.update2(form)
|
||||||
return save$.pipe(
|
return save$.pipe(
|
||||||
tap(() => this.appService.message(EAction.SUCCESS, EText.UPDATE)),
|
tap(() => this.appService.message(EAction.SUCCESS, EText.UPDATE)),
|
||||||
tap(() => this.dialogRef.close('success')),
|
tap(() => this.dialogRef.close('success')),
|
||||||
catchError((err) => {
|
catchError((err) => {
|
||||||
this.appService.message(EAction.ERROR, EText.ERROR);
|
this.appService.message(EAction.ERROR, EText.ERROR);
|
||||||
return throwError(() => err)
|
return throwError(() => err)
|
||||||
})
|
})
|
||||||
).subscribe()
|
).subscribe()
|
||||||
}
|
}
|
||||||
|
|
||||||
viewImg1(url){
|
viewImg1(url) {
|
||||||
window.open(url)
|
window.open(url)
|
||||||
}
|
}
|
||||||
viewImg2(url){
|
viewImg2(url) {
|
||||||
window.open(url)
|
window.open(url)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,105 +1,122 @@
|
|||||||
<div class="card card-table">
|
<div class="card card-table">
|
||||||
|
|
||||||
<div class="card-filter text-right">
|
<div class="card-filter text-right">
|
||||||
<div class="card-filter-section grid grid-cols-12 gap-4 md:gap-2 items-center">
|
<div class="card-filter-section grid grid-cols-12 gap-4 md:gap-2 items-center">
|
||||||
<div class="col-span-3 md:col-span-5 md:order-2">
|
<div class="col-span-3 md:col-span-5 md:order-2">
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<i matTextPrefix class="bi bi-search"></i>
|
<i matTextPrefix class="bi bi-search"></i>
|
||||||
<input matInput placeholder="เลขบัตรประชาชน/เลขหลังบัตร" [(ngModel)]="query.card" (ngModelChange)="onFilterCard($event)">
|
<input matInput placeholder="เลขบัตรประชาชน/เลขหลังบัตร" [(ngModel)]="query.card"
|
||||||
</mat-form-field>
|
(ngModelChange)="onFilterCard($event)">
|
||||||
</div>
|
</mat-form-field>
|
||||||
<div class="col-span-5 md:col-span-7 md:order-2">
|
</div>
|
||||||
<mat-form-field>
|
<div class="col-span-5 md:col-span-7 md:order-2">
|
||||||
<i matTextPrefix class="bi bi-search"></i>
|
<mat-form-field>
|
||||||
<input matInput placeholder="ชื่อ-นามสกุล" [(ngModel)]="query.name" (ngModelChange)="onFilterName($event)">
|
<i matTextPrefix class="bi bi-search"></i>
|
||||||
</mat-form-field>
|
<input matInput placeholder="ชื่อ-นามสกุล" [(ngModel)]="query.name" (ngModelChange)="onFilterName($event)">
|
||||||
</div>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<div class="table-wrap">
|
<div class="table-wrap">
|
||||||
<table class="" mat-table [dataSource]="kycList" matSort>
|
<table class="" mat-table [dataSource]="kycList" matSort>
|
||||||
<tr mat-header-row *matHeaderRowDef="['1','2','3','4','6','8','9','10','11','12']"></tr>
|
<tr mat-header-row *matHeaderRowDef="header"></tr>
|
||||||
<tr mat-row *matRowDef="let row; columns: ['1','2','3','4','6','8','9','10','11','12'];"></tr>
|
<tr mat-row *matRowDef="let row; columns: header;"></tr>
|
||||||
|
|
||||||
<ng-container matColumnDef="1">
|
<ng-container matColumnDef="1">
|
||||||
<th mat-header-cell *matHeaderCellDef class="tac">ลำดับ</th>
|
<th mat-header-cell *matHeaderCellDef class="tac">ลำดับ</th>
|
||||||
<td mat-cell *matCellDef="let item; let i = index;" width="100" class="tac">{{getIndex(i)}}</td>
|
<td mat-cell *matCellDef="let item; let i = index;" width="100" class="tac">{{getIndex(i)}}</td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
<ng-container matColumnDef="2">
|
|
||||||
<th mat-header-cell *matHeaderCellDef class="tac">เลขบัตรประชาชน</th>
|
|
||||||
<td mat-cell *matCellDef="let item" class="tac" style="min-width: 200px;">
|
|
||||||
{{item.id_card}}
|
|
||||||
</td>
|
|
||||||
</ng-container>
|
|
||||||
|
|
||||||
<ng-container matColumnDef="3">
|
|
||||||
<th mat-header-cell *matHeaderCellDef class="tac" width="200">เลขหลังบัตร</th>
|
|
||||||
<td mat-cell *matCellDef="let item" class="tac whitespace-nowrap">{{item.code_back_card}}</td>
|
|
||||||
</ng-container>
|
|
||||||
|
|
||||||
<ng-container matColumnDef="4">
|
<ng-container matColumnDef="2">
|
||||||
<th mat-header-cell *matHeaderCellDef class="tal" width="150">วันหมดอายุ</th>
|
<th mat-header-cell *matHeaderCellDef class="tac">เลขบัตรประชาชน</th>
|
||||||
<td mat-cell *matCellDef="let item" class="whitespace-nowrap">{{item.exp_date | thaidate}}</td>
|
<td mat-cell *matCellDef="let item" class="tac" style="min-width: 200px;">
|
||||||
</ng-container>
|
{{item.id_card}}
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
<ng-container matColumnDef="5">
|
<ng-container matColumnDef="3">
|
||||||
<th mat-header-cell *matHeaderCellDef class="tac" width="100">คำนำหน้า</th>
|
<th mat-header-cell *matHeaderCellDef class="tac" width="200">เลขหลังบัตร</th>
|
||||||
<td mat-cell *matCellDef="let item" class="tac">{{item.prefix_name}}</td>
|
<td mat-cell *matCellDef="let item" class="tac whitespace-nowrap">{{item.code_back_card}}</td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
<ng-container matColumnDef="6">
|
<ng-container matColumnDef="4">
|
||||||
<th mat-header-cell *matHeaderCellDef class="tal" width="200">ชื่อ - นามสกุล</th>
|
<th mat-header-cell *matHeaderCellDef class="tal" width="150">วันหมดอายุ</th>
|
||||||
<td mat-cell *matCellDef="let item" class="text-ellipsis whitespace-nowrap">
|
<td mat-cell *matCellDef="let item" class="whitespace-nowrap">{{item.exp_date | thaidate}}</td>
|
||||||
{{item.first_name}}
|
</ng-container>
|
||||||
</td>
|
|
||||||
</ng-container>
|
|
||||||
|
|
||||||
<ng-container matColumnDef="7">
|
<ng-container matColumnDef="5">
|
||||||
<th mat-header-cell *matHeaderCellDef class="tal" width="200">นามสกุล</th>
|
<th mat-header-cell *matHeaderCellDef class="tac" width="100">คำนำหน้า</th>
|
||||||
<td mat-cell *matCellDef="let item" class="whitespace-nowrap">{{item.last_name}}</td>
|
<td mat-cell *matCellDef="let item" class="tac">{{item.prefix_name}}</td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
<ng-container matColumnDef="8">
|
<ng-container matColumnDef="6">
|
||||||
<th mat-header-cell *matHeaderCellDef class="tal" width="150">วัน เดือน ปีเกิด</th>
|
<th mat-header-cell *matHeaderCellDef class="tal" width="200">ชื่อ - นามสกุล</th>
|
||||||
<td mat-cell *matCellDef="let item" class="whitespace-nowrap">
|
<td mat-cell *matCellDef="let item" class="text-ellipsis whitespace-nowrap">
|
||||||
<div> {{item.birth_date | thaidate}}</div>
|
{{item.first_name}}
|
||||||
</td>
|
</td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container matColumnDef="9">
|
|
||||||
<th mat-header-cell *matHeaderCellDef class="tal" width="150">เบอร์โทรศัพท์</th>
|
<ng-container matColumnDef="7">
|
||||||
<td mat-cell *matCellDef="let item" class="">
|
<th mat-header-cell *matHeaderCellDef class="tal" width="200">นามสกุล</th>
|
||||||
<div> {{item.phone}}</div>
|
<td mat-cell *matCellDef="let item" class="whitespace-nowrap">{{item.last_name}}</td>
|
||||||
</td>
|
</ng-container>
|
||||||
</ng-container>
|
|
||||||
<ng-container matColumnDef="10">
|
<ng-container matColumnDef="8">
|
||||||
<th mat-header-cell *matHeaderCellDef class="tal" width="150">E-mail</th>
|
<th mat-header-cell *matHeaderCellDef class="tal" width="150">วัน เดือน ปีเกิด</th>
|
||||||
<td mat-cell *matCellDef="let item" class="tal whitespace-nowrap">
|
<td mat-cell *matCellDef="let item" class="whitespace-nowrap">
|
||||||
<div> {{item.email}}</div>
|
<div> {{item.birth_date | thaidate}}</div>
|
||||||
</td>
|
</td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
<ng-container matColumnDef="11">
|
<ng-container matColumnDef="9">
|
||||||
<th mat-header-cell *matHeaderCellDef class="tac" width="150">More Detail</th>
|
<th mat-header-cell *matHeaderCellDef class="tal" width="150">เบอร์โทรศัพท์</th>
|
||||||
<td mat-cell *matCellDef="let item" class="tac">
|
<td mat-cell *matCellDef="let item" class="">
|
||||||
<div class="action flex justify-center">
|
<div> {{item.phone}}</div>
|
||||||
<div class="item cursor-pointer">
|
</td>
|
||||||
<i class="bi bi-pencil-square icon-edit mr-2" (click)="onEdit(item.kyc_uid)"></i>
|
</ng-container>
|
||||||
</div>
|
<ng-container matColumnDef="10">
|
||||||
</div>
|
<th mat-header-cell *matHeaderCellDef class="tal" width="150">E-mail</th>
|
||||||
</td>
|
<td mat-cell *matCellDef="let item" class="tal whitespace-nowrap">
|
||||||
</ng-container>
|
<div> {{item.email}}</div>
|
||||||
<ng-container matColumnDef="12">
|
</td>
|
||||||
<th mat-header-cell *matHeaderCellDef class="tac" width="150">สถานะ</th>
|
</ng-container>
|
||||||
<td mat-cell *matCellDef="let item" class="tac">
|
|
||||||
<div *ngIf="item.is_pass == true" class="status status-active">Approve</div>
|
<ng-container matColumnDef="register_no">
|
||||||
<div *ngIf="item.is_pass == false" class="status status-disabled">Reject</div>
|
<th mat-header-cell *matHeaderCellDef class="tal" width="150">เลขสมาชิก</th>
|
||||||
</td>
|
<td mat-cell *matCellDef="let item" class="tal whitespace-nowrap">
|
||||||
</ng-container>
|
<div>{{item.max_card_no}} </div>
|
||||||
</table>
|
</td>
|
||||||
</div>
|
</ng-container>
|
||||||
<!-- <div *ngIf="dataSourceCount === 0" class="no-data"></div> -->
|
<ng-container matColumnDef="create_date">
|
||||||
<mat-paginator [pageSizeOptions]="[5,10,20]" showFirstLastButtons></mat-paginator>
|
<th mat-header-cell *matHeaderCellDef class="tal" width="150">วันที่สมัคร</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tal whitespace-nowrap">
|
||||||
|
<div> {{item.created_datetime | thaidate}}</div>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
<ng-container matColumnDef="11">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac" width="150">More Detail</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tac">
|
||||||
|
<div class="action flex justify-center">
|
||||||
|
<div class="item cursor-pointer">
|
||||||
|
<i class="bi bi-pencil-square icon-edit mr-2" (click)="onEdit(item.kyc_uid)"></i>
|
||||||
|
<i class="bi bi-trash3 icon-delete mr-2" (click)="onDeleteKyc(item.kyc_uid)"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
<ng-container matColumnDef="12">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac" width="150">สถานะ</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tac">
|
||||||
|
<div *ngIf="item.is_pass == true" class="status status-active">Approve</div>
|
||||||
|
<div *ngIf="item.is_pass == false" class="status status-disabled">Reject</div>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- <div *ngIf="dataSourceCount === 0" class="no-data"></div> -->
|
||||||
|
<mat-paginator [pageSizeOptions]="[5,10,20]" showFirstLastButtons></mat-paginator>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -3,49 +3,57 @@ import { Subject, debounceTime, distinctUntilChanged } from 'rxjs';
|
|||||||
import { BaseList } from 'src/app/core/base/base-list';
|
import { BaseList } from 'src/app/core/base/base-list';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-list',
|
selector: 'app-list',
|
||||||
templateUrl: './list.component.html',
|
templateUrl: './list.component.html',
|
||||||
styleUrls: ['./list.component.scss']
|
styleUrls: ['./list.component.scss']
|
||||||
})
|
})
|
||||||
export class ListComponent extends BaseList implements OnChanges {
|
export class ListComponent extends BaseList implements OnChanges {
|
||||||
@Input() kycList: any = [];
|
@Input() kycList: any = [];
|
||||||
@Output() edit = new EventEmitter();
|
@Output() edit = new EventEmitter();
|
||||||
@Output() search = new EventEmitter();
|
@Output() search = new EventEmitter();
|
||||||
query = {
|
@Output() OnDelete = new EventEmitter<string>()
|
||||||
name: null,
|
query = {
|
||||||
card: null
|
name: null,
|
||||||
}
|
card: null
|
||||||
name: string;
|
}
|
||||||
filterCard: Subject<string> = new Subject<string>();
|
name: string;
|
||||||
constructor() {
|
filterCard: Subject<string> = new Subject<string>();
|
||||||
super()
|
|
||||||
this.filterCard.pipe(
|
|
||||||
debounceTime(500),
|
|
||||||
distinctUntilChanged()
|
|
||||||
).subscribe(() => this.onSearch())
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnChanges(): void {
|
header = ['1', 'create_date', '2', '3', '4', '6', '8', '9', '10', 'register_no', '11', '12']
|
||||||
this.kycList = this.updateMatTable(this.kycList? this.kycList:[])
|
constructor() {
|
||||||
}
|
super()
|
||||||
|
this.filterCard.pipe(
|
||||||
|
debounceTime(500),
|
||||||
|
distinctUntilChanged()
|
||||||
|
).subscribe(() => this.onSearch())
|
||||||
|
}
|
||||||
|
|
||||||
onEdit(uid){
|
ngOnChanges(): void {
|
||||||
this.edit.emit(uid)
|
this.kycList = this.updateMatTable(this.kycList ? this.kycList : [])
|
||||||
}
|
}
|
||||||
|
|
||||||
onFilterCard($event) {
|
onEdit(uid) {
|
||||||
const filterValue = this.query.card;
|
this.edit.emit(uid)
|
||||||
this.kycList.filter = filterValue.trim().toLowerCase();
|
}
|
||||||
}
|
|
||||||
|
|
||||||
onFilterName($event){
|
onDeleteKyc(uid: string) {
|
||||||
const filterValue = this.query.name;
|
// console.log(uid)
|
||||||
this.kycList.filter = filterValue.trim().toLowerCase();
|
this.OnDelete.emit(uid)
|
||||||
}
|
}
|
||||||
|
|
||||||
onSearch(){
|
onFilterCard($event) {
|
||||||
const filterValue = this.query.card;
|
const filterValue = this.query.card;
|
||||||
this.kycList.filter = filterValue.trim().toLowerCase();
|
this.kycList.filter = filterValue.trim().toLowerCase();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onFilterName($event) {
|
||||||
|
const filterValue = this.query.name;
|
||||||
|
this.kycList.filter = filterValue.trim().toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
onSearch() {
|
||||||
|
const filterValue = this.query.card;
|
||||||
|
this.kycList.filter = filterValue.trim().toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,3 @@
|
|||||||
|
<app-user-list [userList]="userList$ | async" (edit)="edit($event)" (OnDeleteUser)="onDeleteUser($event)">
|
||||||
|
|
||||||
|
</app-user-list>
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { UsersContainer } from './users.container';
|
||||||
|
|
||||||
|
describe('UsersContainer', () => {
|
||||||
|
let component: UsersContainer;
|
||||||
|
let fixture: ComponentFixture<UsersContainer>;
|
||||||
|
|
||||||
|
beforeEach(async () => {
|
||||||
|
await TestBed.configureTestingModule({
|
||||||
|
declarations: [ UsersContainer ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
|
||||||
|
fixture = TestBed.createComponent(UsersContainer);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -0,0 +1,57 @@
|
|||||||
|
import { ChangeDetectorRef, Component } from '@angular/core';
|
||||||
|
import { catchError, filter, Observable, switchMap, tap, throwError } from 'rxjs';
|
||||||
|
import { IDialogConfig, CDialogConfig } from 'src/app/@common/interface/Dialog';
|
||||||
|
import { EAction, EText } from 'src/app/@config/app';
|
||||||
|
import { SathonCathayPayService } from 'src/app/sathon-cathay-pay.service';
|
||||||
|
import { DialogComponent } from '../../../kyc/presenter/dialog/dialog.component';
|
||||||
|
import { MatDialog } from '@angular/material/dialog';
|
||||||
|
import { AppService } from 'src/app/app.service';
|
||||||
|
import { ModalComponent } from '../../presenter/modal/modal.component';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-users',
|
||||||
|
templateUrl: './users.container.html',
|
||||||
|
styleUrls: ['./users.container.scss']
|
||||||
|
})
|
||||||
|
export class UsersContainer {
|
||||||
|
userList$ = new Observable()
|
||||||
|
dialogConfig: IDialogConfig = CDialogConfig
|
||||||
|
constructor(
|
||||||
|
private sathonSV: SathonCathayPayService,
|
||||||
|
private dialog: MatDialog,
|
||||||
|
private appSV: AppService,
|
||||||
|
private cdr: ChangeDetectorRef
|
||||||
|
) {
|
||||||
|
this.userList$ = this.sathonSV.getAllUsers()
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
edit(user) {
|
||||||
|
this.dialogConfig.data.action = EAction.UPDATE;
|
||||||
|
this.dialogConfig.data = user
|
||||||
|
const dialogRef = this.dialog.open(ModalComponent, this.dialogConfig);
|
||||||
|
dialogRef.afterClosed().pipe(
|
||||||
|
filter(isRefresh => isRefresh),
|
||||||
|
tap(() => {
|
||||||
|
this.userList$ = this.sathonSV.getAllUsers()
|
||||||
|
this.cdr.detectChanges()
|
||||||
|
})
|
||||||
|
).subscribe()
|
||||||
|
}
|
||||||
|
|
||||||
|
onDeleteUser(user) {
|
||||||
|
this.appSV.confirm(EAction.DELETE).pipe(
|
||||||
|
filter(r => r.isConfirmed),
|
||||||
|
switchMap(() => this.sathonSV.deleteUser(user.id)),
|
||||||
|
tap(() => {
|
||||||
|
this.userList$ = this.sathonSV.getAllUsers()
|
||||||
|
this.cdr.detectChanges()
|
||||||
|
}),
|
||||||
|
catchError(err => {
|
||||||
|
this.appSV.message('error', 'เกิดข้อผิดพลาด')
|
||||||
|
return throwError(err)
|
||||||
|
})
|
||||||
|
).subscribe()
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,82 @@
|
|||||||
|
<form class="dialog-main form-dialog" autocomplete="off">
|
||||||
|
<div class="dialog-main">
|
||||||
|
<div class="dialog-header flex justify-between">
|
||||||
|
<h2>More Detail</h2>
|
||||||
|
<mat-icon mat-dialog-close class="cursor-pointer">clear</mat-icon>
|
||||||
|
</div>
|
||||||
|
<div class="dialog-body">
|
||||||
|
<div class="grid grid-cols-12 gap-4 md:gap-2 ">
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label
|
||||||
|
class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">เลขประจำตัวประชาชน</mat-label>
|
||||||
|
<mat-form-field class="col-span-3">
|
||||||
|
<input matInput required type="text" [value]="dialog?.personalCardId" readonly>
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">ชื่อ นามสกุล</mat-label>
|
||||||
|
<mat-form-field class="col-span-3">
|
||||||
|
<input matInput required type="text" readonly [value]="dialog?.fullName">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-5"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">Username</mat-label>
|
||||||
|
<mat-form-field class="col-span-3">
|
||||||
|
<input matInput required type="text" readonly [value]="dialog?.userName">
|
||||||
|
</mat-form-field>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">เบอร์โทร</mat-label>
|
||||||
|
<mat-form-field class="col-span-3">
|
||||||
|
<input matInput required type="text" readonly [value]="dialog?.phoneNumber">
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">อีเมล</mat-label>
|
||||||
|
<mat-form-field class="col-span-3">
|
||||||
|
<input matInput required type="text" readonly [value]="dialog?.normalizedEmail">
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4">Lock/Unlock</mat-label>
|
||||||
|
<mat-slide-toggle [checked]="dialog.lockoutEnabled" (change)="changeUserLock($event)"></mat-slide-toggle>
|
||||||
|
<span class="col-span-1"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="col-span-full">
|
||||||
|
<div class="lg:flex lg:flex-col grid grid-cols-9 gap-2">
|
||||||
|
<mat-label class="col-span-1 lg:text-left lg:self-auto text-right self-center mr-4"></mat-label>
|
||||||
|
<button mat-raised-button class="btn btn-submit" (click)="save()">
|
||||||
|
<div style="white-space: nowrap;"> User เป็น Merchant</div>
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<!-- <pre>{{form.getRawValue() | json}}</pre> -->
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { ModalComponent } from './modal.component';
|
||||||
|
|
||||||
|
describe('ModalComponent', () => {
|
||||||
|
let component: ModalComponent;
|
||||||
|
let fixture: ComponentFixture<ModalComponent>;
|
||||||
|
|
||||||
|
beforeEach(async () => {
|
||||||
|
await TestBed.configureTestingModule({
|
||||||
|
declarations: [ ModalComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
|
||||||
|
fixture = TestBed.createComponent(ModalComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -0,0 +1,70 @@
|
|||||||
|
import { ChangeDetectorRef, Component, Inject, OnInit } from '@angular/core';
|
||||||
|
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
|
||||||
|
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
|
||||||
|
import { Router, ActivatedRoute } from '@angular/router';
|
||||||
|
import { tap, catchError, throwError, lastValueFrom, filter, switchMap } from 'rxjs';
|
||||||
|
import { IDialogConfigData } from 'src/app/@common/interface/Dialog';
|
||||||
|
import { EAction, EText } from 'src/app/@config/app';
|
||||||
|
import { AppService } from 'src/app/app.service';
|
||||||
|
import { BaseForm } from 'src/app/core/base/base-form';
|
||||||
|
import { PromotionService } from 'src/app/core/service/common/promotion.service';
|
||||||
|
import { UploadService } from 'src/app/core/service/common/upload.service';
|
||||||
|
import { DialogComponent } from '../../../kyc/presenter/dialog/dialog.component';
|
||||||
|
import { Location } from '@angular/common';
|
||||||
|
import { SathonCathayPayService } from 'src/app/sathon-cathay-pay.service';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-modal',
|
||||||
|
templateUrl: './modal.component.html',
|
||||||
|
styleUrls: ['./modal.component.scss']
|
||||||
|
})
|
||||||
|
export class ModalComponent implements OnInit {
|
||||||
|
IsRefresh: boolean = false
|
||||||
|
constructor(
|
||||||
|
public dialogRef: MatDialogRef<DialogComponent>,
|
||||||
|
@Inject(MAT_DIALOG_DATA) public dialog: any,
|
||||||
|
private sathonSV: SathonCathayPayService,
|
||||||
|
private appsv: AppService
|
||||||
|
) { }
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
}
|
||||||
|
|
||||||
|
changeUserLock({ checked },) {
|
||||||
|
let userId = this.dialog.id
|
||||||
|
console.log(checked)
|
||||||
|
const msg = checked ? 'Unlock' : 'Lock'
|
||||||
|
this.sathonSV.lockUnlockUser(userId).pipe(
|
||||||
|
tap(event => {
|
||||||
|
this.appsv.message(EAction.SUCCESS, `${msg} สำเร็จแล้ว`)
|
||||||
|
this.IsRefresh = true
|
||||||
|
}),
|
||||||
|
tap(() => this.closeDialog()),
|
||||||
|
catchError(err => {
|
||||||
|
this.IsRefresh = false
|
||||||
|
return throwError(err)
|
||||||
|
})
|
||||||
|
).subscribe()
|
||||||
|
}
|
||||||
|
|
||||||
|
save() {
|
||||||
|
let userId = this.dialog.id
|
||||||
|
this.appsv.confirm(EAction.UPDATE).pipe(
|
||||||
|
filter(r => r.isConfirmed),
|
||||||
|
switchMap(() => this.sathonSV.convertToCoperate(userId)),
|
||||||
|
tap(() => this.IsRefresh = true),
|
||||||
|
tap(() => this.closeDialog()),
|
||||||
|
catchError(err => {
|
||||||
|
this.IsRefresh = false
|
||||||
|
this.appsv.message('error', 'เกิดข้อผิดพลาด')
|
||||||
|
return throwError(err)
|
||||||
|
})
|
||||||
|
).subscribe()
|
||||||
|
// this.sathonSV.convertToCoperate(userId).subscribe()
|
||||||
|
}
|
||||||
|
|
||||||
|
closeDialog() {
|
||||||
|
this.dialogRef.close(this.IsRefresh)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
@@ -0,0 +1,85 @@
|
|||||||
|
<div class="card card-table">
|
||||||
|
|
||||||
|
<div class="card-filter text-right">
|
||||||
|
<div class="card-filter-section grid grid-cols-12 gap-4 md:gap-2 items-center">
|
||||||
|
<div class="col-span-3 md:col-span-5 md:order-2">
|
||||||
|
<mat-form-field>
|
||||||
|
<i matTextPrefix class="bi bi-search"></i>
|
||||||
|
<input matInput placeholder="เลขบัตรประชาชน/เลขหลังบัตร" [(ngModel)]="query.card"
|
||||||
|
(ngModelChange)="onFilterCard($event)">
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
<div class="col-span-5 md:col-span-7 md:order-2">
|
||||||
|
<mat-form-field>
|
||||||
|
<i matTextPrefix class="bi bi-search"></i>
|
||||||
|
<input matInput placeholder="ชื่อ-นามสกุล" [(ngModel)]="query.name" (ngModelChange)="onFilterName($event)">
|
||||||
|
</mat-form-field>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="card-body">
|
||||||
|
<div class="table-wrap">
|
||||||
|
<table class="" mat-table [dataSource]="userList" matSort>
|
||||||
|
<tr mat-header-row *matHeaderRowDef="userListKey"></tr>
|
||||||
|
<tr mat-row *matRowDef="let row; columns: userListKey;"></tr>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="1">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac">ลำดับ</th>
|
||||||
|
<td mat-cell *matCellDef="let item; let i = index;" width="100" class="tac">{{getIndex(i)}}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- <ng-container matColumnDef="personalCardId">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac">เลขบัตรประชาชน</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tac" style="min-width: 200px;">
|
||||||
|
{{item.personalCardId}}
|
||||||
|
</td>
|
||||||
|
</ng-container> -->
|
||||||
|
|
||||||
|
<ng-container matColumnDef="fullName">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac" width="200">ชื่อ นามสกุล</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tac whitespace-nowrap">{{item.fullName}}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="userName">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tal" width="150">ชื่อยูเซอร์</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="whitespace-nowrap">{{item.userName }}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="email">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac" width="100">อีเมล</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tac">{{item.email}}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="phoneNumber">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac" width="100">เบอร์โทรศัพท์</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tac">{{item.phoneNumber}}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="userType">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac" width="100">ประเภทผู้ใช้งาน</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tac">{{item.userType}}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="id">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac" width="100">ไอดี</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tac">{{item.id}}</td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<ng-container matColumnDef="action">
|
||||||
|
<th mat-header-cell *matHeaderCellDef class="tac" width="150">More Detail</th>
|
||||||
|
<td mat-cell *matCellDef="let item" class="tac">
|
||||||
|
<div class="action flex justify-center">
|
||||||
|
<div class="item cursor-pointer">
|
||||||
|
<i class="bi bi-pencil-square icon-edit mr-2" (click)="onEdit(item)"></i>
|
||||||
|
<i class="bi bi-trash3 icon-delete mr-2" (click)="onDeleteUser(item)"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</ng-container>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<!-- <div *ngIf="dataSourceCount === 0" class="no-data"></div> -->
|
||||||
|
<mat-paginator [pageSizeOptions]="[5,10,20]" showFirstLastButtons></mat-paginator>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
@@ -0,0 +1,23 @@
|
|||||||
|
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { UserListComponent } from './user-list.component';
|
||||||
|
|
||||||
|
describe('UserListComponent', () => {
|
||||||
|
let component: UserListComponent;
|
||||||
|
let fixture: ComponentFixture<UserListComponent>;
|
||||||
|
|
||||||
|
beforeEach(async () => {
|
||||||
|
await TestBed.configureTestingModule({
|
||||||
|
declarations: [ UserListComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
|
||||||
|
fixture = TestBed.createComponent(UserListComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@@ -0,0 +1,57 @@
|
|||||||
|
import { Component, EventEmitter, Input, OnChanges, Output } from '@angular/core';
|
||||||
|
import { Subject, debounceTime, distinctUntilChanged } from 'rxjs';
|
||||||
|
import { BaseList } from 'src/app/core/base/base-list';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-user-list',
|
||||||
|
templateUrl: './user-list.component.html',
|
||||||
|
styleUrls: ['./user-list.component.scss']
|
||||||
|
})
|
||||||
|
export class UserListComponent extends BaseList implements OnChanges {
|
||||||
|
@Input() userList: any = [];
|
||||||
|
@Output() edit = new EventEmitter();
|
||||||
|
@Output() search = new EventEmitter();
|
||||||
|
@Output() OnDeleteUser = new EventEmitter<string>()
|
||||||
|
query = {
|
||||||
|
name: null,
|
||||||
|
card: null
|
||||||
|
}
|
||||||
|
name: string;
|
||||||
|
filterCard: Subject<string> = new Subject<string>();
|
||||||
|
userListKey = ['1', 'fullName', 'userName', 'email', 'phoneNumber', 'userType', 'id', 'action']
|
||||||
|
constructor() {
|
||||||
|
super()
|
||||||
|
this.filterCard.pipe(
|
||||||
|
debounceTime(500),
|
||||||
|
distinctUntilChanged()
|
||||||
|
).subscribe(() => this.onSearch())
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnChanges(): void {
|
||||||
|
this.userList = this.updateMatTable(this.userList ? this.userList : [])
|
||||||
|
}
|
||||||
|
|
||||||
|
onEdit(user) {
|
||||||
|
this.edit.emit(user)
|
||||||
|
}
|
||||||
|
|
||||||
|
onDeleteUser(uid: string) {
|
||||||
|
this.OnDeleteUser.emit(uid)
|
||||||
|
}
|
||||||
|
|
||||||
|
onFilterCard($event) {
|
||||||
|
const filterValue = this.query.card;
|
||||||
|
this.userList.filter = filterValue.trim().toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
onFilterName($event) {
|
||||||
|
const filterValue = this.query.name;
|
||||||
|
this.userList.filter = filterValue.trim().toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
onSearch() {
|
||||||
|
const filterValue = this.query.card;
|
||||||
|
this.userList.filter = filterValue.trim().toLowerCase();
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
import { Component } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-users-router',
|
||||||
|
template: '<router-outlet></router-outlet>',
|
||||||
|
})
|
||||||
|
export class UsersRouterContainer {
|
||||||
|
|
||||||
|
}
|
||||||
37
src/app/pages/manage/users/users.module.ts
Normal file
37
src/app/pages/manage/users/users.module.ts
Normal file
@@ -0,0 +1,37 @@
|
|||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { CommonModule } from '@angular/common';
|
||||||
|
import { RouterModule, Routes } from '@angular/router';
|
||||||
|
import { UsersRouterContainer } from './router/users-router/users-router.container';
|
||||||
|
import { UsersContainer } from './container/users/users.container';
|
||||||
|
import { ModalComponent } from './presenter/modal/modal.component';
|
||||||
|
import { UserListComponent } from './presenter/user-list/user-list.component';
|
||||||
|
import { AppSharedModule } from 'src/app/app.shared';
|
||||||
|
|
||||||
|
const routes: Routes = [
|
||||||
|
{
|
||||||
|
path: '',
|
||||||
|
component: UsersRouterContainer,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
path: '',
|
||||||
|
component: UsersContainer
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
declarations: [
|
||||||
|
UsersRouterContainer,
|
||||||
|
UsersContainer,
|
||||||
|
ModalComponent,
|
||||||
|
UserListComponent
|
||||||
|
],
|
||||||
|
imports: [
|
||||||
|
CommonModule,
|
||||||
|
RouterModule.forChild(routes),
|
||||||
|
AppSharedModule
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class UsersModule { }
|
||||||
16
src/app/sathon-cathay-pay.service.spec.ts
Normal file
16
src/app/sathon-cathay-pay.service.spec.ts
Normal file
@@ -0,0 +1,16 @@
|
|||||||
|
import { TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { SathonCathayPayService } from './sathon-cathay-pay.service';
|
||||||
|
|
||||||
|
describe('SathonCathayPayService', () => {
|
||||||
|
let service: SathonCathayPayService;
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
TestBed.configureTestingModule({});
|
||||||
|
service = TestBed.inject(SathonCathayPayService);
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should be created', () => {
|
||||||
|
expect(service).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
35
src/app/sathon-cathay-pay.service.ts
Normal file
35
src/app/sathon-cathay-pay.service.ts
Normal file
@@ -0,0 +1,35 @@
|
|||||||
|
import { HttpClient } from '@angular/common/http';
|
||||||
|
import { Injectable } from '@angular/core';
|
||||||
|
import { map, Observable } from 'rxjs';
|
||||||
|
import { environment } from 'src/environments/environment';
|
||||||
|
|
||||||
|
@Injectable({
|
||||||
|
providedIn: 'root'
|
||||||
|
})
|
||||||
|
export class SathonCathayPayService {
|
||||||
|
endpoint: string = environment.CATHAYAPIURL
|
||||||
|
constructor(
|
||||||
|
private http: HttpClient
|
||||||
|
) { }
|
||||||
|
|
||||||
|
getAllUsers(): Observable<[]> {
|
||||||
|
return this.http.get<[]>(`${this.endpoint}/v1/user`).pipe(map((d: any) => d.data))
|
||||||
|
}
|
||||||
|
|
||||||
|
deleteUser(userId) {
|
||||||
|
return this.http.delete<[]>(`${this.endpoint}/v1/user/${userId}`)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
lockUnlockUser(id: string): Observable<any> {
|
||||||
|
const request = { userId: id }
|
||||||
|
return this.http.post(`${this.endpoint}/v2/Authentication/LockUnlock`, request)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
convertToCoperate(id: string): Observable<any> {
|
||||||
|
const request = { id }
|
||||||
|
return this.http.post(`${this.endpoint}/v1/User/convert2coperateType`, request)
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user