chengdandan
/
TransFlow
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

2023022402

This commit is contained in:
chengdandan 2023-02-24 15:37:14 +08:00
parent 72b4fea524
commit 4fb23054c4
2 changed files with 34 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

90
src/components/target/typeChart.vue
View File

@ -16,6 +16,7 @@
<div> <div>
{{ dataArr[0].time ? dataArr[0].time : '' }} {{ dataArr[0].time ? dataArr[0].time : '' }}
</div> </div>
</div> </div>
</el-card> </el-card>
</div> </div>
@ -25,29 +26,29 @@
<div v-if="title == '类型'"> <div v-if="title == '类型'">
<span style="font-size: 15px;">类型数量总和</span><br /> <span style="font-size: 15px;">类型数量总和</span><br />
<span style="font-size: 30px; font-weight: bold"> <span style="font-size: 30px; font-weight: bold">
{{ }} {{ getTotal(dataArr) }}
</span> </span>
</div> </div>
<div style="font-size: 30px; font-weight: bold" v-if="title == '速度'"> <div style="font-size: 30px; font-weight: bold" v-if="title == '速度'">
<span style="font-size: 15px;">速度</span><br /> <span style="font-size: 15px;">速度</span><br />
<!-- <span style="font-size: 30px; font-weight: bold">{{ typeValue.speed }}</span> --> <!-- <span style="font-size: 30px; font-weight: bold">{{ typeValue.speed }}</span> -->
<span style="font-size: 30px; font-weight: bold">{{ dataArrNew[0].speed }}</span> <span style="font-size: 30px; font-weight: bold">{{ dataArr[0].speed }}</span>
</div> </div>
<div style="font-size: 30px; font-weight: bold" v-if="title == '流量'"> <div style="font-size: 30px; font-weight: bold" v-if="title == '流量'">
<span style="font-size: 15px;">流量</span><br /> <span style="font-size: 15px;">流量</span><br />
<span style="font-size: 30px; font-weight: bold">{{ dataArrNew[0].flow }}</span> <span style="font-size: 30px; font-weight: bold">{{ dataArr[0].flow }}</span>
</div> </div>
<div style="font-size: 30px; font-weight: bold" v-if="title == '车头时距'"> <div style="font-size: 30px; font-weight: bold" v-if="title == '车头时距'">
<span style="font-size: 15px;">车头时距</span><br /> <span style="font-size: 15px;">车头时距</span><br />
<span style="font-size: 30px; font-weight: bold">{{ dataArrNew[0].headway }}</span> <span style="font-size: 30px; font-weight: bold">{{ dataArr[0].headway }}</span>
</div> </div>
<div style="font-size: 30px; font-weight: bold" v-if="title == '排队数'"> <div style="font-size: 30px; font-weight: bold" v-if="title == '排队数'">
<span style="font-size: 15px;">排队数</span><br /> <span style="font-size: 15px;">排队数</span><br />
<span style="font-size: 30px; font-weight: bold">{{ dataArrNew[0].queue }}</span> <span style="font-size: 30px; font-weight: bold">{{ queue }}</span>
</div> </div>
<div style="font-size: 30px; font-weight: bold" v-if="title == '检测数'"> <div style="font-size: 30px; font-weight: bold" v-if="title == '检测数'">
<span style="font-size: 15px;">检测数</span><br /> <span style="font-size: 15px;">检测数</span><br />
<span style="font-size: 30px; font-weight: bold">{{ dataArrNew[0].n_stay }}</span> <span style="font-size: 30px; font-weight: bold">{{ dataArr[0].n_stay }}</span>
</div> </div>
<div style="font-size: 30px; font-weight: bold" v-if="title == '延误'"> <div style="font-size: 30px; font-weight: bold" v-if="title == '延误'">
<span style="font-size: 15px;">延误</span><br /> <span style="font-size: 15px;">延误</span><br />
@ -91,7 +92,7 @@
<div class="border" v-if="echartArr.includes('饼状图')"> <div class="border" v-if="echartArr.includes('饼状图')">
<detailDialog /> <detailDialog />
<pieChart :componentName="componentName" :chartName="chartName" :pageType="pageType" :list="dataArr" <pieChart :componentName="componentName" :chartName="chartName" :pageType="pageType" :list="dataArr"
:status="triggerType" :title="title" :typeValue="typeValue" /> :status="triggerType" :title="title" :typeValue="typeValue" ref="pieChartRef"/>
</div> </div>
<div class="border" v-if="echartArr.includes('均值图')"> <div class="border" v-if="echartArr.includes('均值图')">
<detailDialog /> <detailDialog />
@ -101,7 +102,7 @@
<div class="border" v-if="echartArr.includes('直方图')"> <div class="border" v-if="echartArr.includes('直方图')">
<detailDialog /> <detailDialog />
<barChart :componentName="componentName" :chartName="chartName" :pageType="pageType" :list="dataArr" <barChart :componentName="componentName" :chartName="chartName" :pageType="pageType" :list="dataArr"
:status="triggerType" :title="title" :typeValue="typeValue" /> :status="triggerType" :title="title" :typeValue="typeValue" ref="barChartRef"/>
</div> </div>
</div> </div>
</template> </template>
@ -138,32 +139,27 @@ export default {
valueShow: { }, valueShow: { },
//排队数 //排队数
queue:'', queue: '',
dataArrNew:[{
//总和
//速度
speed:0,
//流量
flow:0 ,
//车头时距
headway:0,
//排队数
queue:0,
//检测数
n_stay:0,
//延误
ave_delay:0,
time:'2023-02-24 15:07:14'
}]
}; };
}, },
created() { created() {
console.log(this.title + 'TYPECHARTdataArr', this.dataArr) // console.log(this.title + 'TYPECHARTdataArr', this.dataArr)
}, },
methods: { methods: {
getTotal(dataArr) {
console.log(dataArr[0], 150);
return dataArr[0].type_data.reduce(function(prev, cur) {
return cur.quantity + prev
}, 0)
// return dataArr[0].type_data((pre, cur) => {
// return pre + cur
// }, 0)
},
// 计算类型的数值 // 计算类型的数值
getNewQueue(dataArr){ getNewQueue(dataArr) {
console.log("计算类型的数值",dataArr) // console.log("计算类型的数值",dataArr)
// if(dataArr[0].timeMode=='触发'){ // if(dataArr[0].timeMode=='触发'){
// this.queue = dataArr[0].n_queue // this.queue = dataArr[0].n_queue
// }else if(dataArr[0].timeMode=='周期统计'){ // }else if(dataArr[0].timeMode=='周期统计'){
@ -171,11 +167,11 @@ export default {
// }else if(dataArr[0].timeMode=='周期时刻'){ // }else if(dataArr[0].timeMode=='周期时刻'){
// } // }
if(dataArr[0].n_queue){ if (dataArr[0].n_queue) {
this.dataArrNew.queue = dataArr[0].n_queue this.queue = dataArr[0].n_queue
}else if(dataArr[0].ave_queue){ } else if (dataArr[0].ave_queue) {
this.dataArrNew.queue = dataArr[0].ave_queue this.queue = dataArr[0].ave_queue
}else if(dataArr[0].timeMode=='周期时刻'){ } else if (dataArr[0].timeMode == '周期时刻') {
} }
} }
@ -183,39 +179,19 @@ export default {
computed: { computed: {
// 获取类型的总数量 // 获取类型的总数量
getTotal() {
return this.dataArr[0].type_data((pre, cur) => {
return pre + cur
}, 0)
}
}, },
mounted() { }, mounted() { },
watch: { watch: {
// 监听触发数据 // 监听触发数据
dataArr: { dataArr: {
handler(oldVal,newVal) { handler(newVal) {
console.log('oldValdataArr', oldVal); // console.log('dataArr', newVal);
console.log('dataArr', newVal); this.getNewQueue(newVal)
this.dataArrNew = newVal
if(newVal!=undefined&&newVal.length!=0){
this.getNewQueue(newVal)
}
}, },
immediate: true immediate: true
}, },
typeValue: {
handler(newVal) {
this.total = 0;
// if (this.title == '类型') {
// newVal.type_data.forEach(ele => {
// this.total += ele.quantity;
// });
// }
}
}
// cycleTimeData: { // cycleTimeData: {
// handler(newVal) { // handler(newVal) {
// console.log(newVal); // console.log(newVal);

6
src/views/bounced/dataBoard.vue
View File

@ -145,8 +145,6 @@ export default {
if (res.data.code == 200) { if (res.data.code == 200) {
console.log(res.data.data, '组件的数据'); console.log(res.data.data, '组件的数据');
this.componentList = res.data.data; this.componentList = res.data.data;
this.sectionArr=[]
this.sectionData=[]
this.siftData(); this.siftData();
} }
}); });
@ -235,12 +233,11 @@ export default {
var _this = this var _this = this
if (newVal.length != 0 && _this.sectionData) { if (newVal.length != 0 && _this.sectionData) {
_this.classify.forEach((ele, index) => { _this.classify.forEach((ele, index) => {
// console.log("classify",ele)
if (ele.trigger == undefined && ele.timeMode == '触发') { if (ele.trigger == undefined && ele.timeMode == '触发') {
ele.trigger = []; ele.trigger = [];
} }
newVal.forEach((item) => { newVal.forEach((item) => {
// console.log("ele",ele)
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '触发') { if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '触发') {
if (ele.trigger.length == 10) { if (ele.trigger.length == 10) {
ele.trigger.splice(newVal.length - 1, 1); ele.trigger.splice(newVal.length - 1, 1);
@ -251,7 +248,6 @@ export default {
_this.typeTimeMode = item _this.typeTimeMode = item
} }
ele.trigger.unshift(item); ele.trigger.unshift(item);
// console.log("ele.trigger",ele.trigger)
_this.$nextTick(() => { _this.$nextTick(() => {
for (let i = 0; i < _this.$refs.typeChartRef.length; i++) { for (let i = 0; i < _this.$refs.typeChartRef.length; i++) {