diff --git a/src/app/modules/beteran/component/home.component.html b/src/app/modules/beteran/component/home.component.html
index 6471c90..18b325b 100644
--- a/src/app/modules/beteran/component/home.component.html
+++ b/src/app/modules/beteran/component/home.component.html
@@ -102,7 +102,11 @@
>
쪽지
-
(0)
+
+ (0)
+
diff --git a/src/app/modules/beteran/component/home.component.ts b/src/app/modules/beteran/component/home.component.ts
index 5270938..3ee7d22 100644
--- a/src/app/modules/beteran/component/home.component.ts
+++ b/src/app/modules/beteran/component/home.component.ts
@@ -28,6 +28,7 @@ import { Vendor } from 'app/modules/proto/models/api/vendor_pb';
import { environment } from 'environments/environment';
import { ModifyMemberComposeComponent } from '../compose/compose/modify-member-compose.component';
import { SlotGameComposeComponent } from '../compose/compose/slot-game-compose.component';
+import { MessageComposeComponent } from '../compose/compose/message-compose.component';
export enum ComposeMenuType {
signIn = 'SignIn',
@@ -312,4 +313,10 @@ export class HomeComponent implements OnInit {
});
});
}
+
+ __onClickMessage(event: MouseEvent): void {
+ const dialogRef = this._matDialog.open(MessageComposeComponent, {
+ data: { price: '', memo: '' },
+ });
+ }
}
diff --git a/src/app/modules/beteran/compose/compose/index.ts b/src/app/modules/beteran/compose/compose/index.ts
index eb0e21d..eb297d2 100644
--- a/src/app/modules/beteran/compose/compose/index.ts
+++ b/src/app/modules/beteran/compose/compose/index.ts
@@ -10,6 +10,7 @@ import { SignUpComposeComponent } from './sign-up-compose.component';
import { SignInComposeComponent } from './sign-in-compose.component';
import { SlotGameComposeComponent } from './slot-game-compose.component';
import { ModifyMemberComposeComponent } from './modify-member-compose.component';
+import { MessageComposeComponent } from './message-compose.component';
export const COMPOSE = [
DepositComposeComponent,
@@ -24,4 +25,5 @@ export const COMPOSE = [
SignInComposeComponent,
SlotGameComposeComponent,
ModifyMemberComposeComponent,
+ MessageComposeComponent,
];
diff --git a/src/app/modules/beteran/compose/compose/message-compose.component.html b/src/app/modules/beteran/compose/compose/message-compose.component.html
new file mode 100644
index 0000000..817ed43
--- /dev/null
+++ b/src/app/modules/beteran/compose/compose/message-compose.component.html
@@ -0,0 +1,74 @@
+
diff --git a/src/app/modules/beteran/compose/compose/message-compose.component.ts b/src/app/modules/beteran/compose/compose/message-compose.component.ts
new file mode 100644
index 0000000..9321cd9
--- /dev/null
+++ b/src/app/modules/beteran/compose/compose/message-compose.component.ts
@@ -0,0 +1,120 @@
+import {
+ trigger,
+ state,
+ style,
+ transition,
+ animate,
+} from '@angular/animations';
+import { Component, OnInit } from '@angular/core';
+import { FormGroup, FormBuilder, Validators } from '@angular/forms';
+import { MatDialogRef } from '@angular/material/dialog';
+import { MatDialog } from '@angular/material/dialog';
+import { CustomerRegistrationComposeComponent } from './customer-registration-compose.component';
+
+@Component({
+ selector: 'message-compose',
+ templateUrl: './message-compose.component.html',
+ animations: [
+ trigger('detailExpand', [
+ state('collapsed', style({ height: '0px', minHeight: '0' })),
+ state('expanded', style({ height: '*', minHeight: '50px' })),
+ transition(
+ 'expanded <=> collapsed',
+ animate('225ms cubic-bezier(0.4, 0.0, 0.2, 1)')
+ ),
+ ]),
+ ],
+})
+export class MessageComposeComponent implements OnInit {
+ composeForm!: FormGroup;
+
+ dataSource = ELEMENT_DATA;
+ columnsToDisplay = ['state', 'content', 'delete', 'applicationDate'];
+ expandedElement: PeriodicElement | null | undefined;
+
+ /**
+ * Constructor
+ */
+ constructor(
+ public matDialogRef: MatDialogRef,
+ private _formBuilder: FormBuilder,
+ private _matDialog: MatDialog
+ ) {}
+
+ // -----------------------------------------------------------------------------------------------------
+ // @ Lifecycle hooks
+ // -----------------------------------------------------------------------------------------------------
+
+ /**
+ * On init
+ */
+ ngOnInit(): void {
+ // Create the form
+ this.composeForm = this._formBuilder.group({
+ accountHolder: ['', [Validators.required]],
+ amount: ['', [Validators.required]],
+ });
+ }
+
+ // -----------------------------------------------------------------------------------------------------
+ // @ Public methods
+ // -----------------------------------------------------------------------------------------------------
+
+ /**
+ * Save and close
+ */
+ saveAndClose(): void {
+ // Save the message as a draft
+ this.saveAsDraft();
+
+ // Close the dialog
+ this.matDialogRef.close();
+ }
+
+ /**
+ * Discard the message
+ */
+ discard(): void {}
+
+ /**
+ * Save the message as a draft
+ */
+ saveAsDraft(): void {}
+
+ /**
+ * Send the message
+ */
+ send(): void {}
+}
+
+export interface PeriodicElement {
+ state: string;
+ content: string;
+ delete: string;
+ applicationDate: string;
+ description: string;
+}
+
+const ELEMENT_DATA: PeriodicElement[] = [
+ {
+ state: '읽지않음',
+ content: '쪽지받아',
+ delete: '삭제하기',
+ applicationDate: '2022-08-23',
+ description: `입금계좌를 알려달라`,
+ },
+ {
+ state: '읽음',
+ content: '쪽지읽어랏',
+ delete: '삭제하기',
+ applicationDate: '2022-08-23',
+ description: `하단이미지를 참고해주시기바랍니다`,
+ },
+ {
+ state: '읽지않음',
+ content: '함하맣마하맣ㅁ',
+ delete: '삭제하기',
+ applicationDate: '2022-08-23',
+ description: `입금해라입금. 출금해라출금 이로이로ㅓㅁ;ㅇ롱러;올;ㅣㅁㄴ더ㅗ래;ㄷ로ㅑ`,
+ },
+];