2022-09-14 03:18:11 +00:00

228 lines
7.3 KiB
HTML

<div class="flex flex-col max-w-240 md:min-w-160 max-h-screen -m-6">
<!-- Header -->
<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">{{ data.title }}</div>
<button mat-icon-button (click)="saveAndClose()" [tabIndex]="-1">
<mat-icon
class="text-current"
[svgIcon]="'heroicons_outline:x'"
></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
class="flex flex-col flex-auto p-6 sm:p-8 overflow-y-auto"
[formGroup]="composeForm"
>
<!-- To -->
<mat-form-field>
<mat-label>파트너아이디</mat-label>
<input matInput [formControlName]="'partnerId'" />
</mat-form-field>
<!-- <div *ngFor="let f of sites">{{ f.getUrl() }}</div> -->
<!-- Cc -->
<!-- <mat-form-field>
<mat-label>사이트명</mat-label>
<input matInput [formControlName]="'siteName'" />
<mat-error *ngIf="composeForm.get('siteName')?.hasError('required')">
사이트명은 필수 입력입니다.
</mat-error>
</mat-form-field> -->
<mat-form-field>
<mat-label>사이트명</mat-label>
<mat-select [formControlName]="'siteId'" placeholder="사이트 선택">
<mat-option *ngFor="let site of sites" [value]="site.getId()">
{{ site.getUrl() }}
</mat-option>
</mat-select>
<mat-error *ngIf="composeForm.get('siteId')?.hasError('required')">
사이트명은 필수 입력입니다.
</mat-error>
</mat-form-field>
<!-- Bcc -->
<mat-form-field>
<mat-label>회원 아이디</mat-label>
<input
matInput
[formControlName]="'username'"
(focusout)="__checkUsernameDuplicate($event)"
/>
<mat-error *ngIf="composeForm.get('username')?.hasError('required')">
아이디는 필수 입력입니다.
</mat-error>
<mat-error
*ngIf="composeForm.get('username')?.hasError('usernameDuplicate')"
>
아이디가 중복됩니다.
</mat-error>
<mat-error *ngIf="composeForm.get('username')?.hasError('pattern')">
아이디가 중복됩니다.
</mat-error>
</mat-form-field>
<!-- Subject -->
<mat-form-field>
<mat-label>비밀번호</mat-label>
<input matInput [formControlName]="'password'" />
<mat-error *ngIf="composeForm.get('password')?.hasError('required')">
비밀번호는 필수 입력입니다.
</mat-error>
<mat-error *ngIf="composeForm.get('password')?.hasError('pattern')">
비밀번호는 영문 대문자,소문자,숫자,특수문자가 포함되어야 하며 8자 이상
20글자 이하로 입력하여야 합니다.
</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>환전 비밀번호</mat-label>
<input matInput [formControlName]="'exchangePassword'" />
<mat-error
*ngIf="composeForm.get('exchangePassword')?.hasError('required')"
>
환전 비밀번호 필수 입력입니다.
</mat-error>
<mat-error
*ngIf="composeForm.get('exchangePassword')?.hasError('pattern')"
>
환전 비밀번호는 영문 또는 숫자가 포함되어야 하며 4글자 이상 8글자 이하로
입력하여야 합니다.
</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>닉네임</mat-label>
<input
matInput
[formControlName]="'nickname'"
(focusout)="__checkNickname($event)"
/>
<mat-error *ngIf="composeForm.get('nickname')?.hasError('required')">
닉네임은 필수 입력입니다.
</mat-error>
<mat-error
*ngIf="composeForm.get('nickname')?.hasError('nicknameDuplicate')"
>
닉네임이 중복됩니다.
</mat-error>
<mat-error *ngIf="composeForm.get('nickname')?.hasError('pattern')">
닉네임은 영문, 숫자 또는 한글이 포함되어야 하며 4글자 이상 8글자 이하로
입력하여야 합니다.
</mat-error>
</mat-form-field>
<!-- <mat-form-field>
<mat-label>정산종류</mat-label>
<input matInput [formControlName]="'calculateType'" />
<mat-error *ngIf="composeForm.get('calculateType')?.hasError('required')">
정산종류는 필수 입력입니다.
</mat-error>
</mat-form-field> -->
<mat-form-field>
<mat-label>정산종류</mat-label>
<mat-select [formControlName]="'calculateType'">
<mat-option [value]="0"> 롤링 </mat-option>
</mat-select>
<mat-error *ngIf="composeForm.get('siteName')?.hasError('required')">
정산종류는 필수 입력입니다.
</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>휴대폰번호</mat-label>
<input matInput [formControlName]="'mobilePhoneNumber'" />
<mat-error
*ngIf="composeForm.get('mobilePhoneNumber')?.hasError('required')"
>
휴대폰번호는 필수 입력입니다.
</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>은행명</mat-label>
<mat-select [formControlName]="'bankId'" placeholder="은행 선택">
<mat-option *ngFor="let bank of banks" [value]="bank.getId()">
{{ bank.getName() }}
</mat-option>
<!-- <mat-option [value]="'0'"> 국민은행 </mat-option> -->
</mat-select>
<mat-error *ngIf="composeForm.get('bankId')?.hasError('required')">
은행명은 필수 입력입니다.
</mat-error>
</mat-form-field>
<!-- <mat-form-field>
<mat-label>은행명</mat-label>
<input matInput [formControlName]="'bankName'" />
<mat-error *ngIf="composeForm.get('bankName')?.hasError('required')">
은행명은 필수 입력입니다.
</mat-error>
</mat-form-field> -->
<mat-form-field>
<mat-label>계좌번호</mat-label>
<input matInput [formControlName]="'accountNumber'" />
<mat-error *ngIf="composeForm.get('accountNumber')?.hasError('required')">
계좌번호는 필수 입력입니다.
</mat-error>
</mat-form-field>
<mat-form-field>
<mat-label>예금주</mat-label>
<input matInput [formControlName]="'accountHolder'" />
<mat-error *ngIf="composeForm.get('accountHolder')?.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="flex items-center mt-4 sm:mt-0">
<!-- Save as draft -->
<button class="sm:mx-3" mat-stroked-button (click)="close()">
<span>취소</span>
</button>
<!-- Send -->
<button
class="order-first sm:order-last"
mat-flat-button
[color]="'primary'"
(click)="send()"
[disabled]="isSendDisable"
>
등록
</button>
</div>
</div>
</form>
</div>