actions.js 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. // 组件配置转化
  2. import _ from 'lodash'
  3. import { setModules } from 'packages/js/utils/configImport'
  4. import { getScreenInfo, getDataSetDetails, getDataByDataSetId } from '../api/bigScreenApi'
  5. import { stringToFunction } from '../utils/evalFunctions'
  6. import { EventBus } from '../utils/eventBus'
  7. import plotList from 'packages/G2Plots/plotList'
  8. export default {
  9. // 初始化页面数据
  10. initLayout ({ commit, dispatch }, code) {
  11. return new Promise(resolve => {
  12. getScreenInfo(code).then(data => {
  13. const pageInfo = handleResData(data)
  14. // 改变页面数据
  15. commit('changePageInfo', pageInfo)
  16. commit('changeZIndex', pageInfo.chartList)
  17. // 初始化缓存数据集数据
  18. // eslint-disable-next-line no-unused-expressions
  19. pageInfo.pageConfig.cacheDataSets?.map((cacheDataSet) => {
  20. dispatch('getCacheDataSetData', { dataSetId: cacheDataSet.dataSetId })
  21. dispatch('getCacheDataFields', { dataSetId: cacheDataSet.dataSetId })
  22. })
  23. // 页面加载成功
  24. resolve(true)
  25. commit('saveTimeLine', '初始化')
  26. })
  27. })
  28. },
  29. // 初始化缓存数据集数据
  30. getCacheDataSetData ({ commit, dispatch }, { dataSetId }) {
  31. getDataByDataSetId(dataSetId).then(res => {
  32. const data = res.data
  33. commit('changeCacheDataSetData', { dataSetId, data })
  34. // 推送数据到各个组件
  35. emitDataToChart(dataSetId, data)
  36. })
  37. },
  38. // 初始化缓存数据集字段
  39. getCacheDataFields ({ commit, dispatch }, { dataSetId }) {
  40. getDataSetDetails(dataSetId).then(data => {
  41. console.log(2, data)
  42. commit('changeCacheDataFields', { dataSetId, data })
  43. commit('changeCacheDataParams', { dataSetId, data })
  44. })
  45. }
  46. }
  47. // 处理后端返回的数据
  48. export function handleResData (data) {
  49. let pageInfo = {}
  50. if (data.pageConfig) {
  51. pageInfo = data
  52. } else {
  53. pageInfo = {
  54. ...data,
  55. pageConfig: {
  56. w: 1920,
  57. h: 1080,
  58. bgColor: '#151a26', // 背景色
  59. bg: '', // 背景图
  60. customTheme: 'auto',
  61. opacity: 100
  62. }
  63. }
  64. }
  65. // 如果pageConfig中的cacheDataSets为null,赋值[]
  66. pageInfo.pageConfig.cacheDataSets = pageInfo.pageConfig.cacheDataSets || []
  67. pageInfo.chartList.forEach((chart) => {
  68. if (!['customComponent', 'remoteComponent'].includes(chart.type)) {
  69. chart.option = _.cloneDeep(setModules[chart.type])
  70. } else {
  71. chart.option = stringToFunction(chart.option)
  72. // 如果是自定义组件,且没配数据集,就给前端的模拟数据
  73. if (!chart?.dataSource?.businessKey) {
  74. chart.option.data = plotList?.find(plot => plot.name === chart.name)?.option?.data
  75. }
  76. }
  77. chart.key = chart.code
  78. })
  79. return pageInfo
  80. }
  81. // 推送数据到各个组件
  82. function emitDataToChart (dataSetId, data) {
  83. if (data && data.length) {
  84. EventBus.$emit('cacheDataInit',
  85. {
  86. success: true,
  87. data: data
  88. },
  89. dataSetId
  90. )
  91. }
  92. }