bug修改
This commit is contained in:
parent
56a5e93bb4
commit
ea3eb0d0ca
|
|
@ -0,0 +1,13 @@
|
|||
import axios from 'axios';
|
||||
import qs from 'qs';
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
axios.defaults.baseURL = '/';
|
||||
} else if (process.env.NODE_ENV === 'production') {
|
||||
axios.defaults.baseURL = '/';
|
||||
}
|
||||
//获取所有账号数据接口
|
||||
export const getZhanghData = params => {
|
||||
return axios.get('api/GetZhangh', {
|
||||
params
|
||||
});
|
||||
};
|
||||
|
|
@ -1,7 +1,5 @@
|
|||
<template>
|
||||
|
||||
<div id="barChart" ref="barChart" style="width:100%;height:300px;"></div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -10,7 +8,7 @@ export default {
|
|||
props: {
|
||||
list: Array,
|
||||
default() {
|
||||
return []
|
||||
return [];
|
||||
},
|
||||
pageType: {
|
||||
type: String
|
||||
|
|
@ -27,59 +25,58 @@ export default {
|
|||
chartName: {
|
||||
type: String
|
||||
},
|
||||
typeValue:{
|
||||
type:Object
|
||||
typeValue: {
|
||||
type: Object
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
xData: [],
|
||||
yData: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
drawBar() {
|
||||
|
||||
let myChart = this.$echarts.getInstanceByDom(this.$refs.barChart)
|
||||
console.log(this.yData, 222);
|
||||
let myChart = this.$echarts.getInstanceByDom(this.$refs.barChart);
|
||||
if (myChart == null) {
|
||||
myChart = this.$echarts.init(this.$refs.barChart)
|
||||
myChart = this.$echarts.init(this.$refs.barChart);
|
||||
}
|
||||
let option = {
|
||||
color: ['#7262FD', '#FC5A5A'],
|
||||
title:{
|
||||
show:true,
|
||||
text:this.componentName + '-' + this.chartName + '-' + '柱状图',
|
||||
textStyle:{
|
||||
lineHeight:'30',
|
||||
title: {
|
||||
show: true,
|
||||
text: this.componentName + '-' + this.chartName + '-' + '柱状图',
|
||||
textStyle: {
|
||||
lineHeight: '30'
|
||||
}
|
||||
},
|
||||
tooltip: {
|
||||
confine: true,
|
||||
confine: true
|
||||
},
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '4%',
|
||||
bottom: '10%',
|
||||
top: '20%',
|
||||
containLabel: true,
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: this.xData,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#000',
|
||||
},
|
||||
color: '#000'
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 12,
|
||||
color: '#000',
|
||||
color: '#000'
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
show: false
|
||||
}
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
|
|
@ -87,64 +84,64 @@ export default {
|
|||
min: 0,
|
||||
minInterval: 1,
|
||||
splitArea: {
|
||||
show: false,
|
||||
show: false
|
||||
},
|
||||
|
||||
axisLine: {
|
||||
show: true,
|
||||
show: true
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
show: false
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: '#eeebeb',
|
||||
type: 'dashed', // dotted 虚线
|
||||
},
|
||||
type: 'dashed' // dotted 虚线
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 12,
|
||||
color: '#000',
|
||||
fontFamily: 'Bebas',
|
||||
},
|
||||
}],
|
||||
series: [{
|
||||
type: 'bar',
|
||||
barWidth: 20,
|
||||
itemStyle: { barBorderRadius: [5, 5, 0, 0], },
|
||||
name: '时间',
|
||||
data: this.yData
|
||||
},
|
||||
fontFamily: 'Bebas'
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
type: 'bar',
|
||||
barWidth: 20,
|
||||
itemStyle: { barBorderRadius: [5, 5, 0, 0] },
|
||||
name: '时间',
|
||||
data: this.yData
|
||||
}
|
||||
]
|
||||
};
|
||||
myChart.setOption(option)
|
||||
myChart.setOption(option);
|
||||
// window.onresize = () => { // 根据窗口大小变化图表自适应
|
||||
// myChart.resize();
|
||||
// };
|
||||
window.addEventListener('resize', function () {
|
||||
myChart.resize()
|
||||
}
|
||||
)
|
||||
},
|
||||
window.addEventListener('resize', function() {
|
||||
myChart.resize();
|
||||
});
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.drawBar()
|
||||
this.drawBar();
|
||||
},
|
||||
watch: {
|
||||
typeValue: {
|
||||
typeValue: {
|
||||
handler(newVal) {
|
||||
if (newVal) {
|
||||
this.xData = newVal.type_data.map(ele => {
|
||||
return ele.name
|
||||
})
|
||||
return ele.name;
|
||||
});
|
||||
this.yData = newVal.type_data.map(ele => {
|
||||
return ele.quantity
|
||||
})
|
||||
this.drawBar()
|
||||
return ele.quantity;
|
||||
});
|
||||
this.drawBar();
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
@ -72,7 +72,7 @@ export default {
|
|||
lineHeight: '30'
|
||||
}
|
||||
},
|
||||
legend:{},
|
||||
legend: {},
|
||||
grid: {
|
||||
left: '2%',
|
||||
right: '4%',
|
||||
|
|
@ -265,7 +265,7 @@ export default {
|
|||
}
|
||||
if (this.$refs.lineChart) {
|
||||
this.$nextTick(() => {
|
||||
this.drawLine();
|
||||
// this.drawLine();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,12 +4,12 @@
|
|||
|
||||
<script>
|
||||
export default {
|
||||
name: 'pieChart',//饼图图组件
|
||||
name: 'pieChart', //饼图图组件
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
default() {
|
||||
return []
|
||||
return [];
|
||||
}
|
||||
},
|
||||
componentName: {
|
||||
|
|
@ -21,10 +21,8 @@ export default {
|
|||
typeValue: {
|
||||
type: Object
|
||||
}
|
||||
|
||||
},
|
||||
data() {
|
||||
|
||||
return {
|
||||
// 图例数据
|
||||
legend: [],
|
||||
|
|
@ -37,88 +35,80 @@ export default {
|
|||
{
|
||||
name: '非机动车',
|
||||
value: 0
|
||||
}, {
|
||||
},
|
||||
{
|
||||
name: '行人',
|
||||
value: 0
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
methods: {
|
||||
drawPie() {
|
||||
let myChart = this.$echarts.getInstanceByDom(this.$refs.pieChart)
|
||||
let myChart = this.$echarts.getInstanceByDom(this.$refs.pieChart);
|
||||
if (myChart == null) {
|
||||
myChart = this.$echarts.init(this.$refs.pieChart)
|
||||
myChart = this.$echarts.init(this.$refs.pieChart);
|
||||
}
|
||||
var color = [
|
||||
'#0CD2E6',
|
||||
'#3751E6',
|
||||
'#FFC722'
|
||||
];
|
||||
var color = ['#0CD2E6', '#3751E6', '#FFC722'];
|
||||
let option = {
|
||||
title: {
|
||||
show: true,
|
||||
text: this.componentName + '-' + this.chartName + '-' + '饼状图',
|
||||
textStyle: {
|
||||
lineHeight: '30',
|
||||
lineHeight: '30'
|
||||
}
|
||||
},
|
||||
color: color,
|
||||
legend: {
|
||||
top: 20,
|
||||
right: 'center',
|
||||
textStyle: {
|
||||
|
||||
},
|
||||
data: this.legend,
|
||||
textStyle: {},
|
||||
data: this.legend
|
||||
},
|
||||
tooltip: {},
|
||||
series: [{
|
||||
type: 'pie',
|
||||
center: ['50%', '55%'],
|
||||
radius: '70%',
|
||||
label: {
|
||||
normal: {
|
||||
show: false,
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
center: ['50%', '55%'],
|
||||
radius: '70%',
|
||||
label: {
|
||||
normal: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
},
|
||||
labelLine: {
|
||||
show: false,
|
||||
length: 0,
|
||||
length2: 0,
|
||||
},
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
position: 'inside',
|
||||
formatter: '{value|{c}}',
|
||||
rich: {
|
||||
value: {
|
||||
fontSize: 20,
|
||||
color: '#ffffff',
|
||||
},
|
||||
},
|
||||
}
|
||||
},
|
||||
data: this.seriesData,
|
||||
}],
|
||||
labelLine: {
|
||||
show: false,
|
||||
length: 0,
|
||||
length2: 0
|
||||
},
|
||||
label: {
|
||||
normal: {
|
||||
show: true,
|
||||
position: 'inside',
|
||||
formatter: '{value|{c}}',
|
||||
rich: {
|
||||
value: {
|
||||
fontSize: 20,
|
||||
color: '#ffffff'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
data: this.seriesData
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
myChart.setOption(option)
|
||||
|
||||
myChart.setOption(option);
|
||||
|
||||
// window.onresize = () => { // 根据窗口大小变化图表自适应
|
||||
// myChart.resize();
|
||||
// };
|
||||
window.addEventListener('resize', function () {
|
||||
myChart.resize()
|
||||
}
|
||||
)
|
||||
|
||||
},
|
||||
window.addEventListener('resize', function() {
|
||||
myChart.resize();
|
||||
});
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.drawPie();
|
||||
|
|
@ -128,21 +118,20 @@ export default {
|
|||
handler(newVal) {
|
||||
if (newVal) {
|
||||
this.legend = newVal.type_data.map(ele => {
|
||||
return ele.name
|
||||
return ele.name;
|
||||
});
|
||||
this.seriesData = []
|
||||
this.seriesData = [];
|
||||
newVal.type_data.forEach(ele => {
|
||||
this.seriesData.push({
|
||||
name: ele.name,
|
||||
value: ele.quantity
|
||||
})
|
||||
})
|
||||
this.drawPie()
|
||||
|
||||
});
|
||||
});
|
||||
// this.drawPie();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped></style>
|
||||
|
|
@ -1,118 +1,113 @@
|
|||
<template>
|
||||
<div class="content-box">
|
||||
<div class="container">
|
||||
<p class="title">账号管理</p>
|
||||
<!-- <div class="test-div">
|
||||
<i class="el-icon-edit"></i>
|
||||
<i class="el-icon-share"></i>
|
||||
<i class="el-icon-delete"></i>
|
||||
</div> -->
|
||||
<el-button @click="addAccountDialog = true" type="primary" style="margin-bottom: 10px;"><i
|
||||
class="el-icon-circle-plus-outline" style="margin-right: 3px;"></i>新增</el-button>
|
||||
|
||||
<el-table :data="tableData" :height="tableHeight" border style="width: 100%">
|
||||
<el-table-column align="center" prop="name" label="用户名称" width="180"></el-table-column>
|
||||
<el-table-column align="center" prop="account" label="用户账号" width="180"></el-table-column>
|
||||
<el-table-column align="center" prop="role" label="角色"></el-table-column>
|
||||
<el-table-column align="center" prop="jurisdiction" label="权限"></el-table-column>
|
||||
<el-table-column align="center" label="操作" width="160">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="edit(scope.row)" type="text" size="small" class="">编辑</el-button>
|
||||
<el-button @click="showView(scope.row)" type="text" size="small" class="el-icon-view"></el-button>
|
||||
<el-button @click="clickDelete(scope.row)" type="text" size="small" class="el-icon-delete"></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
||||
:current-page.sync="currentPage" :page-sizes="[100, 200, 300, 400]" :page-size="pageSize"
|
||||
layout="sizes, prev, pager, next" :total="totalNumber" style="padding-top: 10px;">
|
||||
</el-pagination>
|
||||
<div class="dialog">
|
||||
<el-dialog :title="dialogTitle" :visible.sync="addAccountDialog" width="30%">
|
||||
<el-form label-position="left" label-width="80px" :model="formLabelAlign">
|
||||
<el-form-item label="名称：">
|
||||
<el-input v-model="formLabelAlign.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="账号：">
|
||||
<el-input v-model="formLabelAlign.account"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色：">
|
||||
<el-input v-model="formLabelAlign.role"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="权限：">
|
||||
<el-input v-model="formLabelAlign.jurisdiction"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="addAccountDialog = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<div class="content-box">
|
||||
<div class="container">
|
||||
<p class="title">账号管理</p>
|
||||
<el-button @click="addAccountDialog = true" type="primary" style="margin-bottom: 10px;"
|
||||
><i class="el-icon-circle-plus-outline" style="margin-right: 3px;"></i>新增</el-button
|
||||
>
|
||||
<el-table :data="tableData" :height="tableHeight" border style="width: 100%">
|
||||
<el-table-column align="center" prop="userName" label="用户名称" width="180"></el-table-column>
|
||||
<el-table-column align="center" prop="account" label="用户账号" width="180"></el-table-column>
|
||||
<el-table-column align="center" prop="roleName" label="角色"></el-table-column>
|
||||
<el-table-column align="center" label="权限">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.isEnable === '1' ? '启用' : '禁用' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column align="center" label="操作" width="160">
|
||||
<template slot-scope="scope">
|
||||
<el-button @click="edit(scope.row)" type="text" size="small" class="">编辑</el-button>
|
||||
<!-- <el-button @click="showView(scope.row)" type="text" size="small" class="el-icon-view"></el-button> -->
|
||||
<el-button @click="clickDelete(scope.row)" type="text" size="small">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="dialog">
|
||||
<el-dialog :title="dialogTitle" :visible.sync="addAccountDialog" width="30%">
|
||||
<el-form label-position="left" label-width="80px" :model="formLabelAlign">
|
||||
<el-form-item label="名称：">
|
||||
<el-input v-model="formLabelAlign.name"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="账号：">
|
||||
<el-input v-model="formLabelAlign.account"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="角色：">
|
||||
<el-input v-model="formLabelAlign.role"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="权限：">
|
||||
<el-input v-model="formLabelAlign.jurisdiction"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="addAccountDialog = false">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getZhanghData } from '@/api/management';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
addAccountDialog: false,
|
||||
formLabelAlign: {
|
||||
name: '',
|
||||
account: '',
|
||||
role: '',
|
||||
jurisdiction: ''
|
||||
},
|
||||
tableData: [
|
||||
{
|
||||
name: 'admin',
|
||||
account: '',
|
||||
role: 'admin',
|
||||
jurisdiction: '超级管理员'
|
||||
data() {
|
||||
return {
|
||||
addAccountDialog: false,
|
||||
formLabelAlign: {
|
||||
name: '',
|
||||
account: '',
|
||||
role: '',
|
||||
jurisdiction: ''
|
||||
},
|
||||
tableData: [],
|
||||
tableHeight: 0,
|
||||
currentPage: 1,
|
||||
pageSize: 100,
|
||||
totalNumber: 1000,
|
||||
tableHeight: 0,
|
||||
dialogTitle: '新增'
|
||||
};
|
||||
},
|
||||
created() {
|
||||
let windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
|
||||
this.tableHeight = windowHeight - 280;
|
||||
this.getData();
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
getZhanghData().then(res => {
|
||||
console.log(res);
|
||||
this.tableData = res.data.data;
|
||||
});
|
||||
},
|
||||
edit(scope) {
|
||||
console.log(scope, '编辑');
|
||||
this.dialogTitle = '编辑';
|
||||
this.addAccountDialog = true;
|
||||
},
|
||||
showView(scope) {
|
||||
console.log(scope, '查看');
|
||||
this.dialogTitle = '查看';
|
||||
this.addAccountDialog = true;
|
||||
},
|
||||
clickDelete(scope) {
|
||||
console.log(scope, '删除');
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
console.log(`每页 ${val} 条`);
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
console.log(`当前页: ${val}`);
|
||||
}
|
||||
],
|
||||
tableHeight: 0,
|
||||
currentPage: 1,
|
||||
pageSize: 100,
|
||||
totalNumber: 1000,
|
||||
tableHeight: 0,
|
||||
dialogTitle: '新增'
|
||||
}
|
||||
},
|
||||
created() {
|
||||
let windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
|
||||
this.tableHeight = windowHeight - 220;
|
||||
},
|
||||
methods: {
|
||||
edit(scope) {
|
||||
console.log(scope, '编辑');
|
||||
this.dialogTitle = '编辑';
|
||||
this.addAccountDialog = true;
|
||||
},
|
||||
showView(scope) {
|
||||
console.log(scope, '查看');
|
||||
this.dialogTitle = '查看';
|
||||
this.addAccountDialog = true;
|
||||
},
|
||||
clickDelete(scope) {
|
||||
console.log(scope, '删除');
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
console.log(`每页 ${val} 条`);
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
console.log(`当前页: ${val}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.test-div i {
|
||||
font-size: 25px;
|
||||
font-size: 25px;
|
||||
}
|
||||
.dialog .el-form-item{
|
||||
margin-bottom: 20px;
|
||||
.dialog .el-form-item {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -3,11 +3,15 @@
|
|||
<el-empty v-show="componentList.length == 0" :image-size="400"></el-empty>
|
||||
<!-- <p class="title" style="margin-bottom: 20px;font-size: 20px;font-weight: 400;">数据看板</p> -->
|
||||
<el-scrollbar class="scrollbar">
|
||||
<div class="dataBoard" ref='dataBoard' v-if="activeName == 'second'">
|
||||
<div class="dataBoard" ref="dataBoard" v-if="activeName == 'second'">
|
||||
<!-- 断面 -->
|
||||
<div class="plate1" ref="plate1">
|
||||
<div :class="sectionData.length <= 2 ? 'sectionBox' : 'section'" ref="section"
|
||||
v-for="(s, i) in sectionData" :key="s.analogAreaComponentId">
|
||||
<div
|
||||
:class="sectionData.length <= 2 ? 'sectionBox' : 'section'"
|
||||
ref="section"
|
||||
v-for="(s, i) in sectionData"
|
||||
:key="s.analogAreaComponentId"
|
||||
>
|
||||
<template>
|
||||
<div ref="sectionContent">
|
||||
<div>
|
||||
|
|
@ -17,17 +21,27 @@
|
|||
<span class="downPull1" data-num="1" @click="sectionHandle(i)"></span>
|
||||
</div>
|
||||
<div v-for="o in s.children" :key="o.analogAreaComponentId">
|
||||
|
||||
<OD v-if="o.componentName.includes('OD')" :pageType="o.graphicType" triggerType="触发"
|
||||
:componentName="o.componentName" :echartArr="o.presentationForm"
|
||||
:dataArr="o.trigger" :title="o.componentName.split('_')[0]"
|
||||
:chartName='o.combinationName' />
|
||||
<typeChart v-else :pageType="o.graphicType" :triggerType="o.timeMode"
|
||||
<OD
|
||||
v-if="o.componentName.includes('OD')"
|
||||
:pageType="o.graphicType"
|
||||
triggerType="触发"
|
||||
:componentName="o.componentName"
|
||||
:echartArr="o.presentationForm"
|
||||
:dataArr="o.trigger"
|
||||
:title="o.componentName.split('_')[0]"
|
||||
:chartName="o.combinationName"
|
||||
/>
|
||||
<typeChart
|
||||
v-else
|
||||
:pageType="o.graphicType"
|
||||
:triggerType="o.timeMode"
|
||||
:componentName="o.componentName"
|
||||
:dataArr="o.timeMode == '触发' ? o.trigger : o.cycleTimeData"
|
||||
:echartArr="o.presentationForm" :title="o.componentName.split('_')[0]"
|
||||
:chartName='o.combinationName'
|
||||
:typeValue="o.timeMode == '触发' ? typeValue : typeCycleTimeData" />
|
||||
:echartArr="o.presentationForm"
|
||||
:title="o.componentName.split('_')[0]"
|
||||
:chartName="o.combinationName"
|
||||
:typeValue="o.timeMode == '触发' ? typeValue : typeCycleTimeData"
|
||||
/>
|
||||
</div>
|
||||
<!-- :data="triggerList.length != 0 ? triggerList : tableData" -->
|
||||
</div>
|
||||
|
|
@ -37,9 +51,9 @@
|
|||
</div>
|
||||
</el-scrollbar>
|
||||
<!-- 详情框 -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<!-- :data="triggerList.length != 0 ? tripHandle(o) : tableData" -->
|
||||
<!-- :data="triggerList.length != 0 ? tripHandle(o) : tableData" -->
|
||||
<script>
|
||||
import typeChart from '../../components/target/typeChart.vue';
|
||||
import OD from '../../components/target/OD.vue';
|
||||
|
|
@ -80,7 +94,7 @@ export default {
|
|||
default() {
|
||||
return [];
|
||||
}
|
||||
},
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
|
|
@ -302,8 +316,6 @@ export default {
|
|||
}
|
||||
],
|
||||
|
||||
|
||||
|
||||
idVal: '',
|
||||
//组件数组
|
||||
componentList: [],
|
||||
|
|
@ -312,16 +324,12 @@ export default {
|
|||
|
||||
sectionData: [],
|
||||
|
||||
|
||||
|
||||
// 单个区域或者断面的表格触发数据
|
||||
tableList: [],
|
||||
|
||||
|
||||
// 路线数据
|
||||
headWay: [],
|
||||
|
||||
|
||||
tripData: [],
|
||||
|
||||
sectionArr: [],
|
||||
|
|
@ -334,11 +342,11 @@ export default {
|
|||
},
|
||||
created() {
|
||||
this.idVal = this.$route.query.id;
|
||||
getComponentSection({ VideoId: this.idVal }).then((res) => {
|
||||
getComponentSection({ VideoId: this.idVal }).then(res => {
|
||||
if (res.data.code == 200) {
|
||||
console.log(res.data.data, '11111111111111111');
|
||||
this.componentList = res.data.data
|
||||
this.siftData()
|
||||
this.componentList = res.data.data;
|
||||
this.siftData();
|
||||
// 处理获取过来的数据
|
||||
// this.componentList.forEach((val) => {
|
||||
// this.sectionArr.push(val.combinationName);
|
||||
|
|
@ -357,18 +365,16 @@ export default {
|
|||
} else if (res.data.code == 404) {
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
siftData() {
|
||||
this.componentList.forEach((val) => {
|
||||
this.componentList.forEach(val => {
|
||||
this.sectionArr.push(val.combinationName);
|
||||
this.sectionArr = Array.from(new Set(this.sectionArr));
|
||||
});
|
||||
this.sectionData = this.sectionArr.map((item) => {
|
||||
this.sectionData = this.sectionArr.map(item => {
|
||||
item = { title: item, children: [] };
|
||||
this.componentList.forEach((val) => {
|
||||
this.componentList.forEach(val => {
|
||||
if (item.title == val.combinationName) {
|
||||
item.children.push(val);
|
||||
}
|
||||
|
|
@ -390,60 +396,48 @@ export default {
|
|||
if (sectionBox[i] != undefined) {
|
||||
sectionBox[i].style.height = 'auto';
|
||||
}
|
||||
|
||||
} else {
|
||||
downPulls1[i].style.cssText = 'transition: all 0.5s linear;';
|
||||
sections[i].style.height = '500px';
|
||||
if (sectionBox[i] != undefined) {
|
||||
sectionBox[i].style.height = '48vh'
|
||||
sectionBox[i].style.height = '48vh';
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
}
|
||||
|
||||
// 触发数据的类型数值
|
||||
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
mounted() {},
|
||||
watch: {
|
||||
|
||||
// 触发的原始数据
|
||||
triggerData: {
|
||||
handler(newVal, oldVal) {
|
||||
},
|
||||
handler(newVal, oldVal) {},
|
||||
immediate: true
|
||||
},
|
||||
|
||||
// 处理过的触发数据
|
||||
triggerListData: {
|
||||
handler(newVal) {
|
||||
this.triggerList = newVal
|
||||
// 触发数据
|
||||
console.log(newVal, 'triggerlistData');
|
||||
|
||||
this.triggerList = newVal;
|
||||
this.componentList.forEach(ele => {
|
||||
if (ele.trigger == undefined && ele.timeMode == '触发') {
|
||||
ele.trigger = []
|
||||
ele.trigger = [];
|
||||
}
|
||||
newVal.forEach(item => {
|
||||
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '触发') {
|
||||
if (ele.trigger.length == 10) {
|
||||
ele.trigger.pop()
|
||||
|
||||
ele.trigger.pop();
|
||||
} else {
|
||||
// 该时间的触发数据
|
||||
if (item.type_data != null) {
|
||||
// console.log(item,'461461');
|
||||
this.typeValue = item
|
||||
this.typeValue = item;
|
||||
}
|
||||
ele.trigger.unshift(item)
|
||||
ele.trigger.unshift(item);
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
});
|
||||
});
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
|
|
@ -455,38 +449,38 @@ export default {
|
|||
if (newVal.length != 0) {
|
||||
this.componentList.forEach(ele => {
|
||||
if (ele.cycleTimeData == undefined && ele.timeMode == '周期时刻') {
|
||||
ele.cycleTimeData = []
|
||||
ele.cycleTimeData = [];
|
||||
}
|
||||
newVal.forEach(item => {
|
||||
if (ele.analogAreaComponentId == item.component_id && ele.timeMode == '周期时刻' && ele.analogAreaGraphId == item.graphical_id) {
|
||||
if (
|
||||
ele.analogAreaComponentId == item.component_id &&
|
||||
ele.timeMode == '周期时刻' &&
|
||||
ele.analogAreaGraphId == item.graphical_id
|
||||
) {
|
||||
if (ele.cycleTimeData.length == 10) {
|
||||
ele.cycleTimeData.slice(ele.cycleTimeData.length-1,0)
|
||||
ele.cycleTimeData.slice(ele.cycleTimeData.length - 1, 0);
|
||||
} else {
|
||||
if(item.type_data!=null){
|
||||
if (item.type_data != null) {
|
||||
// 周期时刻的类型数据
|
||||
this.typeCycleTimeData = item
|
||||
this.typeCycleTimeData = item;
|
||||
}
|
||||
ele.cycleTimeData.unshift(item)
|
||||
ele.cycleTimeData.unshift(item);
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
});
|
||||
});
|
||||
console.log(this.sectionData, '455');
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
// 周期统计数据
|
||||
cycleStatistics:{
|
||||
handler(newVal){
|
||||
console.log(newVal,'周期统计');
|
||||
cycleStatistics: {
|
||||
handler(newVal) {
|
||||
console.log(newVal, '周期统计');
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -506,7 +500,7 @@ export default {
|
|||
|
||||
/deep/ .el-scrollbar__view {
|
||||
display: inline-block !important;
|
||||
width: 100%
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/deep/ .el-scrollbar__wrap {
|
||||
|
|
@ -520,7 +514,6 @@ export default {
|
|||
.dataBoard {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.dataBoard .region,
|
||||
|
|
|
|||
Loading…
Reference in New Issue