+ 취소 ? 확인 ?
+
+
+
+
+
+
+
+
+
+
+
+ 대화방 유형
+-
+
-
+
+ +일반 대화방
+ 300명까지 참여가 가능합니다. +
+ -
+
+ +대규모 대화방
+ 1000명까지 참여가 가능합니다. +
+ -
+
+ +비밀 대화방
+ 타이머 설정 시 대화 내용이 자동 삭제 + 됩니다. +
+
+
+
+ {{ input.value?.length || 0 }}/20
+
+ 금지단어[-,_]
+
+
+
+ 대화방 이름
+
+
+
+
diff --git a/src/app/pages/common/popup/new-chat-info.component.scss b/src/app/pages/common/popup/new-chat-info.component.scss
new file mode 100644
index 0000000..db16a20
--- /dev/null
+++ b/src/app/pages/common/popup/new-chat-info.component.scss
@@ -0,0 +1,178 @@
+.dialog-creat-chat {
+ height: 100%;
+ & > .mat-card-header {
+ .btn-dialog-close {
+ font-size: 20px;
+ display: flex;
+ margin-left: auto;
+ align-self: flex-start;
+ color: #444444;
+ }
+ }
+ & > .mat-card-content {
+ position: relative;
+ .mat-card-content-frame {
+ height: calc(100% - 50px);
+ .container {
+ height: 100%;
+ .container-frame {
+ height: 300px;
+ }
+ }
+ }
+ //그룹이름 폼 있는 경우
+ .newgroup-form {
+ height: 70px;
+ & + .mat-card-content-frame {
+ height: calc(100% - 120px);
+ .container {
+ .mat-tab-frame {
+ .mat-tab-group {
+ & > .mat-tab-body {
+ height: 380px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ & > .mat-tab-body-wrapper {
+ height: calc(100% - 50px);
+ .mat-tag-body {
+ & > .dialog-tab-orglist {
+ }
+ }
+ }
+}
+
+.dialog-tab-grouplist {
+ height: calc(100% - 130px);
+ width: 100%;
+ .group,
+ .search-result {
+ width: 100%;
+ height: calc(100% - 50px);
+ &-expansion {
+ .list-item {
+ height: 60px;
+ }
+ }
+ &-list-item {
+ width: 100%;
+ }
+ }
+}
+
+/*::ng-deep .dialog-tab-chatlist {
+ height: 508px;
+ width: 100%;
+ .chat {
+ width: 100%;
+ }
+ .chat.checkbox {
+ & > .list-item {
+ padding: 0 10px;
+ .item-default {
+ width: calc(100% - 30px);
+ }
+ .mat-badge {
+ display: none;
+ }
+ }
+ }
+}
+*/
+::ng-deep .dialog-tab-orglist {
+ width: 100%;
+ height: calc(100% - 130px);
+ border-bottom: 1px solid #dddddd;
+ position: relative;
+ .oraganization {
+ .ps__rail-y {
+ left: auto !important;
+ }
+ &-tab {
+ width: 100%;
+ height: calc(100% - 50px);
+ position: relative;
+ &-tree {
+ display: inline-flex;
+ width: 50%;
+ height: 100% !important;
+ border-right: 1px solid #dddddd;
+ overflow: auto;
+ .tab-tree-frame {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ .select-list {
+ display: inline-flex;
+ flex-direction: column;
+ width: 50%;
+ height: 100% !important;
+ overflow: auto;
+ .search-list {
+ overflow: auto;
+ height: calc(100% - 40px);
+ }
+ }
+ }
+ }
+}
+
+.list-chip {
+ height: 100px;
+ width: 100%;
+ padding: 10px;
+ border: 1px solid #dddddd;
+ overflow: auto;
+ background-color: #f9f9f9;
+ margin-top: 10px;
+}
+.mat-chip.mat-standard-chip .mat-chip-remove {
+}
+
+.confirm-card {
+ .mat-card-content {
+ .content-box {
+ flex-direction: column;
+ flex-flow: column;
+ }
+ }
+ .button-form {
+ text-align: right;
+ .mat-primary {
+ margin-left: 4px;
+ }
+ }
+}
+
+/*::ng-deep .dialog-creat-chat {
+ & > .mat-tab-body-wrapper {
+ .mat-tab-body {
+ height: 380px;
+ &:nth-child(3) {
+ height: 480px;
+ }
+ .mat-tab-body-content {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ }
+}
+*/
+
+.mat-card-content {
+ .mat-card-content-frame {
+ height: 100%;
+ .container {
+ height: 100%;
+ .mat-tab-group {
+ height: 100%;
+ }
+ }
+ }
+}
diff --git a/src/app/pages/common/popup/new-chat-info.component.spec.ts b/src/app/pages/common/popup/new-chat-info.component.spec.ts
new file mode 100644
index 0000000..614f0aa
--- /dev/null
+++ b/src/app/pages/common/popup/new-chat-info.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { NewChatInfoComponent } from './new-chat-info.component';
+
+describe('NewChatInfoComponent', () => {
+ let component: NewChatInfoComponent;
+ let fixture: ComponentFixture
-
-
-
- 검색창
+
+
@@ -90,7 +129,16 @@
@@ -98,40 +146,31 @@
+
+
+
+
+
+
+ {{ searchItem.itemName }}
+
+
+
+
+
+
+
+
-
ffffffffff
+
+
+ LG CNS
+ DT 사업부
+
+
+ >
+
+
+
-
-
- 김선규
- clear
-
-
-
-
+
+ 선택한 대화상대 4
+
+
+
+
+
+ 김선규
+ clear
+
+
+
+
+
+
+
+
+
+
diff --git a/src/app/pages/common/popup/new-chat.component.scss b/src/app/pages/common/popup/new-chat.component.scss
index 82d2dc5..db16a20 100644
--- a/src/app/pages/common/popup/new-chat.component.scss
+++ b/src/app/pages/common/popup/new-chat.component.scss
@@ -16,7 +16,7 @@
.container {
height: 100%;
.container-frame {
- height: 530px;
+ height: 300px;
}
}
}
diff --git a/src/app/pages/common/popup/new-chat.component.ts b/src/app/pages/common/popup/new-chat.component.ts
index f9c869e..5449b85 100644
--- a/src/app/pages/common/popup/new-chat.component.ts
+++ b/src/app/pages/common/popup/new-chat.component.ts
@@ -13,6 +13,8 @@ export class NewChatComponent implements OnInit {
{ name: '김선구2' },
{ name: '김선구3' }
];
+ searchItemList: any[] = [{ itemName: 'LGCNS' }, { itemName: 'LG' }];
+
constructor(@Inject(MAT_DIALOG_DATA) public data: any) {}
ngOnInit(): void {}
diff --git a/src/app/pages/common/popup/new-group.component.html b/src/app/pages/common/popup/new-group.component.html
index aba24d9..aa93638 100644
--- a/src/app/pages/common/popup/new-group.component.html
+++ b/src/app/pages/common/popup/new-group.component.html
@@ -1 +1,55 @@
-new-group works!
+
+
+
+
+
+
+
+
+
+
+
+ {{ input.value?.length || 0 }}/20
+
+ 금지단어[-,_]
+
+
+ 이미 존재하는 그룹명입니다.
+
+
+
+
+
+
+
diff --git a/src/app/pages/common/popup/new-group.component.scss b/src/app/pages/common/popup/new-group.component.scss
index e69de29..db16a20 100644
--- a/src/app/pages/common/popup/new-group.component.scss
+++ b/src/app/pages/common/popup/new-group.component.scss
@@ -0,0 +1,178 @@
+.dialog-creat-chat {
+ height: 100%;
+ & > .mat-card-header {
+ .btn-dialog-close {
+ font-size: 20px;
+ display: flex;
+ margin-left: auto;
+ align-self: flex-start;
+ color: #444444;
+ }
+ }
+ & > .mat-card-content {
+ position: relative;
+ .mat-card-content-frame {
+ height: calc(100% - 50px);
+ .container {
+ height: 100%;
+ .container-frame {
+ height: 300px;
+ }
+ }
+ }
+ //그룹이름 폼 있는 경우
+ .newgroup-form {
+ height: 70px;
+ & + .mat-card-content-frame {
+ height: calc(100% - 120px);
+ .container {
+ .mat-tab-frame {
+ .mat-tab-group {
+ & > .mat-tab-body {
+ height: 380px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ & > .mat-tab-body-wrapper {
+ height: calc(100% - 50px);
+ .mat-tag-body {
+ & > .dialog-tab-orglist {
+ }
+ }
+ }
+}
+
+.dialog-tab-grouplist {
+ height: calc(100% - 130px);
+ width: 100%;
+ .group,
+ .search-result {
+ width: 100%;
+ height: calc(100% - 50px);
+ &-expansion {
+ .list-item {
+ height: 60px;
+ }
+ }
+ &-list-item {
+ width: 100%;
+ }
+ }
+}
+
+/*::ng-deep .dialog-tab-chatlist {
+ height: 508px;
+ width: 100%;
+ .chat {
+ width: 100%;
+ }
+ .chat.checkbox {
+ & > .list-item {
+ padding: 0 10px;
+ .item-default {
+ width: calc(100% - 30px);
+ }
+ .mat-badge {
+ display: none;
+ }
+ }
+ }
+}
+*/
+::ng-deep .dialog-tab-orglist {
+ width: 100%;
+ height: calc(100% - 130px);
+ border-bottom: 1px solid #dddddd;
+ position: relative;
+ .oraganization {
+ .ps__rail-y {
+ left: auto !important;
+ }
+ &-tab {
+ width: 100%;
+ height: calc(100% - 50px);
+ position: relative;
+ &-tree {
+ display: inline-flex;
+ width: 50%;
+ height: 100% !important;
+ border-right: 1px solid #dddddd;
+ overflow: auto;
+ .tab-tree-frame {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ .select-list {
+ display: inline-flex;
+ flex-direction: column;
+ width: 50%;
+ height: 100% !important;
+ overflow: auto;
+ .search-list {
+ overflow: auto;
+ height: calc(100% - 40px);
+ }
+ }
+ }
+ }
+}
+
+.list-chip {
+ height: 100px;
+ width: 100%;
+ padding: 10px;
+ border: 1px solid #dddddd;
+ overflow: auto;
+ background-color: #f9f9f9;
+ margin-top: 10px;
+}
+.mat-chip.mat-standard-chip .mat-chip-remove {
+}
+
+.confirm-card {
+ .mat-card-content {
+ .content-box {
+ flex-direction: column;
+ flex-flow: column;
+ }
+ }
+ .button-form {
+ text-align: right;
+ .mat-primary {
+ margin-left: 4px;
+ }
+ }
+}
+
+/*::ng-deep .dialog-creat-chat {
+ & > .mat-tab-body-wrapper {
+ .mat-tab-body {
+ height: 380px;
+ &:nth-child(3) {
+ height: 480px;
+ }
+ .mat-tab-body-content {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ }
+}
+*/
+
+.mat-card-content {
+ .mat-card-content-frame {
+ height: 100%;
+ .container {
+ height: 100%;
+ .mat-tab-group {
+ height: 100%;
+ }
+ }
+ }
+}
diff --git a/src/app/pages/common/popup/step-layout.component.html b/src/app/pages/common/popup/step-layout.component.html
new file mode 100644
index 0000000..676e4b5
--- /dev/null
+++ b/src/app/pages/common/popup/step-layout.component.html
@@ -0,0 +1,18 @@
+You are now done.
+
+
+
+
+
- bullet
-
- ProfileImage
-
-
-
-
홍길동
- 대리
+
+
+
+
+
@@ -107,15 +210,17 @@
-
-
+
-
-
+
-
-
+
+ 다른용무
+
+
-
+ 
+
+
- 영업팀
+
+
+
+ 홍길동
+ 대리
+
+ 영업팀
+
- 맑은 산속 옹달샘 누가와서 먹나요??
+
+ 맑은 산속 옹달샘 누가와서 먹나요?? 토끼가 새벽에 와서 빨빨랑 먹지요 토끼가 + 새벽에 와서 빨빨랑 먹지요. +
- Logo
+ 
@@ -38,18 +68,25 @@
>
+
+
+
+
+
+
M Messenger
-
+ M-Messenger
그룹
+
-
+
+
1
1A
1AB
1ABCDEFGHIJKLMNOPQRSTUVWXYZ
-
+
이름 부서명, 전화번호, 이메일
- search
+
-
+
-
+
즐겨찾기
- (6/7)
+ ( 6/7 )
-
+
그룹명을 넣습니다
- (6/7)
+ ( 6/7 )
+
+
Today2020.05.05
-
-