Commit 819b08d0566ab443c29337162d3d3bc6f5406049

Authored by ww
1 parent 1e444fb1

fix: chart component xAxis sort

... ... @@ -6890,14 +6890,14 @@ DataFormatPanel.prototype.addDataFont = function (container) {
6890 6890 /**
6891 6891 * @description 下拉选项挂载
6892 6892 */
6893   - function createSelectOptionMountEvent() {
  6893 + function createSelectOptionMountEvent() {
6894 6894 $(`#${enumActionEl.TABLE_BODY_EL}`).on('click', '.layui-form-select', event => {
6895 6895 const width = event.currentTarget.offsetWidth || 200
6896 6896 const height = event.currentTarget.offsetHeight || 38
6897 6897 const offset = $(event.currentTarget).offset()
6898 6898 $(event.currentTarget).find('dl').css({
6899 6899 position: 'fixed',
6900   - 'min-width': width + 'px',
  6900 + 'min-width': width + 'px',
6901 6901 top: offset.top + height + 'px',
6902 6902 left: offset.left + 'px'
6903 6903 })
... ... @@ -12487,7 +12487,7 @@ class HandleDataSource {
12487 12487 * @description 普通数据源绑定列表
12488 12488 */
12489 12489 get commonDataSourceBindList() {
12490   - return this.DispatchInstance.contentData?.dataSources?.filter(item => !item.additional) || []
  12490 + return this.DispatchInstance.contentData?.dataSources?.filter(item => !item.additional && item.attr) || []
12491 12491 }
12492 12492
12493 12493 /**
... ... @@ -12553,13 +12553,17 @@ class HandleDataSource {
12553 12553 template[STARTTs] = Date.now() - scope
12554 12554 template[ENDTs] = Date.now()
12555 12555 historyList.push(template)
12556   - this.subscribeEvent(cmdId, this.updateHistoryDataSource.bind(this))
  12556 + this.subscribeEvent(cmdId, (message) => {
  12557 + this.updateHistoryDataSource(message, agg)
  12558 + })
12557 12559 }
12558 12560 else if (dataType === REAL) {
12559 12561 template[STARTTs] = Date.now() - scope
12560   - template['timeWindow'] = interval
  12562 + // template['timeWindow'] = interval
12561 12563 realList.push(template)
12562   - this.subscribeEvent(cmdId, this.updateRealTimeDataSource.bind(this))
  12564 + this.subscribeEvent(cmdId, (message) => {
  12565 + this.updateRealTimeDataSource(message, agg)
  12566 + })
12563 12567 }
12564 12568 this.dataSourceNodeMapping.set(nodeId, item)
12565 12569 }
... ... @@ -12595,9 +12599,9 @@ class HandleDataSource {
12595 12599 /**
12596 12600 * @description 更新实时数据
12597 12601 * @param {} message
  12602 + * @param {} agg 聚合方式
12598 12603 */
12599   - updateRealTimeDataSource(message) {
12600   - console.log(message)
  12604 + updateRealTimeDataSource(message, agg) {
12601 12605 const { data = {}, subscriptionId } = message
12602 12606 const node = this.getNodeByCmdId(subscriptionId)
12603 12607 if (!node) return
... ... @@ -12608,11 +12612,12 @@ class HandleDataSource {
12608 12612 const instance = chartInstanceMap.get(chartInstanceId)
12609 12613 const { attr = [[]] } = this.getBindData(subscriptionId)
12610 12614 const realDataList = data[attr] || []
  12615 + const showNumberOf = 4
  12616 + const action = agg === 'NONE' ? 'unshift' : 'push'
  12617 +
  12618 + // const chartWidth = node.getAttribute('width')
  12619 + // const chartHeight = node.getAttribute('height')
12611 12620
12612   - const chartWidth = node.getAttribute('width')
12613   - const chartHeight = node.getAttribute('height')
12614   - console.log(chartHeight)
12615   - console.log(chartWidth)
12616 12621 // chart insstance 是否已经接受过一次消息推送
12617 12622 const isActive = instance.isActive
12618 12623 if (!isActive) {
... ... @@ -12621,24 +12626,10 @@ class HandleDataSource {
12621 12626 const seriesValue = []
12622 12627 const chartOption = {
12623 12628 title: {
12624   - // text: '{a|}',
12625   - subtext: '暂无数据',
  12629 + subtext: realDataList.length ? '' :'暂无数据',
12626 12630 x: 'center',
12627 12631 y: 'center',
12628 12632 itemGap: -20,
12629   - // textStyle: {
12630   - // rich: {
12631   - // a: {
12632   - // color: '#000',
12633   - // fontSize: '16',
12634   - // height: 160,
12635   - // width: 180,
12636   - // backgroundColor: {
12637   - // image: '/thingskit-drawio/images/thingskit/empty.svg'
12638   - // }
12639   - // }
12640   - // }
12641   - // },
12642 12633 subtextStyle: {
12643 12634 fontSize: 16
12644 12635 }
... ... @@ -12682,20 +12673,25 @@ class HandleDataSource {
12682 12673 dataZoom: [
12683 12674 {
12684 12675 xAxisIndex: 0,
12685   - show: realDataList.length ? true : false,
  12676 + show: true,
12686 12677 type: 'slider',
12687 12678 startValue: 0,
12688   - endValue: 4
  12679 + endValue: showNumberOf
12689 12680 }
12690 12681 ]
12691 12682 }
12692 12683
12693   - for (let i = realDataList.length - 1; i >= 0; i--) {
12694   - const [timespan, value] = realDataList[i]
12695   - xAxisData.push(new Date(Number(timespan)).toLocaleTimeString())
12696   - seriesValue.push(Number(value))
12697   - }
12698   - console.log(chartOption)
  12684 + // for (let i = realDataList.length - 1; i >= 0; i--) {
  12685 + // const [timespan, value] = realDataList[i]
  12686 + // xAxisData.push(new Date(Number(timespan)).toLocaleTimeString())
  12687 + // seriesValue.push(Number(value))
  12688 + // }
  12689 + realDataList.forEach(item => {
  12690 + const [timespan, value] = item
  12691 + xAxisData[action](new Date(Number(timespan)).toLocaleTimeString())
  12692 + seriesValue[action](Number(value))
  12693 + })
  12694 +
12699 12695 instance.setOption(chartOption)
12700 12696
12701 12697 } else {
... ... @@ -12712,7 +12708,7 @@ class HandleDataSource {
12712 12708 }
12713 12709
12714 12710 if (Number(oldOptions.dataZoom[0].endValue) === seriesValue.length - 1) {
12715   - oldOptions.dataZoom[0].endValue = 4
  12711 + oldOptions.dataZoom[0].endValue = showNumberOf
12716 12712 oldOptions.dataZoom[0].startValue = 0
12717 12713 } else {
12718 12714 oldOptions.dataZoom[0].endValue = oldOptions.dataZoom[0].endValue + 1
... ... @@ -12721,6 +12717,9 @@ class HandleDataSource {
12721 12717
12722 12718 if (!instance) clearInterval(interval)
12723 12719 instance && instance.setOption({
  12720 + title: {
  12721 + subtext: ''
  12722 + },
12724 12723 xAxis: {
12725 12724 data: xAxisData
12726 12725 },
... ... @@ -12731,16 +12730,16 @@ class HandleDataSource {
12731 12730 ],
12732 12731 dataZoom: [
12733 12732 {
12734   - startValue: seriesValue.length > 5
  12733 + startValue: seriesValue.length - 1 > showNumberOf
12735 12734 ? oldStartValue === seriesValue.length - 1
12736 12735 ? 0
12737 12736 : oldStartValue + 1
12738 12737 : 0,
12739   - endValue: seriesValue.length > 5
  12738 + endValue: seriesValue.length - 1 > showNumberOf
12740 12739 ? oldEndValue === seriesValue.length - 1
12741   - ? 4
  12740 + ? showNumberOf
12742 12741 : oldEndValue + 1
12743   - : 4
  12742 + : showNumberOf
12744 12743 }
12745 12744 ]
12746 12745 })
... ... @@ -12750,7 +12749,7 @@ class HandleDataSource {
12750 12749 /**
12751 12750 * @description 更新历史数据
12752 12751 */
12753   - updateHistoryDataSource(message) {
  12752 + updateHistoryDataSource(message, agg) {
12754 12753 const { data = {}, subscriptionId } = message
12755 12754 const node = this.getNodeByCmdId(subscriptionId)
12756 12755 if (!node) return
... ... @@ -12761,10 +12760,22 @@ class HandleDataSource {
12761 12760 const instance = chartInstanceMap.get(chartInstanceId)
12762 12761 const { attr = [[]] } = this.getBindData(subscriptionId)
12763 12762 const historyDataList = data[attr] || []
  12763 + const showNumberOf = 4
  12764 + const action = agg === 'NONE' ? 'unshift' : 'push'
  12765 +
12764 12766
12765 12767 const xAxisData = []
12766 12768 const seriesValue = []
12767 12769 const chartOption = {
  12770 + title: {
  12771 + subtext: historyDataList.length ? '' :'暂无数据',
  12772 + x: 'center',
  12773 + y: 'center',
  12774 + itemGap: -20,
  12775 + subtextStyle: {
  12776 + fontSize: 16
  12777 + }
  12778 + },
12768 12779 tooltip: {
12769 12780 trigger: 'axis',
12770 12781 axisPointer: {
... ... @@ -12808,16 +12819,16 @@ class HandleDataSource {
12808 12819 show: false,
12809 12820 type: 'slider',
12810 12821 startValue: 0,
12811   - endValue: 4
  12822 + endValue: showNumberOf
12812 12823 }
12813 12824 ]
12814 12825 }
12815 12826
12816   - for (let i = historyDataList.length - 1; i >= 0; i--) {
12817   - const [timespan, value] = historyDataList[i]
12818   - xAxisData.push(new Date(Number(timespan)).toLocaleTimeString())
12819   - seriesValue.push(Number(value))
12820   - }
  12827 + historyDataList.forEach(item => {
  12828 + const [timespan, value] = item
  12829 + xAxisData[action](new Date(Number(timespan)).toLocaleTimeString())
  12830 + seriesValue[action](Number(value))
  12831 + })
12821 12832
12822 12833 let interval
12823 12834 // TODO 清除定时器
... ... @@ -12825,7 +12836,7 @@ class HandleDataSource {
12825 12836 if (seriesValue.length <= 5) return
12826 12837 interval = setInterval(() => {
12827 12838 if (Number(chartOption.dataZoom[0].endValue) === seriesValue.length - 1) {
12828   - chartOption.dataZoom[0].endValue = 4
  12839 + chartOption.dataZoom[0].endValue = showNumberOf
12829 12840 chartOption.dataZoom[0].startValue = 0
12830 12841 } else {
12831 12842 chartOption.dataZoom[0].endValue = chartOption.dataZoom[0].endValue + 1
... ... @@ -13309,6 +13320,7 @@ class HandleDynamicEffect {
13309 13320 this.delUpdateFn(key)
13310 13321 return
13311 13322 }
  13323 + console.log(this.actNodeMapping)
13312 13324 this.insertContinueUpdateFn(node, updateFn, key)
13313 13325 }
13314 13326
... ... @@ -13332,6 +13344,10 @@ class HandleDynamicEffect {
13332 13344 }
13333 13345 const updateFn = () => {
13334 13346 node.setVisible(isShow)
  13347 + node.setAttribute('display', isShow)
  13348 + console.log('isShow', isShow)
  13349 + console.log(node.style)
  13350 + console.log(node)
13335 13351 }
13336 13352 this.insertOnceUpdateFn(node, updateFn)
13337 13353 }
... ...