update code
parent
255cec71e6
commit
727a1ed346
|
|
@ -0,0 +1,199 @@
|
|||
Vue.component("process-control-new", {
|
||||
template: `
|
||||
<div class="process-control-new">
|
||||
<div :class="chooseProcessControlMenu == i?'process-control-new-list active':'process-control-new-list'" v-for="(item,i) in processControlData"
|
||||
:style="!item.url ? 'cursor: no-drop' :''"
|
||||
@click="onProcessControl(i,i,item.url)"
|
||||
>
|
||||
<div class="process-control-new-run">
|
||||
<!-- <div class="process-control-new-order">{{'0'+item.number}}</div>-->
|
||||
<div class="process-control-new-order">{{'0'+(i+1)}}</div>
|
||||
<div class="process-control-new-content">
|
||||
<div class="process-control-new-title">
|
||||
{{item.label}}
|
||||
</div>
|
||||
<div class="process-control-new-data">
|
||||
<div class="process-control-new-number-1">{{item.left_title}}：<span>{{item.left_data}}{{item.left_unit}}</span></div>
|
||||
<div class="process-control-new-number-2">{{item.right_title}}：<span>{{item.right_data}}{{item.right_unit}}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`,
|
||||
props: {
|
||||
active: {
|
||||
type: Number
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chooseProcessControlMenu: 0,
|
||||
processControlData:[
|
||||
{
|
||||
number:1,
|
||||
label:'取样送检',
|
||||
left_title:'取样数',
|
||||
left_data:0,
|
||||
left_unit:'次',
|
||||
right_title:'报告返回率',
|
||||
right_data:0,
|
||||
right_unit:'%',
|
||||
url: "/weixin/screen/toQualityQYSJ"
|
||||
},
|
||||
{
|
||||
number:2,
|
||||
label:'标养室监测',
|
||||
left_title:'当前温度',
|
||||
left_data:0,
|
||||
left_unit:'℃',
|
||||
right_title:'当前湿度',
|
||||
right_data:0,
|
||||
right_unit:'%RH',
|
||||
url: "/weixin/screen/toQualityBYSJC"
|
||||
},
|
||||
{
|
||||
number:3,
|
||||
label:'混凝土强度监测',
|
||||
left_title:'成熟度',
|
||||
left_data:0,
|
||||
left_unit:'°C*小时',
|
||||
right_title:'当前温度',
|
||||
right_data:0,
|
||||
right_unit:'℃',
|
||||
url: "/weixin/screen/toQualityHNTJC"
|
||||
},
|
||||
/* {
|
||||
number:4,
|
||||
label:'过程验收',
|
||||
left_title:'验收次数',
|
||||
left_data:0,
|
||||
left_unit:'次',
|
||||
right_title:'合格率',
|
||||
right_data:0,
|
||||
right_unit:'%',
|
||||
url: "/weixin/screen/toQualityGCYS"
|
||||
},*/
|
||||
{
|
||||
number:5,
|
||||
label:'举牌验收',
|
||||
left_title:'验收次数',
|
||||
left_data:0,
|
||||
left_unit:'次',
|
||||
right_title:'合格率',
|
||||
right_data:0,
|
||||
right_unit:'%',
|
||||
url: "/weixin/screen/toQualityJPYS"
|
||||
},
|
||||
{
|
||||
number:6,
|
||||
label:'实测实量',
|
||||
left_title:'验收次数',
|
||||
left_data:0,
|
||||
left_unit:'次',
|
||||
right_title:'合格率',
|
||||
right_data:0,
|
||||
right_unit:'%',
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
//this.getData()
|
||||
//this.chooseProcessControlMenu = localStorage.getItem("chooseProcessControlMenu")
|
||||
this.chooseProcessControlMenu="0"
|
||||
this.processControlData=JSON.parse('[{"number":1,"label":"取样送检","left_title":"取样数","left_data":595,"left_unit":"次","right_title":"报告返回率","right_data":"100.00","right_unit":"%","url":"/weixin/screen/toQualityQYSJ"},{"number":2,"label":"标养室监测","left_title":"当前温度","left_data":19.1,"left_unit":"℃","right_title":"当前湿度","right_data":"98.50","right_unit":"%RH","url":"/weixin/screen/toQualityBYSJC"},{"number":3,"label":"混凝土强度监测","left_title":"成熟度","left_data":"39840.0","left_unit":"°C*小时","right_title":"当前温度","right_data":"22.40","right_unit":"℃","url":"/weixin/screen/toQualityHNTJC"},{"number":5,"label":"举牌验收","left_title":"验收次数","left_data":306,"left_unit":"次","right_title":"合格率","right_data":"100.00","right_unit":"%","url":"/weixin/screen/toQualityJPYS"},{"number":6,"label":"实测实量","left_title":"验收次数","left_data":0,"left_unit":"次","right_title":"合格率","right_data":0,"right_unit":"%"}]');
|
||||
},
|
||||
methods: {
|
||||
getData(){
|
||||
axios.post("/api/getProcessControlCount",{
|
||||
dept_id:JSON.parse(localStorage.getItem("data")).dept_id ,
|
||||
project_id: JSON.parse(localStorage.getItem("data")).id
|
||||
}).then(res => {
|
||||
let data = res.data.data
|
||||
this.processControlData = [
|
||||
{
|
||||
number:1,
|
||||
label:'取样送检',
|
||||
left_title:'取样数',
|
||||
left_data:data.samplingCount ? data.samplingCount.left_data : 0,
|
||||
left_unit:'次',
|
||||
right_title:'报告返回率',
|
||||
right_data:data.samplingCount ? (data.samplingCount.right_data * 100 ).toFixed(2) : 0,
|
||||
right_unit:'%',
|
||||
url: "/weixin/screen/toQualityQYSJ"
|
||||
},
|
||||
{
|
||||
number:2,
|
||||
label:'标养室监测',
|
||||
left_title:'当前温度',
|
||||
left_data:data.markingRoomCount ? data.markingRoomCount.left_data : 0,
|
||||
left_unit:'℃',
|
||||
right_title:'当前湿度',
|
||||
right_data:data.markingRoomCount ?Number( data.markingRoomCount.right_data).toFixed(2) : 0,
|
||||
right_unit:'%RH',
|
||||
url: "/weixin/screen/toQualityBYSJC"
|
||||
},
|
||||
{
|
||||
number:3,
|
||||
label:'混凝土强度监测',
|
||||
left_title:'成熟度',
|
||||
left_data:data.concreteCount ? data.concreteCount.left_data : 0,
|
||||
left_unit:'°C*小时',
|
||||
right_title:'当前温度',
|
||||
right_data:data.concreteCount ? Number(data.concreteCount.right_data).toFixed(2) : 0,
|
||||
right_unit:'℃',
|
||||
url: "/weixin/screen/toQualityHNTJC"
|
||||
},
|
||||
/* {
|
||||
number:4,
|
||||
label:'过程验收',
|
||||
left_title:'验收次数',
|
||||
left_data:data.courseReceivingCount ? data.courseReceivingCount.left_data : 0,
|
||||
left_unit:'次',
|
||||
right_title:'合格率',
|
||||
right_data:data.courseReceivingCount ? data.courseReceivingCount.right_data.toFixed(2) : 0,
|
||||
right_unit:'%',
|
||||
url: "/weixin/screen/toQualityGCYS"
|
||||
},*/
|
||||
{
|
||||
number:5,
|
||||
label:'举牌验收',
|
||||
left_title:'验收次数',
|
||||
left_data:data.raisingCount ? data.raisingCount.left_data : 0,
|
||||
left_unit:'次',
|
||||
right_title:'合格率',
|
||||
right_data:data.raisingCount ? (data.raisingCount.right_data * 100).toFixed(2) : 0,
|
||||
right_unit:'%',
|
||||
url: "/weixin/screen/toQualityJPYS"
|
||||
},
|
||||
{
|
||||
number:6,
|
||||
label:'实测实量',
|
||||
left_title:'验收次数',
|
||||
left_data:data.measuredQuantityCount ? data.measuredQuantityCount.left_data : 0,
|
||||
left_unit:'次',
|
||||
right_title:'合格率',
|
||||
right_data:data.measuredQuantityCount ? data.measuredQuantityCount.right_data.toFixed(2) : 0,
|
||||
right_unit:'%',
|
||||
},
|
||||
]
|
||||
})
|
||||
},
|
||||
onProcessControl(n, top ,url) {
|
||||
return;
|
||||
if (url) {
|
||||
localStorage.setItem("chooseProcessControlMenu", n)
|
||||
let chooseMenu = {
|
||||
mainMenu:4,
|
||||
itemMenu:top,
|
||||
}
|
||||
localStorage.setItem("chooseMenu",JSON.stringify(chooseMenu));
|
||||
// 跳转页面
|
||||
location.href = url
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
|
||||
})
|
||||
|
|
@ -24,11 +24,16 @@ Vue.component("quality-objectives", {
|
|||
return {
|
||||
//质量目标
|
||||
qualityTargetData:[
|
||||
// {
|
||||
// title:'创优目标',
|
||||
// text:'获得陕西省“双优”工地，创AAA级国家安全文明标准化工地',
|
||||
// images:'/images/quality_target_1.png',
|
||||
// }
|
||||
{
|
||||
title:'创优目标',
|
||||
text:'获得陕西省“双优”工地，创AAA级国家安全文明标准化工地',
|
||||
images:'images/quality_target_2.png',
|
||||
},
|
||||
{
|
||||
title:'质量管理目标',
|
||||
text:'确保"西安市建筑工程雁塔杯"奖，力争"长安杯"奖。',
|
||||
images:'images/quality_target_1.png',
|
||||
}
|
||||
],
|
||||
}
|
||||
},
|
||||
|
|
@ -36,10 +41,11 @@ Vue.component("quality-objectives", {
|
|||
let that = this
|
||||
let url1 = "http://127.0.0.1:9004/system/qualityTarget/list1"
|
||||
let url2 = "https://szh.makalu.cc/system/qualityTarget/list1"
|
||||
$.post(url2,{},res => {
|
||||
that.qualityTargetData = res[JSON.parse(localStorage.getItem("data1")).id]
|
||||
//$.post(url2,{},res => {
|
||||
//that.qualityTargetData = res[JSON.parse(localStorage.getItem("data1")).id]
|
||||
//console.log(that.qualityTargetData[JSON.parse(localStorage.getItem("data1")).id]);
|
||||
})
|
||||
//})
|
||||
//that.qualityTargetData=JSON.parse('[{"searchValue":null,"createBy":null,"createTime":"2023-07-22 17:58:28","updateBy":null,"updateTime":"2023-07-22 17:58:28","remark":null,"params":{},"id":7,"projectId":"","title":"质量管理目标","text":"确保"西安市建筑工程雁塔杯"奖，力争"长安杯"奖。","images":"https://szh.makalu.cc/images/quality_target_2.png","delFlag":"0","updateUserId":"297","createUserId":"297","projectName":null,"deptId":null,"projectList":null}]');
|
||||
},
|
||||
methods: {
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +1,13 @@
|
|||
import Vue from 'vue'
|
||||
/**
|
||||
* 顶部header
|
||||
*/
|
||||
Vue.component("screen-select", {
|
||||
template: `
|
||||
<div class="select-max" @mouseleave="hideSelectOption">
|
||||
<div class="select-input">
|
||||
<div class="select-input" v-if="type==0">
|
||||
<input type="text" :value="value" @click="clickSelectInput" placeholder="请选择" readonly>
|
||||
</div>
|
||||
<div class="select-input-two" v-if="type==1">
|
||||
<input type="text" :value="value" @click="clickSelectInput" placeholder="请选择" readonly>
|
||||
</div>
|
||||
<el-collapse-transition>
|
||||
|
|
@ -16,8 +21,12 @@ Vue.component("screen-select", {
|
|||
data:{
|
||||
type:Array
|
||||
},
|
||||
val:{
|
||||
type:[String,Number,Object]
|
||||
def:{
|
||||
type:Object
|
||||
},
|
||||
type:{
|
||||
type:Number,
|
||||
default:0
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
|
@ -27,7 +36,9 @@ Vue.component("screen-select", {
|
|||
}
|
||||
},
|
||||
mounted(){
|
||||
|
||||
if(this.def){
|
||||
this.value = this.def.text
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
clickSelectInput(){
|
||||
|
|
@ -43,10 +54,8 @@ Vue.component("screen-select", {
|
|||
}
|
||||
},
|
||||
watch:{
|
||||
val:{
|
||||
hander(){
|
||||
this.value=this.val||'';
|
||||
},
|
||||
def:function (n,o) {
|
||||
this.value = n.text
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2,36 +2,262 @@
|
|||
<div class="project-concrete-strength">
|
||||
<el-row>
|
||||
<el-col :span="6">
|
||||
<module-one-1-1 label="质量目标"></module-one-1-1>
|
||||
<module-one-2-1 label="过程管控"></module-one-2-1>
|
||||
<module-one-1-1 label="质量目标">
|
||||
<quality-objectives></quality-objectives>
|
||||
</module-one-1-1>
|
||||
<module-one-2-1 label="过程管控">
|
||||
<process-control-new :active="3"></process-control-new>
|
||||
</module-one-2-1>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<module-one-1-2 label="当前监测值"></module-one-1-2>
|
||||
<module-one-1-2 label="温度趋势"></module-one-1-2>
|
||||
<module-one-1-2 label="成熟度趋势"></module-one-1-2>
|
||||
<module-one-1-2 label="当前监测值">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<div class="process-control-current-value-con">
|
||||
<div class="current-value-img">
|
||||
<img src="images/hj_wendu.png">
|
||||
</div>
|
||||
<div class="process-control-current-value-data">
|
||||
<div>外置温度</div>
|
||||
<p v-cloak>{{ lastRunData.tempOut == undefined ? 0 : lastRunData.tempOut }} <span>℃</span></p>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="process-control-current-value-con">
|
||||
<div class="current-value-img">
|
||||
<img src="images/hj_wendu.png">
|
||||
</div>
|
||||
<div class="process-control-current-value-data">
|
||||
<div>内置温度</div>
|
||||
<p v-cloak>{{ lastRunData.tempIn == undefined ? 0 : lastRunData.tempIn }}<span>℃</span></p>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="process-control-current-value-con">
|
||||
<div class="current-value-img">
|
||||
<img src="images/qd.png">
|
||||
</div>
|
||||
<div class="process-control-current-value-data">
|
||||
<div>强度</div>
|
||||
<p v-cloak>{{ lastRunData.strong == undefined ? 0 : lastRunData.strong }} <span>MPa</span></p>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="process-control-current-value-con">
|
||||
<div class="current-value-img">
|
||||
<img src="images/csd.png">
|
||||
</div>
|
||||
<div class="process-control-current-value-data">
|
||||
<div>成熟度</div>
|
||||
<p v-cloak>{{ lastRunData.cooked == undefined ? 0 : lastRunData.cooked }}<span>°C*小时</span></p>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</module-one-1-2>
|
||||
<module-one-1-2 label="温度趋势">
|
||||
<div class="sjk-chart-line-title quality-button" style="visibility: hidden">
|
||||
<div :class="trendBtnNav == 1 ? 'active' : ''" @click="onClickTemperatureTrend(1)">近7天</div>
|
||||
<div :class="trendBtnNav == 2 ? 'active' : ''" @click="onClickTemperatureTrend(2)">近30天</div>
|
||||
</div>
|
||||
<trend-chart-line :height="220" :data="temperatureTrendData"></trend-chart-line>
|
||||
</module-one-1-2>
|
||||
<module-one-1-2 label="成熟度趋势">
|
||||
<div class="sjk-chart-line-title quality-button" style="visibility: hidden">
|
||||
<div :class="tumidityBtnNav == 1 ? 'active' : ''" @click="onClickTumidityTrend(1)">近7天</div>
|
||||
<div :class="tumidityBtnNav == 2 ? 'active' : ''" @click="onClickTumidityTrend(2)">近30天</div>
|
||||
</div>
|
||||
<trend-chart-line :height="220" :data="tumidityTrendData"></trend-chart-line>
|
||||
</module-one-1-2>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<div class="analyse-max" style="height:100%;position: absolute;">
|
||||
<div class="analyse-map">
|
||||
<div class="analyse-title analyse_title_blue">
|
||||
<div class="analyse-text">当前设备</div>
|
||||
<div class="analyse-equipment">混凝土强度监测</div>
|
||||
</div>
|
||||
<div class="hj-moment-max">
|
||||
<table>
|
||||
<tr>
|
||||
<td>设备名称：</td>
|
||||
<td>
|
||||
<div class="hj-moment-choice">
|
||||
<div class="hj-moment-select">
|
||||
<screen-select :data="selectData" :def="selectData[0]"
|
||||
@option="clickOptionList"></screen-select>
|
||||
</div>
|
||||
<div class="hj-moment-state">
|
||||
|
||||
<!-- <div class="state-tag state-zx">在线</div>-->
|
||||
<!--<div class="state-tag state-lx">离线</div>-->
|
||||
|
||||
|
||||
<div :class="lastChooseDevice.deviceStatus == 1 ? 'state-tag state-lx' : 'state-tag state-zx'">
|
||||
{{ lastChooseDevice.deviceStatus == 1 ? '离线' : '在线' }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>名称：</td>
|
||||
<td>
|
||||
<div class="hj-moment-blue" v-cloak>混凝土监控设备-{{ lastChooseDevice.deviceId }}</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>安装位置：</td>
|
||||
<td v-cloak>{{ lastChooseDevice.address }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>设备状态：</td>
|
||||
<td>
|
||||
<div :class="lastChooseDevice.deviceStatus == 1 ? 'hj-moment-orange' : 'hj-moment-green'">
|
||||
{{ lastChooseDevice.deviceStatus == 1 ? '离线' : '在线' }}</div>
|
||||
</td> <!--离线 class='hj-moment-orange'-->
|
||||
</tr>
|
||||
<tr>
|
||||
<td>设备编码：</td>
|
||||
<td v-cloak>{{ lastChooseDevice.deviceId }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>更新时间：</td>
|
||||
<td v-cloak>{{ lastChooseDevice.deviceUpdateTime }}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="analyse-min" style="height: calc(100% - 400px);">
|
||||
<div class="analyse-title">
|
||||
<div class="analyse-text">正在发生</div>
|
||||
</div>
|
||||
<div class="afoot-content" style="height: calc(100% - 60px);">
|
||||
<div class="afoot-overflow process-afoot-overflow" v-if="warningData && warningData.length > 0"
|
||||
id="afootOverflow" @mouseout="listMinMouseout" @mouseover="listMinMouseover" style="height:100%;">
|
||||
<div :class="forIndex == i ? 'afoot-con-for active' : 'afoot-con-for '"
|
||||
v-for="(item, i) in warningData">
|
||||
<div class="afoot-machinery-nam" v-cloak>{{ item.type }}</div>
|
||||
<div class="afoot-machinery-info">
|
||||
<div class="afoot-machinery-img">
|
||||
<img :src="item.images" v-if="item.images">
|
||||
</div>
|
||||
<div class="afoot-machinery-data">
|
||||
<div class="afoot-machinery-state" v-cloak>{{ item.content }} <span
|
||||
class="hj-moment-blue">(正常范围：{{ item.threshold }})</span></div>
|
||||
<div class="afoot-machinery-time" v-cloak>{{ item.time }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="afoot-machinery-project">预警差值：<span class="hj-moment-orange" v-cloak>{{ item.chaValue
|
||||
}}</span></div>
|
||||
<div class="afoot-machinery-project" v-cloak>恢复时间：{{ item.recoveryTime }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="div-no-data" style="padding-top:100px">
|
||||
<img src="images/nodata.png" style="width: 120px;">
|
||||
<div style="text-align: center;font-size: 12px;color:#888;">暂无数据</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="6"></el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import '@/components/module/module-one-1-2'
|
||||
import '@/components/module/module-one-2-1'
|
||||
import '@/components/quality-objectives'
|
||||
import '@/components/process-control-new'
|
||||
import '@/components/trend-chart-line'
|
||||
import '@/components/screen-select'
|
||||
export default {
|
||||
//混泥土强度检测
|
||||
name: 'JhbigscreenConcreteStrength',
|
||||
|
||||
data() {
|
||||
return {
|
||||
//当前检测值
|
||||
detectionValue: [],
|
||||
|
||||
//温度趋势
|
||||
trendBtnNav: 1,
|
||||
temperatureTrendData: {},
|
||||
//湿度趋势
|
||||
tumidityBtnNav: 1,
|
||||
tumidityTrendData: {},
|
||||
|
||||
//正在发生
|
||||
//正在发生
|
||||
warningInterval: undefined,
|
||||
forIndex: 0,
|
||||
warningData: [],
|
||||
lastRunData: {},
|
||||
selectData: [],
|
||||
lastChooseDevice: {},
|
||||
projectId: '1649949529732075522',
|
||||
projectIdLoc: {},
|
||||
};
|
||||
},
|
||||
|
||||
mounted() {
|
||||
|
||||
this.lastRunData = { tempOut: 13, tempIn: 20, strong: 2.33, cooked: 33 };
|
||||
this.onClickTemperatureTrend(1);
|
||||
this.onClickTumidityTrend(1);
|
||||
//正在发生 定时器
|
||||
this.warningInterval = setInterval(this.automaticRoll, 5000);
|
||||
this.selectData=JSON.parse('[{"address":"墙柱","deviceUpdateTime":"2023-04-30 02:31:09","deviceId":"1650041930114977794","deviceName":"4","showDate":"2023-04-23 15:40:09","deviceStatus":"1","id":"1650041930114977794","text":"1650041930114977794","deviceNo":"1650041930114977794"},{"address":"墙柱","deviceUpdateTime":"2023-07-06 16:16:42","deviceId":"1650042067465850882","deviceName":"5","showDate":"2023-04-23 15:40:50","deviceStatus":"1","id":"1650042067465850882","text":"1650042067465850882","deviceNo":"1650042067465850882"}]');
|
||||
this.lastChooseDevice=this.selectData[0];
|
||||
this.warningData="1,2,3,4,5,6,7,8".split(",").map(d=>{
|
||||
return { type: "预警A-"+d, images: ['images/831.jpg'],
|
||||
content: '100',
|
||||
threshold:'[60-80]',
|
||||
time: '24-02-02 14:00', chaValue: '20',recoveryTime:'24-02-02 16:00' }
|
||||
});
|
||||
},
|
||||
|
||||
methods: {
|
||||
//温度趋势
|
||||
onClickTemperatureTrend(n) {
|
||||
this.trendBtnNav = n
|
||||
if (n == 1) {
|
||||
this.temperatureTrendData = JSON.parse('{"lineData":[["15.0","15.0","15.0","15.0","15.0","15.0"],["16.1","16.1","16.1","16.1","16.1","16.1"]],"color":["#5af9fd","#ff9526"],"legend":["内置平均温度","外置平均温度"],"unit":"℃","date":["2024-03-05","2024-03-06","2024-03-07","2024-03-08","2024-03-09","2024-03-10"]}');
|
||||
} else {
|
||||
this.temperatureTrendData = JSON.parse('{"lineData":[["15.0","15.0","15.0","15.0","15.0","15.0"],["16.1","16.1","16.1","16.1","16.1","16.1"]],"color":["#5af9fd","#ff9526"],"legend":["内置平均温度","外置平均温度"],"unit":"℃","date":["2024-03-05","2024-03-06","2024-03-07","2024-03-08","2024-03-09","2024-03-10"]}');
|
||||
}
|
||||
},
|
||||
//强度趋势
|
||||
onClickTumidityTrend(n) {
|
||||
this.tumidityBtnNav = n;
|
||||
if (n == 1) {
|
||||
this.tumidityTrendData = JSON.parse('{"lineData":[["2484.9","2484.9","2484.9","2484.9","2484.9","2484.9"],["2327.7","2327.7","2327.7","2327.7","2327.7","2327.7"],["0.0","0.0","0.0","0.0","0.0","0.0"],["0.0","0.0","0.0","0.0","0.0","0.0"]],"color":["#5af9fd","#ff0000","#ff9526","#7C41D0"],"legend":["内置成熟度","外置成熟度","内置强度","外置强度"],"unit":"%RH","date":["2024-03-05","2024-03-06","2024-03-07","2024-03-08","2024-03-09","2024-03-10"]}');
|
||||
} else {
|
||||
this.tumidityTrendData = JSON.parse('{"lineData":[["2484.9","2484.9","2484.9","2484.9","2484.9","2484.9"],["2327.7","2327.7","2327.7","2327.7","2327.7","2327.7"],["0.0","0.0","0.0","0.0","0.0","0.0"],["0.0","0.0","0.0","0.0","0.0","0.0"]],"color":["#5af9fd","#ff0000","#ff9526","#7C41D0"],"legend":["内置成熟度","外置成熟度","内置强度","外置强度"],"unit":"%RH","date":["2024-03-05","2024-03-06","2024-03-07","2024-03-08","2024-03-09","2024-03-10"]}');
|
||||
}
|
||||
},
|
||||
automaticRoll() {
|
||||
var height = $(".afoot-con-for").innerHeight()
|
||||
if (this.forIndex == this.warningData.length) {
|
||||
this.forIndex = 0
|
||||
} else {
|
||||
this.forIndex = this.forIndex + 1
|
||||
}
|
||||
|
||||
$("#afootOverflow").animate({ scrollTop: (height * this.forIndex) + 'px' })
|
||||
},
|
||||
|
||||
listMinMouseover() {
|
||||
clearInterval(this.warningInterval);
|
||||
},
|
||||
listMinMouseout() {
|
||||
this.warningInterval = setInterval(this.automaticRoll, 5000);
|
||||
},//当前设备返回值
|
||||
clickOptionList(e) {
|
||||
this.lastChooseDevice = e
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -180,7 +180,7 @@
|
|||
</div>
|
||||
<div class="sjk-chart-line-title scroll mon-points">
|
||||
<div v-for="(it, idx) in pointData" :key="idx" :class="(selPoint?.id || 0) == it.id ? 'active' : ''"
|
||||
class="title-item" @click="selPoint=it">{{
|
||||
class="title-item" @click="selPoint = it">{{
|
||||
it.name }}</div>
|
||||
</div>
|
||||
<div style="padding:10px;" class="mon-point-info">
|
||||
|
|
@ -270,7 +270,10 @@
|
|||
</module-one-1-2>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<module-one-1-2 label="累计变化量">
|
||||
<module-one-1-2 label="变化速率统计">
|
||||
<div style="padding:0px 20px;">
|
||||
<enginChart ref="chart1" :height="280"></enginChart>
|
||||
</div>
|
||||
</module-one-1-2>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
|
@ -283,11 +286,11 @@ import '@/components/module/module-one-1-2'
|
|||
import '@/components/module/module-one-2-1'
|
||||
import '@/components/classify-bar'
|
||||
import '@/components/trend-line-chart'
|
||||
|
||||
import enginChart from '../engin/enginChart.vue'
|
||||
export default {
|
||||
//基坑
|
||||
name: 'JhbigscreenExcavation',
|
||||
|
||||
components: { enginChart },
|
||||
data() {
|
||||
return {
|
||||
selPoint: {},
|
||||
|
|
@ -312,7 +315,7 @@ export default {
|
|||
btnNav: 1,
|
||||
CollWeiyiPointData: {},
|
||||
CollWeiyiPointDataData: [],
|
||||
|
||||
|
||||
CollQingxiePointDataX: {},
|
||||
CollQingxiePointDataXdData: [],
|
||||
|
||||
|
|
@ -349,11 +352,60 @@ export default {
|
|||
ratD: '0.23', ratM: 12, ratS: 'D'
|
||||
}
|
||||
});
|
||||
this.selPoint = this.pointData[0];
|
||||
this.selPoint = this.pointData[0];
|
||||
this.init();
|
||||
this.initChart();
|
||||
},
|
||||
|
||||
methods: {
|
||||
initChart() {
|
||||
|
||||
let opt2 = {
|
||||
grid: {
|
||||
left: 30,
|
||||
right: 30,
|
||||
top: 40,
|
||||
bottom: 60
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
}
|
||||
},
|
||||
color: ['#409eff'],
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: ["地表沉降","深层水平位移","立柱水平位移","临近道路路基沉降","边坡顶部水平位移","支撑轴力","围护桩顶部竖向位移","围护桩顶部水平位移"],
|
||||
axisLabel: {
|
||||
color: "#fff",
|
||||
fontSize: 10,
|
||||
interval: 0, rotate: 30
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
show: true,
|
||||
color: "#fff"
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
|
||||
label: {
|
||||
show: true,
|
||||
color: '#82c9ff',
|
||||
position: 'top',
|
||||
},
|
||||
data: [100,120,240,100,120,130,140,100,190],
|
||||
type: 'bar'
|
||||
|
||||
}
|
||||
]
|
||||
};
|
||||
this.$refs.chart1.init(opt2);
|
||||
},
|
||||
init() {
|
||||
this.warningTypeInterval = setInterval(this.automaticRollType, 5000);
|
||||
},
|
||||
|
|
@ -564,28 +616,34 @@ export default {
|
|||
.mon-point-title {
|
||||
color: #51b5ff;
|
||||
}
|
||||
.mon-point-row{
|
||||
|
||||
.mon-point-row {
|
||||
line-height: 60px;
|
||||
font-size:12px;
|
||||
.sp-data{
|
||||
font-size: 12px;
|
||||
|
||||
.sp-data {
|
||||
display: inline-block;
|
||||
width:105px;
|
||||
width: 105px;
|
||||
}
|
||||
.sp-lbl{
|
||||
|
||||
.sp-lbl {
|
||||
display: inline-block;
|
||||
width:110px;
|
||||
width: 110px;
|
||||
}
|
||||
.mon-arr{
|
||||
font-size:16px;
|
||||
|
||||
.mon-arr {
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
&.mon-arr-A{
|
||||
color:red;
|
||||
|
||||
&.mon-arr-A {
|
||||
color: red;
|
||||
}
|
||||
&.mon-arr-D{
|
||||
color:green;
|
||||
|
||||
&.mon-arr-D {
|
||||
color: green;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue