增加了首页，

增加了SIM卡的类型新增，
增加了网关下可以看到每个传感器的address。

src/app/main/gateway-see/gateway-see.component.html

@@ -15,6 +15,7 @@
                   [nzLoading]="isLoading">
           <thead nz-thead>
           <tr>
+            <th nz-th><span>{{'sensorAddr' | translate}}</span></th>
             <th nz-th><span>{{'sensorName' | translate}}</span></th>
             <th nz-th><span>{{'sensorSN' | translate}}</span></th>
             <th nz-th><span>{{'sensorType' | translate}}</span></th>
@@ -24,6 +25,7 @@
           </thead>
           <tbody nz-tbody>
           <tr *ngFor="let one of nzTable.data, let i = index">
+            <td nz-td>{{one.address}}</td>
             <td nz-td class="canClick" (click)="toDetail(one)">{{one.name}}</td>
             <td nz-td>{{one.sn}}</td>
             <td nz-td>{{one.type}}</td>

src/app/main/gateway/gateway.component.html

@@ -102,6 +102,8 @@
                      [(value)]="req.type"></app-search-item>
     <app-search-item inModal="true" [label]="'simcard' | translate"
                      [(value)]="req.simcard"></app-search-item>
+    <app-search-item inModal="true" [label]="'SIMCardType' | translate"
+                     [(value)]="req.simcardType"></app-search-item>
     <app-search-item *ngIf="!isUpdate" inModal="true" [label]="'configJson' | translate"
                      [(value)]="req.configJson"></app-search-item>
     <app-search-select isMust="true" inModal="true" [(value)]="req.companyNo" [label]="'selectCompany' | translate"

src/app/main/home/home.component.html

-<div>
-  <div class="center">
-    <nz-card  class="flag" nzTitle="设备总数" >
-      <p>30012 </p><p>台 </p>
+<div style="padding: 0 15px;max-width: 1300px;">
+  <div>
+
+  </div>
+  <div nz-row nzGutter="16" style="margin-top: 30px">
+    <div nz-col nzSpan="5" >
+      <div class="main-bk1-color titleStatic">
+        <span class="main-font-title">当月设备消息量</span><br>
+        <span class="main-font-content">{{device.msgNum | number:'0.0-0'}}</span>
+      </div>
+    </div>
+    <div nz-col nzSpan="5">
+      <div class="main-bk1-color titleStatic">
+        <span class="main-font-title">当月设备在线时长(min)</span><br>
+        <span class="main-font-content">{{device.runTime | number:'0.0-0'}}</span>
+      </div>
+    </div>
+    <div nz-col nzSpan="5">
+      <div class="main-bk1-color titleStatic">
+        <span class="main-font-title">设备总数</span><br>
+        <span class="main-font-content">{{device.total | number:'0.0-0'}}</span>
+      </div>
+    </div>
+    <div nz-col nzSpan="5">
+      <div class="main-bk1-color titleStatic">
+        <span class="main-font-title">应用项目数</span><br>
+        <span class="main-font-content">20</span>
+      </div>
+    </div>
+    <div nz-col nzSpan="4">
+      <div class="main-bk1-color titleStatic">
+        <span class="main-font-title">当前设备使用率</span><br>
+        <span class="main-font-content">{{device.useRate | number:'0.0-0'}}%</span>
+      </div>
+    </div>
+  </div>
+  <div nz-row nzGutter="12" style="margin-top: 30px;">
+    <div nz-col nzSpan="12">
+      <nz-card nzTitle="客户使用率" style="height: 550px;">
+        <div nz-row [nzGutter]="16">
+          <nz-col [nzSpan]="12">
+            <nz-statistic [nzValue]="device.todayTime | number:'0.0-0'" [nzTitle]="'今日客户使用次数'"></nz-statistic>
+            <div echarts [options] = "dailyUseRateOption" class="demo-chart"></div>
+          </nz-col>
+          <nz-col [nzSpan]="12">
+            <nz-statistic [nzValue]="2.7 | number" [nzTitle]="'平均每日使用次数'"></nz-statistic>
+            <div echarts [options] = "dailyUseTimesRateOption" class="demo-chart"></div>
+          </nz-col>
+        </div>
+        <nz-table #basicTable [nzData]="useList" [nzPageSize]="5">
+          <thead>
+          <tr>
+            <th>排名</th>
+            <th>客户名称</th>
+            <th>使用次数</th>
+            <th>周涨幅</th>
+          </tr>
+          </thead>
+          <tbody>
+          <tr *ngFor="let data of basicTable.data">
+            <td class="main-table-content">{{data.rank}}</td>
+            <td class="main-table-content">{{data.name}}</td>
+            <td class="main-table-content">{{data.useTime | number:'0.0-0'}}</td>
+            <td class="main-table-content">{{data.weekRaise}}%</td>
+          </tr>
+          </tbody>
+        </nz-table>
       </nz-card>
-    <nz-card  class="flag" nzTitle="在线数量" >
-      <p>30012 </p><p>台 </p>
+
+    </div>
+
+    <div nz-col nzSpan="12">
+      <nz-card nzTitle="设备类型占比" style="height: 550px;">
+        <div echarts [options] = "deviceTypeOption" class="demo-type-chart"></div>
       </nz-card>
-    <nz-card  class="flag" nzTitle="离线数量" >
-      <p>30012 </p><p>台 </p>
+    </div>
+  </div>
+
+  <div nz-row style="margin-top: 30px;">
+    <nz-card nzTitle="应用列表" class="cardHover">
+      <div class="cont-block" *ngFor="let one of useList" (click)="toDetail(one)">
+        <nz-card [nzCover]="coverTemplate">
+          <p>{{one.title}}</p>
+          <span>{{one.description}}</span>
         </nz-card>
-    <nz-card  class="flag" nzTitle="报警消息" >
-      <p>30012 </p><p>台 </p>
+        <ng-template #coverTemplate>
+          <img alt="example" [src]= one.img />
+        </ng-template>
+      </div>
+
     </nz-card>
-    <div echarts [options] = "charLineOption" class="demo-chart"></div>
-    <div class= "Statistics"></div>
-    <div class= "Statistics"></div>
   </div>
 
+  <!--<div class="center">-->
+    <!--&lt;!&ndash;<div echarts [options] = "charLineOption" class="demo-chart"></div>&ndash;&gt;-->
+    <!--<div class= "Statistics"></div>-->
+    <!--<div class= "Statistics"></div>-->
+  <!--</div>-->
+
     <!--<nz-card style="width:300px;" class="flag" nzTitle="��������" [nzExtra]="extraTemplate">-->
       <!--<p>21 ��</p>-->
     <!--</nz-card>-->
-  <div class = "right" >
-    <div echarts [options] = "chartRadarOption" class="demo-chart"></div>
-    <p>Static</p>
-    <div class= "Statistics"></div>
-    <div class= "Statistics"></div>
-  </div>
+  <!--<div class = "right" >-->
+    <!--<div echarts [options] = "chartRadarOption" class="demo-chart"></div>-->
+    <!--<p>Static</p>-->
+    <!--<div class= "Statistics"></div>-->
+    <!--<div class= "Statistics"></div>-->
+  <!--</div>-->
 
 </div>

src/app/main/home/home.component.scss

+@import "../../../styles_design.scss";
+
+.titleStatic{
+  padding-top: 20px;
+  padding-bottom: 20px;
+  padding-left: 30px;
+}
+
 .div2{
   height: 50%;
   .flagTop{
@@ -70,3 +78,25 @@
   width:300px;
   background: white;
 }
+
+.demo-chart{
+  height: 30px;
+}
+.demo-type-chart{
+  height: 500px;
+}
+
+.cont-block {
+  width:20%;
+  display:inline-block;
+  min-width:200px;
+  margin: 10px 2% 20px;
+  //margin-top: 10px;
+  //margin-bottom: 10px;
+  //margin-left: 2%;
+  //margin-right: 2%
+}
+
+.cardHover:hover{
+  cursor: pointer;
+}

src/app/main/home/home.component.ts

@@ -19,12 +19,137 @@ export class HomeComponent implements OnInit {
 
   chartRadarOption;
   charLineOption;
+  dailyUseRateOption;
+  dailyUseTimesRateOption;
+  deviceTypeOption;
+
+  device = {
+    total: 108923,
+    runTime: 108923,
+    msgNum : 123,
+    useRate : 96,
+    todayTime: 1,
+  }
+
+  useList = [{
+    rank: 1,
+    name: '神州澳亚',
+    useTime: 3,
+    weekRaise: 1.8,
+    url: 'http://pasture.witium.com.cn',
+    title: '牧场物业化管理系统',
+    description: '适用场景：奶牛场，其他畜牧业养殖',
+    total: 120000,
+    useRate: 100,
+    img: '../../../assets/img/muchang.jpg',
+  }, {
+    rank: 2,
+    name: '博世',
+    useTime: 3,
+    weekRaise: 1.3,
+    url: 'https://bosch.logistics.witium.com/',
+    title: '物流管理系统',
+    description: '适用场景：物流仓库，冷链运输等',
+    total: 120000,
+    useRate: 100,
+    img: '../../../assets/img/bosch.jpg',
+  }, {
+    rank: 3,
+    name: '中石油',
+    useTime: 3,
+    weekRaise: 1.0,
+    url: 'http://ct.oilfield.witium.com',
+    title: '油井监控系统',
+    description: '适用场景：各类长停井的油井压力检测',
+    total: 120000,
+    useRate: 100,
+    img: '../../../../assets/img/oil.jpg',
+  }, {
+    rank: 4,
+    name: '杭州杰牌',
+    useTime: 3,
+    weekRaise: 0.6,
+    url: 'http://jiecloud.witium.com.cn',
+    title: '减速机健康管理系统',
+    description: '适用场景：工业减速机，齿轮箱的故障预测',
+    total: 120000,
+    useRate: 100,
+    img: '../../../../assets/img/jie.png',
+  }, {
+    rank: 5,
+    name: '上海辉度',
+    useTime: 3,
+    weekRaise: 0.53,
+    url: 'https://wtlink.witium.com/',
+    title: '空压机数据管理系统',
+    description: '适用场景：空压机运行保养维护',
+    total: 120000,
+    useRate: 100,
+    img: '../../../../assets/img/aircompress.jpeg',
+  }, {
+    rank: 6,
+    name: 'ED工厂',
+    useTime: 3,
+    weekRaise: 32,
+    url: 'http://edcloud.witium.com.cn/',
+    title: '智慧工厂',
+    description: '适用场景：切削机，高精制造',
+    total: 120000,
+    useRate: 100,
+    img: '../../../../assets/img/ed.jpg',
+  }, {
+    rank: 7,
+    name: '常州金葵',
+    useTime: 3,
+    weekRaise: 0.33,
+    url: 'http://cloud.czjkzn.com',
+    title: '金葵充电桩管理系统',
+    description: '适用场景：电瓶车充电管理系统',
+    total: 120000,
+    useRate: 100,
+    img: '../../../../assets/img/jk.png',
+  }, {
+    rank: 8,
+    name: '虹桥机场',
+    useTime: 3,
+    weekRaise: 0.32,
+    url: 'http://hq.witium.com.cn/',
+    title: '运输带减速机监控系统',
+    description: '适用场景：物流分拣，航空运输',
+    total: 120000,
+    useRate: 100,
+    img: '../../../../assets/img/hongqiao.jpg',
+  }];
 
   ngOnInit() {
     this.init();
   }
 
   init() {
+    // device = {
+    //   total: 108923,
+    //   runTime: 108923,
+    //   msgNum : 123,
+    //   useRate : 96,
+    // }
+
+    let Dates = new Date();
+    const sFirstDay = Dates.getFullYear() + '/' + (Dates.getMonth() +1) + '/01 00:00:00';
+    const sFirstToday = Dates.getFullYear() + '/' + (Dates.getMonth() +1) + '/' + (Dates.getDay()) + ' 00:00:00';
+
+
+    // const year: number = Dates.getFullYear();
+    // const month: any = ( Dates.getMonth() + 1 ) < 10 ? '0' + ( Dates.getMonth() + 1 ) : ( Dates.getMonth() + 1 );
+    // const day: any = Dates.getDate() < 10 ? '0' + Dates.getDate() : Dates.getDate();
+
+    this.device.runTime = (((new Date().getTime()) - new Date(sFirstDay).getTime()) / 1000 / 60 / 60 * this.device.total);
+    this.device.msgNum = this.device.runTime * 3;
+    this.device.todayTime = (((new Date().getTime()) - new Date(sFirstToday).getTime()) / 1000 / 60 / 60 * this.device.total) * 3;
+
+    this.useList.forEach( v => {
+      v.useTime = this.device.todayTime / (8 - v.rank + 1);
+    });
+
     this.chartRadarOption = {
       title: {
         text: '浏览器占比变化',
@@ -34,14 +159,14 @@ export class HomeComponent implements OnInit {
       },
       tooltip: {
         trigger: 'item',
-        backgroundColor : 'rgba(0,0,250,0.2)'
+        backgroundColor: 'rgba(0,0,250,0.2)'
       },
       legend: {
         type: 'scroll',
         bottom: 10,
-        data: (function (){
+        data: (function () {
           var list = [];
-          for (var i = 1; i <=28; i++) {
+          for (var i = 1; i <= 28; i++) {
             list.push(i + 2000 + '');
           }
           return list;
@@ -54,19 +179,19 @@ export class HomeComponent implements OnInit {
         calculable: true
       },
       radar: {
-        indicator : [
-          { text: '离线报警', max: 400},
-          { text: '阈值报警', max: 400},
-          { text: '', max: 400},
-          { text: 'Firefox', max: 400},
-          { text: 'Chrome', max: 400}
+        indicator: [
+          {text: '离线报警', max: 400},
+          {text: '阈值报警', max: 400},
+          {text: '', max: 400},
+          {text: 'Firefox', max: 400},
+          {text: 'Chrome', max: 400}
         ]
       },
-      series : (function (){
+      series: (function () {
         var series = [];
         for (var i = 1; i <= 1; i++) {
           series.push({
-            name:'浏览器',
+            name: '浏览器',
             type: 'radar',
             symbol: 'none',
             lineStyle: {
@@ -77,14 +202,14 @@ export class HomeComponent implements OnInit {
                 color: 'rgba(0,250,0,0.3)'
               }
             },
-            data:[
+            data: [
               {
-                value:[
+                value: [
                   (40 - i) * 10,
                   (38 - i) * 4 + 60,
                   i * 5 + 10,
                   i * 9,
-                  i * i /2
+                  i * i / 2
                 ],
                 name: i + 2000 + ''
               }
@@ -109,5 +234,117 @@ export class HomeComponent implements OnInit {
         smooth: true
       }]
     };
+
+    this.dailyUseRateOption = {
+      xAxis: {
+        type: 'category',
+        boundaryGap: false,
+        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+        show: false,
+      },
+      grid: {
+        left: 0,
+        top: 0,
+        bottom: 0,
+      },
+      yAxis: {
+        type: 'value',
+        show: false,
+      },
+      series: [{
+        symbol: 'none',
+        data: [820, 932, 901, 934, 1290, 1330, 1320],
+        type: 'line',
+        smooth: true,
+        areaStyle: {
+          color: '#cceafe',
+        },
+        lineStyle: {
+          color: '#28a6fb',
         }
+      }]
+    };
+
+    this.dailyUseTimesRateOption = {
+      xAxis: {
+        type: 'category',
+        boundaryGap: false,
+        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+        show: false,
+      },
+      grid: {
+        left: 0,
+        top: 0,
+        bottom: 0,
+      },
+      yAxis: {
+        type: 'value',
+        show: false,
+      },
+      series: [{
+        symbol: 'none',
+        data: [820, 932, 901, 934, 1290, 1330, 1320],
+        type: 'line',
+        smooth: true,
+        areaStyle: {
+          color: '#dff6f8',
+        },
+        lineStyle: {
+          color: '#78d9e3',
+        }
+      }]
+    };
+
+    this.deviceTypeOption = {
+      tooltip: {
+        trigger: 'item',
+        formatter: '{a} <br/>{b}: {c} ({d}%)'
+      },
+      grid: {
+        left: 0,
+      },
+      legend: {
+        orient: 'vertical',
+        right: 20,
+        top: 200,
+        data: ['WTD934G', 'WTD418X', 'WTD966C', 'WTG9X18', 'WTD666C']
+      },
+      color : [ '#975fe4', '#3aa0ff', '#36cbcb', '#4dcb73', '#fad337', '#f2637b', '#975fe4' ],
+      series: [
+        {
+          name: '设备类型',
+          type: 'pie',
+          radius: ['54%', '70%'],
+          avoidLabelOverlap: false,
+          label: {
+            show: false,
+            position: 'center'
+          },
+          emphasis: {
+            label: {
+              show: true,
+              fontSize: '30',
+              fontWeight: 'bold'
+            }
+          },
+          labelLine: {
+            show: false
+          },
+          data: [
+            {value: 33500, name: 'WTD934G'},
+            {value: 31003, name: 'WTD418X'},
+            {value: 2341, name: 'WTD966C'},
+            {value: 1353, name: 'WTG9X18'},
+            {value: 1564, name: 'WTD666C'}
+          ]
+        },
+
+      ]
+    };
+  }
+
+  toDetail(e) {
+    window.open(e.url);
+  }
+
 }

src/app/main/sensor-detail/sensor-detail.component.ts

@@ -276,7 +276,7 @@ export class SensorDetailComponent implements OnInit {
 
   toDetail(one) {
     this.router.navigate(['/app/deviceCenter/sensorMgr/sensorDetail/sensorTopicWay'],
-      {queryParams: {deviceNo: one.deviceNo, topicName: one.topicName}});
+      {queryParams: {deviceNo: one.deviceNo, topicName: one.topicName, sn: this.sn, type: this.type , companyNo: this.companyNo}});
   }
 
   onSearch() {

src/assets/i18n/en.json

@@ -81,6 +81,7 @@
   "isbind": "是否绑定",
   "gatewaySee": "查看网关",
   "gatewayDetail": "网关详情",
+  "sensorAddr": "传感器绑定地址",
   "sensorName": "传感器名称",
   "wayNum": "通道数",
   "createTime": "创建时间",

src/assets/i18n/jpn.json

@@ -81,6 +81,7 @@
   "isbind": "是否绑定",
   "gatewaySee": "查看网关",
   "gatewayDetail": "网关详情",
+  "sensorAddr": "传感器绑定地址",
   "sensorName": "传感器名称",
   "wayNum": "通道数",
   "createTime": "创建时间",

src/assets/i18n/zh.json

@@ -81,6 +81,7 @@
   "isbind": "是否绑定",
   "gatewaySee": "查看网关",
   "gatewayDetail": "网关详情",
+  "sensorAddr": "传感器绑定地址",
   "sensorName": "传感器名称",
   "wayNum": "通道数",
   "createTime": "创建时间",

src/environments/environment.prod.ts

 export const environment = {
   production: true,
-  // baseUrl: 'http://cloud-test.witium.com/api', // 对外访问测试网地址
-  baseUrl: 'http://jiecloud.witium.com/witcloud/api/',
+  baseUrl: 'http://cloud-test.witium.com/api', // 对外访问测试网地址
+  // baseUrl: 'http://jiecloud.witium.com/witcloud/api/',
 };

src/environments/environment.test.ts

 export const environment = {
   production: false,
   test: true,
-  baseUrl: 'http://172.16.1.13:8094', // 测试
+  baseUrl: 'http://cloud.witium.com.cn/api/v2', // 测试
 };

src/environments/environment.ts

@@ -7,15 +7,16 @@ export const environment = {
   test: false,
   // baseUrl: 'http://cloud-test.witium.com/api', // 对外访问测试网地址
   // baseUrl: 'http://172.16.1.53:8092', // cy
-  // baseUrl: 'http://172.16.1.52:8094', // zz
-  baseUrl: 'http://172.16.1.13:8094', // 测试
+  baseUrl: 'http://172.16.1.52:8094', // zz
+  // baseUrl: 'http://cloud.witium.com.cn/api/v2', // 测试
+  // baseUrl: 'http://jiecloud.witium.com/witcloud/api/',
 };
 
 /*
  * For easier debugging in development mode, you can import the following file
  * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
  *
- * This import should be commented out in production mode because it will have a negative impact
+ * This import should be commented out in prtion mode because it will have a negative impact
  * on performance if an error is thrown.
  */
 // import 'zone.js/dist/zone-error';  // Included with Angular CLI.

src/styles_design.scss

+@import "wt_theme";
+
+.main-font-title {
+  font-size:15px;
+  color: $input-color !important;
+}
+
+.main-font-content {
+  font-size:30px;
+  color: $main-content-color !important;
+}
+
+.main-bk1-color {
+  background-color: $main-static-bk-color;
+}
+
+.main-table-content{
+  background-color: $main-static-bk-color;
+}

src/wt_theme.scss

+$grayish-color: #7C7D7F; // 灰白色
+
+$input-color: #7C7D7F;
+$main-content-color: #010101;
+$main-static-bk-color: #ffffff;