{"remainingRequest":"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\\digitalFlop\\src\\main.vue?vue&type=script&lang=js&","dependencies":[{"path":"D:\\jenkins\\workspace\\examine-fvue\\node_modules\\@jiaminghi\\data-view\\lib\\components\\digitalFlop\\src\\main.vue","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":["//\n//\n//\n//\n//\n//\n\nimport CRender from '@jiaminghi/c-render'\n\nimport '@jiaminghi/charts/lib/extend/index'\n\nimport { deepMerge } from '@jiaminghi/charts/lib/util/index'\n\nimport { deepClone } from '@jiaminghi/c-render/lib/plugin/util'\n\nexport default {\n  name: 'DvDigitalFlop',\n  props: {\n    config: {\n      type: Object,\n      default: () => ({})\n    }\n  },\n  data () {\n    return {\n      renderer: null,\n\n      defaultConfig: {\n        /**\n         * @description Number for digital flop\n         * @type {Array<Number>}\n         * @default number = []\n         * @example number = [10]\n         */\n        number: [],\n        /**\n         * @description Content formatter\n         * @type {String}\n         * @default content = ''\n         * @example content = '{nt}个'\n         */\n        content: '',\n        /**\n         * @description Number toFixed\n         * @type {Number}\n         * @default toFixed = 0\n         */\n        toFixed: 0,\n        /**\n         * @description Text align\n         * @type {String}\n         * @default textAlign = 'center'\n         * @example textAlign = 'center' | 'left' | 'right'\n         */\n        textAlign: 'center',\n        /**\n         * @description rowGap\n         * @type {Number}\n         @default rowGap = 0\n         */\n        rowGap: 0,\n        /**\n         * @description Text style configuration\n         * @type {Object} {CRender Class Style}\n         */\n        style: {\n          fontSize: 30,\n          fill: '#3de7c9'\n        },\n        /**\n         * @description Number formatter\n         * @type {Null|Function}\n         */\n        formatter: undefined,\n        /**\n         * @description CRender animationCurve\n         * @type {String}\n         * @default animationCurve = 'easeOutCubic'\n         */\n        animationCurve: 'easeOutCubic',\n        /**\n         * @description CRender animationFrame\n         * @type {String}\n         * @default animationFrame = 50\n         */\n        animationFrame: 50\n      },\n\n      mergedConfig: null,\n\n      graph: null\n    }\n  },\n  watch: {\n    config () {\n      const { update } = this\n\n      update()\n    }\n  },\n  methods: {\n    init () {\n      const { initRender, mergeConfig, initGraph } = this\n\n      initRender()\n\n      mergeConfig()\n\n      initGraph()\n    },\n    initRender () {\n      const { $refs } = this\n\n      this.renderer = new CRender($refs['digital-flop'])\n    },\n    mergeConfig () {\n      const { defaultConfig, config } = this\n\n      this.mergedConfig = deepMerge(deepClone(defaultConfig, true), config || {})\n    },\n    initGraph () {\n      const { getShape, getStyle, renderer, mergedConfig } = this\n\n      const { animationCurve, animationFrame } = mergedConfig\n\n      const shape = getShape()\n      const style = getStyle()\n\n      this.graph = renderer.add({\n        name: 'numberText',\n        animationCurve,\n        animationFrame,\n        shape,\n        style\n      })\n    },\n    getShape () {\n      const { number, content, toFixed, textAlign, rowGap, formatter } = this.mergedConfig\n\n      const [w, h] = this.renderer.area\n\n      const position = [w / 2, h / 2]\n\n      if (textAlign === 'left') position[0] = 0\n      if (textAlign === 'right') position[0] = w\n\n      return {\n        number,\n        content,\n        toFixed,\n        position,\n        rowGap,\n        formatter\n      }\n    },\n    getStyle () {\n      const { style, textAlign } = this.mergedConfig\n\n      return deepMerge(style, {\n        textAlign,\n        textBaseline: 'middle'\n      })\n    },\n    update () {\n      const { mergeConfig, mergeShape, getShape, getStyle, graph, mergedConfig } = this\n\n      graph.animationEnd()\n\n      mergeConfig()\n\n      if (!graph) return\n\n      const { animationCurve, animationFrame } = mergedConfig\n\n      const shape = getShape()\n      const style = getStyle()\n\n      mergeShape(graph, shape)\n\n      graph.animationCurve = animationCurve\n      graph.animationFrame = animationFrame\n\n      graph.animation('style', style, true)\n      graph.animation('shape', shape)\n    },\n    mergeShape (graph, shape) {\n      const cacheNum = graph.shape.number.length\n      const shapeNum = shape.number.length\n\n      if (cacheNum !== shapeNum) graph.shape.number = shape.number\n    }\n  },\n  mounted () {\n    const { init } = this\n\n    init()\n  }\n}\n",null]}