Showing
17 changed files
with
1951 additions
and
69 deletions
1 | - | ||
2 | package com.anjiplus.template.gaea.business.modules.dataset.service.impl; | 1 | package com.anjiplus.template.gaea.business.modules.dataset.service.impl; |
3 | 2 | ||
4 | import cn.hutool.json.JSONUtil; | 3 | import cn.hutool.json.JSONUtil; |
@@ -42,8 +41,8 @@ import java.util.Map; | @@ -42,8 +41,8 @@ import java.util.Map; | ||
42 | import java.util.stream.Collectors; | 41 | import java.util.stream.Collectors; |
43 | 42 | ||
44 | /** | 43 | /** |
45 | - * @desc DataSet 数据集服务实现 | ||
46 | * @author Raod | 44 | * @author Raod |
45 | + * @desc DataSet 数据集服务实现 | ||
47 | * @date 2021-03-18 12:11:31.150755900 | 46 | * @date 2021-03-18 12:11:31.150755900 |
48 | **/ | 47 | **/ |
49 | @Service | 48 | @Service |
@@ -99,11 +98,7 @@ public class DataSetServiceImpl implements DataSetService { | @@ -99,11 +98,7 @@ public class DataSetServiceImpl implements DataSetService { | ||
99 | 98 | ||
100 | public DataSetDto getDetailSet(DataSetDto dto, String setCode) { | 99 | public DataSetDto getDetailSet(DataSetDto dto, String setCode) { |
101 | //查询参数 | 100 | //查询参数 |
102 | - List<DataSetParam> dataSetParamList = dataSetParamService.list( | ||
103 | - new QueryWrapper<DataSetParam>() | ||
104 | - .lambda() | ||
105 | - .eq(DataSetParam::getSetCode, setCode) | ||
106 | - ); | 101 | + List<DataSetParam> dataSetParamList = dataSetParamService.list(new QueryWrapper<DataSetParam>().lambda().eq(DataSetParam::getSetCode, setCode)); |
107 | List<DataSetParamDto> dataSetParamDtoList = new ArrayList<>(); | 102 | List<DataSetParamDto> dataSetParamDtoList = new ArrayList<>(); |
108 | dataSetParamList.forEach(dataSetParam -> { | 103 | dataSetParamList.forEach(dataSetParam -> { |
109 | DataSetParamDto dataSetParamDto = new DataSetParamDto(); | 104 | DataSetParamDto dataSetParamDto = new DataSetParamDto(); |
@@ -114,12 +109,7 @@ public class DataSetServiceImpl implements DataSetService { | @@ -114,12 +109,7 @@ public class DataSetServiceImpl implements DataSetService { | ||
114 | 109 | ||
115 | //数据转换 | 110 | //数据转换 |
116 | 111 | ||
117 | - List<DataSetTransform> dataSetTransformList = dataSetTransformService.list( | ||
118 | - new QueryWrapper<DataSetTransform>() | ||
119 | - .lambda() | ||
120 | - .eq(DataSetTransform::getSetCode, setCode) | ||
121 | - .orderByAsc(DataSetTransform::getOrderNum) | ||
122 | - ); | 112 | + List<DataSetTransform> dataSetTransformList = dataSetTransformService.list(new QueryWrapper<DataSetTransform>().lambda().eq(DataSetTransform::getSetCode, setCode).orderByAsc(DataSetTransform::getOrderNum)); |
123 | List<DataSetTransformDto> dataSetTransformDtoList = new ArrayList<>(); | 113 | List<DataSetTransformDto> dataSetTransformDtoList = new ArrayList<>(); |
124 | dataSetTransformList.forEach(dataSetTransform -> { | 114 | dataSetTransformList.forEach(dataSetTransform -> { |
125 | DataSetTransformDto dataSetTransformDto = new DataSetTransformDto(); | 115 | DataSetTransformDto dataSetTransformDto = new DataSetTransformDto(); |
@@ -134,22 +124,22 @@ public class DataSetServiceImpl implements DataSetService { | @@ -134,22 +124,22 @@ public class DataSetServiceImpl implements DataSetService { | ||
134 | boolean isObj = JSONUtil.isJsonObj(caseResult); | 124 | boolean isObj = JSONUtil.isJsonObj(caseResult); |
135 | JSONArray jsonArray = null; | 125 | JSONArray jsonArray = null; |
136 | JSONObject jsonObject = null; | 126 | JSONObject jsonObject = null; |
137 | - if(isObj){ | 127 | + if (isObj) { |
138 | JSONObject result = JSONObject.parseObject(caseResult); | 128 | JSONObject result = JSONObject.parseObject(caseResult); |
139 | Object data = result.get("data"); | 129 | Object data = result.get("data"); |
140 | if (data instanceof JSONObject) { | 130 | if (data instanceof JSONObject) { |
141 | - jsonObject = (JSONObject)data; | 131 | + jsonObject = (JSONObject) data; |
142 | } else { | 132 | } else { |
143 | jsonArray = jsonObject.getJSONArray("data"); | 133 | jsonArray = jsonObject.getJSONArray("data"); |
144 | jsonObject = jsonArray.getJSONObject(0); | 134 | jsonObject = jsonArray.getJSONObject(0); |
145 | } | 135 | } |
146 | } else { | 136 | } else { |
147 | - jsonArray = JSONArray.parseArray(caseResult); | ||
148 | - jsonObject = jsonArray.getJSONObject(0); | 137 | + jsonArray = JSONArray.parseArray(caseResult); |
138 | + jsonObject = jsonArray.getJSONObject(0); | ||
149 | } | 139 | } |
150 | dto.setSetParamList(jsonObject.keySet()); | 140 | dto.setSetParamList(jsonObject.keySet()); |
151 | } catch (Exception e) { | 141 | } catch (Exception e) { |
152 | - log.error("error",e); | 142 | + log.error("error", e); |
153 | } | 143 | } |
154 | } | 144 | } |
155 | return dto; | 145 | return dto; |
@@ -215,18 +205,10 @@ public class DataSetServiceImpl implements DataSetService { | @@ -215,18 +205,10 @@ public class DataSetServiceImpl implements DataSetService { | ||
215 | deleteById(id); | 205 | deleteById(id); |
216 | 206 | ||
217 | //2.删除查询参数 | 207 | //2.删除查询参数 |
218 | - dataSetParamService.delete( | ||
219 | - new QueryWrapper<DataSetParam>() | ||
220 | - .lambda() | ||
221 | - .eq(DataSetParam::getSetCode, setCode) | ||
222 | - ); | 208 | + dataSetParamService.delete(new QueryWrapper<DataSetParam>().lambda().eq(DataSetParam::getSetCode, setCode)); |
223 | 209 | ||
224 | //3.删除数据转换 | 210 | //3.删除数据转换 |
225 | - dataSetTransformService.delete( | ||
226 | - new QueryWrapper<DataSetTransform>() | ||
227 | - .lambda() | ||
228 | - .eq(DataSetTransform::getSetCode, setCode) | ||
229 | - ); | 211 | + dataSetTransformService.delete(new QueryWrapper<DataSetTransform>().lambda().eq(DataSetTransform::getSetCode, setCode)); |
230 | } | 212 | } |
231 | 213 | ||
232 | /** | 214 | /** |
@@ -242,51 +224,61 @@ public class DataSetServiceImpl implements DataSetService { | @@ -242,51 +224,61 @@ public class DataSetServiceImpl implements DataSetService { | ||
242 | String setCode = dto.getSetCode(); | 224 | String setCode = dto.getSetCode(); |
243 | //1.获取数据集、参数替换、数据转换 | 225 | //1.获取数据集、参数替换、数据转换 |
244 | DataSetDto dataSetDto = detailSet(setCode); | 226 | DataSetDto dataSetDto = detailSet(setCode); |
245 | - log.info("数据集详情:{}",dataSetDto); | 227 | + log.info("数据集详情:{}", dataSetDto); |
246 | String dynSentence = dataSetDto.getDynSentence(); | 228 | String dynSentence = dataSetDto.getDynSentence(); |
247 | //2.获取数据源 | 229 | //2.获取数据源 |
248 | DataSource dataSource; | 230 | DataSource dataSource; |
249 | - if (StringUtils.isNotBlank(dataSetDto.getSetType()) | ||
250 | - && dataSetDto.getSetType().equals(SetTypeEnum.HTTP.getCodeValue())) { | 231 | + |
232 | + if (StringUtils.isNotBlank(dataSetDto.getSetType()) && dataSetDto.getSetType().equals(SetTypeEnum.HTTP.getCodeValue())) { | ||
251 | //http不需要数据源,兼容已有的逻辑,将http所需要的数据塞进DataSource | 233 | //http不需要数据源,兼容已有的逻辑,将http所需要的数据塞进DataSource |
252 | dataSource = new DataSource(); | 234 | dataSource = new DataSource(); |
253 | dataSource.setSourceConfig(dynSentence); | 235 | dataSource.setSourceConfig(dynSentence); |
254 | dataSource.setSourceType(JdbcConstants.HTTP); | 236 | dataSource.setSourceType(JdbcConstants.HTTP); |
255 | - String body = JSONObject.parseObject(dynSentence).getString("body"); | 237 | + JSONObject jsonObject = JSONObject.parseObject(dynSentence); |
238 | + String body = jsonObject.getString("body"); | ||
256 | if (StringUtils.isNotBlank(body)) { | 239 | if (StringUtils.isNotBlank(body)) { |
257 | - dynSentence = body; | ||
258 | - }else { | 240 | + // 替换动态参数,body中的内容与传入的参数比较,有相同的key则替换 |
241 | + Map<String, Object> contextData = dto.getContextData(); | ||
242 | + if (contextData != null && !contextData.isEmpty()) { | ||
243 | + JSONObject bodyObj = jsonObject.getJSONObject("body"); | ||
244 | + bodyObj.forEach((k, v) -> { | ||
245 | + Object o = contextData.get(k); | ||
246 | + if (o != null) { | ||
247 | + bodyObj.put(k, o); | ||
248 | + } | ||
249 | + }); | ||
250 | + dynSentence = bodyObj.toJSONString(); | ||
251 | + } else{ | ||
252 | + dynSentence = body; | ||
253 | + } | ||
254 | + } else { | ||
259 | dynSentence = "{}"; | 255 | dynSentence = "{}"; |
260 | } | 256 | } |
261 | - | ||
262 | - }else { | ||
263 | - dataSource = dataSourceService.selectOne("source_code", dataSetDto.getSourceCode()); | 257 | + } else { |
258 | + dataSource = dataSourceService.selectOne("source_code", dataSetDto.getSourceCode()); | ||
264 | } | 259 | } |
265 | 260 | ||
266 | - log.info("数据源详情:{}",dataSource); | 261 | + log.info("数据源详情:{}", dataSource); |
267 | 262 | ||
268 | //3.参数替换 | 263 | //3.参数替换 |
269 | //3.1参数校验 | 264 | //3.1参数校验 |
270 | - log.info("参数校验替换前:{}", dto.getContextData()); | 265 | +// log.info("参数校验替换前:{}", dto.getContextData()); |
271 | boolean verification = dataSetParamService.verification(dataSetDto.getDataSetParamDtoList(), dto.getContextData()); | 266 | boolean verification = dataSetParamService.verification(dataSetDto.getDataSetParamDtoList(), dto.getContextData()); |
272 | if (!verification) { | 267 | if (!verification) { |
273 | throw BusinessExceptionBuilder.build(ResponseCode.RULE_FIELDS_CHECK_ERROR); | 268 | throw BusinessExceptionBuilder.build(ResponseCode.RULE_FIELDS_CHECK_ERROR); |
274 | } | 269 | } |
275 | dynSentence = dataSetParamService.transform(dto.getContextData(), dynSentence); | 270 | dynSentence = dataSetParamService.transform(dto.getContextData(), dynSentence); |
276 | - log.info("参数校验替换后:{}", dynSentence); | 271 | +// log.info("参数校验替换后:{}", dynSentence); |
277 | //4.获取数据 | 272 | //4.获取数据 |
278 | DataSourceDto dataSourceDto = new DataSourceDto(); | 273 | DataSourceDto dataSourceDto = new DataSourceDto(); |
279 | BeanUtils.copyProperties(dataSource, dataSourceDto); | 274 | BeanUtils.copyProperties(dataSource, dataSourceDto); |
280 | dataSourceDto.setDynSentence(dynSentence); | 275 | dataSourceDto.setDynSentence(dynSentence); |
281 | dataSourceDto.setContextData(dto.getContextData()); | 276 | dataSourceDto.setContextData(dto.getContextData()); |
282 | //获取total,判断contextData中是否传入分页参数 | 277 | //获取total,判断contextData中是否传入分页参数 |
283 | - if (null != dto.getContextData() | ||
284 | - && dto.getContextData().containsKey("pageNumber") | ||
285 | - && dto.getContextData().containsKey("pageSize")) { | 278 | + if (null != dto.getContextData() && dto.getContextData().containsKey("pageNumber") && dto.getContextData().containsKey("pageSize")) { |
286 | long total = dataSourceService.total(dataSourceDto, dto); | 279 | long total = dataSourceService.total(dataSourceDto, dto); |
287 | originalDataDto.setTotal(total); | 280 | originalDataDto.setTotal(total); |
288 | } | 281 | } |
289 | - log.info("获取的数据:{}", dataSourceDto); | ||
290 | List<JSONObject> data = dataSourceService.execute(dataSourceDto); | 282 | List<JSONObject> data = dataSourceService.execute(dataSourceDto); |
291 | //5.数据转换 | 283 | //5.数据转换 |
292 | List<JSONObject> transform = dataSetTransformService.transform(dataSetDto.getDataSetTransformDtoList(), data); | 284 | List<JSONObject> transform = dataSetTransformService.transform(dataSetDto.getDataSetTransformDtoList(), data); |
@@ -314,12 +306,12 @@ public class DataSetServiceImpl implements DataSetService { | @@ -314,12 +306,12 @@ public class DataSetServiceImpl implements DataSetService { | ||
314 | String body = JSONObject.parseObject(dynSentence).getString("body"); | 306 | String body = JSONObject.parseObject(dynSentence).getString("body"); |
315 | if (StringUtils.isNotBlank(body)) { | 307 | if (StringUtils.isNotBlank(body)) { |
316 | dynSentence = body; | 308 | dynSentence = body; |
317 | - }else { | 309 | + } else { |
318 | dynSentence = "{}"; | 310 | dynSentence = "{}"; |
319 | } | 311 | } |
320 | 312 | ||
321 | - }else { | ||
322 | - dataSource = dataSourceService.selectOne("source_code", sourceCode); | 313 | + } else { |
314 | + dataSource = dataSourceService.selectOne("source_code", sourceCode); | ||
323 | } | 315 | } |
324 | 316 | ||
325 | //3.参数替换 | 317 | //3.参数替换 |
@@ -360,18 +352,13 @@ public class DataSetServiceImpl implements DataSetService { | @@ -360,18 +352,13 @@ public class DataSetServiceImpl implements DataSetService { | ||
360 | @Override | 352 | @Override |
361 | public List<DataSet> queryAllDataSet() { | 353 | public List<DataSet> queryAllDataSet() { |
362 | LambdaQueryWrapper<DataSet> wrapper = Wrappers.lambdaQuery(); | 354 | LambdaQueryWrapper<DataSet> wrapper = Wrappers.lambdaQuery(); |
363 | - wrapper.select(DataSet::getSetCode, DataSet::getSetName, DataSet::getSetDesc, DataSet::getId) | ||
364 | - .eq(DataSet::getEnableFlag, Enabled.YES.getValue()); | 355 | + wrapper.select(DataSet::getSetCode, DataSet::getSetName, DataSet::getSetDesc, DataSet::getId).eq(DataSet::getEnableFlag, Enabled.YES.getValue()); |
365 | wrapper.orderByDesc(DataSet::getUpdateTime); | 356 | wrapper.orderByDesc(DataSet::getUpdateTime); |
366 | return dataSetMapper.selectList(wrapper); | 357 | return dataSetMapper.selectList(wrapper); |
367 | } | 358 | } |
368 | 359 | ||
369 | - public void dataSetParamBatch(List<DataSetParamDto> dataSetParamDtoList,String setCode){ | ||
370 | - dataSetParamService.delete( | ||
371 | - new QueryWrapper<DataSetParam>() | ||
372 | - .lambda() | ||
373 | - .eq(DataSetParam::getSetCode, setCode) | ||
374 | - ); | 360 | + public void dataSetParamBatch(List<DataSetParamDto> dataSetParamDtoList, String setCode) { |
361 | + dataSetParamService.delete(new QueryWrapper<DataSetParam>().lambda().eq(DataSetParam::getSetCode, setCode)); | ||
375 | if (null == dataSetParamDtoList || dataSetParamDtoList.size() <= 0) { | 362 | if (null == dataSetParamDtoList || dataSetParamDtoList.size() <= 0) { |
376 | return; | 363 | return; |
377 | } | 364 | } |
@@ -388,12 +375,8 @@ public class DataSetServiceImpl implements DataSetService { | @@ -388,12 +375,8 @@ public class DataSetServiceImpl implements DataSetService { | ||
388 | 375 | ||
389 | } | 376 | } |
390 | 377 | ||
391 | - public void dataSetTransformBatch(List<DataSetTransformDto> dataSetTransformDtoList,String setCode){ | ||
392 | - dataSetTransformService.delete( | ||
393 | - new QueryWrapper<DataSetTransform>() | ||
394 | - .lambda() | ||
395 | - .eq(DataSetTransform::getSetCode, setCode) | ||
396 | - ); | 378 | + public void dataSetTransformBatch(List<DataSetTransformDto> dataSetTransformDtoList, String setCode) { |
379 | + dataSetTransformService.delete(new QueryWrapper<DataSetTransform>().lambda().eq(DataSetTransform::getSetCode, setCode)); | ||
397 | if (null == dataSetTransformDtoList || dataSetTransformDtoList.size() <= 0) { | 380 | if (null == dataSetTransformDtoList || dataSetTransformDtoList.size() <= 0) { |
398 | return; | 381 | return; |
399 | } | 382 | } |
@@ -412,10 +395,11 @@ public class DataSetServiceImpl implements DataSetService { | @@ -412,10 +395,11 @@ public class DataSetServiceImpl implements DataSetService { | ||
412 | 395 | ||
413 | /** | 396 | /** |
414 | * dataSetParamDtoList转map | 397 | * dataSetParamDtoList转map |
398 | + * | ||
415 | * @param dataSetParamDtoList | 399 | * @param dataSetParamDtoList |
416 | * @return | 400 | * @return |
417 | */ | 401 | */ |
418 | - public Map<String, Object> setContextData(List<DataSetParamDto> dataSetParamDtoList){ | 402 | + public Map<String, Object> setContextData(List<DataSetParamDto> dataSetParamDtoList) { |
419 | Map<String, Object> map = new HashMap<>(); | 403 | Map<String, Object> map = new HashMap<>(); |
420 | if (null != dataSetParamDtoList && dataSetParamDtoList.size() > 0) { | 404 | if (null != dataSetParamDtoList && dataSetParamDtoList.size() > 0) { |
421 | dataSetParamDtoList.forEach(dataSetParamDto -> map.put(dataSetParamDto.getParamName(), dataSetParamDto.getSampleItem())); | 405 | dataSetParamDtoList.forEach(dataSetParamDto -> map.put(dataSetParamDto.getParamName(), dataSetParamDto.getSampleItem())); |
@@ -323,6 +323,7 @@ public class DataSourceServiceImpl implements DataSourceService { | @@ -323,6 +323,7 @@ public class DataSourceServiceImpl implements DataSourceService { | ||
323 | ResponseEntity<Object> exchange; | 323 | ResponseEntity<Object> exchange; |
324 | List<JSONObject> result = new ArrayList<>(); | 324 | List<JSONObject> result = new ArrayList<>(); |
325 | try { | 325 | try { |
326 | + log.info("== 发送请求:\n\t\t apiUrl:{}\n\t\t httpMethod:{}\n\t\t entity:{}\n\t\t ",apiUrl, httpMethod, dto.getDynSentence()); | ||
326 | exchange = restTemplate.exchange(apiUrl, httpMethod, entity, Object.class); | 327 | exchange = restTemplate.exchange(apiUrl, httpMethod, entity, Object.class); |
327 | } catch (HttpClientErrorException error) { | 328 | } catch (HttpClientErrorException error) { |
328 | int rawStatusCode = error.getRawStatusCode(); | 329 | int rawStatusCode = error.getRawStatusCode(); |
@@ -4,8 +4,11 @@ const prodEnv = require('./prod.env') | @@ -4,8 +4,11 @@ const prodEnv = require('./prod.env') | ||
4 | 4 | ||
5 | module.exports = merge(prodEnv, { | 5 | module.exports = merge(prodEnv, { |
6 | NODE_ENV: '"development"', | 6 | NODE_ENV: '"development"', |
7 | - BASE_API: '"http://192.168.0.59:9095"', | ||
8 | - MONITOR_GATEWAY: '"http://192.168.0.59:8080"' | 7 | + BASE_API: '"https://69.12.93.116:8089"', |
8 | + MONITOR_GATEWAY: '"https://69.12.93.116:8080"' | ||
9 | + // BASE_API: '"http://127.0.0.1:8089"', | ||
10 | + // MONITOR_GATEWAY: '"http://127.0.0.1:8080"' | ||
11 | + | ||
9 | /*BASE_API: '"http://192.168.0.75:9095"', | 12 | /*BASE_API: '"http://192.168.0.75:9095"', |
10 | MONITOR_GATEWAY: '"http://192.168.0.75:8080"'*/ | 13 | MONITOR_GATEWAY: '"http://192.168.0.75:8080"'*/ |
11 | /* BASE_API: '"https://192.168.0.248:8089"', | 14 | /* BASE_API: '"https://192.168.0.248:8089"', |
@@ -23,6 +23,11 @@ import 'echarts/lib/component/tooltip' | @@ -23,6 +23,11 @@ import 'echarts/lib/component/tooltip' | ||
23 | // import 'echarts-gl' | 23 | // import 'echarts-gl' |
24 | Vue.component('v-chart', ECharts) | 24 | Vue.component('v-chart', ECharts) |
25 | 25 | ||
26 | + | ||
27 | +import echartsbd from 'echarts'; | ||
28 | +Vue.prototype.$echarts=echartsbd; | ||
29 | +Vue.use(echartsbd) | ||
30 | + | ||
26 | // anji component | 31 | // anji component |
27 | import anjiCrud from '@/components/AnjiPlus/anji-crud/anji-crud' | 32 | import anjiCrud from '@/components/AnjiPlus/anji-crud/anji-crud' |
28 | import anjiSelect from '@/components/AnjiPlus/anji-select' | 33 | import anjiSelect from '@/components/AnjiPlus/anji-select' |
report-ui/src/mixins/commonWeight.js
0 → 100644
1 | +export default { | ||
2 | + data() { | ||
3 | + return { | ||
4 | + options: {}, | ||
5 | + optionsSetUp: {}, | ||
6 | + optionsPosition: {}, | ||
7 | + optionsData: {}, | ||
8 | + id: (new Date()).getTime(), | ||
9 | + } | ||
10 | + }, | ||
11 | + props: { | ||
12 | + value: Object, | ||
13 | + ispreview: Boolean | ||
14 | + }, | ||
15 | + watch: { | ||
16 | + value: { | ||
17 | + handler(val) { | ||
18 | + this.options = val; | ||
19 | + this.optionsSetUp = val.setup; | ||
20 | + this.optionsPosition = val.position; | ||
21 | + this.reloadChart(); | ||
22 | + }, | ||
23 | + deep: true | ||
24 | + } | ||
25 | + }, | ||
26 | + mounted() { | ||
27 | + this.options = this.value; | ||
28 | + this.optionsSetUp = this.value.setup; | ||
29 | + this.optionsPosition = this.value.position; | ||
30 | + }, | ||
31 | + methods: { | ||
32 | + /** | ||
33 | + * 获取x天后的日期 | ||
34 | + * @param day | ||
35 | + * @returns {string} yyyy-MM-mm | ||
36 | + */ | ||
37 | + getData(day) { | ||
38 | + var doHandMonth = (month) => { | ||
39 | + var m = month | ||
40 | + if (month.toString().length == 1) { | ||
41 | + m = "0" + month | ||
42 | + } | ||
43 | + return m | ||
44 | + } | ||
45 | + var today = new Date() | ||
46 | + var targetday = today.getTime() + 1000 * 60 * 60 * 24 * day | ||
47 | + today.setTime(targetday) | ||
48 | + var tYear = today.getFullYear() | ||
49 | + var tMonth = today.getMonth() | ||
50 | + var tDate = today.getDate() | ||
51 | + tMonth = doHandMonth(tMonth + 1) | ||
52 | + tDate = doHandMonth(tDate) | ||
53 | + return tYear + "-" + tMonth + "-" + tDate | ||
54 | + }, | ||
55 | + /** | ||
56 | + * 获取URL所有的参数 | ||
57 | + */ | ||
58 | + getUrlParam() { | ||
59 | + let url = window.location.href; | ||
60 | + let arrObj = url.split("?"); | ||
61 | + let params = Object.create(null) | ||
62 | + if (arrObj.length > 1) { | ||
63 | + arrObj = arrObj[1].split("&"); | ||
64 | + arrObj.forEach(item => { | ||
65 | + item = item.split("="); | ||
66 | + params[item[0]] = item[1] | ||
67 | + }) | ||
68 | + } | ||
69 | + return params; | ||
70 | + }, | ||
71 | + /** | ||
72 | + * 请求接口数据 | ||
73 | + * @returns {Promise<unknown>} | ||
74 | + */ | ||
75 | + handlerData(params) { | ||
76 | + let that = this; | ||
77 | + const optionsData = this.value.data; | ||
78 | + if (optionsData.dynamicData) { | ||
79 | + let contextData = optionsData.dynamicData.contextData; | ||
80 | + // 合并url参数 | ||
81 | + let paramsObj = that.getUrlParam(); | ||
82 | + if (paramsObj) { | ||
83 | + for (let key of Object.keys(paramsObj)) { | ||
84 | + let paramVal = paramsObj[key]; | ||
85 | + contextData[key] = paramVal; | ||
86 | + } | ||
87 | + } | ||
88 | + // 合并自定义的参数 | ||
89 | + if (params) { | ||
90 | + for (let key of Object.keys(params)) { | ||
91 | + let paramVal = params[key]; | ||
92 | + contextData[key] = paramVal; | ||
93 | + } | ||
94 | + } | ||
95 | + } | ||
96 | + | ||
97 | + return new Promise(async (resolve) => { | ||
98 | + that.queryEchartsData( | ||
99 | + optionsData.dynamicData, | ||
100 | + optionsData.refreshTime, | ||
101 | + that.optionsSetup, | ||
102 | + optionsData.isRefresh | ||
103 | + ).then(res => { | ||
104 | + let data = res[0]; | ||
105 | + if (data && (data.code == 200 || data.code == 0)) { | ||
106 | + resolve(data); | ||
107 | + } else if (data && data.code == 401) { | ||
108 | + console.log('token过期,请重新登录!', data); | ||
109 | + } | ||
110 | + }); | ||
111 | + }) | ||
112 | + }, | ||
113 | + } | ||
114 | +} |
1 | +/** | ||
2 | + * 积木报表按钮跳转到积木报表 | ||
3 | + */ | ||
4 | +export const monitorAjButton = { | ||
5 | + code: 'monitor-aj-button', | ||
6 | + type: 'html', | ||
7 | + label: 'AJ报表', | ||
8 | + icon: 'iconbiaoge', | ||
9 | + options: { | ||
10 | + setup: [ | ||
11 | + { | ||
12 | + type: 'el-input-text', | ||
13 | + label: '图层名称', | ||
14 | + name: 'layerName', | ||
15 | + required: false, | ||
16 | + placeholder: '', | ||
17 | + value: 'AJ报表按钮', | ||
18 | + }, | ||
19 | + { | ||
20 | + type: 'el-input-text', | ||
21 | + label: '按钮文本', | ||
22 | + name: 'buttonText', | ||
23 | + required: false, | ||
24 | + placeholder: '', | ||
25 | + value: '报表', | ||
26 | + }, | ||
27 | + { | ||
28 | + type: 'el-input-text', | ||
29 | + label: '报表编号', | ||
30 | + name: 'ajCode', | ||
31 | + required: false, | ||
32 | + placeholder: '', | ||
33 | + value: '' | ||
34 | + }, | ||
35 | + { | ||
36 | + type: 'el-input-text', | ||
37 | + label: '指标Id', | ||
38 | + name: 'kpiId', | ||
39 | + required: false, | ||
40 | + placeholder: '', | ||
41 | + value: '' | ||
42 | + }, | ||
43 | + { | ||
44 | + type: 'el-input-text', | ||
45 | + label: 'flag', | ||
46 | + name: 'flag', | ||
47 | + required: false, | ||
48 | + placeholder: '', | ||
49 | + value: '' | ||
50 | + } | ||
51 | + ], | ||
52 | + data: [], | ||
53 | + position: [ | ||
54 | + { | ||
55 | + type: 'el-input-number', | ||
56 | + label: '左边距', | ||
57 | + name: 'left', | ||
58 | + required: false, | ||
59 | + placeholder: '', | ||
60 | + value: 0, | ||
61 | + }, | ||
62 | + { | ||
63 | + type: 'el-input-number', | ||
64 | + label: '上边距', | ||
65 | + name: 'top', | ||
66 | + required: false, | ||
67 | + placeholder: '', | ||
68 | + value: 0, | ||
69 | + }, | ||
70 | + { | ||
71 | + type: 'el-input-number', | ||
72 | + label: '宽度', | ||
73 | + name: 'width', | ||
74 | + required: false, | ||
75 | + placeholder: '该容器在1920px大屏中的宽度', | ||
76 | + value: 30, | ||
77 | + }, | ||
78 | + { | ||
79 | + type: 'el-input-number', | ||
80 | + label: '高度', | ||
81 | + name: 'height', | ||
82 | + required: false, | ||
83 | + placeholder: '该容器在1080px大屏中的高度', | ||
84 | + value: 30, | ||
85 | + }, | ||
86 | + ], | ||
87 | + } | ||
88 | +} |
1 | +/** | ||
2 | + * 忙时分析页面 | ||
3 | + */ | ||
4 | +export const monitorJimuButton = { | ||
5 | + code: 'monitor-busy-analysis', | ||
6 | + type: 'html', | ||
7 | + label: '忙时分析报表', | ||
8 | + icon: 'iconbiaoge', | ||
9 | + options: { | ||
10 | + setup: [ | ||
11 | + { | ||
12 | + type: 'el-input-text', | ||
13 | + label: '图层名称', | ||
14 | + name: 'layerName', | ||
15 | + required: false, | ||
16 | + placeholder: '', | ||
17 | + value: '忙时分析报表', | ||
18 | + }, | ||
19 | + { | ||
20 | + type: 'el-input-text', | ||
21 | + label: '按钮文本', | ||
22 | + name: 'buttonText', | ||
23 | + required: false, | ||
24 | + placeholder: '', | ||
25 | + value: '报表', | ||
26 | + }, | ||
27 | + { | ||
28 | + type: 'el-input-text', | ||
29 | + label: '报表编号', | ||
30 | + name: 'reportCode', | ||
31 | + required: false, | ||
32 | + placeholder: '', | ||
33 | + value: '' | ||
34 | + }, | ||
35 | + { | ||
36 | + type: 'el-input-text', | ||
37 | + label: '指标Id', | ||
38 | + name: 'kpiId', | ||
39 | + required: false, | ||
40 | + placeholder: '', | ||
41 | + value: '' | ||
42 | + }, | ||
43 | + { | ||
44 | + type: 'el-input-text', | ||
45 | + label: 'flag', | ||
46 | + name: 'flag', | ||
47 | + required: false, | ||
48 | + placeholder: '', | ||
49 | + value: '' | ||
50 | + } | ||
51 | + ], | ||
52 | + data: [], | ||
53 | + position: [ | ||
54 | + { | ||
55 | + type: 'el-input-number', | ||
56 | + label: '左边距', | ||
57 | + name: 'left', | ||
58 | + required: false, | ||
59 | + placeholder: '', | ||
60 | + value: 0, | ||
61 | + }, | ||
62 | + { | ||
63 | + type: 'el-input-number', | ||
64 | + label: '上边距', | ||
65 | + name: 'top', | ||
66 | + required: false, | ||
67 | + placeholder: '', | ||
68 | + value: 0, | ||
69 | + }, | ||
70 | + { | ||
71 | + type: 'el-input-number', | ||
72 | + label: '宽度', | ||
73 | + name: 'width', | ||
74 | + required: false, | ||
75 | + placeholder: '该容器在1920px大屏中的宽度', | ||
76 | + value: 30, | ||
77 | + }, | ||
78 | + { | ||
79 | + type: 'el-input-number', | ||
80 | + label: '高度', | ||
81 | + name: 'height', | ||
82 | + required: false, | ||
83 | + placeholder: '该容器在1080px大屏中的高度', | ||
84 | + value: 30, | ||
85 | + }, | ||
86 | + ], | ||
87 | + } | ||
88 | +} |
1 | +/** | ||
2 | + * 三点图 | ||
3 | + */ | ||
4 | +export const monitorCustomScatterWeight = { | ||
5 | + code: 'monitor-custom-scatter-weight', | ||
6 | + type: 'chart', | ||
7 | + label: '散点图', | ||
8 | + icon: 'iconduidietu', | ||
9 | + options: { | ||
10 | + // 配置 | ||
11 | + setup: [ | ||
12 | + { | ||
13 | + type: 'el-input-text', | ||
14 | + label: '图层名称', | ||
15 | + name: 'layerName', | ||
16 | + required: false, | ||
17 | + placeholder: '', | ||
18 | + value: '散点图', | ||
19 | + }, | ||
20 | + { | ||
21 | + type: 'el-switch', | ||
22 | + label: '是否刷新', | ||
23 | + name: 'isRefresh', | ||
24 | + relactiveDom: 'dataType', | ||
25 | + relactiveDomValue: 'dynamicData', | ||
26 | + value: false | ||
27 | + }, | ||
28 | + { | ||
29 | + type: 'el-switch', | ||
30 | + label: '竖展示', | ||
31 | + name: 'verticalShow', | ||
32 | + required: false, | ||
33 | + placeholder: '', | ||
34 | + value: false, | ||
35 | + }, | ||
36 | + { | ||
37 | + type: 'vue-color', | ||
38 | + label: '背景颜色', | ||
39 | + name: 'background', | ||
40 | + required: false, | ||
41 | + placeholder: '', | ||
42 | + value: '' | ||
43 | + }, | ||
44 | + { | ||
45 | + type: 'el-select', | ||
46 | + label: 'kpiId', | ||
47 | + name: 'kpiId', | ||
48 | + required: false, | ||
49 | + placeholder: '', | ||
50 | + selectOptions: [ | ||
51 | + {code: 'KPI449F5365', name: 'KPI449F5365(文件系统使用率)'}, | ||
52 | + {code: 'KPI97373ED0', name: 'KPI97373ED0(磁盘IO读速率)'}, | ||
53 | + {code: 'KPI95378FE0', name: 'KPI95378FE0(磁盘IO写速率)'}, | ||
54 | + {code: 'KPI66BD013F', name: 'KPI66BD013F(磁盘IO处理时间)'}, | ||
55 | + {code: 'KPI3E6ED38B', name: 'KPI3E6ED38B(磁盘IO响应时间)'} | ||
56 | + ], | ||
57 | + value: 'KPI449F5365', | ||
58 | + }, | ||
59 | + [ | ||
60 | + { | ||
61 | + name: '折线设置', | ||
62 | + list: [ | ||
63 | + { | ||
64 | + type: 'el-switch', | ||
65 | + label: '标记点', | ||
66 | + name: 'markPoint', | ||
67 | + required: false, | ||
68 | + placeholder: '', | ||
69 | + value: true, | ||
70 | + }, | ||
71 | + { | ||
72 | + type: 'el-slider', | ||
73 | + label: '点大小', | ||
74 | + name: 'pointSize', | ||
75 | + required: false, | ||
76 | + placeholder: '', | ||
77 | + value: 6, | ||
78 | + }, | ||
79 | + { | ||
80 | + type: 'el-switch', | ||
81 | + label: '平滑曲线', | ||
82 | + name: 'smoothCurve', | ||
83 | + required: false, | ||
84 | + placeholder: '', | ||
85 | + value: true, | ||
86 | + }, | ||
87 | + { | ||
88 | + type: 'el-switch', | ||
89 | + label: '面积堆积', | ||
90 | + name: 'area', | ||
91 | + required: false, | ||
92 | + placeholder: '', | ||
93 | + value: true, | ||
94 | + }, | ||
95 | + { | ||
96 | + type: 'el-slider', | ||
97 | + label: '面积厚度', | ||
98 | + name: 'areaThickness', | ||
99 | + required: false, | ||
100 | + placeholder: '', | ||
101 | + value: 5, | ||
102 | + }, | ||
103 | + { | ||
104 | + type: 'el-slider', | ||
105 | + label: '线条宽度', | ||
106 | + name: 'lineWidth', | ||
107 | + required: false, | ||
108 | + placeholder: '', | ||
109 | + value: 1, | ||
110 | + }, | ||
111 | + ], | ||
112 | + }, | ||
113 | + { | ||
114 | + name: '标题设置', | ||
115 | + list: [ | ||
116 | + { | ||
117 | + type: 'el-switch', | ||
118 | + label: '标题', | ||
119 | + name: 'isNoTitle', | ||
120 | + required: false, | ||
121 | + placeholder: '', | ||
122 | + value: true, | ||
123 | + }, | ||
124 | + { | ||
125 | + type: 'el-input-text', | ||
126 | + label: '标题', | ||
127 | + name: 'titleText', | ||
128 | + required: false, | ||
129 | + placeholder: '', | ||
130 | + value: '文件系统使用率', | ||
131 | + }, | ||
132 | + { | ||
133 | + type: 'vue-color', | ||
134 | + label: '字体颜色', | ||
135 | + name: 'textColor', | ||
136 | + required: false, | ||
137 | + placeholder: '', | ||
138 | + value: '#1e9fff' | ||
139 | + }, | ||
140 | + { | ||
141 | + type: 'el-select', | ||
142 | + label: '字体粗细', | ||
143 | + name: 'textFontWeight', | ||
144 | + required: false, | ||
145 | + placeholder: '', | ||
146 | + selectOptions: [ | ||
147 | + {code: 'normal', name: '正常'}, | ||
148 | + {code: 'bold', name: '粗体'}, | ||
149 | + {code: 'bolder', name: '特粗体'}, | ||
150 | + {code: 'lighter', name: '细体'} | ||
151 | + ], | ||
152 | + value: 'bold' | ||
153 | + }, | ||
154 | + { | ||
155 | + type: 'el-input-number', | ||
156 | + label: '字体大小', | ||
157 | + name: 'textFontSize', | ||
158 | + required: false, | ||
159 | + placeholder: '', | ||
160 | + value: 16 | ||
161 | + }, | ||
162 | + { | ||
163 | + type: 'el-select', | ||
164 | + label: '字体位置', | ||
165 | + name: 'textAlign', | ||
166 | + required: false, | ||
167 | + placeholder: '', | ||
168 | + selectOptions: [ | ||
169 | + {code: 'center', name: '居中'}, | ||
170 | + {code: 'left', name: '左对齐'}, | ||
171 | + {code: 'right', name: '右对齐'}, | ||
172 | + ], | ||
173 | + value: 'left' | ||
174 | + }, | ||
175 | + { | ||
176 | + type: 'el-input-text', | ||
177 | + label: '副标题', | ||
178 | + name: 'subText', | ||
179 | + required: false, | ||
180 | + placeholder: '', | ||
181 | + value: '' | ||
182 | + }, | ||
183 | + { | ||
184 | + type: 'vue-color', | ||
185 | + label: '字体颜色', | ||
186 | + name: 'subTextColor', | ||
187 | + required: false, | ||
188 | + placeholder: '', | ||
189 | + value: 'rgba(30, 144, 255, 1)' | ||
190 | + }, | ||
191 | + { | ||
192 | + type: 'el-select', | ||
193 | + label: '字体粗细', | ||
194 | + name: 'subTextFontWeight', | ||
195 | + required: false, | ||
196 | + placeholder: '', | ||
197 | + selectOptions: [ | ||
198 | + {code: 'normal', name: '正常'}, | ||
199 | + {code: 'bold', name: '粗体'}, | ||
200 | + {code: 'bolder', name: '特粗体'}, | ||
201 | + {code: 'lighter', name: '细体'} | ||
202 | + ], | ||
203 | + value: 'normal' | ||
204 | + }, | ||
205 | + { | ||
206 | + type: 'el-input-number', | ||
207 | + label: '字体大小', | ||
208 | + name: 'subTextFontSize', | ||
209 | + required: false, | ||
210 | + placeholder: '', | ||
211 | + value: 20 | ||
212 | + }, | ||
213 | + ], | ||
214 | + }, | ||
215 | + { | ||
216 | + name: 'X轴设置', | ||
217 | + list: [ | ||
218 | + { | ||
219 | + type: 'el-switch', | ||
220 | + label: '显示', | ||
221 | + name: 'hideX', | ||
222 | + required: false, | ||
223 | + placeholder: '', | ||
224 | + value: true, | ||
225 | + }, | ||
226 | + { | ||
227 | + type: 'el-input-text', | ||
228 | + label: 'X轴别名', | ||
229 | + name: 'xName', | ||
230 | + required: false, | ||
231 | + placeholder: '', | ||
232 | + value: '' | ||
233 | + }, | ||
234 | + { | ||
235 | + type: 'vue-color', | ||
236 | + label: '别名颜色', | ||
237 | + name: 'xNameColor', | ||
238 | + required: false, | ||
239 | + placeholder: '', | ||
240 | + value: '#fff' | ||
241 | + }, | ||
242 | + { | ||
243 | + type: 'el-input-number', | ||
244 | + label: '别名字号', | ||
245 | + name: 'xNameFontSize', | ||
246 | + required: false, | ||
247 | + placeholder: '', | ||
248 | + value: 14 | ||
249 | + }, | ||
250 | + { | ||
251 | + type: 'el-switch', | ||
252 | + label: '轴反转', | ||
253 | + name: 'reversalX', | ||
254 | + required: false, | ||
255 | + placeholder: '', | ||
256 | + value: false | ||
257 | + }, | ||
258 | + { | ||
259 | + type: 'el-slider', | ||
260 | + label: '文字角度', | ||
261 | + name: 'textAngleX', | ||
262 | + required: false, | ||
263 | + placeholder: '', | ||
264 | + value: 0 | ||
265 | + }, | ||
266 | + { | ||
267 | + type: 'el-input-number', | ||
268 | + label: '文字间隔', | ||
269 | + name: 'textInterval', | ||
270 | + required: false, | ||
271 | + placeholder: '', | ||
272 | + value: '' | ||
273 | + }, | ||
274 | + { | ||
275 | + type: 'vue-color', | ||
276 | + label: '文字颜色', | ||
277 | + name: 'Xcolor', | ||
278 | + required: false, | ||
279 | + placeholder: '', | ||
280 | + value: '#666', | ||
281 | + }, | ||
282 | + { | ||
283 | + type: 'el-input-number', | ||
284 | + label: '文字字号', | ||
285 | + name: 'fontSizeX', | ||
286 | + required: false, | ||
287 | + placeholder: '', | ||
288 | + value: 14, | ||
289 | + }, | ||
290 | + { | ||
291 | + type: 'vue-color', | ||
292 | + label: '轴颜色', | ||
293 | + name: 'lineColorX', | ||
294 | + required: false, | ||
295 | + placeholder: '', | ||
296 | + value: '#c9c9c9', | ||
297 | + }, | ||
298 | + { | ||
299 | + type: 'el-switch', | ||
300 | + label: '分割线显示', | ||
301 | + name: 'isShowSplitLineX', | ||
302 | + require: false, | ||
303 | + placeholder: '', | ||
304 | + value: false, | ||
305 | + }, | ||
306 | + { | ||
307 | + type: 'vue-color', | ||
308 | + label: '分割线颜色', | ||
309 | + name: 'splitLineColorX', | ||
310 | + required: false, | ||
311 | + placeholder: '', | ||
312 | + value: '#fff', | ||
313 | + | ||
314 | + }, | ||
315 | + { | ||
316 | + type: 'el-switch', | ||
317 | + label: '分割区显示', | ||
318 | + name: 'splitArea', | ||
319 | + require: false, | ||
320 | + placeholder: '', | ||
321 | + value: true, | ||
322 | + }, | ||
323 | + { | ||
324 | + type: 'vue-color', | ||
325 | + label: '分割区颜色', | ||
326 | + name: 'splitAreaColor', | ||
327 | + required: false, | ||
328 | + placeholder: '', | ||
329 | + value: 'rgba(200,200,200,0.1)', | ||
330 | + }, | ||
331 | + ], | ||
332 | + }, | ||
333 | + { | ||
334 | + name: 'Y轴设置', | ||
335 | + list: [ | ||
336 | + { | ||
337 | + type: 'el-switch', | ||
338 | + label: '显示', | ||
339 | + name: 'isShowY', | ||
340 | + require: false, | ||
341 | + placeholder: '', | ||
342 | + value: true, | ||
343 | + }, | ||
344 | + { | ||
345 | + type: 'el-input-text', | ||
346 | + label: 'Y轴别名', | ||
347 | + name: 'textNameY', | ||
348 | + require: false, | ||
349 | + placeholder: '', | ||
350 | + value: '' | ||
351 | + }, | ||
352 | + { | ||
353 | + type: 'vue-color', | ||
354 | + label: '别名颜色', | ||
355 | + name: 'NameColorY', | ||
356 | + required: false, | ||
357 | + placeholder: '', | ||
358 | + value: '#fff', | ||
359 | + }, | ||
360 | + { | ||
361 | + type: 'el-input-number', | ||
362 | + label: '别名字号', | ||
363 | + name: 'NameFontSizeY', | ||
364 | + required: false, | ||
365 | + placeholder: '', | ||
366 | + value: 14, | ||
367 | + }, | ||
368 | + { | ||
369 | + type: 'el-switch', | ||
370 | + label: '轴反转', | ||
371 | + name: 'reversalY', | ||
372 | + required: false, | ||
373 | + placeholder: '', | ||
374 | + value: false | ||
375 | + }, | ||
376 | + { | ||
377 | + type: 'el-slider', | ||
378 | + label: '文字角度', | ||
379 | + name: 'textAngleY', | ||
380 | + required: false, | ||
381 | + placeholder: '', | ||
382 | + value: 0 | ||
383 | + }, | ||
384 | + { | ||
385 | + type: 'vue-color', | ||
386 | + label: '文字颜色', | ||
387 | + name: 'colorY', | ||
388 | + required: false, | ||
389 | + placeholder: '', | ||
390 | + value: '#666', | ||
391 | + }, | ||
392 | + { | ||
393 | + type: 'el-input-number', | ||
394 | + label: '文字字号', | ||
395 | + name: 'fontSizeY', | ||
396 | + required: false, | ||
397 | + placeholder: '', | ||
398 | + value: 14, | ||
399 | + }, | ||
400 | + { | ||
401 | + type: 'vue-color', | ||
402 | + label: '轴颜色', | ||
403 | + name: 'lineColorY', | ||
404 | + required: false, | ||
405 | + placeholder: '', | ||
406 | + value: '#c9c9c9', | ||
407 | + }, { | ||
408 | + type: 'el-switch', | ||
409 | + label: '分割线显示', | ||
410 | + name: 'isShowSplitLineY', | ||
411 | + require: false, | ||
412 | + placeholder: '', | ||
413 | + value: false, | ||
414 | + }, { | ||
415 | + type: 'vue-color', | ||
416 | + label: '分割线颜色', | ||
417 | + name: 'splitLineColorY', | ||
418 | + required: false, | ||
419 | + placeholder: '', | ||
420 | + value: '#fff', | ||
421 | + | ||
422 | + } | ||
423 | + ], | ||
424 | + }, | ||
425 | + { | ||
426 | + name: '数值设定', | ||
427 | + list: [ | ||
428 | + { | ||
429 | + type: 'el-switch', | ||
430 | + label: '显示', | ||
431 | + name: 'isShow', | ||
432 | + required: false, | ||
433 | + placeholder: '', | ||
434 | + value: false | ||
435 | + }, | ||
436 | + { | ||
437 | + type: 'el-input-number', | ||
438 | + label: '字体大小', | ||
439 | + name: 'fontSize', | ||
440 | + required: false, | ||
441 | + placeholder: '', | ||
442 | + value: 14 | ||
443 | + }, | ||
444 | + { | ||
445 | + type: 'vue-color', | ||
446 | + label: '字体颜色', | ||
447 | + name: 'subTextColor', | ||
448 | + required: false, | ||
449 | + placeholder: '', | ||
450 | + value: '#666' | ||
451 | + }, | ||
452 | + { | ||
453 | + type: 'el-select', | ||
454 | + label: '字体粗细', | ||
455 | + name: 'fontWeight', | ||
456 | + required: false, | ||
457 | + placeholder: '', | ||
458 | + selectOptions: [ | ||
459 | + {code: 'normal', name: '正常'}, | ||
460 | + {code: 'bold', name: '粗体'}, | ||
461 | + {code: 'bolder', name: '特粗体'}, | ||
462 | + {code: 'lighter', name: '细体'} | ||
463 | + ], | ||
464 | + value: 'normal' | ||
465 | + }, | ||
466 | + ], | ||
467 | + }, | ||
468 | + { | ||
469 | + name: '提示语设置', | ||
470 | + list: [ | ||
471 | + { | ||
472 | + type: 'el-input-number', | ||
473 | + label: '字体大小', | ||
474 | + name: 'tipsFontSize', | ||
475 | + required: false, | ||
476 | + placeholder: '', | ||
477 | + value: 16 | ||
478 | + }, | ||
479 | + { | ||
480 | + type: 'vue-color', | ||
481 | + label: '字体颜色', | ||
482 | + name: 'lineColor', | ||
483 | + required: false, | ||
484 | + placeholder: '', | ||
485 | + }, | ||
486 | + ], | ||
487 | + }, | ||
488 | + { | ||
489 | + name: '坐标轴边距设置', | ||
490 | + list: [ | ||
491 | + { | ||
492 | + type: 'el-slider', | ||
493 | + label: '左边距(像素)', | ||
494 | + name: 'marginLeft', | ||
495 | + required: false, | ||
496 | + placeholder: '', | ||
497 | + value: 10, | ||
498 | + }, { | ||
499 | + type: 'el-slider', | ||
500 | + label: '顶边距(像素)', | ||
501 | + name: 'marginTop', | ||
502 | + required: false, | ||
503 | + placeholder: '', | ||
504 | + value: 50, | ||
505 | + }, { | ||
506 | + type: 'el-slider', | ||
507 | + label: '右边距(像素)', | ||
508 | + name: 'marginRight', | ||
509 | + required: false, | ||
510 | + placeholder: '', | ||
511 | + value: 40, | ||
512 | + }, { | ||
513 | + type: 'el-slider', | ||
514 | + label: '底边距(像素)', | ||
515 | + name: 'marginBottom', | ||
516 | + required: false, | ||
517 | + placeholder: '', | ||
518 | + value: 10, | ||
519 | + }, | ||
520 | + ], | ||
521 | + }, | ||
522 | + { | ||
523 | + name: '图例操作', | ||
524 | + list: [ | ||
525 | + { | ||
526 | + type: 'el-switch', | ||
527 | + label: '显示', | ||
528 | + name: 'isShowLegend', | ||
529 | + required: false, | ||
530 | + placeholder: '', | ||
531 | + value: true, | ||
532 | + }, | ||
533 | + { | ||
534 | + type: 'el-switch', | ||
535 | + label: '图例文字显示', | ||
536 | + name: 'isShowLegendText', | ||
537 | + required: false, | ||
538 | + placeholder: '', | ||
539 | + value: false, | ||
540 | + }, | ||
541 | + { | ||
542 | + type: 'vue-color', | ||
543 | + label: '字体颜色', | ||
544 | + name: 'lengedColor', | ||
545 | + required: false, | ||
546 | + placeholder: '', | ||
547 | + value: '#666', | ||
548 | + }, | ||
549 | + { | ||
550 | + type: 'el-input-number', | ||
551 | + label: '字体大小', | ||
552 | + name: 'lengedFontSize', | ||
553 | + required: false, | ||
554 | + placeholder: '', | ||
555 | + value: 14, | ||
556 | + }, | ||
557 | + { | ||
558 | + type: 'el-input-number', | ||
559 | + label: '图例宽度', | ||
560 | + name: 'lengedWidth', | ||
561 | + required: false, | ||
562 | + placeholder: '', | ||
563 | + value: 15, | ||
564 | + }, | ||
565 | + { | ||
566 | + type: 'el-select', | ||
567 | + label: '横向位置', | ||
568 | + name: 'lateralPosition', | ||
569 | + required: false, | ||
570 | + placeholder: '', | ||
571 | + selectOptions: [ | ||
572 | + {code: 'center', name: '居中'}, | ||
573 | + {code: 'left', name: '左对齐'}, | ||
574 | + {code: 'right', name: '右对齐'}, | ||
575 | + ], | ||
576 | + value: 'center' | ||
577 | + }, | ||
578 | + { | ||
579 | + type: 'el-select', | ||
580 | + label: '纵向位置', | ||
581 | + name: 'longitudinalPosition', | ||
582 | + required: false, | ||
583 | + placeholder: '', | ||
584 | + selectOptions: [ | ||
585 | + {code: 'top', name: '顶部'}, | ||
586 | + {code: 'bottom', name: '底部'}, | ||
587 | + ], | ||
588 | + value: 'top' | ||
589 | + }, | ||
590 | + { | ||
591 | + type: 'el-select', | ||
592 | + label: '布局前置', | ||
593 | + name: 'layoutFront', | ||
594 | + required: false, | ||
595 | + placeholder: '', | ||
596 | + selectOptions: [ | ||
597 | + {code: 'vertical', name: '竖排'}, | ||
598 | + {code: 'horizontal', name: '横排'}, | ||
599 | + ], | ||
600 | + value: 'horizontal' | ||
601 | + }, | ||
602 | + ], | ||
603 | + }, | ||
604 | + { | ||
605 | + name: '自定义配色', | ||
606 | + list: [ | ||
607 | + { | ||
608 | + type: 'customColor', | ||
609 | + label: '', | ||
610 | + name: 'customColor', | ||
611 | + required: false, | ||
612 | + value: [{color: '#facf5b'}, {color: '#C04DD8'}, {color: '#F5A1EB'}, {color: '#F36093'}, | ||
613 | + {color: '#C2E74D'},{color:'#3DC3FF'},{color:'#B850ED'}], | ||
614 | + }, | ||
615 | + ], | ||
616 | + }, | ||
617 | + ], | ||
618 | + ], | ||
619 | + // 数据 | ||
620 | + data: [ | ||
621 | + { | ||
622 | + type: 'el-radio-group', | ||
623 | + label: '数据类型', | ||
624 | + name: 'dataType', | ||
625 | + require: false, | ||
626 | + placeholder: '', | ||
627 | + selectValue: true, | ||
628 | + selectOptions: [ | ||
629 | + { | ||
630 | + code: 'staticData', | ||
631 | + name: '静态数据', | ||
632 | + }, | ||
633 | + { | ||
634 | + code: 'dynamicData', | ||
635 | + name: '动态数据', | ||
636 | + }, | ||
637 | + ], | ||
638 | + value: 'staticData', | ||
639 | + }, | ||
640 | + { | ||
641 | + type: 'el-input-number', | ||
642 | + label: '刷新时间(毫秒)', | ||
643 | + name: 'refreshTime', | ||
644 | + relactiveDom: 'dataType', | ||
645 | + relactiveDomValue: 'dynamicData', | ||
646 | + value: 5000 | ||
647 | + }, | ||
648 | + { | ||
649 | + type: 'el-button', | ||
650 | + label: '静态数据', | ||
651 | + name: 'staticData', | ||
652 | + required: false, | ||
653 | + placeholder: '静态数据源', | ||
654 | + relactiveDom: 'dataType', | ||
655 | + relactiveDomValue: 'staticData', | ||
656 | + value: [{ | ||
657 | + "year": 2022, | ||
658 | + "month": 4, | ||
659 | + "day": 28, | ||
660 | + "hour": 10, | ||
661 | + "kpiName": "内存分配率", | ||
662 | + "kpiUnit": "%", | ||
663 | + "valMin": 67.94, | ||
664 | + "valAvg": 67.94, | ||
665 | + "valMax": 67.94 | ||
666 | + }], | ||
667 | + }, | ||
668 | + { | ||
669 | + type: 'dycustComponents', | ||
670 | + label: '', | ||
671 | + name: 'dynamicData', | ||
672 | + required: false, | ||
673 | + placeholder: '动态数据源', | ||
674 | + relactiveDom: 'dataType', | ||
675 | + relactiveDomValue: 'dynamicData', | ||
676 | + chartType: '', | ||
677 | + dictKey: 'STACK_PROPERTIES', | ||
678 | + value: '', | ||
679 | + }, | ||
680 | + ], | ||
681 | + // 坐标 | ||
682 | + position: [ | ||
683 | + { | ||
684 | + type: 'el-input-number', | ||
685 | + label: '左边距', | ||
686 | + name: 'left', | ||
687 | + required: false, | ||
688 | + placeholder: '', | ||
689 | + value: 0, | ||
690 | + }, | ||
691 | + { | ||
692 | + type: 'el-input-number', | ||
693 | + label: '上边距', | ||
694 | + name: 'top', | ||
695 | + required: false, | ||
696 | + placeholder: '', | ||
697 | + value: 0, | ||
698 | + }, | ||
699 | + { | ||
700 | + type: 'el-input-number', | ||
701 | + label: '宽度', | ||
702 | + name: 'width', | ||
703 | + required: false, | ||
704 | + placeholder: '该容器在1920px大屏中的宽度', | ||
705 | + value: 400, | ||
706 | + }, | ||
707 | + { | ||
708 | + type: 'el-input-number', | ||
709 | + label: '高度', | ||
710 | + name: 'height', | ||
711 | + required: false, | ||
712 | + placeholder: '该容器在1080px大屏中的高度', | ||
713 | + value: 200, | ||
714 | + }, | ||
715 | + ], | ||
716 | + } | ||
717 | +} |
1 | +/** | ||
2 | + * 积木报表按钮跳转到积木报表 | ||
3 | + */ | ||
4 | +export const monitorJimuButton = { | ||
5 | + code: 'monitor-jimu-button', | ||
6 | + type: 'html', | ||
7 | + label: '积木报表', | ||
8 | + icon: 'iconbiaoge', | ||
9 | + options: { | ||
10 | + setup: [ | ||
11 | + { | ||
12 | + type: 'el-input-text', | ||
13 | + label: '图层名称', | ||
14 | + name: 'layerName', | ||
15 | + required: false, | ||
16 | + placeholder: '', | ||
17 | + value: '积木报表按钮', | ||
18 | + }, | ||
19 | + { | ||
20 | + type: 'el-input-text', | ||
21 | + label: '按钮文本', | ||
22 | + name: 'buttonText', | ||
23 | + required: false, | ||
24 | + placeholder: '', | ||
25 | + value: '报表', | ||
26 | + }, | ||
27 | + { | ||
28 | + type: 'el-input-text', | ||
29 | + label: '报表编号', | ||
30 | + name: 'reportCode', | ||
31 | + required: false, | ||
32 | + placeholder: '', | ||
33 | + value: '' | ||
34 | + }, | ||
35 | + { | ||
36 | + type: 'el-input-text', | ||
37 | + label: '指标Id', | ||
38 | + name: 'kpiId', | ||
39 | + required: false, | ||
40 | + placeholder: '', | ||
41 | + value: '' | ||
42 | + }, | ||
43 | + { | ||
44 | + type: 'el-input-text', | ||
45 | + label: 'flag', | ||
46 | + name: 'flag', | ||
47 | + required: false, | ||
48 | + placeholder: '', | ||
49 | + value: '' | ||
50 | + } | ||
51 | + ], | ||
52 | + data: [], | ||
53 | + position: [ | ||
54 | + { | ||
55 | + type: 'el-input-number', | ||
56 | + label: '左边距', | ||
57 | + name: 'left', | ||
58 | + required: false, | ||
59 | + placeholder: '', | ||
60 | + value: 0, | ||
61 | + }, | ||
62 | + { | ||
63 | + type: 'el-input-number', | ||
64 | + label: '上边距', | ||
65 | + name: 'top', | ||
66 | + required: false, | ||
67 | + placeholder: '', | ||
68 | + value: 0, | ||
69 | + }, | ||
70 | + { | ||
71 | + type: 'el-input-number', | ||
72 | + label: '宽度', | ||
73 | + name: 'width', | ||
74 | + required: false, | ||
75 | + placeholder: '该容器在1920px大屏中的宽度', | ||
76 | + value: 30, | ||
77 | + }, | ||
78 | + { | ||
79 | + type: 'el-input-number', | ||
80 | + label: '高度', | ||
81 | + name: 'height', | ||
82 | + required: false, | ||
83 | + placeholder: '该容器在1080px大屏中的高度', | ||
84 | + value: 30, | ||
85 | + }, | ||
86 | + ], | ||
87 | + } | ||
88 | +} |
@@ -57,6 +57,9 @@ import {monitorTablePage} from "./echartsConfigJson/monitorConfigJson/monitor-ta | @@ -57,6 +57,9 @@ import {monitorTablePage} from "./echartsConfigJson/monitorConfigJson/monitor-ta | ||
57 | import {monitorButtonExport} from "./echartsConfigJson/monitorConfigJson/monitor-button-export"; | 57 | import {monitorButtonExport} from "./echartsConfigJson/monitorConfigJson/monitor-button-export"; |
58 | import {monitorCustomBarLineChartArray} from "./echartsConfigJson/monitorConfigJson/monitor-custom-bar-line-chart-array"; | 58 | import {monitorCustomBarLineChartArray} from "./echartsConfigJson/monitorConfigJson/monitor-custom-bar-line-chart-array"; |
59 | 59 | ||
60 | +import {monitorJimuButton} from "./echartsConfigJson/monitorConfigJson/monitor-jimu-button"; | ||
61 | +import {monitorAjButton} from "./echartsConfigJson/monitorConfigJson/monitor-aj-button"; | ||
62 | +import {monitorCustomScatterWeight} from "./echartsConfigJson/monitorConfigJson/monitor-custom-scatter-weight"; | ||
60 | 63 | ||
61 | export const {widgetTool,monitor} = { | 64 | export const {widgetTool,monitor} = { |
62 | widgetTool : [ | 65 | widgetTool : [ |
@@ -132,6 +135,12 @@ export const {widgetTool,monitor} = { | @@ -132,6 +135,12 @@ export const {widgetTool,monitor} = { | ||
132 | //分页表格 | 135 | //分页表格 |
133 | monitorTablePage, | 136 | monitorTablePage, |
134 | //导出 | 137 | //导出 |
135 | - monitorButtonExport | 138 | + monitorButtonExport, |
139 | + // 积木报表按钮,弹框展示 | ||
140 | + monitorJimuButton, | ||
141 | + // AJ报表按钮,弹框展示 | ||
142 | + monitorAjButton, | ||
143 | + // 散点图 | ||
144 | + monitorCustomScatterWeight | ||
136 | ] | 145 | ] |
137 | } | 146 | } |
@@ -15,7 +15,7 @@ | @@ -15,7 +15,7 @@ | ||
15 | </div> | 15 | </div> |
16 | </div> | 16 | </div> |
17 | <div class="wave-title" :style="subTitleStyle" v-if="index==0">当前使用率</div> | 17 | <div class="wave-title" :style="subTitleStyle" v-if="index==0">当前使用率</div> |
18 | - <div class="wave-title" :style="subTitleStyle" v-if="index==1">使用增长率</div> | 18 | + <div class="wave-title" :style="subTitleStyle" v-if="index==1">{{getIndex2Name()}}</div> |
19 | </div> | 19 | </div> |
20 | </div> | 20 | </div> |
21 | 21 | ||
@@ -26,6 +26,7 @@ | @@ -26,6 +26,7 @@ | ||
26 | 26 | ||
27 | <script> | 27 | <script> |
28 | var per = 60; | 28 | var per = 60; |
29 | +import {mapGetters} from "vuex"; | ||
29 | export default { | 30 | export default { |
30 | name: "customLiquidFillChart",//百分比图参考:https://www.makeapie.com/editor.html?c=xFkzKG-bpl | 31 | name: "customLiquidFillChart",//百分比图参考:https://www.makeapie.com/editor.html?c=xFkzKG-bpl |
31 | components: {}, | 32 | components: {}, |
@@ -121,6 +122,11 @@ export default { | @@ -121,6 +122,11 @@ export default { | ||
121 | }; | 122 | }; |
122 | }, | 123 | }, |
123 | computed: { | 124 | computed: { |
125 | + //月季度年按钮通过vuex接收值 | ||
126 | + ...mapGetters(['buttonVals']), | ||
127 | + buttonVal(){ | ||
128 | + return this.buttonVals; | ||
129 | + }, | ||
124 | styleObj() { | 130 | styleObj() { |
125 | return { | 131 | return { |
126 | position: this.ispreview ? "absolute" : "static", | 132 | position: this.ispreview ? "absolute" : "static", |
@@ -226,6 +232,22 @@ export default { | @@ -226,6 +232,22 @@ export default { | ||
226 | this.editorOptions(); | 232 | this.editorOptions(); |
227 | }, | 233 | }, |
228 | deep: true | 234 | deep: true |
235 | + }, | ||
236 | + //监听月季度年按钮切换值 | ||
237 | + buttonVal:{ | ||
238 | + handler(val){ | ||
239 | + // TODO 在存储页面中获取不到,暂时注释掉 | ||
240 | + //if(this.optionsSetup.isVuex){ | ||
241 | + let optionsData=this.optionsData; | ||
242 | + if(this.optionsData.dataType=="dynamicData"){ | ||
243 | + //改变参数值-月季度年,重新加载动态数据 | ||
244 | + this.optionsData.dynamicData.contextData.dataScope=val; | ||
245 | + // this.editorOptions(); | ||
246 | + } | ||
247 | + //} | ||
248 | + | ||
249 | + }, | ||
250 | + deep:true | ||
229 | } | 251 | } |
230 | }, | 252 | }, |
231 | created() { | 253 | created() { |
@@ -239,7 +261,21 @@ export default { | @@ -239,7 +261,21 @@ export default { | ||
239 | 261 | ||
240 | }, | 262 | }, |
241 | methods: { | 263 | methods: { |
242 | - | 264 | + /** |
265 | + * 获取使用增长率名称 | ||
266 | + */ | ||
267 | + getIndex2Name(){ | ||
268 | + switch (this.optionsData.dynamicData.contextData.dataScope) { | ||
269 | + case 'month': | ||
270 | + return "月使用增长率" | ||
271 | + case 'quarter': | ||
272 | + return '季度使用增长率'; | ||
273 | + case 'year': | ||
274 | + return '年使用增长率'; | ||
275 | + default: | ||
276 | + return "使用增长率" | ||
277 | + } | ||
278 | + }, | ||
243 | editorOptions() { | 279 | editorOptions() { |
244 | this.setOptionsData(); | 280 | this.setOptionsData(); |
245 | }, | 281 | }, |
1 | +<template> | ||
2 | + <div :style="styleObj"> | ||
3 | + <el-button type="primary" size="small" plain @click="openJimuReport">{{optionsSetUp.buttonText}}</el-button> | ||
4 | + </div> | ||
5 | + | ||
6 | +</template> | ||
7 | + | ||
8 | +<script> | ||
9 | + | ||
10 | +export default { | ||
11 | + name: "monitorAjButton", | ||
12 | + data() { | ||
13 | + return { | ||
14 | + options: {}, | ||
15 | + optionsSetUp: {}, | ||
16 | + optionsPosition: {}, | ||
17 | + optionsData: {}, | ||
18 | + } | ||
19 | + }, | ||
20 | + components: {}, | ||
21 | + props: { | ||
22 | + value: Object, | ||
23 | + ispreview: Boolean | ||
24 | + }, | ||
25 | + computed: { | ||
26 | + styleObj() { | ||
27 | + const allStyle = this.optionsPosition; | ||
28 | + return { | ||
29 | + position: this.ispreview ? "absolute" : "static", | ||
30 | + width: allStyle.width + "px", | ||
31 | + height: allStyle.height + "px", | ||
32 | + left: allStyle.left + "px", | ||
33 | + top: allStyle.top + "px", | ||
34 | + 'background-repeat': 'no-repeat', | ||
35 | + 'background-size': 'contain' | ||
36 | + }; | ||
37 | + }, | ||
38 | + }, | ||
39 | + watch: { | ||
40 | + value: { | ||
41 | + handler(val) { | ||
42 | + this.options = val; | ||
43 | + this.optionsSetUp = val.setup; | ||
44 | + this.optionsPosition = val.position; | ||
45 | + // this.handlerData(); | ||
46 | + }, | ||
47 | + deep: true | ||
48 | + } | ||
49 | + }, | ||
50 | + mounted() { | ||
51 | + this.options = this.value; | ||
52 | + this.optionsSetUp = this.value.setup; | ||
53 | + this.optionsPosition = this.value.position; | ||
54 | + }, | ||
55 | + methods: { | ||
56 | + openJimuReport() { | ||
57 | + let resId = this.$route.query.resId; | ||
58 | + let kpiId = this.optionsSetUp.kpiId; | ||
59 | + let flag = this.optionsSetUp.flag; | ||
60 | + let reportCode = this.optionsSetUp.ajCode; | ||
61 | + let title = this.optionsSetUp.buttonText; | ||
62 | + let param = { | ||
63 | + type: 'openAJ', | ||
64 | + data: { | ||
65 | + resId: resId, | ||
66 | + kpiId: kpiId, | ||
67 | + flag: flag, | ||
68 | + reportCode:reportCode, | ||
69 | + title:title | ||
70 | + } | ||
71 | + | ||
72 | + } | ||
73 | + window.parent.postMessage(param, '*') | ||
74 | + } | ||
75 | + }, | ||
76 | +} | ||
77 | +</script> | ||
78 | + | ||
79 | +<style scoped lang="scss"> | ||
80 | +.info-title { | ||
81 | + padding: 15px; | ||
82 | + display: flex; | ||
83 | + align-items: center; | ||
84 | +} | ||
85 | + | ||
86 | +.icon-title { | ||
87 | + margin-right: 5px; | ||
88 | +} | ||
89 | +</style> |
report-ui/src/views/report/bigscreen/designer/widget/monitor/monitorCustomScatterWeight.vue
0 → 100644
1 | +<template> | ||
2 | + <div> | ||
3 | + <div :id="id" :style="styleObj"></div> | ||
4 | + </div> | ||
5 | +</template> | ||
6 | + | ||
7 | +<script> | ||
8 | +import commonWeight from '@/mixins/commonWeight' | ||
9 | + | ||
10 | +export default { | ||
11 | + name: "monitorCustomScatterWeight", | ||
12 | + mixins: [commonWeight], | ||
13 | + data() { | ||
14 | + return { | ||
15 | + chartInfo: null, | ||
16 | + scatterWeightOptions: { | ||
17 | + title: { | ||
18 | + text: '', | ||
19 | + subtext: '' | ||
20 | + }, | ||
21 | + grid: { | ||
22 | + left: '3%', | ||
23 | + right: '7%', | ||
24 | + bottom: '7%', | ||
25 | + containLabel: true | ||
26 | + }, | ||
27 | + tooltip: { | ||
28 | + showDelay: 0, | ||
29 | + formatter: function (params) { | ||
30 | + return ( | ||
31 | + params.seriesName + | ||
32 | + '<br/>' + params.name + ' ' + params.value[2] + ' :<br/>' + | ||
33 | + '最大' + params.value[2] + ': ' + params.value[3] + '% ' + '<br/>' + | ||
34 | + '最小' + params.value[2] + ': ' + params.value[4] + '% ' + '<br/>' + | ||
35 | + '平均' + params.value[2] + ': ' + params.value[5] + '% ' + '<br/>' | ||
36 | + ); | ||
37 | + }, | ||
38 | + axisPointer: { | ||
39 | + show: true, | ||
40 | + type: 'cross', | ||
41 | + lineStyle: { | ||
42 | + type: 'dashed', | ||
43 | + width: 1 | ||
44 | + } | ||
45 | + } | ||
46 | + }, | ||
47 | + toolbox: { | ||
48 | + feature: { | ||
49 | + dataZoom: {}, | ||
50 | + brush: { | ||
51 | + type: ['rect', 'polygon', 'clear'] | ||
52 | + } | ||
53 | + } | ||
54 | + }, | ||
55 | + brush: {}, | ||
56 | + legend: { | ||
57 | + data: ['忙时', '闲时'], | ||
58 | + left: 'center', | ||
59 | + bottom: 10 | ||
60 | + }, | ||
61 | + xAxis: [ | ||
62 | + { | ||
63 | + data: []/*['2022-5-13 10:00:00', '2022-5-13 11:00:00', '2022-5-13 12:00:00']*/, | ||
64 | + scale: true, | ||
65 | + axisLabel: { | ||
66 | + formatter: function (v) { | ||
67 | + return v; | ||
68 | + } | ||
69 | + }, | ||
70 | + splitLine: { | ||
71 | + show: false | ||
72 | + } | ||
73 | + } | ||
74 | + ], | ||
75 | + yAxis: [ | ||
76 | + { | ||
77 | + data: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23], | ||
78 | + scale: true, | ||
79 | + axisLabel: { | ||
80 | + formatter: '{value} 时' | ||
81 | + }, | ||
82 | + splitLine: { | ||
83 | + show: false | ||
84 | + } | ||
85 | + } | ||
86 | + ], | ||
87 | + series: [ | ||
88 | + { | ||
89 | + name: '忙时', | ||
90 | + type: 'scatter', | ||
91 | + emphasis: { | ||
92 | + focus: 'series' | ||
93 | + }, | ||
94 | + data: [ | ||
95 | + /*['2022-5-13 10:00:00', 10, 'CPU使用率', 100, 111, 120], | ||
96 | + ['2022-5-13 10:00:00', 11, 'CPU使用率', 100, 111, 120], | ||
97 | + ['2022-5-13 10:00:00', 12, 'CPU使用率', 100, 111, 120],*/ | ||
98 | + | ||
99 | + ] | ||
100 | + }, | ||
101 | + { | ||
102 | + name: '闲时', | ||
103 | + type: 'scatter', | ||
104 | + emphasis: { | ||
105 | + focus: 'series' | ||
106 | + }, | ||
107 | + data: [ | ||
108 | + /*['2022-5-13 11:00:00', 20, 'CPU使用率', 100, 111, 120], | ||
109 | + ['2022-5-13 12:00:00', 21, 'CPU使用率', 100, 111, 120], | ||
110 | + ['2022-5-13 10:00:00', 22, 'CPU使用率', 100, 111, 120],*/ | ||
111 | + ] | ||
112 | + } | ||
113 | + ] | ||
114 | + } | ||
115 | + } | ||
116 | + }, | ||
117 | + components: {}, | ||
118 | + computed: { | ||
119 | + styleObj() { | ||
120 | + const allStyle = this.optionsPosition; | ||
121 | + return { | ||
122 | + width: allStyle.width + "px", | ||
123 | + height: allStyle.height + "px" | ||
124 | + }; | ||
125 | + }, | ||
126 | + }, | ||
127 | + mounted() { | ||
128 | + this.initChart(); | ||
129 | + }, | ||
130 | + methods: { | ||
131 | + /** | ||
132 | + * 重新加载图表 | ||
133 | + * | ||
134 | + * */ | ||
135 | + reloadChart() { | ||
136 | + if (this.chartInfo) { | ||
137 | + // 重新加载数据 | ||
138 | + this.getChartData(); | ||
139 | + // 重新设置数据、 | ||
140 | + this.chartInfo.setOption(this.scatterWeightOptions); | ||
141 | + // 刷新图表大小 | ||
142 | + this.chartInfo.resize(); | ||
143 | + } | ||
144 | + }, | ||
145 | + /** | ||
146 | + * 获取图表数据 | ||
147 | + */ | ||
148 | + getChartData() { | ||
149 | + let that = this; | ||
150 | + | ||
151 | + var startTime = that.getData(-30) + " 00:00:00"; | ||
152 | + var endTime = that.getData(0) + " 23:59:59"; | ||
153 | + | ||
154 | + // 默认条件 | ||
155 | + let defaultParams = { | ||
156 | + indexName: 'calculation-search', | ||
157 | + startTime: startTime, | ||
158 | + endTime: endTime, | ||
159 | + pageSize: 1000 | ||
160 | + } | ||
161 | + that.handlerData(defaultParams).then((res) => { | ||
162 | + let list = res.data; | ||
163 | + let busyArr = []; | ||
164 | + let idleArr = []; | ||
165 | + let xAxis = []; | ||
166 | + if (list) { | ||
167 | + list.map(function (v) { | ||
168 | + let time = `${v.year}-${v.month}-${v.day} ${v.hour}:00:00`; | ||
169 | + let arr = [time, v.hour, v.kpiName, v.valMax, v.valMin, v.valAvg]; | ||
170 | + xAxis.push(time); | ||
171 | + if (v.isBusy) { | ||
172 | + // 忙时点 | ||
173 | + busyArr.push(arr); | ||
174 | + } else { | ||
175 | + idleArr.push(arr); | ||
176 | + } | ||
177 | + }); | ||
178 | + that.scatterWeightOptions.xAxis[0].data = xAxis; | ||
179 | + that.scatterWeightOptions.series[0].data = busyArr; | ||
180 | + that.scatterWeightOptions.series[1].data = idleArr; | ||
181 | + } | ||
182 | + }).catch((e) => { | ||
183 | + console.log('处理错误', e); | ||
184 | + let date = new Date(); | ||
185 | + let year = date.getFullYear(); //获取当前年 | ||
186 | + let month = date.getMonth() + 1; //获取当前月 | ||
187 | + let day = date.getDate(); //获取当前日 | ||
188 | + | ||
189 | + let ymd = `${year}-${month}-${day}`; | ||
190 | + for (let i = 0; i < 24; i++) { | ||
191 | + xAxis.push(`${ymd} ${i}:00:00`); | ||
192 | + } | ||
193 | + that.scatterWeightOptions.xAxis[0].data = xAxis; | ||
194 | + that.scatterWeightOptions.series[0].data = busyArr; | ||
195 | + that.scatterWeightOptions.series[1].data = idleArr; | ||
196 | + }) | ||
197 | + }, | ||
198 | + initChart() { | ||
199 | + let that = this; | ||
200 | + that.getChartData(); | ||
201 | + setTimeout(function () { | ||
202 | + var myChart = that.$echarts.init(document.getElementById(that.id)); | ||
203 | + // 使用刚指定的配置项和数据显示图表。 | ||
204 | + myChart.setOption(that.scatterWeightOptions); | ||
205 | + that.chartInfo = myChart; | ||
206 | + }, 1000); | ||
207 | + | ||
208 | + } | ||
209 | + } | ||
210 | +} | ||
211 | +</script> | ||
212 | + | ||
213 | +<style scoped> | ||
214 | + | ||
215 | +</style> |
1 | +<template> | ||
2 | + <div :style="styleObj"> | ||
3 | + <el-button type="primary" size="small" plain @click="openJimuReport">{{optionsSetUp.buttonText}}</el-button> | ||
4 | + </div> | ||
5 | + | ||
6 | +</template> | ||
7 | + | ||
8 | +<script> | ||
9 | + | ||
10 | +export default { | ||
11 | + name: "monitorJimuButton", | ||
12 | + data() { | ||
13 | + return { | ||
14 | + options: {}, | ||
15 | + optionsSetUp: {}, | ||
16 | + optionsPosition: {}, | ||
17 | + optionsData: {}, | ||
18 | + } | ||
19 | + }, | ||
20 | + components: {}, | ||
21 | + props: { | ||
22 | + value: Object, | ||
23 | + ispreview: Boolean | ||
24 | + }, | ||
25 | + computed: { | ||
26 | + styleObj() { | ||
27 | + const allStyle = this.optionsPosition; | ||
28 | + return { | ||
29 | + position: this.ispreview ? "absolute" : "static", | ||
30 | + width: allStyle.width + "px", | ||
31 | + height: allStyle.height + "px", | ||
32 | + left: allStyle.left + "px", | ||
33 | + top: allStyle.top + "px", | ||
34 | + 'background-repeat': 'no-repeat', | ||
35 | + 'background-size': 'contain' | ||
36 | + }; | ||
37 | + }, | ||
38 | + }, | ||
39 | + watch: { | ||
40 | + value: { | ||
41 | + handler(val) { | ||
42 | + this.options = val; | ||
43 | + this.optionsSetUp = val.setup; | ||
44 | + this.optionsPosition = val.position; | ||
45 | + // this.handlerData(); | ||
46 | + }, | ||
47 | + deep: true | ||
48 | + } | ||
49 | + }, | ||
50 | + mounted() { | ||
51 | + this.options = this.value; | ||
52 | + this.optionsSetUp = this.value.setup; | ||
53 | + this.optionsPosition = this.value.position; | ||
54 | + }, | ||
55 | + methods: { | ||
56 | + openJimuReport() { | ||
57 | + let resId = this.$route.query.resId; | ||
58 | + let kpiId = this.optionsSetUp.kpiId; | ||
59 | + let flag = this.optionsSetUp.flag; | ||
60 | + let reportCode = this.optionsSetUp.reportCode; | ||
61 | + let title = this.optionsSetUp.buttonText; | ||
62 | + let param = { | ||
63 | + type: 'openJimu', | ||
64 | + data: { | ||
65 | + resId: resId, | ||
66 | + kpiId: kpiId, | ||
67 | + flag: flag, | ||
68 | + reportCode:reportCode, | ||
69 | + title:title | ||
70 | + } | ||
71 | + | ||
72 | + } | ||
73 | + window.parent.postMessage(param, '*') | ||
74 | + } | ||
75 | + }, | ||
76 | +} | ||
77 | +</script> | ||
78 | + | ||
79 | +<style scoped lang="scss"> | ||
80 | +.info-title { | ||
81 | + padding: 15px; | ||
82 | + display: flex; | ||
83 | + align-items: center; | ||
84 | +} | ||
85 | + | ||
86 | +.icon-title { | ||
87 | + margin-right: 5px; | ||
88 | +} | ||
89 | +</style> |
1 | +<template> | ||
2 | + <div :id="id" :style="styleObj"></div> | ||
3 | +</template> | ||
4 | + | ||
5 | +<script> | ||
6 | +export default { | ||
7 | + name: "busyAnalysisPage", | ||
8 | + data() { | ||
9 | + return { | ||
10 | + options: {}, | ||
11 | + optionsSetUp: {}, | ||
12 | + optionsPosition: {}, | ||
13 | + optionsData: {}, | ||
14 | + id:(new Date()).getTime(), | ||
15 | + chartInfo:null, | ||
16 | + scatterWeightOptions: { | ||
17 | + title: { | ||
18 | + text: '散点图', | ||
19 | + subtext: '二级标题描述' | ||
20 | + }, | ||
21 | + grid: { | ||
22 | + left: '3%', | ||
23 | + right: '7%', | ||
24 | + bottom: '7%', | ||
25 | + containLabel: true | ||
26 | + }, | ||
27 | + tooltip: { | ||
28 | + showDelay: 0, | ||
29 | + formatter: function (params) { | ||
30 | + if (params.value.length > 1) { | ||
31 | + return ( | ||
32 | + params.seriesName + | ||
33 | + ' :<br/>' + | ||
34 | + params.value[0] + | ||
35 | + 'cm ' + | ||
36 | + params.value[1] + | ||
37 | + 'kg ' | ||
38 | + ); | ||
39 | + } else { | ||
40 | + return ( | ||
41 | + params.seriesName + | ||
42 | + ' :<br/>' + | ||
43 | + params.name + | ||
44 | + ' : ' + | ||
45 | + params.value + | ||
46 | + 'kg ' | ||
47 | + ); | ||
48 | + } | ||
49 | + }, | ||
50 | + axisPointer: { | ||
51 | + show: true, | ||
52 | + type: 'cross', | ||
53 | + lineStyle: { | ||
54 | + type: 'dashed', | ||
55 | + width: 1 | ||
56 | + } | ||
57 | + } | ||
58 | + }, | ||
59 | + toolbox: { | ||
60 | + feature: { | ||
61 | + dataZoom: {}, | ||
62 | + brush: { | ||
63 | + type: ['rect', 'polygon', 'clear'] | ||
64 | + } | ||
65 | + } | ||
66 | + }, | ||
67 | + brush: {}, | ||
68 | + legend: { | ||
69 | + data: ['Female', 'Male'], | ||
70 | + left: 'center', | ||
71 | + bottom: 10 | ||
72 | + }, | ||
73 | + xAxis: [ | ||
74 | + { | ||
75 | + type: 'value', | ||
76 | + scale: true, | ||
77 | + axisLabel: { | ||
78 | + formatter: '{value} cm' | ||
79 | + }, | ||
80 | + splitLine: { | ||
81 | + show: false | ||
82 | + } | ||
83 | + } | ||
84 | + ], | ||
85 | + yAxis: [ | ||
86 | + { | ||
87 | + type: 'value', | ||
88 | + scale: true, | ||
89 | + axisLabel: { | ||
90 | + formatter: '{value} kg' | ||
91 | + }, | ||
92 | + splitLine: { | ||
93 | + show: false | ||
94 | + } | ||
95 | + } | ||
96 | + ], | ||
97 | + series: [ | ||
98 | + { | ||
99 | + name: 'Female', | ||
100 | + type: 'scatter', | ||
101 | + emphasis: { | ||
102 | + focus: 'series' | ||
103 | + }, | ||
104 | + // prettier-ignore | ||
105 | + data: [[161.2, 51.6], [167.5, 59.0], [159.5, 49.2], [157.0, 63.0], [155.8, 53.6], | ||
106 | + [170.0, 59.0], [159.1, 47.6], [166.0, 69.8], [176.2, 66.8], [160.2, 75.2], | ||
107 | + [172.5, 55.2], [170.9, 54.2], [172.9, 62.5], [153.4, 42.0], [160.0, 50.0], | ||
108 | + [147.2, 49.8], [168.2, 49.2], [175.0, 73.2], [157.0, 47.8], [167.6, 68.8], | ||
109 | + [159.5, 50.6], [175.0, 82.5], [166.8, 57.2], [176.5, 87.8], [170.2, 72.8], | ||
110 | + [174.0, 54.5], [173.0, 59.8], [179.9, 67.3], [170.5, 67.8], [160.0, 47.0], | ||
111 | + [154.4, 46.2], [162.0, 55.0], [176.5, 83.0], [160.0, 54.4], [152.0, 45.8], | ||
112 | + [162.1, 53.6], [170.0, 73.2], [160.2, 52.1], [161.3, 67.9], [166.4, 56.6], | ||
113 | + [168.9, 62.3], [163.8, 58.5], [167.6, 54.5], [160.0, 50.2], [161.3, 60.3], | ||
114 | + [167.6, 58.3], [165.1, 56.2], [160.0, 50.2], [170.0, 72.9], [157.5, 59.8], | ||
115 | + [167.6, 61.0], [160.7, 69.1], [163.2, 55.9], [152.4, 46.5], [157.5, 54.3], | ||
116 | + [168.3, 54.8], [180.3, 60.7], [165.5, 60.0], [165.0, 62.0], [164.5, 60.3], | ||
117 | + [156.0, 52.7], [160.0, 74.3], [163.0, 62.0], [165.7, 73.1], [161.0, 80.0], | ||
118 | + [162.0, 54.7], [166.0, 53.2], [174.0, 75.7], [172.7, 61.1], [167.6, 55.7], | ||
119 | + [151.1, 48.7], [164.5, 52.3], [163.5, 50.0], [152.0, 59.3], [169.0, 62.5], | ||
120 | + [164.0, 55.7], [161.2, 54.8], [155.0, 45.9], [170.0, 70.6], [176.2, 67.2], | ||
121 | + [170.0, 69.4], [162.5, 58.2], [170.3, 64.8], [164.1, 71.6], [169.5, 52.8], | ||
122 | + [163.2, 59.8], [154.5, 49.0], [159.8, 50.0], [173.2, 69.2], [170.0, 55.9], | ||
123 | + [161.4, 63.4], [169.0, 58.2], [166.2, 58.6], [159.4, 45.7], [162.5, 52.2], | ||
124 | + [159.0, 48.6], [162.8, 57.8], [159.0, 55.6], [179.8, 66.8], [162.9, 59.4], | ||
125 | + [161.0, 53.6], [151.1, 73.2], [168.2, 53.4], [168.9, 69.0], [173.2, 58.4], | ||
126 | + [171.8, 56.2], [178.0, 70.6], [164.3, 59.8], [163.0, 72.0], [168.5, 65.2], | ||
127 | + [166.8, 56.6], [172.7, 105.2], [163.5, 51.8], [169.4, 63.4], [167.8, 59.0], | ||
128 | + [159.5, 47.6], [167.6, 63.0], [161.2, 55.2], [160.0, 45.0], [163.2, 54.0], | ||
129 | + [162.2, 50.2], [161.3, 60.2], [149.5, 44.8], [157.5, 58.8], [163.2, 56.4], | ||
130 | + [172.7, 62.0], [155.0, 49.2], [156.5, 67.2], [164.0, 53.8], [160.9, 54.4], | ||
131 | + [162.8, 58.0], [167.0, 59.8], [160.0, 54.8], [160.0, 43.2], [168.9, 60.5], | ||
132 | + [158.2, 46.4], [156.0, 64.4], [160.0, 48.8], [167.1, 62.2], [158.0, 55.5], | ||
133 | + [167.6, 57.8], [156.0, 54.6], [162.1, 59.2], [173.4, 52.7], [159.8, 53.2], | ||
134 | + [170.5, 64.5], [159.2, 51.8], [157.5, 56.0], [161.3, 63.6], [162.6, 63.2], | ||
135 | + [160.0, 59.5], [168.9, 56.8], [165.1, 64.1], [162.6, 50.0], [165.1, 72.3], | ||
136 | + [166.4, 55.0], [160.0, 55.9], [152.4, 60.4], [170.2, 69.1], [162.6, 84.5], | ||
137 | + [170.2, 55.9], [158.8, 55.5], [172.7, 69.5], [167.6, 76.4], [162.6, 61.4], | ||
138 | + [167.6, 65.9], [156.2, 58.6], [175.2, 66.8], [172.1, 56.6], [162.6, 58.6], | ||
139 | + [160.0, 55.9], [165.1, 59.1], [182.9, 81.8], [166.4, 70.7], [165.1, 56.8], | ||
140 | + [177.8, 60.0], [165.1, 58.2], [175.3, 72.7], [154.9, 54.1], [158.8, 49.1], | ||
141 | + [172.7, 75.9], [168.9, 55.0], [161.3, 57.3], [167.6, 55.0], [165.1, 65.5], | ||
142 | + [175.3, 65.5], [157.5, 48.6], [163.8, 58.6], [167.6, 63.6], [165.1, 55.2], | ||
143 | + [165.1, 62.7], [168.9, 56.6], [162.6, 53.9], [164.5, 63.2], [176.5, 73.6], | ||
144 | + [168.9, 62.0], [175.3, 63.6], [159.4, 53.2], [160.0, 53.4], [170.2, 55.0], | ||
145 | + [162.6, 70.5], [167.6, 54.5], [162.6, 54.5], [160.7, 55.9], [160.0, 59.0], | ||
146 | + [157.5, 63.6], [162.6, 54.5], [152.4, 47.3], [170.2, 67.7], [165.1, 80.9], | ||
147 | + [172.7, 70.5], [165.1, 60.9], [170.2, 63.6], [170.2, 54.5], [170.2, 59.1], | ||
148 | + [161.3, 70.5], [167.6, 52.7], [167.6, 62.7], [165.1, 86.3], [162.6, 66.4], | ||
149 | + [152.4, 67.3], [168.9, 63.0], [170.2, 73.6], [175.2, 62.3], [175.2, 57.7], | ||
150 | + [160.0, 55.4], [165.1, 104.1], [174.0, 55.5], [170.2, 77.3], [160.0, 80.5], | ||
151 | + [167.6, 64.5], [167.6, 72.3], [167.6, 61.4], [154.9, 58.2], [162.6, 81.8], | ||
152 | + [175.3, 63.6], [171.4, 53.4], [157.5, 54.5], [165.1, 53.6], [160.0, 60.0], | ||
153 | + [174.0, 73.6], [162.6, 61.4], [174.0, 55.5], [162.6, 63.6], [161.3, 60.9], | ||
154 | + [156.2, 60.0], [149.9, 46.8], [169.5, 57.3], [160.0, 64.1], [175.3, 63.6], | ||
155 | + [169.5, 67.3], [160.0, 75.5], [172.7, 68.2], [162.6, 61.4], [157.5, 76.8], | ||
156 | + [176.5, 71.8], [164.4, 55.5], [160.7, 48.6], [174.0, 66.4], [163.8, 67.3] | ||
157 | + ], | ||
158 | + markArea: { | ||
159 | + silent: true, | ||
160 | + itemStyle: { | ||
161 | + color: 'transparent', | ||
162 | + borderWidth: 1, | ||
163 | + borderType: 'dashed' | ||
164 | + }, | ||
165 | + data: [ | ||
166 | + [ | ||
167 | + { | ||
168 | + name: 'Female Data Range', | ||
169 | + xAxis: 'min', | ||
170 | + yAxis: 'min' | ||
171 | + }, | ||
172 | + { | ||
173 | + xAxis: 'max', | ||
174 | + yAxis: 'max' | ||
175 | + } | ||
176 | + ] | ||
177 | + ] | ||
178 | + }, | ||
179 | + markPoint: { | ||
180 | + data: [ | ||
181 | + {type: 'max', name: 'Max'}, | ||
182 | + {type: 'min', name: 'Min'} | ||
183 | + ] | ||
184 | + }, | ||
185 | + markLine: { | ||
186 | + lineStyle: { | ||
187 | + type: 'solid' | ||
188 | + }, | ||
189 | + data: [{type: 'average', name: 'AVG'}, {xAxis: 160}] | ||
190 | + } | ||
191 | + }, | ||
192 | + { | ||
193 | + name: 'Male', | ||
194 | + type: 'scatter', | ||
195 | + emphasis: { | ||
196 | + focus: 'series' | ||
197 | + }, | ||
198 | + // prettier-ignore | ||
199 | + data: [[174.0, 65.6], [175.3, 71.8], [193.5, 80.7], [186.5, 72.6], [187.2, 78.8], | ||
200 | + [181.5, 74.8], [184.0, 86.4], [184.5, 78.4], [175.0, 62.0], [184.0, 81.6], | ||
201 | + [180.0, 76.6], [177.8, 83.6], [192.0, 90.0], [176.0, 74.6], [174.0, 71.0], | ||
202 | + [184.0, 79.6], [192.7, 93.8], [171.5, 70.0], [173.0, 72.4], [176.0, 85.9], | ||
203 | + [176.0, 78.8], [180.5, 77.8], [172.7, 66.2], [176.0, 86.4], [173.5, 81.8], | ||
204 | + [178.0, 89.6], [180.3, 82.8], [180.3, 76.4], [164.5, 63.2], [173.0, 60.9], | ||
205 | + [183.5, 74.8], [175.5, 70.0], [188.0, 72.4], [189.2, 84.1], [172.8, 69.1], | ||
206 | + [170.0, 59.5], [182.0, 67.2], [170.0, 61.3], [177.8, 68.6], [184.2, 80.1], | ||
207 | + [186.7, 87.8], [171.4, 84.7], [172.7, 73.4], [175.3, 72.1], [180.3, 82.6], | ||
208 | + [182.9, 88.7], [188.0, 84.1], [177.2, 94.1], [172.1, 74.9], [167.0, 59.1], | ||
209 | + [169.5, 75.6], [174.0, 86.2], [172.7, 75.3], [182.2, 87.1], [164.1, 55.2], | ||
210 | + [163.0, 57.0], [171.5, 61.4], [184.2, 76.8], [174.0, 86.8], [174.0, 72.2], | ||
211 | + [177.0, 71.6], [186.0, 84.8], [167.0, 68.2], [171.8, 66.1], [182.0, 72.0], | ||
212 | + [167.0, 64.6], [177.8, 74.8], [164.5, 70.0], [192.0, 101.6], [175.5, 63.2], | ||
213 | + [171.2, 79.1], [181.6, 78.9], [167.4, 67.7], [181.1, 66.0], [177.0, 68.2], | ||
214 | + [174.5, 63.9], [177.5, 72.0], [170.5, 56.8], [182.4, 74.5], [197.1, 90.9], | ||
215 | + [180.1, 93.0], [175.5, 80.9], [180.6, 72.7], [184.4, 68.0], [175.5, 70.9], | ||
216 | + [180.6, 72.5], [177.0, 72.5], [177.1, 83.4], [181.6, 75.5], [176.5, 73.0], | ||
217 | + [175.0, 70.2], [174.0, 73.4], [165.1, 70.5], [177.0, 68.9], [192.0, 102.3], | ||
218 | + [176.5, 68.4], [169.4, 65.9], [182.1, 75.7], [179.8, 84.5], [175.3, 87.7], | ||
219 | + [184.9, 86.4], [177.3, 73.2], [167.4, 53.9], [178.1, 72.0], [168.9, 55.5], | ||
220 | + [157.2, 58.4], [180.3, 83.2], [170.2, 72.7], [177.8, 64.1], [172.7, 72.3], | ||
221 | + [165.1, 65.0], [186.7, 86.4], [165.1, 65.0], [174.0, 88.6], [175.3, 84.1], | ||
222 | + [185.4, 66.8], [177.8, 75.5], [180.3, 93.2], [180.3, 82.7], [177.8, 58.0], | ||
223 | + [177.8, 79.5], [177.8, 78.6], [177.8, 71.8], [177.8, 116.4], [163.8, 72.2], | ||
224 | + [188.0, 83.6], [198.1, 85.5], [175.3, 90.9], [166.4, 85.9], [190.5, 89.1], | ||
225 | + [166.4, 75.0], [177.8, 77.7], [179.7, 86.4], [172.7, 90.9], [190.5, 73.6], | ||
226 | + [185.4, 76.4], [168.9, 69.1], [167.6, 84.5], [175.3, 64.5], [170.2, 69.1], | ||
227 | + [190.5, 108.6], [177.8, 86.4], [190.5, 80.9], [177.8, 87.7], [184.2, 94.5], | ||
228 | + [176.5, 80.2], [177.8, 72.0], [180.3, 71.4], [171.4, 72.7], [172.7, 84.1], | ||
229 | + [172.7, 76.8], [177.8, 63.6], [177.8, 80.9], [182.9, 80.9], [170.2, 85.5], | ||
230 | + [167.6, 68.6], [175.3, 67.7], [165.1, 66.4], [185.4, 102.3], [181.6, 70.5], | ||
231 | + [172.7, 95.9], [190.5, 84.1], [179.1, 87.3], [175.3, 71.8], [170.2, 65.9], | ||
232 | + [193.0, 95.9], [171.4, 91.4], [177.8, 81.8], [177.8, 96.8], [167.6, 69.1], | ||
233 | + [167.6, 82.7], [180.3, 75.5], [182.9, 79.5], [176.5, 73.6], [186.7, 91.8], | ||
234 | + [188.0, 84.1], [188.0, 85.9], [177.8, 81.8], [174.0, 82.5], [177.8, 80.5], | ||
235 | + [171.4, 70.0], [185.4, 81.8], [185.4, 84.1], [188.0, 90.5], [188.0, 91.4], | ||
236 | + [182.9, 89.1], [176.5, 85.0], [175.3, 69.1], [175.3, 73.6], [188.0, 80.5], | ||
237 | + [188.0, 82.7], [175.3, 86.4], [170.5, 67.7], [179.1, 92.7], [177.8, 93.6], | ||
238 | + [175.3, 70.9], [182.9, 75.0], [170.8, 93.2], [188.0, 93.2], [180.3, 77.7], | ||
239 | + [177.8, 61.4], [185.4, 94.1], [168.9, 75.0], [185.4, 83.6], [180.3, 85.5], | ||
240 | + [174.0, 73.9], [167.6, 66.8], [182.9, 87.3], [160.0, 72.3], [180.3, 88.6], | ||
241 | + [167.6, 75.5], [186.7, 101.4], [175.3, 91.1], [175.3, 67.3], [175.9, 77.7], | ||
242 | + [175.3, 81.8], [179.1, 75.5], [181.6, 84.5], [177.8, 76.6], [182.9, 85.0], | ||
243 | + [177.8, 102.5], [184.2, 77.3], [179.1, 71.8], [176.5, 87.9], [188.0, 94.3], | ||
244 | + [174.0, 70.9], [167.6, 64.5], [170.2, 77.3], [167.6, 72.3], [188.0, 87.3], | ||
245 | + [174.0, 80.0], [176.5, 82.3], [180.3, 73.6], [167.6, 74.1], [188.0, 85.9], | ||
246 | + [180.3, 73.2], [167.6, 76.3], [183.0, 65.9], [183.0, 90.9], [179.1, 89.1], | ||
247 | + [170.2, 62.3], [177.8, 82.7], [179.1, 79.1], [190.5, 98.2], [177.8, 84.1], | ||
248 | + [180.3, 83.2], [180.3, 83.2] | ||
249 | + ], | ||
250 | + markArea: { | ||
251 | + silent: true, | ||
252 | + itemStyle: { | ||
253 | + color: 'transparent', | ||
254 | + borderWidth: 1, | ||
255 | + borderType: 'dashed' | ||
256 | + }, | ||
257 | + data: [ | ||
258 | + [ | ||
259 | + { | ||
260 | + name: 'Male Data Range', | ||
261 | + xAxis: 'min', | ||
262 | + yAxis: 'min' | ||
263 | + }, | ||
264 | + { | ||
265 | + xAxis: 'max', | ||
266 | + yAxis: 'max' | ||
267 | + } | ||
268 | + ] | ||
269 | + ] | ||
270 | + }, | ||
271 | + markPoint: { | ||
272 | + data: [ | ||
273 | + {type: 'max', name: 'Max'}, | ||
274 | + {type: 'min', name: 'Min'} | ||
275 | + ] | ||
276 | + }, | ||
277 | + markLine: { | ||
278 | + lineStyle: { | ||
279 | + type: 'solid' | ||
280 | + }, | ||
281 | + data: [{type: 'average', name: 'Average'}, {xAxis: 170}] | ||
282 | + } | ||
283 | + } | ||
284 | + ] | ||
285 | + } | ||
286 | + } | ||
287 | + }, | ||
288 | + components: {}, | ||
289 | + props: { | ||
290 | + value: Object, | ||
291 | + ispreview: Boolean | ||
292 | + }, | ||
293 | + computed: { | ||
294 | + styleObj() { | ||
295 | + const allStyle = this.optionsPosition; | ||
296 | + return { | ||
297 | + width: allStyle.width + "px", | ||
298 | + height: allStyle.height + "px" | ||
299 | + }; | ||
300 | + }, | ||
301 | + }, | ||
302 | + watch: { | ||
303 | + value: { | ||
304 | + handler(val) { | ||
305 | + this.options = val; | ||
306 | + this.optionsSetUp = val.setup; | ||
307 | + this.optionsPosition = val.position; | ||
308 | + this.resizeChart(); | ||
309 | + }, | ||
310 | + deep: true | ||
311 | + } | ||
312 | + }, | ||
313 | + mounted() { | ||
314 | + this.options = this.value; | ||
315 | + this.optionsSetUp = this.value.setup; | ||
316 | + this.optionsPosition = this.value.position; | ||
317 | + this.loadData(); | ||
318 | + }, | ||
319 | + methods: { | ||
320 | + resizeChart(){ | ||
321 | + debugger | ||
322 | + if(this.chartInfo){ | ||
323 | + this.chartInfo.resize(); | ||
324 | + } | ||
325 | + }, | ||
326 | + loadData() { | ||
327 | + let that = this; | ||
328 | + setTimeout(function () { | ||
329 | + var myChart = that.$echarts.init(document.getElementById(that.id)); | ||
330 | + // 使用刚指定的配置项和数据显示图表。 | ||
331 | + myChart.setOption(that.scatterWeightOptions); | ||
332 | + that.chartInfo = myChart; | ||
333 | + }, 1000); | ||
334 | + | ||
335 | + } | ||
336 | + } | ||
337 | +} | ||
338 | +</script> | ||
339 | + | ||
340 | +<style scoped> | ||
341 | + | ||
342 | +</style> |
@@ -60,6 +60,10 @@ import monitorTreeShape from "./monitor/treeShape"; | @@ -60,6 +60,10 @@ import monitorTreeShape from "./monitor/treeShape"; | ||
60 | import monitorTablePage from "./monitor/tablePage"; | 60 | import monitorTablePage from "./monitor/tablePage"; |
61 | import monitorButtonExport from "./monitor/buttonExport"; | 61 | import monitorButtonExport from "./monitor/buttonExport"; |
62 | 62 | ||
63 | +import monitorJimuButton from "./monitor/monitorJimuButton"; | ||
64 | +import monitorAjButton from "./monitor/monitorAjButton"; | ||
65 | +import monitorCustomScatterWeight from "./monitor/monitorCustomScatterWeight.vue"; | ||
66 | + | ||
63 | export default { | 67 | export default { |
64 | name: "WidgetTemp", | 68 | name: "WidgetTemp", |
65 | components: { | 69 | components: { |
@@ -110,7 +114,10 @@ export default { | @@ -110,7 +114,10 @@ export default { | ||
110 | monitorSystemInformation, | 114 | monitorSystemInformation, |
111 | monitorTreeShape, | 115 | monitorTreeShape, |
112 | monitorTablePage, | 116 | monitorTablePage, |
113 | - monitorButtonExport | 117 | + monitorButtonExport, |
118 | + monitorJimuButton, | ||
119 | + monitorAjButton, | ||
120 | + monitorCustomScatterWeight | ||
114 | }, | 121 | }, |
115 | model: { | 122 | model: { |
116 | prop: "value", | 123 | prop: "value", |
@@ -71,6 +71,10 @@ import monitorTreeShape from "./monitor/treeShape"; | @@ -71,6 +71,10 @@ import monitorTreeShape from "./monitor/treeShape"; | ||
71 | import monitorTablePage from "./monitor/tablePage"; | 71 | import monitorTablePage from "./monitor/tablePage"; |
72 | import monitorButtonExport from "./monitor/buttonExport"; | 72 | import monitorButtonExport from "./monitor/buttonExport"; |
73 | 73 | ||
74 | +import monitorJimuButton from "./monitor/monitorJimuButton"; | ||
75 | +import monitorAjButton from "./monitor/monitorAjButton"; | ||
76 | +import monitorCustomScatterWeight from "./monitor/monitorCustomScatterWeight"; | ||
77 | + | ||
74 | export default { | 78 | export default { |
75 | name: "Widget", | 79 | name: "Widget", |
76 | components: { | 80 | components: { |
@@ -120,7 +124,10 @@ export default { | @@ -120,7 +124,10 @@ export default { | ||
120 | monitorSystemInformation, | 124 | monitorSystemInformation, |
121 | monitorTreeShape, | 125 | monitorTreeShape, |
122 | monitorTablePage, | 126 | monitorTablePage, |
123 | - monitorButtonExport | 127 | + monitorButtonExport, |
128 | + monitorJimuButton, | ||
129 | + monitorAjButton, | ||
130 | + monitorCustomScatterWeight | ||
124 | }, | 131 | }, |
125 | model: { | 132 | model: { |
126 | prop: "value", | 133 | prop: "value", |
-
Please register or login to post a comment