{"remainingRequest":"D:\\jenkins\\workspace\\examine-fvue\\node_modules\\thread-loader\\dist\\cjs.js!D:\\jenkins\\workspace\\examine-fvue\\node_modules\\babel-loader\\lib\\index.js!D:\\jenkins\\workspace\\examine-fvue\\node_modules\\cache-loader\\dist\\cjs.js??ref--0-0!D:\\jenkins\\workspace\\examine-fvue\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\jenkins\\workspace\\examine-fvue\\node_modules\\@jiaminghi\\data-view\\lib\\components\\waterLevelPond\\src\\main.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\jenkins\\workspace\\examine-fvue\\node_modules\\@jiaminghi\\data-view\\lib\\components\\waterLevelPond\\src\\main.vue","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\examine-fvue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\examine-fvue\\node_modules\\thread-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\examine-fvue\\node_modules\\babel-loader\\lib\\index.js","mtime":315532800000},{"path":"D:\\jenkins\\workspace\\examine-fvue\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\jenkins\\workspace\\examine-fvue\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["import \"core-js/modules/web.dom.iterable\";\nimport \"regenerator-runtime/runtime\";\nimport _asyncToGenerator from \"D:/jenkins/workspace/examine-fvue/node_modules/@babel/runtime/helpers/esm/asyncToGenerator\";\nimport \"core-js/modules/es6.array.fill\";\nimport _slicedToArray from \"D:/jenkins/workspace/examine-fvue/node_modules/@babel/runtime/helpers/esm/slicedToArray\";\nimport \"core-js/modules/es6.regexp.replace\";\nimport _toConsumableArray from \"D:/jenkins/workspace/examine-fvue/node_modules/@babel/runtime/helpers/esm/toConsumableArray\";\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\n//\nimport { uuid } from \"../../../util/index\";\nimport { deepMerge } from '@jiaminghi/charts/lib/util/index';\nimport { deepClone } from '@jiaminghi/c-render/lib/plugin/util';\nimport CRender from '@jiaminghi/c-render';\nexport default {\n  name: 'DvWaterLevelPond',\n  props: {\n    config: Object,\n    default: function _default() {\n      return {};\n    }\n  },\n  data: function data() {\n    var id = uuid();\n    return {\n      gradientId: \"water-level-pond-\".concat(id),\n      defaultConfig: {\n        /**\n         * @description Data\n         * @type {Array<Number>}\n         * @default data = []\n         * @example data = [60, 40]\n         */\n        data: [],\n\n        /**\n         * @description Shape of wanter level pond\n         * @type {String}\n         * @default shape = 'rect'\n         * @example shape = 'rect' | 'roundRect' | 'round'\n         */\n        shape: 'rect',\n\n        /**\n         * @description Water wave number\n         * @type {Number}\n         * @default waveNum = 3\n         */\n        waveNum: 3,\n\n        /**\n         * @description Water wave height (px)\n         * @type {Number}\n         * @default waveHeight = 40\n         */\n        waveHeight: 40,\n\n        /**\n         * @description Wave opacity\n         * @type {Number}\n         * @default waveOpacity = 0.4\n         */\n        waveOpacity: 0.4,\n\n        /**\n         * @description Colors (hex|rgb|rgba|color keywords)\n         * @type {Array<String>}\n         * @default colors = ['#00BAFF', '#3DE7C9']\n         * @example colors = ['#000', 'rgb(0, 0, 0)', 'rgba(0, 0, 0, 1)', 'red']\n         */\n        colors: ['#3DE7C9', '#00BAFF'],\n\n        /**\n         * @description Formatter\n         * @type {String}\n         * @default formatter = '{value}%'\n         */\n        formatter: '{value}%'\n      },\n      mergedConfig: {},\n      renderer: null,\n      svgBorderGradient: [],\n      details: '',\n      waves: [],\n      animation: false\n    };\n  },\n  computed: {\n    radius: function radius() {\n      var shape = this.mergedConfig.shape;\n      if (shape === 'round') return '50%';\n      if (shape === 'rect') return '0';\n      if (shape === 'roundRect') return '10px';\n      return '0';\n    },\n    shape: function shape() {\n      var shape = this.mergedConfig.shape;\n      if (!shape) return 'rect';\n      return shape;\n    }\n  },\n  watch: {\n    config: function config() {\n      var calcData = this.calcData,\n          renderer = this.renderer;\n      renderer.delAllGraph();\n      this.waves = [];\n      setTimeout(calcData, 0);\n    }\n  },\n  methods: {\n    init: function init() {\n      var initRender = this.initRender,\n          config = this.config,\n          calcData = this.calcData;\n      initRender();\n      if (!config) return;\n      calcData();\n    },\n    initRender: function initRender() {\n      var $refs = this.$refs;\n      this.renderer = new CRender($refs['water-pond-level']);\n    },\n    calcData: function calcData() {\n      var mergeConfig = this.mergeConfig,\n          calcSvgBorderGradient = this.calcSvgBorderGradient,\n          calcDetails = this.calcDetails;\n      mergeConfig();\n      calcSvgBorderGradient();\n      calcDetails();\n      var addWave = this.addWave,\n          animationWave = this.animationWave;\n      addWave();\n      animationWave();\n    },\n    mergeConfig: function mergeConfig() {\n      var config = this.config,\n          defaultConfig = this.defaultConfig;\n      this.mergedConfig = deepMerge(deepClone(defaultConfig, true), config);\n    },\n    calcSvgBorderGradient: function calcSvgBorderGradient() {\n      var colors = this.mergedConfig.colors;\n      var colorNum = colors.length;\n      var colorOffsetGap = 100 / (colorNum - 1);\n      this.svgBorderGradient = colors.map(function (c, i) {\n        return [colorOffsetGap * i, c];\n      });\n    },\n    calcDetails: function calcDetails() {\n      var _this$mergedConfig = this.mergedConfig,\n          data = _this$mergedConfig.data,\n          formatter = _this$mergedConfig.formatter;\n\n      if (!data.length) {\n        this.details = '';\n        return;\n      }\n\n      var maxValue = Math.max.apply(Math, _toConsumableArray(data));\n      this.details = formatter.replace('{value}', maxValue);\n    },\n    addWave: function addWave() {\n      var renderer = this.renderer,\n          getWaveShapes = this.getWaveShapes,\n          getWaveStyle = this.getWaveStyle,\n          drawed = this.drawed;\n      var shapes = getWaveShapes();\n      var style = getWaveStyle();\n      this.waves = shapes.map(function (shape) {\n        return renderer.add({\n          name: 'smoothline',\n          animationFrame: 300,\n          shape: shape,\n          style: style,\n          drawed: drawed\n        });\n      });\n    },\n    getWaveShapes: function getWaveShapes() {\n      var mergedConfig = this.mergedConfig,\n          renderer = this.renderer,\n          mergeOffset = this.mergeOffset;\n      var waveNum = mergedConfig.waveNum,\n          waveHeight = mergedConfig.waveHeight,\n          data = mergedConfig.data;\n\n      var _renderer$area = _slicedToArray(renderer.area, 2),\n          w = _renderer$area[0],\n          h = _renderer$area[1];\n\n      var pointsNum = waveNum * 4 + 4;\n      var pointXGap = w / waveNum / 2;\n      return data.map(function (v) {\n        var points = new Array(pointsNum).fill(0).map(function (foo, j) {\n          var x = w - pointXGap * j;\n          var startY = (1 - v / 100) * h;\n          var y = j % 2 === 0 ? startY : startY - waveHeight;\n          return [x, y];\n        });\n        points = points.map(function (p) {\n          return mergeOffset(p, [pointXGap * 2, 0]);\n        });\n        return {\n          points: points\n        };\n      });\n    },\n    mergeOffset: function mergeOffset(_ref, _ref2) {\n      var _ref3 = _slicedToArray(_ref, 2),\n          x = _ref3[0],\n          y = _ref3[1];\n\n      var _ref4 = _slicedToArray(_ref2, 2),\n          ox = _ref4[0],\n          oy = _ref4[1];\n\n      return [x + ox, y + oy];\n    },\n    getWaveStyle: function getWaveStyle() {\n      var renderer = this.renderer,\n          mergedConfig = this.mergedConfig;\n      var h = renderer.area[1];\n      return {\n        gradientColor: mergedConfig.colors,\n        gradientType: 'linear',\n        gradientParams: [0, 0, 0, h],\n        gradientWith: 'fill',\n        opacity: mergedConfig.waveOpacity,\n        translate: [0, 0]\n      };\n    },\n    drawed: function drawed(_ref5, _ref6) {\n      var points = _ref5.shape.points;\n      var ctx = _ref6.ctx,\n          area = _ref6.area;\n      var firstPoint = points[0];\n      var lastPoint = points.slice(-1)[0];\n      var h = area[1];\n      ctx.lineTo(lastPoint[0], h);\n      ctx.lineTo(firstPoint[0], h);\n      ctx.closePath();\n      ctx.fill();\n    },\n    animationWave: function () {\n      var _animationWave = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {\n        var repeat,\n            waves,\n            renderer,\n            animation,\n            w,\n            _args = arguments;\n        return regeneratorRuntime.wrap(function _callee$(_context) {\n          while (1) {\n            switch (_context.prev = _context.next) {\n              case 0:\n                repeat = _args.length > 0 && _args[0] !== undefined ? _args[0] : 1;\n                waves = this.waves, renderer = this.renderer, animation = this.animation;\n\n                if (!animation) {\n                  _context.next = 4;\n                  break;\n                }\n\n                return _context.abrupt(\"return\");\n\n              case 4:\n                this.animation = true;\n                w = renderer.area[0];\n                waves.forEach(function (graph) {\n                  graph.attr('style', {\n                    translate: [0, 0]\n                  });\n                  graph.animation('style', {\n                    translate: [w, 0]\n                  }, true);\n                });\n                _context.next = 9;\n                return renderer.launchAnimation();\n\n              case 9:\n                this.animation = false;\n\n                if (renderer.graphs.length) {\n                  _context.next = 12;\n                  break;\n                }\n\n                return _context.abrupt(\"return\");\n\n              case 12:\n                this.animationWave(repeat + 1);\n\n              case 13:\n              case \"end\":\n                return _context.stop();\n            }\n          }\n        }, _callee, this);\n      }));\n\n      function animationWave() {\n        return _animationWave.apply(this, arguments);\n      }\n\n      return animationWave;\n    }()\n  },\n  mounted: function mounted() {\n    var init = this.init;\n    init();\n  },\n  beforeDestroy: function beforeDestroy() {\n    var renderer = this.renderer;\n    renderer.delAllGraph();\n    this.waves = [];\n  }\n};",null]}