BIM应用大屏开发
parent
f021c5aee2
commit
074ae5ba38
|
@ -117,12 +117,11 @@
|
|||
</div>
|
||||
<div class="warn-info">
|
||||
<div class="warn-item">
|
||||
<<<<<<< HEAD
|
||||
<div class="czz-number-img czz-number-img-blue">
|
||||
<svg-icon icon-class="notesearch" />
|
||||
</div>
|
||||
<div class="warn-data">
|
||||
<div class="warn-data-val led-number">{{safetyInfo.safetyCount}}</div>
|
||||
<div class="warn-data-val led-number">{{ safetyInfo.safetyCount }}</div>
|
||||
<div class="warn-data-text">问题数</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -131,7 +130,7 @@
|
|||
<svg-icon icon-class="tools" />
|
||||
</div>
|
||||
<div class="warn-data">
|
||||
<div class="warn-data-val led-number">{{safetyInfo.safetyRectifyCount}}</div>
|
||||
<div class="warn-data-val led-number">{{ safetyInfo.safetyRectifyCount }}</div>
|
||||
<div class="warn-data-text">整改数</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -140,7 +139,7 @@
|
|||
<svg-icon icon-class="percent" class="green" />
|
||||
</div>
|
||||
<div class="warn-data">
|
||||
<div class="warn-data-val led-number">{{safetyInfo.safetyRectifyRate}}%</div>
|
||||
<div class="warn-data-val led-number">{{ safetyInfo.safetyRectifyRate }}%</div>
|
||||
<div class="warn-data-text">整改率</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -149,49 +148,9 @@
|
|||
<svg-icon icon-class="warn" class="red" />
|
||||
</div>
|
||||
<div class="warn-data">
|
||||
<div class="warn-data-val led-number">{{safetyInfo.safetyTimeoutCount}}</div>
|
||||
<div class="warn-data-val led-number">{{ safetyInfo.safetyTimeoutCount }}</div>
|
||||
<div class="warn-data-text">超时数</div>
|
||||
</div>
|
||||
=======
|
||||
|
||||
<div class="czz-number-img czz-number-img-blue">
|
||||
<svg-icon icon-class="notesearch" />
|
||||
</div>
|
||||
<div class="warn-data">
|
||||
<div class="warn-data-val led-number">888</div>
|
||||
<div class="warn-data-text">问题数</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="warn-item">
|
||||
|
||||
<div class="czz-number-img czz-number-img-blue">
|
||||
<svg-icon icon-class="tools" />
|
||||
</div>
|
||||
<div class="warn-data">
|
||||
<div class="warn-data-val led-number">888</div>
|
||||
<div class="warn-data-text">整改数</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="warn-item">
|
||||
|
||||
<div class="czz-number-img czz-number-img-green">
|
||||
<svg-icon icon-class="percent" class="green"/>
|
||||
</div>
|
||||
<div class="warn-data">
|
||||
<div class="warn-data-val led-number">888</div>
|
||||
<div class="warn-data-text">整改率</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="warn-item">
|
||||
|
||||
<div class="czz-number-img czz-number-img-blue">
|
||||
<svg-icon icon-class="warn" class="red"/>
|
||||
</div>
|
||||
<div class="warn-data">
|
||||
<div class="warn-data-val led-number">888</div>
|
||||
<div class="warn-data-text">超时数</div>
|
||||
</div>
|
||||
>>>>>>> origin/dev_xd
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -424,16 +383,13 @@ export default {
|
|||
planFinishRate: 0,
|
||||
finishRate: 0,
|
||||
photographyList: [],
|
||||
<<<<<<< HEAD
|
||||
safetyListCount:[],
|
||||
safetyInfo:{
|
||||
safetyRectifyCount:0,
|
||||
safetyRectifyRate:0,
|
||||
safetyTimeoutCount:0,
|
||||
safetyTimeoutRate:0
|
||||
}
|
||||
=======
|
||||
>>>>>>> origin/dev_xd
|
||||
safetyListCount: [],
|
||||
safetyInfo: {
|
||||
safetyRectifyCount: 0,
|
||||
safetyRectifyRate: 0,
|
||||
safetyTimeoutCount: 0,
|
||||
safetyTimeoutRate: 0,
|
||||
},
|
||||
};
|
||||
},
|
||||
beforeDestroy() {
|
||||
|
@ -472,16 +428,13 @@ export default {
|
|||
return this.renderChart(1);
|
||||
},
|
||||
renderChart(n) {
|
||||
let is1K = this.$dpi() == "1K";
|
||||
let is2K = this.$dpi() == "2K";
|
||||
let opt = {
|
||||
tooltip: {
|
||||
show: true,
|
||||
<<<<<<< HEAD
|
||||
formatter: function (params) {
|
||||
return params.seriesName + "<br/>" + params.marker + (params.value * 100).toFixed(2) + "%";
|
||||
=======
|
||||
formatter: function(params){
|
||||
return params.seriesName + "<br/>"+params.marker + (params.value * 100).toFixed(2) + "%";
|
||||
>>>>>>> origin/dev_xd
|
||||
},
|
||||
},
|
||||
series: [
|
||||
|
@ -489,11 +442,7 @@ export default {
|
|||
type: "liquidFill",
|
||||
data: [n == 0 ? this.planFinishRate : this.finishRate],
|
||||
name: n == 0 ? "计划完成" : "实际完成",
|
||||
<<<<<<< HEAD
|
||||
color: [n == 0 ? "orange" : "#47D89F"], //颜色
|
||||
=======
|
||||
color: [n==0?"orange":"#47D89F"], //颜色
|
||||
>>>>>>> origin/dev_xd
|
||||
//波浪动画效果
|
||||
waveAnimation: true,
|
||||
animationEasingUpdate: "quinticInOut",
|
||||
|
@ -505,21 +454,12 @@ export default {
|
|||
outline: {
|
||||
show: false,
|
||||
},
|
||||
<<<<<<< HEAD
|
||||
label: {
|
||||
fontSize: 30,
|
||||
fontSize: is1K ? 20 : is2K ? 30 : 40,
|
||||
formatter: function (param) {
|
||||
return (param.value * 100).toFixed(2) + "%";
|
||||
},
|
||||
},
|
||||
=======
|
||||
label:{
|
||||
fontSize: 20,
|
||||
formatter: function (param) {
|
||||
return (param.value*100).toFixed(2) + "%";
|
||||
},
|
||||
}
|
||||
>>>>>>> origin/dev_xd
|
||||
},
|
||||
],
|
||||
};
|
||||
|
@ -535,7 +475,6 @@ export default {
|
|||
this.getRootScheduleNode();
|
||||
this.getFinishRate();
|
||||
this.selectLastPhotography();
|
||||
<<<<<<< HEAD
|
||||
this.getSafetyListCount();
|
||||
},
|
||||
getSafetyListCount() {
|
||||
|
@ -545,25 +484,23 @@ export default {
|
|||
};
|
||||
this.$api.safety.listCountForBG({ ...postData, infoType: 0 }).then((d) => {
|
||||
this.safetyListCount = d.data;
|
||||
let func=lbl=>{
|
||||
let obj=this.safetyListCount.find(it=>it.remark==lbl);
|
||||
return obj?obj.id||0:0;
|
||||
let func = (lbl) => {
|
||||
let obj = this.safetyListCount.find((it) => it.remark == lbl);
|
||||
return obj ? obj.id || 0 : 0;
|
||||
};
|
||||
this.safetyInfo.safetyCount=func("全部");
|
||||
this.safetyInfo.safetyRectifyCount=func("完成");
|
||||
if(this.safetyInfo.safetyCount==0){
|
||||
this.safetyInfo.safetyRectifyRate=100;
|
||||
}else{
|
||||
this.safetyInfo.safetyRectifyRate=(this.safetyInfo.safetyRectifyCount/this.safetyInfo.safetyCount*100.0).toFixed(2);
|
||||
this.safetyInfo.safetyCount = func("全部");
|
||||
this.safetyInfo.safetyRectifyCount = func("完成");
|
||||
if (this.safetyInfo.safetyCount == 0) {
|
||||
this.safetyInfo.safetyRectifyRate = 100;
|
||||
} else {
|
||||
this.safetyInfo.safetyRectifyRate = ((this.safetyInfo.safetyRectifyCount / this.safetyInfo.safetyCount) * 100.0).toFixed(2);
|
||||
}
|
||||
this.safetyInfo.safetyTimeoutCount=func("整改超时");
|
||||
this.safetyInfo.safetyTimeoutCount = func("整改超时");
|
||||
});
|
||||
=======
|
||||
>>>>>>> origin/dev_xd
|
||||
},
|
||||
selectLastPhotography() {
|
||||
this.$api.detail.photographyList(this.selProject.id).then((d) => {
|
||||
this.photographyList = d.data;
|
||||
this.photographyList =[];// d.data;
|
||||
});
|
||||
},
|
||||
getFinishRate() {
|
||||
|
@ -1061,11 +998,12 @@ export default {
|
|||
}
|
||||
|
||||
.data-content {
|
||||
border: solid 1px #75fbfdaa;
|
||||
background-color: #06445b81;
|
||||
|
||||
height: 100%;
|
||||
.div-row {
|
||||
height: 33%;
|
||||
border: solid 1px #75fbfdaa;
|
||||
background-color: #06445b81;
|
||||
.row-title {
|
||||
background: linear-gradient(0deg, #105696, #c0dafb00, #1765ae);
|
||||
padding-left: 10px;
|
||||
|
@ -1287,7 +1225,7 @@ export default {
|
|||
width: 80%;
|
||||
height: 80%;
|
||||
margin-left: 10%;
|
||||
margin-top: 6%;
|
||||
margin-top: 3%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
@ -1309,7 +1247,6 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
<<<<<<< HEAD
|
||||
.warn-info {
|
||||
height: calc(100% - 30px);
|
||||
.warn-item {
|
||||
|
@ -1323,43 +1260,19 @@ export default {
|
|||
height: 80px;
|
||||
line-height: 80px;
|
||||
.svg-icon {
|
||||
=======
|
||||
.warn-info{
|
||||
height: calc(100% - 30px);
|
||||
.warn-item{
|
||||
display: inline-flex;
|
||||
width:50%;
|
||||
height:50%;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.czz-number-img{
|
||||
width:80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
.svg-icon{
|
||||
>>>>>>> origin/dev_xd
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
fill: #5cc0eb;
|
||||
position: relative;
|
||||
<<<<<<< HEAD
|
||||
top: 12px;
|
||||
&.red {
|
||||
fill: red;
|
||||
}
|
||||
&.green {
|
||||
=======
|
||||
top:12px;
|
||||
&.red{
|
||||
fill: red;
|
||||
}
|
||||
&.green{
|
||||
>>>>>>> origin/dev_xd
|
||||
fill: #00e900;
|
||||
}
|
||||
}
|
||||
}
|
||||
<<<<<<< HEAD
|
||||
.warn-data {
|
||||
margin-left: 10px;
|
||||
.warn-data-val {
|
||||
|
@ -1367,19 +1280,10 @@ export default {
|
|||
font-weight: 700;
|
||||
color: #22d0d2;
|
||||
}
|
||||
.warn-data-text{
|
||||
margin-top:10px;
|
||||
.warn-data-text {
|
||||
margin-top: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
=======
|
||||
.warn-data{
|
||||
margin-left:10px;
|
||||
.warn-data-val{
|
||||
font-size:30px;
|
||||
font-weight: 700;
|
||||
color: #22d0d2;
|
||||
}
|
||||
>>>>>>> origin/dev_xd
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -1426,5 +1330,371 @@ export default {
|
|||
padding: 4px 8px;
|
||||
}
|
||||
}
|
||||
@media (max-width: 1920px) {
|
||||
.data-content {
|
||||
.div-row {
|
||||
min-height: 220px;
|
||||
.row-title {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.div-tools {
|
||||
bottom: 25vh;
|
||||
margin-left: -220px;
|
||||
border-radius: 10px;
|
||||
.tool-item {
|
||||
padding: 10px 20px;
|
||||
.icon {
|
||||
width:30px;
|
||||
height: 30px;
|
||||
border-radius: 15px;
|
||||
.svg-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
.sp-text {
|
||||
margin-top: 10px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.prj-info {
|
||||
padding: 10px;
|
||||
|
||||
.base-info {
|
||||
.floor-area {
|
||||
font-size: 24px;
|
||||
}
|
||||
.floor-area-text {
|
||||
line-height: 20px;
|
||||
font-size: 12px;
|
||||
}
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.tb-prj {
|
||||
td,
|
||||
th {
|
||||
border: solid 1px #6ea9ab68;
|
||||
padding: 4px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.prj-worker {
|
||||
height: calc(100% - 50px);
|
||||
.worker-chart {
|
||||
.chart-item {
|
||||
.chart-gif,
|
||||
.chart-text {
|
||||
left: 24px;
|
||||
top: 20px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
}
|
||||
.chart-text {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.worker-title {
|
||||
.title-item {
|
||||
padding: 20px 0px 10px 0px;
|
||||
.svg-icon {
|
||||
fill: #3ffcff;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
}
|
||||
font-size: 12px;
|
||||
color: #3ffcff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.investment-stats-cost {
|
||||
padding: 20px 10px;
|
||||
top: -12px;
|
||||
|
||||
.stat-card {
|
||||
padding: 16px 0;
|
||||
box-shadow: 0 2px 8px #0004;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.stat-title {
|
||||
font-size: 12px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.stat-value {
|
||||
font-size: 20px;
|
||||
}
|
||||
.center-icon {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
font-size: 24px;
|
||||
.chart-gif {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
top: 5px;
|
||||
left: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.plan-chart {
|
||||
height: calc(100% - 30px);
|
||||
.chart-item {
|
||||
.chart-title {
|
||||
font-size: 12px;
|
||||
top: -30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.photography-list {
|
||||
height: calc(100% - 30px);
|
||||
padding: 10px 0px;
|
||||
.el-carousel {
|
||||
height: calc(100% - 10px);
|
||||
}
|
||||
|
||||
.photography-video {
|
||||
height: calc(100% - 30px);
|
||||
}
|
||||
|
||||
.photography-list-title {
|
||||
line-height: 24px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.photography-list-nodata {
|
||||
|
||||
.video-play {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
line-height: 60px;
|
||||
border-radius: 30px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.photography-list-no-title {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.warn-info {
|
||||
height: calc(100% - 30px);
|
||||
.warn-item {
|
||||
width: calc(50% - 30px);
|
||||
height: 50%;
|
||||
padding-left: 30px;
|
||||
.czz-number-img {
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
line-height: 70px;
|
||||
.svg-icon {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
top: 6px;
|
||||
}
|
||||
}
|
||||
.warn-data {
|
||||
margin-left: 10px;
|
||||
.warn-data-val {
|
||||
font-size: 30px;
|
||||
}
|
||||
.warn-data-text {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media (min-width: 2561px) {
|
||||
.data-content {
|
||||
.div-row {
|
||||
min-height: 420px;
|
||||
.row-title {
|
||||
height: 48px;
|
||||
line-height: 48px;
|
||||
font-size: 32px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.div-tools {
|
||||
bottom: 25vh;
|
||||
margin-left: -340px;
|
||||
border-radius: 10px;
|
||||
.tool-item {
|
||||
padding: 10px 20px;
|
||||
.icon {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
border-radius: 30px;
|
||||
.svg-icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
}
|
||||
.sp-text {
|
||||
margin-top: 10px;
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.prj-info {
|
||||
padding: 20px;
|
||||
|
||||
.base-info {
|
||||
.floor-area {
|
||||
font-size: 60px;
|
||||
}
|
||||
.floor-area-text {
|
||||
line-height: 40px;
|
||||
font-size: 24px;
|
||||
}
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.tb-prj {
|
||||
td,
|
||||
th {
|
||||
border: solid 1px #6ea9ab68;
|
||||
padding: 8px;
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.prj-worker {
|
||||
height: calc(100% - 60px);
|
||||
.worker-chart {
|
||||
.chart-item {
|
||||
.chart-gif,
|
||||
.chart-text {
|
||||
left: 40px;
|
||||
top: 20px;
|
||||
width: 180px;
|
||||
height: 180px;
|
||||
}
|
||||
.chart-text {
|
||||
font-size: 60px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.worker-title {
|
||||
.title-item {
|
||||
padding: 20px 0px 10px 0px;
|
||||
.svg-icon {
|
||||
fill: #3ffcff;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
}
|
||||
font-size: 24px;
|
||||
color: #3ffcff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.investment-stats-cost {
|
||||
padding: 30px 20px;
|
||||
top: -18px;
|
||||
|
||||
.stat-card {
|
||||
height: 130px;
|
||||
padding: 16px 0;
|
||||
box-shadow: 0 2px 8px #0004;
|
||||
border-radius: 10px;
|
||||
}
|
||||
.stat-title {
|
||||
font-size: 24px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.stat-value {
|
||||
font-size: 60px;
|
||||
}
|
||||
.center-icon {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
font-size: 48px;
|
||||
.chart-gif {
|
||||
width: 110px;
|
||||
height: 110px;
|
||||
top: 5px;
|
||||
left: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.plan-chart {
|
||||
height: calc(100% - 60px);
|
||||
.chart-item {
|
||||
.chart-title {
|
||||
font-size: 24px;
|
||||
top: -40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.photography-list {
|
||||
height: calc(100% - 60px);
|
||||
padding: 10px 0px;
|
||||
.el-carousel {
|
||||
height: calc(100% - 10px);
|
||||
}
|
||||
|
||||
.photography-video {
|
||||
height: calc(100% - 30px);
|
||||
}
|
||||
|
||||
.photography-list-title {
|
||||
line-height: 36px;
|
||||
font-size: 24px;
|
||||
}
|
||||
.photography-list-nodata {
|
||||
.video-play {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
line-height: 120px;
|
||||
border-radius: 60px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.photography-list-no-title {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.warn-info {
|
||||
height: calc(100% - 60px);
|
||||
.warn-item {
|
||||
width: calc(50% - 30px);
|
||||
height: 50%;
|
||||
padding-left: 30px;
|
||||
.czz-number-img {
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
line-height: 140px;
|
||||
.svg-icon {
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
top: 24px;
|
||||
}
|
||||
}
|
||||
.warn-data {
|
||||
margin-left: 10px;
|
||||
.warn-data-val {
|
||||
font-size: 60px;
|
||||
}
|
||||
.warn-data-text {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue