BJ_web_developers / dyitoc

Commit 4831b33deba0e637006f75e911c014226ade3409

Authored by liuqimichale
1 parent 8a59623c

进出场

Inline Side-by-side
Showing 3 changed files with 27 additions and 28 deletions
src/components/lineChart.vue
  View file @4831b33
... ... @@ -4,7 +4,6 @@
4 4  
5 5 <script>
6 6 import echarts from 'echarts'
7   -
8 7 import {debounce} from '../utils/debounce'
9 8  
10 9 export default {
... ... @@ -33,8 +32,7 @@ export default {
33 32 },
34 33 data() {
35 34 return {
36   - chart: null,
37   - sidebarElm: null
  35 + chart: null
38 36 }
39 37 },
40 38 watch: {
... ... @@ -43,6 +41,7 @@ export default {
43 41 }
44 42 },
45 43 mounted() {
  44 + console.log(this.chartData)
46 45 this.initChart()
47 46 if (this.autoResize) {
48 47 this.__resizeHandler = debounce(() => {
... ... @@ -65,14 +64,14 @@ export default {
65 64 this.chart = null
66 65 },
67 66 methods: {
68   - setOptions({xData, yData} = {}) {
  67 + setOptions({xData, yData, legendData} = {}) {
69 68 this.chart.setOption({
70 69 tooltip: {
71 70 trigger: 'axis'
72 71 },
73 72 color:['#FFB130','#01AEFE'],
74 73 legend: {
75   - data:['出场','入场'],
  74 + data:legendData,
76 75 bottom:'2%',
77 76 textStyle: {
78 77 color: '#59AAF7'
... ... @@ -103,7 +102,7 @@ export default {
103 102 splitLine: {
104 103 show: false
105 104 },
106   - data: ['周一','周二','周三','周四','周五','周六','周日']
  105 + data: xData
107 106 },
108 107 yAxis: {
109 108 type: 'value',
... ... @@ -128,17 +127,17 @@ export default {
128 127 },
129 128 series: [
130 129 {
131   - name:'出场',
  130 + name:legendData[0],
132 131 type:'line',
133   - data:[120, 132, 101, 134, 90, 230, 210],
  132 + data:yData.indata,
134 133 lineStyle: {
135 134 color: '#FFB130'
136 135 }
137 136 },
138 137 {
139   - name:'入场',
  138 + name:legendData[1],
140 139 type:'line',
141   - data:[220, 182, 191, 234, 290, 330, 310],
  140 + data:yData.outdata,
142 141 lineStyle: {
143 142 color: '#08B9FC'
144 143 }
... ...
src/views/outsection.vue
  View file @4831b33
1 1 <template>
2 2 <div>
3 3 <titlesection title="周出场统计"></titlesection>
4   - <lineChart class="flexfm inout-wrap">
  4 + <lineChart :chart-data="lineChartData" class="flexfm inout-wrap" >
5 5 </lineChart>
6 6 </div>
7 7 </template>
... ... @@ -11,14 +11,6 @@ import titlesection from &#39;../components/titlesection&#39;
11 11 import {fetchList} from '../api/api'
12 12 import lineChart from '../components/lineChart'
13 13  
14   -const lineChartData = {
15   - newVisitis: {
16   - yData: [100, 120, 161],
17   - xData: ['正常', '异常', '故障']
18   - }
19   -}
20   -
21   -
22 14 export default {
23 15 name: 'outsection',
24 16 components: {
... ... @@ -27,7 +19,14 @@ export default {
27 19 },
28 20 data() {
29 21 return {
30   - lineChartData: lineChartData.newVisitis,
  22 + lineChartData: {
  23 + xData: ['周一','周二','周三','周四','周五','周六','周日'],
  24 + yData: {
  25 + indata:[120, 132, 101, 134, 90, 230, 210],
  26 + outdata:[220, 182, 191, 234, 290, 330, 310],
  27 + },
  28 + legendData: ['出场','进场']
  29 + },
31 30 dzNum: '23454',
32 31 ydpNum: '4454'
33 32 }
... ...
src/views/vehiclesection.vue
  View file @4831b33
1 1 <template>
2 2 <div>
3 3 <titlesection title="今日车流量"></titlesection>
4   - <lineChart class="flexfm inout-wrap">
  4 + <lineChart :chart-data="lineChartData" class="flexfm inout-wrap" >
5 5 </lineChart>
6 6 </div>
7 7 </template>
... ... @@ -11,12 +11,6 @@ import titlesection from &#39;../components/titlesection&#39;
11 11 import {fetchList} from '../api/api'
12 12 import lineChart from '../components/lineChart'
13 13  
14   -const lineChartData = {
15   - newVisitis: {
16   - yData: [100, 120, 161],
17   - xData: ['正常', '异常', '故障']
18   - }
19   -}
20 14  
21 15  
22 16 export default {
... ... @@ -27,7 +21,14 @@ export default {
27 21 },
28 22 data() {
29 23 return {
30   - lineChartData: lineChartData.newVisitis,
  24 + lineChartData: {
  25 + xData: ['周一','周二','周三','周四','周五','周六','周日'],
  26 + yData: {
  27 + indata:[120, 132, 101, 134, 90, 230, 210],
  28 + outdata:[220, 182, 191, 234, 290, 330, 310],
  29 + },
  30 + legendData: ['出场1','进场']
  31 + },
31 32 dzNum: '23454',
32 33 ydpNum: '4454'
33 34 }
... ...