Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
D
dynacmic-myhr
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Registry
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
angular
dynacmic-myhr
Commits
6c305bb6
Commit
6c305bb6
authored
7 months ago
by
Ooh-Ao
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
model datasource
parent
84f2e6fa
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
50 additions
and
26 deletions
+50
-26
services.component.ts
src/app/services/services.component.ts
+29
-4
setting-widget.component.html
src/app/setting-widget/setting-widget.component.html
+8
-12
setting-widget.component.ts
src/app/setting-widget/setting-widget.component.ts
+13
-6
styles.scss
src/styles.scss
+0
-4
No files found.
src/app/services/services.component.ts
View file @
6c305bb6
import
{
Component
,
OnInit
,
ViewChild
}
from
'@angular/core'
;
import
{
Component
,
EventEmitter
,
Input
,
OnInit
,
Output
,
SimpleChanges
,
ViewChild
}
from
'@angular/core'
;
import
{
ActivatedRoute
,
Params
}
from
'@angular/router'
;
import
{
Observable
,
Subject
,
from
,
mergeMap
,
of
,
switchMap
,
takeUntil
,
tap
}
from
'rxjs'
;
import
{
ComponentHostDirective
}
from
'../directives/component-host.directive'
;
...
...
@@ -13,7 +13,8 @@ import { Service, ServiceTypes } from '../components';
styleUrls
:
[
'./services.component.scss'
],
})
export
class
ServicesComponent
implements
OnInit
{
@
Input
()
id
?:
number
;
@
Output
()
valueChange
:
EventEmitter
<
Service
>
=
new
EventEmitter
<
Service
>
();
componentList
:
Service
[]
=
[{
id
:
0
,
title
:
"11111"
,
...
...
@@ -43,14 +44,36 @@ export class ServicesComponent implements OnInit {
destroy
:
Subject
<
void
>
=
new
Subject
<
void
>
();
ngOnInit
():
void
{
// subscribing to the stream when component has been created
// this.getOne(this.id!).subscribe(result => {
// this.loadComponent(result)
// })
this
.
route
.
params
.
pipe
(
mergeMap
(({
id
}:
Params
)
=>
this
.
getOne
(
id
)),
mergeMap
(({
id
}:
Params
)
=>
this
.
getOne
(
id
!
?
id
:
this
.
id
)),
tap
((
service
:
Service
)
=>
this
.
loadComponent
(
service
)),
takeUntil
(
this
.
destroy
.
asObservable
()),
)
.
subscribe
();
}
ngOnChanges
(
changes
:
SimpleChanges
):
void
{
console
.
log
(
changes
)
if
(
changes
)
{
this
.
id
=
changes
[
'id'
].
currentValue
this
.
getOne
(
this
.
id
!
).
subscribe
(
result
=>
{
this
.
loadComponent
(
result
)
})
}
//Called before any other lifecycle hook. Use it to inject dependencies, but avoid any serious work here.
//Add '${implements OnChanges}' to the class.
}
loadComponent
(
service
:
Service
):
void
{
...
...
@@ -61,7 +84,9 @@ export class ServicesComponent implements OnInit {
const
{
instance
}
=
viewContainerRef
.
createComponent
<
ServiceComponentType
>
(
servicesComponentFactory
[
service
.
id
as
ServiceTypes
]
);
instance
.
model
=
service
.
title
;
instance
.
model
=
service
.
dataModel
;
this
.
valueChange
.
emit
(
service
);
}
ngOnDestroy
():
void
{
...
...
This diff is collapsed.
Click to expand it.
src/app/setting-widget/setting-widget.component.html
View file @
6c305bb6
<div
id=
"loginform"
>
<div
id=
"loginform"
style=
"background-color: gray;"
>
<div
class=
"position-relative overflow-hidden radial-gradient min-vh-100 w-100"
>
<div
class=
"position-relative z-index-5"
style=
"z-index: 5 !important;"
>
<div
class=
"row"
>
<div
class=
"col-xl-7 col-xxl-8"
style=
"background-color: black;"
>
<!-- <a href="../main/index.html" class="text-nowrap logo-img d-block px-4 py-9 w-100">
<img src="assets/images/mylearn-logo.png" width="150px" class="dark-logo" alt="Logo-Dark">
<img src="assets/images/mylearn-logo.png" width="150px" class="light-logo" alt="Logo-light" style="display: none;">
</a> -->
<div
class=
"d-none d-xl-flex align-items-center justify-content-center"
style=
"height: calc(100vh - 80px);"
>
<!-- <img src="assets/images/background/login-register.jpg" alt="" class="img-fluid" width="100%"> -->
<div
class=
"row justify-content-center align-items-center "
>
<div
class=
"col-xl-7 col-xxl-8"
>
<div
class=
"card"
>
<app-services
[
id
]="
widjetId
"
(
valueChange
)="
onValueChange
($
event
)"
></app-services>
</div>
</div>
<div
class=
"col-xl-5 col-xxl-4"
>
...
...
@@ -21,7 +17,7 @@
<form
class=
"needs-validation"
novalidate
>
<div
class=
"mb-3 position-relative"
>
<label
for=
"exampleInputEmail1"
class=
"form-label"
>
เลือก Widget
</label>
<input
name=
"username"
type=
"text"
class=
"form-control"
id=
"exampleInputEmail1
"
<input
[(
ngModel
)]="
widjetId
"
name=
"username"
type=
"text"
class=
"form-control
"
aria-describedby=
"emailHelp"
required
>
<div
class=
"invalid-feedback"
>
Please enter a Username
...
...
@@ -30,13 +26,13 @@
</div>
<div
class=
"mb-4 position-relative"
>
<label
for=
"exampleInputPassword1"
class=
"form-label"
>
Datasource
</label>
<input
name=
"username"
type=
"text"
class=
"form-control"
id=
"exampleInputEmail1
"
<input
[(
ngModel
)]="
dataSoure
"
name=
"datasource"
type=
"text"
class=
"form-control
"
aria-describedby=
"emailHelp"
required
>
<div
class=
"invalid-feedback"
>
Please enter a Username
</div>
</div>
<div
class=
"alert alert-danger"
style=
"word-break: break-all;"
>
Model
</div>
<div
class=
"alert alert-danger"
style=
"word-break: break-all;"
>
{{model?.dataModel}}
</div>
<button
type=
"submit"
class=
"btn btn-primary w-100 py-8 mb-4 rounded-2"
>
Save
</button>
<button
type=
"submit"
class=
"btn btn-success w-100 py-8 mb-4 rounded-2"
>
Preview
</button>
</form>
...
...
This diff is collapsed.
Click to expand it.
src/app/setting-widget/setting-widget.component.ts
View file @
6c305bb6
import
{
CommonModule
}
from
'@angular/common'
;
import
{
Component
,
OnInit
}
from
'@angular/core'
;
import
{
ServicesComponent
}
from
'../services/services.component'
;
import
{
FormsModule
}
from
'@angular/forms'
;
import
{
Service
}
from
'../components'
;
@
Component
({
selector
:
'app-setting-widget'
,
standalone
:
true
,
imports
:
[
CommonModule
],
imports
:
[
CommonModule
,
ServicesComponent
,
FormsModule
],
templateUrl
:
'./setting-widget.component.html'
,
styleUrls
:
[
'./setting-widget.component.css'
]
})
export
class
SettingWidgetComponent
implements
OnInit
{
model
=
{
username
:
""
,
password
:
""
}
model
?:
Service
widjetId
=
0
dataSoure
:
string
=
""
;
constructor
()
{
}
ngOnInit
()
{
}
onValueChange
(
value
:
Service
)
{
console
.
log
(
"value"
,
value
)
this
.
model
=
value
this
.
dataSoure
=
this
.
model
.
dataSoure
}
}
This diff is collapsed.
Click to expand it.
src/styles.scss
View file @
6c305bb6
...
...
@@ -88,7 +88,3 @@ $success: #7952b3;
//
// Custom styles
//
body
{
padding
:
1
.5rem
;
}
This diff is collapsed.
Click to expand it.
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment