출금신청 수정
This commit is contained in:
parent
dc22890c85
commit
f64f96dced
|
|
@ -3,7 +3,7 @@
|
|||
<div
|
||||
class="flex flex-0 items-center justify-between h-16 pr-3 sm:pr-5 pl-6 sm:pl-8 bg-primary text-on-primary"
|
||||
>
|
||||
<div class="text-lg font-medium">Withdraw</div>
|
||||
<div class="text-lg font-medium">출금신청</div>
|
||||
<button mat-icon-button (click)="saveAndClose()" [tabIndex]="-1">
|
||||
<mat-icon
|
||||
class="text-current"
|
||||
|
|
@ -11,6 +11,16 @@
|
|||
></mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
<fuse-alert
|
||||
class="mt-8 -mb-4"
|
||||
*ngIf="showAlert"
|
||||
[appearance]="'outline'"
|
||||
[showIcon]="false"
|
||||
[type]="alert.type"
|
||||
[@shake]="alert.type === 'error'"
|
||||
>
|
||||
{{ alert.message }}
|
||||
</fuse-alert>
|
||||
|
||||
<!-- Compose form -->
|
||||
<form
|
||||
|
|
@ -19,95 +29,110 @@
|
|||
>
|
||||
<!-- To -->
|
||||
<mat-form-field>
|
||||
<mat-label>To</mat-label>
|
||||
<input matInput [formControlName]="'to'" />
|
||||
<div class="copy-fields-toggles" matSuffix>
|
||||
<span
|
||||
class="text-sm font-medium cursor-pointer select-none hover:underline"
|
||||
*ngIf="!copyFields.cc"
|
||||
(click)="showCopyField('cc')"
|
||||
<mat-label>은행명</mat-label>
|
||||
<mat-select
|
||||
[formControlName]="'bankName'"
|
||||
placeholder="은행 선택"
|
||||
>
|
||||
Cc
|
||||
</span>
|
||||
<span
|
||||
class="ml-2 text-sm font-medium cursor-pointer select-none hover:underline"
|
||||
*ngIf="!copyFields.bcc"
|
||||
(click)="showCopyField('bcc')"
|
||||
<mat-option
|
||||
>
|
||||
Bcc
|
||||
</span>
|
||||
</div>
|
||||
국민은행
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Cc -->
|
||||
<mat-form-field *ngIf="copyFields.cc">
|
||||
<mat-label>Cc</mat-label>
|
||||
<input matInput [formControlName]="'cc'" />
|
||||
<mat-error *ngIf="composeForm.get('bankName')?.hasError('required')">
|
||||
은행명은 필수 입력입니다.
|
||||
</mat-error>
|
||||
<mat-form-field>
|
||||
<mat-label>예금주</mat-label>
|
||||
<input matInput [formControlName]="'accountHolder'" />
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Bcc -->
|
||||
<mat-form-field *ngIf="copyFields.bcc">
|
||||
<mat-label>Bcc</mat-label>
|
||||
<input matInput [formControlName]="'bcc'" />
|
||||
<mat-error *ngIf="composeForm.get('accountHolder')?.hasError('required')">
|
||||
예금주는 필수 입력입니다.
|
||||
</mat-error>
|
||||
<mat-form-field>
|
||||
<mat-label>계좌번호</mat-label>
|
||||
<input matInput [formControlName]="'account'" />
|
||||
</mat-form-field>
|
||||
<mat-error *ngIf="composeForm.get('account')?.hasError('required')">
|
||||
계좌번호는 필수 입력입니다.
|
||||
</mat-error>
|
||||
<mat-form-field>
|
||||
<mat-label>보유금액</mat-label>
|
||||
<input matInput [formControlName]="'holdingMoney'" />
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Subject -->
|
||||
<mat-form-field>
|
||||
<mat-label>Subject</mat-label>
|
||||
<input matInput [formControlName]="'subject'" />
|
||||
<mat-label>출금금액</mat-label>
|
||||
<input #inputAmount matInput [formControlName]="'amount'" value="" placeholder="최소출금 50,000원 부터" />
|
||||
<mat-error *ngIf="composeForm.get('amount')?.hasError('required')">
|
||||
출금금액은 필수 입력입니다.
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
|
||||
<!-- Body -->
|
||||
<!-- <quill-editor
|
||||
class="mt-2"
|
||||
[formControlName]="'body'"
|
||||
[modules]="quillModules"
|
||||
></quill-editor> -->
|
||||
|
||||
<!-- Actions -->
|
||||
<div
|
||||
class="flex flex-col sm:flex-row sm:items-center justify-between mt-4 sm:mt-6"
|
||||
>
|
||||
<div class="-ml-2">
|
||||
<!-- Attach file -->
|
||||
<button mat-icon-button>
|
||||
<mat-icon
|
||||
class="icon-size-5"
|
||||
[svgIcon]="'heroicons_solid:paper-clip'"
|
||||
></mat-icon>
|
||||
<div class="flex flex-wrap w-full -m-2">
|
||||
<button
|
||||
class="m-2"
|
||||
mat-stroked-button
|
||||
[color]="'primary'"
|
||||
(click)="__changeAmount('50000')"
|
||||
>
|
||||
5만
|
||||
</button>
|
||||
<!-- Insert link -->
|
||||
<button mat-icon-button>
|
||||
<mat-icon
|
||||
class="icon-size-5"
|
||||
[svgIcon]="'heroicons_solid:link'"
|
||||
></mat-icon>
|
||||
|
||||
<button
|
||||
class="m-2"
|
||||
mat-stroked-button
|
||||
[color]="'primary'"
|
||||
(click)="__changeAmount('100000')"
|
||||
>
|
||||
10만
|
||||
</button>
|
||||
<!-- Insert emoji -->
|
||||
<button mat-icon-button>
|
||||
<mat-icon
|
||||
class="icon-size-5"
|
||||
[svgIcon]="'heroicons_solid:emoji-happy'"
|
||||
></mat-icon>
|
||||
<button
|
||||
class="m-2"
|
||||
mat-stroked-button
|
||||
[color]="'primary'"
|
||||
(click)="__changeAmount('500000')"
|
||||
>
|
||||
50만
|
||||
</button>
|
||||
<!-- Insert image -->
|
||||
<button mat-icon-button>
|
||||
<mat-icon
|
||||
class="icon-size-5"
|
||||
[svgIcon]="'heroicons_solid:photograph'"
|
||||
></mat-icon>
|
||||
<button
|
||||
class="m-2"
|
||||
mat-stroked-button
|
||||
[color]="'primary'"
|
||||
(click)="__changeAmount('1000000')"
|
||||
>
|
||||
100만
|
||||
</button>
|
||||
<button
|
||||
class="m-2"
|
||||
mat-stroked-button
|
||||
[color]="'primary'"
|
||||
(click)="__changeAmount('0')"
|
||||
>
|
||||
정정하기
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center mt-4 sm:mt-0">
|
||||
<!-- Discard -->
|
||||
<button class="ml-auto sm:ml-0" mat-stroked-button (click)="discard()">
|
||||
Discard
|
||||
</button>
|
||||
<mat-form-field>
|
||||
<mat-label>출금비밀번호</mat-label>
|
||||
<input #inputAmount matInput />
|
||||
<mat-error *ngIf="composeForm.get('amount')?.hasError('required')">
|
||||
출금비밀번호는 필수 입력입니다.
|
||||
</mat-error>
|
||||
</mat-form-field>
|
||||
<div class="flex flex-col sm:flex-row sm:items-center mt-4 sm:mt-6">
|
||||
<div class="flex mt-4 sm:mt-0">
|
||||
<!-- Save as draft -->
|
||||
<button class="sm:mx-3" mat-stroked-button (click)="saveAsDraft()">
|
||||
<span>Save as draft</span>
|
||||
</button>
|
||||
<!-- <button class="sm:mx-3" mat-stroked-button (click)="__contactDeposit()">
|
||||
<span>입금계좌문의</span>
|
||||
</button> -->
|
||||
<!-- Send -->
|
||||
<button
|
||||
class="order-first sm:order-last"
|
||||
|
|
@ -115,7 +140,7 @@
|
|||
[color]="'primary'"
|
||||
(click)="send()"
|
||||
>
|
||||
Send
|
||||
출금하기
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
import { Component, OnInit, ViewEncapsulation } from '@angular/core';
|
||||
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
|
||||
import { MatDialogRef } from '@angular/material/dialog';
|
||||
import { FuseAlertType } from '@fuse/components/alert';
|
||||
import { MemberBankWithdrawService } from 'app/modules/polyglot/member_bank_withdraw/services/member_bank_withdraw.service';
|
||||
import { CreateMemberBankWithdrawRequest } from 'app/modules/proto/c2se/member_bank_withdraw_pb';
|
||||
|
||||
@Component({
|
||||
selector: 'withdraw-compose',
|
||||
|
|
@ -9,24 +12,18 @@ import { MatDialogRef } from '@angular/material/dialog';
|
|||
})
|
||||
export class WithdrawComposeComponent implements OnInit {
|
||||
composeForm!: FormGroup;
|
||||
copyFields: { cc: boolean; bcc: boolean } = {
|
||||
cc: false,
|
||||
bcc: false,
|
||||
alert: { type: FuseAlertType; message: string } = {
|
||||
type: 'success',
|
||||
message: '출금신청이 완료 되었습니다.',
|
||||
};
|
||||
quillModules: any = {
|
||||
toolbar: [
|
||||
['bold', 'italic', 'underline'],
|
||||
[{ align: [] }, { list: 'ordered' }, { list: 'bullet' }],
|
||||
['clean'],
|
||||
],
|
||||
};
|
||||
|
||||
showAlert: boolean = false;
|
||||
/**
|
||||
* Constructor
|
||||
*/
|
||||
constructor(
|
||||
public matDialogRef: MatDialogRef<WithdrawComposeComponent>,
|
||||
private _formBuilder: FormBuilder
|
||||
private _formBuilder: FormBuilder,
|
||||
private _memberBankWithdrawService: MemberBankWithdrawService
|
||||
) {}
|
||||
|
||||
// -----------------------------------------------------------------------------------------------------
|
||||
|
|
@ -39,11 +36,8 @@ export class WithdrawComposeComponent implements OnInit {
|
|||
ngOnInit(): void {
|
||||
// Create the form
|
||||
this.composeForm = this._formBuilder.group({
|
||||
to: ['', [Validators.required, Validators.email]],
|
||||
cc: ['', [Validators.email]],
|
||||
bcc: ['', [Validators.email]],
|
||||
subject: [''],
|
||||
body: ['', [Validators.required]],
|
||||
accountHolder: ['', [Validators.required]],
|
||||
amount: ['', [Validators.required]],
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -51,21 +45,6 @@ export class WithdrawComposeComponent implements OnInit {
|
|||
// @ Public methods
|
||||
// -----------------------------------------------------------------------------------------------------
|
||||
|
||||
/**
|
||||
* Show the copy field with the given field name
|
||||
*
|
||||
* @param name
|
||||
*/
|
||||
showCopyField(name: string): void {
|
||||
// Return if the name is not one of the available names
|
||||
if (name !== 'cc' && name !== 'bcc') {
|
||||
return;
|
||||
}
|
||||
|
||||
// Show the field
|
||||
this.copyFields[name] = true;
|
||||
}
|
||||
|
||||
/**
|
||||
* Save and close
|
||||
*/
|
||||
|
|
@ -90,5 +69,51 @@ export class WithdrawComposeComponent implements OnInit {
|
|||
/**
|
||||
* Send the message
|
||||
*/
|
||||
send(): void {}
|
||||
send(): void {
|
||||
if (!this.composeForm.valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.composeForm?.disable();
|
||||
|
||||
const req = new CreateMemberBankWithdrawRequest();
|
||||
const amount = this.composeForm.get('amount')?.value as number;
|
||||
const holder = this.composeForm.get('accountHolder')?.value as string;
|
||||
req.setAmount(amount);
|
||||
req.setName(holder);
|
||||
req.setMemo('test');
|
||||
|
||||
this._memberBankWithdrawService
|
||||
.createMemberBankWithdraw(
|
||||
// req - 에러나서 지워둠. 이담
|
||||
)
|
||||
.then(() => {
|
||||
console.log();
|
||||
this.showAlert = true;
|
||||
})
|
||||
.catch((e) => {
|
||||
this.showAlert = true;
|
||||
this.alert = { type: 'error', message: '출금신청이 실패 하였습니다.' };
|
||||
// Re-enable the form
|
||||
this.composeForm?.enable();
|
||||
|
||||
// Reset the form
|
||||
})
|
||||
.finally(() =>
|
||||
setTimeout(() => {
|
||||
this.matDialogRef.close();
|
||||
}, 2000)
|
||||
);
|
||||
// req.set
|
||||
}
|
||||
|
||||
__changeAmount(amount: string): void {
|
||||
const amountInput = this.composeForm.get('amount');
|
||||
|
||||
if (amount === '0') {
|
||||
amountInput?.setValue('');
|
||||
return;
|
||||
}
|
||||
amountInput?.setValue(amount);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user