shaojiahao
/
ShangHaiYuan-AnXin
2
0
Fork 0
Code Issues 11 Pull Requests Projects Releases Wiki Activity
Browse Source

[新增]数据采集车辆布局

tangshan
邵佳豪 4 years ago
parent
037c53e993
commit
2b904c17db
7 changed files with 1309 additions and 784 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      src/app/data-collection/data-collection.module.ts
  2. 229
      src/app/data-collection/fire-force/fire-force.component.html
  3. 205
      src/app/data-collection/fire-force/fire-force.component.scss
  4. 261
      src/app/data-collection/fire-force/fire-force.component.ts
  5. 4
      src/app/export-excel/export-excel.component.ts
  6. BIN
      src/assets/images/goback.png
  7. 5
      src/styles.scss

5
src/app/data-collection/data-collection.module.ts
Unescape View File

@ -47,7 +47,7 @@ import { AddWater, WaterCollectionComponent } from './water-collection/water-col
import { AddFireForce, FireForceComponent, ViewDetails } from './fire-force/fire-force.component';
import { AddLinkageForce, LinkageForcesComponent, ViewDetails2 } from './linkage-forces/linkage-forces.component';
import { NzTreeModule } from 'ng-zorro-antd/tree';
import { NzTreeSelectModule } from 'ng-zorro-antd/tree-select';
@NgModule({
declarations: [WaterCollectionComponent, FireForceComponent, LinkageForcesComponent, AddWater, AddFireForce, ViewDetails, AddLinkageForce, ViewDetails2],
imports: [
@ -97,7 +97,8 @@ import { NzTreeModule } from 'ng-zorro-antd/tree';
FormsModule,
ReactiveFormsModule,
DataCollectionRoutingModule,
NzTreeModule
NzTreeModule,
// NzTreeSelectModule
]
})
export class DataCollectionModule { }

229
src/app/data-collection/fire-force/fire-force.component.html
Unescape View File

@ -3,10 +3,12 @@
<div class="topbox">
<div class="add">
<div>
<mat-slide-toggle color="primary" (change)='slideChange($event)' checked labelPosition='before'>列表过滤</mat-slide-toggle>
<mat-slide-toggle color="primary" (change)='slideChange($event)' checked labelPosition='before'>列表过滤
</mat-slide-toggle>
</div>
<div>
<button (click)="reset()" style="width: 68px;margin-right: 12px;" mat-flat-button color="primary">重置</button>
<button (click)="reset()" style="width: 68px;margin-right: 12px;" mat-flat-button
color="primary">重置</button>
<button (click)="addFireForce()" style="width: 68px;" mat-flat-button color="primary">新增</button>
</div>
</div>
@ -27,7 +29,9 @@
</select>
</div>
<div class="searchbtn">
<button (click)="searchList()" style="width: 100%;" mat-flat-button color="primary"><mat-icon style="width: 20px;height: 20px;font-size: 20px;">search</mat-icon>搜索</button>
<button (click)="searchList()" style="width: 100%;" mat-flat-button color="primary">
<mat-icon style="width: 20px;height: 20px;font-size: 20px;">search</mat-icon>搜索
</button>
</div>
</div>
</div>
@ -39,26 +43,32 @@
</div>
<div class="fireForceTree" id="fireForceTree" *ngIf="isTreeView">
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl">
<mat-tree-node (click)="selectTreeNode(node)" [ngClass]="{'selectedTreeNode': node.id == selectedFireForceId}" *matTreeNodeDef="let node;" matTreeNodePadding matTreeNodePaddingIndent='10px'>
<mat-tree-node (click)="selectTreeNode(node)"
[ngClass]="{'selectedTreeNode': node.id == selectedFireForceId}" *matTreeNodeDef="let node;"
matTreeNodePadding matTreeNodePaddingIndent='10px'>
<button mat-icon-button disabled></button>
<span class="nodename">{{node.name}}</span>
<div class="integrity">
<span class="integrityNum">
{{node.fireForceDetailInfo ? accMul(node.fireForceDetailInfo.integrityScore.toFixed(3),100,1) : 0}}%
{{node.fireForceDetailInfo ?
accMul(node.fireForceDetailInfo.integrityScore.toFixed(3),100,1) : 0}}%
</span>
<div class="integrityColorDiv" [style]="integrity(node.fireForceDetailInfo ? (node.fireForceDetailInfo.integrityScore.toFixed(2) * 100).toFixed(): 0)">
<div class="integrityColorDiv"
[style]="integrity(node.fireForceDetailInfo ? (node.fireForceDetailInfo.integrityScore.toFixed(2) * 100).toFixed(): 0)">
</div>
</div>
<div class="deletebtn" (click)="deleteFireForce(node,$event)">
<mat-icon>highlight_off</mat-icon>
</div>
<div class="deletebtn" (click)="deleteFireForce(node,$event)"><mat-icon>highlight_off</mat-icon></div>
</mat-tree-node>
<mat-tree-node (click)="selectTreeNode(node)" [ngClass]="{'selectedTreeNode': node.id == selectedFireForceId}" *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding matTreeNodePaddingIndent='10px'>
<mat-tree-node (click)="selectTreeNode(node)"
[ngClass]="{'selectedTreeNode': node.id == selectedFireForceId}"
*matTreeNodeDef="let node;when: hasChild" matTreeNodePadding matTreeNodePaddingIndent='10px'>
<button mat-icon-button
matTreeNodeToggle
[attr.aria-label]="'toggle ' + node.name">
<button mat-icon-button matTreeNodeToggle [attr.aria-label]="'toggle ' + node.name">
<mat-icon class="mat-icon-rtl-mirror">
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
@ -66,27 +76,36 @@
<span class="nodename">{{node.name}}</span>
<div class="integrity">
<span class="integrityNum">
{{node.fireForceDetailInfo ? accMul(node.fireForceDetailInfo.integrityScore.toFixed(3),100,1) : 0}}%
{{node.fireForceDetailInfo ?
accMul(node.fireForceDetailInfo.integrityScore.toFixed(3),100,1) : 0}}%
</span>
<div class="integrityColorDiv" [style]="integrity(node.fireForceDetailInfo ? (node.fireForceDetailInfo.integrityScore.toFixed(2) * 100).toFixed(): 0)">
<div class="integrityColorDiv"
[style]="integrity(node.fireForceDetailInfo ? (node.fireForceDetailInfo.integrityScore.toFixed(2) * 100).toFixed(): 0)">
</div>
</div>
<div class="deletebtn" (click)="deleteFireForce(node,$event)"><mat-icon>highlight_off</mat-icon></div>
<div class="deletebtn" (click)="deleteFireForce(node,$event)">
<mat-icon>highlight_off</mat-icon>
</div>
</mat-tree-node>
</mat-tree>
</div>
<div class="fireForceList" *ngIf="!isTreeView">
<ul>
<li [ngClass]="{'selectedLi': item.id == selectedFireForceId}" *ngFor="let item of allFireForceList;let key = index" (click)="selectTreeNode(item)">
<li [ngClass]="{'selectedLi': item.id == selectedFireForceId}"
*ngFor="let item of allFireForceList;let key = index" (click)="selectTreeNode(item)">
<div class="name" [title]="item.name">{{item.name}}</div>
<div class="integrity">
<span class="integrityNum">
{{item.fireForceDetailInfo ? accMul(item.fireForceDetailInfo.integrityScore.toFixed(3),100,1) : 0}}%
{{item.fireForceDetailInfo ?
accMul(item.fireForceDetailInfo.integrityScore.toFixed(3),100,1) : 0}}%
</span>
<div class="integrityColorDiv" [style]="integrity(item.fireForceDetailInfo ? (item.fireForceDetailInfo.integrityScore.toFixed(2) * 100).toFixed(): 0)">
<div class="integrityColorDiv"
[style]="integrity(item.fireForceDetailInfo ? (item.fireForceDetailInfo.integrityScore.toFixed(2) * 100).toFixed(): 0)">
</div>
</div>
<div class="deletebtn" (click)="deleteFireForce(item,$event)">
<mat-icon>highlight_off</mat-icon>
</div>
<div class="deletebtn" (click)="deleteFireForce(item,$event)"><mat-icon>highlight_off</mat-icon></div>
</li>
</ul>
</div>
@ -94,14 +113,16 @@
</div>
<div class="mapbox">
<div class="mapcheckbox">
<mat-checkbox (change)="checkBoxChange()" [(ngModel)]="item.isChecked" color="primary" *ngFor="let item of checkBoxList">{{item.name}}</mat-checkbox>
<mat-checkbox (change)="checkBoxChange()" [(ngModel)]="item.isChecked" color="primary"
*ngFor="let item of checkBoxList">{{item.name}}</mat-checkbox>
</div>
<div id="map" class="map" style="overflow: hidden;">
<div id="container"></div>
<div class="gistopbox hidden" [ngClass]="{'show': isGisTopBox}">
<div class="inputBox">
<span>搜索: </span>
<input name="position" [(ngModel)]="searchTitle" id="tipinput" class="positionInput" type="text" autocomplete="off">
<input name="position" [(ngModel)]="searchTitle" id="tipinput" class="positionInput" type="text"
autocomplete="off">
</div>
</div>
</div>
@ -127,14 +148,16 @@
<div (click)="selectedTab(1)" [ngClass]="{'selectedBtn': tabIndex == 1}">
<span>详情</span>
</div>
<!-- <div (click)="selectedTab(2)" [ngClass]="{'selectedBtn': tabIndex == 2}">
<div (click)="selectedTab(2)" [ngClass]="{'selectedBtn': tabIndex == 2}">
<span>车辆装备</span>
</div> -->
<!-- <div (click)="selectedTab(3)" [ngClass]="{'selectedBtn': tabIndex == 3}">
</div>
<div (click)="selectedTab(3)" [ngClass]="{'selectedBtn': tabIndex == 3}">
<span>相关资料</span>
</div> -->
</div>
</div>
<div class="btnbox">
<div class="goback" (click)="goback()" *ngIf="carPageIndex == 1"><img
src="/assets/images/goback.png" alt=""> 返回</div>
<div class="uploadAttachment" *ngIf="tabIndex == 3">
<button mat-flat-button color="primary">
<mat-icon>attach_file</mat-icon>
@ -144,7 +167,6 @@
<input type="file" (change)='uploadAttachment($event)'>
</a>
</div>
<!-- <span class="state" *ngIf="selectedFireForce.contentVerify && selectedFireForce.contentVerify.verifyState == 3">(
<span *ngIf="selectedFireForce.contentVerify.operation == 2" style="color: red;">删除</span>
<span *ngIf="selectedFireForce.contentVerify.operation == 0" >新增</span>
@ -156,7 +178,9 @@
<span class="submitAudit" *ngIf="!selectedFireForce.contentVerify || selectedFireForce.contentVerify.verifyState == 5 || selectedFireForce.contentVerify.verifyState == 4" (click)="submitAudit()"><mat-icon>open_in_browser</mat-icon>提交审核</span>
<span class="state" *ngIf="selectedFireForce.contentVerify && selectedFireForce.contentVerify.verifyState == 3" (click)="cancelAudit()">撤销审核</span>
<span class="save state" *ngIf="!selectedFireForce.contentVerify || selectedFireForce.contentVerify.verifyState == 5 || selectedFireForce.contentVerify.verifyState == 4" (click)="save()"><mat-icon>save</mat-icon>保存</span> -->
<span class="close" (click)="close()"><mat-icon>close</mat-icon>关闭</span>
<span class="close" (click)="close()">
<mat-icon>close</mat-icon>关闭
</span>
</div>
</div>
<!-- 详情 -->
@ -194,7 +218,8 @@
<span>
备注:
</span>
<textarea [(ngModel)]="FireForceDetailInfo.remark" style="height: 80%;width: 84%;" name="" id="" cols="30" rows="10"></textarea>
<textarea [(ngModel)]="FireForceDetailInfo.remark" style="height: 80%;width: 84%;" name=""
id="" cols="30" rows="10"></textarea>
</mat-grid-tile>
</mat-grid-list>
<p>位置信息</p>
@ -209,11 +234,13 @@
<span>
经度:
</span>
<input [(ngModel)]="positionLngLat.x" disabled type="text" style="width: 26%;margin-right: 6%;">
<input [(ngModel)]="positionLngLat.x" disabled type="text"
style="width: 26%;margin-right: 6%;">
<span>
纬度:
</span>
<input [(ngModel)]="positionLngLat.y" disabled type="text" style="width: 26%;margin-right: 6%;">
<input [(ngModel)]="positionLngLat.y" disabled type="text"
style="width: 26%;margin-right: 6%;">
<!-- <button (click)="setPosition()" style="width:85px;text-align: center;" mat-flat-button color="primary">
<mat-icon style="width: 20px;height: 20px;font-size: 20px;">place</mat-icon>位置
</button> -->
@ -322,7 +349,8 @@
<span>
备注:
</span>
<textarea [(ngModel)]="FireForceDetailInfo.remark" style="height: 80%;width: 84%;" name="" id="" cols="30" rows="10"></textarea>
<textarea [(ngModel)]="FireForceDetailInfo.remark" style="height: 80%;width: 84%;" name=""
id="" cols="30" rows="10"></textarea>
</mat-grid-tile>
</mat-grid-list>
<p>位置信息</p>
@ -337,11 +365,13 @@
<span>
经度:
</span>
<input [(ngModel)]="positionLngLat.x" disabled type="text" style="width: 26%;margin-right: 6%;">
<input [(ngModel)]="positionLngLat.x" disabled type="text"
style="width: 26%;margin-right: 6%;">
<span>
纬度:
</span>
<input [(ngModel)]="positionLngLat.y" disabled type="text" style="width: 26%;margin-right: 6%;">
<input [(ngModel)]="positionLngLat.y" disabled type="text"
style="width: 26%;margin-right: 6%;">
<!-- <button (click)="setPosition()" style="width:85px;text-align: center;" mat-flat-button color="primary">
<mat-icon style="width: 20px;height: 20px;font-size: 20px;">place</mat-icon>位置
</button> -->
@ -479,8 +509,10 @@
<span>
站长:
</span>
<input [(ngModel)]="othercontactData[2].PropertyValue" class="smallwidth" type="text" placeholder="姓名">
<input [(ngModel)]="othercontactData[3].PropertyValue" class="smallwidth" type="text" placeholder="联系方式">
<input [(ngModel)]="othercontactData[2].PropertyValue" class="smallwidth" type="text"
placeholder="姓名">
<input [(ngModel)]="othercontactData[3].PropertyValue" class="smallwidth" type="text"
placeholder="联系方式">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
@ -492,8 +524,10 @@
<span>
负责人:
</span>
<input [(ngModel)]="othercontactData[4].PropertyValue" class="smallwidth" type="text" placeholder="姓名">
<input [(ngModel)]="othercontactData[5].PropertyValue" class="smallwidth" type="text" placeholder="联系方式">
<input [(ngModel)]="othercontactData[4].PropertyValue" class="smallwidth" type="text"
placeholder="姓名">
<input [(ngModel)]="othercontactData[5].PropertyValue" class="smallwidth" type="text"
placeholder="联系方式">
</mat-grid-tile>
<mat-grid-tile colspan='3' rowspan='1'>
<span>
@ -505,7 +539,8 @@
<span>
备注:
</span>
<textarea [(ngModel)]="FireForceDetailInfo.remark" style="height: 80%;width: 82%;" name="" id="" cols="30" rows="10"></textarea>
<textarea [(ngModel)]="FireForceDetailInfo.remark" style="height: 80%;width: 82%;" name=""
id="" cols="30" rows="10"></textarea>
</mat-grid-tile>
</mat-grid-list>
<p>位置信息</p>
@ -520,11 +555,13 @@
<span>
经度:
</span>
<input [(ngModel)]="positionLngLat.x" disabled type="text" style="width: 26%;margin-right: 6%;">
<input [(ngModel)]="positionLngLat.x" disabled type="text"
style="width: 26%;margin-right: 6%;">
<span>
纬度:
</span>
<input [(ngModel)]="positionLngLat.y" disabled type="text" style="width: 26%;margin-right: 6%;">
<input [(ngModel)]="positionLngLat.y" disabled type="text"
style="width: 26%;margin-right: 6%;">
<!-- <button (click)="setPosition()" style="width:85px;text-align: center;" mat-flat-button color="primary">
<mat-icon style="width: 20px;height: 20px;font-size: 20px;">place</mat-icon>位置
</button> -->
@ -568,9 +605,109 @@
</div>
</div>
<!-- 车辆 -->
<!-- <div class="contant" *ngIf="tabIndex == 2">
车辆
</div> -->
<div class="contant" *ngIf="tabIndex == 2">
<div class="carOne carcontent" *ngIf="carPageIndex == 0">
<div class="cartopbox">
<div class="add">
<div>
<mat-slide-toggle color="primary" (change)='carslideChange($event)' checked
labelPosition='before'>列表过滤</mat-slide-toggle>
</div>
<div>
<button (click)="reset()" style="width: 68px;margin-right: 12px;" mat-flat-button
color="primary">重置</button>
<button (click)="addFireForce()" style="width: 68px;" mat-flat-button
color="primary">新增</button>
</div>
</div>
<div class="searchbox" *ngIf="isCarCheckedOfSearchDiv">
<div class="inputbox">
<span>
关键字:
</span>
<input type="text" placeholder="请输入名称/车牌号" [(ngModel)]="carSearchForm.name" />
</div>
<div class="inputbox">
<span>
所属队站:
</span>
<input type="text" placeholder="请选择" [(ngModel)]="carSearchForm.organization" />
</div>
<div class="inputbox">
<span>
车辆类别:
</span>
<!-- <nz-tree-select style="width: 250px" [nzExpandedKeys]="expandKeys" [nzNodes]="nodes"
nzShowSearch nzPlaceHolder="Please select" [(ngModel)]="value"
(ngModelChange)="onChange($event)"></nz-tree-select> -->
</div>
<div class="inputbox">
<span>
完整度:
</span>
<select class="shortselect" [(ngModel)]="carSearchForm.integrityNum"
[ngClass]="{'gray': carSearchForm.integrityNum == ''}">
<option value='' selected disabled style='display:none;'>请选择</option>
<option *ngFor="let item of listIntegrityNum" [value]="item.id">{{item.name}}
</option>
</select>
<div class="searchbtn">
<button (click)="searchList()" style="width: 100%;" mat-flat-button color="primary">
<mat-icon style="width: 20px;height: 20px;font-size: 20px;">search</mat-icon>搜索
</button>
</div>
</div>
</div>
</div>
<div class="carList">
<table>
<tr>
<td>车辆名称</td>
<td>所属队站</td>
<td>完整度</td>
<td></td>
</tr>
<tr *ngFor="let item of carsList" class="caritem" (click)="openCarDetails(item)">
<td class="td1">{{item.name}}</td>
<td class="td2">{{item.organization}}</td>
<td>
<div class="integrity">
<span class="integrityNum">
{{item.integrityScore ? accMul(item.integrityScore.toFixed(3),100,1) : 0}}%
</span>
<div class="integrityColorDiv"
[style]="integrity(item.integrityScore ? (item.integrityScore.toFixed(2) * 100).toFixed(): 0)">
</div>
</div>
</td>
<td>
<mat-icon class="deleteFile">highlight_off</mat-icon>
</td>
</tr>
</table>
</div>
<div class="pagingDevice">
<mat-paginator [length]="dataLength" [pageSize]="16" (page)="chagePage($event)"></mat-paginator>
</div>
</div>
<div class="carTwo" *ngIf="carPageIndex == 1">
<p>基本信息</p>
<div>
<div>
<span><span style="color: red;">*</span>车辆类别</span>
<select class="shortselect" [(ngModel)]="carSearchForm.integrityNum"
[ngClass]="{'gray': carSearchForm.integrityNum == ''}">
<option value='' selected disabled style='display:none;'>请选择</option>
<option *ngFor="let item of listIntegrityNum" [value]="item.id">{{item.name}}</option>
</select>
</div>
</div>
<p>作战用信息</p>
<p>车载灭火剂</p>
<p>消防器材</p>
</div>
</div>
<!-- 相关资料 -->
<div class="contant" *ngIf="tabIndex == 3">
<div class="fileDivBox" *ngFor="let item of AttachmentArr">
@ -578,11 +715,11 @@
<div class="imgbox">
<img *ngIf="item.fileName.split('.')[item.fileName.split('.').length-1] == 'png'
|| item.fileName.split('.')[item.fileName.split('.').length-1] == 'jpg'
|| item.fileName.split('.')[item.fileName.split('.').length-1] == 'JPG'"
class="thumbnailImg" src="/api/Objects/PlanPlatform/{{item.objectName}}" alt="">
|| item.fileName.split('.')[item.fileName.split('.').length-1] == 'JPG'" class="thumbnailImg"
src="/api/Objects/PlanPlatform/{{item.objectName}}" alt="">
<img *ngIf="item.fileName.split('.')[item.fileName.split('.').length-1] == 'docx'
|| item.fileName.split('.')[item.fileName.split('.').length-1] == 'doc'"
class="thumbnailImg" src="/assets/images/word.jpg" alt="">
|| item.fileName.split('.')[item.fileName.split('.').length-1] == 'doc'" class="thumbnailImg"
src="/assets/images/word.jpg" alt="">
<img *ngIf="item.fileName.split('.')[item.fileName.split('.').length-1] == 'pdf'"
class="thumbnailImg" src="/assets/images/pdf.jpg" alt="">
<img *ngIf="item.fileName.split('.')[item.fileName.split('.').length-1] == 'txt'"

205
src/app/data-collection/fire-force/fire-force.component.scss
Unescape View File

@ -1,7 +1,7 @@
.box {
width: 100%;
height: 100%;
background-color: #F2F4F6;
background-color: #f2f4f6;
display: flex;
box-sizing: border-box;
padding: 10px;
@ -36,14 +36,14 @@
span {
margin-right: 5px;
}
select,input{
select,
input {
flex: 1;
background-color: #F2F4F6;
background-color: #f2f4f6;
border: 0;
border-radius: 5px;
box-sizing: border-box;
padding: 0 8px;
}
.gray {
color: gray;
@ -85,13 +85,13 @@
.nodename {
flex: 1;
overflow: hidden;
text-overflow:ellipsis
text-overflow: ellipsis;
}
.integrity {
width: 100px;
height: 16px;
position: relative;
background-color: #F2F4F6;
background-color: #f2f4f6;
.integrityNum {
position: absolute;
left: 50%;
@ -157,7 +157,7 @@
height: 58%;
width: 32%;
position: relative;
background-color: #F2F4F6;
background-color: #f2f4f6;
.integrityNum {
position: absolute;
left: 50%;
@ -193,7 +193,6 @@
.selectedLi {
background-color: #b3d3ee;
}
}
.paginator {
height: 56px;
@ -233,10 +232,10 @@
top: 3px;
width: 30%;
height: 40px;
background: #FFFFFF;
background: #ffffff;
display: flex;
align-items: center;
cursor: default;;
cursor: default;
.inputBox {
width: 100%;
display: flex;
@ -249,13 +248,12 @@
border-radius: 6px;
width: 80%;
height: 28px;
background: #F2F2F2;
background: #f2f2f2;
margin-left: 8px;
box-sizing: border-box;
padding-left: 10px;
}
}
}
.hidden {
opacity: 0;
@ -295,10 +293,10 @@
cursor: pointer;
color: #000000;
opacity: 0.4;
border-right: 1px solid #F2F4F6;
border-right: 1px solid #f2f4f6;
}
.selectedBtn {
background-color: #2196F3;
background-color: #2196f3;
color: #fff;
opacity: 1;
}
@ -346,7 +344,7 @@
span {
display: inline-block;
cursor: pointer;
color: #2196F3;
color: #2196f3;
mat-icon {
vertical-align: sub;
font-size: 20px;
@ -354,9 +352,6 @@
height: 20px;
}
}
span:hover{
// text-decoration: underline;
}
.state {
margin-right: 30px;
}
@ -366,6 +361,18 @@
.close {
margin-right: 30px;
}
.goback{
cursor: pointer;
display: flex;
align-items: center;
color: #2196f3;
img{
width: 14px;
height: 14px;
margin-right: 5px;
}
margin-right: 12px;
}
}
}
.contant {
@ -373,8 +380,8 @@
height: 460px;
overflow-y: auto;
p {
color: #2196F3;
background-color: #F2F4F6;
color: #2196f3;
background-color: #f2f4f6;
height: 33px;
line-height: 33px;
box-sizing: border-box;
@ -384,21 +391,22 @@
span {
font-size: 15px;
}
input,select{
input,
select {
height: 30px;
line-height: 30px;
box-sizing: border-box;
padding: 0 12px;
width: 60%;
margin-left: 5px;
border: 1px solid #EBEBEB;
border: 1px solid #ebebeb;
border-radius: 5px;
}
textarea {
width: 89%;
margin-left: 5px;
height: 85%;
border: 1px solid #EBEBEB;
border: 1px solid #ebebeb;
border-radius: 5px;
}
.longinput {
@ -407,7 +415,8 @@
.unitDiv {
width: 60%;
position: relative;
input,select{
input,
select {
width: 100%;
box-sizing: border-box;
padding-right: 50px;
@ -427,7 +436,7 @@
.fileDivBox {
position: relative;
float: left;
border: 1px solid #EBEBEB;
border: 1px solid #ebebeb;
width: 160px;
height: 162px;
box-sizing: border-box;
@ -486,7 +495,6 @@
border: 1px solid #000;
.deleteFile {
display: block;
}
.deleteFile:hover {
color: red;
@ -495,6 +503,132 @@
display: block;
}
}
//车辆头部
.cartopbox {
max-height: 200px;
box-sizing: border-box;
padding: 10px 22px;
.add {
height: 36px;
line-height: 36px;
display: flex;
justify-content: space-between;
margin-bottom: 5px;
}
.searchbox {
display: flex;
flex-wrap: wrap;
.inputbox {
width: 50%;
height: 40px;
font-size: 14px;
line-height: 40px;
margin: 5px 0;
display: flex;
justify-content: flex-end;
align-items: center;
span {
margin-right: 5px;
overflow: hidden; /*超出部分隐藏*/
white-space: nowrap; /*不换行*/
text-overflow: ellipsis; /*超出部分文字以...显示*/
}
select,
input {
height: 100%;
width: 85%;
background-color: #f2f4f6;
border: 0;
border-radius: 5px;
box-sizing: border-box;
padding: 0 8px;
}
.shortselect{
width: 68.5%;
}
.searchbtn{
margin-left: 20px;
}
.gray {
color: gray;
}
}
}
}
}
.carcontent{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
.carList{
flex: 1;
overflow-y: auto;
box-sizing: border-box;
padding: 10px 22px;
border: 1px solid #F2F4F6;
table{
width: 100%;
border-spacing:0px;
tr{
height: 33px;
width: 100%;
td:nth-child(1){
width: 46%;
}
td:nth-child(2){
width: 26%;
}
td:nth-child(3){
width: 26%;
}
td:nth-child(4){
width: 2%;
display: flex;
align-items: center;
height: 33px;
}
td{
border: none;
.integrity {
height: 18px;
width: 95%;
position: relative;
background-color: #f2f4f6;
.integrityNum {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
color: black;
font-size: 13px;
cursor: default;
}
.integrityColorDiv {
height: 100%;
}
}
.deleteFile{
cursor: pointer;
}
}
.td1,.td2{
color: #2196F3;
}
}
.caritem:hover{
border: 0px;
cursor: default;
background-color: #d2eafd;
}
}
}
.pagingDevice{
width: 100%;
height: 40px;
}
}
.masklayer {
position: absolute;
@ -532,7 +666,6 @@
}
}
.addWaterBox {
width: 260px;
height: 284px;
@ -542,9 +675,9 @@
width: 100%;
height: 40px;
line-height: 40px;
background-color: #2196F3;
background-color: #2196f3;
text-align: center;
color: #FFFFFF;
color: #ffffff;
font-size: 15px;
}
.contant {
@ -559,7 +692,7 @@
height: 36px;
line-height: 36px;
text-align: center;
background-color: #F2F4F6;
background-color: #f2f4f6;
font-size: 14px;
cursor: pointer;
border: 1px solid #fff;
@ -572,9 +705,9 @@
}
}
.selectedDiv {
background-color: #2196F3;
background-color: #2196f3;
color: #fff;
border: 1px solid #2196F3;
border: 1px solid #2196f3;
}
}
.btnbox {
@ -583,7 +716,7 @@
box-sizing: border-box;
padding: 0px 30px;
display: flex;
align-items: flex-start;;
align-items: flex-start;
justify-content: space-between;
button {
width: 80px;
@ -593,7 +726,6 @@
}
}
@media screen and (max-width: 1400px) {
.box {
padding: 5px;
@ -655,6 +787,8 @@
.close {
margin-right: 12px;
}
}
}
.contant {
@ -667,7 +801,8 @@
span {
font-size: 14px;
}
input,select{
input,
select {
width: 50%;
}
textarea {

261
src/app/data-collection/fire-force/fire-force.component.ts
Unescape View File

@ -26,8 +26,15 @@ export class FireForceComponent implements OnInit {
slideChange(e) {
this.isCheckedOfSearchDiv = e.checked
}
searchForm: any = {
name: '',
integrityNum: '',
}
carSearchForm: any = {
name: '',
organization: '',
carType: '',
integrityNum: ''
}
listIntegrityNum: any[] = [
@ -46,6 +53,241 @@ export class FireForceComponent implements OnInit {
{ id: 3, name: '中队(消防站)', isChecked: false },
{ id: 4, name: '其他消防队伍', isChecked: false }
]
isCarCheckedOfSearchDiv: boolean = true//车辆列表过滤滑块
carslideChange(e) {
this.isCarCheckedOfSearchDiv = e.checked
}
carsList: any = [
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.72 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.52 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.32 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.02 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
{ id: 0, name: '【沪C5869应急】沃尔沃18米高喷车', organization: '浦东支队', integrityScore: 0.92 },
]
dataLength: any //获取的数据一共多少条
PageNumber: any = 1 //当前第几页
//分页事件
chagePage(e) {
this.PageNumber = e.pageIndex + 1
// this.getAllWaterData()
}
//进入车辆详情页
carPageIndex: number = 0
openCarDetails(item) {
this.carPageIndex = 1
}
//返回车辆列表页
goback() {
this.carPageIndex = 0
}
//消防车类型
carTpyeList: any = [
{
name: '灭火类消防车',
children: [
{ name: '水罐车' },
{ name: '泡沫车' },
{ name: '高倍数泡沫车' },
{ name: '干粉车' },
{ name: '干粉泡沫联用车' },
{ name: '干粉水联用车' },
{ name: '干粉二氧化碳联用车' },
{ name: '涡喷车' },
{ name: '液氮车' },
{ name: '二氧化碳车' },
{ name: '其他灭火消防车' }
]
},
{
name: '举高类消防车',
children: [
{ name: '高喷车' },
{ name: '曲臂登高车' },
{ name: '直臂登高车' },
{ name: '其他举高消防车' }
]
},
{
name: '专勤类消防车',
children: [
{ name: '抢险救援车' },
{ name: '侦检车' },
{ name: '勘察车' },
{ name: '排烟车' },
{ name: '照明车' },
{ name: '宣传车' },
{ name: '排烟照明车' },
{ name: '通信指挥车' },
{ name: '有毒气体处置车' },
{ name: '防化消防车' },
{ name: '挖掘车' },
{ name: '铲车' },
{ name: '破拆车' },
{ name: '其他专勤消防车' }
]
},
{
name: '后援类消防车',
children: [
{ name: '饮食保障车' },
{ name: '卫勤保障车' },
{ name: '排障车' },
{ name: '装备抢修车' },
{ name: '拖车车' },
{ name: '运兵车' },
{ name: '运输车' },
{ name: '运渣车' },
{ name: '吊车' },
{ name: '移动供气车' },
{ name: '移动供液车' },
{ name: '油料供给车' },
{ name: '远程供水车(水泵)' },
{ name: '远程供水车(水带铺设)' },
{ name: '宿营车' },
{ name: '发电车' },
{ name: '淋浴车' },
{ name: '其他后援消防车' }
]
},
{
name: '机场消防车',
children: [
{ name: '机场快速调动消防车' },
{ name: '机场主力泡沫消防车' },
{ name: '其他机场消防车' },
{ name: '防爆消防车' },
{ name: '轨道消防车(GD)' }
]
},
{
name: '消防摩托车',
children: [
{ name: '灭火消防摩托车' },
{ name: '抢险救援摩托车' },
{ name: '其他消防摩托车' }
]
},
{
name: '联动类车辆',
children: [
{ name: '急救车' },
{ name: '警用指挥车' },
{ name: '警用巡逻车' },
{ name: '警用摩托车' },
{ name: '电力抢修车' },
{ name: '水力抢修车' },
{ name: '燃气抢修车' },
{ name: '特种工程车' },
{ name: '环保监测车' },
{ name: '其他联动车辆' }
]
},
{
name: '其他消防车辆'
}
]
expandKeys = ['100', '1001'];
value?: string;
nodes = [
{
title: 'parent 1',
key: '100',
children: [
{
title: 'parent 1-0',
key: '1001',
children: [
{ title: 'leaf 1-0-0', key: '10010', isLeaf: true },
{ title: 'leaf 1-0-1', key: '10011', isLeaf: true }
]
},
{
title: 'parent 1-1',
key: '1002',
children: [{ title: 'leaf 1-1-0', key: '10020', isLeaf: true }]
}
]
}
];
onChange($event: string): void {
console.log($event);
}
//车辆详细信息
carData: any = {
basicInfo: {
carType: '',//车辆类别
carName: '',
carNumber: '',
carOrganization: ''
},
fightInfo: {
pumpFlow: '',//水泵流量
fireGunFlow: '',//消防炮流量
pumpPressure: '',//水泵额定压力
waterCapacity: '',//载水量
carHeight: '',//车辆高度
carState: '',//车辆状态
remark: '',//备注
carPhoto: []//车辆照片
},
carExtinguishant: {//车载灭火剂
isExpand: false,
data: [
{
extinguishantType: '',//灭火剂类型
extinguishantName: '',//灭火剂名称
extinguishantOr: '',//所属队站
mixingRatio: '',//混合比
capacity: '',//车载量
manufacturer: '',//成产厂家
remark: ''//备注
}
]
},
fireEquipment: {//消防器材
isExpand: false,
data: [
{
equipmentType: '',//器材类别
equipmentName: '',//器材名称
equipmentOr: '',//所属队站
capacity: '',//车载量
manufacturer: '',//成产厂家
remark: ''//备注
}
]
}
}
//勾选力量类型checkbox在地图上显示marker
checkBoxChange() {
let Levels = []
@ -236,13 +478,13 @@ export class FireForceComponent implements OnInit {
}
this.http.get('/api/CustomFireForce', { params: params }).subscribe((data: any) => {
this.allFireForceList = data
   this.dataSource.data = this.tree.toTree(data)
this.dataSource.data = this.tree.toTree(data)
this.treeControl.expand(this.treeControl.dataNodes[0]);
})
}
upDateAllFireForce = (): void => {
this.http.get('/api/CustomFireForce').subscribe((data: any) => {
   this.newdata = this.tree.toTree(data)
this.newdata = this.tree.toTree(data)
const nodes = this.treeControl.dataNodes;
const expandNodes = [];
nodes.forEach((item) => {
@ -352,6 +594,9 @@ export class FireForceComponent implements OnInit {
this.otherpersonCountData = JSON.parse(data.personCountData) || this.otherpersonCountData
this.othercontactData = JSON.parse(data.contactData) || this.othercontactData
}
}, err => {
this.isMasklayer = false
alert('获取信息错误！')
})
} else {
@ -390,8 +635,7 @@ export class FireForceComponent implements OnInit {
}
//js乘法
accMul(arg1, arg2, fix) {
if(!parseInt(fix)==fix)
{
if (!parseInt(fix) == fix) {
return;
}
var m = 0, s1 = arg1.toString(), s2 = arg2.toString();
@ -993,7 +1237,8 @@ export class FireForceComponent implements OnInit {
this.http.post(`/api/MultipartUpload/PlanPlatform/${this.objectName}?uploadId=${this.uploadId}&partNumber=${i + 1}`, formData).subscribe((data: any) => {
let msg = {
"partNumber": data.partNumber || null,
"eTag": data.eTag || null}
"eTag": data.eTag || null
}
resolve(msg) // 调用 promise 内置方法处理成功
})
});
@ -1002,7 +1247,8 @@ export class FireForceComponent implements OnInit {
this.progressBarValue = this.accMul(Number((i / allSlice).toFixed(2)) * 100, 1, 0)
if (this.PartNumberETag.length === allSlice) {
this.progressBarValue = 100
this.endUploading()}
this.endUploading()
}
}//for循环
}
@ -1081,7 +1327,8 @@ export class FireForceComponent implements OnInit {
let result = await new Promise((result, reject) => {
this.http.get(`/api/Objects/PlanPlatform/${e.objectName}`, { headers: { 'range': `bytes= ${start}-${end}` }, responseType: 'blob' }).subscribe(data => {
result(data) })
result(data)
})
})
allFile.push(result)
// this.progressBarValue = Number((i/allSlice).toFixed(2))*100 //文件进度数

4
src/app/export-excel/export-excel.component.ts
Unescape View File

@ -17,11 +17,11 @@ export class ExportExcelComponent implements OnInit {
responseType: 'blob' as 'json'
};
this.http.get('/api/StatisticsAnalysis/ExportToExcel',httpOptions).subscribe((data:any) => {
// // 文件名中有中文 则对文件名进行转码
// 文件名中有中文 则对文件名进行转码
const link = document.createElement('a');
const blob = new Blob([data], {type: 'application/vnd.ms-excel'});
link.setAttribute('href', window.URL.createObjectURL(blob));
link.setAttribute('download', '统计信息'+'.xlsx');
link.setAttribute('download', '统计信息'+'.xls');
link.style.visibility = 'hidden';
document.body.appendChild(link);
link.click();

BIN
src/assets/images/goback.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 426 B

5
src/styles.scss
Unescape View File

@ -2,6 +2,8 @@
@import './app/theme.scss';
@import "./app/ngZorroTree.css"; /* 引入组件样式 */
// @import "~ng-zorro-antd/select/style/index.min.css"; /* 引入组件样式 */
@import "~ng-zorro-antd/style/index.min.css"; /* 引入基本样式 */
@import "~ng-zorro-antd/tree-select/style/index.min.css"; /* 引入组件样式 */
@font-face
{
font-family: Regular;
@ -336,3 +338,6 @@ td{
background: #666;
}
}
.mat-paginator-container{
min-height: 40px!important;
}
Write Preview
Loading…
Cancel
Save