angular-material-app documentation
  1. Components
  2. SettingComponent

File

src/app/apm/manage/setting/setting.component.ts

Implements

OnInit

Metadata

selector app-setting
styleUrls ./setting.component.scss
templateUrl ./setting.component.html

Index

Methods

Constructor

constructor()
Defined in src/app/apm/manage/setting/setting.component.ts:8

Methods

ngOnInit
ngOnInit()
Defined in src/app/apm/manage/setting/setting.component.ts:12
Returns : void 
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-setting',
  templateUrl: './setting.component.html',
  styleUrls: ['./setting.component.scss']
})
export class SettingComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}
Copy
<mat-tab-group class="s mat-elevation-z4">
  <mat-tab label="部署说明">
    <div>APPID：FYz34dy1546672920722</div>
    <mat-slide-toggle>数据接收</mat-slide-toggle>
    <div>使用SDK部署方式</div>
  </mat-tab>
  <mat-tab label="阈值设置">
    <form class="p-24">
      <div fxLayout="row" fxLayoutAlign="center center">
        <label>应用名称：</label>
        <mat-form-field fxFlex> <input matInput /> </mat-form-field>
      </div>
      <div fxLayout="row" fxLayoutAlign="center center">
        <label>应用域名：</label>
        <mat-form-field fxFlex> <input matInput /> </mat-form-field>
      </div>
      <div fxLayout="row" fxLayoutAlign="center center">
        <label>页面慢加载阀值：</label>
        <mat-form-field fxFlex> <input matInput /> </mat-form-field>
      </div>
      <div fxLayout="row" fxLayoutAlign="center center">
        <label>AJAX慢加载阀值：</label>
        <mat-form-field fxFlex> <input matInput /> </mat-form-field>
      </div>
      <div fxLayout="row" fxLayoutAlign="center center">
        <label>JS慢加载阀值：</label>
        <mat-form-field fxFlex> <input matInput /> </mat-form-field>
      </div>
      <div fxLayout="row" fxLayoutAlign="center center">
        <label>CSS慢加载阀值：</label>
        <mat-form-field fxFlex> <input matInput /> </mat-form-field>
      </div>
      <div fxLayout="row" fxLayoutAlign="center center">
        <label>IMG慢加载阀值：</label>
        <mat-form-field fxFlex> <input matInput /> </mat-form-field>
      </div>

      <button mat-raised-button color="primary" type="submit">更新</button>
    </form>
  </mat-tab>
  <mat-tab label="统计设置">
    <form class="p-24">
      <div><mat-slide-toggle>页面性能指标</mat-slide-toggle></div>
      <div><mat-slide-toggle>AJAX性能指标</mat-slide-toggle></div>
      <div><mat-slide-toggle>资源性能指标</mat-slide-toggle></div>
      <div><mat-slide-toggle>存储访问者系统信息</mat-slide-toggle></div>
      <div><mat-slide-toggle>错误信息</mat-slide-toggle></div>
    </form>
  </mat-tab>
  <mat-tab label="日报设置">
    <mat-slide-toggle>发送日报</mat-slide-toggle>
  </mat-tab>
  <mat-tab label="性能优化"> </mat-tab>
</mat-tab-group>
Copy

./setting.component.scss 

:host {
  display: block;
  margin: 24px;
}
Copy
Legend
Html element
Component
Html element with directive

result-matching ""

    No results matching ""