73 lines
2.3 KiB
Vue
73 lines
2.3 KiB
Vue
<template>
|
|
<div class="setion">
|
|
<p class="chartTitle"><span class="titleIcon"></span> {{ title }}</p>
|
|
<div class="typeContent">
|
|
<el-card style="width: 150px; margin-bottom: 20px; text-align: center">
|
|
<div style="font-size: 30px; font-weight: bold">99</div>
|
|
<div style="padding: 14px">
|
|
<span>数值</span>
|
|
<div class="bottom clearfix">
|
|
<time class="time">17:49</time>
|
|
<el-button type="text" class="button">操作按钮</el-button>
|
|
</div>
|
|
</div>
|
|
</el-card>
|
|
<div v-if="pageType == '断面'" style="margin-bottom: 20px; border: 1px solid #e4e7ed">
|
|
<tableShow :msg="data" :type="triggerType" />
|
|
</div>
|
|
<div v-if="pageType == '区域'">
|
|
<regionTable :msg="data" :type="triggerType" />
|
|
</div>
|
|
<div class="border">
|
|
<detailDialog />
|
|
<lineChart :pageType="pageType" :list="data" :status="triggerType" :title="title"></lineChart>
|
|
|
|
<div class="border">
|
|
<detailDialog />
|
|
<avgChart :pageType="pageType" :list="data" :status="triggerType" :title="title" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import lineChart from '../chart/lineChart.vue';
|
|
import barChart from '../chart/barChart.vue';
|
|
import tableShow from '../chart/tableShow.vue';
|
|
import detailDialog from '../chart/detailDialog.vue';
|
|
import thermalChart from '../chart/thermalChart.vue';
|
|
import regionTable from '../chart/regionTable.vue';
|
|
import avgChart from '../chart/avgChart.vue';
|
|
export default {
|
|
name: 'lineUpChart', //排队数组件
|
|
components: {
|
|
lineChart,
|
|
barChart,
|
|
tableShow,
|
|
detailDialog,
|
|
thermalChart,
|
|
regionTable,
|
|
avgChart
|
|
},
|
|
props: ['pageType', 'triggerType', 'data'],
|
|
data() {
|
|
return {
|
|
title: '排队数组件'
|
|
};
|
|
},
|
|
methods: {},
|
|
mounted() {}
|
|
};
|
|
</script>
|
|
<style scoped>
|
|
.typeContent {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.border {
|
|
width: 100%;
|
|
margin-bottom: 20px;
|
|
position: relative;
|
|
}
|
|
</style> |