陈鹏飞 3 years ago
parent
commit
63041bb133
  1. 10
      src/app/pages/home-page/home-page.component.html
  2. 8
      src/app/pages/home-page/home-page.component.scss
  3. 24
      src/app/pages/home-page/home-page.component.ts

10
src/app/pages/home-page/home-page.component.html

@ -45,7 +45,7 @@
<img class="bucket" src="../../../assets/images/bucket.png" alt=""> <img class="bucket" src="../../../assets/images/bucket.png" alt="">
<img class="circle" src="../../../assets/images/circle.png" alt=""> <img class="circle" src="../../../assets/images/circle.png" alt="">
</div> </div>
<div class="leftitem" *ngIf="!userdata.organization.parentId"> <!-- <div class="leftitem" *ngIf="!userdata.organization.parentId">
<span class="itemname">公司排名</span> <span class="itemname">公司排名</span>
<div class="box areabox"> <div class="box areabox">
<div class="areaboxitem" *ngFor="let item of HomeAggregatioData.compayAgg;let key = index"> <div class="areaboxitem" *ngFor="let item of HomeAggregatioData.compayAgg;let key = index">
@ -76,7 +76,7 @@
<div class="angle-border right-top-border"></div> <div class="angle-border right-top-border"></div>
<div class="angle-border left-bottom-border"></div> <div class="angle-border left-bottom-border"></div>
<div class="angle-border right-bottom-border"></div> <div class="angle-border right-bottom-border"></div>
</div> </div> -->
<div class="leftitem"> <div class="leftitem">
<span class="itemname">事件排名</span> <span class="itemname">事件排名</span>
<div class="box eventbox"> <div class="box eventbox">
@ -124,7 +124,7 @@
{{key + 1}} {{key + 1}}
</ng-template> </ng-template>
</div> </div>
{{item.name}} {{item.companyName}} {{item.companyName}} {{item.name}}
</div> </div>
<div class="progressbox"> <div class="progressbox">
<div class="progress"> <div class="progress">
@ -250,14 +250,14 @@
{{HomeAggregatioData.ouViolationType.ouTotalCount}} {{HomeAggregatioData.ouViolationType.ouTotalCount}}
</div> </div>
<div class="oilNumItem"> <!-- <div class="oilNumItem">
<div class="pointbox"> <div class="pointbox">
<div class="point"></div> <div class="point"></div>
<span>累计卸油正常车次</span> <span>累计卸油正常车次</span>
</div> </div>
{{HomeAggregatioData.ouViolationType.ouCorrectCount}} {{HomeAggregatioData.ouViolationType.ouCorrectCount}}
</div> </div> -->
<div class="oilNumItem"> <div class="oilNumItem">
<div class="pointbox"> <div class="pointbox">
<div class="point"></div> <div class="point"></div>

8
src/app/pages/home-page/home-page.component.scss

@ -572,8 +572,8 @@
.oilNum { .oilNum {
position: absolute; position: absolute;
left: 6%; left: 4%;
bottom: 15px; bottom: 22px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -582,15 +582,17 @@
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
color: white; color: white;
font-size: 12px; font-size: 13px;
span { span {
margin: 0 4px; margin: 0 4px;
} }
.pointbox { .pointbox {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.point { .point {
width: 6px; width: 6px;
height: 6px; height: 6px;

24
src/app/pages/home-page/home-page.component.ts

@ -132,7 +132,7 @@ export class HomePageComponent implements OnInit {
}, },
series: [ series: [
{ {
data: [], data: [4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000,],
type: 'bar', type: 'bar',
itemStyle: { itemStyle: {
color: { color: {
@ -152,12 +152,26 @@ export class HomePageComponent implements OnInit {
barWidth: '35%' barWidth: '35%'
}, },
{ {
data: [], data: [4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000, 4000, 3000, 4000, 4000, 4000,],
type: 'line', type: 'line',
symbol: 'circle', symbol: 'circle',
symbolSize: 5, symbolSize: 5,
label: { label: {
show: true normal: {
show: true,
// formatter: function (dataObj) {
// const { dataIndex, value } = dataObj;
// let labelText = value;
// labelText = '';
// if (dataIndex % 2 === 0) { // 每隔三个x坐标显示一个
// labelText = value;
// }
// return `${labelText}`
// }
}
}, },
itemStyle: { itemStyle: {
color: '#fff', color: '#fff',
@ -171,7 +185,7 @@ export class HomePageComponent implements OnInit {
} }
], ],
grid: { grid: {
left: '18px', left: '40px',
right: '30px', right: '30px',
bottom: '38px', bottom: '38px',
top: '30px' top: '30px'
@ -341,7 +355,7 @@ export class HomePageComponent implements OnInit {
// itemHeight: 8, // itemHeight: 8,
// }, // },
grid: { grid: {
left: '36px', left: '40px',
right: '30px', right: '30px',
bottom: '38px', bottom: '38px',
top: '66px' top: '66px'

Loading…
Cancel
Save