manage-client 3.2.260 → 3.2.262

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,7 @@
1
1
  <template lang="html">
2
- <div id="charts">
3
- <div id="gph" :style="{width:'100%',height:'100%'}"></div>
2
+ <div id="charts" style="display: flex">
3
+ <div id="num" :style="{width:'50%',height:'98%'}"></div>
4
+ <div id="gas" :style="{width:'50%',height:'98%'}"></div>
4
5
  </div>
5
6
  </template>
6
7
 
@@ -16,16 +17,23 @@ let getData = function* (self) {
16
17
  {data: {startDate: self.startdate, endDate: self.enddate, key: 'f_user_nature', f_orgid: self.orgid}},
17
18
  {resolveMsg: null, rejectMsg: null})
18
19
  .then((res) => {
19
- self.texttile = '用户性质'
20
20
  let arrparams = []
21
- let numdata = []
22
21
  let gasdata = []
22
+ let numdata = []
23
23
  for (var i = 0; i < res.data.length; i++) {
24
+ let item = {}
25
+ let item2 = {}
24
26
  arrparams[i] = res.data[i].name
25
- numdata[i] = res.data[i].num_value
26
- gasdata[i] = res.data[i].gas_value
27
+ item.name = res.data[i].name
28
+ item.value = res.data[i].gas_value
29
+ item2.name = res.data[i].name
30
+ item2.value = res.data[i].num_value
31
+ gasdata.push(item)
32
+ numdata.push(item2)
27
33
  }
28
- self.set(arrparams, numdata, gasdata)
34
+ console.log('加载echars组件')
35
+ self.setNum(arrparams, numdata)
36
+ self.setGas(arrparams, gasdata)
29
37
  })
30
38
  }
31
39
  export default {
@@ -42,160 +50,129 @@ export default {
42
50
  type: String
43
51
  }
44
52
  },
45
- title: '站点管理',
46
53
  data () {
47
54
  return {
48
- texttile: '',
49
- xc: ''
55
+ xc: '',
56
+ xd: ''
50
57
  }
51
58
  },
52
59
  methods: {
53
- set (arrparams, numdata, gasdata) {
54
- this.xc = echarts.init(document.getElementById('gph'))
55
- this.xc.setOption({
56
- color: ['#894BE5', '#00C957'],
57
- title: {
58
- text: '销售气量散列图',
59
- subtext: '数据查询来源',
60
- x: 'left'
61
- },
62
- tooltip: {
63
- trigger: 'axis',
64
- formatter: function (params) {
65
- var str = ''
66
- str += params[0].name + '</br>'
67
- for (var i = 0; i < params.length; i++) {
68
- if (params[i].seriesName.includes('笔数')) {
69
- str += params[i].marker + params[i].seriesName + ': ' + params[i].data + '笔' + '</br>'
70
- } else {
71
- str += params[i].marker + params[i].seriesName + ': ' + params[i].data + 'm³' + '</br>'
72
- }
60
+
61
+ setNum (arrparams, gasdata) {
62
+ console.log('进入组件')
63
+ let option1 = {
64
+ color: ['#FE974B', '#3D72FF', '#00C953'],
65
+ title: [
66
+ {
67
+ text: '销售气量饼状图',
68
+ x: '0%',
69
+ y: '0%',
70
+ textStyle: {
71
+ color: '#010606',
72
+ fontSize: 18
73
73
  }
74
- return str
75
- }
74
+ }, {
75
+ text: '笔数分布',
76
+ x: '40%',
77
+ y: '18%',
78
+ textStyle: {
79
+ color: '#010606',
80
+ fontSize: 16
81
+ }
82
+ }],
83
+ tooltip: {
84
+ trigger: 'item',
85
+ formatter: '{a} <br/>{b}: ({c}笔) ({d}%)'
76
86
  },
77
87
  legend: {
78
- x: 'left',
79
- y: 'bottom',
80
- data: ['笔数', '气量']
81
- },
82
- toolbox: {
83
- show: true,
84
- feature: {
85
- dataView: {show: true, readOnly: false},
86
- magicType: {show: true, type: ['line', 'bar']},
87
- restore: {show: true},
88
- saveAsImage: {show: true}
89
- }
88
+ orient: 'horizontal',
89
+ icon: 'circle',
90
+ x: 'center',
91
+ y: '80%',
92
+
93
+ textStyle: {
94
+ padding: [0, 0, 0, 4],
95
+ color: '#010606'
96
+ },
97
+ data: arrparams
90
98
  },
91
- calculable: true,
92
- xAxis: [
93
- {
94
- type: 'category',
95
- data: arrparams
96
- }
97
- ],
98
- yAxis: [
99
- {
100
- type: 'value'
101
- }
102
- ],
103
99
  series: [
104
100
  {
105
101
  name: '笔数',
106
- type: 'bar',
107
- data: numdata,
108
- barMinHeight: 5,
109
- markLine: {
110
- data: [
111
- {type: 'average', name: '平均值'}
112
- ]
102
+ type: 'pie',
103
+ radius: ['0%', '40%'],
104
+ center: ['50%', '50%'],
105
+ hoverAnimation: true,
106
+ minAngle: 5, // 最小角度
107
+ startAngle: 60, // 起始角度
108
+ label: {normal: {show: true}},
109
+ labelLine: {normal: {show: true}},
110
+ data: gasdata,
111
+ percentPrecision: 4
112
+ }
113
+ ]
114
+
115
+ }
116
+ this.xd = echarts.init(document.getElementById('num'))
117
+ this.xd.setOption(option1, true)
118
+ },
119
+ setGas (arrparams, moneydata) {
120
+ console.log('进入组件')
121
+ let option = {
122
+ color: ['#FE974B', '#3D72FF', '#00C953'],
123
+ title: [
124
+ {
125
+ text: '',
126
+ x: '0%',
127
+ y: '0%',
128
+ textStyle: {
129
+ color: '#010606',
130
+ fontSize: 18
131
+ }
132
+ }, {
133
+ text: '气量分布',
134
+ x: '40%',
135
+ y: '18%',
136
+ textStyle: {
137
+ color: '#010606',
138
+ fontSize: 16
113
139
  }
140
+ }],
141
+ tooltip: {
142
+ trigger: 'item',
143
+ formatter: '{a} <br/>{b}: ({c}m³) ({d}%)'
144
+ },
145
+ legend: {
146
+ orient: 'horizontal',
147
+ icon: 'circle',
148
+ x: 'center',
149
+ y: '80%',
150
+
151
+ textStyle: {
152
+ padding: [0, 0, 0, 4],
153
+ color: '#010606'
114
154
  },
155
+ data: arrparams
156
+ },
157
+ series: [
115
158
  {
116
159
  name: '气量',
117
- type: 'bar',
118
- data: gasdata,
119
- markLine: {
120
- data: [
121
- {type: 'average', name: '平均值'}
122
- ]
123
- }
160
+ type: 'pie',
161
+ radius: ['0%', '40%'],
162
+ center: ['50%', '50%'],
163
+ hoverAnimation: true,
164
+ minAngle: 5, // 最小角度
165
+ startAngle: 60, // 起始角度
166
+ label: {normal: {show: true}},
167
+ labelLine: {normal: {show: true}},
168
+ data: moneydata,
169
+ percentPrecision: 4
124
170
  }
125
- // {
126
- // name: '商业数量',
127
- // type: 'bar',
128
- // data: numdata2,
129
- // itemStyle: {
130
- // normal: {
131
- // color: function (params) {
132
- // // 给出颜色组
133
- // var colorList = ['#894BE5']
134
- // return colorList[params.dataIndex]
135
- // }
136
- // }
137
- // }
138
- // },
139
- // {
140
- // name: '商业气量',
141
- // type: 'bar',
142
- // data: gasdata2,
143
- // barMinHeight: 5,
144
- // itemStyle: {
145
- // normal: {
146
- // color: function (params) {
147
- // // 给出颜色组
148
- // var colorList = ['#FE974B']
149
- // return colorList[params.dataIndex]
150
- // }
151
- // }
152
- // },
153
- // markLine: {
154
- // data: [
155
- // {type: 'average', name: '平均值'}
156
- // ]
157
- // }
158
- // },
159
- // {
160
- // name: '工业数量',
161
- // type: 'bar',
162
- // data: numdata3,
163
- // itemStyle: {
164
- // normal: {
165
- // color: function (params) {
166
- // // 给出颜色组
167
- // var colorList = ['#894BE5']
168
- // return colorList[params.dataIndex]
169
- // }
170
- // }
171
- // },
172
- // markLine: {
173
- // data: [
174
- // {type: 'average', name: '平均值'}
175
- // ]
176
- // }
177
- // },
178
- // {
179
- // name: '工业气量',
180
- // type: 'bar',
181
- // data: gasdata3,
182
- // itemStyle: {
183
- // normal: {
184
- // color: function (params) {
185
- // // 给出颜色组
186
- // var colorList = ['#FE974B']
187
- // return colorList[params.dataIndex]
188
- // }
189
- // }
190
- // },
191
- // markLine: {
192
- // data: [
193
- // {type: 'average', name: '平均值'}
194
- // ]
195
- // }
196
- // }
197
171
  ]
198
- })
172
+
173
+ }
174
+ this.xc = echarts.init(document.getElementById('gas'))
175
+ this.xc.setOption(option, true)
199
176
  },
200
177
  searchdata () {
201
178
  let getGen = getData(this)