src/app/routes/systems/account/account-edit/account-edit.component.html
@@ -1,49 +1,48 @@ <div class="modal-header"> <div class="modal-title">{{account.id > 0 ? '编辑' : '添加'}} - 账户</div> </div> <form #f="ngForm" (ngSubmit)="save()" nz-form [nzType]="'horizontal'"> <form (ngSubmit)="save()" nz-form [nzType]="'horizontal'" [formGroup]="validateForm"> <div nz-form-item nz-row class="mb-sm"> <div nz-form-label nz-col [nzSpan]="4"> <label>账号</label> <label nz-form-item-required>账号</label> </div> <div nz-form-control nz-col [nzSpan]="8"> <input nz-input [(ngModel)]="account.accountName" name="name" maxlength="30" required [nzDisabled]="account.id > 0 ? true : false" /> <div nz-form-control nz-col [nzSpan]="8" nzHasFeedback [nzValidateStatus]="accountName"> <input nz-input formControlName="accountName" maxlength="30" required [nzDisabled]="account.id > 0 ? true : false" /> <div nz-form-explain *ngIf="validateForm.controls.accountName.dirty&&validateForm.controls.accountName.hasError('required')">Please input your username!</div> </div> <div nz-form-label nz-col [nzSpan]="4"> <label>电话</label> </div> <div nz-form-control nz-col [nzSpan]="8"> <input nz-input [(ngModel)]="account.mobile" name="mobile" maxlength="11" required /> <div nz-form-control nz-col [nzSpan]="8" > <input nz-input maxlength="11" formControlName="mobile"/> </div> </div> <div nz-form-item nz-row class="mb-sm"> <div nz-form-label nz-col [nzSpan]="4"> <label>电子邮件</label> </div> <div nz-form-control nz-col [nzSpan]="8"> <input nz-input [(ngModel)]="account.email" name="email" required /> <div nz-form-control nz-col [nzSpan]="8" > <input nz-input formControlName="email" /> </div> <div nz-form-label nz-col [nzSpan]="4"> <label>微信号</label> </div> <div nz-form-control nz-col [nzSpan]="8"> <input nz-input [(ngModel)]="account.weixin" name="weixin" /> <div nz-form-control nz-col [nzSpan]="8" > <input nz-input formControlName="weixin" /> </div> </div> <div nz-form-item nz-row class="mb-sm"> <div nz-form-label nz-col [nzSpan]="4"> <label>组织</label> </div> <div nz-form-control nz-col [nzSpan]="8"> <input nz-input [(ngModel)]="account.organizationId" name="organizationId" maxlength="20" placeholder="20字以内" /> <div nz-form-control nz-col [nzSpan]="8" > <input nz-input formControlName="organizationId" maxlength="20" placeholder="20字以内" /> </div> <div nz-form-label nz-col [nzSpan]="4"> <label>过期日期</label> </div> <div nz-form-control nz-col [nzSpan]="8"> <div nz-form-control [nzValidateStatus]="expireTime" > <nz-datepicker [(ngModel)]="account.expireTime" name="expireTime"></nz-datepicker> </div> <div nz-form-control nz-col [nzSpan]="8" > <nz-datepicker formControlName="expireTime" nzShowTime></nz-datepicker> </div> </div> <!-- <div nz-form-item nz-row class="mb-sm"> src/app/routes/systems/account/account-edit/account-edit.component.ts
@@ -4,6 +4,7 @@ import {HttpClient} from '@angular/common/http'; import {environment} from '../../../../../environments/environment'; import {DateService} from '../../../../core/services/date.service'; import {FormGroup, FormBuilder, Validators} from '@angular/forms'; @Component({ selector: 'app-account-edit', @@ -13,23 +14,46 @@ export class AccountEditComponent implements OnInit { account: any; validateForm: FormGroup; constructor(private modalHelper: ModalHelper, private subject: NzModalSubject, public dateSrv: DateService, public msgSrv: NzMessageService, public http: HttpClient) {} public http: HttpClient, private formBuilder: FormBuilder ) { } ngOnInit() { } save() { this.http.post(environment.SERVER_BASH_URL + '/account/account', this.account).subscribe(() => { this.subject.next('true'); this.close(); this.validateForm = this.formBuilder.group({ accountName: [this.account.accountName], mobile: [this.account.mobile], email: [this.account.email], weixin: [this.account.weixin], organizationId: [this.account.organizationId], expireTime: [this.account.expireTime], id:[this.account.id] }); } save() { if (this.validateForm.valid) { for (const i in this.validateForm.controls) { this.validateForm.controls[i].disable(); } this.http.post(environment.SERVER_BASH_URL + '/account/account', this.validateForm.value).subscribe(() => { this.subject.next('true'); this.close(); }); } else { for (const i in this.validateForm.controls) { this.validateForm.controls[i].markAsDirty(); } } } close() { this.subject.destroy(); } src/app/routes/systems/account/account.component.html
@@ -43,11 +43,11 @@ </form> <div class="mb-md"> <button nz-button (click)="add()" [nzType]="'primary'" [nzSize]="'large'"> <button nz-button (click)="edit()" [nzType]="'primary'" [nzSize]="'large'"> <i class="anticon anticon-plus"></i><span>新建</span> </button> <ng-container *ngIf="selectedRows.length > 0"> <button nz-button [nzSize]="'large'" (click)="remove()">批量删除</button> <button nz-button [nzSize]="'large'" (click)="remove()" >批量删除</button> </ng-container> </div> @@ -72,7 +72,9 @@ <th nz-th [nzCheckbox]="true"> <label nz-checkbox [(ngModel)]="allChecked" [nzIndeterminate]="indeterminate" (ngModelChange)="checkAll($event)"></label> </th> <th nz-th><span>账号</span></th> <th nz-th><span>账号</span> <nz-table-sort (nzValueChange)="sort('account_name', $event)"></nz-table-sort> </th> <th nz-th><span>电话</span></th> <th nz-th><span>电子邮件</span></th> <th nz-th><span>微信号</span></th> @@ -81,7 +83,7 @@ <th nz-th><span>创建日期</span></th> <th nz-th> <span>过期日期</span> <nz-table-sort [(nzValue)]="sortMap.updatedAt" (nzValueChange)="sort('expire_time', $event)"></nz-table-sort> <nz-table-sort (nzValueChange)="sort('expire_time', $event)"></nz-table-sort> </th> <th nz-th><span>操作</span></th> </tr> @@ -103,7 +105,7 @@ <a (click)="edit(account)">编辑</a> <ng-container *ngIf="account.isDelete == '0'"> <span nz-table-divider></span> <nz-popconfirm [nzTitle]="'确定要删除该用户吗?'" [nzOkText]="'Yes'" [nzCancelText]="'No'" (nzOnConfirm)="delete(account)" > <nz-popconfirm [nzTitle]="'确定要删除该数据吗?'" [nzOkText]="'Yes'" [nzCancelText]="'No'" (nzOnConfirm)="remove(account.id)" > <a nz-popconfirm>删除</a> </nz-popconfirm> </ng-container> src/app/routes/systems/account/account.component.ts
@@ -1,5 +1,5 @@ import {Component, OnInit} from '@angular/core'; import {NzMessageService} from 'ng-zorro-antd'; import {NzMessageService, NzModalService} from 'ng-zorro-antd'; import {ModalHelper} from '@delon/theme'; import {HttpClient} from '@angular/common/http'; import * as moment from 'moment'; @@ -31,18 +31,20 @@ selectedRows: any[] = []; allChecked = false; indeterminate = false; sortMap: any = {}; sortMap: string[] = []; constructor( public http: HttpClient, private confirmServ: NzModalService, public dateSrv: DateService, public msgSrv: NzMessageService, private modalHelper: ModalHelper) { private modalHelper: ModalHelper ) { } load(reload: boolean = false) { if (reload) { if (reload) { this.query.pageIndex = 1; } this.http.get(environment.SERVER_BASH_URL + '/account/list', {params: this.query}).subscribe((res: any) => { @@ -58,23 +60,30 @@ } edit(account) { this.modalHelper.static(AccountEditComponent, {account}).subscribe(() => { this.load(true); this.msgSrv.success('账户修改成功！'); if (account == null) { account = {}; } this.modalHelper.static(AccountEditComponent, {account}).subscribe((res: any) => { if (res.code == 0) { this.msgSrv.error(res.message); } else { this.msgSrv.success('账户保存成功！'); this.load(true); } }); } add() { const account = {}; this.modalHelper.static(AccountEditComponent, {account}).subscribe(() => { this.load(true); this.msgSrv.success('账户保存成功！'); }); } delete(account) { this.http.post(environment.SERVER_BASH_URL + '/account/account/id' , account).subscribe((res: any) => { if(res.data > 0){ remove(accountId) { const ids = []; if (accountId == null) { this.selectedRows.forEach(i => { ids.push(i.id); }); } else { ids.push(accountId); } this.http.post(environment.SERVER_BASH_URL + '/account/ids', ids).subscribe((res: any) => { if (res.data > 0) { this.msgSrv.success('账户删除成功！'); this.load(true); } else { @@ -83,19 +92,13 @@ }); } remove() { const ids = []; this.selectedRows.forEach(i => { ids.push(i.id); }); this.http.post(environment.SERVER_BASH_URL + '/account/accounts/ids', ids).subscribe((res: any) => { this.load(true); }); } checkAll(value: boolean) { this.data.forEach(i => { i.checked = value; if (i.isDelete == '1') { i.checked = false; } else { i.checked = value; } }); this.refreshStatus(); } @@ -109,9 +112,17 @@ } sort(field: string, value: any) { this.sortMap = {}; this.sortMap[field] = value; this.query.sorter = value ? `${field} ${value}` : ''; const ids = this.sortMap; this.sortMap = []; ids.forEach(i => { if (!i.startsWith(field)) { this.sortMap.push(i); } }); if (value != null) { this.sortMap.push(`${field} ${value}`); } this.query.sorter = this.sortMap.length > 0 ? this.sortMap.join(",") : ''; this.load(true); }
