zheng/blog-frontEnd
1
0
Fork 0
Code Issues 2 Pull Requests 12 Actions Packages Projects Releases Wiki Activity

补全表单缺失项

Browse Source
This commit is contained in:
禾几海
2020-08-07 21:45:39 +08:00
parent 58d11c4fa8
commit 398716e3ff
2 changed files with 28 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/app/view/admin/admin-link/admin-link.component.html
View File

@@ -20,14 +20,14 @@
(nzOnCancel)="modalVisible = false" [nzClosable]="true" [nzOkDisabled]="!formGroup.valid"> (nzOnCancel)="modalVisible = false" [nzClosable]="true" [nzOkDisabled]="!formGroup.valid">
<form nz-form [formGroup]="formGroup"> <form nz-form [formGroup]="formGroup">
<nz-form-item> <nz-form-item>
<nz-form-label nzRequired>网站名称</nz-form-label> <nz-form-label nzFlex="80px" nzRequired>网站名称</nz-form-label>
<nz-form-control nzErrorTip="网站名称不可为空"> <nz-form-control nzFlex="auto" nzErrorTip="网站名称不可为空">
<input nz-input formControlName="name"> <input nz-input formControlName="name">
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label nzRequired>网站链接</nz-form-label> <nz-form-label nzFlex="80px" nzRequired>网站链接</nz-form-label>
<nz-form-control [nzErrorTip]="nameErrTip"> <nz-form-control nzFlex="auto" [nzErrorTip]="nameErrTip">
<input nz-input formControlName="url"> <input nz-input formControlName="url">
<ng-template #nameErrTip> <ng-template #nameErrTip>
<div *ngIf="formGroup.controls.url.hasError('required')">网站链接不可为空</div> <div *ngIf="formGroup.controls.url.hasError('required')">网站链接不可为空</div>
@@ -37,13 +37,32 @@
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item> <nz-form-item>
<nz-form-label nzRequired>是否公开</nz-form-label> <nz-form-label nzFlex="80px" nzRequired>是否公开</nz-form-label>
<nz-form-control nzErrorTip="不可为空"> <nz-form-control nzFlex="auto" nzErrorTip="不可为空">
<nz-select nzPlaceHolder="请选择" formControlName="open" [nzAllowClear]="true"> <nz-select nzPlaceHolder="请选择" formControlName="open" [nzAllowClear]="true">
<nz-option [nzValue]="true" nzLabel="公开"></nz-option> <nz-option [nzValue]="true" nzLabel="公开"></nz-option>
<nz-option [nzValue]="false" nzLabel="不公开"></nz-option> <nz-option [nzValue]="false" nzLabel="不公开"></nz-option>
</nz-select> </nz-select>
</nz-form-control> </nz-form-control>
</nz-form-item> </nz-form-item>
<nz-form-item>
<nz-form-label nzFlex="80px">网站图标</nz-form-label>
<nz-form-control nzFlex="auto" nzErrorTip="链接格式不正确">
<nz-input-group [nzSuffix]="icon" nzSize="large">
<input nz-input formControlName="iconPath">
</nz-input-group>
<ng-template #icon>
<img style="width: 25px;height: 25px" *ngIf="formGroup.value.iconPath"
[src]="formGroup.value.iconPath" alt="icon">
</ng-template>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label nzFlex="80px">网站描述</nz-form-label>
<nz-form-control nzFlex="auto" nzErrorTip="可输入最大文字长度为255">
<textarea nz-input formControlName="desc" [nzAutosize]="{ minRows: 2, maxRows: 6 }"></textarea>
</nz-form-control>
</nz-form-item>
</form> </form>
</nz-modal> </nz-modal>

10
src/app/view/admin/admin-link/admin-link.component.ts
View File

@@ -22,6 +22,8 @@ export class AdminLinkComponent implements OnInit {
name: new FormControl(null, [Validators.required]), name: new FormControl(null, [Validators.required]),
url: new FormControl(null, [Validators.required, Validators.pattern(/^(https:\/\/|http:\/\/|)([\w-]+\.)+[\w-]+(\/[\w-./?%&=]*)?$/)]), url: new FormControl(null, [Validators.required, Validators.pattern(/^(https:\/\/|http:\/\/|)([\w-]+\.)+[\w-]+(\/[\w-./?%&=]*)?$/)]),
open: new FormControl(null, [Validators.required]), open: new FormControl(null, [Validators.required]),
desc: new FormControl(null, [Validators.maxLength(255)]),
iconPath: new FormControl(null, [Validators.pattern(/^(https:\/\/|http:\/\/|)([\w-]+\.)+[\w-]+(\/[\w-./?%&=]*)?$/)]),
oper: new FormControl(null) oper: new FormControl(null)
}) })
} }
@@ -83,13 +85,7 @@ export class AdminLinkComponent implements OnInit {
modalConfirm() { modalConfirm() {
this.modalVisible = false; this.modalVisible = false;
const linkReq: Link = new Link(); const linkReq: Link = this.formGroup.value
linkReq.name = this.formGroup.value.name;
linkReq.url = this.formGroup.value.url;
linkReq.open = this.formGroup.value.open;
// 暂时设置未空
linkReq.desc = '';
linkReq.iconPath = '';
const oper = this.formGroup.value.oper; const oper = this.formGroup.value.oper;
let observable: Observable<Response<Link>>; let observable: Observable<Response<Link>>;
if (oper === 'edit') { if (oper === 'edit') {