报警用户管理

xufenglei

2018-01-09 325fcff34959e7b184675fdbafa14d439cf6b066

报警用户管理

 src/app/routes/systems/account/account-edit/account-edit.component.ts

@@ -1,12 +1,8 @@
import {NzModalSubject, NzMessageService} from 'ng-zorro-antd';
import {NzModalSubject} from 'ng-zorro-antd';
import {Component, OnInit} from '@angular/core';
import {ModalHelper} from '@delon/theme';
import {HttpClient} from '@angular/common/http';
import {environment} from '../../../../../environments/environment';
import {DateService} from '../../../../core/services/date.service';
import {FormGroup, FormBuilder, Validators, FormControl} from '@angular/forms';
import {Jsonp} from '@angular/http';
import {Observable} from 'rxjs';
import {FormGroup, FormBuilder, FormControl, Validators} from '@angular/forms';

@Component({
  selector: 'app-account-edit',
@@ -19,10 +15,8 @@
  validateForm: FormGroup;
  searchOptions = [];

  constructor(private modalHelper: ModalHelper,
  constructor(
    private subject: NzModalSubject,
    public dateSrv: DateService,
    public msgSrv: NzMessageService,
    public http: HttpClient,
    private formBuilder: FormBuilder
  ) {
@@ -67,8 +61,6 @@
      this.http.get(environment.SERVER_BASH_URL + '/account/' + accountName).subscribe((res: any) => {
        if (res.data > 0) {
          this.validateForm.controls.accountName.setErrors({unique: true});
        } else {
          this.validateForm.controls.accountName.reset;
        }
      });
    } else {

 src/app/routes/systems/account/account.component.html

@@ -29,7 +29,7 @@
                    </div>
                    <div nz-form-control class="flex-1">
                        <nz-select [(ngModel)]="query.isDelete" name="isDelete" [nzSize]="'large'">
                            <nz-option *ngFor="let option of options" [nzLabel]="option.label" [nzValue]="option.value" ></nz-option>
                            <nz-option *ngFor="let option of isDeleteOptions" [nzLabel]="option.label" [nzValue]="option.value" ></nz-option>
                        </nz-select>
                    </div>
                </div>

 src/app/routes/systems/account/account.component.ts

@@ -2,7 +2,6 @@
import {NzMessageService, NzModalService} from 'ng-zorro-antd';
import {ModalHelper} from '@delon/theme';
import {HttpClient} from '@angular/common/http';
import * as moment from 'moment';
import {environment} from '../../../../environments/environment';
import {DateService} from '../../../core/services/date.service';
import {AccountEditComponent} from './account-edit/account-edit.component';
@@ -14,7 +13,7 @@

export class AccountComponent implements OnInit {

  options = [
  isDeleteOptions = [
    {value: '1', label: '是'},
    {value: '0', label: '否'}
  ];
@@ -22,7 +21,7 @@
  query: any = {
    pageIndex: 1,
    pageSize: 10,
    isDelete: this.options[1].value
    isDelete: this.isDeleteOptions[1].value
  };
  data: any[] = [];
  total: 0;
@@ -120,9 +119,9 @@
  }

  sort(field: string, value: any) {
    const ids = this.sortMap;
    const temp = this.sortMap;
    this.sortMap = [];
    ids.forEach(i => {
    temp.forEach(i => {
      if (!i.startsWith(field)) {
        this.sortMap.push(i);
      }

 src/app/routes/users/alarm-user/alarm-user-edit/alarm-user-edit.component.html

@@ -1,48 +1,51 @@
<div class="modal-header">
    <div class="modal-title">{{alarmUser.id > 0 ? '编辑' : '添加'}} - 账户</div>
    <div class="modal-title">{{alarmUser.id > 0 ? '编辑' : '添加'}} - 报警用户</div>
</div>
<form #f="ngForm" (ngSubmit)="save()" nz-form [nzType]="'horizontal'">
<form #f="ngForm" (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>用户名</label>
        </div>
        <div nz-form-control nz-col [nzSpan]="8">
            <input nz-input [(ngModel)]="alarmUser.name" name="name" maxlength="30" required [nzDisabled]="alarmUser.id > 0 ? true : false" />
        <div nz-form-control nz-col [nzSpan]="8" nzHasFeedback>
            <input nz-input formControlName="name"/>
        </div>
        <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)]="alarmUser.mobile" name="mobile" maxlength="11" required />
        <div nz-form-control nz-col [nzSpan]="8" nzHasFeedback>
            <input nz-input formControlName="mobile" maxlength="11" required/>
        </div>
    </div>
    <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)]="alarmUser.email" name="email" required />
        <div nz-form-control nz-col [nzSpan]="8" nzHasFeedback>
            <input nz-input formControlName="email" required/>
        </div>
        <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)]="alarmUser.weixin" name="weixin" />
        <div nz-form-control nz-col [nzSpan]="8" nzHasFeedback>
            <input nz-input formControlName="weixin" required/>
        </div>
    </div>
    <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)]="alarmUser.organizationId" name="organizationId" maxlength="20" placeholder="20字以内" />
        <div nz-form-control nz-col [nzSpan]="8" nzHasFeedback>
            <nz-select style="width: 290px;" nzAllowClear [nzPlaceHolder]="'input search text'" [nzFilter]="false" nzShowSearch 
                formControlName="organizationId" (nzSearchChange)="searchChange($event)" [nzNotFoundContent]="'无法找到'" required> 
                <nz-option *ngFor="let option of searchOptions"  [nzLabel]="option['name']" [nzValue]="option['id']"> </nz-option> 
            </nz-select>
        </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)]="alarmUser.expireTime" name="expireTime"></nz-datepicker>
        <div nz-form-control nz-col [nzSpan]="8" nzHasFeedback>
            <div nz-form-control>
                <nz-datepicker  style="width: 290px;" formControlName="expireTime"></nz-datepicker>
            </div>
        </div>
    </div>

 src/app/routes/users/alarm-user/alarm-user-edit/alarm-user-edit.component.ts

@@ -1,9 +1,8 @@
import { environment } from '../../../../../environments/environment';
import { DateService } from '../../../../core/services/date.service';
import { Component, OnInit } from '@angular/core';
import { ModalHelper } from '@delon/theme';
import { NzModalSubject, NzMessageService } from 'ng-zorro-antd';
import {NzModalSubject} from 'ng-zorro-antd';
import {Component, OnInit} from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {environment} from '../../../../../environments/environment';
import {FormGroup, FormBuilder, FormControl, Validators} from '@angular/forms';

@Component({
  selector: 'app-alarm-user-edit',
@@ -13,25 +12,57 @@
export class AlarmUserEditComponent implements OnInit {

  alarmUser: any;
  validateForm: FormGroup;
  searchOptions = [];

  constructor(private modalHelper: ModalHelper,
  constructor(
    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 + '/alarmUser/alarmUser', this.alarmUser).subscribe(() => {
      this.subject.next('true');
      this.close();
    this.validateForm = this.formBuilder.group({
      name: [this.alarmUser.name],
      mobile: [this.alarmUser.mobile, [Validators.pattern("^((13[0-9])|(14[5|7])|(15([0-3]|[5-9]))|(18[0,5-9]))\\d{8}$")]],
      email: [this.alarmUser.email,[Validators.email]],
      weixin: [this.alarmUser.weixin],
      organizationId: [this.alarmUser.organizationId],
      expireTime: [this.alarmUser.expireTime],
      id: [this.alarmUser.id]
    });
    this.searchOptions = this.alarmUser.organization ? [this.alarmUser.organization] : [];
  }

  save() {
    if (this.validateForm.valid) {
      for (const i in this.validateForm.controls) {
        this.validateForm.controls[i].disable();
      }
      this.http.post(environment.SERVER_BASH_URL + '/alarmUser/alarmUser', 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();
  }

  searchChange(searchText) {
    if (searchText) {
      const query = encodeURI(searchText);
      if (query) {
        this.http.get(environment.SERVER_BASH_URL + '/organization/list/' + query).subscribe((res: any) => {
          this.searchOptions = res.data;
        });
      }
    }
  }

}

 src/app/routes/users/alarm-user/alarm-user.component.html

@@ -5,10 +5,10 @@
            <div nz-col [nzSpan]="8" class="mb-md">
                <div nz-form-item class="d-flex">
                    <div nz-form-label>
                        <label>账号</label>
                        <label>用户名</label>
                    </div>
                    <div nz-form-control class="flex-1">
                        <nz-input [(ngModel)]="query.name" name="name" [nzSize]="'large'" [nzPlaceHolder]="'请输入账号'"></nz-input>
                        <nz-input [(ngModel)]="query.name" name="name" [nzSize]="'large'" [nzPlaceHolder]="'请输入用户名'"></nz-input>
                    </div>
                </div>
            </div>
@@ -29,7 +29,7 @@
                    </div>
                    <div nz-form-control class="flex-1">
                        <nz-select [(ngModel)]="query.isDelete" name="isDelete" [nzSize]="'large'">
                            <nz-option *ngFor="let option of options" [nzLabel]="option.label" [nzValue]="option.value" ></nz-option>
                            <nz-option *ngFor="let option of isDeleteOptions" [nzLabel]="option.label" [nzValue]="option.value" ></nz-option>
                        </nz-select>
                    </div>
                </div>
@@ -43,7 +43,7 @@
    </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"> &nbsp;
@@ -61,7 +61,7 @@

    <nz-table   #nzTable
                [nzAjaxData]="data"
                [nzLoading]="http.loading"
                [nzLoading]="loading"
                [nzTotal]="total"
                [(nzPageIndex)]="query.pageIndex"
                [nzPageSize]="query.pageSize"
@@ -72,7 +72,7 @@
                <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></th>
                <th nz-th><span>电话</span></th>
                <th nz-th><span>电子邮件</span></th>
                <th nz-th><span>微信号</span></th>
@@ -96,14 +96,14 @@
                <td nz-td>{{alarmUser.email}}</td>
                <td nz-td>{{alarmUser.weixin}}</td>
                <!-- <td nz-td>{{alarmUser.password}}</td> -->
                <td nz-td>{{alarmUser.organizationId}}</td>
                <td nz-td>{{alarmUser.organization?alarmUser.organization.name:alarmUser.organizationId}}</td>
                <td nz-td>{{format_date(alarmUser.createTime)}}</td>
                <td nz-td>{{format_date(alarmUser.expireTime)}}</td>
                <td nz-td>
                    <a (click)="edit(alarmUser)">编辑</a>
                    <ng-container *ngIf="alarmUser.isDelete == '0'">
                        <span nz-table-divider></span>
                        <nz-popconfirm  [nzTitle]="'确定要删除该用户吗?'" [nzOkText]="'Yes'" [nzCancelText]="'No'" (nzOnConfirm)="delete(alarmUser)" >
                        <nz-popconfirm  [nzTitle]="'确定要删除该用户吗?'" [nzOkText]="'Yes'" [nzCancelText]="'No'" (nzOnConfirm)="delete(alarmUser.id)" >
                            <a nz-popconfirm>删除</a>
                        </nz-popconfirm>
                    </ng-container>

 src/app/routes/users/alarm-user/alarm-user.component.ts

@@ -1,11 +1,10 @@
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';
import {environment} from '../../../../environments/environment';
import {DateService} from '../../../core/services/date.service';
import { AlarmUserEditComponent } from './alarm-user-edit/alarm-user-edit.component';
import {AlarmUserEditComponent} from './alarm-user-edit/alarm-user-edit.component';

@Component({
  selector: 'app-alarm-user',
@@ -14,7 +13,7 @@
})
export class AlarmUserComponent implements OnInit {

  options = [
  isDeleteOptions = [
    {value: '1', label: '是'},
    {value: '0', label: '否'}
  ];
@@ -22,7 +21,7 @@
  query: any = {
    pageIndex: 1,
    pageSize: 10,
    isDelete: this.options[1].value
    isDelete: this.isDeleteOptions[1].value
  };
  data: any[] = [];
  total: 0;
@@ -30,18 +29,21 @@
  selectedRows: any[] = [];
  allChecked = false;
  indeterminate = false;
  sortMap: any = {};
  sortMap: string[] = [];
  loading: boolean = true;

  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 + '/alarmUser/list', {params: this.query}).subscribe((res: any) => {
@@ -49,6 +51,7 @@
      this.total = res.data.total;

      this.refreshStatus();
      this.loading = false;
    });
  }

@@ -56,39 +59,43 @@
    this.load();
  }

  edit(alarmUser) {
    this.modalHelper.static(AlarmUserEditComponent, {alarmUser}).subscribe(() => {
      this.load(true);
      this.msgSrv.success('账户修改成功！');
    });
  }

  add() {
    const alarmUser = {};
    this.modalHelper.static(AlarmUserEditComponent, {alarmUser}).subscribe(() => {
      this.load(true);
      this.msgSrv.success('账户保存成功！');
    });
  }

  delete(alarmUser) {
    this.http.post(environment.SERVER_BASH_URL + '/alarmUser/alarmUser/id' , alarmUser).subscribe((res: any) => {
      if(res.data > 0){
        this.msgSrv.success('账户删除成功！');
        this.load(true);
      } else {
  edit(alarmUser?: any) {
    if (!alarmUser) {
      alarmUser = {};
    }
    this.modalHelper.static(AlarmUserEditComponent, {alarmUser}).subscribe((res: any) => {
      if (res.code == 0) {
        this.msgSrv.error(res.message);
      } else {
        this.msgSrv.success('账户保存成功！');
        this.load(true);
      }
    });
  }

  remove() {
    const ids = [];
    this.selectedRows.forEach(i => {
      ids.push(i.id);
    const ids: number[] = [];
    this.confirmServ.confirm({
      title: '批量删除',
      content: '确定要删除该数据吗?',
      okText: '确定',
      cancelText: '取消'
    }).on('onOk', () => {
      this.selectedRows.forEach(i => {
        ids.push(i.id);
      });
      this.delete(...ids);
    });
    this.http.post(environment.SERVER_BASH_URL + '/alarmUser/alarmUsers/ids', ids).subscribe((res: any) => {
      this.load(true);
  }

  delete(...ids: number[]) {
    this.http.post(environment.SERVER_BASH_URL + '/alarmUser/ids', ids).subscribe((res: any) => {
      if (res.data > 0) {
        this.msgSrv.success('账户删除成功！');
        this.load(true);
      } else {
        this.msgSrv.error(res.message);
      }
    });
  }

@@ -112,14 +119,23 @@
  }

  sort(field: string, value: any) {
    this.sortMap = {};
    this.sortMap[field] = value;
    this.query.sorter = value ? `${field} ${value}` : '';
    const temp = this.sortMap;
    this.sortMap = [];
    temp.forEach(i => {
      if (!i.startsWith(field)) {
        this.sortMap.push(i);
      }
    });
    if (value) {
      this.sortMap.push(`${field} ${value}`);
    }
    this.query.sorter = this.sortMap.length > 0 ? this.sortMap.join(",") : '';
    this.load(true);
  }

  format_date(date) {
    return this.dateSrv.date_format(date, 'YYYY-MM-DD');
    if (date) {
      return this.dateSrv.date_format(date, 'YYYY-MM-DD');
    }
  }

}